:root{color-scheme:light;--bg: #eef7f5;--bg-soft: #dcefed;--ink: #142022;--muted: #5e6d70;--panel: #fffdf8;--panel-soft: #f3f8f6;--line: #cfe0dc;--line-strong: #9fb8b2;--accent: #ff6f61;--accent-strong: #d84d40;--green: #13a085;--blue: #426de2;--yellow: #f0b429;--shadow: 0 22px 70px rgba(32, 63, 64, .16)}:root[data-theme=dark]{color-scheme:dark;--bg: #0f1719;--bg-soft: #172426;--ink: #f6fbf8;--muted: #a6b6b6;--panel: #1a2628;--panel-soft: #223133;--line: #304447;--line-strong: #52686b;--accent: #ff8b7f;--accent-strong: #ffb2aa;--green: #6bd9c3;--blue: #93adff;--yellow: #ffd166;--shadow: 0 24px 70px rgba(0, 0, 0, .34)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;margin:0}button,input,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.app-shell{background:radial-gradient(circle at 14% 10%,rgba(255,111,97,.18),transparent 24rem),radial-gradient(circle at 82% 3%,rgba(18,168,157,.18),transparent 26rem),linear-gradient(180deg,var(--bg),color-mix(in srgb,var(--bg) 70%,var(--bg-soft)));min-height:100vh}.legal-footer{color:var(--muted);font-size:12px;line-height:1.5;padding:0 4px}.legal-footer a{color:var(--ink);font-weight:800}.topbar,.brand,.topnav,.top-actions,.panel-heading,.task-row,.schedule-row,.stat-card,.review-strip,.focus-options,.hero-actions,.primary-link,.secondary-link,.player-card,.track-main,.track-badge,.track-play,.unlock-link,.library-actions{align-items:center;display:flex}.topbar{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:color-mix(in srgb,var(--bg) 84%,transparent);border-bottom:1px solid var(--line);gap:24px;justify-content:space-between;min-height:70px;padding:14px clamp(18px,3vw,42px);position:sticky;top:0;z-index:10}.brand{gap:12px;min-width:224px}.brand-mark{align-items:center;background:var(--ink);border-radius:8px;color:var(--bg);display:inline-flex;font-size:18px;font-weight:900;height:40px;justify-content:center;width:40px}.brand strong,.brand small{display:block;letter-spacing:0}.brand strong{font-size:18px;line-height:1.1}.brand small,.hero-copy p,.panel-heading p,.review-strip p,.player-card p{color:var(--muted);font-size:12px;font-weight:800;letter-spacing:0;margin:0;text-transform:uppercase}.topnav{color:var(--muted);flex:1;font-size:13px;font-weight:760;gap:24px;justify-content:center}.topnav a:hover,.account-link:hover,.studio-link:hover,.secondary-link:hover{color:var(--ink)}.top-actions{gap:10px}.account-link,.icon-button,.primary-action,.primary-link,.secondary-link,.studio-link,.track-play,.unlock-link{border:1px solid var(--line);border-radius:8px;font-size:13px;font-weight:820;min-height:40px}.account-link,.studio-link{align-items:center;background:var(--panel);display:inline-flex;padding:0 14px}.icon-button{align-items:center;background:var(--panel);color:var(--ink);display:inline-flex;flex:0 0 40px;justify-content:center;padding:0;width:40px}.icon-button:hover,.account-link:hover,.focus-options button:hover,.track-play:hover,.unlock-link:hover,.studio-link:hover{border-color:var(--line-strong)}.workspace{margin:0 auto;max-width:1220px;padding:clamp(18px,4vw,44px)}.hero-panel{align-items:center;background:linear-gradient(135deg,color-mix(in srgb,var(--panel) 92%,var(--green)),var(--panel)),var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);display:grid;gap:28px;grid-template-columns:minmax(0,1fr) minmax(260px,360px);margin-bottom:18px;min-height:300px;overflow:hidden;padding:clamp(24px,5vw,54px);position:relative}.hero-copy h1{font-size:clamp(42px,7vw,74px);letter-spacing:0;line-height:.95;margin:12px 0 18px;max-width:780px}.hero-copy span{color:var(--muted);display:block;font-size:17px;line-height:1.6;max-width:650px}.hero-actions{flex-wrap:wrap;gap:10px;margin-top:24px}.primary-link,.secondary-link{gap:9px;justify-content:center;padding:0 16px}.primary-link{background:var(--ink);border-color:var(--ink);color:var(--bg)}.secondary-link{background:var(--panel);color:var(--muted)}.mascot-stage{align-items:center;display:grid;justify-items:center;min-height:260px;position:relative}.city-energy{align-items:center;background:conic-gradient(var(--green) var(--progress, 25%),var(--panel-soft) 0),var(--panel-soft);border-radius:50%;display:flex;flex-direction:column;height:176px;justify-content:center;position:absolute;right:2px;top:0;width:176px}.city-energy:before{background:var(--panel);border-radius:50%;content:"";top:16px;right:16px;bottom:16px;left:16px;position:absolute}.city-energy strong,.city-energy span{position:relative;z-index:1}.city-energy strong{font-size:38px;letter-spacing:0;line-height:1}.city-energy span{color:var(--muted);font-size:11px;font-weight:820;margin-top:5px;text-transform:uppercase}.puppy{height:210px;margin-right:74px;position:relative;width:190px}.puppy-head{background:#fffaf0;border:5px solid #17211d;border-radius:45% 45% 38% 38%;display:block;height:150px;left:18px;position:absolute;top:42px;width:154px;z-index:2}.puppy-ear{background:#17211d;border:4px solid #17211d;display:block;height:82px;position:absolute;top:8px;width:56px;z-index:1}.puppy-ear.left{border-radius:80% 26% 64% 36%;left:20px;transform:rotate(-22deg)}.puppy-ear.right{border-radius:26% 80% 36% 64%;right:20px;transform:rotate(22deg)}.puppy-patch{background:#17211d;border-radius:45% 0 42%;display:block;height:78px;left:0;position:absolute;top:0;width:70px}.puppy-eye{background:#71c7ff;border:4px solid #17211d;border-radius:50%;display:block;height:24px;position:absolute;top:58px;width:24px;z-index:3}.puppy-eye.left{left:38px}.puppy-eye.right{right:38px}.puppy-eye:after{background:#fff;border-radius:50%;content:"";height:7px;position:absolute;right:4px;top:3px;width:7px}.puppy-nose{background:#17211d;border-radius:48% 48% 56% 56%;display:block;height:24px;left:64px;position:absolute;top:86px;width:28px;z-index:3}.puppy-mouth{border-bottom:4px solid #17211d;border-radius:0 0 40px 40px;display:block;height:18px;left:60px;position:absolute;top:107px;width:36px}.puppy-band{background:var(--accent);border:4px solid #17211d;border-radius:999px;bottom:2px;display:block;height:34px;left:46px;position:absolute;width:100px;z-index:3}.dashboard-grid{display:grid;gap:18px;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)}.panel,.review-strip{background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 40px #203f4014}:root[data-theme=dark] .panel,:root[data-theme=dark] .review-strip{box-shadow:0 12px 40px #0000002e}.panel{min-width:0;padding:20px}.panel-heading{gap:14px;justify-content:space-between;margin-bottom:18px}.panel-heading h2{font-size:24px;letter-spacing:0;line-height:1.1;margin:4px 0 0}.task-panel{grid-row:span 2}.task-list,.schedule-list,.track-list{display:grid;gap:10px}.task-row{background:var(--panel-soft);border:1px solid transparent;border-radius:8px;color:var(--ink);gap:13px;min-height:72px;padding:13px 14px;text-align:left;width:100%}.task-row:hover{border-color:var(--line-strong)}.task-row svg{color:var(--accent);flex:0 0 auto}.task-row span,.schedule-row span,.stat-card span,.track-main span,.player-card div{display:grid;gap:4px;min-width:0}.task-row strong,.schedule-row strong,.review-strip strong,.track-main strong,.player-card strong{letter-spacing:0}.task-row small,.schedule-row small,.stat-card small,.track-main small,.player-card small{color:var(--muted);font-size:12px;font-weight:720}.task-row time{color:var(--muted);font-size:13px;font-weight:780;margin-left:auto}.task-row.complete strong{color:var(--muted);text-decoration:line-through}.focus-panel{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 16%,var(--panel)),var(--panel))}.deck-visual{align-items:center;background:color-mix(in srgb,var(--ink) 8%,var(--panel));border:1px solid var(--line);border-radius:8px;display:grid;gap:18px;grid-template-columns:92px 1fr;min-height:104px;margin-bottom:16px;padding:14px}.deck-disc{aspect-ratio:1;background:radial-gradient(circle,var(--panel) 0 13%,transparent 14%),repeating-radial-gradient(circle,color-mix(in srgb,var(--ink) 78%,var(--panel)) 0,color-mix(in srgb,var(--ink) 78%,var(--panel)) 8px,color-mix(in srgb,var(--ink) 88%,var(--panel)) 9px,color-mix(in srgb,var(--ink) 88%,var(--panel)) 14px);border:7px solid var(--ink);border-radius:50%;display:block}.deck-disc.spinning{animation:spin 1.7s linear infinite}.deck-wave{background:linear-gradient(90deg,var(--green),var(--yellow),var(--accent),var(--blue));border-radius:999px;display:block;height:18px;position:relative}.deck-wave:before,.deck-wave:after{background:inherit;border-radius:inherit;content:"";height:18px;left:0;position:absolute;right:0}.deck-wave:before{top:-28px;transform:scaleX(.78);transform-origin:left}.deck-wave:after{bottom:-28px;transform:scaleX(.56);transform-origin:left}.focus-options{gap:8px;margin-bottom:16px}.focus-options button{background:var(--panel);border:1px solid var(--line);border-radius:8px;color:var(--ink);flex:1;font-size:14px;font-weight:860;min-height:42px}.focus-options button.selected{background:var(--ink);border-color:var(--ink);color:var(--bg)}.primary-action{background:var(--accent);border-color:var(--accent);color:#fffdf8;width:100%}.music-panel{grid-column:1 / -1}.library-actions{flex-wrap:wrap;gap:10px;justify-content:flex-end}.library-status{background:color-mix(in srgb,var(--green) 10%,var(--panel));border:1px solid color-mix(in srgb,var(--green) 24%,var(--line));border-radius:999px;color:var(--muted);font-size:11px;font-weight:820;max-width:min(340px,45vw);min-height:30px;overflow:hidden;padding:8px 12px;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.library-status.fallback{background:color-mix(in srgb,var(--yellow) 12%,var(--panel));border-color:color-mix(in srgb,var(--yellow) 32%,var(--line))}.player-card{background:linear-gradient(135deg,color-mix(in srgb,var(--green) 14%,var(--panel)),color-mix(in srgb,var(--blue) 10%,var(--panel))),var(--panel-soft);border:1px solid var(--line);border-radius:8px;gap:16px;justify-content:space-between;margin-bottom:12px;min-height:92px;padding:16px}.player-card strong{font-size:22px}.play-button{align-items:center;background:var(--ink);border:0;border-radius:50%;color:var(--bg);display:inline-flex;flex:0 0 54px;height:54px;justify-content:center;width:54px}.track-row{align-items:center;background:var(--panel-soft);border:1px solid var(--line);border-radius:8px;display:grid;gap:12px;grid-template-columns:minmax(0,1fr) auto auto auto;min-height:82px;padding:12px}.track-row.selected{border-color:color-mix(in srgb,var(--track-color) 54%,var(--line));box-shadow:inset 4px 0 0 var(--track-color)}.track-main{background:transparent;border:0;color:var(--ink);gap:12px;min-width:0;padding:0;text-align:left}.track-art{align-items:center;background:color-mix(in srgb,var(--track-color) 22%,var(--panel));border:1px solid color-mix(in srgb,var(--track-color) 44%,var(--line));border-radius:8px;color:var(--track-color);display:inline-flex;flex:0 0 44px;height:44px;justify-content:center;width:44px}.track-badge{border-radius:999px;gap:5px;justify-content:center;min-height:30px;min-width:74px;padding:0 10px}.track-badge.free{background:color-mix(in srgb,var(--green) 14%,var(--panel));color:var(--green)}.track-badge.paid{background:color-mix(in srgb,var(--yellow) 18%,var(--panel));color:color-mix(in srgb,var(--yellow) 64%,var(--ink))}.track-play,.unlock-link{background:var(--panel);color:var(--ink);gap:6px;justify-content:center;padding:0 12px;white-space:nowrap}.unlock-link{color:var(--muted)}.energy-meter{background:color-mix(in srgb,var(--track-color) 12%,var(--panel));border-radius:999px;grid-column:1 / -1;height:6px;overflow:hidden}.energy-meter span{background:var(--track-color);border-radius:inherit;display:block;height:100%;width:var(--energy)}.schedule-panel{grid-column:1}.schedule-row{border-left:4px solid var(--line-strong);gap:14px;min-height:62px;padding:8px 0 8px 14px}.schedule-row.focus{border-left-color:var(--accent)}.schedule-row.admin{border-left-color:var(--blue)}.schedule-row.break{border-left-color:var(--green)}.schedule-row time{color:var(--muted);font-size:13px;font-weight:850;width:52px}.stats-panel{display:grid;gap:12px}.stat-card{background:var(--panel-soft);border-radius:8px;gap:12px;min-height:74px;padding:14px}.stat-card svg{color:var(--green)}.stat-card strong{font-size:24px;line-height:1}.habits{display:grid;gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.habits span{background:var(--panel-soft);border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:12px;font-weight:820;min-height:38px;padding:10px;text-align:center}.habits span.checked{background:color-mix(in srgb,var(--green) 16%,var(--panel));border-color:color-mix(in srgb,var(--green) 42%,var(--line));color:var(--ink)}.review-strip{justify-content:space-between;margin-top:18px;padding:20px}.review-strip strong{display:block;margin-top:5px}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:960px){.topbar{align-items:flex-start;flex-wrap:wrap}.brand{min-width:0}.topnav{flex-basis:100%;justify-content:flex-start;order:3;overflow-x:auto;padding-bottom:2px}.hero-panel,.dashboard-grid{grid-template-columns:1fr}.mascot-stage{min-height:250px}.city-energy{right:12%}.music-panel,.schedule-panel{grid-column:auto}.track-row{grid-template-columns:minmax(0,1fr) auto}.library-actions{justify-content:flex-start;width:100%}.library-status{max-width:100%}.unlock-link{grid-column:2}}@media(max-width:560px){.top-actions{width:100%}.account-link{flex:1;justify-content:center}.workspace{padding:14px}.hero-panel,.panel,.review-strip{padding:18px}.hero-copy h1{font-size:40px}.hero-actions{align-items:stretch;flex-direction:column}.primary-link,.secondary-link{width:100%}.mascot-stage{min-height:230px}.city-energy{height:138px;right:0;top:8px;width:138px}.city-energy strong{font-size:28px}.puppy{margin-right:56px;transform:scale(.84);transform-origin:center bottom}.task-row{align-items:flex-start}.task-row time{margin-left:0}.deck-visual{grid-template-columns:72px 1fr}.track-row{grid-template-columns:1fr}.music-panel .panel-heading{align-items:flex-start;flex-direction:column}.track-badge,.track-play,.unlock-link{width:100%}.unlock-link{grid-column:auto}}
