/* PACK 150 — Athletic Dark mold (Sora · dark · single accent · 460px) */
:root{
  --bg:#0b1016;--bg2:#0a0e13;--bg3:#111821;
  --surface:rgba(255,255,255,.04);--surface2:rgba(255,255,255,.07);
  --line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.05);
  --text:#eef5f0;--dim:#95a3a0;--mute:#6f7d7a;--head:#f7fbf8;--oncard:#d3ddd7;
  --acc:#5ff07f;--acc-deep:#2fd35c;--acc-soft:rgba(95,240,127,.14);
  --orange:#ff9548;--red:#ff6b6b;--gold:#ffcf6a;--ink:#06210f;
  --f:'Sora',system-ui,-apple-system,sans-serif;
  --track:rgba(255,255,255,.09);
  --shadow:0 22px 55px -22px rgba(0,0,0,.6);--shadow-card:0 12px 30px -16px rgba(0,0,0,.55);
  --shadow-btn:0 10px 26px -8px rgba(95,240,127,.55);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--f);background:radial-gradient(120% 55% at 50% -8%,rgba(95,240,127,.13),transparent 60%),linear-gradient(180deg,var(--bg),var(--bg2));color:var(--text);-webkit-font-smoothing:antialiased;min-height:100dvh;display:flex;justify-content:center}
button{font-family:inherit;color:inherit;background:none;border:none;cursor:pointer;touch-action:manipulation}
input,textarea{font-family:inherit}
.bgfx{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.bgfx i{position:absolute;border-radius:50%;filter:blur(64px);opacity:.5}
.bgfx .b1{width:380px;height:380px;background:radial-gradient(circle,rgba(95,240,127,.14),transparent 70%);top:-110px;left:-120px;animation:drift1 16s ease-in-out infinite alternate}
.bgfx .b2{width:330px;height:330px;background:radial-gradient(circle,rgba(95,240,127,.09),transparent 70%);bottom:-90px;right:-100px;animation:drift2 19s ease-in-out infinite alternate}
.bgfx .b3{width:250px;height:250px;background:radial-gradient(circle,rgba(45,212,191,.07),transparent 70%);top:38%;right:-60px;animation:drift3 22s ease-in-out infinite alternate}
@keyframes drift1{to{transform:translate(70px,50px) scale(1.15)}}
@keyframes drift2{to{transform:translate(-60px,-45px) scale(1.1)}}
@keyframes drift3{to{transform:translate(-45px,60px) scale(1.2)}}

#shell{width:100%;max-width:460px;min-height:100dvh;display:flex;flex-direction:column;position:relative;z-index:1}
#topbar{padding:calc(14px + env(safe-area-inset-top)) 20px 10px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;background:linear-gradient(180deg,rgba(11,16,22,.98),rgba(11,16,22,.85));backdrop-filter:blur(10px)}
.brand{display:flex;align-items:center;gap:9px}
.brand .mark{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,var(--acc),var(--acc-deep));display:grid;place-items:center;color:var(--ink);font-weight:800;font-size:11px;letter-spacing:-.02em;box-shadow:0 6px 16px -6px rgba(95,240,127,.7)}
.brand .wm{font-size:11px;letter-spacing:.2em;font-weight:800;text-transform:uppercase;line-height:1.15}
.brand .wm i{color:var(--acc);font-style:normal}
.brand .wm small{display:block;font-size:8.5px;letter-spacing:.14em;color:var(--dim);font-weight:700}
.tb-right{display:flex;align-items:center;gap:8px}
.pill{font-size:10.5px;font-weight:700;padding:6px 10px;border-radius:99px;background:var(--surface2);border:1px solid var(--line);color:var(--dim);letter-spacing:.02em;white-space:nowrap}
.pill b{color:var(--acc)}

#main{flex:1;padding:6px 20px calc(96px + env(safe-area-inset-bottom))}
.view{animation:stepIn .3s ease both;display:flex;flex-direction:column}
@keyframes stepIn{from{opacity:0}to{opacity:1}}
.view>*{animation:childIn .5s cubic-bezier(.22,1,.36,1) backwards}
.view>*:nth-child(2){animation-delay:.05s}.view>*:nth-child(3){animation-delay:.1s}.view>*:nth-child(4){animation-delay:.15s}.view>*:nth-child(5){animation-delay:.2s}.view>*:nth-child(6){animation-delay:.25s}.view>*:nth-child(7){animation-delay:.3s}
@keyframes childIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.rows>*{animation:optIn .45s cubic-bezier(.22,1,.36,1) backwards}
.rows>*:nth-child(1){animation-delay:.08s}.rows>*:nth-child(2){animation-delay:.14s}.rows>*:nth-child(3){animation-delay:.2s}.rows>*:nth-child(4){animation-delay:.26s}.rows>*:nth-child(5){animation-delay:.32s}.rows>*:nth-child(6){animation-delay:.38s}
@keyframes optIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}

.eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);font-weight:700;margin:8px 0 12px;display:flex;align-items:center;gap:8px}
.eyebrow:before{content:"";width:16px;height:2px;background:var(--acc);border-radius:2px}
h1{font-size:26px;line-height:1.18;font-weight:800;letter-spacing:-.02em;margin-bottom:10px;color:var(--head)}
h1 .hl{color:var(--acc)}
h2{font-size:15px;font-weight:800;letter-spacing:-.01em;margin:24px 0 12px;display:flex;align-items:center;gap:8px;color:var(--head)}
h2 .cnt{font-size:10.5px;font-weight:700;color:var(--dim);background:var(--surface2);border:1px solid var(--line);padding:3px 8px;border-radius:99px;letter-spacing:.02em}
h2 .more{margin-left:auto;font-size:12px;color:var(--acc);font-weight:700}
.sub{font-size:14px;line-height:1.55;color:var(--dim);margin-bottom:18px}
.sub b{color:var(--text);font-weight:700}

.cta{width:100%;background:linear-gradient(90deg,var(--acc),var(--acc-deep));color:var(--ink);font-weight:800;font-size:15.5px;padding:16px;border-radius:14px;box-shadow:var(--shadow-btn),inset 0 1px 0 rgba(255,255,255,.4);transition:transform .15s;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:8px}
.cta:active{transform:scale(.98)}
.cta:after{content:"";position:absolute;top:0;left:0;width:55%;height:100%;background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.35) 50%,transparent 80%);transform:translateX(-170%) skewX(-18deg);animation:ctashine 3.4s ease-in-out infinite}
@keyframes ctashine{0%,55%{transform:translateX(-170%) skewX(-18deg)}90%,100%{transform:translateX(330%) skewX(-18deg)}}
.cta.ghost{background:var(--surface);border:1.5px solid var(--line);color:var(--text);box-shadow:none}
.cta.ghost:after{display:none}
.cta.sm{padding:12px;font-size:13.5px;border-radius:12px}
.cta:disabled{opacity:.4;box-shadow:none}
.btnnote{text-align:center;font-size:11.5px;color:var(--dim);margin-top:10px}
.btnnote b{color:var(--acc)}
.btnrow{display:flex;gap:10px}
.btnrow .cta{flex:1}

.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-card);overflow:hidden}
.card .in{padding:16px}
.stats{display:flex;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-card);overflow:hidden}
.stats .s{flex:1;text-align:center;padding:14px 6px}
.stats .s+.s{border-left:1px solid var(--line2)}
.stats .s b{display:block;font-size:22px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.stats .s b.acc{color:var(--acc)}
.stats .s span{font-size:10.5px;color:var(--dim);display:block;margin-top:6px}

/* onboarding options */
.opts{display:flex;flex-direction:column;gap:10px}
.opt{display:flex;align-items:center;gap:13px;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:15px;text-align:left;box-shadow:var(--shadow-card);transition:.15s;animation:optIn .45s cubic-bezier(.22,1,.36,1) backwards}
.opts .opt:nth-child(2){animation-delay:.07s}.opts .opt:nth-child(3){animation-delay:.14s}.opts .opt:nth-child(4){animation-delay:.21s}.opts .opt:nth-child(5){animation-delay:.28s}.opts .opt:nth-child(6){animation-delay:.35s}
.opt .tick{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;display:grid;place-items:center}
.opt.sel{border-color:var(--acc);background:linear-gradient(100deg,rgba(95,240,127,.18),rgba(95,240,127,.05));box-shadow:0 0 0 3px rgba(95,240,127,.12)}
.opt.sel .tick{border-color:var(--acc);background:var(--acc)}
.opt.sel .tick:after{content:"";width:7px;height:7px;border-radius:50%;background:var(--ink)}
.opt .txt{font-size:14.5px;font-weight:600;color:var(--oncard);line-height:1.3}
.opt .txt small{display:block;font-size:11.5px;color:var(--dim);font-weight:500;margin-top:2px}
.opt .emoji{font-size:20px;width:26px;text-align:center}
.progress-wrap{display:flex;align-items:center;gap:10px;margin:4px 0 18px}
.bar{flex:1;height:6px;background:var(--track);border-radius:99px;overflow:hidden}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--acc-deep),var(--acc));border-radius:99px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:0 0 12px rgba(95,240,127,.7)}
.qcount{font-size:10.5px;font-weight:700;color:var(--acc);white-space:nowrap}

/* hero / today */
.hero{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:#0f1a14}
.hero .diag{width:100%;aspect-ratio:2/1;object-fit:cover;display:block;filter:saturate(1.05)}
.hero .cap{position:absolute;left:0;right:0;bottom:0;padding:44px 16px 14px;background:linear-gradient(180deg,transparent,rgba(6,12,9,.92))}
.hero .cap b{display:block;font-size:16px;font-weight:800;color:#fff}
.hero .cap span{font-size:12px;color:var(--dim)}
.badge{position:absolute;top:12px;left:12px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:6px 10px;border-radius:99px;background:rgba(6,12,9,.72);border:1px solid rgba(255,255,255,.14);color:var(--acc);backdrop-filter:blur(6px)}
.todaycard{background:linear-gradient(160deg,rgba(95,240,127,.14),rgba(95,240,127,.03)),var(--surface);border:1.5px solid rgba(95,240,127,.35);border-radius:18px;padding:16px;box-shadow:var(--shadow)}
.todaycard .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc);font-weight:700;margin-bottom:6px}
.todaycard .tt{font-size:19px;font-weight:800;color:var(--head);line-height:1.2}
.todaycard .ts{font-size:12.5px;color:var(--dim);margin:6px 0 12px}
.blocks{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.blk{display:flex;align-items:center;gap:10px;background:rgba(0,0,0,.25);border:1px solid var(--line2);border-radius:12px;padding:9px 10px}
.blk .thumb{width:58px;height:34px;border-radius:7px;overflow:hidden;flex-shrink:0;background:#0f1a14}
.blk .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.blk .t{flex:1;min-width:0}
.blk .t b{display:block;font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk .t span{font-size:11px;color:var(--dim)}
.blk .m{font-size:11px;font-weight:700;color:var(--dim);white-space:nowrap}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* section cards */
.secgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.seccard{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:16px;padding:14px;text-align:left;box-shadow:var(--shadow-card);overflow:hidden;transition:.15s;min-height:124px;display:flex;flex-direction:column;justify-content:flex-end}
.seccard:active{transform:scale(.98)}
.seccard:before{content:"";position:absolute;top:-40px;right:-40px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,var(--c),transparent 70%);opacity:.35}
.seccard .num{font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--c);text-transform:uppercase;margin-bottom:auto}
.seccard b{font-size:14px;font-weight:800;line-height:1.2;color:var(--head);display:block;margin-top:10px}
.seccard span{font-size:11px;color:var(--dim);display:block;margin-top:4px}
.seccard .sbar{height:4px;background:var(--track);border-radius:99px;margin-top:10px;overflow:hidden}
.seccard .sbar i{display:block;height:100%;background:var(--c);border-radius:99px}

/* rows */
.rows{display:flex;flex-direction:column;gap:8px}
.row{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px;text-align:left;box-shadow:var(--shadow-card);transition:.15s;width:100%}
.row:active{transform:scale(.99)}
.row .thumb{width:76px;height:44px;border-radius:9px;overflow:hidden;flex-shrink:0;background:#0f1a14;position:relative}
.row .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.row .thumb .n{position:absolute;left:0;top:0;font-size:9px;font-weight:800;padding:2px 5px;background:rgba(6,12,9,.8);color:var(--c,var(--acc));border-bottom-right-radius:6px}
.row .t{flex:1;min-width:0}
.row .t b{display:block;font-size:13.5px;font-weight:700;color:var(--head);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .t span{font-size:11.5px;color:var(--dim);display:block;margin-top:3px}
.row .go{color:var(--mute);width:18px;height:18px;flex-shrink:0}
.row .go svg{width:18px;height:18px}
.row.done .thumb:after{content:"✓";position:absolute;right:4px;bottom:3px;width:16px;height:16px;border-radius:50%;background:var(--acc);color:var(--ink);font-size:10px;font-weight:800;display:grid;place-items:center}
.row .ord{display:flex;flex-direction:column;gap:2px}
.row .ord button{width:26px;height:20px;border-radius:6px;background:var(--surface2);border:1px solid var(--line);color:var(--dim);font-size:11px;display:grid;place-items:center}
.row .ord button:disabled{opacity:.25}
.row .rm{width:28px;height:28px;border-radius:8px;color:var(--red);background:rgba(255,107,107,.1);display:grid;place-items:center;flex-shrink:0}

/* filters */
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;margin:0 -20px;padding-left:20px;padding-right:20px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex-shrink:0;font-size:12px;font-weight:700;padding:8px 13px;border-radius:99px;background:var(--surface);border:1.5px solid var(--line);color:var(--dim);white-space:nowrap;transition:.15s}
.chip.on{border-color:var(--acc);color:var(--acc);background:var(--acc-soft)}
.search{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-radius:13px;padding:0 14px;margin-bottom:10px}
.search svg{width:16px;height:16px;color:var(--mute);flex-shrink:0}
.search input{flex:1;background:none;border:none;color:var(--text);font-size:14.5px;padding:13px 0;outline:none}
.search input::placeholder{color:var(--mute)}
.empty{text-align:center;color:var(--dim);font-size:13px;padding:30px 10px;border:1px dashed var(--line);border-radius:14px}

/* detail sheet */
#sheet{position:fixed;inset:0;z-index:40;display:none;justify-content:center;background:rgba(4,8,6,.72);backdrop-filter:blur(6px)}
#sheet.open{display:flex}
#sheet .panel{width:100%;max-width:460px;background:var(--bg);min-height:100dvh;overflow-y:auto;animation:sheetIn .35s cubic-bezier(.22,1,.36,1);position:relative}
@keyframes sheetIn{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
.sheethead{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:calc(12px + env(safe-area-inset-top)) 16px 10px;background:linear-gradient(180deg,rgba(11,16,22,.98),rgba(11,16,22,.9));backdrop-filter:blur(10px)}
.sheethead .back{width:36px;height:36px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);display:grid;place-items:center;flex-shrink:0}
.sheethead .back svg{width:18px;height:18px}
.sheethead .ht{flex:1;min-width:0}
.sheethead .ht b{display:block;font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheethead .ht span{font-size:11px;color:var(--dim)}
.sheethead .fav{width:36px;height:36px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);display:grid;place-items:center;color:var(--dim)}
.sheethead .fav.on{color:var(--gold);border-color:rgba(255,207,106,.4)}
.sheethead .fav svg{width:18px;height:18px}
.sheetbody{padding:6px 20px calc(30px + env(safe-area-inset-bottom))}
.stage{border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:#0f1a14;position:relative}
.stage img{width:100%;display:block}
.sectag{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--c,var(--acc));margin:16px 0 8px}
.sectag .dot{background:var(--c,var(--acc))}
.objective{font-size:14px;line-height:1.5;color:var(--oncard);margin-bottom:14px}
.meta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.meta .m{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 8px;text-align:center}
.meta .m span{display:block;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);font-weight:700}
.meta .m b{display:block;font-size:12.5px;font-weight:700;margin-top:4px;color:var(--head);line-height:1.25}
.steps{display:flex;flex-direction:column;gap:10px}
.step{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--oncard)}
.step i{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--acc-soft);border:1px solid rgba(95,240,127,.35);color:var(--acc);font-style:normal;font-weight:800;font-size:12px;display:grid;place-items:center;margin-top:1px}
.keypoint{background:linear-gradient(100deg,rgba(255,149,72,.16),rgba(255,149,72,.04));border:1px solid rgba(255,149,72,.4);border-radius:14px;padding:14px;margin-top:18px}
.keypoint .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);font-weight:800;margin-bottom:6px;display:flex;align-items:center;gap:6px}
.keypoint p{font-size:14px;line-height:1.5;color:#f4dcc9;font-weight:600}
.progbox{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;margin-top:10px}
.progbox .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:800;margin-bottom:6px}
.progbox p{font-size:13.5px;line-height:1.5;color:var(--oncard)}
.actions{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.videobtn{display:flex;align-items:center;gap:12px;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;text-align:left;width:100%}
.videobtn .ic{width:38px;height:38px;border-radius:10px;background:rgba(255,107,107,.14);color:var(--red);display:grid;place-items:center;flex-shrink:0}
.videobtn .ic svg{width:18px;height:18px}
.videobtn b{display:block;font-size:13.5px}
.videobtn span{font-size:11.5px;color:var(--dim)}

/* runner */
.runner{min-height:calc(100dvh - 70px);display:flex;flex-direction:column}
.runner .stage{margin-bottom:14px}
.timer{text-align:center;padding:10px 0 4px}
.timer b{font-size:54px;font-weight:800;letter-spacing:-.03em;color:var(--acc);font-variant-numeric:tabular-nums;line-height:1;text-shadow:0 0 30px rgba(95,240,127,.4)}
.timer span{display:block;font-size:11px;color:var(--dim);letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin-top:6px}
.timer.over b{color:var(--orange)}
.runsteps{margin:10px 0 14px}
.runnav{margin-top:auto;display:flex;gap:10px;padding-top:12px}
.runnav .cta{flex:1}
.runprog{display:flex;gap:4px;margin-bottom:12px}
.runprog i{flex:1;height:4px;border-radius:99px;background:var(--track)}
.runprog i.on{background:var(--acc);box-shadow:0 0 8px rgba(95,240,127,.6)}
.runprog i.done{background:var(--acc-deep)}

/* progress bars */
.covrow{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line2)}
.covrow:last-child{border-bottom:none}
.covrow .n{width:110px;font-size:12px;font-weight:700;color:var(--oncard);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.covrow .bar{height:8px}
.covrow .bar>i{background:var(--c);box-shadow:none}
.covrow .v{width:40px;text-align:right;font-size:11.5px;font-weight:700;color:var(--dim);font-variant-numeric:tabular-nums}
.log{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line2)}
.log:last-child{border-bottom:none}
.log .d{width:44px;text-align:center;background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:6px 0;flex-shrink:0}
.log .d b{display:block;font-size:15px;font-weight:800;line-height:1}
.log .d span{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);font-weight:700}
.log .t{flex:1;min-width:0}
.log .t b{display:block;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.log .t span{font-size:11.5px;color:var(--dim)}
.streak{display:flex;gap:6px;margin-top:6px}
.streak i{flex:1;aspect-ratio:1;border-radius:8px;background:var(--surface2);border:1px solid var(--line);display:grid;place-items:center;font-size:9px;font-weight:700;color:var(--mute);font-style:normal}
.streak i.on{background:var(--acc-soft);border-color:rgba(95,240,127,.45);color:var(--acc)}

/* chat */
.coachhead{display:flex;align-items:center;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:var(--shadow-card)}
.av{width:56px;height:56px;border-radius:50%;flex-shrink:0;overflow:hidden;background:linear-gradient(160deg,#16362a,#0f1a14);border:2px solid rgba(95,240,127,.35);display:grid;place-items:center;position:relative}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.av svg{width:30px;height:30px;color:var(--acc)}
.av.sm{width:34px;height:34px;border-width:1.5px}
.av.sm svg{width:18px;height:18px}
.coachhead .t b{display:block;font-size:15px;font-weight:800}
.coachhead .t span{display:block;font-size:11.5px;color:var(--dim);margin-top:2px}
.online{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--acc);font-weight:700;margin-top:5px}
.online:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px rgba(95,240,127,.2)}
.chat{display:flex;flex-direction:column;gap:10px;margin:16px 0}
.msg{max-width:86%;padding:11px 14px;border-radius:16px;font-size:13.5px;line-height:1.5}
.msg.c{align-self:flex-start;background:var(--surface2);border:1px solid var(--line);border-bottom-left-radius:5px;color:var(--oncard)}
.msg.u{align-self:flex-end;background:linear-gradient(120deg,rgba(95,240,127,.28),rgba(95,240,127,.14));border:1px solid rgba(95,240,127,.35);border-bottom-right-radius:5px;color:var(--head)}
.msg b{color:var(--head)}
.msg .time{display:block;font-size:10px;color:var(--mute);margin-top:4px}
.typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:var(--surface2);border:1px solid var(--line);border-radius:16px;border-bottom-left-radius:5px}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--dim);animation:tp 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes tp{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
.quick{display:flex;gap:8px;overflow-x:auto;margin:0 -20px;padding:0 20px 10px;scrollbar-width:none}
.quick::-webkit-scrollbar{display:none}
.chatbar{position:fixed;left:0;right:0;bottom:calc(64px + env(safe-area-inset-bottom));display:flex;justify-content:center;z-index:25;pointer-events:none}
.chatbar .inner{width:100%;max-width:460px;padding:8px 20px 10px;display:flex;gap:8px;background:linear-gradient(180deg,transparent,var(--bg2) 30%);pointer-events:auto}
.chatbar input{flex:1;background:var(--surface2);border:1.5px solid var(--line);border-radius:13px;padding:13px 14px;color:var(--text);font-size:14px;outline:none}
.chatbar input:focus{border-color:var(--acc)}
.chatbar button{width:46px;height:46px;border-radius:13px;background:linear-gradient(135deg,var(--acc),var(--acc-deep));color:var(--ink);display:grid;place-items:center;box-shadow:var(--shadow-btn)}
.chatbar button svg{width:18px;height:18px}

/* playbook */
.princ{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line2)}
.princ:last-child{border-bottom:none}
.princ i{flex-shrink:0;width:28px;height:28px;border-radius:9px;background:var(--acc-soft);color:var(--acc);font-style:normal;font-weight:800;font-size:12px;display:grid;place-items:center}
.princ b{display:block;font-size:13.5px;font-weight:700;margin-bottom:3px}
.princ p{font-size:12.5px;line-height:1.5;color:var(--dim)}
.legend{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.leg{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:9px 10px}
.leg .sym{width:26px;height:18px;flex-shrink:0;display:grid;place-items:center}
.leg b{display:block;font-size:11px;font-weight:700;line-height:1.2}
.leg span{font-size:10px;color:var(--dim)}
.accord{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:8px}
.accord>button{width:100%;display:flex;align-items:center;justify-content:space-between;padding:14px;font-size:14px;font-weight:700;text-align:left}
.accord>button svg{width:16px;height:16px;color:var(--dim);transition:.2s}
.accord.open>button svg{transform:rotate(180deg)}
.accord .body{display:none;padding:0 14px 14px}
.accord.open .body{display:block}

/* nav */
#nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;z-index:30;pointer-events:none}
#nav .inner{width:100%;max-width:460px;display:flex;background:rgba(9,13,18,.94);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:6px 6px calc(8px + env(safe-area-inset-bottom));pointer-events:auto}
#nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 2px;color:var(--mute);font-size:10px;font-weight:700;border-radius:12px;transition:.15s}
#nav button svg{width:22px;height:22px}
#nav button.on{color:var(--acc)}
#nav button.on svg{filter:drop-shadow(0 0 6px rgba(95,240,127,.6))}

.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(20px);background:#17222b;border:1px solid var(--line);color:var(--text);padding:11px 16px;border-radius:12px;font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:.25s;z-index:60;white-space:nowrap;box-shadow:var(--shadow)}
.toast.show{opacity:1;transform:translateX(-50%)}
.toast.ok{border-color:rgba(95,240,127,.45)}
.field{margin-bottom:12px}
.field label{display:block;font-size:11px;letter-spacing:.06em;font-weight:700;color:var(--dim);margin-bottom:6px;text-transform:uppercase}
.field input{width:100%;background:var(--surface);border:1.5px solid var(--line);border-radius:13px;padding:14px;color:var(--text);font-size:15px;outline:none}
.field input:focus{border-color:var(--acc)}
.tiny{font-size:11px;color:var(--mute);line-height:1.5;margin-top:18px;text-align:center}
.bonus{display:flex;align-items:center;gap:12px;background:linear-gradient(120deg,rgba(255,107,107,.16),rgba(255,107,107,.04)),var(--surface);border:1.5px solid rgba(255,107,107,.35);border-radius:16px;padding:14px;text-align:left;width:100%}
.bonus .ic{width:44px;height:44px;border-radius:12px;background:rgba(255,107,107,.18);color:var(--red);display:grid;place-items:center;flex-shrink:0}
.bonus .ic svg{width:22px;height:22px}
.bonus b{display:block;font-size:14px}
.bonus span{font-size:11.5px;color:var(--dim)}
.cta svg,.pill svg{width:18px;height:18px;flex-shrink:0}
.log .pill{flex-shrink:0}
.k svg,.sectag svg{width:14px;height:14px;flex-shrink:0}
.av{position:relative}.av img{position:absolute;inset:0}
.dgsvg{width:100%;height:100%;display:block}
.stage .dgsvg,.hero .diag .dgsvg{height:auto;aspect-ratio:auto}
.stage,.hero{background:#123724}
.hero .diag{width:100%;display:block}
.thumb .dgsvg{object-fit:cover}
.stage .badge{top:auto;bottom:10px;right:10px;left:auto;font-size:9px;padding:5px 8px}

/* ===== v2 design: living pitch ===== */
.pitchbg{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55}
.pitchbg svg{width:100%;height:100%}
.livedot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--acc);margin-right:6px;box-shadow:0 0 0 3px rgba(95,240,127,.18);animation:livepulse 1.6s ease-in-out infinite;vertical-align:1px}
@keyframes livepulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.8)}}
.hero.live .diag .dgsvg{aspect-ratio:auto}
.hero.live{box-shadow:0 30px 70px -30px rgba(95,240,127,.35),var(--shadow)}

/* today card */
.todaycard{padding:0;overflow:hidden}
.tc-stage{cursor:pointer;background:#123724;border-bottom:1px solid rgba(95,240,127,.25)}
.tc-stage .dgsvg{height:auto}
.tc-body{padding:16px}
.tl{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.tli{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;background:rgba(0,0,0,.28);border:1px solid var(--line2);text-align:left;width:100%;transition:.15s}
.tli:active{transform:scale(.98)}
.tli i{width:22px;height:22px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:800;color:#06210f}
.tli b{flex:1;min-width:0;font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tli span{font-size:11px;font-weight:700;color:var(--dim)}

/* feature card (drill of the day) */
.feature{position:relative;width:100%;border-radius:18px;overflow:hidden;border:1.5px solid var(--line);box-shadow:var(--shadow);text-align:left;background:#123724;transition:.15s}
.feature:active{transform:scale(.99)}
.feature .fstage .dgsvg{height:auto}
.feature .fcap{position:absolute;left:0;right:0;bottom:0;padding:40px 14px 12px;background:linear-gradient(180deg,transparent,rgba(6,12,9,.94))}
.feature .fcap b{display:block;font-size:15px;font-weight:800;color:#fff;line-height:1.2}
.feature .fcap span{font-size:11px;color:var(--dim)}
.feature .fnum{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.1em;color:var(--c);margin-bottom:4px}

/* section cards with diagram backdrop */
.seccard{min-height:138px;padding:12px}
.seccard .sbg{position:absolute;inset:0;opacity:.55;transition:.3s;pointer-events:none}
.seccard .sbg .dgsvg{width:100%;height:100%;object-fit:cover}
.seccard .sbg svg{height:100%}
.seccard:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,16,22,.15),rgba(11,16,22,.92) 70%);pointer-events:none}
.seccard:before{z-index:2}
.seccard .num,.seccard b,.seccard span,.seccard .sbar{position:relative;z-index:2}
.seccard:active .sbg{opacity:.8}
.seccard .sbar i{transition:width .9s cubic-bezier(.22,1,.36,1)}

/* section banner (drills tab) */
.secbanner{position:relative;border-radius:16px;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--c) 40%,transparent);margin:4px 0 14px;background:#123724;box-shadow:var(--shadow-card)}
.secbanner .sbstage .dgsvg{height:auto}
.secbanner .sbin{padding:12px 14px 14px;background:linear-gradient(180deg,rgba(11,16,22,.6),rgba(11,16,22,.98));position:relative;margin-top:-30px}
.secbanner .sbin p{font-size:12.5px;line-height:1.5;color:var(--dim)}

/* stage replay */
.stage{position:relative}
.stage .replay{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:10px;background:rgba(6,12,9,.72);border:1px solid rgba(255,255,255,.14);color:var(--acc);display:grid;place-items:center;backdrop-filter:blur(6px)}
.stage .replay svg{width:16px;height:16px}
.stage .replay:active{transform:rotate(-40deg)}

/* nav indicator */
#nav .inner{position:relative}
.navind{position:absolute;top:2px;width:34px;height:3px;margin-left:-17px;border-radius:99px;background:var(--acc);box-shadow:0 0 10px rgba(95,240,127,.8);transition:left .35s cubic-bezier(.22,1,.36,1)}
#nav button{transition:.2s}
#nav button:active{transform:scale(.92)}
#nav button.on svg{transform:translateY(-1px)}

/* timer ring */
.timer{position:relative;width:180px;height:180px;margin:6px auto 4px;padding:0}
.timer .ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.timer .rt{fill:none;stroke:var(--track);stroke-width:6}
.timer .rp{fill:none;stroke:var(--acc);stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset 1s linear;filter:drop-shadow(0 0 6px rgba(95,240,127,.7))}
.timer.over .rp{stroke:var(--orange)}
.timer .tin{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.timer b{font-size:44px}
.timer span{margin-top:4px}

/* topbar flame */
.pill.flame{display:inline-flex;align-items:center;gap:4px;color:var(--orange);border-color:rgba(255,149,72,.35);background:rgba(255,149,72,.1)}
.pill.flame svg{width:13px;height:13px;fill:var(--orange);stroke:none}
.pill.flame b{color:var(--orange)}

/* press feedback everywhere */
.row:active,.opt:active,.feature:active,.seccard:active,.bonus:active,.videobtn:active,.chip:active{transform:scale(.985)}
.stats .s b{transition:.2s}
.covrow .bar>i{transition:width .9s cubic-bezier(.22,1,.36,1)}
h1{text-wrap:balance}
.secbanner .sbstage{max-height:150px;overflow:hidden;display:flex;align-items:center}
.tc-stage{max-height:230px;overflow:hidden;display:flex;align-items:center}
.feature .fstage{max-height:240px;overflow:hidden;display:flex;align-items:center}

/* ===== programs (members area) ===== */
.progcard{position:relative;display:flex;align-items:center;gap:12px;width:100%;text-align:left;border-radius:18px;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--c) 35%,transparent);background:#0f1a14;box-shadow:var(--shadow-card);padding:14px 14px 14px 0;min-height:112px;transition:.15s}
.progcard .pbg{position:absolute;inset:0;opacity:.5;pointer-events:none}
.progcard .pbg svg{width:100%;height:100%}
.progcard:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,16,22,.55),rgba(11,16,22,.96) 55%);pointer-events:none}
.progcard .pin{position:relative;z-index:2;flex:1;min-width:0;padding-left:44%}
.progcard .pkind{display:block;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--c);margin-bottom:4px}
.progcard b{display:block;font-size:14px;font-weight:800;line-height:1.2;color:var(--head)}
.progcard .ptag{display:block;font-size:11px;color:var(--dim);margin-top:3px}
.progcard .pmeta{display:flex;gap:8px;margin-top:7px;font-size:10.5px;font-weight:700;color:var(--dim)}
.progcard .pmeta span+span:before{content:"·";margin-right:8px;color:var(--mute)}
.progcard .sbar{height:4px;background:var(--track);border-radius:99px;margin-top:8px;overflow:hidden}
.progcard .sbar i{display:block;height:100%;background:var(--c);border-radius:99px;transition:width .9s cubic-bezier(.22,1,.36,1)}
.progcard .go{position:relative;z-index:2;color:var(--mute);width:18px;height:18px;flex-shrink:0}
.progcard .go svg{width:18px;height:18px}
.progcard:active{transform:scale(.985)}
.progtabs{display:flex;gap:8px;overflow-x:auto;margin:0 -20px;padding:2px 20px 4px;scrollbar-width:none}
.progtabs::-webkit-scrollbar{display:none}
.ptab{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 13px;border-radius:13px;background:var(--surface);border:1.5px solid var(--line);color:var(--dim);transition:.15s;min-width:110px;text-align:left}
.ptab b{font-size:12px;font-weight:800;color:var(--oncard)}
.ptab span{font-size:10.5px;font-weight:700}
.ptab.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 12%,transparent)}
.ptab.on b,.ptab.on span{color:var(--c)}

/* ===== members hub ===== */
.tbback{width:34px;height:34px;border-radius:10px;background:var(--surface2);border:1px solid var(--line);display:grid;place-items:center;margin-right:10px;flex-shrink:0}
.tbback svg{width:18px;height:18px}
#topbar{align-items:center}
#topbar .brand{flex:1;min-width:0}
#topbar .brand .mark svg{width:16px;height:16px;color:var(--ink)}
#topbar .brand[style] .mark{background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 70%,#000))}
#topbar .brand .wm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hub h2{margin-top:22px}
.product{position:relative;width:100%;text-align:left;border-radius:18px;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--c) 35%,transparent);background:var(--surface);box-shadow:var(--shadow-card);display:flex;flex-direction:column;transition:.15s}
.product:active{transform:scale(.985)}
.product .pcover{position:relative;background:#123724;overflow:hidden;max-height:210px;display:flex;align-items:center}
.product.big .pcover{max-height:230px}
.product .pcover .dgsvg{height:auto}
.product .pshade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,16,22,.1),rgba(11,16,22,.55));pointer-events:none}
.product .pkind{position:absolute;top:10px;left:10px;font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:99px;background:rgba(6,12,9,.78);border:1px solid rgba(255,255,255,.14);color:var(--c);backdrop-filter:blur(6px)}
.product .ppct{position:absolute;top:10px;right:10px;font-size:10.5px;font-weight:800;padding:5px 9px;border-radius:99px;background:rgba(6,12,9,.78);border:1px solid rgba(255,255,255,.14);color:var(--acc)}
.product .ppct.new{color:var(--gold)}
.product .pbody{padding:12px 14px 14px}
.product b{display:block;font-size:15px;font-weight:800;line-height:1.2;color:var(--head)}
.product.big b{font-size:19px}
.product .ptag{display:block;font-size:11.5px;color:var(--dim);margin-top:3px}
.product .pmeta{display:flex;gap:8px;margin-top:8px;font-size:10.5px;font-weight:700;color:var(--dim)}
.product .pmeta span+span:before{content:"·";margin-right:8px;color:var(--mute)}
.product .sbar{height:4px;background:var(--track);border-radius:99px;margin-top:9px;overflow:hidden}
.product .sbar i{display:block;height:100%;background:var(--c);border-radius:99px;transition:width .9s cubic-bezier(.22,1,.36,1)}
.product .popen{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:12.5px;font-weight:800;color:var(--ink);background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 75%,#000));padding:9px 14px;border-radius:10px}
.product .popen svg{width:14px;height:14px}
.product.big .popen{width:100%;justify-content:center;padding:13px;font-size:14px;border-radius:12px;box-shadow:0 10px 26px -8px color-mix(in srgb,var(--c) 55%,transparent)}
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pgrid .product .pcover{max-height:110px}
.pgrid .product b{font-size:13px}
.pgrid .product .ptag{display:none}
.pgrid .product .pmeta span:nth-child(3){display:none}
.pgrid .product .popen{padding:8px 10px;font-size:11.5px}

.pgrid .product .pkind{font-size:8.5px;padding:4px 7px;max-width:70%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== manual chapters ===== */
.guide .accord .body p{font-size:13.5px;line-height:1.6;color:var(--oncard);margin-bottom:10px}
.guide .accord .body ul{padding-left:18px;display:flex;flex-direction:column;gap:6px}
.guide .accord .body li{font-size:13px;line-height:1.5;color:var(--oncard)}
.guide .accord .body li::marker{color:var(--acc)}

/* ===== desktop layout ===== */
@media (min-width:900px){
  body.v-hub #shell{max-width:1120px}
  body.v-hub #topbar{padding-left:28px;padding-right:28px}
  body.v-hub #main{padding:10px 28px 60px}
  body.v-app #shell{max-width:600px}
  body.v-app #sheet .panel,body.v-app #nav .inner,body.v-app .chatbar .inner{max-width:600px}
  .hub{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 18px;align-items:start}
  .hub>.eyebrow,.hub>h1,.hub>.sub,.hub>h2,.hub>.pgrid,.hub>.tiny,.hub>.product.big{grid-column:1/-1}
  .hub>h1{font-size:38px;max-width:720px}
  .hub>.sub{max-width:640px;font-size:15px}
  .hub>.stats{grid-column:1/2;margin-top:-4px}
  .hub>h2{margin-top:26px;font-size:17px}
  .hub>.product.big{flex-direction:row;min-height:300px}
  .hub>.product.big .pcover{flex:0 0 58%;max-height:none;min-height:300px}
  .hub>.product.big .pcover .dgsvg{height:100%;width:100%;object-fit:cover}
  .hub>.product.big .pbody{flex:1;display:flex;flex-direction:column;justify-content:center;padding:28px 30px}
  .hub>.product.big b{font-size:26px}
  .hub>.product.big .ptag{font-size:13px;margin-top:6px}
  .hub>.product.big .pmeta{font-size:12px;margin-top:14px}
  .hub>.product.big .popen{margin-top:22px}
  .hub>.pgrid{grid-template-columns:repeat(3,1fr);gap:18px}
  .hub .pgrid .product .pcover{max-height:170px}
  .hub .pgrid .product .pbody{padding:16px 18px 18px}
  .hub .pgrid .product b{font-size:16px}
  .hub .pgrid .product .ptag{display:block}
  .hub .pgrid .product .pmeta span:nth-child(3){display:inline}
  .hub .pgrid .product .popen{padding:10px 14px;font-size:12.5px}
  .hub .pgrid .product .pkind{font-size:9.5px;max-width:none}
  .hub>.bonus{grid-column:1/3;margin:0}
  .hub>.coachhead{grid-column:3/4;margin:0!important}
  .secgrid{grid-template-columns:repeat(3,1fr)}
  .bgfx .b1{width:600px;height:600px}.bgfx .b2{width:520px;height:520px}
}
@media (min-width:900px){ .pitchbg svg{opacity:.7} }

/* ===== Annual Planning System ===== */
.chip.sm{padding:6px 10px;font-size:11px;display:inline-flex;align-items:center;gap:5px}
.chip.sm svg{width:12px;height:12px}
.phases{display:flex;gap:4px;margin:6px 0 10px}
.phases .ph{border-radius:10px;padding:8px 8px;background:var(--surface);border:1.5px solid var(--line);min-width:0;opacity:.55}
.phases .ph.on{opacity:1;border-color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.phases .ph b{display:block;font-size:10px;font-weight:800;color:var(--head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phases .ph span{font-size:9.5px;color:var(--c);font-weight:700}
.months{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}
.months .mo{position:relative;aspect-ratio:1;border-radius:8px;background:var(--surface);border:1.5px solid var(--line);display:grid;place-items:center;font-size:11px;font-weight:800;color:var(--dim);overflow:hidden}
.months .mo i{position:absolute;left:0;bottom:0;height:3px;background:var(--c)}
.months .mo.on{border-color:var(--c);color:var(--head);background:color-mix(in srgb,var(--c) 16%,transparent)}
.months .mo.full{color:var(--c)}
.ringsm{width:56px;height:56px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;background:conic-gradient(var(--c) calc(var(--p)*1%),var(--track) 0);position:relative}
.ringsm:before{content:"";position:absolute;inset:6px;border-radius:50%;background:var(--bg3)}
.ringsm b{position:relative;font-size:12px;font-weight:800}
.ansess{display:flex;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow-card)}
.ansess.done{border-color:color-mix(in srgb,var(--c) 45%,transparent);background:color-mix(in srgb,var(--c) 7%,var(--surface))}
.ansess.hl{border-color:rgba(95,240,127,.45)}
.ansess .num{width:26px;height:26px;border-radius:50%;flex-shrink:0;background:color-mix(in srgb,var(--c) 18%,transparent);color:var(--c);font-weight:800;font-size:12px;display:grid;place-items:center}
.ansess .t{flex:1;min-width:0}
.ansess .t .k{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--c,var(--dim));font-weight:800;margin-bottom:3px}
.ansess .t b{display:block;font-size:14px;font-weight:800;line-height:1.25}
.ansess .t p{font-size:12.5px;line-height:1.5;color:var(--dim);margin-top:4px}
.chk{width:28px;height:28px;border-radius:9px;flex-shrink:0;border:2px solid var(--line);display:grid;place-items:center;color:var(--ink);transition:.15s}
.chk svg{width:14px;height:14px}
.chk.on{background:var(--acc);border-color:var(--acc);box-shadow:0 0 10px -1px rgba(95,240,127,.6)}
.note{width:100%;min-height:54px;margin-top:8px;background:rgba(0,0,0,.22);border:1px solid var(--line2);border-radius:10px;padding:9px 10px;color:var(--text);font-size:12.5px;line-height:1.45;resize:vertical;outline:none}
.note:focus{border-color:var(--acc)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wday{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:6px}
.wday.done{border-color:rgba(95,240,127,.4)}
.wday .wh{display:flex;align-items:center;gap:8px}
.wday .wh b{flex:1;font-size:13.5px}
.wday input,.wday select{background:rgba(0,0,0,.22);border:1px solid var(--line2);border-radius:9px;padding:9px 10px;color:var(--text);font-size:12.5px;outline:none;width:100%}
.wday input:focus{border-color:var(--acc)}
.wday .mini{width:64px;padding:7px 8px;font-size:12px;text-align:center}
.wday select.mini{width:84px;text-align:left}
.log .d{border:none;cursor:pointer}
.agetabs{display:flex;gap:8px;overflow-x:auto;margin:0 -20px;padding:2px 20px 6px;scrollbar-width:none}
.agetabs::-webkit-scrollbar{display:none}
.atab{flex-shrink:0;min-width:84px;padding:9px 11px;border-radius:12px;background:var(--surface);border:1.5px solid var(--line);text-align:left;position:relative}
.atab b{display:block;font-size:14px;font-weight:800}
.atab span{font-size:10px;color:var(--dim);font-weight:700}
.atab i{display:block;font-style:normal;font-size:9px;color:var(--acc);font-weight:800;margin-top:3px}
.atab.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.atab.on b{color:var(--c)}
.agehead{border-radius:14px;padding:14px;background:linear-gradient(120deg,color-mix(in srgb,var(--c) 22%,transparent),transparent);border:1.5px solid color-mix(in srgb,var(--c) 40%,transparent);margin-top:12px}
.agehead .k{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--c);font-weight:800}
.agehead b{display:block;font-size:20px;font-weight:800;margin-top:3px}
.txt{font-size:13.5px;line-height:1.6;color:var(--oncard);margin-bottom:10px}
.txt:last-child{margin-bottom:0}
.ul,.ol{padding-left:18px;display:flex;flex-direction:column;gap:6px;margin-bottom:6px}
.ul li,.ol li{font-size:13px;line-height:1.5;color:var(--oncard)}
.ul li::marker{color:var(--acc)}
.ul.warn li::marker{color:var(--orange)}
.lbl{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:800;margin:14px 0 8px}
.callout{font-size:13.5px;line-height:1.55;color:var(--head);font-weight:600;background:var(--acc-soft);border:1px solid rgba(95,240,127,.35);border-radius:12px;padding:12px;margin-top:12px}
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dodont>div{border-radius:14px;padding:12px;border:1.5px solid}
.dodont .do{background:rgba(95,240,127,.08);border-color:rgba(95,240,127,.35)}
.dodont .dont{background:rgba(255,107,107,.08);border-color:rgba(255,107,107,.35)}
.dodont b{display:block;font-size:12px;font-weight:800;margin-bottom:8px}
.dodont .do b{color:var(--acc)}.dodont .dont b{color:var(--red)}
.dodont ul{padding-left:14px;display:flex;flex-direction:column;gap:5px}
.dodont li{font-size:12px;line-height:1.4;color:var(--oncard)}
.hblock{margin-bottom:18px}
.hbh{margin-bottom:8px}
.hbh .k{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);font-weight:800}
.hbh b{display:block;font-size:15px;font-weight:800;margin-top:2px}
.hbh p{font-size:12.5px;color:var(--dim);line-height:1.5;margin-top:3px}
.thumb.rt{display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(160deg,rgba(56,189,248,.25),rgba(56,189,248,.06));border:1px solid rgba(56,189,248,.35)}
.thumb.rt b{font-size:15px;font-weight:800;color:#7dd3fc;line-height:1}
.thumb.rt span{font-size:9px;color:var(--dim);font-weight:700;margin-top:3px;text-align:center;line-height:1.1}
.tpl{font-size:13.5px;line-height:1.6;color:var(--head);background:rgba(0,0,0,.25);border:1px dashed var(--line);border-radius:12px;padding:12px;margin-bottom:10px;font-style:italic}
.rhero{border-radius:16px;padding:18px;background:linear-gradient(120deg,color-mix(in srgb,var(--c) 28%,transparent),color-mix(in srgb,var(--c) 6%,transparent));border:1.5px solid color-mix(in srgb,var(--c) 45%,transparent);margin-bottom:14px}
.rhero b{display:block;font-size:34px;font-weight:800;color:var(--head);line-height:1}
.rhero span{display:block;font-size:12.5px;color:var(--dim);margin-top:6px}
.rstep{display:flex;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.rstep .num{width:24px;height:24px;border-radius:50%;flex-shrink:0;background:var(--acc-soft);color:var(--acc);font-weight:800;font-size:11px;display:grid;place-items:center}
.rstep .k{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);font-weight:800}
.rstep b{display:block;font-size:13.5px;font-weight:600;line-height:1.35;margin-top:2px}
@media (min-width:900px){ .dodont ul{padding-left:16px} .months .mo{aspect-ratio:auto;height:40px} }

/* ===== members area v2: brand + product overview ===== */
#topbar .brand .mark{font-size:15px}
.product.overview{margin-top:4px}
.product.overview .pcover{max-height:190px}
.product.overview .pbody{padding:12px 14px 14px}
.thumb.rt[style]{background:linear-gradient(160deg,color-mix(in srgb,var(--c) 28%,transparent),color-mix(in srgb,var(--c) 6%,transparent));border-color:color-mix(in srgb,var(--c) 40%,transparent)}
.thumb.rt[style] b{color:var(--c)}
body.v-hub #nav{display:block}
@media (min-width:900px){
  .hub>.product.overview{grid-column:1/-1}
  body.v-hub #nav .inner{max-width:1120px;padding-left:28px;padding-right:28px}
  body.v-hub .navind{display:none}
  body.v-hub #nav button{flex:0 0 auto;flex-direction:row;gap:8px;padding:10px 16px;font-size:12px}
  body.v-hub #nav button svg{width:18px;height:18px}
  body.v-hub #nav .inner{justify-content:center;gap:6px}
  body.v-hub #main{padding-bottom:110px}
}

/* ===== members area = product list ===== */
.plist{display:flex;flex-direction:column;gap:14px}
.plist .product .pcover{max-height:170px}
.plist .product.big .pcover{max-height:210px}
.plist .product .ptag{display:block}
body.v-hub #main{padding-bottom:40px}
@media (min-width:900px){
  .hub>.plist{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
  .hub>.plist .product.big{grid-column:1/-1;flex-direction:row;min-height:280px}
  .hub>.plist .product.big .pcover{flex:0 0 58%;max-height:none;min-height:280px}
  .hub>.plist .product.big .pbody{flex:1;display:flex;flex-direction:column;justify-content:center;padding:28px 30px}
  .hub>.plist .product.big b{font-size:26px}
  .hub>.plist .product .pcover{max-height:190px}
  .hub>.plist .product .pbody{padding:16px 18px 18px}
  .hub>.plist .product b{font-size:17px}
}

/* ===== product covers v2 (typographic) ===== */
.product{background:#0b1016;border-radius:20px;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 60px -30px rgba(0,0,0,.8),0 0 0 1px color-mix(in srgb,var(--c) 18%,transparent)}
.product:hover{transform:translateY(-3px);box-shadow:0 34px 70px -28px color-mix(in srgb,var(--c) 45%,transparent),0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent)}
.product:active{transform:scale(.99)}
.product .pcover{position:relative;height:200px;max-height:none;display:block;background:#0e1a14;overflow:hidden}
.product.big .pcover{height:260px}
.product .pcover .cover{width:100%;height:100%;display:block}
.product .pshade,.product .pkind{display:none}
.product .ppct{position:absolute;top:14px;right:14px;font-size:11px;font-weight:800;padding:6px 10px;border-radius:99px;background:rgba(6,12,9,.78);border:1px solid rgba(255,255,255,.14);color:var(--acc)}
.product .pfoot{display:flex;align-items:center;gap:12px;padding:12px 16px 14px;border-top:1px solid rgba(255,255,255,.06)}
.product .pfoot .pmeta{margin:0;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.product .pfoot .sbar{width:70px;margin:0;flex-shrink:0}
.product .pfoot .popen{margin:0;flex-shrink:0;display:inline-flex;align-items:center;gap:4px;padding:9px 12px;font-size:12px}
.product .pfoot .popen svg{width:14px;height:14px}
.product.big .pfoot{padding:14px 18px 16px}
.product.big .pfoot .popen{padding:12px 18px;font-size:13.5px}
.plist{gap:16px}
.hubhead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:6px}
.hubhead h1{margin-bottom:6px}
.hubhead .sub{margin-bottom:6px}
.hubstats{display:none;gap:22px}
.hubstats .s b{display:block;font-size:26px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.hubstats .s b.acc{color:var(--acc)}
.hubstats .s span{font-size:10.5px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase;font-weight:700}
@media (min-width:900px){
  .hub>.hubhead{grid-column:1/-1}
  .hubstats{display:flex;padding-bottom:10px}
  .hub>.plist .product.big{flex-direction:column;min-height:0}
  .hub>.plist .product.big .pcover{flex:none;height:360px;min-height:0}
  .hub>.plist .product .pcover{height:230px;max-height:none}
  .hub>.plist .product .pfoot{padding:14px 18px 16px}
  .hub>.plist .product .pbody{display:none}
  .product.overview .pcover{height:220px;max-height:none}
}
.product .pcover .cv-n,.product .pcover .cv-w{position:absolute;inset:0}
.product .pcover .cv-w{display:none}
@media (min-width:900px){
  .hub>.plist .product.big .pcover .cv-n{display:none}
  .hub>.plist .product.big .pcover .cv-w{display:block}
  .hub>.plist .product.big .pcover{height:340px}
}
@media (min-width:560px) and (max-width:899px){ .product.big .pcover{height:300px} }
.grid3{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:8px}
.rectbl{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:4px}
.rectbl .rh,.rectbl .rr{display:grid;grid-template-columns:1.3fr .8fr .8fr .7fr .8fr 1fr;gap:4px;padding:9px 10px;font-size:11.5px;align-items:center;text-align:center}
.rectbl .rh{background:var(--surface2);color:var(--dim);font-weight:800;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase}
.rectbl .rr{border-top:1px solid var(--line2);color:var(--oncard);width:100%;background:none}
.rectbl .rr span:first-child,.rectbl .rh span:first-child{text-align:left;font-weight:700}
.rectbl .rr.muted{color:var(--mute)}
.rectbl .rr.cur{background:var(--acc-soft)}
.rectbl .rr.tot{background:rgba(255,255,255,.06);font-weight:800;color:var(--head)}
.wday .mini{width:56px}
.wday .wh input.mini:first-of-type{width:64px}

/* ===== Upsell 2 · Player System ===== */
.segs{display:flex;gap:8px;margin-bottom:6px}
.seg{flex:1;padding:11px;border-radius:12px;background:var(--surface);border:1.5px solid var(--line);font-weight:800;font-size:13px;color:var(--dim)}
.seg.on{border-color:var(--acc);color:var(--acc);background:var(--acc-soft)}
.route{display:flex;gap:12px;width:100%;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow-card)}
.route.on{border-color:rgba(95,240,127,.5);background:linear-gradient(100deg,rgba(95,240,127,.12),transparent)}
.route .rl{width:30px;height:30px;border-radius:9px;flex-shrink:0;background:var(--acc-soft);color:var(--acc);font-weight:800;display:grid;place-items:center}
.route .t{flex:1;min-width:0}
.route .t b{display:block;font-size:13.5px;font-weight:800}
.route .chain{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin-top:6px}
.route .chain i{font-style:normal;font-size:10px;font-weight:800;padding:3px 7px;border-radius:99px;background:color-mix(in srgb,var(--c) 18%,transparent);color:var(--c)}
.route .chain em{font-style:normal;color:var(--mute);font-size:10px}
.route .t p{font-size:12.5px;color:var(--dim);line-height:1.5;margin-top:8px}
.modcard{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--surface);border:1.5px solid color-mix(in srgb,var(--c) 30%,var(--line));border-radius:16px;padding:12px 14px;box-shadow:var(--shadow-card)}
.modcard .mnum{font-size:30px;font-weight:800;color:var(--c);opacity:.9;letter-spacing:-.04em;width:46px;flex-shrink:0}
.modcard .t{flex:1;min-width:0}
.modcard .t .k{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--c);font-weight:800}
.modcard .t b{display:block;font-size:14px;font-weight:800;line-height:1.25;margin-top:2px}
.modcard .t .s{display:block;font-size:11.5px;color:var(--dim);margin-top:3px}
.modcard .sbar{height:4px;background:var(--track);border-radius:99px;margin-top:8px;overflow:hidden}
.modcard .sbar i{display:block;height:100%;background:var(--c);border-radius:99px;transition:width .9s cubic-bezier(.22,1,.36,1)}
.modcard .mn{font-size:11px;font-weight:800;color:var(--dim);flex-shrink:0}
.modtabs{display:flex;gap:8px;overflow-x:auto;margin:0 -20px;padding:2px 20px 4px;scrollbar-width:none}
.modtabs::-webkit-scrollbar{display:none}
.mtab{flex-shrink:0;min-width:74px;padding:9px 11px;border-radius:12px;background:var(--surface);border:1.5px solid var(--line);text-align:left}
.mtab b{display:block;font-size:15px;font-weight:800;color:var(--dim)}
.mtab span{font-size:10px;color:var(--dim);font-weight:700}
.mtab.on{border-color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.mtab.on b,.mtab.on span{color:var(--c)}
.chapter .txt{font-size:14.5px;line-height:1.65;color:var(--oncard)}
.chapter .ul li,.chapter .ol li{font-size:14px;line-height:1.55}
.actcard{border-radius:14px;padding:14px;border:1.5px solid;margin-bottom:8px}
.actcard.parent{background:rgba(95,240,127,.08);border-color:rgba(95,240,127,.4)}
.actcard.coach{background:rgba(56,189,248,.08);border-color:rgba(56,189,248,.4)}
.actcard .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;margin-bottom:6px}
.actcard.parent .k{color:var(--acc)}.actcard.coach .k{color:#7dd3fc}
.actcard p{font-size:14px;line-height:1.55;color:var(--head);font-weight:600}
.ckrow{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px 0;border-bottom:1px solid var(--line2);font-size:13.5px;color:var(--oncard);line-height:1.4}
.ckrow:last-of-type{border-bottom:none}
.ckrow .chk{width:26px;height:26px}
/* vault */
.vgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.vcard{background:var(--surface);border:1.5px solid var(--line);border-radius:14px;overflow:hidden;text-align:left;box-shadow:var(--shadow-card);transition:.15s}
.vcard:active{transform:scale(.97)}
.vcard .vthumb{position:relative;aspect-ratio:16/10;background:linear-gradient(160deg,color-mix(in srgb,var(--c) 30%,#0e1a14),#0b1016);display:grid;place-items:center;color:#fff}
.vcard .vthumb svg{width:26px;height:26px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.vcard .vthumb .vn{position:absolute;left:7px;top:6px;font-size:10px;font-weight:800;color:var(--c)}
.vcard b{display:block;font-size:11px;font-weight:700;padding:8px 9px;color:var(--oncard)}
.vcard.seen .vthumb:after{content:"✓";position:absolute;right:6px;bottom:5px;width:16px;height:16px;border-radius:50%;background:var(--acc);color:var(--ink);font-size:10px;font-weight:800;display:grid;place-items:center}
.player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.player.pdf{aspect-ratio:3/4}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.sheethead a.fav{text-decoration:none}
@media (min-width:900px){ .vgrid{grid-template-columns:repeat(5,1fr)} .hub>.plist .product.big{grid-column:1/-1} }

/* ===== real product covers (square images) ===== */
.product .pcover.img{height:auto;aspect-ratio:1/1}
.product .pcover.img .coverimg{width:100%;height:100%;object-fit:cover;display:block}
.product.big .pcover.img{height:auto}
.product .pside{display:none}
.pgrid .product .pcover.art,.plist .product:not(.big) .pcover.art{height:auto;aspect-ratio:1/1}
.product.overview .pcover.img{aspect-ratio:1/1;height:auto;max-height:none}
@media (min-width:900px){
  .hub>.plist{grid-template-columns:repeat(3,1fr)}
  .hub>.plist .product.big{grid-column:1/-1;display:grid;grid-template-columns:380px 1fr;grid-template-rows:auto auto;min-height:0}
  .hub>.plist .product.big .pcover{grid-row:1/3;height:auto;aspect-ratio:1/1}
  .hub>.plist .product.big .pcover.art{aspect-ratio:auto;height:100%}
  .hub>.plist .product.big .pcover.art .cv-n{display:block}
  .hub>.plist .product.big .pcover.art .cv-w{display:none}
  .hub>.plist .product.big .pside{display:flex;flex-direction:column;justify-content:flex-end;padding:30px 30px 10px}
  .hub>.plist .product.big .pside .pkind2{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--c);margin-bottom:8px}
  .hub>.plist .product.big .pside b{font-size:30px;font-weight:800;line-height:1.1;color:var(--head)}
  .hub>.plist .product.big .pside .ptag{font-size:14px;color:var(--dim);margin-top:8px}
  .hub>.plist .product.big .pfoot{align-self:start;padding:14px 30px 30px;border-top:none}
  .hub>.plist .product.big .pfoot .popen{padding:14px 22px;font-size:14px}
  .hub>.plist .product .pcover.art{height:auto;aspect-ratio:1/1}
  .product.overview .pcover.img{max-height:none}
  .product.overview{display:grid;grid-template-columns:220px 1fr;align-items:center}
  .product.overview .pcover{aspect-ratio:1/1;height:auto}
  .product.overview .pfoot{border-top:none}
}
.plist .product .pcover.img,.plist .product.big .pcover.img,.product .pcover.img{max-height:none!important;height:auto!important;aspect-ratio:1/1}
@media (min-width:900px){ .hub>.plist .product.big .pcover.img{aspect-ratio:1/1;height:auto!important} }
.persona{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin:4px 0 16px;padding:12px 14px;border-radius:16px;background:linear-gradient(100deg,rgba(95,240,127,.14),rgba(95,240,127,.03));border:1.5px solid rgba(95,240,127,.4);box-shadow:var(--shadow-card)}
.persona .ic{width:40px;height:40px;border-radius:12px;background:var(--acc-soft);color:var(--acc);display:grid;place-items:center;flex-shrink:0}
.persona .ic svg{width:20px;height:20px}
.persona .t{flex:1;min-width:0}
.persona b{display:block;font-size:14px;font-weight:800}
.persona span{font-size:12px;color:var(--dim);line-height:1.45}
.persona .go{color:var(--acc);width:18px;height:18px}
.persona .go svg{width:18px;height:18px}
.progress-wrap .pill{margin-left:6px}
@media (min-width:900px){ .hub>.persona{grid-column:1/-1} }
.product .pfoot .popen,.product.big .pfoot .popen{width:auto;flex:0 0 auto}
.product .pfoot .pmeta{flex:1 1 auto;min-width:0}