/* StudyOS V5 · Nebula. Shared design tokens and production components. */
:root{
 --bg:#0b0813;--bg-raised:#120e1f;--panel:rgba(255,255,255,.05);--panel2:rgba(255,255,255,.08);--line:rgba(255,255,255,.12);
 --text:#f5f0ff;--muted:#b3a8c6;--blue:#a78bfa;--purple:#b794ff;--cyan:#67e8f9;--green:#5ee4b5;--orange:#f3c98c;--red:#fb7185;
 --md-surface:var(--panel);--md-outline:var(--line);--md-primary:var(--purple);
 --font-sans:Inter,"SF Pro Display",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
 --text-xs:.6875rem;--text-sm:.8125rem;--text-body:.9375rem;--text-title:1.375rem;--text-display:2rem;--text-timer:4.5rem;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;
 --radius-sm:14px;--radius-card:24px;--radius-pill:999px;--glass-blur:16px;
 --gradient-primary:linear-gradient(115deg,#55e5f6 0%,#7471ff 48%,#d94df5 100%);
 --gradient-glass:linear-gradient(135deg,rgba(255,255,255,.085),rgba(255,255,255,.025));
 --shadow:0 16px 50px #08040d40;--glow-violet:0 8px 32px #a855f740;--glow-cyan:0 0 28px #67e8f92e;
 --motion-fast:160ms;--motion-normal:280ms;--ease:cubic-bezier(.2,.8,.2,1);
 color-scheme:dark;
}
html{background:var(--bg);scroll-padding-bottom:100px}
body{font-family:var(--font-sans);color:var(--text);background:radial-gradient(ellipse at 70% 0%,#7928ca2e,transparent 34%),radial-gradient(ellipse at 10% 48%,#4f46e512,transparent 35%),var(--bg);background-attachment:fixed;padding-bottom:calc(96px + env(safe-area-inset-bottom));-webkit-font-smoothing:antialiased}
button,input,textarea,select{font-family:inherit}button{touch-action:manipulation}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
.top{max-width:1020px;padding:calc(20px + env(safe-area-inset-top)) 20px 16px;position:relative;gap:12px}
.brand{gap:10px}.brand b{font-size:20px;letter-spacing:-.7px}.brand small{font-size:10px;letter-spacing:.4px}.logo{width:39px;height:39px;border-radius:13px;box-shadow:0 0 24px #b478f540;border:1px solid #dcb2ff45}.logo img{border-radius:12px}
.top .right{display:flex;gap:8px}.iconbtn{width:42px;height:42px;border-radius:15px;background:#ffffff0b;border:1px solid var(--line);backdrop-filter:blur(16px);box-shadow:inset 0 1px #ffffff12}
.version-badge{display:inline-flex;align-items:center;gap:5px;vertical-align:middle;font-size:9px;font-weight:800;letter-spacing:1px;color:#ddc8ff;border:1px solid #c695ff42;border-radius:7px;padding:3px 6px;background:#a855f71a;margin-left:7px}
.wrap{max-width:1020px;padding:0 20px 24px}.pagehead h1{font-size:clamp(25px,5vw,34px);letter-spacing:-1.1px;font-weight:750}.pagehead p{color:var(--muted);font-size:12px;line-height:1.6}.eyebrow{color:#b5a6e2;font-size:9px;letter-spacing:1.8px}
.card,.glass-card,.feature-metric,.feature-panel,.correction-action{background:var(--gradient-glass);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:inset 0 1px #ffffff08,var(--shadow);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur))}
.cardhead h2{font-size:14px;letter-spacing:-.3px}.subtle,.mutedtext,.feature-help{color:var(--muted)}
.primary,.gradient-button,.timercontrols .round.big{background:var(--gradient-primary);border:1px solid #e4c5ff60;color:#fff;border-radius:var(--radius-pill);box-shadow:0 5px 24px #a855f750,inset 0 1px #ffffff80;text-shadow:0 1px 5px #28204766;min-height:44px;font-weight:700;transition:transform var(--motion-fast) var(--ease),box-shadow var(--motion-fast)}
.secondary,.round,.filter,.task,.day,.event,.feature-callout{background:#ffffff07;border:1px solid var(--line);color:var(--text)}.secondary{min-height:44px}.field input,.field select,.field textarea{background:#110c1de6;border:1px solid #ffffff24;color:var(--text);border-radius:14px;min-height:44px}select option{background:#171022;color:var(--text)}.task{border-radius:17px}.check{border-color:#b0a2c7;border-radius:8px;width:25px;height:25px}.task .check{min-width:25px}.linkbtn{color:#c8adff;min-height:40px}.filter.active,.day.selected{background:#b57bff30;border-color:#be8aff70}.feature-badge,.pill{border-radius:8px;background:#b88bff20;color:#d7c2fb}.modal{background:#171122;border:1px solid #c4a4f53b;box-shadow:0 20px 100px #0008}.modalback{background:#090610b8;backdrop-filter:blur(10px)}
/* Overview: compact metrics and a unified tracking card. */
.overview-head{padding:22px 19px 23px;margin:0 -4px 20px;border:1px solid #dfb5ff25;border-radius:26px;background:radial-gradient(ellipse at 95% 20%,#ec489945,transparent 62%),radial-gradient(ellipse at 60% -40%,#9f36edaa,transparent 80%),linear-gradient(135deg,#27163890,#3d205378);box-shadow:inset 0 1px #ffffff12,0 16px 55px #8427e513}
.overview-head .pagehead-row{margin-top:8px;align-items:flex-start}.overview-head h1{font-size:clamp(23px,5vw,32px);line-height:1.22;margin-bottom:9px}.overview-head p{max-width:270px}.notification-button{width:36px;height:36px;flex:none}.overview-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:20px}.overview-stats .card{min-height:104px;border-radius:21px;padding:17px 14px;border-color:#c3a3ef2a;position:relative;overflow:hidden}.overview-stats .card:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 100% 0%,#ad5bf513,transparent 75%)}.overview-stats .staticon{width:35px;height:40px;flex:none;border-radius:12px;background:#ab6be81c;color:#c5a3ed;font-size:21px}.overview-stats .task-icon{color:var(--green);background:#28c49c18}.overview-stats .streak-icon{color:var(--orange);background:#efb95418}.stat small{font-size:11px;color:#baafcb}.stat strong{font-size:26px;font-variant-numeric:tabular-nums;letter-spacing:-1px;margin-top:3px}.overview-columns{display:block}.overview-progress{padding:20px!important;border-radius:25px!important}.overview-weekly{display:none}.overview-progress .cardhead{align-items:flex-start;gap:10px}.overview-progress .cardhead h2{font-size:16px}.overview-progress .cardhead .subtle{font-size:10px;text-align:right}.overview-progress .ring{width:128px;height:128px}.ring .track{stroke:#ffffff0b;stroke-width:7}.ring .value{stroke-width:7;filter:drop-shadow(0 0 4px #bd83ff66)}.ring .v5-task-track{stroke:#ffffff0b;stroke-width:5}.ring .v5-task-ring{stroke:#67e8f9;stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .3s}.ringcenter b{font-size:25px!important}.ringcenter small{font-size:9px}.v5-track-main{display:grid;grid-template-columns:128px minmax(0,1fr);align-items:center;gap:14px}.overview-progress .progressrow{display:block}.overview-progress .legend{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line);padding-top:14px;margin-top:12px}.overview-progress .legendline{font-size:10px;gap:6px}.dot{width:6px;height:6px;margin-right:5px}.v5-wave{min-width:0}.v5-wave svg{display:block;width:100%;height:118px;overflow:visible}.v5-wave-label{color:#b6a2d1;font-size:9px;letter-spacing:1.1px;text-transform:uppercase}.v5-chart-key{display:flex;gap:10px;font-size:9px;color:var(--muted);margin-top:7px}.v5-chart-key i{display:inline-block;width:5px;height:5px;border-radius:50%;margin-right:4px}.v5-pace{display:flex;gap:7px;align-items:center;margin:18px 0 13px;flex-wrap:wrap;font-size:10px}.v5-pace strong{color:#f4d6a8;font-weight:500;padding:7px 10px;border:1px solid #f4cb8e20;background:#eebc6820;border-radius:9px}.v5-pace span{color:#c5b2dc}.v5-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;position:relative}.v5-week:before{content:"";position:absolute;left:6%;right:6%;top:22px;height:2px;background:linear-gradient(90deg,#b973fb,#7dd9ee55,#ffffff12)}.v5-day{z-index:1;position:relative;border:1px solid transparent;border-radius:12px;min-width:0;padding:6px 0 8px;background:transparent;display:grid;justify-items:center;gap:6px;min-height:68px;color:#9e91b4;font-size:9px}.v5-day i{height:10px;width:10px;border-radius:50%;background:#4c405c;border:3px solid #6a5b7b;box-sizing:content-box}.v5-day.has i{background:#f7cd93;border-color:#78583f;box-shadow:0 0 15px #f1b97330}.v5-day[aria-pressed="true"]{background:#b084f321;border-color:#bba1f044;color:#f7eaff}.v5-day[aria-pressed="true"] i{background:#fff;border-color:#8c79ed;box-shadow:0 0 0 3px #74d9ef66,0 0 18px #be8aff80}.v5-day b{font-size:12px;font-weight:500}.v5-day-detail{font-size:10px;color:#c7b6dc;min-height:16px;margin:12px 0 0}.overview-upcoming{margin-top:18px}#targetOverview:empty,#mockOverview:empty{display:none}
/* Orbital timer: the progress arc remains the timer's source of truth. */
#focus-session{max-width:520px;margin:auto}#focus-session .pagehead{margin:10px 0 0}#focus-session .pagehead h1{font-size:22px}#focus-session .pagehead p{font-size:11px}#focus-session .timerbox{background:transparent;border:0;box-shadow:none;backdrop-filter:none;padding:8px 0 20px;overflow:visible}#focus-session .timerbox:before{inset:0 -20px 140px;background:radial-gradient(ellipse at 50% 38%,#8c28db22,transparent 64%)}.timerlabel{display:none}.timer{width:min(85vw,354px);height:min(85vw,354px);max-width:354px;max-height:354px;margin:6px auto 15px;isolation:isolate}.timer>svg:not(.orb-field){inset:12%;width:76%;height:76%;z-index:1;filter:drop-shadow(0 0 7px #8d68fa)}.timer .track{stroke:#a07aff0d;stroke-width:1}.timer .arc{stroke-width:1.2;opacity:.8}.timer .orb-field{position:absolute;inset:0;width:100%;height:100%;transform:none;overflow:visible;z-index:0}.orb-field .orbit{fill:none;stroke-width:.7;mix-blend-mode:screen;transform-origin:180px 180px;animation:orbit-turn 24s linear infinite}.orb-field .orbit.alt{animation-direction:reverse;animation-duration:32s}.orb-field .nebula{animation:nebula-pulse 6s ease-in-out infinite;transform-origin:center}.timertext{z-index:2}.timertext strong{font-size:clamp(54px,15vw,76px);letter-spacing:-3px;font-weight:800;color:#f0eeff;text-shadow:0 0 12px #af8dff80,0 0 28px #6ad9ff50}.timertext small{font-size:9px;letter-spacing:1.7px;color:#efd0a0;margin-top:13px}.session-task{border:1px solid #d7b27970;border-radius:18px;padding:11px 13px;background:linear-gradient(115deg,#d5a45412,#b9a4fb12);box-shadow:inset 0 1px #fff3,0 0 20px #e6ac6a09;margin:17px 0 0}.session-task label{color:#f2d1a0;font-size:10px;text-align:left}.session-task select{border:0!important;box-shadow:none!important;background:transparent!important;padding:2px 0!important;min-height:30px!important;font-size:13px}.timercontrols{gap:12px;margin:20px auto}.timercontrols .round{width:49px;height:54px;border-radius:17px;background:var(--gradient-glass);border-color:#ffffff26;font-size:22px}.timercontrols .round.big{height:54px;max-width:none;font-size:14px;border-radius:20px}.timercontrols .round.finish{width:74px;height:54px;border-radius:15px;font-size:13px}.timercontrols .round.finish small{font-size:9px}.timer-help{font-size:10px;line-height:1.6;color:#a89cbb;margin:0 auto 20px;max-width:340px}.focus-options{border:1px solid var(--line);border-radius:20px;background:var(--gradient-glass);display:flex;flex-wrap:wrap;padding:12px;gap:10px;align-items:center;justify-content:space-between}.focus-options label{display:flex;align-items:center;gap:8px;flex-direction:row-reverse;max-width:50%;font-size:10px;color:#d4c9e4}.focus-options input,.v5-alert-toggle{appearance:none;width:34px;height:21px;min-width:34px;border-radius:999px;background:#4b3b5b;border:1px solid #ffffff25;position:relative;margin:0;cursor:pointer}.focus-options input:before,.v5-alert-toggle:before{content:"";position:absolute;width:15px;height:15px;background:#d9cde5;top:2px;left:2px;border-radius:50%;transition:transform .2s,background .2s}.focus-options input:checked{background:#3abf8b44;border-color:#59dcaa88}.focus-options input:checked:before{transform:translateX(13px);background:#72efbe;box-shadow:0 0 9px #5ee4b550}.v5-alert-control{display:flex;align-items:center;gap:7px;font-size:10px}.v5-alert-toggle{padding:0;min-height:21px}.v5-alert-toggle[aria-checked="true"]{background:#e8b76b40;border-color:#eecb8c88}.v5-alert-toggle[aria-checked="true"]:before{transform:translateX(13px);background:#f3c98c}.focus-options #focusAlertStatus{flex-basis:100%;font-size:9px;text-align:center}.v5-alert-original{display:none!important}
/* Cognitive hub: a true asymmetric bento with local iridescent vector art. */
#planner .hub-head{text-align:center;margin:24px 0 28px}#planner .hub-head .eyebrow{font-size:9px;color:#d0a3fa}#planner .hub-head h1{font-size:clamp(25px,5vw,34px);letter-spacing:-1px}#planner .hub-head p{font-size:12px}.v5-bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:100px;gap:12px}.v5-bento>.hub-banner,.v5-bento>.hub-tile{--tool-color:#b38bff;position:relative;overflow:hidden;margin:0;padding:19px 16px;border-radius:24px;border:1px solid #ffffff22;background:radial-gradient(ellipse at 70% 0%,color-mix(in srgb,var(--tool-color) 13%,transparent),transparent 75%),var(--gradient-glass);backdrop-filter:blur(16px);display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:12px;min-height:0;grid-row:span 2;isolation:isolate;transition:transform var(--motion-fast) var(--ease),border-color var(--motion-fast),box-shadow var(--motion-fast)}.v5-bento>[data-go="schedule"]{grid-row:span 3;background:radial-gradient(ellipse at 80% 10%,#eab0fd88,transparent 70%),linear-gradient(145deg,#ba75e9,#8b5bf0 65%,#634ed0);border-color:#d7afff99;box-shadow:inset 0 1px #fff5,0 15px 40px #7041c61a}.v5-bento>[data-go="goals"]{--tool-color:#5ee4b5}.v5-bento>[data-go="mocks"]{grid-column:2;grid-row:3 / span 3;background:radial-gradient(ellipse at 0% 100%,#ea55e788,transparent 75%),linear-gradient(130deg,#c786f3,#7564e2);border-color:#d6a9ff90;--tool-color:#f28ade}.v5-bento>[data-go="mistakes"]{grid-column:1;grid-row:4 / span 3;--tool-color:#f3c98c}.v5-bento>[data-go="analytics"]{grid-row:span 2;--tool-color:#67e8f9}.v5-bento>[data-go="notes"],.v5-bento>[data-go="weekly-review"]{grid-row:span 2}.v5-bento>[data-go="weekly-review"]{--tool-color:#7dd3fc}.v5-bento>[data-go="notes"]{--tool-color:#f3c98c}.v5-bento>.hub-tile:before,.v5-bento>.hub-banner:before{content:"";pointer-events:none;position:absolute;inset:0;border-radius:inherit;background:linear-gradient(125deg,#ffffff19,transparent 30%,transparent 65%,#ffffff06);z-index:-1}.v5-bento>.hub-tile:after,.v5-bento>.hub-banner:after{content:"";position:absolute;top:16px;right:15px;width:5px;height:5px;border-radius:50%;background:var(--tool-color);box-shadow:0 0 10px var(--tool-color)}.v5-bento .hub-copy b{font-size:17px;font-weight:650;letter-spacing:-.5px}.v5-bento .hub-copy small{font-size:10px;line-height:1.6;color:#c3b6d7;margin-top:4px}.v5-bento>[data-go="schedule"] small,.v5-bento>[data-go="mocks"] small{color:#f3e5ff}.v5-bento .hub-copy{flex:0}.v5-bento .hub-arrow{display:none}.v5-bento .hub-icon{width:100%;height:auto;min-height:68px;flex:1;background:none;border:0;box-shadow:none;display:grid;place-items:center;border-radius:0}.v5-bento .hub-icon svg{width:104px;height:104px;max-width:100%;overflow:visible;filter:drop-shadow(0 12px 14px #0c05274d);transform:rotate(-8deg);transition:transform .28s var(--ease)}.v5-bento>[data-go="schedule"] .hub-icon svg{width:136px;height:136px}.hub-banner,.hub-tile{border-color:var(--line);background:var(--gradient-glass)}.hub-icon{background:#ab75f522;color:#d4adfc}.hub-icon.blue{background:#61d5ec17;color:var(--cyan)}.hub-icon.gold{background:#f3c98c17;color:var(--orange)}
.tabs{background:#140d21d9;border-top:1px solid #d4aaff18;backdrop-filter:blur(24px);padding:9px 12px calc(9px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px #0b081340;gap:8px}.tab{min-height:60px;max-width:150px;border-radius:18px;padding:7px 4px;gap:6px;font-size:9px;color:#a89aba}.tab .ico,.tab:nth-child(n) .ico,.planner-tab .ico{width:26px;min-width:26px;height:26px;background:transparent!important;border:0!important;border-radius:0;box-shadow:none!important;color:#bdadd4!important}.tab .nav-symbol svg{width:21px;height:21px}.tab.active{background:linear-gradient(145deg,#b87bef30,#79569f25);border:1px solid #c59ce534;color:#f1e6ff;box-shadow:inset 0 1px #ffffff10}.tab.active .ico{color:#e7c49b!important}.toast{bottom:calc(96px + env(safe-area-inset-bottom));max-width:90vw;text-align:center;background:#eee0ff;color:#27173d}.v5-about{padding:22px!important;margin-bottom:16px;display:flex;gap:15px;align-items:center;background:radial-gradient(ellipse at 90% 0%,#9a45ea33,transparent 75%),var(--gradient-glass)}.v5-about-mark{font-size:24px;font-weight:800;color:#debdff;text-shadow:0 0 22px #b177ff66}.v5-about h2{font-size:16px;margin:0 0 4px}.v5-about p{font-size:11px;color:var(--muted);margin:0}.v5-release{font-size:9px;letter-spacing:1.5px;color:#bca2dc;margin-top:6px}.screen:not(.hidden){animation:screen-arrive .28s var(--ease)}
@keyframes orbit-turn{to{transform:rotate(360deg)}}@keyframes nebula-pulse{50%{opacity:.6;transform:scale(.97)}}@keyframes screen-arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(hover:hover){.v5-bento>.hub-tile:hover,.v5-bento>.hub-banner:hover{transform:translateY(-3px);border-color:#d5b1fb65;box-shadow:0 12px 36px #a14fe51a}.v5-bento button:hover .hub-icon svg{transform:rotate(0) translateY(-3px)}.primary:hover,.gradient-button:hover{box-shadow:0 8px 32px #b45bf770}}button:active{transform:scale(.975)}
@media(min-width:721px){.wrap,.top{max-width:1020px}.overview-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.overview-progress .v5-track-main{grid-template-columns:160px minmax(0,1fr)}.overview-progress .ring{width:150px;height:150px}.v5-wave svg{height:150px}.v5-bento{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:105px}.v5-bento>[data-go]{grid-column:auto;grid-row:span 2}.v5-bento>[data-go="schedule"]{grid-row:span 4}.v5-bento>[data-go="notes"],.v5-bento>[data-go="weekly-review"]{grid-row:span 2}.v5-bento .hub-copy b{font-size:20px}#planner .hub-head{text-align:left}}
@media(max-width:360px){.wrap{padding-inline:14px}.top{padding-inline:14px}.brand small{font-size:9px}.overview-stats .card{padding:13px 10px;gap:8px}.stat strong{font-size:23px}.v5-track-main{grid-template-columns:108px minmax(0,1fr);gap:8px}.overview-progress .ring{width:108px;height:108px}.v5-bento{gap:10px;grid-auto-rows:95px}.v5-bento>.hub-tile,.v5-bento>.hub-banner{padding:16px 12px}.v5-bento .hub-copy b{font-size:16px}.v5-bento .hub-icon svg{width:90px;height:90px}.focus-options{padding:10px;gap:8px}.v5-alert-control{font-size:9px}}
@supports not (backdrop-filter:blur(1px)){.card,.glass-card,.hub-tile,.hub-banner,.tabs{background-color:#21192f}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.orb-field .nebula{opacity:.8}}
/* Explicit session scope overrides the previous release's ID-scoped sizing. */
#focus-session .timer{width:min(85vw,354px);height:min(85vw,354px);margin:6px auto 15px}
#focus-session .timertext strong{font-size:clamp(54px,15vw,76px)}
.focus-options{flex-direction:row}.focus-options .v5-alert-control{flex-direction:row;max-width:none}
.logo{overflow:hidden}.logo img{width:100%;height:100%;object-fit:cover}
@media(max-width:360px){.v5-track-main{grid-template-columns:108px minmax(0,1fr)}}
.timer .orb-field circle{stroke-width:0}
.focus-options input{padding:0;min-height:21px}
.pagehead h1,.hub-copy b{overflow-wrap:anywhere}

/* V5.1 · consistent scale, luminous icon family and floating glass navigation. */
:root{--radius-card:22px;--surface-edge:rgba(218,193,255,.14);--surface-glass:linear-gradient(140deg,rgba(203,171,255,.075),rgba(255,255,255,.025));--md-surface-high:rgba(183,148,255,.07)}
/* Equal-size hub cards on every breakpoint. Content can grow with larger text. */
#planner .v5-bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:auto;align-items:stretch;gap:12px}
#planner .v5-bento>[data-go]{grid-column:auto;grid-row:auto;min-height:194px;padding:17px 15px;display:grid;grid-template-rows:94px 1fr;gap:10px;border-radius:22px;background:radial-gradient(ellipse at 75% 0%,color-mix(in srgb,var(--tool-color) 15%,transparent),transparent 70%),var(--surface-glass);border:1px solid var(--surface-edge);box-shadow:inset 0 1px #ffffff12,0 10px 30px #09031322}
#planner .v5-bento>[data-go="schedule"]{--tool-color:#b794ff}#planner .v5-bento>[data-go="mocks"]{--tool-color:#f08acb}
#planner .v5-bento .hub-icon{width:100%;height:94px;min-height:0;flex:initial;align-self:center;justify-self:center}
#planner .v5-bento>[data-go] .hub-icon svg{width:92px;height:92px;max-width:100%;transform:rotate(-5deg);filter:drop-shadow(0 9px 9px #08021877) drop-shadow(0 0 9px color-mix(in srgb,var(--tool-color) 15%,transparent))}
#planner .v5-bento .hub-copy{align-self:start;margin:0}#planner .v5-bento .hub-copy b{font-size:15px;line-height:1.3;font-weight:650;letter-spacing:-.35px}#planner .v5-bento .hub-copy small{font-size:10px;line-height:1.5;margin-top:5px;color:#b7aacb}#planner .v5-bento>[data-go]:after{width:4px;height:4px;top:14px;right:14px}
#planner .hub-head{margin:19px 0 22px}#planner .hub-head h1{font-size:27px}
/* The same material applies to detail pages, editors, metrics and dialogs. */
.card,.glass-card,.note-card,.goal-card,.calendar-card,.session-card,.feature-entry,.feature-section,.feature-metric,.feature-day,.feature-weakness>div,.correction-action{border-color:var(--surface-edge);background:var(--surface-glass);box-shadow:inset 0 1px #ffffff09,0 8px 30px #08031220;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.card{border-radius:22px}.feature-entry,.note-card,.feature-section,.feature-metric,.correction-action{border-radius:18px}.feature-entry,.note-card,.feature-section{padding:16px}.feature-copy,.note-card p,.event small{color:var(--muted)}
.pagehead{position:relative}.pagehead h1{display:flex;align-items:center;gap:10px;line-height:1.25}.pagehead h1:focus{outline:none}.page-icon{display:inline-grid;place-items:center;flex:none;width:36px;height:36px;border:1px solid #ccb1ff25;border-radius:12px;background:linear-gradient(145deg,#ad7bfb23,#70daf00c);box-shadow:inset 0 1px #fff2,0 0 20px #a977ef10;color:#d1b5ff}.page-icon svg{width:21px;height:21px;filter:drop-shadow(0 0 5px #b78aff44)}
#planner .pagehead h1{display:block}.feature-screen-top .page-icon{display:none}.feature-screen-top h1{font-size:27px}.feature-metric strong{font-size:23px}.feature-progress{background:#c6a3fc12;height:7px}.feature-progress>span{background:linear-gradient(90deg,#ab80f7,#75dbe8);box-shadow:0 0 12px #a17ee944}
.feature-review-action,.feature-live,.feature-callout{background:linear-gradient(120deg,#b28af515,#79d9e607);border-color:#bfa0f52b;border-radius:16px}.feature-modal .cardhead{background:#1b1228f5;backdrop-filter:blur(20px);border-bottom:1px solid var(--surface-edge)}
.secondary,.iconbtn,.filter{background:linear-gradient(145deg,#d7c0ff0c,#ffffff04);border-color:#c4a4f529;box-shadow:inset 0 1px #ffffff0a}.secondary{border-radius:13px}.filter.active{background:linear-gradient(110deg,#bb80f72b,#73d1eb0f);border-color:#bc9be75c}.task{background:var(--surface-glass);border-color:var(--surface-edge);padding:13px}.pill.high,.feature-badge.overdue{background:#ec73951c;color:#f7a6bd}.pill.medium,.feature-badge.warn{background:#e6b67418;color:#eac994}.pill.low,.feature-badge.good{background:#5cd9af18;color:#8ae6c5}
.staticon,.overview-stats .staticon{width:38px;height:38px;min-width:38px;border:1px solid #cfb4ff20;border-radius:13px;background:linear-gradient(145deg,#b77cf529,#6b63b416);box-shadow:inset 0 1px #ffffff22,0 4px 15px #9e62df12;color:#d1b1ff}.staticon svg{width:22px;height:22px;filter:drop-shadow(0 0 5px currentColor)}.overview-stats .task-icon{background:linear-gradient(145deg,#56daaf22,#237e6210);border-color:#5bd8ae25;color:#7fe2b9}.overview-stats .streak-icon{background:linear-gradient(145deg,#efc28720,#9d703c12);border-color:#e2b46e25;color:#efd0a2}.overview-stats .goal-icon{background:linear-gradient(145deg,#bc82ed27,#8d66d610)}
/* Calendar uses the same violet/cyan lighting rather than flat outlined boxes. */
#schedule>.card:first-of-type{background:radial-gradient(ellipse at 100% 0%,#a457e719,transparent 65%),var(--surface-glass);border-color:#c8abf830;padding:18px}
.calendarhead{margin-bottom:16px;gap:10px}.calendarhead b{font-size:17px;letter-spacing:-.45px;color:#f4eaff}.calendarhead .secondary{width:38px;min-width:38px;min-height:38px;height:38px;padding:0;border-radius:13px;color:#d4b8ff;font-size:23px}.calendar{gap:6px}.dayname{font-size:10px;letter-spacing:.4px;color:#b6a2d0;padding:5px 0 8px}
#schedule .day{border-radius:13px;border:1px solid #c9acfc12;background:linear-gradient(145deg,#d3b6ff09,#ffffff02);color:#e9def7;font-size:12px;box-shadow:inset 0 1px #ffffff07;transition:background .16s,transform .16s,box-shadow .16s;min-width:0}
#schedule .day.muted{opacity:.2;border-color:#c9acfc0b;background:transparent;pointer-events:none}
#schedule .day.today{border-color:#a47ee754;box-shadow:inset 0 0 0 1px #b58cf12b,0 0 12px #a478dc0e;color:#d8bbff}
#schedule .day.selected{background:linear-gradient(145deg,#ab6ee752,#746bdf36);border-color:#c8a2ff9e;color:white;box-shadow:inset 0 1px #fff3,0 3px 18px #a06fea29}
#schedule .day.has:after{width:4px;height:4px;bottom:5px;background:#7ae7ea;box-shadow:0 0 7px #6de2f399}#schedule .day.selected.has:after{background:#f6d19b;box-shadow:0 0 7px #f5c59088}
.schedulelist{gap:4px}.slot{grid-template-columns:43px minmax(0,1fr);gap:9px;min-height:70px}.slot time{padding-top:17px;font-size:10px;color:#b19dc9;font-variant-numeric:tabular-nums}.slotcontent{border-left:1px solid #9b72de42;padding:5px 0 10px 12px}.slotcontent:before{width:7px;height:7px;left:-4px;top:21px;background:#ba92f3;box-shadow:0 0 9px #b28ae066;border:1px solid #d9c5ff66}
.event{--event-accent:#bba0ed;position:relative;padding:12px 13px;border:1px solid #c8a5ef1a;border-left:2px solid var(--event-accent);border-radius:15px;background:radial-gradient(ellipse at 0% 0%,color-mix(in srgb,var(--event-accent) 9%,transparent),transparent 70%),linear-gradient(140deg,#ffffff06,#ffffff02);box-shadow:inset 0 1px #ffffff07}.event b{font-size:12px;line-height:1.4;font-weight:650}.event small{font-size:10px;line-height:1.6;display:block;margin-top:4px}.event .linkbtn{font-size:10px;min-height:34px;padding:5px 9px;border-radius:10px;background:#bf9bf50b;color:#cdb5f2}.event>div{margin-top:5px}
/* Float the navigation as one cohesive glass dock with sculpted icon tiles. */
body{padding-bottom:calc(115px + env(safe-area-inset-bottom))}
.tabs{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));max-width:560px;margin-inline:auto;border:1px solid #d4b9ff30;border-radius:26px;gap:5px;padding:7px;background:linear-gradient(135deg,#2c1d3fec,#171020f2);box-shadow:inset 0 1px #ffffff14,0 12px 40px #06020c80,0 0 30px #ab65ef08;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);overflow:visible}
.tabs .tab{--nav-color:#bea3f5;min-height:65px;max-width:none;min-width:0;gap:5px;border-radius:19px;position:relative;padding:6px 3px;color:#ad9bbb;font-size:9px;transition:background .2s,transform .16s}
.tabs .overview-tab{--nav-color:#89dcfa}.tabs .tasks-tab{--nav-color:#8be6c3}.tabs .planner-tab{--nav-color:#d1a7ff}.tabs .focus-tab{--nav-color:#f0c891}
.tabs .tab:nth-child(n) .ico{display:grid;place-items:center;width:33px;height:32px;min-width:33px;border-radius:11px;background:linear-gradient(145deg,color-mix(in srgb,var(--nav-color) 16%,transparent),#ffffff03)!important;border:1px solid color-mix(in srgb,var(--nav-color) 22%,transparent)!important;color:var(--nav-color)!important;box-shadow:inset 0 1px #ffffff17,0 3px 10px #0002!important;overflow:visible;transform:none}
.tabs .nav-symbol svg{width:20px;height:20px;stroke-width:1.65;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--nav-color) 25%,transparent))}
.tabs .tab.active{border-color:color-mix(in srgb,var(--nav-color) 25%,transparent);background:linear-gradient(150deg,color-mix(in srgb,var(--nav-color) 14%,transparent),#ab7af007);color:#f4eaff;box-shadow:inset 0 1px #ffffff0d}
.tabs .tab.active:after{content:"";position:absolute;width:13px;height:2px;border-radius:999px;bottom:3px;left:calc(50% - 6.5px);background:var(--nav-color);box-shadow:0 0 7px var(--nav-color)}
.tabs .tab.active .ico{background:linear-gradient(140deg,color-mix(in srgb,var(--nav-color) 27%,transparent),#bd8be810)!important;box-shadow:inset 0 1px #ffffff35,0 0 12px color-mix(in srgb,var(--nav-color) 10%,transparent)!important}
.tabs .session-dot{top:-2px;right:-2px;border:2px solid #271b37;width:8px;height:8px;box-shadow:0 0 6px #8ae8c777}.toast{bottom:calc(106px + env(safe-area-inset-bottom))}
#cloudBadge{border-radius:16px;border-color:#c7a1ec22;background:linear-gradient(115deg,#ac7df415,#70cbe907);color:#cdbce1;font-size:10px!important;padding:12px 14px}
@media(min-width:721px){#planner .v5-bento{grid-template-columns:repeat(3,minmax(0,1fr))}#planner .v5-bento>[data-go]{grid-row:auto;grid-column:auto;min-height:204px;grid-template-rows:100px 1fr}#planner .v5-bento .hub-copy b{font-size:16px}.calendar{gap:9px}#schedule .day{font-size:14px}.page-icon{width:40px;height:40px}}
@media(max-width:360px){#planner .v5-bento{gap:10px}#planner .v5-bento>[data-go]{padding:14px 12px;min-height:184px;grid-template-rows:85px 1fr}#planner .v5-bento>[data-go] .hub-icon svg{width:82px;height:82px}#planner .v5-bento .hub-icon{height:85px}#planner .v5-bento .hub-copy b{font-size:14px}.calendar{gap:4px}#schedule .day{border-radius:10px;font-size:11px}.tabs{left:8px;right:8px;border-radius:23px}.tabs .tab{min-height:63px}}
@media(hover:hover){#schedule .day:not(.muted):hover{background:#bb8bf520;border-color:#c4a0ef55}.v5-bento>[data-go]:hover .hub-icon svg{transform:rotate(0) translateY(-2px)}.tabs .tab:hover{background:#ffffff06}}
@supports not (backdrop-filter:blur(1px)){.tabs,.feature-entry,.note-card,.feature-section{background-color:#21182e}}
#resetTimer svg{width:22px;height:22px;color:#c9b1ee}#finishTimer span svg{width:16px;height:16px;color:#d7c4f3}.iconbtn svg{width:21px;height:21px}.hub-icon svg{filter:drop-shadow(0 6px 8px #a269e533)}

#focus .hub-icon{width:56px;height:56px;background:transparent;border:0;flex:none}#focus .hub-icon svg{width:54px;height:54px;overflow:visible}

/* Every hub row adopts the tallest content, including enlarged text. */
#planner .v5-bento{grid-auto-rows:1fr}

/* V6: explicit hit-testing and nonblocking installed-window recovery. */
.orb-field,.page-icon,.staticon svg,.hub-icon svg,.nav-symbol svg{pointer-events:none}
.card:before,.card:after,.hub-tile:before,.hub-tile:after,.hub-banner:before,.hub-banner:after,.tab:before,.tab:after{pointer-events:none}
.modalback.hidden,.modalback[hidden]{display:none!important;pointer-events:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.screen.hidden{display:none!important;pointer-events:none!important}
#windowNotice{position:fixed;z-index:60;top:calc(10px + env(safe-area-inset-top));left:12px;right:12px;max-width:540px;margin:auto;padding:15px 17px;border:1px solid #c7a2f650;border-radius:20px;background:#20152ff5;box-shadow:0 10px 40px #0007;backdrop-filter:blur(16px);pointer-events:auto}
#windowNotice[hidden]{display:none!important;pointer-events:none!important}
#windowNotice p{font-size:12px;color:#e2d4f5;line-height:1.5;margin:0 0 10px}#windowNotice>div{display:flex;gap:8px;flex-wrap:wrap}#windowNotice button{font-size:12px;min-height:42px;padding:9px 13px}
@media(display-mode:standalone){html,body{min-height:100%;isolation:isolate}.tabs{z-index:25}.modalback{z-index:40}.screen:not(.hidden){animation:none}.card,.hub-banner,.hub-tile,.feature-entry,.feature-metric,.note-card,.event{backdrop-filter:none;-webkit-backdrop-filter:none}.tabs{background:linear-gradient(135deg,#2c1d3ff5,#171020fa)}}

@media(display-mode:standalone){*,*:before,*:after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}
