.weekly-progress{touch-action:pan-y}
.activity-heading,.activity-navigation,.activity-month-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.activity-title{border:0;background:none;text-align:left;padding:0;display:grid;gap:7px;color:#141922}
.activity-title strong{font-size:25px;letter-spacing:-.5px}.activity-title span{font-size:16px;color:#7b8390}
.activity-calendar-button{border:0;background:none;color:#687283;padding:10px;min-width:44px;min-height:44px}.activity-calendar-button svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.activity-navigation{margin:20px 0 16px;color:#858d99;font-size:14px}.activity-arrow{border:0;background:none;color:#087bfa;font-size:36px;line-height:1;min-width:44px;min-height:44px;padding:0;border-radius:10px}
.activity-arrow:disabled{opacity:.25;cursor:default}.activity-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.activity-day{border:0;background:none;padding:0;min-width:0;display:flex;align-items:center;flex-direction:column;gap:10px;color:#7c8491;font-size:14px}.activity-day.today>span:first-child{color:#087bfa;font-weight:700}.activity-day b{color:#181d26;font-size:20px;font-weight:600}.activity-day:disabled{opacity:.4;cursor:default}
.activity-ring{width:100%;max-width:58px;aspect-ratio:1;position:relative;display:grid;place-items:center}.activity-ring svg{width:100%;height:100%;position:absolute;inset:0;fill:none;stroke-width:3.6}.activity-track{stroke:#edf0f5}.activity-fill{stroke:#087bfa;stroke-linecap:round}.activity-ring>span{position:relative;z-index:1;color:#252b35}.activity-ring.complete>span{background:#087bfa;border-radius:50%;color:white;width:56%;aspect-ratio:1;display:grid;place-items:center}.activity-day.today .activity-track{stroke:#c9e2ff}
.activity-summary{text-align:center;margin-top:20px;padding-top:16px;border-top:1px solid #edf0f5;color:#636e7e;font-size:14px;line-height:1.6}.activity-summary small{display:block;font-size:11px;color:#959ca5}.activity-back{border:0;background:#edf6ff;color:#087bfa;padding:12px;border-radius:12px;margin-top:16px;width:100%;font-weight:600}
.activity-backdrop.modal-backdrop{align-items:flex-end;padding:16px}.modal.activity-sheet{max-width:500px;border-radius:28px;padding:36px 22px 28px;max-height:calc(100dvh - 32px);position:relative}.activity-sheet:before{content:'';position:absolute;top:12px;left:calc(50% - 23px);width:46px;height:5px;border-radius:5px;background:#cbd0d8}.activity-sheet>.page-header{margin:0;height:0}.activity-sheet>.page-header h2{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.activity-sheet>.page-header .icon-button{position:absolute;top:40px;right:12px;z-index:2;width:44px;height:44px;background:none;border:0;font-size:30px;color:#566170}.activity-month-heading{padding-right:35px;margin-bottom:18px}.activity-month-heading h2{font-size:23px;text-transform:capitalize;text-align:center;letter-spacing:-.5px}.activity-month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px 5px;touch-action:pan-y}.activity-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-column:1/-1;text-align:center;padding:10px 0;color:#7c8594;font-size:14px}
.activity-date{border:0;background:none;min-height:40px;padding:0;display:grid;place-items:center;font-size:17px;border-radius:50%;color:#232b35}.activity-date .activity-ring{max-width:49px}.activity-date .activity-ring svg{stroke-width:1.7}.activity-date.selected .activity-ring{background:#087bfa;border-radius:50%;box-shadow:0 2px 8px #087bfa22}.activity-date.selected .activity-ring>span{color:white;background:none}.activity-date.selected .activity-track{stroke:#087bfa}.activity-date .complete>span{background:none;color:inherit;width:auto}.activity-date:disabled{opacity:.35;cursor:default}.activity-date[aria-current=date]:not(.selected) .activity-ring>span{color:#087bfa;font-weight:700}.activity-detail{border-top:1px solid #e7eaf0;margin-top:22px;padding-top:20px}.activity-detail h3{font-size:21px;text-transform:capitalize;margin:0 0 8px}.activity-detail>div:not(.activity-goal-bar){display:flex;flex-wrap:wrap;gap:6px 16px;justify-content:space-between;color:#858d99;font-size:14px;line-height:1.6}.activity-detail strong{color:#3c495b;font-weight:500}.activity-goal-bar{height:12px;background:#ecedf3;overflow:hidden;border-radius:10px;margin-top:16px}.activity-goal-bar>span{height:100%;display:block;background:linear-gradient(90deg,#087bfa,#30a1ff);border-radius:inherit}
.activity-sheet button:focus-visible,.weekly-progress button:focus-visible{outline:3px solid #80b9fa;outline-offset:2px}
@media(max-width:500px){.activity-title strong{font-size:22px}.activity-title span{font-size:14px}.activity-day{font-size:12px;gap:8px}.activity-day b{font-size:17px}.activity-navigation{font-size:12px;margin:12px 0}.activity-summary{font-size:12px}.activity-backdrop.modal-backdrop{padding:0}.modal.activity-sheet{border-radius:28px 28px 0 0;max-height:calc(100dvh - 12px);padding:36px 16px max(24px,env(safe-area-inset-bottom))}.activity-month-heading h2{font-size:21px}.activity-month-grid{gap:8px 3px}.activity-detail h3{font-size:20px}}
@media(max-width:350px){.activity-month-heading h2{font-size:18px}.activity-detail>div:not(.activity-goal-bar){font-size:12px}.activity-date{font-size:15px}.activity-day{font-size:11px}.activity-navigation{gap:0}}
@media(prefers-reduced-motion:no-preference){.activity-sheet{animation:activity-appear .2s ease-out}@keyframes activity-appear{from{transform:translateY(20px);opacity:.7}to{transform:translateY(0);opacity:1}}}
.activity-month-heading h2,.activity-detail h3{text-transform:none}.activity-month-heading h2:first-letter,.activity-detail h3:first-letter{text-transform:uppercase}
@media(max-width:350px){.activity-month-heading{gap:3px;padding-right:30px}.activity-month-heading .activity-arrow{min-width:32px}.activity-month-heading h2{font-size:17px;white-space:nowrap}.activity-sheet>.page-header .icon-button{right:8px;width:36px}}
@media(max-height:650px){.activity-month-heading{margin-bottom:6px}.activity-weekdays{padding:4px 0}.activity-month-grid{gap:4px 3px}.activity-date .activity-ring{max-width:40px}.activity-detail{margin-top:14px;padding-top:14px}.activity-detail h3{font-size:18px}.activity-goal-bar{margin-top:10px}.modal.activity-sheet{padding-bottom:16px}}
