@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@600;700&display=swap');
#dashView{max-width:1080px;margin:0 auto}
.rewards-wallet{padding:28px;border:1px solid #e5bc76;border-radius:20px;background:linear-gradient(125deg,#fff2d3,#fbe3bd);color:#693f19}
.rewards-kicker{font-size:10px;font-weight:700;letter-spacing:1.5px}.rewards-wallet>strong{display:block;margin-top:10px;font-size:42px}.rewards-wallet strong small{font-size:16px}.rewards-wallet p{margin-bottom:0}
.rewards-content>h3{margin:28px 0 14px}.rewards-rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.rewards-rules article,.rewards-coming{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--accent-soft)}
.rewards-rules p,.rewards-note,.rewards-coming p{font-size:13px;line-height:1.7;color:var(--muted)}.rewards-coming{margin-top:24px}.rewards-coming h3{margin-top:0}.rewards-history{list-style:none;padding:0}.rewards-history li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);font-size:13px}.rewards-history small{display:block;margin-top:5px;color:var(--muted)}.rewards-history b{white-space:nowrap;color:var(--accent)}
html[data-app-theme="dark"] .rewards-wallet{background:linear-gradient(125deg,#4d371d,#352b24);color:#ffe1a4;border-color:#795d36}
@media(max-width:760px){.rewards-rules{grid-template-columns:1fr}}:is(.phone-preview,.app-preview) .rewards-rules{grid-template-columns:1fr}
.dash-cards[hidden],.dash-settings[hidden]{display:none}
#dashView[data-panel]:not([data-panel=""])>.dash-panel{margin-top:0}
.dash-setting-link{display:flex;align-items:center;gap:12px;width:100%;min-height:72px;padding:16px 20px;text-align:left;color:var(--ink);background:var(--paper)}
.dash-setting-link+.dash-setting-link{border-top:1px solid var(--line)}
.dash-setting-link>span:nth-child(2){flex:1;min-width:0}.dash-setting-link strong{display:block;font-size:14px}.dash-setting-link small{display:block;font-size:12px;margin-top:4px;color:var(--muted)}
.dash-setting-link>.icon:first-child{color:var(--accent);width:21px;height:21px}.dash-setting-link>.icon:last-child{width:16px;height:16px}.dash-setting-link:hover{background:var(--accent-soft)}.dash-setting-link:focus-visible{outline:3px solid var(--accent);outline-offset:-4px}
.dash-panel .dash-setting-content{padding:0}.dash-panel .dash-setting-content p{font-size:13px;color:var(--muted);line-height:1.7}
.dash-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.dash-card{--card-start:#245bc0;--card-end:#163c88;--card-glow:#9cceff;display:flex;flex-direction:column;align-items:flex-start;text-align:left;position:relative;isolation:isolate;overflow:hidden;min-width:0;min-height:240px;padding:22px;border:1px solid #ffffff30;border-radius:22px;background:linear-gradient(145deg,var(--card-start),var(--card-end));color:#fff;gap:12px;box-shadow:0 8px 18px #172c5a15;cursor:pointer;transition:transform .18s,box-shadow .18s}
.dash-card[data-dash-panel="marathons"]{--card-start:#137c79;--card-end:#155552;--card-glow:#a0f0d4}
.dash-card[data-dash-panel="rewards"]{--card-start:#945618;--card-end:#6e3d19;--card-glow:#ffdc87}
.dash-card[data-dash-panel="levels"]{--card-start:#8053a8;--card-end:#573477;--card-glow:#e7bdff}
.dash-card::before{content:"";position:absolute;z-index:-1;width:170px;height:170px;right:-80px;top:-65px;border:28px solid #ffffff0c;border-radius:50%;pointer-events:none}
.dash-card::after{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 100% 0,var(--card-glow),transparent 70%);opacity:.16;pointer-events:none}
.dash-card:hover,.dash-card[aria-expanded="true"]{transform:translateY(-4px);box-shadow:0 13px 24px #172c5a28}
.dash-card:focus-visible,.dash-back:focus-visible,.dash-settings summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.dash-card-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--accent-soft);color:var(--accent)}
.dash-card-icon .icon{width:23px;height:23px}
.dash-card-image{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:10px}
.dash-card>.dash-card-icon{width:46px;height:46px;border:1px solid #ffffff35;background:#ffffff1f;color:#fff;box-shadow:inset 0 1px #ffffff18}
.dash-card strong{font-size:17px;line-height:1.35;letter-spacing:-.2px}
.dash-card small{font-size:12px;line-height:1.6;color:#ffffffe0}
.dash-card-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin-top:auto;padding-top:15px;border-top:1px solid #ffffff30;color:#fff;font-size:12px;font-weight:600}
.dash-card-footer .icon{width:12px;height:12px;vertical-align:middle;margin-left:4px}
.dash-panel{margin-top:22px;padding:24px;border:1px solid var(--line);border-radius:18px;background:var(--paper);color:var(--ink)}
.dash-panel[hidden]{display:none}
.dash-panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.dash-panel-heading h2{margin:0;font-size:23px;font-family:var(--serif);font-weight:500}
.dash-back{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:10px 16px;border:1px solid #0069fb;border-radius:12px;background:#0069fb;color:#fff;font-size:13px;font-weight:700;white-space:nowrap;box-shadow:0 3px 10px rgb(0 105 251 / 18%)}
.dash-back::before{content:"";width:8px;height:8px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);flex-shrink:0}
.dash-back:hover{background:#0056d6;border-color:#0056d6;box-shadow:0 4px 12px rgb(0 105 251 / 28%)}
.dash-empty{padding:24px 0;max-width:520px}
.dash-empty>.dash-card-icon{margin-bottom:18px}
.dash-empty h3{font-size:19px;margin:0 0 10px}
.dash-empty p,.dash-settings p{color:var(--muted);font-size:13px;line-height:1.7}
.dash-status{display:inline-block;border-radius:20px;padding:5px 10px;background:var(--accent-soft);color:var(--accent);font-size:11px;font-weight:600}
.dash-settings{margin-top:34px}
.dash-settings>h2{font-size:22px;font-family:var(--serif);font-weight:500;margin:0 0 14px}
.dash-settings-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;background:transparent}
.dash-settings-list .dash-setting-link{min-height:88px;border:1px solid #dfe6f0;border-radius:16px;box-shadow:0 3px 8px #172c5a05;transition:background .15s,border-color .15s}
.dash-settings-list .dash-setting-link:hover{border-color:var(--accent-border)}
.dash-settings-list .dash-setting-link>.icon:first-child{box-sizing:content-box;padding:11px;border-radius:12px;background:var(--accent-soft)}
.dash-settings-list .dash-setting-link[data-dash-panel="companion"]>.icon:first-child{color:#a53f6c;background:#fce9f1}
.dash-settings-list .dash-setting-link[data-dash-panel="appearance"]>.icon:first-child{color:#7850a1;background:#f0e9fa}
.dash-settings-list .dash-setting-link[data-dash-panel="support"]>.icon:first-child{color:#18766d;background:#e4f4ef}
.dash-settings details+details{border-top:1px solid var(--line)}
.dash-settings summary{display:flex;align-items:center;gap:12px;cursor:pointer;min-height:72px;padding:16px 20px;list-style:none;color:var(--ink)}
.dash-settings summary::-webkit-details-marker{display:none}
.dash-settings summary>.icon:first-child{color:var(--accent);width:21px;height:21px;flex-shrink:0}
.dash-settings summary>span{flex:1;min-width:0}
.dash-settings summary strong{font-size:14px;display:block}
.dash-settings summary small{display:block;margin-top:4px;font-size:12px;color:var(--muted);line-height:1.4}
.dash-settings summary>.icon:last-child{width:16px;height:16px;transition:transform .15s}
.dash-settings details[open] summary>.icon:last-child{transform:rotate(90deg)}
.dash-setting-content{padding:0 20px 20px}
.dash-setting-content h3{font-size:14px;margin:20px 0 8px;color:var(--ink)}
.dash-account-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink)}
.dash-account-row span:last-child{color:var(--muted);text-align:right}
.dash-store-links{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:14px}
.dash-store-links a{color:var(--accent);font-size:13px;text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center}
.dash-settings .app-theme-settings{margin-top:0}
.dash-settings .app-preview-controls{margin-top:16px}
html[data-app-theme="dark"] .dash-panel{background:var(--surface);border-color:var(--line)}
html[data-app-theme="dark"] .dash-settings-list .dash-setting-link{background:#1b293e;border-color:#344159}
html[data-app-theme="dark"] .dash-settings-list .dash-setting-link:hover{background:#25364e}
@media(max-width:760px){.dash-settings-list{grid-template-columns:1fr}.app-shell[data-active-tab="dash"] :is(.page-heading,.app-header){display:none}}
:is(.phone-preview,.app-preview)[data-active-tab="dash"] :is(.page-heading,.app-header){display:none}
:is(.phone-preview,.app-preview) .dash-settings-list{grid-template-columns:1fr}
@media(max-width:760px){.dash-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dash-card{padding:17px;min-height:184px}.dash-panel{padding:18px}.dash-panel-heading{align-items:flex-start}.dash-panel-heading h2{font-size:21px}}
.phone-preview .dash-cards,.app-preview .dash-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.phone-preview .dash-card,.app-preview .dash-card{padding:17px;min-height:184px}
@media(prefers-reduced-motion:reduce){.dash-card,.dash-settings summary>.icon:last-child{transition:none}}

.dash-dev-tools{margin-top:18px;padding:19px;border:1px solid var(--accent-border);border-radius:16px;background:var(--paper)}
.dash-dev-tools[hidden]{display:none!important}
.dash-dev-tools h3{margin:0 0 7px;font-size:15px}
.dash-dev-tools p{font-size:12px;line-height:1.5;color:var(--muted);margin:0 0 15px}
.dash-dev-tools .dash-dev-note{margin:12px 0 0;font-size:11px}
.dash-companion-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0}
.dash-companion-choices button{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 10px;border:1px solid var(--line,#d9e1ed);border-radius:14px;background:var(--surface,#fff);color:var(--ink,#001c60);font-size:12px;cursor:pointer}
.dash-companion-choices button[aria-pressed=true]{border-color:var(--brand-blue,#0069fb);box-shadow:0 0 0 2px var(--accent-border,#c4e7fc);background:var(--accent-soft,#eef5ff)}
.dash-companion-choices button:focus-visible,.dash-companion-toggles button:focus-visible{outline:3px solid var(--brand-blue,#0069fb);outline-offset:3px}
.dash-companion-toggles{display:flex;flex-wrap:wrap;gap:10px}
.dash-companion-toggles button{padding:11px 14px;border:1px solid var(--line,#d9e1ed);border-radius:10px;color:var(--ink,#001c60);background:var(--surface,#fff);font-size:12px}
.dash-companion-toggles button[aria-pressed=true]{border-color:var(--brand-blue,#0069fb);background:var(--accent-soft,#eef5ff);color:var(--brand-blue,#0069fb)}
.dash-companion-toggles button:disabled{opacity:.45}
.app-companion{position:fixed;right:18px;bottom:25px;z-index:29;width:82px;height:82px;pointer-events:none}
.app-companion[hidden]{display:none}
.app-companion .room-pet{position:relative;inset:auto;display:block;width:100%;height:100%;padding:0;border:0;background:none;box-shadow:none;pointer-events:auto;cursor:pointer}
.app-companion .companion-sprite{display:block;position:absolute;inset:0;width:100%;height:100%;margin:0}
.app-companion[data-style=illustrated] .companion-sprite{display:none}
.app-companion[data-style=illustrated] .cartoon-companion{display:block}
.app-companion-speech{position:absolute;bottom:85px;right:0;width:210px;padding:12px 15px;border:1px solid var(--accent-border,#c4e7fc);border-radius:14px;background:var(--surface,#fff);color:var(--ink,#001c60);box-shadow:0 4px 20px #001c6022;font-size:12px;line-height:1.5}
.app-companion-speech[hidden]{display:none}
:is(.phone-preview,.app-preview) .app-companion{bottom:100px;right:12px;width:64px;height:64px}
@media(max-width:760px){.app-companion{bottom:100px;right:12px;width:64px;height:64px}.dash-companion-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* NovaNook signature palette, scoped to the dashboard. */
#dashView{--ink:#0a0f2d;--muted:#606581;--accent:#6541d4;--accent-soft:#f0ebff;--accent-border:#dcd2ff;--line:#e5dff5;--paper:#fff;--surface:#fff;font-family:Inter,"DM Sans",sans-serif;color:var(--ink);padding:8px 0 24px}
#dashView :is(button,input,select){font-family:inherit}
#dashView :is(h1,h2,h3,.dash-card strong){font-family:Poppins,Inter,sans-serif;font-weight:600;letter-spacing:-.6px}
.dash-welcome{position:relative;isolation:isolate;overflow:hidden;padding:36px 38px;margin-bottom:24px;border:1px solid #e6dfff;border-radius:26px;background:radial-gradient(ellipse at 90% 10%,#d946ff19,transparent 50%),radial-gradient(ellipse at 100% 100%,#00e5ff24,transparent 55%),linear-gradient(110deg,#fff,#f1edff)}
.dash-eyebrow{display:flex;align-items:center;gap:9px;color:#6541d4;font-size:10px;font-weight:700;letter-spacing:2px}
.dash-eyebrow>span{font-size:20px;letter-spacing:0}
#dashView .dash-welcome h1{position:relative;z-index:1;margin:15px 0 12px;font-size:clamp(30px,3.5vw,46px);font-weight:700;line-height:1.2;letter-spacing:-1.6px}
.dash-welcome h1>span{color:#6541d4;background:linear-gradient(100deg,#a52ce4,#7044ee 40%,#2165d9 85%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.dash-welcome p{position:relative;z-index:1;margin:0;max-width:440px;font-size:13px;line-height:1.8;color:var(--muted)}
.dash-welcome-star{position:absolute;z-index:-1;right:42px;top:2px;font-size:220px;line-height:1.2;color:#aa93fa55;transform:rotate(8deg);pointer-events:none}
#dashView[data-panel]:not([data-panel=""])>.dash-welcome{display:none}
#dashView .dash-card{--card-start:#7550ec;--card-end:#4930b0;--card-glow:#d946ff;min-height:226px;border:1px solid #ffffff40;box-shadow:0 8px 22px #4d32a516}
#dashView .dash-card[data-dash-panel="marathons"]{--card-start:#a33de0;--card-end:#6a35bd;--card-glow:#f3aaff}
#dashView .dash-card[data-dash-panel="rewards"]{--card-start:#427bfa;--card-end:#3451bd;--card-glow:#00e5ff}
#dashView .dash-card[data-dash-panel="levels"]{--card-start:#137caa;--card-end:#2753a8;--card-glow:#00e5ff}
#dashView .dash-card::before{border-radius:32px;transform:rotate(35deg);border-color:#ffffff10}
#dashView .dash-card strong{font-size:16px;letter-spacing:-.4px}
#dashView .dash-card:hover{box-shadow:0 14px 28px #6440c52b}
#dashView .dash-settings>h2{font-size:21px;margin-bottom:16px}
#dashView .dash-settings-list .dash-setting-link{border-color:var(--line);background:var(--paper);border-radius:18px;box-shadow:0 4px 16px #6943bf06}
#dashView .dash-settings-list .dash-setting-link:hover{background:var(--accent-soft);border-color:var(--accent-border)}
#dashView .dash-settings-list .dash-setting-link>.icon:first-child{color:#7044d5;background:#f0ebff}
#dashView .dash-settings-list .dash-setting-link[data-dash-panel="companion"]>.icon:first-child{color:#9d2ec5;background:#f8eaff}
#dashView .dash-settings-list .dash-setting-link[data-dash-panel="support"]>.icon:first-child{color:#126e98;background:#e6f8ff}
#dashView .dash-panel{border-radius:22px;box-shadow:0 8px 30px #6943bf08}
#dashView .dash-panel-heading h2{font-weight:600}
html[data-app-theme="dark"] #dashView{--ink:#f3efff;--muted:#b9b7d1;--accent:#c4acff;--accent-soft:#2b2346;--accent-border:#544076;--line:#39304e;--paper:#18172b;--surface:#18172b}
html[data-app-theme="dark"] .dash-welcome{background:radial-gradient(ellipse at 100% 0,#7b4dff35,transparent 65%),linear-gradient(120deg,#18172b,#24203e);border-color:#44355e}
html[data-app-theme="dark"] .dash-eyebrow{color:#c4acff}
html[data-app-theme="dark"] .dash-welcome h1>span{background-image:linear-gradient(100deg,#e7a0ff,#ba9bff 45%,#77caff)}
html[data-app-theme="dark"] #dashView .dash-setting-link>.icon:first-child{background:#32264b;color:#d0b9ff}
@media(max-width:760px){.dash-welcome{padding:26px 23px;border-radius:22px;margin-bottom:18px}.dash-welcome-star{right:-28px;top:25px;font-size:180px;opacity:.55}.dash-welcome p{max-width:270px}#dashView .dash-card{min-height:194px;padding:17px}#dashView .dash-card strong{font-size:15px}}
:is(.phone-preview,.app-preview) .dash-welcome{padding:26px 23px;margin-bottom:18px}
:is(.phone-preview,.app-preview) .dash-welcome h1{font-size:32px}
:is(.phone-preview,.app-preview) .dash-welcome-star{right:-28px;font-size:180px;opacity:.55}
:is(.phone-preview,.app-preview) #dashView .dash-card{min-height:194px;padding:17px}

/* Dashboard overview: progress, featured event, then rewards and milestones. */
#dashView .dash-overview{display:flex;flex-direction:column;gap:38px}
#dashView .dash-overview[hidden]{display:none}
.dash-section-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}
#dashView .dash-section-heading h2{font-size:21px;line-height:1.4;margin:5px 0 0}
.dash-kicker{font-size:10px;font-weight:700;letter-spacing:1.7px;color:var(--accent)}
.dash-overview-stats{display:grid;grid-template-columns:190px minmax(0,1fr);gap:28px;align-items:center;padding-bottom:30px;border-bottom:1px solid var(--line)}
.dash-stats-art{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:14px}
.dash-stats-copy{min-width:0}
.dash-text-link,.dash-journey-link{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-size:12px;font-weight:600}
.dash-text-link{min-height:44px;padding:0;white-space:nowrap}
.dash-text-link .icon,.dash-journey-link .icon,.dash-feature-link .icon{width:15px;height:15px}
.dash-stat-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0 0 10px}
.dash-stat-metrics>div+div{border-left:1px solid var(--line);padding-left:20px}
.dash-stat-metrics dt{font-size:11px;color:var(--muted);margin-bottom:6px}
.dash-stat-metrics dd{font-size:28px;font-weight:600;letter-spacing:-1px;margin:0;color:var(--ink)}
.dash-metric-note{font-size:10px;color:var(--muted)}
.dash-event-status{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px}
.dash-event-status>span{width:6px;height:6px;background:var(--accent);border-radius:50%;flex-shrink:0}
.dash-marathon-banner{display:grid;grid-template-columns:1.65fr 1fr;overflow:hidden;border-radius:22px;background:#14132e;color:#fff}
.dash-marathon-banner>img{display:block;width:100%;height:100%;object-fit:cover;min-height:300px}
.dash-marathon-copy{padding:32px 28px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.dash-marathon-copy .dash-kicker{color:#d5baff}
#dashView .dash-marathon-copy h3{font-size:clamp(24px,2.6vw,36px);line-height:1.2;color:#fff;margin:14px 0;letter-spacing:-1px}
.dash-marathon-duration{font-size:12px;color:#f7d995;font-weight:600}
.dash-marathon-copy p{font-size:12px;line-height:1.8;color:#d3cfe6;margin:16px 0 22px}
.dash-feature-link{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:46px;padding:12px 18px;border-radius:11px;background:#f2eaff;color:#382060;font-size:12px;font-weight:700;width:100%}
.dash-feature-link:hover{background:#fff}
.dash-marathon-copy>small{font-size:10px;color:#b7b1cd;margin-top:12px}
.dash-journey-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.dash-journey-card{display:flex;flex-direction:column;align-items:stretch;gap:12px;min-width:0;padding:0;text-align:left;color:var(--ink);border:0;background:transparent;border-radius:14px}
.dash-journey-card .dash-card-image{aspect-ratio:16/9;border-radius:14px;transition:filter .18s}
.dash-journey-card:hover .dash-card-image{filter:brightness(1.08)}
.dash-journey-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:3px}
.dash-journey-heading>strong{font-size:17px;font-weight:600}
.dash-value-badge{padding:6px 10px;border-radius:20px;background:var(--accent-soft);color:var(--accent);font-size:11px;font-weight:600;white-space:nowrap}
.dash-journey-description{font-size:12px;color:var(--muted);line-height:1.6}
.dash-journey-link{margin-top:auto;min-height:32px;justify-content:space-between}
.dash-level-meter{display:block;height:5px;border-radius:10px;background:var(--accent-soft);overflow:hidden}
.dash-level-meter>span{display:block;height:100%;background:var(--accent);border-radius:inherit}
.dash-text-link:focus-visible,.dash-feature-link:focus-visible,.dash-journey-card:focus-visible{outline:3px solid var(--accent);outline-offset:5px}
.dash-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#dashView .dash-settings{margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}
#dashView .dash-settings>h2{font-size:17px}
#dashView .dash-settings-list{gap:0 28px}
#dashView .dash-settings-list .dash-setting-link{min-height:74px;padding:12px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent}
#dashView .dash-settings-list .dash-setting-link:hover{background:var(--accent-soft)}
#dashView .dash-settings-list .dash-setting-link>.icon:first-child{padding:8px;background:transparent;color:var(--muted)}
@media(max-width:760px){
  .dash-overview-stats{grid-template-columns:1fr;gap:16px}.dash-stats-art{display:none}
  .dash-section-heading{align-items:flex-start;gap:12px}#dashView .dash-section-heading h2{font-size:18px}
  .dash-stat-metrics{gap:10px}.dash-stat-metrics>div+div{padding-left:10px}.dash-stat-metrics dd{font-size:25px}
  .dash-marathon-feature>.dash-section-heading{flex-direction:column}
  .dash-marathon-banner{grid-template-columns:1fr}.dash-marathon-banner>img{min-height:0;height:auto;aspect-ratio:3/2}
  .dash-marathon-copy{padding:24px}.dash-marathon-copy h3 br{display:none}
  .dash-journey-grid{grid-template-columns:1fr;gap:28px}
}
:is(.phone-preview,.app-preview) .dash-overview-stats{grid-template-columns:1fr;gap:16px}
:is(.phone-preview,.app-preview) .dash-stats-art{display:none}
:is(.phone-preview,.app-preview) .dash-marathon-feature>.dash-section-heading{flex-direction:column;align-items:flex-start}
:is(.phone-preview,.app-preview) .dash-marathon-banner{grid-template-columns:1fr}
:is(.phone-preview,.app-preview) .dash-marathon-banner>img{min-height:0;height:auto;aspect-ratio:3/2}
:is(.phone-preview,.app-preview) .dash-marathon-copy{padding:24px}
:is(.phone-preview,.app-preview) .dash-marathon-copy h3 br{display:none}
:is(.phone-preview,.app-preview) .dash-journey-grid{grid-template-columns:1fr}
:is(.phone-preview,.app-preview) .dash-stat-metrics{gap:10px}
:is(.phone-preview,.app-preview) .dash-stat-metrics>div+div{padding-left:10px}
:is(.phone-preview,.app-preview) .dash-stat-metrics dd{font-size:25px}
/* Compact snapshot and scroll interactions. */
#dashView .dash-overview{gap:30px}
#dashView .dash-overview-stats{grid-template-columns:80px minmax(0,1fr);gap:18px;padding:16px 20px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(110deg,var(--accent-soft),var(--paper) 65%)}
#dashView .dash-stats-art{display:block;width:80px;height:48px;aspect-ratio:5/3;border-radius:9px}
#dashView .dash-stats-copy{display:grid;grid-template-columns:minmax(150px,.9fr) minmax(0,1.5fr);gap:20px;align-items:center}
#dashView .dash-overview-stats .dash-section-heading{display:block;margin:0}
#dashView .dash-overview-stats h2{font-size:15px;margin:0;letter-spacing:-.35px}
#dashView .dash-overview-stats .dash-text-link{min-height:28px;font-size:11px}
#dashView .dash-stat-metrics{margin:0;gap:14px}
#dashView .dash-stat-metrics>div+div{padding-left:14px}
#dashView .dash-stat-metrics dt{font-size:10px;margin-bottom:4px}
#dashView .dash-stat-metrics dd{font-size:23px;line-height:1.25;font-weight:700;color:var(--ink)}
.dash-countdown{width:100%;margin-bottom:25px}
.dash-countdown-label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;font-weight:700;letter-spacing:1.5px;color:#eadbff;margin-bottom:10px}
.dash-countdown-label>span{font-size:8px;letter-spacing:.7px;color:#bfb5da}
.dash-countdown-units{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.dash-countdown-units>span{display:flex;flex-direction:column;align-items:center;padding:10px 3px 8px;border-radius:10px;border:1px solid #b999ff55;background:linear-gradient(145deg,#8f52ed40,#3e8cff1c);box-shadow:inset 0 1px 0 #ffffff12}
.dash-countdown-units strong{font-size:25px;line-height:1.1;font-weight:700;font-variant-numeric:tabular-nums;color:#fff;text-shadow:0 0 18px #bf86ff66}
.dash-countdown-units small{font-size:9px;color:#d5cbe8;margin-top:5px}
#dashView .dash-level-meter,#dashView .levels-progress{height:8px;background:var(--accent-soft);box-shadow:inset 0 1px 3px #673ac51c;overflow:visible}
#dashView .dash-level-meter>span,#dashView .levels-progress>span{position:relative;background:linear-gradient(90deg,#7942ff 0%,#e23bde 48%,#17cfea 100%);box-shadow:0 2px 12px #b43beb55;transform-origin:left;transition:width .8s cubic-bezier(.22,1,.36,1)}
#dashView .dash-value-badge{background:linear-gradient(120deg,#773ef2,#bc34d4);color:#fff;box-shadow:0 3px 12px #8d40d42a}
#dashView [data-dash-panel="rewards"] .dash-value-badge{background:linear-gradient(120deg,#a95c08,#d88716);box-shadow:0 3px 12px #e0a02230}
.dash-scroll-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s cubic-bezier(.22,1,.36,1)}
.dash-scroll-reveal.dash-is-visible,.dash-scroll-reveal:focus-within{opacity:1;transform:translateY(0)}
.dash-journey-card.dash-scroll-reveal:nth-child(2){transition-delay:.1s}
.dash-scroll-reveal .dash-level-meter>span{transform:scaleX(0)}
.dash-scroll-reveal.dash-is-visible .dash-level-meter>span{transform:scaleX(1);transition:transform 1.1s cubic-bezier(.22,1,.36,1) .2s,width .8s ease}
.dash-journey-card .dash-card-image{transition:filter .25s,transform .35s}
@media(hover:hover){.dash-journey-card:hover .dash-card-image{transform:translateY(-3px);filter:brightness(1.08)}.dash-feature-link{transition:transform .2s,box-shadow .2s}.dash-feature-link:hover{transform:translateY(-2px);box-shadow:0 6px 22px #b583ff33}}
@media(max-width:900px){#dashView .dash-stats-copy{grid-template-columns:1fr;gap:10px}#dashView .dash-overview-stats .dash-section-heading{display:flex;align-items:center}}
@media(max-width:760px){#dashView .dash-overview-stats{grid-template-columns:1fr;gap:0;padding:15px}#dashView .dash-stats-art{display:none}#dashView .dash-stat-metrics{gap:10px}#dashView .dash-stat-metrics>div+div{padding-left:10px}#dashView .dash-stat-metrics dd{font-size:22px}}
:is(.phone-preview,.app-preview) #dashView .dash-overview-stats{grid-template-columns:1fr;gap:0;padding:15px}
:is(.phone-preview,.app-preview) #dashView .dash-stats-art{display:none}
:is(.phone-preview,.app-preview) #dashView .dash-stats-copy{grid-template-columns:1fr;gap:10px}
:is(.phone-preview,.app-preview) #dashView .dash-overview-stats .dash-section-heading{display:flex;align-items:center}
:is(.phone-preview,.app-preview) #dashView .dash-stat-metrics dd{font-size:22px}
@media(prefers-reduced-motion:reduce){.dash-scroll-reveal,.dash-scroll-reveal.dash-is-visible{opacity:1;transform:none;transition:none}.dash-scroll-reveal .dash-level-meter>span{transform:none!important}#dashView .dash-level-meter>span,#dashView .levels-progress>span,.dash-journey-card .dash-card-image,.dash-feature-link{transition:none!important}.dash-journey-card:hover .dash-card-image,.dash-feature-link:hover{transform:none}}
/* Size dashboard sections by their available space, including device previews. */
:root #appShell.app-shell[data-active-tab="dash"] main{padding:clamp(16px,2.5vw,36px) clamp(16px,3vw,44px) 32px;padding-inline:clamp(16px,3vw,44px);max-width:none;width:100%;min-width:0}
#dashView{container:dashboard / inline-size;width:100%;min-width:0}
#dashView .dash-overview{gap:32px}
#dashView .dash-overview-stats{grid-template-columns:80px minmax(0,1fr);gap:18px;padding:16px 20px}
#dashView .dash-stats-art{display:block}
#dashView .dash-stats-copy{grid-template-columns:minmax(150px,.9fr) minmax(0,1.5fr);gap:20px}
#dashView .dash-overview-stats .dash-section-heading{display:block}
#dashView .dash-stat-metrics{gap:14px}
#dashView .dash-stat-metrics>div+div{padding-left:14px}
#dashView .dash-stat-metrics dd{font-size:23px;overflow-wrap:anywhere}
#dashView .dash-marathon-feature>.dash-section-heading{flex-direction:row;align-items:center}
#dashView .dash-marathon-banner{grid-template-columns:1.5fr 1fr}
#dashView .dash-marathon-banner>img{height:100%;min-height:320px;aspect-ratio:auto}
#dashView .dash-marathon-copy{padding:28px;min-width:0}
#dashView .dash-marathon-copy h3 br{display:initial}
#dashView .dash-journey-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
#dashView .dash-settings-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
#dashView .dash-text-link{min-height:36px}
#dashView .dash-journey-link{min-height:44px}
#dashView .dash-journey-heading{flex-wrap:wrap}
#dashView .dash-setting-link>span:nth-child(2){overflow-wrap:anywhere}
#dashView .dash-section-heading h2{font-size:21px}
#dashView .dash-countdown-units strong{font-size:clamp(22px,2.3cqi,28px)}
@container dashboard (max-width:850px){
  #dashView .dash-stats-copy{grid-template-columns:1fr;gap:10px}
  #dashView .dash-overview-stats .dash-section-heading{display:flex;align-items:center}
  #dashView .dash-marathon-banner{grid-template-columns:1.1fr 1fr}
  #dashView .dash-marathon-copy{padding:22px}
  #dashView .dash-countdown{margin-bottom:20px}
  #dashView .dash-marathon-copy h3{font-size:28px}
  #dashView .dash-journey-grid{gap:20px}
}
@container dashboard (max-width:850px){
  #dashView .dash-marathon-banner{grid-template-columns:1fr}
  #dashView .dash-marathon-banner>img{height:auto;min-height:0;aspect-ratio:3/2;max-height:400px;object-position:center}
  #dashView .dash-marathon-copy{padding:24px}
  #dashView .dash-marathon-copy h3 br{display:none}
  #dashView .dash-marathon-copy h3{font-size:28px;margin:10px 0}
  #dashView .dash-countdown{max-width:360px;margin-bottom:22px}
  #dashView .dash-countdown-units strong{font-size:28px}
  #dashView .dash-section-heading h2{font-size:19px}
  #dashView .dash-feature-link{max-width:360px}
}
@container dashboard (max-width:520px){
  #dashView .dash-overview{gap:26px}
  #dashView .dash-overview-stats{grid-template-columns:1fr;padding:12px 14px;gap:0;border-radius:14px}
  #dashView .dash-stats-art{display:none}
  #dashView .dash-overview-stats h2{font-size:14px}
  #dashView .dash-stats-copy{gap:8px}
  #dashView .dash-stat-metrics{gap:8px}
  #dashView .dash-stat-metrics>div+div{padding-left:8px}
  #dashView .dash-stat-metrics dd{font-size:22px;letter-spacing:-.7px}
  #dashView .dash-stat-metrics dt{font-size:10px;line-height:1.4}
  #dashView .dash-marathon-feature>.dash-section-heading{align-items:flex-start;flex-direction:column;gap:10px}
  #dashView .dash-marathon-banner{border-radius:18px}
  #dashView .dash-marathon-copy{padding:20px}
  #dashView .dash-marathon-copy h3{font-size:26px}
  #dashView .dash-marathon-copy p{margin:12px 0 18px;font-size:13px}
  #dashView .dash-countdown{max-width:none;margin-bottom:20px}
  #dashView .dash-feature-link{max-width:none;min-height:48px;font-size:13px}
  #dashView .dash-journey-grid{grid-template-columns:1fr;gap:24px}
  #dashView .dash-journey-card{gap:10px}
  #dashView .dash-journey-description{font-size:13px}
  #dashView .dash-settings{margin-top:30px;padding-top:22px}
  #dashView .dash-settings-list{grid-template-columns:1fr}
  #dashView .dash-panel{padding:18px 14px;border-radius:16px}
  #dashView .dash-panel-heading{align-items:flex-start;flex-wrap:wrap}
  #dashView .dash-panel-heading h2{font-size:21px}
}
@container dashboard (max-width:330px){
  #dashView .dash-overview-stats .dash-section-heading{gap:6px;align-items:center}
  #dashView .dash-overview-stats h2{max-width:125px;line-height:1.4}
  #dashView .dash-text-link{font-size:10px;gap:3px}
  #dashView .dash-stat-metrics dd{font-size:20px}
  #dashView .dash-marathon-copy{padding:16px}
  #dashView .dash-countdown-units{gap:6px}
  #dashView .dash-countdown-units strong{font-size:24px}
  #dashView .dash-journey-heading>strong{font-size:16px}
}
@media(max-width:1023px){
  :root #appShell[data-active-tab="dash"] main{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  :root #appShell[data-active-tab="dash"] .page-heading{display:none}
}
:root #appShell.app-preview[data-active-tab="dash"] main{padding-bottom:24px}

#dashView .dash-overview-stats .dash-section-heading h2{font-size:15px}
@container dashboard (max-width:520px){#dashView .dash-overview-stats .dash-section-heading h2{font-size:14px}}
:root #appShell.app-shell:is(.phone-preview,.app-preview)[data-active-tab="dash"] main{padding-inline:16px;padding-top:16px}
/* Preserve the complete lettering and artwork at every dashboard width. */
#dashView .dash-marathon-banner>img{width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:auto;object-fit:contain;align-self:center}
#dashView .dash-journey-card .dash-card-image{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
#dashView .dash-stats-art{height:auto;aspect-ratio:auto;object-fit:contain}

/* Keep the page heading and return action together as one clear navigation area. */
#dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:20px 24px;margin:0 0 20px;border:1px solid #cddcff;border-radius:18px;background:linear-gradient(115deg,#eaf3ff,#f2edff);box-shadow:0 4px 16px #0069fb08}
#dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading h2{color:#123a85;margin:0;font-size:25px;line-height:1.3;letter-spacing:-.4px}
#dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading .dash-back{margin:0;flex-shrink:0;background:#0069fb;color:#fff;border-color:#0069fb;border-radius:11px;min-height:44px;box-shadow:0 3px 10px #0069fb20}
#dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading .dash-back:hover{background:#004fcb;border-color:#004fcb}
html[data-app-theme="dark"] #dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading{background:linear-gradient(115deg,#1b3051,#302448);border-color:#41547b;box-shadow:none}
html[data-app-theme="dark"] #dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading h2{color:#e4edff}
@media(max-width:420px){#dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading{padding:16px;gap:12px;border-radius:15px}#dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading h2{font-size:23px}#dashView :is(.dash-panel[data-dash-detail],#dashAccount)>.dash-panel-heading .dash-back{padding:9px 12px;font-size:12px}}

/* Appearance preferences */
#dashAppearance .app-theme-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
#dashAppearance .app-theme-options label{position:relative;padding:16px 12px;min-width:0;min-height:150px;font-size:14px;font-weight:600;text-align:center;border-radius:16px}
#dashAppearance .app-theme-options input{position:absolute;top:12px;left:12px;width:18px;height:18px}
#dashAppearance .app-theme-options label:has(input:checked){box-shadow:0 0 0 2px var(--accent);background:var(--accent-soft);color:var(--ink)}
.appearance-preview{display:grid;gap:7px;width:min(100%,110px);height:74px;padding:13px 10px;border-radius:10px;background:#f2f7ff;border:1px solid #92a6c0;box-sizing:border-box;overflow:hidden}
.appearance-preview i{display:block;background:#b5d5ee;border-radius:4px;height:9px}
.appearance-preview i:first-child{width:55%;background:#2386c2}.appearance-preview i:last-child{width:75%}
.preview-dark{background:#17263b}.preview-dark i{background:#415c79}.preview-dark i:first-child{background:#6dcaff}
.preview-system{background:linear-gradient(90deg,#f2f7ff 50%,#17263b 50%)}
.preview-schedule{background:linear-gradient(135deg,#fff2ce,#dbeaff 48%,#293853)}
#dashAppearance .app-theme-settings{padding-top:24px;margin-top:18px}
#dashAppearance .app-theme-settings p{font-size:14px;line-height:1.6;color:var(--muted)}
.appearance-motion{display:flex;align-items:center;gap:12px;clear:both;min-height:44px;font-weight:600;color:var(--ink)}
.appearance-motion input{width:20px;height:20px;accent-color:var(--accent)}
#appearanceSaveStatus:not(:empty){padding:14px 16px;border-radius:12px;border:1px solid var(--accent-border);background:var(--accent-soft);color:var(--ink);line-height:1.5}
@media(max-width:700px){#dashAppearance .app-theme-options{grid-template-columns:repeat(2,minmax(0,1fr))}#dashAppearance .app-theme-options label{min-height:140px;padding:16px 8px}}
html[data-reduced-motion="true"] *,html[data-reduced-motion="true"] *::before,html[data-reduced-motion="true"] *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
html[data-reduced-motion="true"] :is(.reading-confetti,.finished-confetti,.finished-fireworks){display:none!important}
html[data-reduced-motion="true"] .dash-scroll-reveal{opacity:1!important;transform:none!important}

#dashView #dashAppearance{border:0;border-radius:0;background:transparent;box-shadow:none;padding:0}