/* INTERIM (F0): verbatim <style> of packages/ui/source/STYLE-PICKER-7.html. Do not edit; F1 generates the real library. */
/* ===== Rounds 1 to 5 base and picks, copied verbatim from STYLE-PICKER-5.html (which carries rounds 1 to 4 verbatim) ===== */
/* ===== Rounds 1 to 3 base and picks, copied verbatim from STYLE-PICKER-3.html (which copied rounds 1 and 2 verbatim) ===== */
/* ===== Rounds 1 + 2 base and picks, copied verbatim from STYLE-PICKER-2.html (which copied round 1 verbatim) ===== */
/* ===== Round 1 base, copied verbatim from STYLE-PICKER.html ===== */
:root, :root[data-theme="dark"]{
  color-scheme:dark;
  --canvas:#090B12; --surface:#121722; --raised:#1A2230; --raised3:#30394A; --sunken:#0E131D;
  --line:#30394A; --border:#53617A; --ink:#F7F8FC; --muted:#AAB4C5; --disabled:#6B777E;
  --pink:#FF6EAA; --pink-on:#1A0711; --pink-deep:#D92E78; --pink-deeper:#9C1A56; --pink-tint:#3A192B;
  --blue:#78A9FF; --blue-on:#0A1020; --blue-deep:#1769E0; --blue-deeper:#0F499E; --blue-tint:#192C4A;
  --focus:#78A9FF;
  --good:#4FD18B; --good-on:#0A0B10; --good-tint:#223B33;
  --warn:#F2B233; --warn-on:#0A0B10; --warn-tint:#3D3725;
  --bad:#FF4A3D; --bad-text:#FF8A80; --bad-tint:#3F3031; --bad-on:#0A0B10;
  --info:#6CC0EA; --info-tint:#273942; --info-on:#0A0B10;
  --rec:#FF3B30;
  --zillow:#006AFF; --linkedin:#0A66C2;
  --pk-rgb:224,50,127; --bl-rgb:120,169,255;
  --shc:rgba(0,0,0,.6); --edge:#0B0F17;
  --gl-bg:rgba(255,255,255,.07); --gl-bd:rgba(255,255,255,.16); --gl-hi:rgba(255,255,255,.2);
  --app-top:#12161F; --side-bg:#0C1018;
  --card-sh:0 1px 0 rgba(255,255,255,.04) inset, 0 18px 40px -22px rgba(0,0,0,.85);
}
:root[data-theme="light"]{
  color-scheme:light;
  --canvas:#F5F7FB; --surface:#FFFFFF; --raised:#FFFFFF; --raised3:#D7DEEA; --sunken:#EAF0F7;
  --line:#D7DEEA; --border:#A9B4C7; --ink:#101522; --muted:#535D70; --disabled:#8A969D;
  --pink:#D92E78; --pink-on:#FFFFFF; --pink-deep:#D92E78; --pink-deeper:#9C1A56; --pink-tint:#FDEAF2;
  --blue:#1769E0; --blue-on:#FFFFFF; --blue-deep:#1769E0; --blue-deeper:#0F499E; --blue-tint:#EAF2FF;
  --focus:#1769E0;
  --good:#0F6B3F; --good-on:#FFFFFF; --good-tint:#D9E6E2;
  --warn:#7F5300; --warn-on:#FFFFFF; --warn-tint:#F3EAD6;
  --bad:#D70015; --bad-text:#B3261E; --bad-tint:#F6E1E1; --bad-on:#FFFFFF;
  --info:#15618A; --info-tint:#DAE5EB; --info-on:#FFFFFF;
  --rec:#D70015;
  --pk-rgb:217,46,120; --bl-rgb:23,105,224;
  --shc:rgba(20,30,40,.22); --edge:#C3CCDA;
  --gl-bg:rgba(255,255,255,.75); --gl-bd:rgba(16,21,34,.12); --gl-hi:rgba(255,255,255,.95);
  --app-top:#FFFFFF; --side-bg:#F5F7FB;
  --card-sh:0 1px 2px rgba(20,30,40,.06), 0 16px 34px -22px rgba(20,30,40,.35);
}
:root{
  --display:'Sora',system-ui,-apple-system,sans-serif;
  --body:'Hanken Grotesk',system-ui,-apple-system,"Segoe UI",sans-serif;
  --num:'Big Shoulders Display','Arial Narrow',Impact,sans-serif;
  --hero:linear-gradient(135deg,#FF5FA2 0%,#E0327F 48%,#A3175A 100%);
  --ease:cubic-bezier(.2,.8,.2,1);
  --spring:cubic-bezier(.34,1.35,.64,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--ink);font:16px/1.5 var(--body);-webkit-font-smoothing:antialiased;transition:background-color .3s,color .3s}
button,input{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--display);margin:0;letter-spacing:-.02em}
.ic{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Sticky top bar + My picks ---------- */
.top{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--canvas) 86%,transparent);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--line)}
.top-in{max-width:1440px;margin:0 auto;padding:10px 32px 10px}
.top-r1{display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:10px;font:800 16px var(--display);white-space:nowrap;text-decoration:none;color:var(--ink)}
.brand img{width:34px;height:34px;border-radius:10px;background:#fff;padding:2px}
.brand small{display:block;font:600 11px var(--body);color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.jump{display:flex;gap:4px;margin-left:8px;overflow-x:auto;scrollbar-width:none}
.jump a{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;color:var(--muted);text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap;transition:background-color .2s,color .2s}
.jump a b{font:800 16px var(--num);color:var(--pink)}
@media (hover:hover){.jump a:hover{background:var(--raised);color:var(--ink)}}
.spacer{flex:1}
.ui-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;border-radius:12px;border:1px solid var(--line);background:var(--raised);color:var(--ink);font-weight:700;font-size:14px;cursor:pointer;transition:transform .16s var(--ease),box-shadow .16s,background-color .2s}
@media (hover:hover){.ui-btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px -10px var(--shc)}}
.ui-btn:active{transform:translateY(1px) scale(.98)}
.ui-btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.ui-btn.hot{background:var(--hero);color:#fff;border-color:transparent;box-shadow:0 8px 20px -10px rgba(var(--pk-rgb),.9)}
.ui-btn.quiet{background:transparent}
.picks{display:flex;align-items:center;gap:8px;margin-top:8px}
.picks-l{font:700 12px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.slots{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.slot{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 5px;border-radius:999px;border:1px dashed var(--border);background:transparent;cursor:pointer;white-space:nowrap;font-size:13px;color:var(--muted);transition:background-color .2s,border-color .2s,transform .16s var(--ease)}
.slot .sl{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--raised);font:800 13px var(--num);color:var(--muted)}
.slot .sv{font:800 16px var(--num);letter-spacing:.02em}
.slot.on{border-style:solid;border-color:var(--pink);background:var(--pink-tint);color:var(--ink)}
.slot.on .sl{background:var(--pink);color:var(--pink-on)}
.slot.flash{animation:slotpop .45s var(--spring)}
@keyframes slotpop{40%{transform:scale(1.12)}}
.slot:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.toast{position:fixed;left:50%;bottom:24px;z-index:80;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--ink);color:var(--canvas);padding:12px 18px;border-radius:14px;font-weight:700;box-shadow:0 20px 40px -12px rgba(0,0,0,.6);transition:opacity .25s,transform .3s var(--spring)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- Page layout ---------- */
.wrap{max-width:1440px;margin:0 auto;padding:28px 32px 80px}
.intro{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:24px;align-items:center;background:var(--hero);color:#fff;border-radius:28px;padding:32px 36px;position:relative;overflow:hidden;box-shadow:0 30px 60px -30px rgba(var(--pk-rgb),.8),inset 0 1px 0 rgba(255,255,255,.3)}
.intro::before,.hero::before{content:"";position:absolute;right:-80px;top:-120px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.22),transparent 65%);pointer-events:none}
.intro .eyebrow,.hero .eyebrow{font:700 12px var(--body);letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.intro h1{font-size:clamp(2rem,4vw,3.2rem);line-height:1.02;font-weight:800;letter-spacing:-.04em;margin:8px 0 12px}
.intro p{margin:0;max-width:62ch;font-size:17px;opacity:.95}
.intro img{width:190px;filter:drop-shadow(0 18px 24px rgba(0,0,0,.35))}
.intro .how{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.intro .how span{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);padding:6px 12px;border-radius:999px;font-weight:600;font-size:14px}
.intro code{font:800 18px var(--num);letter-spacing:.04em;background:rgba(0,0,0,.2);padding:2px 8px;border-radius:6px}

.sec{margin-top:56px;scroll-margin-top:130px}
.sec-h{display:flex;align-items:center;gap:18px;margin-bottom:20px}
.sec-letter{font:800 64px/0.8 var(--num);color:var(--pink);text-shadow:0 10px 30px rgba(var(--pk-rgb),.35)}
.sec-h h2{font-size:28px;font-weight:800}
.sec-h p{margin:4px 0 0;color:var(--muted);max-width:80ch}
.sec-h .bad{color:var(--bad-text);font-weight:700}
.sec-count{margin-left:auto;font:800 18px var(--num);color:var(--muted);letter-spacing:.05em;white-space:nowrap}
.opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--min,560px)),1fr));gap:20px}
.opt{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--card-sh);scroll-margin-top:130px;transition:border-color .25s,box-shadow .3s}
.opt.picked{border-color:var(--pink);box-shadow:0 0 0 1px var(--pink),0 24px 50px -26px rgba(var(--pk-rgb),.9)}
.opt-h{display:flex;align-items:center;gap:14px}
.oid{font:800 40px/1 var(--num);letter-spacing:.01em;min-width:64px;height:56px;display:grid;place-items:center;border-radius:14px;background:var(--sunken);color:var(--ink);border:1px solid var(--line);transition:background-color .25s,color .25s}
.opt.picked .oid{background:var(--hero);color:#fff;border-color:transparent}
.opt-h h3{font-size:18px;font-weight:700}
.opt-h p{margin:2px 0 0;color:var(--muted);font-size:14px;line-height:1.35}
.opt-h>div{flex:1;min-width:0}
.pick-btn{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 16px;border-radius:999px;border:1.5px solid var(--pink);background:transparent;color:var(--pink);font-weight:800;font-size:14px;cursor:pointer;white-space:nowrap;transition:background-color .2s,color .2s,transform .16s var(--ease),box-shadow .2s}
@media (hover:hover){.pick-btn:hover{background:var(--pink-tint);transform:translateY(-1px)}}
.pick-btn:active{transform:scale(.96)}
.pick-btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.pick-btn[aria-pressed="true"]{background:var(--pink);color:var(--pink-on);box-shadow:0 8px 18px -8px rgba(var(--pk-rgb),.9)}
.pick-btn .ic{width:16px;height:16px;display:none}
.pick-btn[aria-pressed="true"] .ic{display:block}
.ctx{display:flex;flex-direction:column;gap:8px;min-width:0}
.ctx-l{font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ctx-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px;align-items:start}
.try{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.hint{font-size:13px;color:var(--muted)}

/* ---------- Shared app pieces ---------- */
.av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:700 13px var(--display);flex:none;background:var(--blue-tint);color:var(--blue)}
.job{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:16px;display:grid;gap:12px;box-shadow:var(--card-sh);min-width:0}
.job-h{display:flex;gap:12px;align-items:center}
.job-who{flex:1;min-width:0}
.job-who b{display:block;font:700 17px var(--display);letter-spacing:-.01em}
.job-who small{color:var(--muted);font-size:13px}
.job-time{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--muted);font-weight:600}
.job-time .ic{width:15px;height:15px}
.job-addr{margin:0;color:var(--muted);font-size:14px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.acts{display:flex;flex-wrap:wrap;gap:10px}
.fv{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:10px 10px 10px 16px;box-shadow:var(--card-sh)}
.fv-st small{display:block;font-size:12px;color:var(--muted);font-weight:600}
.fv-st b{font:700 16px var(--display)}

/* ===== Round 1 picks, exact CSS: B6 G2 S3 C1 T5 X2 R3 ===== */
/* ---------- BUTTONS (B) : each style is a set of variables ---------- */
.btn{
  --r:12px; --t-h:translateY(-2px); --t-a:translateY(1px) scale(.97);
  --p-bg:var(--pink-deep); --p-fg:#fff; --p-bd:0 solid transparent; --p-sh:0 1px 2px rgba(0,0,0,.3); --p-shh:0 10px 22px -8px rgba(var(--pk-rgb),.7); --p-sha:inset 0 2px 5px rgba(0,0,0,.35);
  --s-bg:var(--raised); --s-fg:var(--ink); --s-bd:1px solid var(--line); --s-sh:none; --s-shh:0 10px 20px -10px var(--shc); --s-sha:inset 0 2px 5px rgba(0,0,0,.25);
  --g-bg:transparent; --g-bgh:var(--raised); --g-fg:var(--ink); --g-bd:0 solid transparent; --g-sh:none; --g-shh:none; --g-sha:inset 0 2px 5px rgba(0,0,0,.2);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 18px;border-radius:var(--r);
  font:700 15px/1.1 var(--body);cursor:pointer;white-space:nowrap;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background-color .2s,color .2s,border-color .2s,filter .2s;
}
.btn.sm{min-height:38px;padding:8px 14px;font-size:14px}
.btn.sm .ic{width:16px;height:16px}
.btn.p{background:var(--p-bg);color:var(--p-fg);border:var(--p-bd);box-shadow:var(--p-sh)}
.btn.s{background:var(--s-bg);color:var(--s-fg);border:var(--s-bd);box-shadow:var(--s-sh)}
.btn.g{background:var(--g-bg);color:var(--g-fg);border:var(--g-bd);box-shadow:var(--g-sh)}
@media (hover:hover){
  .btn:hover:not(:disabled){transform:var(--t-h)}
  .btn.p:hover:not(:disabled){box-shadow:var(--p-shh);filter:brightness(1.06)}
  .btn.s:hover:not(:disabled){box-shadow:var(--s-shh)}
  .btn.g:hover:not(:disabled){box-shadow:var(--g-shh);background:var(--g-bgh)}
}
.btn:active:not(:disabled),.btn.holding{transform:var(--t-a)!important;transition-duration:.08s}
.btn.p:active:not(:disabled),.btn.p.holding{box-shadow:var(--p-sha)!important}
.btn.s:active:not(:disabled),.btn.s.holding{box-shadow:var(--s-sha)!important}
.btn.g:active:not(:disabled){box-shadow:var(--g-sha)!important}
.btn:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.btn:disabled{opacity:.42;cursor:not-allowed;box-shadow:none;filter:saturate(.25)}
.hold{overflow:hidden;isolation:isolate}
.hold .fill{position:absolute;inset:0;background:currentColor;opacity:.22;transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease);z-index:0;pointer-events:none}
.hold.holding .fill{transform:scaleX(1);transition:transform .9s linear}
.hold>:not(.fill){position:relative;z-index:1}
.hold.done{animation:donepop .45s var(--spring)}
@keyframes donepop{40%{transform:scale(1.06)}}
.seg{display:inline-flex;gap:4px;padding:4px;border-radius:calc(var(--r,12px) + 4px);background:var(--sunken);border:1px solid var(--line)}
/* B6 Floating chip */
.bs-6 .btn{--r:12px; padding:10px 15px; font-weight:700; --t-h:translateY(-3px);
  --p-bg:var(--ink); --p-fg:var(--canvas); --p-sh:0 1px 1px rgba(0,0,0,.2),0 4px 10px -2px var(--shc),0 14px 24px -12px var(--shc); --p-shh:0 2px 2px rgba(0,0,0,.2),0 10px 18px -4px var(--shc),0 24px 40px -14px var(--shc); --p-sha:0 1px 2px var(--shc);
  --s-bg:var(--raised); --s-bd:1px solid var(--line); --s-sh:0 1px 1px rgba(0,0,0,.15),0 4px 10px -2px var(--shc),0 14px 24px -12px var(--shc); --s-shh:0 2px 2px rgba(0,0,0,.15),0 10px 18px -4px var(--shc),0 24px 40px -14px var(--shc);
  --g-fg:var(--muted); --g-bgh:var(--raised); --g-shh:0 8px 18px -8px var(--shc)}
.bs-6 .btn.p .ic{color:var(--pink)}
.bs-6 .btn.s .ic{color:var(--blue)}
/* ---------- SEGMENTED (G) ---------- */
.gseg{position:relative;display:inline-flex;gap:4px;padding:4px;border-radius:14px;background:var(--sunken);border:1px solid var(--line);max-width:100%;overflow-x:auto;scrollbar-width:none;
  --x:0px;--y:0px;--w:0px;--h:0px}
.gseg::-webkit-scrollbar{display:none}
.gseg[data-tone="good"]{--tone:var(--good);--tone-on:var(--good-on)}
.gseg[data-tone="blue"]{--tone:var(--blue);--tone-on:var(--blue-on)}
.gseg[data-tone="neutral"]{--tone:var(--raised3);--tone-on:var(--ink)}
.gseg[data-tone="pink"]{--tone:var(--pink);--tone-on:var(--pink-on)}
.gseg .ind{position:absolute;top:0;left:0;width:var(--w);height:var(--h);transform:translate(var(--x),var(--y));border-radius:10px;background:var(--raised);box-shadow:0 1px 2px rgba(0,0,0,.3),0 6px 14px -6px var(--shc);transition:transform .34s var(--spring),width .34s var(--spring),background-color .25s;pointer-events:none}
.gseg.noanim .ind{transition:none}
.gi{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;min-height:40px;border:0;background:none;border-radius:10px;font:700 14px var(--body);color:var(--muted);cursor:pointer;white-space:nowrap;transition:color .2s,transform .16s var(--ease),background-color .2s,border-color .2s,box-shadow .2s;-webkit-tap-highlight-color:transparent}
.gi .ic{width:17px;height:17px}
.gi[aria-selected="true"]{color:var(--ink)}
.gi .gc{font-style:normal;font-size:12px;font-weight:800;min-width:20px;padding:1px 7px;border-radius:999px;background:var(--raised3);color:var(--ink);text-align:center}
.gseg.status .gc{display:none}
.gseg.tabs .gi{padding:8px 11px;gap:6px;font-size:13.5px}
.gseg.tabs .gi .ic{width:16px;height:16px}
.gseg.status .gi[data-tone="good"] .ic{color:var(--good)}
.gseg.status .gi[data-tone="blue"] .ic{color:var(--blue)}
@media (hover:hover){.gi:hover{color:var(--ink)}}
.gi:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.tabpane{margin:10px 2px 0;color:var(--muted);font-size:14px;min-height:21px}
.tabpane b{color:var(--ink)}
.tech{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:12px 14px;box-shadow:var(--card-sh)}
.tech .who{flex:1;min-width:140px}
.tech .who b{display:block;font:700 16px var(--display)}
.tech .who small{color:var(--muted);font-size:13px}
/* G2 underline */
.gs-2 .gseg{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:0;gap:10px}
.gs-2 .gseg .ind{height:3px;border-radius:3px;background:var(--pink);box-shadow:0 0 12px rgba(var(--pk-rgb),.7);transform:translate(var(--x),calc(var(--y) + var(--h) - 3px))}
.gs-2 .gi{border-radius:0;padding:12px 6px}
.gs-2 .gi[aria-selected="true"] .gc{background:var(--pink);color:var(--pink-on)}
/* ---------- SWITCHES (S) ---------- */
.admin{background:var(--raised);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--card-sh)}
.admin-h{display:flex;align-items:center;gap:8px;padding:12px 16px;font-weight:800;font-family:var(--display);font-size:15px;border-bottom:1px solid var(--line)}
.admin-h .ic{color:var(--muted)}
.arow{display:flex;align-items:center;gap:14px;padding:13px 16px}
.arow+.arow{border-top:1px solid var(--line)}
.arow-t{flex:1;min-width:0}
.arow-t b{display:block;font-size:15px}
.arow-t small{display:block;color:var(--muted);font-size:13px;line-height:1.35}
.arow.tri-row{flex-wrap:wrap}
.sw{--w:52px;--h:30px;--pad:3px;--k:calc(var(--h) - var(--pad)*2);--sw-off:var(--raised3);--sw-on:var(--pink);
  position:relative;flex:none;width:var(--w);height:var(--h);padding:0;border:0;border-radius:999px;background:var(--sw-off);cursor:pointer;transition:background-color .25s,box-shadow .25s,border-color .25s;-webkit-tap-highlight-color:transparent}
.sw .knob{position:absolute;top:var(--pad);left:var(--pad);width:var(--k);height:var(--k);border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.35);display:grid;place-items:center;transition:transform .3s var(--spring),scale .15s,background-color .25s,box-shadow .25s}
.sw .knob .ic{display:none;width:14px;height:14px;stroke-width:3}
.sw-t{display:none}
.sw[aria-checked="true"]{background:var(--sw-on)}
.sw[aria-checked="true"] .knob{transform:translateX(calc(var(--w) - var(--k) - var(--pad)*2))}
.sw:active:not(:disabled) .knob{scale:.86}
.sw:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.sw:disabled{opacity:.4;cursor:not-allowed}
.tri{position:relative;display:inline-grid;grid-template-columns:repeat(3,1fr);min-width:210px;padding:3px;border-radius:999px;background:var(--sunken);border:1px solid var(--line);--i:1}
.tri[data-v="0"]{--tri-bg:var(--raised3);--tri-fg:var(--ink)}
.tri[data-v="1"]{--tri-bg:var(--warn);--tri-fg:var(--warn-on)}
.tri[data-v="2"]{--tri-bg:var(--pink);--tri-fg:var(--pink-on)}
.tri-k{position:absolute;top:3px;bottom:3px;left:3px;width:calc((100% - 6px)/3);border-radius:999px;background:var(--tri-bg);transform:translateX(calc(var(--i)*100%));transition:transform .34s var(--spring),background-color .25s;box-shadow:0 4px 12px -6px var(--shc)}
.tri button{position:relative;z-index:1;border:0;background:none;padding:7px 10px;border-radius:999px;font:700 13px var(--body);color:var(--muted);cursor:pointer;transition:color .2s}
.tri button[aria-checked="true"]{color:var(--tri-fg)}
.tri button:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
/* S3 labeled track */
.ss-3 .sw{--w:74px;--h:32px}
.ss-3 .sw-t{display:flex;position:absolute;inset:0;align-items:center;justify-content:space-between;padding:0 11px;font:800 11px var(--body);letter-spacing:.08em;text-transform:uppercase}
.ss-3 .sw-t i{font-style:normal;transition:opacity .2s}
.ss-3 .sw .sw-on{color:var(--pink-on);opacity:0}
.ss-3 .sw .sw-off{color:var(--muted)}
.ss-3 .sw[aria-checked="true"] .sw-on{opacity:1}
.ss-3 .sw[aria-checked="true"] .sw-off{opacity:0}
.ss-3 .tri button{text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:800}
/* ---------- CHECKBOXES (C) ---------- */
.pc{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:var(--card-sh)}
.pc-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.pc-h>b{font:700 16px var(--display)}
.pc-h small{display:block;color:var(--muted);font-size:13px;font-family:var(--body);font-weight:500}
.pc-n{font-size:13px;color:var(--muted);white-space:nowrap}
.pc-n b{font:800 24px var(--num);color:var(--pink)}
.pc-bar{height:6px;border-radius:6px;background:var(--sunken);margin:10px 0 8px;overflow:hidden}
.pc-bar i{display:block;height:100%;width:50%;background:var(--hero);border-radius:inherit;transition:width .45s var(--ease)}
.cks{display:grid;gap:4px;counter-reset:ck}
.ck{position:relative;display:flex;gap:12px;align-items:center;padding:10px;border-radius:12px;cursor:pointer;counter-increment:ck;transition:background-color .2s,border-color .2s,box-shadow .2s,transform .16s var(--ease);-webkit-tap-highlight-color:transparent}
@media (hover:hover){.ck:hover{background:var(--sunken)}}
.ck input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.ck .box{position:relative;flex:none;width:26px;height:26px;border-radius:8px;border:2px solid var(--border);display:grid;place-items:center;color:var(--pink-on);transition:background-color .2s,border-color .2s,transform .2s var(--ease),box-shadow .2s}
.ck .box svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .3s .06s var(--ease)}
.ck input:checked+.box{background:var(--pink);border-color:var(--pink);animation:pop .38s var(--spring)}
.ck input:checked+.box svg{stroke-dashoffset:0}
.ck input:focus-visible+.box{outline:3px solid var(--focus);outline-offset:2px}
@keyframes pop{0%{transform:scale(1)}35%{transform:scale(.8)}70%{transform:scale(1.14)}100%{transform:scale(1)}}
.ck .t{display:flex;gap:10px;align-items:center;flex:1;min-width:0}
.ck .t b{display:block;font-size:15px;transition:color .25s}
.ck .t small{display:block;color:var(--muted);font-size:13px;line-height:1.3}
.src{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--sc);color:#fff;font:800 12px var(--display);flex:none}
/* ---------- TAGS (T) ---------- */
.tag{--c:var(--muted);--ct:var(--raised3);--con:var(--ink);
  display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;background:var(--ct);color:var(--c);font:700 13px/1.2 var(--body);white-space:nowrap;transition:transform .16s var(--ease)}
.tag[data-k="pink"]{--c:var(--pink);--ct:var(--pink-tint);--con:var(--pink-on)}
.tag[data-k="info"]{--c:var(--info);--ct:var(--info-tint);--con:var(--info-on)}
.tag[data-k="warn"]{--c:var(--warn);--ct:var(--warn-tint);--con:var(--warn-on)}
.tag[data-k="bad"]{--c:var(--bad-text);--ct:var(--bad-tint);--con:var(--bad-on)}
.tag[data-k="good"]{--c:var(--good);--ct:var(--good-tint);--con:var(--good-on)}
.tag[data-k="neutral"]{--c:var(--muted);--ct:var(--sunken);--con:var(--ink)}
.tag .ic{width:14px;height:14px;display:none}
.tag .tk{display:none}
.tag .tv{display:inline}
/* T5 icon tint */
.ts-5 .tag{border-radius:9px;padding:6px 11px 6px 8px}
.ts-5 .tag .ic{display:block}
/* ---------- TRANSCRIPT (X) ---------- */
.xt{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:14px;box-shadow:var(--card-sh);min-width:0}
.xt-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.livepill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--bad-tint);color:var(--bad-text);font:800 12px var(--body);letter-spacing:.06em;text-transform:uppercase}
.livepill i{width:8px;height:8px;border-radius:50%;background:var(--rec);animation:recpulse 1.4s ease-out infinite}
.xt-who{flex:1;min-width:160px;font-size:14px;color:var(--muted)}
.xt-who b{color:var(--ink)}
.xsrch{display:flex;align-items:center;gap:6px;padding:0 10px;height:38px;border-radius:10px;background:var(--sunken);border:1px solid var(--line);color:var(--muted);flex:0 1 220px;min-width:150px;transition:border-color .2s,box-shadow .2s}
.xsrch:focus-within{border-color:var(--focus);box-shadow:0 0 0 3px rgba(var(--bl-rgb),.25)}
.xsrch .ic{width:16px;height:16px}
.xsrch input{border:0;background:none;outline:none;width:100%;font-size:14px;color:var(--ink);min-width:0}
.xt-ch{display:none;gap:6px;flex-wrap:wrap;margin:-2px 0 12px}
.xt-ch button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:5px 11px;font:700 12px var(--body);cursor:pointer;display:inline-flex;gap:6px;align-items:center;transition:background-color .2s,transform .16s var(--ease)}
.xt-ch button time{color:var(--muted);font-weight:600}
@media (hover:hover){.xt-ch button:hover{background:var(--pink-tint);transform:translateY(-1px)}}
.xt-ch button.coach-ch{border-color:color-mix(in srgb,var(--warn) 50%,transparent);color:var(--warn)}
.xt-lanes{display:none}
.xl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.ln{display:flex;gap:10px;align-items:flex-start;transition:opacity .25s}
.ln .av{width:32px;height:32px;font-size:12px}
.ln.t .av{background:var(--pink-tint);color:var(--pink)}
.ln.c .av{background:var(--blue-tint);color:var(--blue)}
.bd{min-width:0;flex:1;display:flex;flex-direction:column}
.meta{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.meta .who{color:var(--ink);font-size:13px;font-weight:700}
.meta time{font-variant-numeric:tabular-nums}
.meta .role{font-weight:600}
.kbadge{display:none}
.txt{margin:2px 0 0;font-size:15px;line-height:1.5}
.tx mark{background:rgba(var(--pk-rgb),.38);color:inherit;border-radius:3px;padding:0 1px}
.ln.miss{opacity:.28}
.ln.flash{animation:flash 1.2s var(--ease)}
@keyframes flash{0%,100%{box-shadow:none}25%{box-shadow:0 0 0 3px rgba(var(--pk-rgb),.6);border-radius:12px}}
.coach{margin-top:8px;display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:var(--warn-tint);border:1px solid color-mix(in srgb,var(--warn) 45%,transparent);font-size:13px;line-height:1.4;color:var(--ink)}
.coach .ic{color:var(--warn);width:18px;height:18px;margin-top:1px}
.coach b{display:block;color:var(--warn);font-size:13px;letter-spacing:.02em}
.w{transition:opacity .2s,color .2s,background-color .2s}
.w.pend{opacity:.35}
.typing{display:inline-flex;gap:3px;margin-left:6px;vertical-align:middle}
.typing i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.4;animation:typing 1.1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes typing{0%,60%,100%{transform:none;opacity:.35}30%{transform:translateY(-3px);opacity:.9}}
.ln.live.said-all .typing{visibility:hidden}
.xt-empty{margin:8px 0 0;color:var(--muted);font-size:14px}
/* X2 speaker rail */
.xs-2 .xl{gap:2px}
.xs-2 .ln{--rail:var(--blue);padding:10px 12px;border-left:3px solid var(--rail);border-radius:0 12px 12px 0;background:linear-gradient(90deg,color-mix(in srgb,var(--rail) 9%,transparent),transparent 55%)}
.xs-2 .ln.t{--rail:var(--pink)}
.xs-2 .ln.cont{padding-top:0;margin-top:-2px}
.xs-2 .ln.cont .meta{display:none}
.xs-2 .ln.cont .av{visibility:hidden;height:0}
.xs-2 .meta .role{padding:1px 7px;border-radius:999px;background:color-mix(in srgb,var(--rail) 18%,transparent);color:var(--rail);font-size:11px;font-weight:800}
.xs-2 .meta time{margin-left:auto}
/* ---------- RECORD (R) ---------- */
.fvs{background:var(--raised);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--card-sh)}
.fvs-h{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--line)}
.fvs-h .t{flex:1;min-width:150px}
.fvs-h .t small{display:block;color:var(--muted);font-size:12px;font-weight:600}
.fvs-h .t b{font:700 17px var(--display)}
.fvs-b{padding:14px 16px;display:grid;gap:8px}
.fvs-b .step{font:700 12px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fvs-b p{margin:0;font-size:14px}
.rec{display:flex;align-items:center;gap:10px}
.rslot{display:contents}
.rec:not([data-state="on"]) .r-on{display:none!important}
.rec[data-state="on"] .r-off{display:none!important}
.rt{font:800 17px var(--num);font-variant-numeric:tabular-nums;letter-spacing:.04em}
@keyframes recpulse{0%{box-shadow:0 0 0 0 rgba(255,59,48,.6)}100%{box-shadow:0 0 0 9px rgba(255,59,48,0)}}
.bars{display:inline-flex;gap:2px;align-items:center;height:14px}
.bars i{width:3px;height:100%;border-radius:2px;background:currentColor;animation:eq .9s ease-in-out infinite}
.bars i:nth-child(2){animation-delay:-.3s}.bars i:nth-child(3){animation-delay:-.6s}.bars i:nth-child(4){animation-delay:-.15s}
@keyframes eq{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
/* R3 */
.rec.r3{flex:1 1 100%;flex-direction:column;align-items:stretch;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:12px 14px}
.r3-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dev{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:13px}
.devdot{width:9px;height:9px;border-radius:50%;background:var(--warn)}
.rec.r3[data-state="on"] .devdot{background:var(--good)}
.wave{display:flex;align-items:center;gap:3px;height:40px}
.wave i{flex:1;height:100%;border-radius:3px;background:var(--line);transform:scaleY(.08);transition:transform .35s var(--ease),background-color .3s}
.rec.r3[data-state="on"] .wave i{background:var(--pink);animation:wv 1.1s ease-in-out infinite;animation-delay:var(--d)}
@keyframes wv{0%,100%{transform:scaleY(.14)}50%{transform:scaleY(var(--h))}}
.r3-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.r3-acts .hint{margin-left:auto}
/* ---------- PREVIEW SHELL (sidebar kept as it is today) ---------- */
.shell{border-radius:22px;overflow:hidden;border:1px solid var(--line);background:var(--canvas);box-shadow:0 40px 90px -40px rgba(0,0,0,.8)}
.app-top{display:flex;align-items:center;gap:14px;padding:12px 20px;background:var(--app-top);border-bottom:1px solid var(--line)}
.logo-tile{width:46px;height:46px;border-radius:12px;background:#fff;display:grid;place-items:center;flex:none}
.logo-tile img{width:38px;height:38px}
.ownersel{border:1px solid var(--border);border-radius:12px;padding:5px 36px 5px 14px;position:relative;min-width:0}
.ownersel small{display:block;font:700 11px var(--body);letter-spacing:.1em;color:var(--muted)}
.ownersel b{font-size:15px;white-space:nowrap}
.ownersel .ic{position:absolute;right:10px;top:50%;margin-top:-9px;transform:rotate(-90deg);color:var(--muted)}
.app-top .ui-btn{min-height:44px}
.app-body{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:640px}
.side{background:var(--side-bg);border-right:1px solid var(--line);padding:16px 12px;display:flex;flex-direction:column;gap:4px}
.nav-i{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:12px;color:var(--muted);font-weight:500;font-size:15px;text-decoration:none}
.nav-i .ic{width:21px;height:21px}
.nav-i.on{background:var(--raised);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--pink)}
.nav-badge{margin-left:auto;background:var(--bad);color:#fff;font:800 12px var(--body);padding:2px 9px;border-radius:999px}
.side .collapse{margin-top:auto;border-top:1px solid var(--line);border-radius:0;padding-top:16px}
.app-main{padding:24px;display:grid;gap:20px;min-width:0;align-content:start}
.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:20px;align-items:center;background:var(--hero);color:#fff;border-radius:26px;padding:26px 28px;box-shadow:0 28px 56px -28px rgba(var(--pk-rgb),.9),inset 0 1px 0 rgba(255,255,255,.28)}
.hero h2{font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.03;font-weight:800;letter-spacing:-.035em;margin:6px 0 8px}
.hero p{margin:0;opacity:.92;font-size:16px}
.hero-lion{width:150px;filter:drop-shadow(0 16px 22px rgba(0,0,0,.35))}
.hero-stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.hero-stats div{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:10px 14px;min-width:110px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.hero-stats b{display:block;font:800 30px/1 var(--num);letter-spacing:.01em}
.hero-stats small{font-size:12px;font-weight:600;opacity:.9}
.lvl{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:13px;font-weight:700}
.lvl-bar{flex:1;max-width:320px;height:8px;border-radius:8px;background:rgba(0,0,0,.22);overflow:hidden}
.lvl-bar i{display:block;height:100%;width:68%;background:#fff;border-radius:inherit}
.pv-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.pv-note{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;color:var(--muted);font-size:14px}
.pv-note code{font:800 18px var(--num);color:var(--pink);letter-spacing:.04em}


/* ================= ROUND 2 ================= */
.r1lock{display:inline-flex;align-items:center;gap:8px;padding:4px 10px 4px 8px;border-radius:999px;background:var(--sunken);border:1px solid var(--line);font:700 11px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);white-space:nowrap;flex:none}
.r1lock code{font:800 15px var(--num);color:var(--ink);letter-spacing:.04em;text-transform:none}
.r1lock .ic{width:14px;height:14px;color:var(--good)}
.intro .how code{white-space:nowrap}
.opt-body{display:flex;flex-direction:column;gap:16px;min-width:0}
.cap{font-size:13px;color:var(--muted);margin:0}
.cap b{color:var(--ink)}
.row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:14px;align-items:start}
.num{font-family:var(--num);font-weight:800;letter-spacing:.01em;font-variant-numeric:tabular-nums}

/* ---------- New icon set (I) ---------- */
.ni{width:22px;height:22px;flex:none;overflow:visible}
.ni .s,.ni .x,.ni .d,.ni .k,.ni .a{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.is-2 .ni .s{fill:color-mix(in srgb,var(--pink) 24%,transparent);stroke:var(--pink)}
.is-2 .ni .x{stroke:var(--pink)}
.is-2 .ni .d,.is-2 .ni .k,.is-2 .ni .a{stroke:var(--blue);stroke-width:2}
.is-3 .ni .s{fill:currentColor;stroke-width:2.6}
.is-3 .ni .x,.is-3 .ni .a{stroke-width:2.3}
.is-3 .ni .d{stroke:var(--ni-bg,var(--raised));stroke-width:2}
.is-3 .ni .k{fill:var(--ni-bg,var(--raised));stroke:var(--ni-bg,var(--raised));stroke-width:1.2}
.is-4 .ni .d,.is-4 .ni .k,.is-4 .ni .a{stroke:var(--pink);stroke-width:2.3}
.icogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px}
.icot{--ni-bg:var(--raised);display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px 10px;border-radius:14px;background:var(--raised);border:1px solid var(--line);color:var(--ink);transition:transform .18s var(--ease),border-color .2s}
.icot .ni{width:30px;height:30px}
.icot small{font-size:12px;color:var(--muted);font-weight:600}
@media (hover:hover){.icot:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--pink) 50%,var(--line))}}
.inuse{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:12px;border-radius:14px;background:var(--sunken);border:1px solid var(--line)}
.btn .ni{width:18px;height:18px}
.btn.p{--ni-bg:var(--ink)}
.btn.s{--ni-bg:var(--raised)}
.bs-6 .btn.p .ni{color:var(--pink)}
.bs-6 .btn.s .ni{color:var(--blue)}
.tag .ni{width:15px;height:15px}
.tag{--ni-bg:var(--ct)}
.inuse .navlike{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:var(--raised);box-shadow:inset 3px 0 0 var(--pink);font-weight:700;font-size:14px;--ni-bg:var(--raised)}

/* ---------- Cards (K) ---------- */
.card{--k-bg:var(--raised);--k-bd:var(--line);--k-r:18px;--k-sh:var(--card-sh);--k-shh:var(--card-sh);--k-lift:none;--k-bdh:var(--k-bd);
  position:relative;display:block;background:var(--k-bg);border:1px solid var(--k-bd);border-radius:var(--k-r);box-shadow:var(--k-sh);min-width:0;color:var(--ink);text-align:left;
  transition:transform .24s var(--ease),box-shadow .24s var(--ease),border-color .2s}
@media (hover:hover){.card.hov:hover{transform:var(--k-lift);box-shadow:var(--k-shh);border-color:var(--k-bdh)}}
.card:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.card-h{display:flex;align-items:center;gap:12px;padding:14px 16px 0;min-width:0}
.card-b{padding:12px 16px 16px;display:grid;gap:12px;min-width:0}
.card-t{flex:1;min-width:0;font:700 15px var(--display)}
.card-e{display:block;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.kpis b{display:block;font:800 clamp(22px,2.1vw,30px)/1 var(--num);letter-spacing:.01em;white-space:nowrap}
.kpis small{font-size:12px;color:var(--muted);font-weight:600}
.kspark{display:flex;align-items:flex-end;gap:5px;height:34px}
.kspark i{flex:1;border-radius:4px 4px 2px 2px;background:color-mix(in srgb,var(--blue) 35%,transparent);height:var(--h)}
.kspark i:last-child{background:var(--pink)}
.kfoot{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);font-weight:600}
/* K1 */
.ks-1 .card{--k-bg:var(--surface);--k-sh:none;--k-shh:none;--k-bdh:color-mix(in srgb,var(--pink) 60%,var(--line))}
.ks-1 .card-h{padding-bottom:12px;border-bottom:1px solid var(--line)}
/* K2 */
.ks-2 .card{--k-lift:translateY(-4px);--k-shh:0 2px 4px rgba(0,0,0,.12),0 30px 46px -24px var(--shc)}
/* K3 */
.ks-3 .card{--k-bg:linear-gradient(160deg,color-mix(in srgb,var(--pink-tint) 60%,var(--raised)),var(--raised) 55%,color-mix(in srgb,var(--blue-tint) 70%,var(--raised)));--k-bd:var(--gl-bd);--k-r:20px;
  --k-sh:inset 0 1px 0 var(--gl-hi),0 16px 36px -22px var(--shc);--k-shh:inset 0 1px 0 var(--gl-hi),0 26px 46px -22px rgba(var(--pk-rgb),.55);--k-lift:translateY(-2px)}
/* K4 */
.ks-4 .card{overflow:hidden;--k-lift:translateY(-3px);--k-shh:0 26px 44px -24px rgba(var(--pk-rgb),.6)}
.ks-4 .card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--hero)}
.ks-4 .card-h{padding-top:18px}
.ks-4 .card-t{font:800 12px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--pink)}
/* K5 */
.ks-5 .card{overflow:hidden;--k-r:16px;--k-lift:translateY(-2px);--k-shh:0 22px 40px -22px var(--shc)}
.ks-5 .card-h{background:var(--sunken);padding:12px 16px;border-bottom:1px solid var(--line)}
.ks-5 .card-b{padding-top:14px}
/* K6 */
.ks-6 .card{--spine:var(--blue);border-left:0;padding-left:5px;overflow:hidden;--k-shh:0 0 0 1px color-mix(in srgb,var(--spine) 45%,transparent),0 20px 40px -22px color-mix(in srgb,var(--spine) 70%,transparent);--k-lift:translateX(2px)}
.ks-6 .card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--spine)}
.ks-6 .card[data-spine="bad"]{--spine:var(--bad)}
.ks-6 .card[data-spine="good"]{--spine:var(--good)}
.ks-6 .card[data-spine="warn"]{--spine:var(--warn)}
.ks-6 .card[data-spine="pink"]{--spine:var(--pink)}
/* K7 */
.ks-7 .card{--k-sh:0 6px 0 -3px var(--raised3),0 12px 0 -6px color-mix(in srgb,var(--raised3) 55%,transparent),0 20px 30px -18px var(--shc);
  --k-shh:0 9px 0 -3px var(--raised3),0 18px 0 -6px color-mix(in srgb,var(--raised3) 55%,transparent),0 28px 36px -20px var(--shc);--k-lift:translateY(-3px);margin-bottom:12px}
/* K8 */
.ks-8 .card{border:1px solid transparent;background:linear-gradient(var(--raised),var(--raised)) padding-box,linear-gradient(135deg,var(--pink),color-mix(in srgb,var(--pink) 30%,var(--blue)) 50%,var(--blue)) border-box;
  --k-sh:0 16px 34px -24px var(--shc);--k-shh:0 0 0 3px rgba(var(--pk-rgb),.14),0 24px 44px -22px rgba(var(--pk-rgb),.7);--k-lift:translateY(-2px);--k-bdh:transparent}

/* ---------- Mini app (N and P2) ---------- */
.mini{display:grid;grid-template-columns:150px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--canvas);height:420px;box-shadow:var(--card-sh)}
.mtop{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--app-top);border-bottom:1px solid var(--line)}
.mtop img{width:28px;height:28px;border-radius:8px;background:#fff;padding:2px}
.mtop b{font:700 13px var(--display)}
.mtop .spacer{flex:1}
.mtop .mdot{width:24px;height:24px;border-radius:50%;background:var(--pink-tint);color:var(--pink);display:grid;place-items:center;font:700 10px var(--display)}
.mside{background:var(--side-bg);border-right:1px solid var(--line);padding:10px 8px;display:flex;flex-direction:column;gap:2px;position:relative}
.mnav{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;border:0;background:none;color:var(--muted);font:500 13px var(--body);cursor:pointer;text-align:left;transition:background-color .2s,color .2s}
.mnav .ic{width:17px;height:17px}
.mnav[aria-current="page"]{background:var(--raised);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--pink)}
@media (hover:hover){.mnav:hover{color:var(--ink)}}
.mnav:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.mmain{position:relative;overflow:hidden;min-width:0}
.mpages{display:grid;height:100%;overflow:hidden}
.mpg{grid-area:1/1;padding:14px;display:flex;flex-direction:column;gap:10px;min-width:0;visibility:hidden;opacity:0;pointer-events:none}
.mpg.on{visibility:visible;opacity:1;pointer-events:auto}
.mph{border-radius:14px;padding:12px 14px;background:var(--hero);color:#fff;position:relative;overflow:hidden}
.mph small{display:block;font:700 10px var(--body);letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.mph b{font:800 18px/1.15 var(--display);letter-spacing:-.02em}
.mph img{position:absolute;right:8px;bottom:-6px;width:62px;filter:drop-shadow(0 8px 10px rgba(0,0,0,.3))}
.mph .mst{display:flex;gap:8px;margin-top:8px}
.mph .mst span{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);border-radius:10px;padding:4px 8px;font-size:11px;font-weight:600}
.mph .mst b{font:800 17px var(--num);margin-right:4px}
.mrow{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;background:var(--raised);border:1px solid var(--line);min-width:0}
.mrow .av{width:28px;height:28px;font-size:11px}
.mrow .mt{flex:1;min-width:0}
.mrow .mt b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrow .mt small{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrow .mv{font:800 18px var(--num)}
.mrow .tag{font-size:11.5px;padding:4px 8px 4px 6px}
.mrow .sw{flex:none}
.stars{color:#F2B233;letter-spacing:1px;font-size:13px}
.mbar{position:absolute;left:0;right:0;top:0;height:3px;z-index:3;background:var(--hero);transform-origin:left;transform:scaleX(0);opacity:0;pointer-events:none}
.mghost{position:absolute;left:0;top:0;z-index:4;border-radius:14px;background:linear-gradient(160deg,var(--pink-tint),var(--raised));border:1px solid color-mix(in srgb,var(--pink) 40%,var(--line));pointer-events:none;opacity:0;transform-origin:0 0}
.jm{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.jm b{font:800 18px var(--num);color:var(--good)}
.jm .ic{width:16px;height:16px;color:var(--good)}
/* N1 cross-fade */
.ns-1 .mpg{transition:opacity .28s var(--ease),visibility 0s linear .28s}
.ns-1 .mpg.on{transition:opacity .28s var(--ease),visibility 0s}
/* N2 slide */
.ns-2 .mpg{transform:translateX(var(--sx,100%));transition:transform .42s var(--ease),opacity .42s var(--ease),visibility 0s linear .42s}
.ns-2 .mpg.on{transform:none;transition:transform .42s var(--ease),opacity .3s var(--ease),visibility 0s}
.ns-2 .mpg.nt{transition:none!important}
/* N3 card expand */
.ns-3 .mpg{transition:opacity .16s var(--ease),visibility 0s linear .16s}
.ns-3 .mpg.on{transition:opacity .24s var(--ease) .26s,visibility 0s}
.ns-3 .mghost.go{transition:transform .42s var(--ease),opacity .2s ease .38s}
/* N4 content fade, fixed shell */
.ns-4 .mpg{transition:opacity .12s linear,visibility 0s linear .12s}
.ns-4 .mpg.on{transition:opacity .18s linear .12s,visibility 0s linear .12s}
/* N5 rise + stagger */
.ns-5 .mpg{transition:opacity .12s linear,visibility 0s linear .12s}
.ns-5 .mpg.on{transition:visibility 0s}
.ns-5 .mpg>*{transition:opacity .32s var(--ease),transform .38s var(--ease)}
.ns-5 .mpg:not(.on)>*{opacity:0;transform:translateY(10px)}
.ns-5 .mpg.on>*{transition-delay:calc(var(--i,0)*55ms + 60ms)}
/* N6 instant + bar */
.ns-6 .mbar.go{animation:mbar .55s var(--ease) forwards}
@keyframes mbar{0%{opacity:1;transform:scaleX(0)}70%{opacity:1;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1)}}

/* ---------- Loading (L) ---------- */
.ld{position:relative;background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:14px;display:grid;gap:12px;box-shadow:var(--card-sh);overflow:hidden;--sk:color-mix(in srgb,var(--raised3) 70%,var(--raised));--shine:rgba(255,255,255,.09)}
:root[data-theme="light"] .ld{--sk:#E6EBF3;--shine:rgba(255,255,255,.85)}
.ld-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ld-h .t{flex:1;min-width:120px}
.ld-h .t b{display:block;font:700 16px var(--display)}
.ld-h .t small{font-size:12px;color:var(--muted);font-weight:600}
.ld-k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ld-k .kp{background:var(--sunken);border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:grid;gap:4px;justify-items:start}
.ld-k .kp b{font:800 26px/1 var(--num);letter-spacing:.01em}
.ld-k .kp small{font-size:12px;color:var(--muted);font-weight:600}
.ld-rows{display:grid;gap:8px;transition:opacity .25s}
.lrow{display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;background:var(--surface);border:1px solid var(--line);min-width:0}
.lrow .lt{flex:1;min-width:0;display:grid;gap:3px;justify-items:start}
.lrow .lt b{font-size:14px}
.lrow .lt small{font-size:12px;color:var(--muted)}
.lrow .av{width:32px;height:32px;font-size:12px}
.sk-on[data-state="loading"] .sk{color:transparent!important;background:var(--sk)!important;border-color:transparent!important;box-shadow:none!important;border-radius:6px;-webkit-text-fill-color:transparent}
.sk-on[data-state="loading"] .sk.av{border-radius:50%}
.sk-on[data-state="loading"] .sk.tag{border-radius:999px}
.sk-on[data-state="loading"] .sk>*{visibility:hidden}
.ld-over{position:absolute;inset:0;display:none;place-items:center;align-content:center;gap:10px;text-align:center;z-index:2}
.ld-bar{position:absolute;left:0;right:0;top:0;height:3px;overflow:hidden;display:none;z-index:2}
.ld-bar i{position:absolute;top:0;bottom:0;left:0;width:40%;background:var(--hero);border-radius:3px;animation:indet 1.1s var(--ease) infinite}
@keyframes indet{0%{transform:translateX(-100%)}100%{transform:translateX(260%)}}
/* L1 shimmer */
.ls-1 .ld[data-state="loading"] .sk{position:relative;overflow:hidden}
.ls-1 .ld[data-state="loading"] .sk::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--shine),transparent);transform:translateX(-100%);animation:shim 1.25s ease-in-out infinite}
@keyframes shim{to{transform:translateX(100%)}}
/* L2 pulse */
.ls-2 .ld[data-state="loading"] .sk{animation:skp 1.4s ease-in-out infinite}
@keyframes skp{50%{opacity:.45}}
/* L3 progressive */
.ls-3 .ld .rv{transition:opacity .35s var(--ease),transform .35s var(--ease)}
.ls-3 .ld[data-state="loading"] .rv:not(.got){opacity:0;transform:translateY(6px)}
/* L4 lion */
.ls-4 .ld[data-state="loading"] .ld-over{display:grid}
.ls-4 .ld[data-state="loading"] .ld-k,.ls-4 .ld[data-state="loading"] .ld-rows{opacity:0}
.ls-4 .ld .ld-k,.ls-4 .ld .ld-rows{transition:opacity .3s var(--ease)}
.lionld{position:relative;width:84px;height:84px;display:grid;place-items:center}
.lionld img{width:60px;animation:bob 1.6s ease-in-out infinite}
.lionld::before{content:"";position:absolute;inset:0;border-radius:50%;border:3px solid color-mix(in srgb,var(--pink) 18%,transparent);border-top-color:var(--pink);animation:spin .9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bob{50%{transform:translateY(-4px)}}
.ld-over p{margin:0;font-size:13px;color:var(--muted);font-weight:600}
/* L5 refresh bar + dim */
.ls-5 .ld[data-state="loading"] .ld-bar{display:block}
.ls-5 .ld[data-state="loading"] .ld-rows,.ls-5 .ld[data-state="loading"] .ld-k{opacity:.42}
.ls-5 .ld .ld-k{transition:opacity .25s}
/* L6 count-up: static skeleton, then numbers roll */
.ls-6 .ld .ld-rows{transition:opacity .3s}

/* ---------- Empty states (E) ---------- */
.pnl{background:var(--raised);border:1px solid var(--line);border-radius:18px;box-shadow:var(--card-sh);overflow:hidden;min-width:0}
.pnl-h{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line);font:700 14px var(--display)}
.pnl-h .ic{color:var(--muted);width:17px;height:17px}
.pnl-h .n{margin-left:auto;font:800 16px var(--num);color:var(--muted)}
.empty{display:grid;justify-items:center;text-align:center;gap:8px;padding:22px 18px 20px;min-height:250px;align-content:center}
.em-t{font:700 17px var(--display);letter-spacing:-.01em}
.em-p{margin:0;color:var(--muted);font-size:14px;max-width:34ch;line-height:1.45}
.em-a{margin-top:6px;display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.es-1 .em-art,.em-lion{position:relative;width:96px;height:96px;display:grid;place-items:center}
.em-lion::before{content:"";position:absolute;inset:8px;border-radius:50%;background:radial-gradient(circle,rgba(var(--pk-rgb),.35),transparent 70%)}
.em-lion img{position:relative;width:78px;filter:drop-shadow(0 10px 14px rgba(0,0,0,.3))}
.em-ring{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--pink-tint);color:var(--pink);box-shadow:0 0 0 8px color-mix(in srgb,var(--pink-tint) 45%,transparent)}
.em-ring .ic{width:28px;height:28px}
.em-ring.blue{background:var(--blue-tint);color:var(--blue);box-shadow:0 0 0 8px color-mix(in srgb,var(--blue-tint) 45%,transparent)}
.em-svg{width:170px;height:104px}
.em-dash{border:2px dashed var(--border);border-radius:16px;padding:22px 16px;margin:14px;min-height:222px;background:repeating-linear-gradient(135deg,transparent 0 12px,color-mix(in srgb,var(--sunken) 60%,transparent) 12px 24px)}
.em-dash .ic.big{width:30px;height:30px;color:var(--muted)}
.em-one{display:flex;align-items:center;gap:10px;padding:14px;min-height:0;text-align:left}
.em-one .ic{color:var(--muted);width:18px;height:18px}
.em-one .t{flex:1;min-width:0;font-size:14px}
.em-one .t b{font-weight:700}
.em-one .t span{color:var(--muted)}
.em-zero{font:800 104px/0.85 var(--num);color:transparent;-webkit-text-stroke:2px var(--border);letter-spacing:-.01em}
.em-cmp{display:inline-flex;gap:8px;align-items:center;padding:6px 12px;border-radius:999px;background:var(--sunken);border:1px solid var(--line);font-size:13px;color:var(--muted);font-weight:600}
.em-cmp b{font:800 17px var(--num);color:var(--ink)}

/* ---------- Alerts & toasts (A) ---------- */
[data-sev="info"]{--sv:var(--info);--svt:var(--info-tint);--svo:var(--info-on);--svx:var(--info)}
[data-sev="good"]{--sv:var(--good);--svt:var(--good-tint);--svo:var(--good-on);--svx:var(--good)}
[data-sev="warn"]{--sv:var(--warn);--svt:var(--warn-tint);--svo:var(--warn-on);--svx:var(--warn)}
[data-sev="bad"]{--sv:var(--bad);--svt:var(--bad-tint);--svo:#fff;--svx:var(--bad-text)}
.astage{position:relative;display:grid;gap:14px;padding-bottom:74px;min-width:0}
.al{position:relative;display:flex;align-items:flex-start;gap:12px;padding:14px;border-radius:14px;min-width:0;flex-wrap:wrap}
.al-ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--svx);flex:none}
.al-ic .ic{width:20px;height:20px}
.al-t{flex:1 1 220px;min-width:0}
.al-l{display:none;font:800 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--svx);margin-bottom:2px}
.al-t b{display:block;font:700 16px var(--display);letter-spacing:-.01em}
.al-t small{display:block;color:var(--muted);font-size:13.5px;line-height:1.4;margin-top:2px}
.al-a{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.al:not(.claimed) .cl{display:none!important}
.al.claimed .op{display:none!important}
.al.claimed{--sv:var(--good);--svt:var(--good-tint);--svx:var(--good);--svo:var(--good-on)}
.al.claimed .al-t{animation:fadein .35s var(--ease)}
@keyframes fadein{from{opacity:0;transform:translateY(4px)}}
.sevs{display:grid;gap:8px}
.sevs .ctx-l{margin-bottom:2px}
.sev{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;font-size:14px;min-width:0}
.sev .ic{width:17px;height:17px;color:var(--svx);flex:none}
.sev .sl{font:800 11px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--svx);min-width:74px}
.sev .st{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tst{position:absolute;left:50%;bottom:10px;z-index:5;display:flex;align-items:center;gap:10px;max-width:calc(100% - 16px);padding:10px 10px 10px 14px;border-radius:14px;font-size:14px;font-weight:600;
  opacity:0;visibility:hidden;transform:translate(-50%,14px);transition:opacity .22s var(--ease),transform .34s var(--spring),visibility 0s linear .34s;pointer-events:none}
.tst.show{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .22s var(--ease),transform .34s var(--spring),visibility 0s;pointer-events:auto}
.tst .tt{min-width:0}
.tst .tt b{font-weight:800}
.tst .ic{width:18px;height:18px;flex:none}
.tst button{border:0;background:none;color:inherit;font:800 13px var(--body);padding:6px 10px;border-radius:8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.tst button:focus-visible{outline:2px solid var(--focus)}
.tlane{position:absolute;left:0;right:0;bottom:0;height:62px;border:1.5px dashed var(--line);border-radius:14px;display:grid;place-items:center;color:var(--muted);font-size:12px;font-weight:600;letter-spacing:.04em}
/* A1 tinted bar */
.as-1 .al{background:var(--svt);border-left:4px solid var(--sv);border-radius:6px 14px 14px 6px}
.as-1 .sev{background:color-mix(in srgb,var(--svt) 70%,transparent);border-left:3px solid var(--sv);border-radius:4px 10px 10px 4px}
.as-1 .tst{background:var(--ink);color:var(--canvas);box-shadow:0 18px 36px -14px rgba(0,0,0,.6)}
.as-1 .tst .ic{color:var(--good)}
/* A2 color header */
.as-2 .al{padding:0;gap:0;background:var(--raised);border:1px solid var(--line);overflow:hidden;box-shadow:var(--card-sh);flex-direction:column;align-items:stretch}
.as-2 .al-hd{display:flex;align-items:center;gap:8px;padding:9px 14px;background:var(--sv);color:var(--svo);font:800 12px var(--body);letter-spacing:.08em;text-transform:uppercase}
.as-2 .al-hd .ic{width:16px;height:16px}
.as-2 .al-ic{display:none}
.as-2 .al-t{padding:12px 14px 4px;flex:none}
.as-2 .al-a{padding:6px 14px 14px}
.as-2 .sev{background:var(--raised);border:1px solid var(--line);border-top:3px solid var(--sv);border-radius:10px}
.as-2 .tst{left:auto;right:10px;transform:translateX(24px);background:var(--raised);color:var(--ink);border:1px solid var(--line);border-top:3px solid var(--good);box-shadow:0 18px 36px -16px var(--shc)}
.as-2 .tst.show{transform:none}
.as-2 .tst .ic{color:var(--good)}
.al-hd{display:none}
.as-2 .al-hd{display:flex}
/* A3 floating card */
.as-3 .al{background:var(--raised);border:1px solid var(--line);box-shadow:0 2px 4px rgba(0,0,0,.12),0 24px 44px -24px var(--shc);border-radius:18px;padding:16px}
.as-3 .al-ic{width:42px;height:42px;border-radius:50%;background:var(--svt)}
.as-3 .al-l{display:block}
.as-3 .sev{background:var(--raised);border:1px solid var(--line);box-shadow:0 10px 20px -16px var(--shc)}
.as-3 .sev .ic{width:26px;height:26px;padding:5px;border-radius:50%;background:var(--svt);box-sizing:border-box}
.as-3 .tst{background:var(--raised);color:var(--ink);border:1px solid var(--line);box-shadow:0 24px 44px -18px var(--shc);overflow:hidden;padding-bottom:13px}
.as-3 .tst .ic{color:var(--good)}
.as-3 .tst::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--good);transform-origin:left;transform:scaleX(0)}
.as-3 .tst.show::after{animation:ttimer 3.2s linear forwards}
@keyframes ttimer{from{transform:scaleX(1)}to{transform:scaleX(0)}}
/* A4 compact strip */
.as-4 .al{align-items:center;padding:7px 8px 7px 12px;border-radius:999px;background:var(--svt);gap:10px;flex-wrap:nowrap}
.as-4 .al-ic{width:22px;height:22px}
.as-4 .al-ic .ic{width:18px;height:18px}
.as-4 .al-t{flex:1 1 auto}
.as-4 .al-t b{font:700 14px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-4 .al-t small{display:none}
.as-4 .al .btn.g.op{display:none}
.as-4 .al .btn{min-height:34px;padding:6px 12px;border-radius:999px}
.as-4 .sev{border-radius:999px;background:var(--svt);padding:6px 12px}
.as-4 .sev .sl{min-width:0}
.as-4 .tst{top:-4px;bottom:auto;transform:translate(-50%,-14px);background:var(--good);color:var(--good-on);border-radius:999px;padding:6px 6px 6px 12px;box-shadow:0 12px 24px -12px var(--good)}
.as-4 .tst.show{transform:translate(-50%,0)}
.as-4 .astage{padding-bottom:0;padding-top:0}
.as-4 .tlane{display:none}
/* A5 glow outline */
.as-5 .al{background:transparent;border:1.5px solid color-mix(in srgb,var(--sv) 70%,transparent);box-shadow:0 0 22px -6px color-mix(in srgb,var(--sv) 70%,transparent),inset 0 0 24px -12px color-mix(in srgb,var(--sv) 60%,transparent)}
.as-5 .al-ic{position:relative}
.as-5 .al:not(.claimed)[data-sev="bad"] .al-ic::after{content:"";position:absolute;top:2px;right:2px;width:9px;height:9px;border-radius:50%;background:var(--rec);animation:recpulse 1.4s ease-out infinite}
.as-5 .sev{border:1px solid color-mix(in srgb,var(--sv) 55%,transparent);box-shadow:0 0 14px -6px var(--sv)}
.as-5 .tst{background:color-mix(in srgb,var(--raised) 70%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--ink);border:1px solid color-mix(in srgb,var(--good) 60%,transparent);box-shadow:0 0 24px -6px var(--good)}
.as-5 .tst .ic{color:var(--good)}
/* A6 loud when it matters */
.as-6 .al{background:var(--raised);border:1px solid var(--line)}
.as-6 .al[data-sev="bad"]:not(.claimed){background:linear-gradient(135deg,#FF4A3D,#B3141F);border-color:transparent;color:#fff;box-shadow:0 20px 40px -20px rgba(215,0,21,.8)}
.as-6 .al[data-sev="bad"]:not(.claimed) .al-ic{background:rgba(255,255,255,.18);color:#fff}
.as-6 .al[data-sev="bad"]:not(.claimed) .al-t small{color:rgba(255,255,255,.88)}
.as-6 .al[data-sev="bad"]:not(.claimed) .btn.p{--p-bg:#fff;--p-fg:#8E0E17}
.as-6 .al[data-sev="bad"]:not(.claimed) .btn.p .ic,.as-6 .al[data-sev="bad"]:not(.claimed) .btn.p .ni{color:#D70015}
.as-6 .al[data-sev="bad"]:not(.claimed) .btn.g{--g-fg:#fff;--g-bgh:rgba(255,255,255,.14)}
.as-6 .sev{background:transparent;border-bottom:1px solid var(--line);border-radius:0}
.as-6 .sev[data-sev="warn"]{background:var(--svt);border-radius:10px;border:0}
.as-6 .sev[data-sev="bad"]{background:linear-gradient(135deg,#FF4A3D,#B3141F);color:#fff;border-radius:10px;border:0}
.as-6 .sev[data-sev="bad"] .ic,.as-6 .sev[data-sev="bad"] .sl{color:#fff}
.as-6 .tst{background:var(--hero);color:#fff;box-shadow:0 18px 36px -14px rgba(var(--pk-rgb),.9)}

/* ---------- Lift-out / modal / drawer (M) ---------- */
.mstage{position:relative;height:440px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--canvas);isolation:isolate}
.mboard{padding:14px;display:grid;gap:12px;transition:transform .4s var(--ease),filter .3s,opacity .3s;transform-origin:50% 30%}
.mboard-h{display:flex;align-items:center;gap:10px}
.mboard-h b{font:700 16px var(--display);flex:1}
.mtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.mtile{font:inherit;cursor:pointer;padding:0;width:100%}
.mtile .card-h{padding:12px 12px 0}
.mtile .card-b{padding:8px 12px 12px;gap:8px}
.mtile .av{width:32px;height:32px;font-size:12px}
.mtile .job-who b{font-size:15px}
.mtile .job-who small{font-size:12px}
.mtile .meta2{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);font-weight:600}
.mtile .meta2 .ni{width:15px;height:15px}
.ms-6 .mtile.lifted{z-index:6;position:relative}
.mlayer{position:absolute;left:0;right:0;top:var(--vt,0px);height:var(--vh,100%);z-index:5;pointer-events:none}
.mback{position:absolute;inset:0;background:rgba(6,8,14,.5);opacity:0;transition:opacity .3s var(--ease)}
:root[data-theme="light"] .mback{background:rgba(16,21,34,.28)}
.mdet{position:absolute;background:var(--raised);color:var(--ink);border:1px solid var(--line);box-shadow:0 30px 60px -20px rgba(0,0,0,.55);display:flex;flex-direction:column;overflow:hidden;opacity:0;visibility:hidden;--ni-bg:var(--raised)}
.mlayer.open{pointer-events:auto}
.mlayer.open .mback{opacity:1}
.mlayer.open .mdet{opacity:1;visibility:visible}
.md-h{display:flex;align-items:center;gap:12px;padding:14px 14px 10px}
.md-h .av{width:40px;height:40px}
.md-h .t{flex:1;min-width:0}
.md-h .t b{display:block;font:700 18px var(--display);letter-spacing:-.01em}
.md-h .t small{color:var(--muted);font-size:13px}
.md-x{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer;flex:none}
.md-x:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
@media (hover:hover){.md-x:hover{background:var(--sunken)}}
.md-b{padding:0 14px 14px;display:grid;gap:12px;overflow:auto;min-height:0;flex:1;align-content:start}
.md-b p{margin:0;font-size:14px;color:var(--muted)}
.md-tl{list-style:none;margin:0;padding:0;display:grid;gap:0}
.md-tl li{position:relative;display:flex;gap:10px;align-items:baseline;padding:0 0 10px 18px;font-size:13.5px}
.md-tl li::before{content:"";position:absolute;left:3px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--good)}
.md-tl li::after{content:"";position:absolute;left:6.5px;top:16px;bottom:0;width:1px;background:var(--line)}
.md-tl li:last-child::after{display:none}
.md-tl li.now::before{background:var(--pink);box-shadow:0 0 0 4px rgba(var(--pk-rgb),.2)}
.md-tl time{font-weight:700;min-width:62px;color:var(--muted);font-variant-numeric:tabular-nums}
.md-a{display:flex;gap:8px;flex-wrap:wrap;padding:12px 14px;border-top:1px solid var(--line);background:var(--surface)}
.md-live .xl{gap:2px}
.md-live .txt{font-size:14px}
.md-grab{display:none;width:44px;height:5px;border-radius:5px;background:var(--border);margin:8px auto 0}
/* M1 raised panel */
.ms-1 .mdet{left:18px;right:18px;top:26px;bottom:14px;border-radius:22px;transform:translateY(22px) scale(.98);transition:transform .38s var(--ease),opacity .25s var(--ease),visibility 0s linear .38s}
.ms-1 .mlayer.open .mdet{transform:none;transition:transform .38s var(--ease),opacity .25s var(--ease),visibility 0s}
.ms-1 .dim .mboard{transform:scale(.965);opacity:.7}
/* M2 drawer */
.ms-2 .mdet{top:0;right:0;bottom:0;width:min(400px,88%);border-radius:20px 0 0 20px;border-right:0;transform:translateX(104%);transition:transform .4s var(--ease),visibility 0s linear .4s;opacity:1}
.ms-2 .mlayer.open .mdet{transform:none;transition:transform .4s var(--ease),visibility 0s}
/* M3 centered modal */
.ms-3 .mdet{left:50%;top:50%;width:min(470px,calc(100% - 32px));max-height:calc(100% - 32px);border-radius:22px;transform:translate(-50%,-50%) scale(.94);transition:transform .3s var(--spring),opacity .2s var(--ease),visibility 0s linear .3s}
.ms-3 .mlayer.open .mdet{transform:translate(-50%,-50%);transition:transform .34s var(--spring),opacity .2s var(--ease),visibility 0s}
.ms-3 .mback{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
/* M4 bottom sheet */
.ms-4 .mdet{left:0;right:0;bottom:0;height:82%;border-radius:24px 24px 0 0;border-bottom:0;transform:translateY(104%);transition:transform .42s var(--ease),visibility 0s linear .42s;opacity:1}
.ms-4 .mlayer.open .mdet{transform:none;transition:transform .46s var(--spring),visibility 0s}
.ms-4 .md-grab{display:block}
/* M5 expanding card */
.ms-5 .mdet{left:12px;right:12px;top:12px;bottom:12px;border-radius:20px;transform-origin:0 0;transition:opacity .15s linear}
.ms-5 .mdet.flip{transition:transform .44s var(--ease),border-radius .44s var(--ease)}
.ms-5 .mdet>*{transition:opacity .2s var(--ease) .2s}
.ms-5 .mdet.pre>*{opacity:0;transition:none}
.ms-5 .mback{background:rgba(6,8,14,.3)}
/* M6 anchored popover */
.ms-6 .mdet{width:min(320px,calc(100% - 24px));left:var(--px,12px);top:var(--py,12px);max-height:var(--pmh,calc(100% - 24px));border-radius:18px;transform-origin:var(--ox,0) var(--oy,0);transform:scale(.9);transition:transform .26s var(--spring),opacity .18s var(--ease),visibility 0s linear .26s}
.ms-6 .mlayer.open .mdet{transform:none;transition:transform .3s var(--spring),opacity .18s var(--ease),visibility 0s}
.ms-6 .mback{background:rgba(6,8,14,.22)}
:root[data-theme="light"] .ms-6 .mback{background:rgba(16,21,34,.12)}
.ms-6 .md-more{display:none}
.ms-6 .mtile.lifted{transform:translateY(-3px);box-shadow:0 0 0 2px var(--pink),0 20px 36px -18px rgba(var(--pk-rgb),.8)}

/* ---------- Score & grade (Q) ---------- */
.qc{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:16px;display:grid;gap:14px;box-shadow:var(--card-sh);--qv:55;--qc:var(--warn);--qct:var(--warn-tint)}
.qc[data-z="bad"]{--qc:var(--bad-text);--qct:var(--bad-tint)}
.qc[data-z="good"]{--qc:var(--good);--qct:var(--good-tint)}
.qc-h{display:flex;gap:10px;align-items:flex-start}
.qc-h .t{flex:1;min-width:0}
.qc-h small{display:block;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.qc-h b{display:block;font:700 17px var(--display);letter-spacing:-.01em}
.qc-h q{display:block;color:var(--muted);font-size:14px;margin-top:2px}
.qv{display:flex;align-items:center;gap:18px;flex-wrap:wrap;min-height:150px}
.qn{font:800 72px/.85 var(--num);letter-spacing:.005em;font-variant-numeric:tabular-nums;color:var(--ink)}
.qn small{font-size:24px;color:var(--muted);margin-left:2px}
.qlab{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:var(--qct);color:var(--qc);font:800 13px var(--body);transition:background-color .3s,color .3s}
.qlab .ic{width:14px;height:14px}
.qnote{margin:0;font-size:14px;line-height:1.45;padding:10px 12px;border-radius:12px;background:var(--sunken);border:1px solid var(--line)}
.qnote b{color:var(--pink)}
.qside{display:grid;gap:8px;justify-items:start;flex:1;min-width:150px}
/* Q1 ring */
.q-ring{position:relative;width:148px;height:148px;flex:none}
.q-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.q-ring .tr{fill:none;stroke:var(--sunken);stroke-width:12}
.q-ring .ar{fill:none;stroke:var(--qc);stroke-width:12;stroke-linecap:round;stroke-dasharray:calc(var(--qv)*1px) 200px;transition:stroke-dasharray .9s var(--ease),stroke .3s}
.q-ring .tk{stroke:var(--ink);stroke-width:3;stroke-linecap:round}
.q-ring .c{position:absolute;inset:0;display:grid;place-items:center;align-content:center;text-align:center}
.q-ring .c .qn{font-size:56px}
.q-ring .c small{font-size:12px;color:var(--muted);font-weight:600}
/* Q2 big number + bar */
.q-big{flex:1;min-width:220px;display:grid;gap:10px}
.q-big .qn{font-size:104px}
.q-bar{position:relative;height:14px;border-radius:14px;background:var(--sunken);border:1px solid var(--line)}
.q-bar i{position:absolute;inset:0;border-radius:inherit;background:var(--qc);transform-origin:left;transform:scaleX(calc(var(--qv)/100));transition:transform .9s var(--ease),background-color .3s}
.q-bar em{position:absolute;left:70%;top:-7px;bottom:-7px;width:3px;border-radius:3px;background:var(--ink)}
.q-bar em::after{content:"Target 70";position:absolute;top:-20px;left:50%;transform:translateX(-50%);font:800 11px var(--body);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:var(--muted);font-style:normal}
.q-bar-w{padding-top:18px}
/* Q3 letter badge */
.q-badge{position:relative;width:120px;height:132px;flex:none;display:grid;place-items:center}
.q-badge svg{position:absolute;inset:0;width:100%;height:100%}
.q-badge .bg{fill:var(--qct);stroke:var(--qc);stroke-width:3;transition:fill .3s,stroke .3s}
.q-badge .l{position:relative;font:800 72px/1 var(--display);color:var(--qc);letter-spacing:-.04em;transition:color .3s}
.q-ladder{display:flex;gap:4px}
.q-ladder span{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font:800 15px var(--display);background:var(--sunken);color:var(--muted);border:1.5px solid transparent;transition:background-color .3s,color .3s}
.q-ladder span.on{background:var(--qc);color:var(--canvas)}
.q-ladder span.tg{border-color:var(--ink);border-style:dashed}
/* Q4 sparkline */
.q-sp{flex:1;min-width:220px;display:grid;gap:6px}
.q-sp .qtop{display:flex;align-items:baseline;gap:10px}
.q-sp .dl{font:800 16px var(--num);color:var(--qc)}
.q-sp .spw{position:relative;height:96px}
.q-sp svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.q-sp .qlab{justify-self:start}
.q-sp .spdot{position:absolute;right:-7px;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:var(--qc);border:3px solid var(--raised);transition:top .6s var(--ease),background-color .3s}
.q-sp .ln{fill:none;stroke:var(--qc);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.q-sp .ar{fill:color-mix(in srgb,var(--qc) 16%,transparent);stroke:none}
.q-sp .tg{stroke:var(--muted);stroke-width:1.5;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.q-sp .dt{fill:var(--qc);stroke:var(--raised);stroke-width:3;vector-effect:non-scaling-stroke}
.q-sp .lbl{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-weight:600}
/* Q5 half dial */
.q-dial{position:relative;width:210px;height:124px;flex:none}
.q-dial svg{width:100%;height:100%;overflow:visible}
.q-dial .z{fill:none;stroke-width:16}
.q-dial .needle{transform-origin:105px 110px;transform:rotate(calc(var(--qv)*1.8deg - 90deg));transition:transform .9s var(--spring)}
.q-dial .needle path{fill:var(--ink)}
.q-dial .hub{fill:var(--ink)}
.q-dial .tk{stroke:var(--ink);stroke-width:3;stroke-linecap:round}
.q-dial .c{position:absolute;left:0;right:0;bottom:-6px;text-align:center}
.q-dial .qn{font-size:40px}
/* Q6 stepped blocks */
.q-steps{flex:1;min-width:230px;display:grid;gap:10px}
.q-steps .qtop{display:flex;align-items:baseline;gap:10px}
.q-blocks{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}
.q-blocks span{position:relative;height:34px;border-radius:7px;background:var(--sunken);overflow:hidden;border:1.5px solid transparent}
.q-blocks span i{position:absolute;inset:0;background:var(--qc);transform-origin:left;transform:scaleX(var(--f,0));transition:transform .5s var(--ease),background-color .3s;transition-delay:calc(var(--n)*40ms)}
.q-blocks span.tg{border-color:var(--ink);border-style:dashed}
.q-steps .ax{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-weight:600}

/* ---------- Lists / leaderboard (D) ---------- */
.lbw{background:var(--raised);border:1px solid var(--line);border-radius:18px;padding:14px;box-shadow:var(--card-sh);display:grid;gap:10px;min-width:0}
.lbw-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.lbw-h .t{flex:1;min-width:140px}
.lbw-h .t b{display:block;font:700 16px var(--display)}
.lbw-h .t small{font-size:12px;color:var(--muted);font-weight:600}
.lbw-h .gseg{flex:none}
.lb{list-style:none;margin:0;padding:0;display:grid;gap:0}
.lbw{--rp:12px;--avs:36px}
.lbw[data-density="dense"]{--rp:6px;--avs:26px}
.lbr{position:relative;display:grid;grid-template-columns:34px var(--avs) minmax(0,1fr) auto 52px;gap:12px;align-items:center;padding:var(--rp) 8px;min-width:0;transition:padding .25s var(--ease)}
.lbr .av{width:var(--avs);height:var(--avs);font-size:12px;transition:width .25s var(--ease),height .25s var(--ease)}
.lbr .nm{min-width:0}
.lbr .nm b{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lbr .nm small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lbw[data-density="dense"] .lbr .nm small{display:none}
.lbw[data-density="dense"] .lbr .nm b{font-size:14px}
.lbr .val{font:800 22px var(--num);letter-spacing:.01em;text-align:right;font-variant-numeric:tabular-nums}
.lbw[data-density="dense"] .lbr .val{font-size:18px}
.tr{display:inline-flex;align-items:center;justify-content:flex-end;gap:2px;font:800 13px var(--body);color:var(--muted)}
.tr svg{width:12px;height:12px}
.tr.up{color:var(--good)}
.tr.dn{color:var(--bad-text)}
.rk{display:grid;place-items:center;width:30px;height:30px;font:800 17px var(--num);color:var(--muted)}
.medal{position:relative;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:800 15px var(--num);color:#2A1B00;background:radial-gradient(circle at 35% 30%,#FFF1B8,#F2C14E 55%,#B8871A);box-shadow:inset 0 -2px 0 rgba(0,0,0,.18),0 4px 10px -4px rgba(0,0,0,.5)}
.medal.m2{color:#1E2530;background:radial-gradient(circle at 35% 30%,#FFFFFF,#C9D1DC 55%,#8A96A8)}
.medal.m3{color:#2B1403;background:radial-gradient(circle at 35% 30%,#FFD2A8,#D08A4E 55%,#8C5224)}
.lbw[data-density="dense"] .medal{width:22px;height:22px;font-size:13px}
.lbr.you .nm b::after{content:"You";margin-left:6px;padding:1px 6px;border-radius:999px;background:var(--pink-tint);color:var(--pink);font:800 10px var(--body);letter-spacing:.06em;text-transform:uppercase;vertical-align:2px}
.lbgap{display:none}
.podium{display:none}
/* D1 clean table */
.lbhead{display:none}
.ds-1 .lbhead{display:grid;grid-template-columns:34px var(--avs) minmax(0,1fr) auto 52px;gap:12px;padding:0 8px 6px;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line)}
.ds-1 .lbhead span:nth-child(4),.ds-1 .lbhead span:nth-child(5){text-align:right}
.ds-1 .lbr~.lbr{border-top:1px solid var(--line)}
/* D2 card rows */
.ds-2 .lb{gap:8px}
.ds-2 .lbr{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 18px -14px var(--shc);padding-inline:10px}
.ds-2 .lbr[data-rank="1"],.ds-2 .lbr[data-rank="2"],.ds-2 .lbr[data-rank="3"]{background:linear-gradient(90deg,color-mix(in srgb,var(--mc,#F2C14E) 14%,var(--surface)),var(--surface) 60%)}
.ds-2 .lbr[data-rank="2"]{--mc:#C9D1DC}
.ds-2 .lbr[data-rank="3"]{--mc:#D08A4E}
/* D3 podium */
.ds-3 .podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:8px;padding-top:6px}
.pod{display:grid;justify-items:center;gap:6px;text-align:center;min-width:0}
.pod .av{width:44px;height:44px;font-size:14px}
.pod .pn{font-weight:700;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.pod .pv{font:800 20px var(--num)}
.pod .blk{width:100%;border-radius:12px 12px 4px 4px;display:grid;place-items:start center;padding-top:8px;background:linear-gradient(180deg,color-mix(in srgb,var(--mc) 40%,var(--raised)),var(--sunken));border:1px solid var(--line);border-bottom:0}
.pod.p1{--mc:#F2C14E}.pod.p1 .blk{height:84px}
.pod.p2{--mc:#C9D1DC}.pod.p2 .blk{height:60px}
.pod.p3{--mc:#D08A4E}.pod.p3 .blk{height:44px}
.lbw[data-density="dense"] .pod .blk{height:auto;min-height:30px;padding-bottom:6px}
.ds-3 .lbr.top3{display:none}
.ds-3 .lbr:not(.top3)~.lbr{border-top:1px solid var(--line)}
/* D4 bar in row */
.ds-4 .lb{gap:6px}
.ds-4 .lbr{border-radius:12px;overflow:hidden;isolation:isolate}
.ds-4 .lbr .fillbar{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(var(--pk-rgb),.26),rgba(var(--pk-rgb),.1));transform-origin:left;transform:scaleX(var(--p));border-radius:12px}
.ds-4 .lbr[data-rank="1"] .fillbar{background:linear-gradient(90deg,rgba(var(--pk-rgb),.42),rgba(var(--pk-rgb),.16))}
.fillbar{display:none}
.ds-4 .fillbar{display:block}
/* D5 scoreboard */
.ds-5 .lbw{background:var(--sunken)}
.ds-5 .lb{border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.ds-5 .lbr.odd{background:var(--raised)}
.ds-5 .lbr .nm b{font:800 21px/1 var(--num);letter-spacing:.04em;text-transform:uppercase}
.ds-5 .lbw[data-density="dense"] .lbr .nm b{font-size:18px}
.ds-5 .lbr .val{font-size:26px;color:var(--pink)}
.ds-5 .medal{border-radius:6px;background:none;box-shadow:none;color:var(--mc,#F2C14E);font-size:26px}
.ds-5 .medal.m2{--mc:#C9D1DC;background:none}
.ds-5 .medal.m3{--mc:#D08A4E;background:none}
.ds-5 .rk{font-size:24px}
/* D6 you-focused */
.ds-6 .lbr{opacity:.78}
.ds-6 .lbr.top3,.ds-6 .lbr.you{opacity:1}
.ds-6 .lbr.you{background:var(--pink-tint);border-radius:14px;box-shadow:0 0 0 1.5px var(--pink),0 14px 28px -18px rgba(var(--pk-rgb),.9)}
.ds-6 .lbgap{display:flex;align-items:center;gap:8px;margin:2px 8px 6px 54px;font-size:12.5px;color:var(--muted);font-weight:600}
.ds-6 .lbgap i{flex:1;height:4px;border-radius:4px;background:var(--sunken);overflow:hidden;position:relative;max-width:180px}
.ds-6 .lbgap i::after{content:"";position:absolute;inset:0;background:var(--pink);transform-origin:left;transform:scaleX(.69)}
.ds-6 .medal{border-radius:6px 6px 50% 50%}

/* ---------- Avatars (V) ---------- */
.va{--van:#1769E0;--st:var(--good);position:relative;display:inline-grid;place-items:center;width:var(--vs,40px);height:var(--vs,40px);flex:none;border-radius:50%}
.vst{--st:var(--good)}
[data-st="job"]{--st:var(--blue)}
[data-st="live"]{--st:var(--pink)}
[data-st="off"]{--st:var(--disabled)}
.va-in{width:100%;height:100%;border-radius:inherit;display:grid;place-items:center;font:700 calc(var(--vs,40px)*.36) var(--display);background:var(--blue-tint);color:var(--blue);overflow:hidden}
.va-ph{display:none;width:100%;height:100%;border-radius:inherit;overflow:hidden}
.va-ph svg{width:100%;height:100%;display:block}
.va-dot{position:absolute;right:-1px;bottom:-1px;width:calc(var(--vs,40px)*.3);height:calc(var(--vs,40px)*.3);min-width:10px;min-height:10px;border-radius:50%;background:var(--st);border:2.5px solid var(--vbg,var(--raised))}
.va[data-st="live"] .va-dot{animation:livedot 1.6s ease-out infinite}
@keyframes livedot{0%{box-shadow:0 0 0 0 rgba(var(--pk-rgb),.7)}100%{box-shadow:0 0 0 7px rgba(var(--pk-rgb),0)}}
.va-van{display:none;position:absolute;font:800 11px/1 var(--num);letter-spacing:.02em}
.vcard{display:flex;align-items:center;gap:14px;padding:14px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);--vbg:var(--raised);flex-wrap:wrap}
.vcard .who{flex:1;min-width:140px}
.vcard .who b{display:block;font:700 17px var(--display)}
.vcard .who small{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:13px;margin-top:2px}
.vsw{display:inline-block;width:12px;height:12px;border-radius:4px;background:var(--van);box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.vst{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--st)}
.vst::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.vcrew{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;--vbg:var(--surface)}
.vcrew>div{display:grid;justify-items:center;gap:6px;text-align:center;padding:10px 4px;border-radius:14px;background:var(--surface);border:1px solid var(--line);min-width:0}
.vcrew small{font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.vstack{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);--vbg:var(--canvas)}
.vstack .grp{display:flex}
.vstack .grp .va{margin-left:-6px;box-shadow:0 0 0 2.5px var(--surface)}
.vstack .grp .va:first-child{margin-left:0}
.vstack .va-dot{display:none}
.vlegend{display:flex;gap:12px;flex-wrap:wrap}
/* V2 photo ring */
.vs-2 .va-in{display:none}
.vs-2 .va-ph{display:block}
.vs-2 .va{padding:3px;background:var(--st)}
.vs-2 .va[data-st="live"]{background:conic-gradient(from 200deg,#FF7AB3,#E0327F,#A3175A,#FF7AB3)}
.vs-2 .va-ph{box-shadow:0 0 0 2px var(--vbg,var(--raised))}
.vs-2 .va-dot{display:none}
.vs-2 .vstack .grp .va{padding:2px}
/* V3 van tile */
.vs-3 .va{border-radius:28%}
.vs-3 .va-in{background:var(--van);color:#fff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.2)}
.vs-3 .va-dot{top:-3px;right:-3px;bottom:auto}
.vs-3 .va-van{display:block;left:50%;bottom:-7px;transform:translateX(-50%);padding:2px 5px;border-radius:5px;background:var(--ink);color:var(--canvas)}
.vs-3 .vstack .va-van{display:none}
/* V4 van ring */
.vs-4 .va-in{background:var(--sunken);color:var(--ink);box-shadow:inset 0 0 0 3px var(--van)}
.vs-4 .va-van{display:block;right:-6px;top:-6px;padding:2px 5px;border-radius:999px;background:var(--van);color:#fff;border:2px solid var(--vbg,var(--raised))}
.vs-4 .vstack .va-van{display:none}
/* V5 scoreboard monogram */
.vs-5 .va-in{background:var(--hero);color:#fff;font:800 calc(var(--vs,40px)*.5)/1 var(--num);letter-spacing:.04em;padding-top:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.vs-5 .va::after{content:"";position:absolute;left:18%;right:18%;bottom:-6px;height:3px;border-radius:3px;background:var(--van)}
.vs-5 .va[data-st="live"]{animation:ringlive 1.6s ease-out infinite}
@keyframes ringlive{0%{box-shadow:0 0 0 0 rgba(var(--pk-rgb),.7)}100%{box-shadow:0 0 0 9px rgba(var(--pk-rgb),0)}}
.vs-5 .vstack .va::after{display:none}
/* V6 photo + van badge */
.vs-6 .va-in{display:none}
.vs-6 .va-ph{display:block;box-shadow:0 0 0 2px var(--st)}
.vs-6 .va-dot{display:none}
.vs-6 .va-van{display:inline-flex;align-items:center;gap:2px;right:-8px;bottom:-5px;padding:2px 4px;border-radius:6px;background:var(--van);color:#fff;border:2px solid var(--vbg,var(--raised));font-size:10px}
.vs-6 .va-van svg{width:11px;height:11px;fill:none;stroke:#fff;stroke-width:2;stroke-linejoin:round}
.vs-6 .vstack .va-van{display:none}
.va-van svg{display:none}
.vs-6 .va-van svg{display:block}

/* ---------- Type scale (Y) ---------- */
.ysamp{--y-t:28px;--y-h:17px;--y-b:15px;--y-s:13px;--y-n:32px;--y-g:14px;--y-p:16px;--y-hit:44px;display:grid;gap:var(--y-g);font-size:var(--y-b)}
.ys-1 .ysamp{--y-t:22px;--y-h:15px;--y-b:13.5px;--y-s:12px;--y-n:26px;--y-g:10px;--y-p:12px;--y-hit:36px}
.ys-3 .ysamp{--y-t:32px;--y-h:19px;--y-b:17px;--y-s:14px;--y-n:38px;--y-g:18px;--y-p:20px;--y-hit:48px}
.ys-4 .ysamp{--y-t:40px;--y-h:22px;--y-b:19px;--y-s:15px;--y-n:48px;--y-g:22px;--y-p:22px;--y-hit:56px}
.yspec{display:flex;flex-wrap:wrap;gap:6px}
.yspec span{padding:3px 9px;border-radius:999px;background:var(--sunken);border:1px solid var(--line);font-size:12px;font-weight:600;color:var(--muted)}
.yspec b{color:var(--ink);font:800 14px var(--num);margin-left:3px}
.ysamp .y-t{font:800 var(--y-t)/1.08 var(--display);letter-spacing:-.03em;margin:0}
.ysamp .y-s{font-size:var(--y-s);color:var(--muted);font-weight:600}
.ysamp .y-k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--y-g)}
.ysamp .y-k>div{background:var(--raised);border:1px solid var(--line);border-radius:14px;padding:calc(var(--y-p)*.75) var(--y-p)}
.ysamp .y-k b{display:block;font:800 var(--y-n)/1 var(--num)}
.ysamp .y-k small{font-size:var(--y-s);color:var(--muted);font-weight:600}
.ysamp .card-b,.ysamp .card-h{padding-inline:var(--y-p)}
.ysamp .card-h{padding-top:var(--y-p)}
.ysamp .card-b{padding-bottom:var(--y-p);gap:calc(var(--y-g)*.8)}
.ysamp .job-who b{font-size:var(--y-h)}
.ysamp .job-who small,.ysamp .job-time{font-size:var(--y-s)}
.ysamp .job-addr{font-size:var(--y-b)}
.ysamp .tag{font-size:calc(var(--y-s) - .5px)}
.ysamp .btn{min-height:var(--y-hit);font-size:calc(var(--y-b) - .5px);padding-block:0}
.ysamp .av{width:calc(var(--y-hit) - 6px);height:calc(var(--y-hit) - 6px);font-size:var(--y-s)}
.ysamp p.y-body{margin:0;font-size:var(--y-b);line-height:1.5;color:var(--muted)}

/* ---------- Page headers (H) ---------- */
.hwrap{display:grid;gap:14px}
.ph{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 24px;align-items:center;min-width:0}
.ph-copy{min-width:0;position:relative;z-index:1}
.ph-eye{display:block;font:700 12px var(--body);letter-spacing:.12em;text-transform:uppercase}
.ph h2{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.05;font-weight:800;letter-spacing:-.03em;margin:6px 0}
.ph p{margin:0;font-size:15px}
.ph-stats{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}
.ph-stats div{min-width:92px}
.ph-stats b{display:block;font:800 30px/1 var(--num);letter-spacing:.01em}
.ph-stats small{font-size:12px;font-weight:600}
.ph-act{display:flex;gap:8px;flex-wrap:wrap;position:relative;z-index:1}
.ph-art{position:absolute;pointer-events:none}
.ph-art svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* H2 slim band */
.hs-2 .ph{background:var(--hero);color:#fff;border-radius:20px;padding:18px 22px;grid-template-columns:minmax(0,1fr) auto auto;box-shadow:0 20px 40px -26px rgba(var(--pk-rgb),.9),inset 0 1px 0 rgba(255,255,255,.28)}
.hs-2 .ph h2{font-size:clamp(1.3rem,2vw,1.65rem);margin:4px 0 2px}
.hs-2 .ph p{opacity:.92;font-size:14px}
.hs-2 .ph-eye{opacity:.85}
.hs-2 .ph-stats div{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);border-radius:12px;padding:6px 10px;min-width:0;display:flex;align-items:baseline;gap:6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.hs-2 .ph-stats b{font-size:24px}
.hs-2 .ph-art{right:-20px;top:-30px;width:170px;height:170px;color:#fff;opacity:.13}
.hs-2 .ph .btn.p{--p-bg:#fff;--p-fg:#9C1A56}
.hs-2 .ph .btn.p .ic{color:#E0327F}
/* H3 berry night */
.hs-3 .ph{background:radial-gradient(circle at 88% 0%,rgba(255,110,170,.5),transparent 45%),linear-gradient(135deg,#1C0712 0%,#4A0D2C 55%,#86154B 100%);color:#fff;border-radius:24px;padding:24px 26px;border:1px solid rgba(255,110,170,.28);box-shadow:0 26px 50px -28px rgba(156,26,86,.9)}
.hs-3 .ph-eye{color:#FF9CC6}
.hs-3 .ph p{color:rgba(255,255,255,.8)}
.hs-3 .ph-stats{gap:22px}
.hs-3 .ph-stats b{font-size:44px;color:#FF9CC6;text-shadow:0 0 22px rgba(255,110,170,.55)}
.hs-3 .ph-stats small{color:rgba(255,255,255,.75)}
.hs-3 .ph-act{grid-column:1/-1}
.hs-3 .ph .btn.s{--s-bg:rgba(255,255,255,.1);--s-fg:#fff;--s-bd:1px solid rgba(255,255,255,.22)}
.hs-3 .ph .btn.s .ic{color:#FF9CC6}
.hs-3 .ph .btn.p{--p-bg:#FF6EAA;--p-fg:#1A0711}
.hs-3 .ph .btn.p .ic{color:#1A0711}
.hs-3 .ph-art{right:24px;bottom:-26px;width:130px;height:130px;color:#FF6EAA;opacity:.22}
/* H4 blush tint */
.hs-4 .ph{background:linear-gradient(120deg,var(--pink-tint),color-mix(in srgb,var(--pink-tint) 40%,var(--surface)));border:1px solid color-mix(in srgb,var(--pink) 30%,transparent);border-radius:22px;padding:20px 22px;grid-template-columns:auto minmax(0,1fr) auto;color:var(--ink)}
.hs-4 .ph-art{position:relative;width:56px;height:56px;border-radius:16px;background:var(--hero);color:#fff;display:grid;place-items:center;box-shadow:0 12px 24px -12px rgba(var(--pk-rgb),.9)}
.hs-4 .ph-art svg{width:28px;height:28px;stroke-width:2}
.hs-4 .ph-eye{color:var(--pink)}
.hs-4 .ph p{color:var(--muted)}
.hs-4 .ph-stats div{background:var(--raised);border:1px solid var(--line);border-radius:14px;padding:8px 12px;box-shadow:0 8px 16px -12px var(--shc)}
.hs-4 .ph-stats b{color:var(--pink);font-size:26px}
.hs-4 .ph-stats small{color:var(--muted)}
.hs-4 .ph-act{grid-column:1/-1}
/* H5 split */
.hs-5 .ph{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:0;border-radius:24px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);align-items:stretch}
.hs-5 .ph-copy{background:var(--hero);color:#fff;padding:24px 24px 22px;position:relative;overflow:hidden;grid-row:1/3}
.hs-5 .ph-copy .ph-eye{opacity:.85}
.hs-5 .ph-copy p{opacity:.92}
.hs-5 .ph-art{left:auto;right:-14px;bottom:-24px;width:120px;height:120px;color:#fff;opacity:.2;z-index:0}
.hs-5 .ph-stats{padding:20px 20px 0;align-content:start}
.hs-5 .ph-stats b{color:var(--ink);font-size:32px}
.hs-5 .ph-stats small{color:var(--muted)}
.hs-5 .ph-act{padding:12px 20px 20px;align-self:end}
/* H6 quiet edge */
.hs-6 .ph{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px 22px 18px 28px;grid-template-columns:auto minmax(0,1fr) auto;box-shadow:var(--card-sh)}
.hs-6 .ph::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--hero)}
.hs-6 .ph::after{content:"";position:absolute;right:-60px;top:-80px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(var(--pk-rgb),.16),transparent 70%);pointer-events:none}
.hs-6 .ph-art{position:relative;width:44px;height:44px;border-radius:12px;background:var(--pink-tint);color:var(--pink);display:grid;place-items:center}
.hs-6 .ph-art svg{width:22px;height:22px;stroke-width:2}
.hs-6 .ph-eye{color:var(--muted)}
.hs-6 .ph h2{font-size:clamp(1.3rem,2vw,1.6rem)}
.hs-6 .ph p{color:var(--muted);font-size:14px}
.hs-6 .ph-stats{grid-column:2/-1;gap:22px}
.hs-6 .ph-stats div{display:flex;align-items:baseline;gap:6px;min-width:0}
.hs-6 .ph-stats b{font-size:24px;color:var(--pink)}
.hs-6 .ph-stats small{color:var(--muted)}
.hs-6 .ph-act{grid-column:3;grid-row:1}
/* H1 hero stays as-is (.hero from round 1) */
.hwrap .hero{margin:0}

/* ---------- P2 composed ---------- */
.p2 .app-body{min-height:0}
.p2main{position:relative;min-width:0;overflow:hidden}
.p2 .mpages{height:auto}
.p2 .mpg{padding:24px;gap:20px}
.p2grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:20px;align-items:start}
.p2sec{display:grid;gap:10px;min-width:0}
.p2sec-h{display:flex;align-items:center;gap:10px}
.p2sec-h b{font:700 17px var(--display);flex:1}
.p2 .mstage{height:auto;border:0;border-radius:0;background:none;overflow:visible;isolation:auto}
.p2 .mboard{padding:0}
.p2 .mlayer{position:absolute}
.p2 .nav-i{border:0;background:none;width:100%;cursor:pointer;font:inherit;font-size:15px;text-align:left}
.p2 .nav-i:not(.on){font-weight:500}
@media (hover:hover){.p2 .nav-i:hover{color:var(--ink)}}
.p2 .nav-i:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.p2 .mbar{height:3px}
.p2 .astage{padding-bottom:0}
.p2 .tlane{display:none}
.p2 .tst{position:fixed;bottom:24px;z-index:70}
.p2 .as-2 .tst,.p2.as-2 .tst{right:24px}
.p2.as-4 .tst{top:140px;bottom:auto}
.p2 .ld{box-shadow:none;border:0;padding:0;background:none}
.revcard{display:grid;gap:6px;padding:14px;border-radius:16px;background:var(--raised);border:1px solid var(--line)}
.revcard p{margin:0;font-size:14.5px}
.revcard small{color:var(--muted);font-size:12.5px}

@media (max-width:1100px){
  .pv-grid{grid-template-columns:1fr}
  .app-body{grid-template-columns:200px minmax(0,1fr)}
  .jump a span{display:none}
}
@media (max-width:900px){
  .top-in{padding:8px 20px}
  .wrap{padding:20px 20px 64px}
  .intro{grid-template-columns:1fr 120px;padding:24px}
  .intro img{width:120px}
  .sec-letter{font-size:52px}
  .sec-h{flex-wrap:wrap}
  .sec-count{margin-left:0}
  .brand small{display:none}
  .app-body{grid-template-columns:180px minmax(0,1fr)}
  .nav-i{gap:10px;padding:11px 10px;font-size:14px}
  .app-main{padding:16px}
  .hero{grid-template-columns:minmax(0,1fr) 100px;padding:20px}
  .hero-lion{width:100px}
  .ownersel{display:none}
  .r1lock span{display:none}
  .p2 .mpg{padding:16px}
  .hs-2 .ph{grid-template-columns:minmax(0,1fr) auto}
  .hs-2 .ph-stats{grid-column:1/-1;grid-row:2}
  .hs-4 .ph,.hs-6 .ph{grid-template-columns:auto minmax(0,1fr)}
  .hs-4 .ph-stats,.hs-6 .ph-stats{grid-column:1/-1}
  .hs-6 .ph-act{grid-column:1/-1;grid-row:auto}
  .mini{grid-template-columns:120px minmax(0,1fr)}
  .mnav{gap:7px;padding:8px}
}
@media (max-width:700px){
  .hs-5 .ph{grid-template-columns:1fr}
  .hs-5 .ph-copy{grid-row:auto}
  .vcrew{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:600px){
  .intro{grid-template-columns:1fr}
  .intro img{display:none}
  .app-body{grid-template-columns:1fr}
  .side{display:none}
  .mini{grid-template-columns:1fr}
  .mside{display:none}
  .ph{grid-template-columns:1fr!important}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important}
  .hold.holding .fill{transition-duration:.9s!important}
}

.mini{position:relative}
.shell{position:relative}
.p2 .ld-k{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:20px;align-items:start}
.p2 .ld-k>*{min-width:0}
.p2 .ld-rows{gap:0}
.p2 .ld-h{margin-bottom:0}
.p2main.ysamp{display:block}
.ms-1 .dim>.mpages{transform:scale(.985);opacity:.7;transition:transform .4s var(--ease),opacity .3s}
.p2 .mpages{transition:transform .4s var(--ease),opacity .3s}
.lbgap{display:none!important}
.ds-6 .lbgap{display:flex!important}

.p2 .ld{overflow:visible}

.mhint{display:flex;align-items:center;gap:8px;margin:4px 2px 0;font-size:13px;color:var(--muted);font-weight:600}
.mhint .ic{width:16px;height:16px;color:var(--pink)}
.p2 .mhint{display:none}
.p2col{display:grid;gap:20px;min-width:0;align-content:start}
.ls-4 .ld[data-state="loading"] .ld-k,.ls-5 .ld[data-state="loading"] .ld-k{pointer-events:none}


/* ================= ROUND 3 (new rows; everything above is copied verbatim from STYLE-PICKER-2.html) ================= */
:root,:root[data-theme="dark"]{--c1:#E0428A;--c2:#3F86F2;--c3:#B97A14;--grid:rgba(255,255,255,.07);
  --g-a:#4FD18B;--g-b:#A9D65E;--g-c:#F2B233;--g-d:#FF8A4C;--g-f:#FF5A4E}
:root[data-theme="light"]{--c1:#D92E78;--c2:#1769E0;--c3:#A86A00;--grid:rgba(16,21,34,.08);
  --g-a:#0F7A45;--g-b:#557A10;--g-c:#8A5A00;--g-d:#B4460C;--g-f:#C8102E}
[data-g="A"]{--gc:var(--g-a)}[data-g="B"]{--gc:var(--g-b)}[data-g="C"]{--gc:var(--g-c)}[data-g="D"]{--gc:var(--g-d)}[data-g="F"]{--gc:var(--g-f)}
[data-g]{--gt:color-mix(in srgb,var(--gc) 16%,var(--raised))}
.ic.fill{fill:currentColor;stroke:none}
.lock3{display:inline-grid;grid-template-columns:auto auto;align-items:center;gap:0 8px;padding:4px 12px 4px 9px;border-radius:14px;background:var(--sunken);border:1px solid var(--line);flex:none;white-space:nowrap}
.lock3 .ic{grid-row:1/3;width:15px;height:15px;color:var(--good)}
.lock3 span{font:700 10px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.lock3 code{font:800 13px/1.15 var(--num);letter-spacing:.04em;color:var(--ink)}
.lock3 code em{font-style:normal;color:var(--muted);margin-right:4px}
.slot .sl{width:auto;min-width:22px;padding:0 6px;border-radius:999px}
.opt-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- CH charts ---------- */
.chg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.chg>.wide{grid-column:1/-1}
.chc{padding:14px 14px 12px;display:grid;gap:8px;align-content:start}
.chc-h{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}
.chc-h .t{flex:1;min-width:0}
.chc-h .t b{display:block;font:700 14px var(--display)}
.chc-h .t small{font-size:12px;color:var(--muted);font-weight:600}
.chc-v{font:800 30px/1 var(--num);letter-spacing:.01em}
.chc-d{display:inline-flex;align-items:center;gap:4px;font:800 12.5px var(--body);color:var(--good);align-self:center}
.chsvg{display:block;width:100%;height:auto;overflow:visible}
.chsvg.dn{max-width:250px;margin:0 auto}
.chsvg text{font:600 11px var(--body);fill:var(--muted)}
.chsvg .lbl{font:800 15px var(--num);fill:var(--ink);letter-spacing:.02em}
.chsvg .cv{font:800 40px var(--num);fill:var(--ink)}
.chsvg .cs{font:700 11px var(--body);fill:var(--muted)}
.chsvg .vl{fill:var(--ink);font-weight:800;paint-order:stroke;stroke:var(--raised);stroke-width:4px;stroke-linejoin:round}
.chsvg .gl{stroke:var(--grid);stroke-width:1}
.chsvg .ax{stroke:var(--line);stroke-width:1}
.chsvg .tg{stroke:var(--muted);stroke-width:1.5;stroke-dasharray:4 4;fill:none}
.chsvg .hit{fill:transparent}
.chsvg [data-tip]{cursor:default}
@media (hover:hover){.chsvg .mk{transition:opacity .15s}.chsvg:hover .mk{opacity:.55}.chsvg .mk:hover,.chsvg .hit:hover+.mk{opacity:1}}
.chleg{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);font-weight:600}
.chleg span{display:inline-flex;align-items:center;gap:6px}
.chleg i{width:10px;height:10px;border-radius:3px;background:var(--c)}
.cht{width:100%;border-collapse:collapse;font-size:13.5px}
.cht th{font:700 11px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;padding:0 8px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.cht th.r,.cht td.r{text-align:right}
.cht td{padding:8px;border-top:1px solid var(--line);vertical-align:middle}
.cht tbody tr:first-child td{border-top:0}
.cht .n{font:800 19px var(--num);letter-spacing:.01em;white-space:nowrap}
.cht .who{display:flex;align-items:center;gap:10px;font-weight:700;white-space:nowrap}
.cht .sp{width:136px}
.cht .sp svg{width:128px;height:30px;display:block;overflow:visible}
.ctip{position:fixed;left:0;top:0;z-index:90;pointer-events:none;padding:7px 11px;border-radius:10px;background:var(--ink);color:var(--canvas);font:700 12.5px/1.3 var(--body);white-space:nowrap;opacity:0;transform:translate(-50%,-100%);transition:opacity .12s;box-shadow:0 14px 30px -12px rgba(0,0,0,.6)}
.ctip.on{opacity:1}
.ctip small{display:block;font-weight:600;opacity:.75}

/* ---------- MP maps ---------- */
.mpg2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:12px;align-items:start}
.mpc{padding:0;overflow:hidden}
.mp-top{display:flex;align-items:center;gap:10px;padding:12px 14px}
.mp-top .t{flex:1;min-width:0}
.mp-top .t b{display:block;font:700 15px var(--display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-top .t small{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eta{display:inline-flex;align-items:baseline;gap:4px;padding:6px 11px;border-radius:12px;background:var(--pink);color:var(--pink-on);font:800 12px var(--body);white-space:nowrap;flex:none}
.eta b{font:800 26px/1 var(--num);letter-spacing:.01em}
.mpw{position:relative;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--m-bg)}
.mpw svg{display:block;width:100%;height:auto}
.mp-foot{display:flex;gap:8px 14px;flex-wrap:wrap;padding:10px 14px 12px;font-size:12.5px;color:var(--muted);font-weight:600}
.mp-foot b{color:var(--ink)}
.mpleg{display:flex;flex-wrap:wrap;gap:8px 12px;padding:10px 14px 12px;--vbg:var(--raised)}
.mpleg>span{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700}
.mpleg small{color:var(--muted);font-weight:600}
.msvg .m-bg{fill:var(--m-bg)}
.msvg .m-water{fill:var(--m-water)}
.msvg .m-park{fill:var(--m-park)}
.msvg .m-blk{fill:var(--m-blk);display:var(--m-blocks,none)}
.msvg .m-blk.b2{fill:var(--m-blk2,var(--m-blk))}
.msvg .m-blk.b3{fill:var(--m-blk3,var(--m-blk))}
.msvg .m-case{fill:none;stroke:var(--m-case,transparent);stroke-width:var(--m-rw2,7);stroke-linecap:round}
.msvg .m-road{fill:none;stroke:var(--m-road);stroke-width:var(--m-rw,5);stroke-linecap:round}
.msvg .m-minor{fill:none;stroke:var(--m-minor);stroke-width:var(--m-mw,2.5);stroke-linecap:round}
.msvg .m-hwy{fill:none;stroke:var(--m-hwy);stroke-width:var(--m-hw,7);stroke-linecap:round}
.msvg .m-noise{display:var(--m-noise,none)}
.msvg .m-dots{display:var(--m-dotsd,none)}
.msvg .m-rt-bg{fill:none;stroke:var(--m-rt);stroke-opacity:.28;stroke-width:var(--m-rtw,5);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:var(--m-dash,none)}
.msvg .m-rt{fill:none;stroke:var(--m-rt);stroke-width:var(--m-rtw,5);stroke-linecap:round;stroke-linejoin:round;filter:var(--m-glow,none)}
.msvg .m-lab{font:700 10.5px var(--body);fill:var(--m-lab);paint-order:stroke;stroke:var(--m-bg);stroke-width:3px;stroke-linejoin:round}
.msvg .m-place{font:600 9.5px var(--body);fill:var(--m-place,var(--m-lab));opacity:.8;letter-spacing:.06em;text-transform:uppercase}
.msvg .m-pin{fill:var(--m-pin,var(--pink))}
.msvg .m-pin-in{fill:#fff}
.msvg .m-van circle.vb{stroke:var(--m-ring,#fff);stroke-width:2.5}
.msvg .m-van .vg{fill:none;stroke:#fff;stroke-width:1.6;stroke-linejoin:round}
.msvg .m-van[data-st="off"]{opacity:.55}
.msvg .m-halo{fill:var(--m-rt);opacity:.25;transform-box:fill-box;transform-origin:center;animation:mhalo 1.8s ease-out infinite}
@keyframes mhalo{0%{transform:scale(.6);opacity:.45}100%{transform:scale(1.9);opacity:0}}
.msvg .m-eta rect{fill:var(--ink)}
.msvg .m-eta text{font:800 12px var(--body);fill:var(--canvas)}
.msvg .m-bub{display:none}
.mps-6 .msvg .m-eta-in{transform:translateY(-26px)}
.msvg .m-shop rect{fill:var(--m-lab)}
/* MP1 dark map */
.mps-1 .mpw,.mps-1 .msvg{--m-bg:#0C121C;--m-blk:#121A27;--m-blk2:#141D2B;--m-blocks:inline;--m-water:#0C2740;--m-park:#10261D;--m-road:#27334A;--m-minor:#1A2436;--m-hwy:#34425E;--m-rt:#FF6EAA;--m-lab:#B4C0D6;--m-pin:#FF6EAA;--m-ring:#0C121C;--m-glow:drop-shadow(0 0 4px rgba(255,110,170,.8))}
.mps-1 .msvg .m-eta rect{fill:#FF6EAA}.mps-1 .msvg .m-eta text{fill:#1A0711}
/* MP2 light map */
.mps-2 .mpw,.mps-2 .msvg{--m-bg:#EDF1F6;--m-blk:#E3E8EF;--m-blocks:inline;--m-water:#B9D7F3;--m-park:#CDE8D3;--m-road:#FFFFFF;--m-case:#C9D2DF;--m-minor:#FFFFFF;--m-hwy:#FFD98A;--m-rt:#1769E0;--m-lab:#3F4A5C;--m-pin:#D92E78;--m-ring:#fff}
.mps-2 .msvg .m-hwy{stroke:#F2C35A}
.mps-2 .msvg .m-eta rect{fill:#101522}.mps-2 .msvg .m-eta text{fill:#fff}
/* MP3 stylized flat */
.mps-3 .mpw,.mps-3 .msvg{--m-bg:var(--sunken);--m-blk:color-mix(in srgb,var(--pink-tint) 70%,var(--sunken));--m-blk2:color-mix(in srgb,var(--blue-tint) 80%,var(--sunken));--m-blk3:var(--raised);--m-blocks:inline;--m-water:var(--blue-tint);--m-park:var(--good-tint);--m-road:var(--raised);--m-minor:var(--raised);--m-hwy:var(--raised);--m-rw:8;--m-mw:4;--m-hw:10;--m-rt:var(--pink);--m-rtw:7;--m-lab:var(--ink);--m-pin:var(--blue);--m-ring:var(--raised)}
.mps-3 .msvg .m-blk{rx:10px}
/* MP4 satellite-ish */
.mps-4 .mpw,.mps-4 .msvg{--m-bg:#2B3527;--m-blk:#4A4D47;--m-blk2:#5C5A52;--m-blk3:#3E4B39;--m-blocks:inline;--m-water:#17313D;--m-park:#2F4A2A;--m-road:rgba(214,212,200,.55);--m-minor:rgba(214,212,200,.28);--m-hwy:rgba(230,226,210,.7);--m-rw:4;--m-mw:1.6;--m-hw:5;--m-rt:#FFD34D;--m-lab:#F4F1E6;--m-pin:#FF6EAA;--m-ring:#1A1F17;--m-noise:inline;--m-glow:drop-shadow(0 0 3px rgba(0,0,0,.8))}
.mps-4 .msvg .m-eta rect{fill:#FFD34D}.mps-4 .msvg .m-eta text{fill:#1A1400}
/* MP5 minimal route line */
.mps-5 .mpw,.mps-5 .msvg{--m-bg:var(--surface);--m-water:transparent;--m-park:transparent;--m-road:transparent;--m-minor:transparent;--m-hwy:transparent;--m-dotsd:inline;--m-rt:var(--pink);--m-rtw:4;--m-dash:2 7;--m-lab:var(--ink);--m-pin:var(--pink);--m-ring:var(--surface)}
.mps-5 .msvg .m-rt-bg{stroke-opacity:.8;stroke-width:3}
.mps-5 .msvg .m-place{display:none}
/* MP6 bubble pins */
.mps-6 .mpw,.mps-6 .msvg{--m-bg:var(--sunken);--m-blk:color-mix(in srgb,var(--raised) 55%,var(--sunken));--m-blocks:inline;--m-water:color-mix(in srgb,var(--blue-tint) 70%,var(--sunken));--m-park:color-mix(in srgb,var(--good-tint) 60%,var(--sunken));--m-road:var(--raised);--m-minor:color-mix(in srgb,var(--raised) 60%,var(--sunken));--m-hwy:var(--raised);--m-rt:var(--blue);--m-lab:var(--ink);--m-pin:var(--pink);--m-ring:var(--raised)}
.mps-6 .msvg .m-dot{display:none}
.mps-6 .msvg .m-bub{display:inline}
.msvg .m-bub .bring{stroke:var(--m-ring);stroke-width:3}
.msvg .m-bub .btail{fill:var(--bc)}

/* ---------- F form fields ---------- */
.fms{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;align-items:start}
.fm{display:grid;gap:14px;padding:16px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.fm-h{display:flex;align-items:center;gap:8px;font:700 15px var(--display)}
.fm-h .ic{color:var(--muted)}
.fm-h small{display:block;font:600 12px var(--body);color:var(--muted)}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
.fgrid .full{grid-column:1/-1}
.fld{position:relative;display:grid;gap:6px;min-width:0;align-content:start}
.fl{font:700 13px var(--body);color:var(--ink)}
.fc{position:relative;display:flex;align-items:center;min-height:46px;border-radius:12px;background:var(--surface);border:1.5px solid var(--border);transition:border-color .2s,box-shadow .2s,background-color .2s}
.fc:focus-within{border-color:var(--pink);box-shadow:0 0 0 3px rgba(var(--pk-rgb),.22)}
.fin{flex:1;min-width:0;width:100%;border:0;background:none;outline:none;padding:11px 14px;font:500 15px var(--body);color:var(--ink);-webkit-appearance:none;appearance:none;border-radius:inherit}
textarea.fin{resize:vertical;min-height:88px;line-height:1.45}
select.fin{cursor:pointer;padding-right:40px}
select.fin option{background:var(--raised);color:var(--ink)}
.fin::placeholder{color:var(--disabled)}
.fin::-webkit-calendar-picker-indicator{opacity:.75;cursor:pointer}
.fc .chev{position:absolute;right:12px;top:50%;margin-top:-9px;pointer-events:none;color:var(--muted)}
.fc .pre{padding-left:14px;color:var(--muted);font-weight:700;margin-right:-8px}
.fc .unit{padding-right:14px;color:var(--muted);font-weight:700}
.fic{display:none;flex:none;place-items:center;align-self:stretch;width:44px;color:var(--muted);border-right:1px solid var(--line);transition:color .2s,background-color .2s}
.fhelp{font-size:12.5px;color:var(--muted);line-height:1.35}
.ferr{display:none;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--bad-text)}
.ferr .ic{width:15px;height:15px}
.fld.err .ferr{display:flex}
.fld.err .fhelp{display:none}
.fld.err .fc{border-color:var(--bad);box-shadow:0 0 0 3px color-mix(in srgb,var(--bad) 18%,transparent)}
.fm-a{display:flex;gap:8px;flex-wrap:wrap}
.fdd{display:flex;align-items:center;gap:10px;text-align:left;cursor:pointer}
.fdd .dv{flex:1;min-width:0}
.fdd .dot,.fmenu .dot{width:10px;height:10px;border-radius:50%;background:var(--dc);flex:none}
.fmenu{position:absolute;left:-1.5px;right:-1.5px;top:calc(100% + 6px);z-index:25;margin:0;padding:6px;list-style:none;background:var(--raised);border:1px solid var(--line);border-radius:14px;box-shadow:0 22px 44px -16px var(--shc);opacity:0;visibility:hidden;transform:translateY(-6px) scale(.98);transform-origin:top center;transition:opacity .16s var(--ease),transform .22s var(--ease),visibility 0s linear .22s}
.fdd[aria-expanded="true"]~.fmenu{opacity:1;visibility:visible;transform:none;transition:opacity .16s var(--ease),transform .22s var(--ease),visibility 0s}
.fmenu li{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;cursor:pointer;font-weight:600;font-size:14.5px}
.fmenu li small{margin-left:auto;color:var(--muted);font-weight:600;font-size:12px}
.fmenu li[aria-selected="true"]{background:var(--pink-tint)}
.fmenu li.act{outline:2px solid var(--focus);outline-offset:-2px}
@media (hover:hover){.fmenu li:hover{background:var(--sunken)}.fmenu li[aria-selected="true"]:hover{background:var(--pink-tint)}}
/* F2 filled */
.fs-2 .fc{background:var(--sunken);border:0;border-bottom:2px solid var(--border);border-radius:12px 12px 4px 4px}
.fs-2 .fc:focus-within{border-bottom-color:var(--pink);box-shadow:0 2px 0 0 var(--pink)}
.fs-2 .fld.err .fc{border-bottom-color:var(--bad);box-shadow:0 2px 0 0 var(--bad)}
.fs-2 .fl{font-size:12px;letter-spacing:.02em;color:var(--muted)}
/* F3 floating label */
.fs-3 .fld{display:block}
.fs-3 .fl{position:absolute;left:16px;top:16px;z-index:1;font:500 15px var(--body);color:var(--muted);pointer-events:none;transform-origin:0 0;transition:transform .18s var(--ease),color .18s}
.fs-3 .fc{min-height:58px;align-items:flex-end}
.fs-3 .fin{padding:24px 15px 8px}
.fs-3 .fc .pre{padding-bottom:9px}
.fs-3 .fc .unit{padding-bottom:9px}
.fs-3 .fld.fixed .fl,.fs-3 .fld:focus-within .fl,.fs-3 .fld:has(.fin:not(:placeholder-shown)) .fl{transform:translateY(-9px) scale(.76);font-weight:700}
.fs-3 .fld:focus-within .fl{color:var(--pink)}
.fs-3 .fld.err .fl{color:var(--bad-text)}
.fs-3 .fhelp,.fs-3 .ferr{margin-top:6px}
.fs-3 .fc .chev{margin-top:-4px}
/* F4 underline only */
.fs-4 .fc{background:none;border:0;border-bottom:1.5px solid var(--border);border-radius:0;min-height:42px}
.fs-4 .fc:focus-within{box-shadow:0 1.5px 0 0 var(--pink);border-bottom-color:var(--pink)}
.fs-4 .fld.err .fc{box-shadow:0 1.5px 0 0 var(--bad)}
.fs-4 .fin{padding:8px 2px}
.fs-4 textarea.fin{border:0}
.fs-4 .fl{font:800 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.fs-4 .fc .pre{padding-left:2px}
.fs-4 .fmenu{border-radius:10px}
/* F5 soft pill */
.fs-5 .fc{border-radius:999px;background:var(--sunken);border:1.5px solid transparent}
.fs-5 .fld.area .fc{border-radius:22px}
.fs-5 .fin{padding:11px 18px}
.fs-5 .fc:focus-within{background:var(--surface);border-color:var(--pink);box-shadow:0 0 0 5px rgba(var(--pk-rgb),.16),0 10px 24px -14px rgba(var(--pk-rgb),.8)}
.fs-5 .fl{padding-left:14px}
.fs-5 .fhelp,.fs-5 .ferr{padding-left:14px}
.fs-5 .fc .chev{right:16px}
.fs-5 .fc .pre{padding-left:18px}
.fs-5 .fmenu{border-radius:22px}
.fs-5 .fmenu li{border-radius:999px}
/* F6 icon tile */
.fs-6 .fic{display:grid}
.fs-6 .fc{background:var(--surface);overflow:visible}
.fs-6 .fc:focus-within .fic{color:var(--pink);background:var(--pink-tint)}
.fs-6 .fic{border-radius:10px 0 0 10px}
.fs-6 .fld.area .fic{align-items:start;padding-top:12px}
.fs-6 .fld.err .fic{color:var(--bad-text);background:var(--bad-tint)}
.fs-6 .fc .pre{display:none}
/* F7 grouped rows */
.fs-7 .fgrid{grid-template-columns:1fr;gap:0;background:var(--surface);border:1px solid var(--line);border-radius:16px}
.fs-7 .fld{grid-template-columns:minmax(110px,40%) minmax(0,1fr);align-items:center;gap:2px 12px;padding:8px 14px;transition:background-color .2s}
.fs-7 .fld:first-child{border-radius:15px 15px 0 0}
.fs-7 .fld:last-child{border-radius:0 0 15px 15px}
.fs-7 .fld+.fld{border-top:1px solid var(--line)}
.fs-7 .fc{border:0;background:none;box-shadow:none!important;min-height:40px}
.fs-7 .fin{text-align:right;padding:8px 0}
.fs-7 select.fin{text-align-last:right;padding-right:26px}
.fs-7 .fc .chev{right:0}
.fs-7 .fdd{justify-content:flex-end;padding-right:26px}
.fs-7 .fdd .dv{flex:none}
.fs-7 .fld.area{grid-template-columns:1fr}
.fs-7 textarea.fin{text-align:left;min-height:70px}
.fs-7 .fhelp,.fs-7 .ferr{grid-column:1/-1}
.fs-7 .fld:focus-within{background:color-mix(in srgb,var(--pink-tint) 55%,transparent)}
.fs-7 .fld.err{background:color-mix(in srgb,var(--bad-tint) 75%,transparent)}
.fs-7 .fl{font-weight:600}
/* F8 glove-size */
.fs-8 .fl{font:800 15px var(--display)}
.fs-8 .fc{min-height:60px;border:2px solid var(--border);border-radius:14px}
.fs-8 .fin{font-size:19px;font-weight:600;padding:14px 16px}
.fs-8 .fc:focus-within{border-color:var(--pink);box-shadow:0 0 0 4px rgba(var(--pk-rgb),.25)}
.fs-8 .fhelp,.fs-8 .ferr{font-size:14px}
.fs-8 .fc .pre,.fs-8 .fc .unit{font-size:19px}
.fs-8 .fmenu li{padding:14px;font-size:17px}
.fs-8 .fgrid{gap:18px 12px}

/* ---------- TT tooltips ---------- */
.ttc{overflow:visible}
.ttk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ttk>div{position:relative;padding:12px;border-radius:14px;background:var(--sunken);border:1px solid var(--line);min-width:0;display:grid;gap:4px;align-content:start}
.ttk .v{font:800 34px/1 var(--num);letter-spacing:.01em}
.ttk small{font-size:12px;color:var(--muted);font-weight:600}
.ttk .lab{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:800;color:var(--muted)}
.tt{position:relative;display:inline-flex}
.tt-b{width:24px;height:24px;border-radius:50%;border:0;padding:0;background:var(--raised3);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background-color .2s,color .2s,transform .16s var(--ease)}
.tt-b .ic{width:15px;height:15px}
.tt-b[aria-expanded="true"]{background:var(--pink);color:var(--pink-on)}
.tt-b:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.tt-b:active{transform:scale(.92)}
.tip{position:absolute;left:0;top:calc(100% + 10px);z-index:30;width:min(300px,76vw);display:grid;gap:8px;text-align:left;font:500 13.5px/1.4 var(--body);color:var(--ink);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .16s var(--ease),transform .2s var(--ease),visibility 0s linear .2s;pointer-events:none}
.tt[data-open="true"] .tip{opacity:1;visibility:visible;transform:none;transition:opacity .16s var(--ease),transform .2s var(--ease),visibility 0s;pointer-events:auto}
@media (hover:hover){.tt:hover .tip{opacity:1;visibility:visible;transform:none;transition:opacity .16s var(--ease) .12s,transform .2s var(--ease) .12s,visibility 0s .12s}}
.tip::before{content:"";position:absolute;left:58px;top:-6px;width:12px;height:12px;transform:rotate(45deg);background:inherit;border-left:inherit;border-top:inherit;border-radius:3px 0 0 0}
.tip .tt-t{font:800 15px var(--display);letter-spacing:-.01em}
.tip .tt-f{font-weight:700}
.tip .tt-n{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.tip .tt-n span{display:grid;font-size:11.5px;font-weight:600;color:var(--muted)}
.tip .tt-n b{font:800 30px/1 var(--num);color:var(--ink)}
.tip .tt-n i{font:800 22px var(--num);font-style:normal;color:var(--muted);padding-bottom:12px}
.tip .tt-s{font-size:12.5px;color:var(--muted)}
.tip .tt-w{font-weight:600}
.tt-w,.tt-n,.tt-s,.tt-t{display:none}
.ttx{display:none}
/* TT1 dark tip */
.tts-1 .tip{background:var(--ink);color:var(--canvas);padding:10px 12px;border-radius:10px;width:max-content;max-width:min(270px,70vw);gap:3px;box-shadow:0 16px 30px -14px rgba(0,0,0,.6)}
.tts-1 .tip .tt-w{display:block;opacity:.8}
.tts-1 .tip .tt-n,.tts-1 .tip .tt-s,.tts-1 .tip .tt-t{display:none}
.ttk .tt{position:static}
.opt-body.tts-1,.opt-body.tts-2,.opt-body.tts-4{padding-bottom:210px}
.opt-body.tts-1{padding-bottom:90px}
/* TT2 rich popover */
.tts-2 .tip{background:var(--raised);border:1px solid var(--line);padding:14px;border-radius:16px;box-shadow:0 2px 4px rgba(0,0,0,.1),0 26px 50px -20px var(--shc)}
.tts-2 .tip .tt-t,.tts-2 .tip .tt-n,.tts-2 .tip .tt-s{display:flex}
.tts-2 .tip .tt-t{display:block}
.tts-2 .tip .tt-n{padding:10px 12px;border-radius:12px;background:var(--sunken)}
.tts-2 .tip .tt-n span:last-child b{color:var(--pink)}
/* TT3 inline expand */
.tts-3 .tip{display:none}
.tts-3 .ttx{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s var(--ease)}
.tts-3 .ttx>div{overflow:hidden;min-height:0}
.tts-3 .ttc[data-open="true"] .ttx{grid-template-rows:1fr}
.ttx-in{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;align-items:center;margin-top:12px;padding:12px 14px;border-radius:14px;background:var(--pink-tint);border:1px solid color-mix(in srgb,var(--pink) 35%,transparent)}
.ttx-in .tt-n{display:flex;grid-row:1/4;gap:8px;align-items:flex-end}
.ttx-in .tt-n span{display:grid;font-size:11px;color:var(--muted);font-weight:600}
.ttx-in .tt-n b{font:800 28px/1 var(--num)}
.ttx-in .tt-n i{font:800 20px var(--num);font-style:normal;color:var(--muted);padding-bottom:12px}
.ttx-in .tt-t{display:block;font:800 14px var(--display);color:var(--pink)}
.ttx-in .tt-f{font-weight:700;font-size:14px}
.ttx-in .tt-s{display:block;font-size:12.5px;color:var(--muted)}
/* TT4 pink formula card */
.tts-4 .tip{background:var(--hero);color:#fff;padding:14px 16px;border-radius:18px;box-shadow:0 24px 44px -18px rgba(var(--pk-rgb),.9)}
.tts-4 .tip .tt-t{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;opacity:.9}
.tts-4 .tip .tt-n{display:flex;order:-0}
.tts-4 .tip .tt-n span{color:rgba(255,255,255,.85)}
.tts-4 .tip .tt-n b{color:#fff;font-size:40px}
.tts-4 .tip .tt-n i{color:rgba(255,255,255,.7)}
.tts-4 .tip .tt-s{display:block;color:rgba(255,255,255,.88)}

/* ---------- ST stepper ---------- */
.stw{display:grid;gap:14px;padding:16px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.stw-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.stw-h .t{flex:1;min-width:0}
.stw-h .t small{display:block;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.stw-h .t b{font:700 17px var(--display)}
.stp{list-style:none;margin:0;padding:0}
.sti{position:relative;min-width:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sti[data-s="lock"]{cursor:not-allowed}
.stn{position:relative;display:grid;place-items:center;flex:none;font:800 16px var(--num)}
.stn .ic{width:16px;height:16px;display:none;stroke-width:2.6}
.sti[data-s="done"] .stn .n,.sti[data-s="lock"] .stn .n{display:none}
.sti[data-s="done"] .stn .sd{display:block}
.sti[data-s="lock"] .stn .sl{display:block;stroke-width:2}
.stt{display:grid;min-width:0}
.stt b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stt small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sti[data-s="lock"] .stt b{color:var(--muted)}
.sti.shake{animation:shake .4s var(--ease)}
@keyframes shake{25%{transform:translateX(-4px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
.st-ctl{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.st-ctl .hint{margin-left:auto}
.st6x{display:none}
/* ST1 dots on a line */
.sts-1 .stp{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.sts-1 .sti{display:grid;justify-items:center;text-align:center;gap:8px;padding:0 2px}
.sts-1 .sti::before{content:"";position:absolute;top:16px;right:calc(50% + 20px);left:calc(-50% + 20px);height:3px;border-radius:3px;background:var(--line);transition:background-color .35s var(--ease)}
.sts-1 .sti:first-child::before{display:none}
.sts-1 .sti[data-s="done"]::before,.sts-1 .sti[data-s="cur"]::before{background:var(--pink)}
.sts-1 .stn{width:34px;height:34px;border-radius:50%;background:var(--sunken);border:2px solid var(--line);color:var(--muted);transition:background-color .3s,border-color .3s,color .3s,box-shadow .3s}
.sts-1 .sti[data-s="done"] .stn{background:var(--pink);border-color:var(--pink);color:var(--pink-on)}
.sts-1 .sti[data-s="cur"] .stn{background:var(--raised);border-color:var(--pink);color:var(--pink);box-shadow:0 0 0 5px rgba(var(--pk-rgb),.2)}
.sts-1 .stt{justify-items:center}
.sts-1 .stt small{max-width:100%}
/* ST2 segmented bar */
.sts-2 .stp{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.sts-2 .sti{display:grid;gap:8px;padding-top:0}
.sts-2 .sti::before{content:"";height:10px;border-radius:6px;background:var(--sunken);border:1px solid var(--line);transition:background-color .3s}
.sts-2 .sti[data-s="done"]::before{background:var(--pink);border-color:var(--pink)}
.sts-2 .sti[data-s="cur"]::before{background:repeating-linear-gradient(135deg,var(--pink) 0 6px,color-mix(in srgb,var(--pink) 55%,transparent) 6px 12px);background-size:17px 17px;border-color:var(--pink);animation:stripe 1s linear infinite}
@keyframes stripe{to{background-position:17px 0}}
.sts-2 .stn{display:none}
.sts-2{--lockmask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E")}
.sts-2 .sti[data-s="lock"] .stt b::after{content:"";display:inline-block;width:12px;height:12px;margin-left:5px;vertical-align:-1px;background:currentColor;-webkit-mask:var(--lockmask) center/contain no-repeat;mask:var(--lockmask) center/contain no-repeat}
.sts-2 .sti[data-s="cur"] .stt b{color:var(--pink)}
/* ST3 chevrons */
.sts-3 .stp{display:flex}
.sts-3 .sti{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:0 10px 0 18px;margin-left:-6px;background:var(--sunken);color:var(--muted);clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%,12px 50%);transition:background-color .3s,color .3s}
.sts-3 .sti:first-child{margin-left:0;border-radius:12px 0 0 12px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%)}
.sts-3 .sti:last-child{border-radius:0 12px 12px 0;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,12px 50%)}
.sts-3 .sti[data-s="done"]{background:var(--pink-tint);color:var(--pink)}
.sts-3 .sti[data-s="cur"]{background:var(--hero);color:#fff}
.sts-3 .stn .n{display:none}
.sts-3 .stt small{display:none}
.sts-3 .stt b{color:inherit!important;font-size:13.5px}
.sts-3 .stn .ic{width:14px;height:14px}
/* ST4 vertical rail */
.sts-4 .stp{display:grid;gap:0}
.sts-4 .sti{display:flex;align-items:flex-start;gap:12px;padding:8px 10px 14px;border-radius:14px;transition:background-color .3s}
.sts-4 .sti::before{content:"";position:absolute;left:25px;top:40px;bottom:-4px;width:2px;background:var(--line)}
.sts-4 .sti:last-child::before{display:none}
.sts-4 .sti[data-s="done"]::before{background:var(--pink)}
.sts-4 .stn{width:32px;height:32px;border-radius:10px;background:var(--sunken);border:1.5px solid var(--line);color:var(--muted)}
.sts-4 .sti[data-s="done"] .stn{background:var(--pink-tint);border-color:transparent;color:var(--pink)}
.sts-4 .sti[data-s="cur"]{background:var(--pink-tint)}
.sts-4 .sti[data-s="cur"] .stn{background:var(--pink);border-color:var(--pink);color:var(--pink-on)}
.sts-4 .stt{padding-top:5px}
.sts-4 .stt b{font-size:15px}
.sts-4 .sti[data-s="cur"] .stt small{color:var(--ink);font-weight:600}
/* ST5 chips */
.sts-5 .stp{display:flex;flex-wrap:wrap;gap:8px}
.sts-5 .sti{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;border-radius:999px;background:var(--sunken);border:1.5px solid var(--line);transition:background-color .3s,border-color .3s,color .3s}
.sts-5 .stn{width:24px;height:24px;border-radius:50%;background:var(--raised3);font-size:14px}
.sts-5 .stn .ic{width:13px;height:13px}
.sts-5 .stt small{display:none}
.sts-5 .sti[data-s="done"]{background:var(--good-tint);border-color:transparent}
.sts-5 .sti[data-s="done"] .stn{background:var(--good);color:var(--good-on)}
.sts-5 .sti[data-s="cur"]{background:var(--pink);border-color:var(--pink);color:var(--pink-on);box-shadow:0 10px 22px -12px rgba(var(--pk-rgb),.9)}
.sts-5 .sti[data-s="cur"] .stn{background:rgba(255,255,255,.28);color:inherit}
.sts-5 .sti[data-s="cur"] .stt b{color:inherit}
.sts-5 .sti[data-s="lock"]{border-style:dashed;background:transparent}
/* ST6 compact focus */
.sts-6 .st6x{display:flex;align-items:center;gap:16px}
.st6-ring{position:relative;width:78px;height:78px;flex:none}
.st6-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.st6-ring .tr{fill:none;stroke:var(--sunken);stroke-width:8}
.st6-ring .ar{fill:none;stroke:var(--pink);stroke-width:8;stroke-linecap:round;stroke-dasharray:calc(var(--sp)*1px) 200px;transition:stroke-dasharray .5s var(--ease)}
.st6-ring span{position:absolute;inset:0;display:grid;place-items:center;font:800 24px var(--num)}
.st6-ring span small{font-size:14px;color:var(--muted)}
.st6-t{flex:1;min-width:0;display:grid;gap:2px}
.st6-t small{font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.st6-t b{font:800 26px/1.1 var(--display);letter-spacing:-.02em}
.st6-t span{font-size:13px;color:var(--muted)}
.sts-6 .stp{display:flex;gap:6px}
.sts-6 .sti{flex:1;display:grid;gap:6px}
.sts-6 .sti::before{content:"";height:5px;border-radius:5px;background:var(--sunken);transition:background-color .3s}
.sts-6 .sti[data-s="done"]::before{background:var(--pink)}
.sts-6 .sti[data-s="cur"]::before{background:var(--ink)}
.sts-6 .stn{display:none}
.sts-6 .stt b{font-size:11.5px;font-weight:700;color:var(--muted)}
.sts-6 .sti[data-s="cur"] .stt b{color:var(--ink)}
.sts-6 .stt small{display:none}

/* ---------- CU customer card ---------- */
.cuc{display:grid;gap:14px;padding:16px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.cu-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cu-h .av{width:48px;height:48px;font-size:16px;background:var(--pink-tint);color:var(--pink)}
.cu-who{flex:1;min-width:150px}
.cu-who b{display:block;font:700 19px var(--display);letter-spacing:-.01em}
.cu-who small{color:var(--muted);font-size:13px}
.cu-m{display:grid;gap:10px}
.mt{--mc:var(--warn);min-width:0}
.mt[data-z="bad"]{--mc:var(--bad-text)}
.mt[data-z="good"]{--mc:var(--good)}
.mt-top{display:flex;align-items:baseline;gap:8px}
.mt-l{font-size:13px;font-weight:700;color:var(--muted);flex:1}
.mt-v{font:800 22px/1 var(--num);color:var(--ink);font-variant-numeric:tabular-nums}
.mt-d{font:800 12px var(--body);color:var(--muted);min-width:34px;text-align:right}
.mt-d.up{color:var(--good)}.mt-d.dn{color:var(--bad-text)}
.mt-bar{display:block;height:10px;border-radius:10px;background:var(--sunken);overflow:hidden;margin-top:6px}
.mt-bar i{display:block;height:100%;border-radius:inherit;background:var(--mc);transform-origin:left;transform:scaleX(calc(var(--v)/100));transition:transform .6s var(--ease),background-color .3s}
.cu-acts{display:flex;gap:8px;flex-wrap:wrap}
/* CU2 rings */
.cus-2 .cu-m{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mt-ring{position:relative;width:84px;height:84px;margin:0 auto}
.mt-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.mt-ring .tr{fill:none;stroke:var(--sunken);stroke-width:9}
.mt-ring .ar{fill:none;stroke:var(--mc);stroke-width:9;stroke-linecap:round;stroke-dasharray:calc(var(--v)*1px) 200px;transition:stroke-dasharray .6s var(--ease),stroke .3s}
.mt-ring .mt-v{position:absolute;inset:0;display:grid;place-items:center;font-size:26px}
.cus-2 .mt{display:grid;justify-items:center;gap:6px;text-align:center}
.cus-2 .mt-l{flex:none}
/* CU3 mood face */
.cus-3 .cu-b{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center}
.mface{width:108px;display:grid;justify-items:center;gap:4px}
.mface svg{width:96px;height:96px}
.mface .fb{fill:color-mix(in srgb,var(--mc) 22%,var(--sunken));stroke:var(--mc);stroke-width:3;transition:fill .4s,stroke .4s}
.mface .fe{fill:var(--ink)}
.mface .fm2,.mface .fbr{fill:none;stroke:var(--ink);stroke-width:3.2;stroke-linecap:round;transition:d .5s var(--ease)}
.mface small{font:800 12px var(--body);color:var(--mc);letter-spacing:.04em;text-transform:uppercase}
.cus-3 .mt-bar{height:7px}
/* CU4 segmented */
.mt-seg{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin-top:6px}
.mt-seg i{height:14px;border-radius:4px;background:var(--sunken);transition:background-color .3s;transition-delay:calc(var(--n)*30ms)}
.mt-seg i.on{background:var(--mc)}
/* CU5 sparkline meters */
.cus-5 .cu-m{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cus-5 .mt{padding:10px 12px;border-radius:14px;background:var(--sunken);border:1px solid var(--line)}
.cus-5 .mt-top{flex-wrap:wrap;gap:4px 8px}
.cus-5 .mt-l{flex-basis:100%}
.mt-sp{display:block;width:100%;height:34px;margin-top:6px;overflow:visible}
.mt-sp .l{fill:none;stroke:var(--mc);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.mt-sp .a{fill:color-mix(in srgb,var(--mc) 18%,transparent)}
/* CU6 compact strip */
.cus-6 .cuc{gap:10px}
.cus-6 .cu-m{display:flex;flex-wrap:wrap;gap:8px}
.cus-6 .mt{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:linear-gradient(90deg,color-mix(in srgb,var(--mc) 26%,transparent) calc(var(--v)*1%),var(--sunken) calc(var(--v)*1%));border:1px solid color-mix(in srgb,var(--mc) 45%,transparent)}
.cus-6 .mt-top{gap:6px}
.cus-6 .mt-l{color:var(--ink)}
.cus-6 .mt-v{font-size:19px}

/* ---------- PB playback ---------- */
.pb{--p:.37;position:relative;display:grid;gap:10px;padding:14px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.pb-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pb-ti{flex:1;min-width:150px}
.pb-ti b{display:block;font:700 15px var(--display)}
.pb-ti small{color:var(--muted);font-size:12.5px}
.pb-row{display:flex;align-items:center;gap:12px;min-width:0}
.pb-play{width:46px;height:46px;border-radius:50%;border:0;background:var(--ink);color:var(--canvas);display:grid;place-items:center;cursor:pointer;flex:none;box-shadow:0 8px 18px -10px var(--shc);transition:transform .16s var(--ease)}
.pb-play .ic{width:20px;height:20px}
.pb-play .i-pause{display:none}
.pb[data-play="on"] .pb-play .i-play{display:none}
.pb[data-play="on"] .pb-play .i-pause{display:block}
.pb-play:active{transform:scale(.93)}
.pb-play:focus-visible,.pbw:focus-visible,.pbm:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.pbw{position:relative;flex:1;min-width:0;height:48px;cursor:pointer;touch-action:none;border-radius:6px}
.pbw-bars,.pbw-on{position:absolute;inset:0;display:flex;align-items:flex-end;gap:2px;pointer-events:none}
.pbw i{flex:1;min-width:1px;height:calc(var(--h)*100%);border-radius:2px 2px 1px 1px;background:var(--raised3)}
.pbw-on{clip-path:inset(0 calc(100% - var(--p)*100%) 0 0)}
.pbw-on i{background:var(--pink)}
.pbh{position:absolute;top:-5px;bottom:-5px;left:calc(var(--p)*100%);width:3px;margin-left:-1.5px;border-radius:3px;background:var(--ink);pointer-events:none}
.pbm{position:absolute;top:-12px;left:calc(var(--x)*100%);z-index:2;transform:translateX(-50%);width:22px;height:22px;padding:0;border:0;border-radius:50% 50% 50% 0;rotate:-45deg;background:var(--mk);cursor:pointer;box-shadow:0 0 0 2px var(--raised);transition:scale .16s var(--ease)}
.pbm[data-k="good"]{--mk:var(--good)}.pbm[data-k="bad"]{--mk:var(--bad)}.pbm[data-k="pink"]{--mk:var(--pink)}
.pbm .ml{position:absolute;left:50%;bottom:calc(100% + 8px);rotate:45deg;transform-origin:0 100%;white-space:nowrap;padding:4px 8px;border-radius:8px;background:var(--ink);color:var(--canvas);font:700 11.5px var(--body);opacity:0;pointer-events:none;transition:opacity .15s;display:none}
@media (hover:hover){.pbm:hover{scale:1.15}}
.pb-t{font:800 17px var(--num);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--muted);letter-spacing:.03em}
.pb-t b{color:var(--ink)}
.pb-ctl{flex-wrap:wrap;gap:8px}
.pb-sp{min-width:58px;justify-content:center}
.pb-mk{font-size:12.5px;color:var(--muted);font-weight:600;margin-left:auto;white-space:nowrap}
.pb-mk b{color:var(--ink)}
.pb-live{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;border:0;background:var(--bad-tint);color:var(--bad-text);font:800 12px var(--body);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.pb-live i{width:8px;height:8px;border-radius:50%;background:var(--rec);animation:recpulse 1.4s ease-out infinite}
.pb[data-live="behind"] .pb-live{background:var(--sunken);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.pb[data-live="behind"] .pb-live i{animation:none;background:var(--muted)}
.pb-live:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.pb-ch{display:none}
.pb-mks{display:none}
/* PB2 floating dock */
.pbs-2 .pb{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;border-radius:30px;padding:8px 12px 8px 8px;background:var(--gl-bg);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);border:1px solid var(--gl-bd);box-shadow:inset 0 1px 0 var(--gl-hi),0 24px 50px -22px var(--shc)}
.pbs-2 .pb-row.main{flex:1 1 340px;gap:10px}
.pbs-2 .pb-ctl{flex:none;gap:6px}
.pbs-2 .pb-ctl .pb-mk{display:none}
.pbs-2 .pb-top{order:3;flex:none}
.pbs-2 .pb-ti{display:none}
.pbs-2 .pbw{height:32px}
.pbs-2 .pbw-bars,.pbs-2 .pbw-on{align-items:center}
.pbs-2 .pbm{top:-7px;width:14px;height:14px}
.pbs-2 .pb-play{background:var(--hero);color:#fff}
.pbs-2 .pb-t{font-size:15px}
/* PB3 big scrubber */
.pbs-3 .pbw{height:84px}
.pbs-3 .pb-row.main{flex-wrap:wrap}
.pbs-3 .pb-row.main .pbw{order:-1;flex-basis:100%}
.pbs-3 .pbm{top:auto;bottom:-14px;rotate:135deg}
.pbs-3 .pbw{margin-bottom:12px}
.pbs-3 .pb-mks{display:flex;gap:6px;flex-wrap:wrap}
.pb-mks button{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:700 12px var(--body);cursor:pointer}
.pb-mks button i{width:8px;height:8px;border-radius:50%;background:var(--mk)}
.pb-mks button time{color:var(--muted);font-weight:600}
@media (hover:hover){.pb-mks button:hover{background:var(--pink-tint)}}
/* PB4 minimal line */
.pbs-4 .pb{padding:12px 14px;gap:8px}
.pbs-4 .pbw{height:26px}
.pbs-4 .pbw-bars,.pbs-4 .pbw-on{align-items:center;gap:1px}
.pbs-4 .pbw i{border-radius:1px}
.pbs-4 .pbw-bars i{background:color-mix(in srgb,var(--raised3) 70%,transparent)}
.pbs-4 .pbm{top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;rotate:0deg;box-shadow:0 0 0 3px var(--raised)}
.pbs-4 .pb-play{width:36px;height:36px;background:none;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.pbs-4 .pbh{top:0;bottom:0;width:2px}
/* PB5 mirrored waveform */
.pbs-5 .pbw{height:64px}
.pbs-5 .pbw-bars,.pbs-5 .pbw-on{align-items:center}
.pbs-5 .pbw i{border-radius:3px}
.pbs-5 .pbw-on i{background:linear-gradient(180deg,#FF7AB3,var(--pink-deep))}
.pbs-5 .pbm{top:0;bottom:0;height:auto;width:16px;border-radius:6px;rotate:0deg;background:color-mix(in srgb,var(--mk) 22%,transparent);box-shadow:inset 0 0 0 1.5px var(--mk)}
.pbs-5 .pb-play{border-radius:16px}
/* PB6 chapters */
.pbs-6 .pb-ch{display:flex;gap:3px;margin-left:58px}
.pb-ch span{flex:var(--w);min-width:0;padding:4px 6px;border-radius:6px;background:var(--sunken);font:700 11px var(--body);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background-color .2s,color .2s}
.pb-ch span.on{background:var(--pink-tint);color:var(--pink)}
.pbs-6 .pbm{top:auto;bottom:-10px;width:20px;height:20px;border-radius:50%;rotate:0deg;display:grid;place-items:center;color:#fff}
.pbs-6 .pbm .ic{width:12px;height:12px;rotate:0deg;display:block;stroke-width:2.6}
.pbm .ic{display:none}
.pbs-6 .pbw{margin-bottom:8px}

/* ---------- LN lion usage ---------- */
.lnx{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.lnx-s{position:relative;overflow:hidden;border-radius:16px;min-height:190px;min-width:0;display:grid}
.lnx-cap{position:absolute;left:10px;top:8px;z-index:3;font:800 10px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);background:var(--raised);padding:2px 7px;border-radius:999px;border:1px solid var(--line)}
.lnx-img{display:block;filter:drop-shadow(0 12px 16px rgba(0,0,0,.3))}
.lnx-hero{background:var(--hero);color:#fff;padding:34px 16px 16px;align-content:end}
.lnx-hero .lnx-cap{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3);color:#fff}
.lnx-copy small{display:block;font:700 10.5px var(--body);letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.lnx-copy b{display:block;font:800 22px/1.1 var(--display);letter-spacing:-.02em;margin:4px 0}
.lnx-copy span{font-size:13px;opacity:.9}
.lnx-hero .lnx-copy{position:relative;z-index:1;max-width:60%}
.lnx-hero .lnx-art{position:absolute;right:12px;bottom:10px;z-index:0}
.lnx-hero .lnx-img{width:112px}
.lnx-empty,.lnx-load,.lnx-cel{background:var(--raised);border:1px solid var(--line);padding:34px 16px 16px;justify-items:center;align-content:center;text-align:center;gap:6px}
.lnx-empty b{font:700 15px var(--display)}
.lnx-empty p,.lnx-load p{margin:0;font-size:13px;color:var(--muted);max-width:30ch}
.lnx-art{position:relative;display:grid;place-items:center}
.lnx-alt{display:none}
.lnx-empty .lnx-img{width:84px}
.lnx-load .lnx-art{width:84px;height:84px}
.lnx-load .lnx-img{width:58px;animation:bob 1.6s ease-in-out infinite}
.lnx-load .lnx-art::before{content:"";position:absolute;inset:0;border-radius:50%;border:3px solid color-mix(in srgb,var(--pink) 18%,transparent);border-top-color:var(--pink);animation:spin .9s linear infinite}
.lnx-cel{background:linear-gradient(160deg,var(--pink-tint),var(--raised) 70%)}
.lnx-cel .lnx-copy{color:var(--ink)}
.lnx-cel .lnx-copy b{font-size:20px}
.lnx-cel .lnx-copy small{color:var(--pink);opacity:1}
.lnx-cel .lnx-img{width:92px}
.lnx-cel.go .lnx-img{animation:lnpop .8s var(--spring)}
@keyframes lnpop{0%{transform:scale(.4) rotate(-12deg);opacity:0}60%{transform:scale(1.12) rotate(4deg);opacity:1}100%{transform:none}}
.lnx-conf{position:absolute;inset:0;pointer-events:none}
.lnx-conf i{position:absolute;left:50%;top:42%;width:7px;height:11px;border-radius:2px;background:var(--cc);opacity:0}
.lnx-cel.go .lnx-conf i{animation:conf 1.1s var(--ease) forwards;animation-delay:calc(var(--n)*25ms)}
@keyframes conf{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--rt))}}
.lnx-re{position:absolute;right:8px;top:6px;z-index:3}
.lnx-re .btn{min-height:32px;padding:5px 10px;font-size:12.5px}
/* LN1 big & proud: defaults above, bigger */
.lns-1 .lnx-hero .lnx-img{width:136px}
.lns-1 .lnx-hero .lnx-art{right:6px;bottom:4px}
.lns-1 .lnx-empty .lnx-img{width:104px}
.lns-1 .lnx-cel .lnx-img{width:112px}
/* LN2 corner peek */
.lns-2 .lnx-hero .lnx-img{width:150px;transform:rotate(-8deg)}
.lns-2 .lnx-hero .lnx-art{right:-30px;bottom:-44px}
.lns-2 .lnx-empty,.lns-2 .lnx-load,.lns-2 .lnx-cel{padding-bottom:40px}
.lns-2 .lnx-empty .lnx-art,.lns-2 .lnx-load .lnx-art,.lns-2 .lnx-cel .lnx-art{position:absolute;right:-18px;bottom:-26px;width:auto;height:auto}
.lns-2 .lnx-empty .lnx-img,.lns-2 .lnx-cel .lnx-img{width:96px;transform:rotate(-10deg)}
.lns-2 .lnx-load .lnx-art::before{display:none}
.lns-2 .lnx-load .lnx-img{width:88px;animation:peek 1.8s var(--ease) infinite alternate}
@keyframes peek{from{transform:translateY(30px) rotate(-10deg)}to{transform:translateY(0) rotate(-10deg)}}
.lns-2 .lnx-load p::before{content:"";display:block;width:120px;height:4px;margin:0 auto 10px;border-radius:4px;background:linear-gradient(90deg,var(--pink) 40%,var(--sunken) 40%);background-size:200% 100%;animation:ldbar 1.2s linear infinite}
@keyframes ldbar{from{background-position:100% 0}to{background-position:0 0}}
.lns-2 .lnx-cel.go .lnx-img{animation:peekup .8s var(--spring)}
@keyframes peekup{0%{transform:translateY(80px) rotate(-10deg)}100%{transform:rotate(-10deg)}}
/* LN3 medallion */
.lnx-med{display:none}
.lns-3 .lnx-art{width:84px;height:84px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px var(--pink-tint),0 14px 26px -12px rgba(var(--pk-rgb),.7)}
.lns-3 .lnx-img{width:60px!important;filter:none}
.lns-3 .lnx-hero .lnx-art{position:absolute;right:16px;bottom:16px;width:96px;height:96px;box-shadow:0 0 0 5px rgba(255,255,255,.3),0 18px 30px -14px rgba(0,0,0,.5)}
.lns-3 .lnx-hero .lnx-img{width:70px!important}
.lns-3 .lnx-load .lnx-art::before{inset:-8px;border-width:3px}
.lns-3 .lnx-load .lnx-img{animation:none}
/* LN4 hero + celebrations only */
.lns-4 .lnx-empty .lnx-img,.lns-4 .lnx-load .lnx-img{display:none}
.lns-4 .lnx-empty .lnx-alt{display:grid}
.lns-4 .lnx-load .lnx-art{width:auto;height:auto}
.lns-4 .lnx-load .lnx-art::before{display:none}
.lns-4 .lnx-load .lnx-alt{display:block;width:150px;height:6px;border-radius:6px;background:var(--sunken);overflow:hidden;position:relative;margin-bottom:6px}
.lns-4 .lnx-load .lnx-alt::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:var(--hero);border-radius:6px;animation:indet 1.1s var(--ease) infinite}
.lns-4 .lnx-hero .lnx-img{width:124px}
/* LN5 watermark */
.lns-5 .lnx-img{filter:grayscale(1) brightness(1.4);opacity:.08}
.lns-5 .lnx-hero .lnx-img{filter:brightness(0) invert(1);opacity:.22;width:190px}
.lns-5 .lnx-hero .lnx-art{right:-24px;bottom:-34px}
.lns-5 .lnx-empty .lnx-art,.lns-5 .lnx-load .lnx-art,.lns-5 .lnx-cel .lnx-art{position:absolute;inset:0;width:auto;height:auto;z-index:0}
.lns-5 .lnx-empty .lnx-img,.lns-5 .lnx-load .lnx-img,.lns-5 .lnx-cel .lnx-img{width:180px;animation:none}
.lns-5 .lnx-load .lnx-art::before{display:none}
.lns-5 .lnx-s>*:not(.lnx-art):not(.lnx-cap):not(.lnx-re):not(.lnx-conf){position:relative;z-index:1}
.lns-5 .lnx-load p::after{content:"";display:block;width:140px;height:4px;margin:10px auto 0;border-radius:4px;background:var(--sunken);box-shadow:inset 60px 0 0 var(--pink);animation:wmload 1.6s var(--ease) infinite}
@keyframes wmload{0%{box-shadow:inset 0 0 0 var(--pink)}100%{box-shadow:inset 140px 0 0 var(--pink)}}
.lns-5 .lnx-cel.go .lnx-img{animation:wmpop .9s var(--ease)}
@keyframes wmpop{0%{opacity:0;transform:scale(1.3)}100%{opacity:.08;transform:none}}
/* LN6 tiny companion */
.lns-6 .lnx-hero .lnx-img{width:40px;filter:none}
.lns-6 .lnx-hero .lnx-copy{max-width:none}
.lns-6 .lnx-hero .lnx-art{right:14px;top:14px;bottom:auto}
.lns-6 .lnx-empty,.lns-6 .lnx-load,.lns-6 .lnx-cel{justify-items:start;text-align:left;align-content:end}
.lns-6 .lnx-empty .lnx-art,.lns-6 .lnx-load .lnx-art,.lns-6 .lnx-cel .lnx-art{width:auto;height:auto;flex-direction:row}
.lns-6 .lnx-img{width:40px!important;filter:none}
.lns-6 .lnx-load .lnx-art::before{display:none}
.lns-6 .lnx-bub{display:block}
.lnx-bub{display:none;position:relative;padding:8px 12px;border-radius:4px 14px 14px 14px;background:var(--sunken);border:1px solid var(--line);font-size:13px;font-weight:600;margin-top:6px}
.lns-6 .lnx-empty p,.lns-6 .lnx-load p{display:none}
.lns-6 .lnx-cel .lnx-art{order:-1}

/* ---------- CD condition grade ---------- */
.cdw{display:grid;gap:12px}
.cdc{display:grid;gap:12px;padding:16px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0;overflow:hidden;position:relative}
.cdc.swap{animation:fadein .3s var(--ease)}
.cd-h{display:flex;align-items:center;gap:14px;min-width:0}
.cd-t{flex:1;min-width:0}
.cd-t small{display:block;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cd-t b{display:block;font:700 18px/1.2 var(--display);letter-spacing:-.01em}
.cd-meta{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.cd-meta b{display:inline;font:800 15px var(--num);color:var(--ink);letter-spacing:.02em}
.cd-f{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cd-f li{display:flex;gap:9px;align-items:flex-start;font-size:14px;line-height:1.4}
.cd-f li .ic{width:16px;height:16px;margin-top:2px;color:var(--muted)}
.cd-f li.why .ic{color:var(--warn)}
.cd-f li b{font-weight:700}
.cd-a{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cd-act{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:12px;background:var(--gt);color:var(--gc);font:800 14px var(--body);border:1px solid color-mix(in srgb,var(--gc) 40%,transparent)}
.cd-act .ic{width:16px;height:16px}
.cd-a .spacer{flex:1}
.cd-letter{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:14px;background:var(--gt);color:var(--gc);font:800 30px/1 var(--display);border:1.5px solid color-mix(in srgb,var(--gc) 45%,transparent)}
.cd-sc{font:800 15px var(--num);color:var(--muted);letter-spacing:.02em}
.cd-sc b{font-size:22px;color:var(--ink)}
.cd-scale{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.cd-scale span{display:grid;gap:2px;padding:6px 4px;border-radius:9px;background:var(--sunken);text-align:center;font:800 15px var(--display);color:var(--muted);border:1.5px solid transparent;transition:background-color .3s,color .3s}
.cd-scale span small{font:600 10.5px/1.15 var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd-scale span.on{background:var(--gc);color:var(--raised);border-color:var(--gc)}
.cd-scale span.on small{color:inherit}
.cd-band{position:relative;padding-top:4px}
.cd-band .bb{display:grid;grid-template-columns:30fr 20fr 20fr 15fr 15fr;gap:2px;height:12px;border-radius:12px;overflow:hidden}
.cd-band .bb i:nth-child(1){background:var(--g-f)}.cd-band .bb i:nth-child(2){background:var(--g-d)}.cd-band .bb i:nth-child(3){background:var(--g-c)}.cd-band .bb i:nth-child(4){background:var(--g-b)}.cd-band .bb i:nth-child(5){background:var(--g-a)}
.cd-band .bl{display:grid;grid-template-columns:30fr 20fr 20fr 15fr 15fr;gap:2px;margin-top:5px;font:800 12px var(--display);color:var(--muted);text-align:center}
.cd-band .mk{position:absolute;top:-4px;left:calc(var(--sc)*1%);width:4px;height:28px;margin-left:-2px;border-radius:4px;background:var(--ink);box-shadow:0 0 0 2px var(--raised)}
.cd-mat .tag{max-width:100%}
.cd-mat .tag .tv{white-space:normal}
.cd-photo{position:relative;display:grid;place-items:center;height:132px;border-radius:14px;background:repeating-linear-gradient(135deg,var(--sunken) 0 14px,color-mix(in srgb,var(--sunken) 70%,var(--raised)) 14px 28px);border:1px dashed var(--border);color:var(--muted);font-size:12.5px;font-weight:700;overflow:hidden}
.cd-photo span{display:inline-flex;gap:6px;align-items:center}
.cd-photo .ic{width:18px;height:18px}
.cd-life,.cd-shield,.cd-ring,.cd-head,.cd-stair,.cd-photo{display:none}
/* CD1 shield */
.cds-1 .cd-shield{display:grid;position:relative;width:74px;height:82px;flex:none;place-items:center}
.cd-shield svg{position:absolute;inset:0;width:100%;height:100%}
.cd-shield path{fill:var(--gt);stroke:var(--gc);stroke-width:3}
.cd-shield b{position:relative;font:800 42px/1 var(--display);color:var(--gc);letter-spacing:-.04em}
.cds-1 .cd-letter{display:none}
/* CD2 ring */
.cds-2 .cd-ring{display:grid;position:relative;width:84px;height:84px;flex:none}
.cd-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.cd-ring .tr{fill:none;stroke:var(--sunken);stroke-width:9}
.cd-ring .ar{fill:none;stroke:var(--gc);stroke-width:9;stroke-linecap:round;stroke-dasharray:calc(var(--sc)*1px) 200px;transition:stroke-dasharray .7s var(--ease)}
.cd-ring span{position:absolute;inset:0;display:grid;place-items:center;align-content:center;text-align:center;font:800 28px/1 var(--num)}
.cd-ring span small{display:block;font:800 12px var(--display);color:var(--gc)}
.cds-2 .cd-letter{display:none}
/* CD3 photo top */
.cds-3 .cd-photo{display:grid;margin:-16px -16px 0;border-radius:0;border:0;border-bottom:1px solid var(--line);height:150px}
.cds-3 .cd-photo .cd-letter{position:absolute;left:14px;bottom:14px;width:auto;height:auto;padding:6px 12px;border-radius:12px;font-size:22px;background:var(--gc);color:var(--raised);gap:8px;display:inline-flex;align-items:baseline}
.cds-3 .cd-photo .cd-letter small{font:800 13px var(--num);opacity:.9}
.cds-3 .cd-h .cd-letter{display:none}
/* CD4 grade header */
.cds-4 .cd-head{display:flex;align-items:center;gap:14px;margin:-16px -16px 0;padding:14px 16px;background:linear-gradient(120deg,var(--gc),color-mix(in srgb,var(--gc) 70%,#000));color:#fff}
.cd-head .L{font:800 54px/.9 var(--display);letter-spacing:-.04em}
.cd-head .T{flex:1;min-width:0}
.cd-head .T small{display:block;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;opacity:.9}
.cd-head .T b{font:800 20px var(--display)}
.cd-head .S{font:800 30px/1 var(--num);text-align:right}
.cd-head .S small{display:block;font:700 11px var(--body);opacity:.85}
.cds-4 .cd-h .cd-letter{display:none}
.cds-4 .cd-h{display:none}
.cds-4 .cd-head .T .m{display:block;font-size:12.5px;opacity:.9;margin-top:2px}
.cds-4 .cd-stair{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;align-items:end;height:60px}
.cd-stair span{display:grid;place-items:end center;padding-bottom:4px;border-radius:7px 7px 3px 3px;background:var(--sunken);font:800 13px var(--display);color:var(--muted);height:var(--h)}
.cd-stair span.on{background:var(--gc);color:var(--raised)}
.cds-4 .cd-scale{display:none}
/* CD5 lifespan */
.cds-5 .cd-life{display:grid;gap:6px}
.cd-life .lt{position:relative;height:36px}
.cd-life .ltr{position:absolute;left:0;right:0;top:14px;height:8px;border-radius:8px;background:var(--sunken)}
.cd-life .lwin{position:absolute;top:10px;height:16px;border-radius:6px;background:color-mix(in srgb,var(--warn) 30%,transparent);border:1.5px dashed var(--warn);left:calc(var(--a)*1%);width:calc((var(--b) - var(--a))*1%)}
.cd-life .lage{position:absolute;top:0;left:calc(var(--g)*1%);transform:translateX(-50%);display:grid;justify-items:center}
.cd-life .lage i{width:20px;height:20px;border-radius:50%;background:var(--gc);border:3px solid var(--raised);margin-top:8px}
.cd-life .lax{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);font-weight:600}
.cds-5 .cd-scale span{padding:3px 2px}
.cds-5 .cd-scale span small{display:none}
/* CD6 compact row */
.cds-6 .cdc{gap:10px;padding:12px 14px}
.cds-6 .cd-h .cd-letter{width:44px;height:44px;font-size:24px}
.cds-6 .cd-t b{font-size:16px}
.cds-6 .cd-scale{grid-template-columns:repeat(5,minmax(0,1fr));gap:3px}
.cds-6 .cd-scale span{padding:0;height:6px;border-radius:6px;font-size:0}
.cds-6 .cd-scale span small{display:none}
.cds-6 .cd-scale span.pre{background:color-mix(in srgb,var(--gc) 35%,var(--sunken))}
.cds-6 .cd-f li{font-size:13.5px}
.cds-6 .cd-mat .tag{font-size:12px}

/* ---------- RM room reveal ---------- */
.rmw{display:grid;gap:10px;min-width:0}
.rmw-t{display:flex;align-items:center;gap:10px;justify-content:space-between;flex-wrap:wrap}
.p3 .rmw-t{display:none}
.rms{position:relative;height:520px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--canvas);isolation:isolate}
.rms-bg{position:absolute;inset:0;padding:14px;display:grid;gap:10px;align-content:start;opacity:.55;pointer-events:none}
.rms-bg .bar{height:34px;border-radius:12px;background:var(--raised);border:1px solid var(--line)}
.rms-bg .row{display:grid;grid-template-columns:2fr 1fr;gap:10px}
.rms-bg .blk{height:150px;border-radius:14px;background:var(--raised);border:1px solid var(--line)}
.rmc{position:absolute;z-index:2;display:flex;flex-direction:column;background:var(--raised);border:1px solid var(--line);border-radius:20px;box-shadow:0 30px 60px -24px rgba(0,0,0,.6);overflow:hidden;min-width:0}
.rmph{position:relative;flex:none;height:170px;background:linear-gradient(160deg,color-mix(in srgb,var(--blue-tint) 70%,var(--sunken)),var(--sunken)),var(--sunken);overflow:hidden}
.rmph::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 16px,color-mix(in srgb,var(--raised) 35%,transparent) 16px 32px)}
.rmph-l{position:absolute;left:12px;top:10px;display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;background:color-mix(in srgb,var(--canvas) 70%,transparent);font:700 11.5px var(--body);color:var(--muted);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.rmph-l .ic{width:14px;height:14px}
.hs{position:absolute;left:calc(var(--x)*1%);top:calc(var(--y)*1%);z-index:2;transform:translate(-50%,-50%);display:grid;place-items:center;width:30px;height:30px;padding:0;border-radius:50%;border:2.5px solid #fff;background:var(--gc);color:#fff;font:800 13px var(--display);cursor:pointer;box-shadow:0 6px 14px -4px rgba(0,0,0,.5);transition:transform .2s var(--spring)}
.hs::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid var(--gc);opacity:0}
.hs.on::after{opacity:1;animation:hsring 1.6s ease-out infinite}
@keyframes hsring{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.hs .hl{display:none}
.hs:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media (hover:hover){.hs:hover{transform:translate(-50%,-50%) scale(1.12)}}
.rmc-b{display:grid;gap:10px;padding:14px;min-height:0;overflow:auto;align-content:start}
.rmc-hd{display:flex;align-items:center;gap:10px}
.rmc-hd .t{flex:1;min-width:0}
.rmc-hd small{display:block;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--pink)}
.rmc-hd b{display:block;font:800 22px/1.1 var(--display);letter-spacing:-.02em}
.rmc-hd span.s{font-size:13px;color:var(--muted)}
.rml{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.rml li{display:flex;align-items:center;gap:10px;padding:5px 8px;border-radius:12px;cursor:pointer;transition:background-color .2s;font-size:14px}
.rml li.on{background:var(--gt,var(--sunken));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--gc) 50%,transparent)}
@media (hover:hover){.rml li:hover{background:var(--sunken)}}
.rml .nm{flex:1;min-width:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rml .nm small{display:block;font-weight:500;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gbadge{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:8px;background:var(--gt);color:var(--gc);font:800 15px var(--display);border:1.5px solid color-mix(in srgb,var(--gc) 50%,transparent)}
.gbadge.none{--gc:var(--muted);--gt:var(--sunken);border-style:dashed}
.rml .num{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--sunken);font:800 12px var(--display);color:var(--muted);flex:none}
.rmg{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.rmg::-webkit-scrollbar{display:none}
.rmt{flex:none;display:grid;gap:4px;width:84px;font-size:11.5px;font-weight:700;color:var(--muted)}
.rmt i{position:relative;display:block;height:50px;border-radius:10px;background:repeating-linear-gradient(135deg,var(--sunken) 0 8px,color-mix(in srgb,var(--sunken) 60%,var(--raised)) 8px 16px);border:1.5px solid var(--line)}
.rmt i .gbadge{position:absolute;right:4px;bottom:4px;width:20px;height:20px;font-size:11px;border-radius:6px}
.rmt[data-r="cur"] i{border-color:var(--pink);box-shadow:0 0 0 3px rgba(var(--pk-rgb),.25)}
.rmt[data-r="cur"]{color:var(--ink)}
.rmt[data-r="next"] i{opacity:.5;border-style:dashed}
.rmt span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rm-re{position:absolute;right:12px;bottom:12px;z-index:3}
.rmc-a{display:flex;gap:8px;flex-wrap:wrap}
.rmc-sheet-grab{display:none}
.rmc.pop .hs{animation:hsin .45s var(--spring) backwards;animation-delay:calc(var(--i)*90ms + .35s)}
@keyframes hsin{from{transform:translate(-50%,-50%) scale(0)}}
/* RM1 slide-up sheet */
.rms-1 .rmc{left:0;right:0;bottom:0;top:54px;border-radius:24px 24px 0 0;border-bottom:0}
.rms-1 .rmc-sheet-grab{display:block;position:absolute;left:50%;top:8px;z-index:3;width:44px;height:5px;margin-left:-22px;border-radius:5px;background:rgba(255,255,255,.7)}
.rms-1 .rmc.pop{animation:rmup .55s var(--ease)}
@keyframes rmup{from{transform:translateY(100%)}}
.rms-1 .rmph{height:120px}
.rms-1 .rml .nm small{display:none}
.rms-5 .rml .nm small{display:none}
.rms-6 .rml li{padding:4px 10px}
.rms-1 .rmc-b{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:start}
.rms-1 .rmc-hd{grid-column:1/-1}
.rms-1 .rml{grid-row:2/4}
.rms-1 .rmg{grid-column:2;flex-wrap:wrap;align-content:start}
.rms-1 .rmg .rmt{width:calc(50% - 4px)}
.rms-1 .rmc-a{grid-column:2}
.rms-1 .rm-re{top:12px;bottom:auto}
/* RM2 split */
.rms-2 .rmc{left:14px;right:14px;top:50%;height:auto;max-height:calc(100% - 28px);transform:translateY(-50%);flex-direction:row}
.rms-2 .rmph{width:45%;height:auto;min-height:330px}
.rms-2 .rmc-b{flex:1}
.rms-2 .rmc.pop{animation:rmscale .45s var(--spring)}
@keyframes rmscale{from{transform:translateY(-50%) scale(.9);opacity:0}}
.rms-2 .rm-re{top:12px;bottom:auto}
/* RM3 full-bleed photo */
.rms-3 .rmc{inset:10px;border-radius:20px}
.rms-3 .rmph{position:absolute;inset:0;height:auto}
.rms-3 .rmc-b{position:absolute;left:10px;right:10px;bottom:10px;z-index:3;padding:12px;border-radius:16px;background:color-mix(in srgb,var(--raised) 86%,transparent);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border:1px solid var(--gl-bd)}
.rms-3 .rml{display:none}
.rms-3 .hs{width:auto;height:auto;padding:4px 9px 4px 4px;border-radius:999px;display:inline-flex;gap:6px;background:color-mix(in srgb,var(--raised) 92%,transparent);color:var(--ink);border:1.5px solid var(--gc)}
.rms-3 .hs .hn{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--gc);color:#fff;font-size:12px}
.rms-3 .hs .hl{display:inline;font:700 12px var(--body);white-space:nowrap}
.rms-3 .rmc.pop{animation:rmfade .5s var(--ease)}
@keyframes rmfade{from{opacity:0;transform:scale(1.04)}}
.rms-3 .rm-re{top:20px;right:20px;bottom:auto}
.rms-3 .rmc-a{display:none}
/* RM4 corner pop */
.rms-4 .rmc{right:14px;top:14px;width:min(330px,calc(100% - 28px));max-height:calc(100% - 28px)}
.rms-4 .rmph{height:118px}
.rms-4 .rml li:nth-child(n+4){display:none}
.rms-4 .rmc.pop{animation:rmcorner .5s var(--spring)}
@keyframes rmcorner{from{transform:translate(20px,-20px) scale(.85);opacity:0}}
.rms-4 .rmg .rmt{width:66px}
.rms-4 .rmg .rmt i{height:38px}
.rms-4 .rm-re{left:12px;right:auto}
/* RM5 room carousel */
.rms-5 .rmc{left:12%;right:12%;top:14px;bottom:52px}
.rms-5 .peek{position:absolute;top:44px;bottom:84px;width:13%;z-index:1;border-radius:16px;background:var(--raised);border:1px solid var(--line);overflow:hidden;opacity:.75}
.rms-5 .peek::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,var(--sunken) 0 10px,transparent 10px 20px)}
.rms-5 .peek span{position:absolute;bottom:10px;left:0;right:0;text-align:center;font:700 11px var(--body);color:var(--muted)}
.rms-5 .peek.l{left:-3%}.rms-5 .peek.r{right:-3%}
.rms-5 .rmph{height:130px}
.rms-5 .rmg{display:none}
.rms-5 .rmdots{display:flex}
.rmdots{display:none;position:absolute;left:0;right:0;bottom:22px;justify-content:center;gap:6px;z-index:2}
.rmdots i{width:8px;height:8px;border-radius:50%;background:var(--raised3)}
.rmdots i.on{width:22px;border-radius:8px;background:var(--pink)}
.rms-5 .rmc.pop{animation:rmslide .5s var(--ease)}
@keyframes rmslide{from{transform:translateX(60%);opacity:0}}
.peek{display:none}
.rms-5 .peek{display:block}
/* RM6 checklist first */
.rms-6 .rmc{left:14px;right:14px;top:14px;bottom:14px;flex-direction:column}
.rms-6 .rmph{position:absolute;right:14px;top:14px;width:132px;height:92px;border-radius:12px;z-index:3}
.rms-6 .rmph .rmph-l{display:none}
.rms-6 .hs{width:18px;height:18px;font-size:9px;border-width:1.5px}
.rms-6 .rmc-hd{padding-right:140px;min-height:92px;align-items:flex-start}
.rms-6 .rml li{padding:9px 10px;border:1px solid var(--line)}
.rms-6 .rmg{display:flex;flex-wrap:wrap}
.rms-6 .rmt{width:auto;display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;border-radius:999px;border:1px solid var(--line)}
.rms-6 .rmt i{width:22px;height:22px;border-radius:50%}
.rms-6 .rmt i .gbadge{display:none}
.rms-6 .rmc.pop{animation:rmfade .4s var(--ease)}

/* ---------- P3 composed ---------- */
.p3 .app-body{min-height:0}
.p3main{padding:24px;display:grid;gap:20px;min-width:0;align-content:start}
.p3main.ysamp{display:grid}
.p3g{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;align-items:start}
.p3col{display:grid;gap:20px;min-width:0;align-content:start}
.p3 .rms{height:540px}
.p3 .rm-re{display:none}
.p3 .ysamp .btn,.p3main .btn{padding-inline:18px}
.p3 .nav-i{border:0;background:none;width:100%;cursor:default;font:inherit;font-size:15px;text-align:left}
.p3 .nav-i:not(.on){font-weight:500}
.p3 .lnx{grid-template-columns:1fr}
.p3 .lnx-s{min-height:170px}
.p3-cel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}

@media (max-width:1100px){
  .p3g{grid-template-columns:1fr}
  .mpg2{grid-template-columns:1fr}
}
@media (max-width:900px){
  .p3main{padding:16px}
  .lock3 span{display:none}
  .fgrid{grid-template-columns:1fr}
  .p3-cel{grid-template-columns:1fr}
}
@media (max-width:700px){
  .chg{grid-template-columns:1fr}
  .lnx{grid-template-columns:1fr}
  .ttk{grid-template-columns:1fr}
  .rms-2 .rmc{flex-direction:column}
  .rms-2 .rmph{width:auto;min-height:130px}
  .sts-1 .stt small{display:none}
}
@media (prefers-reduced-motion:reduce){
  .msvg .m-halo{display:none}
}


/* ================= ROUND 4 (new rows; everything above is copied verbatim from STYLE-PICKER-3.html) ================= */
[data-sev="pink"]{--sv:var(--pink);--svt:var(--pink-tint);--svo:var(--pink-on);--svx:var(--pink)}
.lock4{display:inline-grid;grid-template-columns:auto auto;align-items:center;gap:0 8px;padding:3px 12px 3px 9px;border-radius:14px;background:var(--sunken);border:1px solid var(--line);flex:none;white-space:nowrap}
.lock4 .ic{grid-row:1/4;width:15px;height:15px;color:var(--good)}
.lock4 code{font:800 12px/1.12 var(--num);letter-spacing:.04em;color:var(--ink)}
.lock4 code em{font-style:normal;color:var(--muted);margin-right:4px}
.brand .bico{width:34px;height:34px;flex:none}
.brand .bico .mico{width:100%;height:100%;display:block}
.jump a.jx{border:1px dashed var(--border)}
.other{font-size:12px;color:var(--muted);white-space:nowrap;font-weight:600}
.other b{font:800 14px var(--num);color:var(--ink)}
#soundBtn[aria-pressed="true"]{border-color:var(--pink);color:var(--pink)}
.intro .intro-art{width:190px;height:190px;color:#fff;filter:drop-shadow(0 18px 24px rgba(0,0,0,.35))}
.intro .locks{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.intro .locks span{display:inline-flex;align-items:center;gap:8px;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.26);padding:5px 12px;border-radius:999px;font-weight:700;font-size:13px}
.intro .locks code{font-size:15px;background:none;padding:0}
.scl{position:relative;width:100%;overflow:hidden}
.scl-in{position:absolute;left:0;top:0;transform-origin:0 0}

/* ---------- MS mascot ---------- */
.msc{display:block;width:100%;height:100%;overflow:visible}
.mico{display:block}
.msw{display:grid;gap:14px;min-width:0}
.ms-hero{grid-template-columns:minmax(0,1fr) 150px;padding:22px 24px}
.ms-hero .hero-stats{margin-top:12px}
.ms-hero .hero-stats div{min-width:0}
.ms-hero .hero-stats b{font-size:28px}
.ms-art{width:150px;height:150px;color:#fff;filter:drop-shadow(0 14px 18px rgba(0,0,0,.28))}
.ms-art .msc{animation:msbob 3.2s ease-in-out infinite}
.ms-art.pop .msc{animation:mspop .6s var(--spring),msbob 3.2s ease-in-out .6s infinite}
@keyframes msbob{50%{transform:translateY(-5px)}}
@keyframes mspop{0%{transform:scale(.6) rotate(-8deg);opacity:0}60%{transform:scale(1.08)}100%{transform:none;opacity:1}}
.ms-poses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ms-pose{display:flex;align-items:center;gap:10px;padding:7px 12px 7px 7px;border-radius:14px;border:1.5px solid var(--line);background:var(--raised);color:var(--ink);font:700 14px var(--body);cursor:pointer;min-width:0;transition:border-color .2s,background-color .2s,transform .16s var(--ease);-webkit-tap-highlight-color:transparent}
.ms-pose .ms-pa{width:50px;height:50px;border-radius:12px;background:var(--hero);color:#fff;padding:3px;flex:none}
.ms-pose[aria-pressed="true"]{border-color:var(--pink);background:var(--pink-tint)}
@media (hover:hover){.ms-pose:hover{transform:translateY(-1px)}}
.ms-pose:active{transform:scale(.97)}
.ms-pose:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.ms-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ms-cell{display:grid;gap:6px;align-content:start;min-width:0}
.ms-home{display:grid;gap:8px}
.ms-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:14px 10px 10px;border-radius:16px;background:radial-gradient(circle at 20% 10%,rgba(255,110,170,.45),transparent 50%),radial-gradient(circle at 90% 90%,rgba(120,169,255,.45),transparent 55%),#161B2E}
.ms-app{display:grid;justify-items:center;gap:5px;min-width:0}
.ms-app .mico,.ms-app i{width:48px;height:48px;border-radius:11px;box-shadow:0 6px 14px -6px rgba(0,0,0,.6)}
.ms-app i{background:rgba(255,255,255,.14)}
.ms-app small{font:600 10.5px var(--body);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ms-app.ghost small{opacity:.6}
.ms-tab{display:flex;align-items:flex-end;gap:10px;padding:7px 8px 0;border-radius:12px;background:var(--sunken);border:1px solid var(--line);flex-wrap:wrap}
.ms-tabi{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;background:var(--raised);border-radius:10px 10px 0 0;font:600 12px var(--body);min-width:0;white-space:nowrap}
.ms-tabi .ic{width:12px;height:12px;color:var(--muted)}
.ms-fav{width:16px;height:16px;flex:none}
.ms-fav .mico,.ms-favs .mico{width:100%;height:100%}
.ms-favs{display:inline-flex;align-items:center;gap:8px;margin:0 0 7px auto}
.ms-favs .f32{width:32px;height:32px}
.ms-favs .f16{width:16px;height:16px}
.ms-favs small{font-size:11px;color:var(--muted);font-weight:600}
.ms-side{background:var(--side-bg);border:1px solid var(--line);border-radius:14px;padding:10px;display:grid;gap:2px}
.ms-logo{display:flex;align-items:center;gap:10px;padding:2px 6px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;min-width:0}
.ms-lg{width:36px;height:36px;flex:none}
.ms-lg .mico,.ms-lg .msc{width:100%;height:100%}
.ms-wm{font:800 16px/1.1 var(--display);letter-spacing:-.02em;min-width:0}
.ms-wm small{display:block;font:600 11px var(--body);color:var(--muted);letter-spacing:.02em}
.ms-nav{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:10px;color:var(--muted);font-size:13.5px}
.ms-nav .ic{width:17px;height:17px}
.ms-nav.on{background:var(--raised);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--pink)}
.ms-logo.sm{border:0;border-top:1px solid var(--line);margin:4px 0 0;padding:10px 6px 2px}
.ms-logo.sm .ms-lg{width:30px;height:30px;color:var(--pink)}
.ms-logo.sm .ms-wm{font:600 12px var(--body);color:var(--muted)}
.ms-empty .empty{min-height:0;padding:12px 12px 16px;gap:6px}
.ms-e-art{width:88px;height:88px;color:var(--muted)}
.ms-empty .em-p{font-size:13px}
.mld{display:grid;justify-items:center;align-content:center;gap:12px;padding:18px 12px 20px;text-align:center;min-height:190px}
.mld p{margin:0;font-size:13px;color:var(--muted);font-weight:600}
.mld-art{position:relative;width:96px;height:96px;color:var(--pink)}
.mld-art .msc{position:relative;z-index:1}
.mld-ring{position:absolute;left:50%;bottom:-2px;width:64px;height:14px;margin-left:-32px;border-radius:50%;border:2px solid var(--blue);opacity:0}
.mld .m-tail,.mld .m-head,.mld .m-wing,.mld .m-bulb,.mld .m-wrench path,.mld .m-letters,.mld .m-wave,.mld .m-spk,.mld .m-drip,.mld .m-scan circle{transform-box:fill-box}
.mld-1 .msc{transform-origin:50% 100%;animation:dripB 1.1s cubic-bezier(.45,0,.55,1) infinite}
@keyframes dripB{0%,100%{transform:translateY(0) scale(1.07,.9)}14%{transform:translateY(-2px) scale(.96,1.05)}50%{transform:translateY(-18px)}86%{transform:translateY(-2px)}}
.mld-1 .mld-ring{animation:ripple 1.1s ease-out infinite}
@keyframes ripple{0%{opacity:.8;transform:scale(.45)}45%{opacity:0;transform:scale(1.5)}100%{opacity:0}}
.mld-2 .m-tail{transform-origin:10% 95%;animation:wag .45s ease-in-out infinite alternate}
@keyframes wag{from{transform:rotate(-12deg)}to{transform:rotate(10deg)}}
.mld-2 .m-head{transform-origin:50% 95%;animation:tilt 1.3s ease-in-out infinite alternate}
@keyframes tilt{from{transform:rotate(-5deg)}to{transform:rotate(5deg)}}
.mld-3 .msc{animation:hov 1s ease-in-out infinite alternate}
@keyframes hov{to{transform:translateY(-7px)}}
.mld-3 .m-wing{transform-origin:70% 100%;animation:flap .2s ease-in-out infinite alternate}
@keyframes flap{to{transform:scaleY(.35) rotate(8deg)}}
.mld-4 .m-scan circle{animation:scan 1s ease-in-out infinite}
.mld-4 .m-scan circle:nth-child(2){animation-delay:.15s}.mld-4 .m-scan circle:nth-child(3){animation-delay:.3s}
@keyframes scan{0%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.mld-4 .m-bulb{animation:blink 1s steps(2,jump-none) infinite}
@keyframes blink{50%{opacity:.25}}
.mld-5 .m-wrench path{transform-origin:50% 50%;animation:spin 1.1s linear infinite}
.mld-6 .m-letters{stroke-dasharray:100;animation:draw 1.9s ease-in-out infinite}
@keyframes draw{0%{stroke-dashoffset:100}50%{stroke-dashoffset:0}100%{stroke-dashoffset:-100}}
.mld-7 .m-needle{animation:needle 1.1s ease-in-out infinite alternate}
@keyframes needle{from{transform:rotate(-110deg)}to{transform:rotate(60deg)}}
.mld-7 .m-wave{animation:wave 1.4s linear infinite}
@keyframes wave{to{transform:translateX(-60px)}}
.mld-8 .m-wr{animation:turn .6s ease-in-out infinite alternate}
@keyframes turn{from{transform:rotate(-22deg)}to{transform:rotate(22deg)}}
.mld-9 .m-spk{animation:spk 1.3s cubic-bezier(.6,0,.4,1) infinite}
@keyframes spk{0%{transform:rotate(0) scale(1)}50%{transform:rotate(45deg) scale(.82)}100%{transform:rotate(90deg) scale(1)}}
.mld-10 .m-drip{animation:dripfall 1.2s ease-in infinite}
@keyframes dripfall{0%{transform:translateY(-6px);opacity:0}20%{opacity:1;transform:translateY(0)}100%{transform:translateY(46px);opacity:0}}

/* ---------- NB badges ---------- */
.nbw{display:grid;min-width:0}
.nbw .try{margin-top:12px}
.nb-top{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:16px 16px 0 0;background:var(--app-top);border:1px solid var(--line);border-bottom:0;min-width:0}
.nb-logo{width:30px;height:30px;flex:none}
.nb-logo .mico{width:100%;height:100%}
.nb-name{font:800 15px var(--display);white-space:nowrap}
.nb-btn{position:relative;width:42px;height:42px;flex:none;border-radius:12px;border:1px solid var(--line);background:var(--raised);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .16s var(--ease)}
.nb-btn .ic{width:20px;height:20px;transform-origin:50% 10%}
.nb-btn:active{transform:scale(.94)}
.nb-btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.va-s{--vbg:var(--app-top);display:inline-flex}
.nb-body{display:grid;grid-template-columns:170px minmax(0,1fr);border:1px solid var(--line);border-radius:0 0 16px 16px;overflow:hidden;min-width:0}
.nb-nav{background:var(--side-bg);border-right:1px solid var(--line);padding:10px 8px;display:grid;gap:2px;align-content:start}
.nb-ni{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;color:var(--muted);font:500 13.5px var(--body);min-width:0}
.nb-ni>span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nb-ni .ic{width:17px;height:17px}
.nb-ni.on{background:var(--raised);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--pink)}
.nb-c{font-style:normal;flex:none;display:inline-grid;place-items:center}
.nb-panel{background:var(--surface);min-width:0}
.nb-ph{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.nb-ph>b{font:700 15px var(--display);flex:1}
.nb-cnt{font-size:12.5px;color:var(--muted);font-weight:600}
.nb-cnt b{font:800 16px var(--num);color:var(--ink)}
.nb-list{list-style:none;margin:0;padding:6px;display:grid;gap:2px}
.nb-grp{display:none;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:8px 8px 3px}
.nb-it{position:relative;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;min-width:0;transition:background-color .3s}
.nb-ic{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--svt);color:var(--svx);flex:none}
.nb-ic .ic{width:17px;height:17px}
.nb-tx{flex:1;min-width:0}
.nb-tx b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nb-tx small{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nb-it time{font-size:12px;color:var(--muted);font-weight:600;flex:none}
.nb-ud{display:none;width:8px;height:8px;border-radius:50%;background:var(--blue);flex:none}
.nb-it.un .nb-ud{display:block}
.nb-it:not(.un) .nb-tx b{font-weight:600;color:var(--muted)}
.nb-in{animation:nbin .5s var(--spring)}
@keyframes nbin{from{opacity:0;transform:translateY(-10px) scale(.97)}}
.nb-b{position:absolute;top:-7px;right:-7px;pointer-events:none;display:flex}
.nb-b>span{display:none}
.nb-b[data-n="0"]{display:none}
.nb-bn,.nb-bu{place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;font:800 11.5px/1 var(--body)}
@keyframes nbpulse{0%{transform:scale(1)}30%{transform:scale(1.35)}60%{transform:scale(.92)}100%{transform:scale(1)}}
@keyframes wiggle{0%,100%{transform:rotate(0)}20%{transform:rotate(16deg)}40%{transform:rotate(-13deg)}60%{transform:rotate(8deg)}80%{transform:rotate(-4deg)}}
@keyframes ringout{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(2.2)}}
/* NB1 classic */
.nbs-1 .nb-bn{display:grid;background:var(--bad);color:#fff;box-shadow:0 0 0 2px var(--app-top)}
.nbs-1 .nb-b.ping .nb-bn{animation:nbpulse .5s var(--ease)}
.nbs-1 .nb-c{min-width:22px;padding:2px 7px;border-radius:999px;background:var(--bad);color:#fff;font:800 11.5px var(--body)}
.nbs-1 .nb-c.new{background:var(--blue);color:var(--blue-on)}
.nbs-1 .nb-c.dot{min-width:0;width:8px;height:8px;padding:0}
/* NB2 brand pink */
.nbs-2 .nb-bn{display:grid;background:var(--pink);color:var(--pink-on);box-shadow:0 0 0 3px var(--app-top),0 6px 12px -4px rgba(var(--pk-rgb),.8)}
.nbs-2 .nb-b.ping .nb-bn{animation:nbpulse .5s var(--ease)}
.nbs-2 .nb-c{padding:2px 9px;border-radius:999px;background:var(--pink-tint);color:var(--pink);font:800 12px var(--body)}
.nbs-2 .nb-c.dot{width:8px;height:8px;padding:0;background:var(--pink)}
.nbs-2 .nb-it.un{background:linear-gradient(90deg,var(--pink-tint),transparent 75%);box-shadow:inset 3px 0 0 var(--pink)}
.nbs-2 .nb-ud{background:var(--pink)}
/* NB3 dot only */
.nbs-3 .nb-b{top:7px;right:8px}
.nbs-3 .nb-b::before{content:"";display:block;width:10px;height:10px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 2.5px var(--raised)}
.nbs-3 .nb-b.ping::before{animation:nbpulse .5s var(--ease)}
.nbs-3 .nb-c{color:var(--muted);font:800 16px var(--num);letter-spacing:.02em}
.nbs-3 .nb-c.new{color:var(--pink);font:800 10.5px var(--body);letter-spacing:.08em;text-transform:uppercase}
.nbs-3 .nb-c.dot{width:7px;height:7px;border-radius:50%;background:var(--pink)}
.nbs-3 .nb-ud{background:var(--pink);width:7px;height:7px}
/* NB4 ring pulse */
.nbs-4 .nb-b{top:-8px;right:-8px}
.nbs-4 .nb-bn{display:grid;position:relative;background:var(--pink-deep);color:#fff;border:2px solid var(--app-top);min-width:22px;height:22px}
.nbs-4 .nb-b::after{content:"";position:absolute;inset:0;border-radius:999px;border:2px solid var(--pink);opacity:0}
.nbs-4 .nb-b.ping::after{animation:ringout .9s var(--ease) 2}
.nbs-4 .nb-b.ping .nb-bn{animation:nbpulse .5s var(--ease)}
.nbs-4 .nb-bell.ping .ic{animation:wiggle .7s var(--ease)}
.nbs-4 .nb-c{padding:1px 8px;border-radius:999px;border:1.5px solid var(--pink);color:var(--pink);font:800 11.5px var(--body)}
.nbs-4 .nb-c.dot{width:8px;height:8px;padding:0;border:0;background:var(--pink)}
.nbs-4 .nb-ud{background:var(--pink);box-shadow:0 0 0 3px rgba(var(--pk-rgb),.2)}
.nbs-4 .nb-c.ping{animation:nbpulse .5s var(--ease)}
/* NB5 split by urgency */
.nbs-5 .nb-b{gap:0;top:-8px;right:-12px}
.nbs-5 .nb-bu{display:grid;background:var(--bad);color:#fff;border-radius:999px 0 0 999px;box-shadow:0 0 0 2px var(--app-top);min-width:18px;padding:0 5px}
.nbs-5 .nb-bn{display:grid;background:var(--blue-deep);color:#fff;border-radius:0 999px 999px 0;box-shadow:0 0 0 2px var(--app-top);min-width:18px;padding:0 5px}
.nbs-5 .nbw[data-urg="0"] .nb-bu{display:none}
.nbs-5 .nbw[data-urg="0"] .nb-bn{border-radius:999px}
.nbs-5 .nb-b.inb .nb-bu{display:none}
.nbs-5 .nb-b.inb .nb-bn{border-radius:999px}
.nbs-5 .nb-b.ping .nb-bn{animation:nbpulse .5s var(--ease)}
.nbs-5 .nb-c{padding:2px 8px;border-radius:999px;background:var(--blue-tint);color:var(--blue);font:800 11.5px var(--body)}
.nbs-5 .nb-c.urg{background:var(--bad);color:#fff}
.nbs-5 .nb-c.dot{width:8px;height:8px;padding:0;background:var(--blue)}
.nbs-5 .nb-grp{display:block}
.nbs-5 .nb-it.urg.un{background:var(--bad-tint)}
/* NB6 count chip */
.nbs-6 .nb-bell{width:auto;padding:0 12px 0 11px;grid-auto-flow:column;gap:8px}
.nbs-6 .nb-b{position:static}
.nbs-6 .nb-bx{display:inline-block;font:800 12.5px var(--body);color:var(--pink);white-space:nowrap}
.nbs-6 .nb-b.inb{position:absolute;top:6px;right:7px}
.nbs-6 .nb-b.inb .nb-bx{display:none}
.nbs-6 .nb-b.inb::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pink)}
.nbs-6 .nb-b.ping .nb-bx{animation:nbpulse .5s var(--ease)}
.nbs-6 .nb-c{font:800 18px var(--num);color:var(--pink);letter-spacing:.02em}
.nbs-6 .nb-c.new{font:800 10.5px var(--body);letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:6px;background:var(--pink);color:var(--pink-on)}
.nbs-6 .nb-c.dot{width:8px;height:8px;border-radius:50%;background:var(--pink)}
.nbs-6 .nb-ud{background:var(--pink)}
.nbs-6 .nb-it.un .nb-tx b::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--pink);margin-right:6px;vertical-align:2px}
.nbs-6 .nb-it.un .nb-ud{display:none}

/* ---------- CE celebrations ---------- */
.cew{display:grid;gap:12px;min-width:0}
.ce-stage{position:relative;height:330px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--canvas);isolation:isolate}
.ce-bg{padding:14px;display:grid;gap:8px}
.ce-bgh{display:flex;align-items:baseline;gap:10px}
.ce-bgh b{font:800 20px var(--display)}
.ce-bgh span{color:var(--muted);font-size:13px;font-weight:600}
.ce-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:var(--raised);border:1px solid var(--line);min-width:0;--vbg:var(--raised)}
.ce-row>span:nth-child(2){flex:1;min-width:0}
.ce-row b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ce-row small{display:block;color:var(--muted);font-size:12.5px}
.ce-row .num{font-size:22px}
.ce-acts{display:flex;gap:8px;flex-wrap:wrap}
.ce-layer{position:absolute;inset:0;display:none;place-items:center;z-index:5;pointer-events:none}
.ce-layer.on{display:grid}
.ce-layer.out{opacity:0;transition:opacity .4s var(--ease)}
.ce-card{position:relative;z-index:2;display:grid;justify-items:center;gap:4px;padding:18px 26px;border-radius:22px;background:var(--raised);border:1px solid var(--line);box-shadow:0 30px 60px -20px rgba(0,0,0,.6);text-align:center;max-width:calc(100% - 32px)}
.ce-card small{font:800 12px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}
.ce-big{font:800 64px/.95 var(--num);letter-spacing:.01em;font-variant-numeric:tabular-nums}
.ce-sub{font-size:13.5px;color:var(--muted);font-weight:600}
.ce-ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--hero);color:#fff;flex:none}
.ce-ic .ic{width:22px;height:22px}
.ce-layer.on .ce-card{animation:cepop .55s var(--spring)}
@keyframes cepop{0%{opacity:0;transform:scale(.7)}100%{opacity:1;transform:none}}
.ce-1{background:rgba(6,8,14,.35)}
:root[data-theme="light"] .ce-1,:root[data-theme="light"] .ce-2{background:rgba(16,21,34,.14)}
.ce-conf{position:absolute;inset:0;overflow:hidden;z-index:3}
.ce-conf i{position:absolute;top:-18px;left:var(--x);width:var(--s);height:calc(var(--s)*1.6);background:var(--c);border-radius:2px;opacity:0;animation:cfall 2.3s var(--d) cubic-bezier(.3,.6,.5,1) forwards}
@keyframes cfall{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:1;transform:translate(var(--dx),360px) rotate(calc(var(--r) + 540deg))}}
.ce-2{background:rgba(6,8,14,.3)}
.ce-rings i{position:absolute;left:50%;top:50%;width:130px;height:130px;margin:-65px 0 0 -65px;border-radius:50%;border:3px solid var(--pink);opacity:0;animation:cring 1.3s var(--ease) forwards}
.ce-rings i:nth-child(2){border-color:var(--blue);animation-delay:.15s}
.ce-rings i:nth-child(3){border-color:var(--pink);border-width:2px;animation-delay:.3s}
@keyframes cring{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(3.4)}}
.ce-flip{perspective:900px;width:min(340px,86%);height:200px}
.ce-fi{position:relative;width:100%;height:100%;transform-style:preserve-3d;animation:cflip 1.1s .5s var(--ease) forwards}
.ce-front,.ce-back{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:22px}
.ce-front{background:var(--raised);border:1px solid var(--line);display:grid;justify-items:center;align-content:center;gap:8px;text-align:center;padding:16px;box-shadow:0 24px 50px -24px rgba(0,0,0,.6)}
.ce-front b{font-size:15px}
.ce-front small{color:var(--muted);font-size:12.5px;font-weight:600}
.ce-back{transform:rotateY(180deg)}
.ce-back .ce-card{width:100%;height:100%;max-width:none;background:var(--hero);color:#fff;border:0;align-content:center;animation:none!important}
.ce-back .ce-card small,.ce-back .ce-sub{color:rgba(255,255,255,.92)}
.ce-back .ce-ic{background:rgba(255,255,255,.2)}
@keyframes cflip{to{transform:rotateY(180deg)}}
.ce-masc{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:center;padding:0 12px}
.ce-m{width:160px;height:160px;flex:none;color:var(--pink);animation:mjump .75s var(--spring) both}
@keyframes mjump{0%{transform:translateY(110%)}100%{transform:translateY(10%)}}
.ce-bub{margin-bottom:110px;padding:12px 16px;border-radius:18px 18px 4px 18px;background:var(--raised);border:1px solid var(--line);box-shadow:0 18px 36px -16px rgba(0,0,0,.55);font-size:15px;font-weight:600;animation:cepop .5s .35s var(--spring) both;min-width:0}
.ce-bub b{display:block;color:var(--pink);font:800 12px var(--body);letter-spacing:.1em;text-transform:uppercase}
.ce-5{place-items:start center;padding-top:14px}
.ce-toast{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;padding:7px 18px 7px 7px;border-radius:999px;background:var(--ink);color:var(--canvas);font-size:14px;box-shadow:0 18px 36px -14px rgba(0,0,0,.6);animation:tdrop .5s var(--spring);max-width:calc(100% - 24px)}
.ce-toast .ce-ic{width:32px;height:32px;border-radius:50%}
.ce-toast .ce-ic .ic{width:17px;height:17px}
.ce-sh{position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);transform:translateX(-100%);animation:shine 1.2s .35s ease-in-out}
@keyframes tdrop{from{transform:translateY(-70px)}}
@keyframes shine{to{transform:translateX(100%)}}
.ce-6{background:var(--hero);animation:flood .5s var(--ease)}
@keyframes flood{from{clip-path:circle(0% at 50% 100%)}to{clip-path:circle(150% at 50% 100%)}}
.ce-take{display:grid;justify-items:center;text-align:center;color:#fff;gap:2px;position:relative;z-index:2}
.ce-take small{font:800 13px var(--body);letter-spacing:.14em;text-transform:uppercase;opacity:.9}
.ce-take .ce-big{font-size:clamp(64px,9vw,112px);animation:cepop .6s .15s var(--spring) both;text-shadow:0 10px 30px rgba(0,0,0,.25)}
.ce-take span{font-weight:600;opacity:.92}
.ce-tm{position:absolute;right:-6px;bottom:-26px;width:130px;height:130px;color:#fff;transform:rotate(-8deg);animation:mjump .7s .2s var(--spring) both}

/* ---------- AC achievements ---------- */
.acw{display:grid;gap:14px;padding:16px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.acw-h{display:flex;align-items:center;gap:12px;--vbg:var(--raised)}
.acw-h b{display:block;font:700 17px var(--display)}
.acw-h small{color:var(--muted);font-size:13px}
.acr-w{display:flex;align-items:center;gap:16px;padding:12px 14px;border-radius:16px;background:var(--sunken);border:1px solid var(--line);min-width:0}
.acr{position:relative;width:78px;height:86px;flex:none;display:grid;place-items:center;--c1:#FF6EAA;--c2:#A3175A}
.acr-sh{position:absolute;inset:0}
.acr-l{position:relative;z-index:1;font:800 26px var(--display);color:#fff;letter-spacing:-.02em;text-shadow:0 2px 6px rgba(0,0,0,.25)}
.acr-st{display:none}
.acr-t{flex:1;min-width:0;display:grid;gap:3px}
.acr-t small{font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.acr-t>b{font:800 20px var(--display);letter-spacing:-.02em}
.acr-xp{font-size:13px;color:var(--muted);font-weight:600}
.acr-xp b{font-size:17px;color:var(--ink)}
.acr-bar{height:8px;border-radius:8px;background:var(--raised3);overflow:hidden;margin-top:2px}
.acr-bar i{display:block;height:100%;background:var(--hero);border-radius:inherit}
.acr-lad{display:flex;gap:4px;margin-top:4px}
.acr-lad i{flex:1;height:5px;border-radius:5px;background:var(--raised3)}
.acr-lad i.d{background:color-mix(in srgb,var(--pink) 55%,transparent)}
.acr-lad i.c{background:var(--pink);box-shadow:0 0 0 2px rgba(var(--pk-rgb),.3)}
.acg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.acb{position:relative;display:grid;justify-items:center;align-content:start;gap:4px;padding:14px 6px 10px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);text-align:center;cursor:pointer;font:inherit;min-width:0;transition:transform .18s var(--ease),border-color .2s;-webkit-tap-highlight-color:transparent}
.acb>b{font-size:13.5px;margin-top:4px}
.acb>small{font-size:12px;color:var(--muted);font-weight:600}
@media (hover:hover){.acb:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--pink) 50%,var(--line))}}
.acb:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.acb-art{position:relative;width:64px;height:64px;display:grid;place-items:center;--c1:#FF6EAA;--c2:#A3175A}
.acb-art[data-c="blue"]{--c1:#9CC1FF;--c2:#0F499E}
.acb-art[data-c="gold"]{--c1:#FFE08A;--c2:#B8871A}
.acb-sh{position:absolute;inset:0}
.acb-i{position:relative;z-index:1;color:#fff;display:grid;place-items:center}
.acb-i .ic{width:26px;height:26px;stroke-width:2.2;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.acb.lock .acb-sh,.acb.lock .acb-i{filter:grayscale(1);opacity:.42}
.acb-ring{display:none;position:absolute;inset:-5px;width:calc(100% + 10px);height:calc(100% + 10px);transform:rotate(-90deg)}
.acb-ring .t{fill:none;stroke:var(--raised3);stroke-width:4}
.acb-ring .a{fill:none;stroke:var(--pink);stroke-width:4;stroke-linecap:round}
.acb-tip{position:absolute;left:50%;bottom:calc(100% - 6px);z-index:6;transform:translate(-50%,6px);width:max-content;max-width:200px;padding:8px 11px;border-radius:10px;background:var(--ink);color:var(--canvas);font:600 12px/1.35 var(--body);text-align:left;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s var(--ease),transform .2s var(--ease),visibility 0s linear .2s;box-shadow:0 14px 30px -12px rgba(0,0,0,.6)}
.acb-tip b{display:block;font-size:13px}
.acb.open .acb-tip{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .16s var(--ease),transform .2s var(--ease),visibility 0s}
@media (hover:hover){.acb:hover .acb-tip{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .16s var(--ease) .1s,transform .2s var(--ease) .1s,visibility 0s .1s}}
/* AC1 hex */
.acs-1 .acb-sh,.acs-1 .acr-sh{clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);background:linear-gradient(160deg,var(--c1),var(--c2))}
.acs-1 .acb-sh::after,.acs-1 .acr-sh::after{content:"";position:absolute;inset:6px;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);background:linear-gradient(160deg,var(--c2),color-mix(in srgb,var(--c1) 80%,var(--c2)))}
/* AC2 enamel pins */
.acs-2 .acb-sh,.acs-2 .acr-sh{border-radius:50%;background:radial-gradient(circle at 50% 50%,var(--c2) 0 50%,color-mix(in srgb,var(--c2) 70%,#000) 51% 55%,#F1F4F8 56% 63%,#8C98AA 64% 100%);box-shadow:0 6px 12px -6px rgba(0,0,0,.6)}
.acs-2 .acb-sh::after,.acs-2 .acr-sh::after{content:"";position:absolute;left:22%;right:22%;top:12%;height:22%;border-radius:50%;background:linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,0))}
.acs-2 .acr{width:84px;height:84px}
/* AC3 crests */
.acs-3 .acb-sh,.acs-3 .acr-sh{clip-path:polygon(50% 0,97% 11%,97% 48%,90% 70%,73% 88%,50% 100%,27% 88%,10% 70%,3% 48%,3% 11%);background:linear-gradient(180deg,var(--c1),var(--c2))}
.acs-3 .acb-sh::after,.acs-3 .acr-sh::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.18) 100%)}
.acs-3 .acb-i{margin-top:-10px}
.acs-3 .acb-art::after,.acs-3 .acr::after{content:"";position:absolute;left:-8px;right:-8px;bottom:9px;height:14px;z-index:2;background:linear-gradient(180deg,#3A4560,#1B2233);clip-path:polygon(0 0,100% 0,93% 50%,100% 100%,0 100%,7% 50%)}
.acs-3 .acr-l{margin-top:-14px}
/* AC4 progress tiles */
.acs-4 .acb-sh,.acs-4 .acr-sh{border-radius:22%;background:linear-gradient(145deg,var(--c1),var(--c2));box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 16px -8px rgba(0,0,0,.5)}
.acs-4 .acb-ring{display:block}
.acs-4 .acb:not(.lock) .acb-art::after{content:"";position:absolute;right:-6px;top:-6px;z-index:2;width:20px;height:20px;border-radius:50%;background:var(--good) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/13px no-repeat;border:2px solid var(--surface)}
.acs-4 .acr{width:80px;height:80px}
/* AC5 stripes + star medallions */
.acs-5 .acb-sh{clip-path:polygon(50% 0,61% 15%,79% 9%,80% 28%,98% 35%,87% 50%,98% 65%,80% 72%,79% 91%,61% 85%,50% 100%,39% 85%,21% 91%,20% 72%,2% 65%,13% 50%,2% 35%,20% 28%,21% 9%,39% 15%);background:linear-gradient(160deg,var(--c1),var(--c2))}
.acs-5 .acr-sh,.acs-5 .acr-l{display:none}
.acs-5 .acr-st{display:grid;gap:3px;justify-items:center}
.acs-5 .acr-st i{width:66px;height:20px;background:linear-gradient(180deg,#FF7AB3,#C21F6A);clip-path:polygon(0 0,50% 58%,100% 0,100% 42%,50% 100%,0 42%)}
.acs-5 .acr-st i:last-child{background:linear-gradient(180deg,#9CC1FF,#1769E0)}
/* AC6 holo cards */
.acs-6 .acb-art{width:54px;height:70px}
.acs-6 .acb-sh,.acs-6 .acr-sh{border-radius:10px;overflow:hidden;background:linear-gradient(150deg,var(--c1),var(--c2));box-shadow:inset 0 0 0 2px rgba(255,255,255,.35),0 10px 18px -10px rgba(0,0,0,.6)}
.acs-6 .acb-sh::after,.acs-6 .acr-sh::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.55) 42%,rgba(120,169,255,.55) 50%,rgba(255,110,170,.5) 58%,transparent 75%);background-size:260% 100%;animation:holo 3.6s linear infinite;mix-blend-mode:screen}
@keyframes holo{from{background-position:130% 0}to{background-position:-130% 0}}
.acs-6 .acr{width:66px;height:88px}

/* ---------- AI accent intensity ---------- */
.aim{display:grid;grid-template-columns:128px minmax(0,1fr);border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--canvas);min-width:0;--aw:var(--canvas)}
.aim-side{background:var(--side-bg);border-right:1px solid var(--line);padding:10px 8px;display:grid;gap:2px;align-content:start}
.aim-lg{width:30px;height:30px;margin:2px 6px 8px}
.aim-lg .mico{width:100%;height:100%}
.aim-ni{display:flex;align-items:center;gap:8px;padding:8px;border-radius:10px;color:var(--muted);font:500 13px var(--body);transition:background-color .3s,color .3s}
.aim-ni .ic{width:16px;height:16px}
.aim-ni.on{background:var(--raised);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--pink)}
.aim-main{padding:14px;display:grid;gap:12px;min-width:0;background:var(--aw)}
.aim-h{position:relative;overflow:hidden;display:grid;gap:3px;padding:14px 16px;border-radius:16px;background:var(--raised);border:1px solid var(--line)}
.aim-e{font:700 11px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.aim-h>b{font:800 20px/1.15 var(--display);letter-spacing:-.02em}
.aim-hs{display:flex;gap:14px;font-size:13px;color:var(--muted);font-weight:600;flex-wrap:wrap}
.aim-hs b{font-size:20px;color:var(--ink);margin-right:3px}
.aim-tabs{display:flex;gap:16px;border-bottom:1px solid var(--line)}
.aim-tabs span{position:relative;padding:4px 2px 8px;font:700 13.5px var(--body);color:var(--muted)}
.aim-tabs span.on{color:var(--ink)}
.aim-tabs span.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:3px;background:var(--pink)}
.aim-k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.aim-kp{padding:10px 12px;border-radius:14px;background:var(--raised);border:1px solid var(--line);display:grid;gap:2px;min-width:0}
.aim-kp small{font-size:12px;color:var(--muted);font-weight:600}
.aim-kp b{font-size:28px;line-height:1}
.aim-chart{display:flex;align-items:flex-end;gap:6px;height:54px;padding:0 2px}
.aim-chart i{flex:1;height:var(--h);border-radius:5px 5px 2px 2px;background:color-mix(in srgb,var(--blue) 38%,transparent)}
.aim-chart i.last{background:var(--blue)}
.aim-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.aim-list li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--raised);border:1px solid var(--line);min-width:0;--vbg:var(--raised)}
.aim-list li>span:nth-child(2){flex:1;min-width:0}
.aim-list li>span b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aim-list li>span small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aim-list .num{font-size:19px}
.aim-list .tag{font-size:12px;padding:4px 9px 4px 7px}
.aim-a{display:flex;gap:8px;flex-wrap:wrap}
.ais-1 .aim .tag{--c:var(--muted);--ct:var(--sunken)}
.ais-1 .aim .tag[data-k="good"]{--c:var(--good);--ct:var(--good-tint)}
.ais-2 .aim-h{background:linear-gradient(90deg,var(--pink-tint),var(--raised) 65%);box-shadow:inset 4px 0 0 var(--pink)}
.ais-2 .aim-e{color:var(--pink)}
.ais-2 .aim-kp.hot b{color:var(--pink)}
.ais-2 .aim-chart i.last{background:var(--pink)}
.ais-3 .aim-h{background:var(--hero);color:#fff;border-color:transparent;box-shadow:0 18px 36px -22px rgba(var(--pk-rgb),.9)}
.ais-3 .aim-e,.ais-3 .aim-hs{color:rgba(255,255,255,.86)}
.ais-3 .aim-hs b{color:#fff}
.ais-3 .aim-kp b,.ais-3 .aim-list .num{color:var(--pink)}
.ais-3 .aim-kp,.ais-3 .aim-list li{border:1px solid transparent;background:linear-gradient(var(--raised),var(--raised)) padding-box,linear-gradient(135deg,var(--pink),color-mix(in srgb,var(--pink) 30%,var(--blue)) 50%,var(--blue)) border-box}
.ais-3 .aim-chart i{background:color-mix(in srgb,var(--pink) 35%,transparent)}
.ais-3 .aim-chart i.last{background:var(--pink)}
.ais-3 .aim-ni.on{background:var(--pink-tint);color:var(--pink)}
.ais-4 .aim{--aw:color-mix(in srgb,var(--pink-tint) 60%,var(--canvas))}
.ais-4 .aim-side{background:color-mix(in srgb,var(--pink-tint) 35%,var(--side-bg))}
.ais-4 .aim-ni.on{background:var(--hero);color:#fff;box-shadow:0 10px 20px -10px rgba(var(--pk-rgb),.9)}
.ais-4 .aim-h{background:radial-gradient(circle at 92% 0%,rgba(255,255,255,.28),transparent 45%),var(--hero);color:#fff;border-color:transparent;box-shadow:0 22px 40px -20px rgba(var(--pk-rgb),.95)}
.ais-4 .aim-e,.ais-4 .aim-hs{color:rgba(255,255,255,.88)}
.ais-4 .aim-hs b{color:#fff}
.ais-4 .aim-kp{background:var(--pink-tint);border-color:color-mix(in srgb,var(--pink) 35%,transparent)}
.ais-4 .aim-kp b,.ais-4 .aim-list .num{color:var(--pink);text-shadow:0 0 18px rgba(var(--pk-rgb),.55)}
.ais-4 .aim-chart i{background:linear-gradient(180deg,var(--pink),color-mix(in srgb,var(--pink) 35%,transparent))}
.ais-4 .aim .tag{--c:var(--pink);--ct:color-mix(in srgb,var(--pink) 18%,var(--raised))}
.ais-4 .aim .btn.p{--p-bg:var(--pink-deep);--p-fg:#fff}
.ais-4 .aim .btn.p .ic{color:#fff}
.ais-4 .aim-tabs span.on{color:var(--pink)}

/* ---------- PH photo treatment ---------- */
.phw{display:grid;gap:12px;min-width:0}
.ph-main{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:10px}
.ph-th{display:grid;gap:10px}
.phx{position:relative;margin:0;border-radius:14px;overflow:hidden;min-height:90px;background:#222;isolation:isolate}
.phx.big{min-height:290px}
.php{position:absolute;inset:0;display:block}
.phx figcaption{position:absolute;left:8px;bottom:8px;z-index:4;max-width:calc(100% - 16px);padding:3px 9px;border-radius:999px;background:rgba(10,12,18,.62);color:#fff;font:700 11.5px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.phx .gbadge{position:absolute;right:8px;top:8px;z-index:4;background:color-mix(in srgb,var(--gc) 22%,#fff);border-color:var(--gc)}
.ph-tile{background:radial-gradient(ellipse at 70% 20%,rgba(255,255,255,.7),transparent 45%),repeating-linear-gradient(0deg,#AFC0CC 0 2px,transparent 2px 34px),repeating-linear-gradient(90deg,#AFC0CC 0 2px,transparent 2px 34px),linear-gradient(160deg,#E9F0F4,#9FB3C1)}
.ph-cab{background:radial-gradient(ellipse at 55% 38%,rgba(255,226,180,.62),transparent 52%),linear-gradient(90deg,#2E2019 0 7%,transparent 7% 93%,#2E2019 93%),linear-gradient(180deg,#6A5240 0 12%,#4A382B 12% 62%,#2A1F18 62%)}
.ph-gar{background:radial-gradient(circle at 28% 18%,rgba(255,196,120,.5),transparent 48%),repeating-radial-gradient(circle at 70% 80%,rgba(0,0,0,.06) 0 2px,transparent 2px 7px),linear-gradient(180deg,#9A968F,#66625C 56%,#46433F 56%,#3A3835)}
.ph-crawl{background:radial-gradient(circle at 62% 55%,rgba(255,240,205,.8),rgba(150,110,60,.35) 22%,transparent 45%),linear-gradient(180deg,#43331F,#1C140C)}
.ph-kit{background:radial-gradient(ellipse at 30% 20%,rgba(255,255,255,.9),transparent 40%),linear-gradient(180deg,#F4F1EA 0 55%,#B58556 55% 59%,#8C5E36 59%),repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 3px,transparent 3px 26px)}
.phs-2 .php{filter:sepia(.32) saturate(1.2) contrast(.94) brightness(1.05)}
.phs-2 .phx::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(60,30,0,.38)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");mix-blend-mode:overlay}
.phs-3 .php{filter:contrast(1.45) saturate(1.35) brightness(.96)}
.phs-3 .phx::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.45))}
.phs-4 .php{filter:grayscale(1) contrast(1.12) brightness(1.06)}
.phs-4 .phx::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(135deg,#1769E0,#FF6EAA);mix-blend-mode:color;opacity:.9}
.ph-ba{position:relative}
.ph-bai{position:relative;height:190px;border-radius:14px;overflow:hidden}
.ph-bai .phx{position:absolute;inset:0;border-radius:0}
.ph-bai .ba-a{clip-path:inset(0 0 0 var(--p))}
.ph-bai .ba-a figcaption{left:auto;right:8px}
.ph-bah{position:absolute;top:0;bottom:0;left:var(--p);z-index:5;width:3px;margin-left:-1.5px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.2);pointer-events:none}
.ph-bah::after{content:"";position:absolute;left:50%;top:50%;width:32px;height:32px;margin:-16px 0 0 -16px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23101522' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 7l-5 5 5 5M15 7l5 5-5 5'/%3E%3C/svg%3E") center/18px no-repeat;box-shadow:0 6px 14px -4px rgba(0,0,0,.5)}
.ph-rng{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:6}
.ph-ba:has(.ph-rng:focus-visible) .ph-bai{outline:3px solid var(--focus);outline-offset:2px}

.intro p a{color:#fff;font-weight:700;text-underline-offset:3px}

/* ---------- forced-dark scope (TV board, dark glass sign-in) ---------- */
.dk,.tvdark{color-scheme:dark;
  --canvas:#090B12; --surface:#121722; --raised:#1A2230; --raised3:#30394A; --sunken:#0E131D;
  --line:#30394A; --border:#53617A; --ink:#F7F8FC; --muted:#AAB4C5; --disabled:#6B777E;
  --pink:#FF6EAA; --pink-on:#1A0711; --pink-deep:#D92E78; --pink-tint:#3A192B;
  --blue:#78A9FF; --blue-on:#0A1020; --blue-tint:#192C4A; --focus:#78A9FF;
  --good:#4FD18B; --good-tint:#223B33; --warn:#F2B233; --warn-tint:#3D3725; --bad:#FF4A3D; --bad-text:#FF8A80; --bad-tint:#3F3031; --info:#6CC0EA; --info-tint:#273942;
  --pk-rgb:224,50,127; --shc:rgba(0,0,0,.6); --gl-bd:rgba(255,255,255,.16); --gl-hi:rgba(255,255,255,.2);
  --card-sh:0 1px 0 rgba(255,255,255,.04) inset, 0 18px 40px -22px rgba(0,0,0,.85);color:var(--ink)}

/* ---------- TV board ---------- */
.tvw{display:grid;justify-items:center;min-width:0}
.tv-frame{width:100%;padding:9px;border-radius:16px;background:#05070B;box-shadow:0 30px 60px -30px rgba(0,0,0,.8),inset 0 0 0 1px rgba(255,255,255,.08)}
.tv-scl{border-radius:7px}
.tv-stand{width:26%;height:12px;border-radius:0 0 10px 10px;background:linear-gradient(#1A1F2A,#0B0E14)}
.tvb{position:relative;width:1920px;height:1080px;padding:40px 48px;display:flex;flex-direction:column;gap:28px;background:radial-gradient(circle at 100% 0%,rgba(224,50,127,.2),transparent 40%),radial-gradient(circle at 0% 100%,rgba(120,169,255,.12),transparent 40%),var(--canvas);font:500 26px/1.3 var(--body);overflow:hidden;text-align:left}
.tv-hd{display:flex;align-items:center;gap:24px;flex:none}
.tv-lg{width:84px;height:84px;flex:none}
.tv-lg .mico{width:100%;height:100%}
.tv-tt b{display:block;font:800 40px/1.1 var(--display);letter-spacing:-.02em}
.tv-tt small{font:700 19px var(--body);color:var(--muted);letter-spacing:.12em;text-transform:uppercase}
.tv-clk{margin-left:auto;text-align:right}
.tv-clk b{display:block;font-size:88px;line-height:.85}
.tv-clk small{font:700 20px var(--body);color:var(--muted)}
.tv-goal{flex:1;max-width:780px;margin-left:48px;display:grid;gap:10px}
.tv-gt{display:flex;align-items:baseline;gap:16px}
.tv-gt small{font:700 19px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tv-gt b{font-size:66px;line-height:1}
.tv-gt span{font-size:24px;color:var(--muted);font-weight:600}
.tv-gb{position:relative;height:22px;border-radius:22px;background:var(--raised3)}
.tv-gb i{display:block;height:100%;border-radius:inherit;background:var(--hero)}
.tv-gb em{position:absolute;top:-8px;bottom:-8px;width:4px;margin-left:-2px;background:var(--ink);border-radius:4px}
.tv-gp{font:700 20px var(--body);color:var(--good)}
.tv-p{background:var(--surface);border:1px solid var(--line);border-radius:28px;padding:26px 28px;display:flex;flex-direction:column;gap:16px;min-height:0;overflow:hidden}
.tv-p h3{font:800 30px var(--display);display:flex;align-items:center;gap:14px;letter-spacing:-.01em}
.tv-p h3 .num{font-size:36px;color:var(--pink)}
.tv-g3{flex:1;min-height:0;display:grid;grid-template-columns:1.15fr 1fr .9fr;gap:28px}
.tv-jobs ul,.tv-lb ol{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.tv-jobs li{display:flex;align-items:center;gap:18px;padding:11px 16px 11px 12px;border-radius:20px;background:var(--raised);--vbg:var(--raised);min-width:0}
.tv-jt{flex:1;min-width:0}
.tv-jt b{display:block;font-size:26px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-jt small{display:block;font-size:20px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-st{font:800 20px var(--body);padding:8px 16px;border-radius:999px;background:var(--sunken);white-space:nowrap}
.tv-jobs li[data-s="live"] .tv-st{background:var(--pink);color:var(--pink-on)}
.tv-jobs li[data-s="good"] .tv-st{background:var(--good-tint);color:var(--good)}
.tv-jobs li[data-s="warn"] .tv-st{background:var(--warn-tint);color:var(--warn)}
.tv-jobs li[data-s="off"]{opacity:.45}
.tv-lb li{position:relative;display:flex;align-items:center;gap:16px;padding:10px 20px 10px 10px;border-radius:18px;overflow:hidden;isolation:isolate;--vbg:var(--surface)}
.tv-fill{position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(90deg,rgba(224,50,127,.34),rgba(224,50,127,.1));transform-origin:left;transform:scaleX(var(--p))}
.tv-lb li:first-child .tv-fill{background:linear-gradient(90deg,rgba(224,50,127,.5),rgba(224,50,127,.18))}
.tv-lb li b{flex:1;font-size:26px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-lb .num{font-size:42px}
.tv-rk{width:44px;flex:none;text-align:center;font:800 36px var(--num);color:var(--muted)}
.tv-rk.m1{color:#F2C14E}.tv-rk.m2{color:#C9D1DC}.tv-rk.m3{color:#D08A4E}
.tv-al{gap:14px}
.tv-a{display:flex;gap:16px;align-items:flex-start;padding:18px 20px;border-radius:8px 20px 20px 8px;background:var(--svt);border-left:6px solid var(--sv)}
.tv-ai{color:var(--svx);flex:none}
.tv-ai .ic{width:34px;height:34px}
.tv-a b{display:block;font-size:25px;line-height:1.2}
.tv-a small{display:block;font-size:20px;color:var(--muted);margin-top:4px}
.tv-tick{display:flex;align-items:center;gap:22px;height:64px;border-radius:18px;background:var(--surface);border:1px solid var(--line);overflow:hidden;flex:none}
.tv-tl{align-self:stretch;display:grid;place-items:center;padding:0 26px;background:var(--pink);color:var(--pink-on);font:800 22px var(--body);letter-spacing:.14em;text-transform:uppercase}
.tv-tw{flex:1;overflow:hidden;white-space:nowrap}
.tv-tw span{display:inline-block;font-size:24px;font-weight:600;animation:tick 48s linear infinite}
@keyframes tick{to{transform:translateX(-50%)}}
.tv-g2{flex:1;min-height:0;display:grid;grid-template-columns:1.55fr 1fr;gap:28px}
.tv-col{display:grid;grid-template-rows:auto minmax(0,1fr);gap:28px;min-height:0}
.tv-podr{display:flex;align-items:flex-end;justify-content:center;gap:30px;flex:1;min-height:0}
.tv-pd{display:grid;justify-items:center;gap:6px;width:290px;--vbg:var(--surface)}
.tv-pd>b{font:800 34px var(--display);margin-top:6px}
.tv-pd>.num{font-size:54px;line-height:1}
.tv-blk{display:grid;place-items:start center;width:100%;margin-top:10px;border-radius:22px 22px 6px 6px;padding-top:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--mc) 48%,var(--raised)),var(--sunken));border:1px solid var(--line);border-bottom:0}
.tv-blk .num{font-size:64px;color:var(--mc)}
.tv-pd.p1{--mc:#F2C14E}.tv-pd.p1 .tv-blk{height:210px}
.tv-pd.p2{--mc:#C9D1DC}.tv-pd.p2 .tv-blk{height:140px}
.tv-pd.p3{--mc:#D08A4E}.tv-pd.p3 .tv-blk{height:100px}
.tv-rest{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;flex:none}
.tv-rest li{display:flex;align-items:center;gap:12px;padding:10px 16px 10px 10px;border-radius:18px;background:var(--raised);--vbg:var(--raised);min-width:0}
.tv-rest li b{flex:1;font-size:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-rest .num{font-size:32px}
.tv-rest .tv-rk{font-size:28px;width:30px}
.tv-rg{position:relative;width:300px;height:300px;margin:0 auto}
.tv-rg svg{width:100%;height:100%;transform:rotate(-90deg)}
.tv-rg .t{fill:none;stroke:var(--raised3);stroke-width:12}
.tv-rg .a{fill:none;stroke:var(--pink);stroke-width:12;stroke-linecap:round}
.tv-rg span{position:absolute;inset:0;display:grid;place-items:center;align-content:center;text-align:center}
.tv-rg b{font-size:100px;line-height:.9}
.tv-rg small{font-size:22px;color:var(--muted);font-weight:600}
.tv-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;flex:none}
.tv-sc{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:20px;background:var(--surface);border:1px solid var(--line);--vbg:var(--surface);min-width:0}
.tv-sc b{display:block;font-size:24px}
.tv-sc small{font-size:19px;color:var(--muted);font-weight:600;white-space:nowrap}
.tv-sc[data-s="live"]{box-shadow:inset 0 0 0 2px var(--pink)}
.tv-gm{flex:1;min-height:0;display:grid;grid-template-columns:.95fr 1.55fr .95fr;gap:24px}
.tv-gm .tv-jobs li{gap:14px}
.tv-gm .tv-st{display:none}
.tv-mw{flex:1;min-height:0;border-radius:18px;overflow:hidden;background:#0C121C}
.tv-mw svg{display:block;width:100%;height:100%}
.tv-gm .tv-lb .num{font-size:34px}
.tv-gm .tv-lb li b{font-size:22px}
.tv-slides{position:relative;flex:1;min-height:0}
.tv-sl{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateX(40px);transition:opacity .6s var(--ease),transform .6s var(--ease),visibility 0s linear .6s}
.tv-sl.on{opacity:1;visibility:visible;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease),visibility 0s}
.tv-sl>.tv-p{flex:1}
.tv-bigoal{justify-content:center;align-items:center;text-align:center;gap:14px;background:var(--hero);border-radius:28px;color:#fff}
.tv-bigoal small{font:800 28px var(--body);letter-spacing:.16em;text-transform:uppercase;opacity:.9}
.tv-bigoal b{font-size:250px;line-height:.85}
.tv-bigoal span{font-size:34px;font-weight:600}
.tv-bigoal .tv-gb{width:64%;background:rgba(0,0,0,.25);margin-top:16px}
.tv-bigoal .tv-gb i{background:#fff}
.tv-bigoal .tv-gb em{background:#1A0711}
.tv-dots{display:flex;gap:12px;margin-left:auto}
.tv-dots i{width:16px;height:16px;border-radius:16px;background:var(--raised3);transition:width .4s var(--ease),background-color .4s}
.tv-dots i.on{width:48px;background:var(--pink)}
.tv-dots+.tv-clk{margin-left:40px}
.tv-timer{height:6px;border-radius:6px;background:var(--raised3);overflow:hidden;flex:none}
.tv-timer i{display:block;height:100%;background:var(--pink);transform-origin:left;animation:tvt 5.2s linear infinite}
@keyframes tvt{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ---------- IP iPad ---------- */
.ipw{display:grid;gap:12px;min-width:0}
.ip-frame{padding:13px;border-radius:40px;background:#0B0E14;box-shadow:0 30px 60px -30px rgba(0,0,0,.8),inset 0 0 0 2px #2A3242;width:fit-content;max-width:100%;justify-self:center;min-width:0}
.ip-scl{border-radius:27px}
.ip-frame .ip-scl{width:calc(760px * 834 / 1112);max-width:100%}
.ipx{position:relative;width:834px;height:1112px;background:var(--canvas);color:var(--ink);display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:30px minmax(0,1fr);overflow:hidden;font-size:17px;text-align:left}
.ip-status{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding:4px 26px 0;font:700 14px var(--body)}
.ip-bat i{display:inline-block;width:24px;height:12px;border:1.5px solid currentColor;border-radius:3px;vertical-align:-1px;background:linear-gradient(90deg,currentColor 78%,transparent 78%);background-clip:content-box;padding:1.5px}
.ip-main{min-height:0;overflow:hidden;padding:18px 28px 28px;position:relative;grid-row:2;grid-column:1}
.ipv{display:none;gap:18px;align-content:start}
.ip-main[data-v="work"] .ipv-work,.ip-main[data-v="rec"] .ipv-rec,.ip-main[data-v="job"] .ipv-job{display:grid}
.ip-hd{display:flex;align-items:center;gap:16px}
.ip-hd>div{flex:1;min-width:0}
.ip-hm{width:76px;height:76px;flex:none;color:var(--pink)}
.ip-hd small{display:block;font:700 13px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ip-hd b{font:800 36px/1.1 var(--display);letter-spacing:-.03em}
.ip-hd.sm b{font-size:28px}
.ip-stat{display:grid;text-align:right}
.ip-stat b{font:800 36px/1 var(--num);letter-spacing:.01em}
.ip-next .card-t{font-size:22px}
.ip-next .card-b{padding-top:8px}
.ip-next .job-addr{font-size:16px}
.ip-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ip-list li{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:18px;background:var(--raised);border:1px solid var(--line)}
.ip-list time{font:800 24px var(--num);min-width:86px;color:var(--pink)}
.ip-list span{flex:1;min-width:0}
.ip-list b{display:block;font-size:18px}
.ip-list small{color:var(--muted);font-size:15px}
.ip-list .ic{color:var(--muted)}
.ip-dots{display:none;justify-content:center;gap:8px}
.ip-dots i{width:9px;height:9px;border-radius:9px;background:var(--raised3)}
.ip-dots i.on{width:26px;background:var(--pink)}
.ip-nav{display:flex;z-index:3}
.ip-ni{display:grid;justify-items:center;gap:4px;color:var(--muted);font:600 13px var(--body)}
.ip-ni .ic{width:28px;height:28px}
.ip-split{display:none}
.ipl-1 .ipx,.ipx.ipl-1{grid-template-rows:30px minmax(0,1fr) 88px}
.ipl-1 .ip-nav{grid-row:3;grid-column:1;justify-content:space-around;align-items:center;border-top:1px solid var(--line);background:var(--surface);padding-bottom:10px}
.ipl-1 .ip-ni.on{color:var(--pink)}
.ipx.ipl-2{grid-template-columns:96px minmax(0,1fr)}
.ipl-2 .ip-nav{grid-row:2;grid-column:1;flex-direction:column;align-items:center;gap:8px;padding-top:18px;border-right:1px solid var(--line);background:var(--side-bg)}
.ipl-2 .ip-main{grid-column:2}
.ipl-2 .ip-ni{width:76px;padding:10px 0;border-radius:16px}
.ipl-2 .ip-ni.on{background:var(--raised);color:var(--ink);box-shadow:inset 3px 0 0 var(--pink)}
.ipl-3 .ip-nav{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);gap:6px;padding:8px;border-radius:999px;background:var(--raised);border:1px solid var(--line);box-shadow:0 20px 40px -18px var(--shc)}
.ipl-3 .ip-ni{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:999px}
.ipl-3 .ip-ni .ic{width:24px;height:24px}
.ipl-3 .ip-ni small{display:none;font-size:15px;font-weight:700}
.ipl-3 .ip-ni.on{background:var(--pink);color:var(--pink-on)}
.ipl-3 .ip-ni.on small{display:inline}
.ipl-3 .ip-list,.ipl-3 .ip-stat{display:none}
.ipl-3 .ip-dots{display:flex}
.ipl-3 .ip-next{min-height:560px;display:grid;align-content:space-between}
.ipl-3 .ip-next .card-t{font-size:34px;line-height:1.1}
.ipl-3 .ip-next .job-addr{font-size:19px}
.ipl-3 .ip-next .acts{display:grid;grid-template-columns:1fr 1fr}
.ipl-3 .ip-next .btn{min-height:64px;font-size:18px}
.ipl-3 .ip-main{padding-bottom:110px}
.ipx.ipl-4{grid-template-columns:290px minmax(0,1fr)}
.ipl-4 .ip-nav{display:none}
.ipl-4 .ip-split{display:grid;grid-row:2;grid-column:1;gap:8px;align-content:start;padding:18px 12px;border-right:1px solid var(--line);background:var(--surface)}
.ip-si{display:grid;gap:2px;padding:12px 14px;border-radius:14px}
.ip-si time{font:800 20px var(--num);color:var(--pink)}
.ip-si b{font-size:16px}
.ip-si small{color:var(--muted);font-size:14px}
.ip-si.on{background:var(--raised);box-shadow:inset 3px 0 0 var(--pink)}
.ipl-4 .ip-main{grid-column:2;padding:18px 20px}
.ipl-4 .ip-list,.ipl-4 .ip-stat,.ipl-4 .ip-hm{display:none}

/* ---------- SI sign-in ---------- */
.siw{display:grid;gap:12px;min-width:0}
.si-stage{position:relative;min-height:480px;border-radius:20px;overflow:hidden;border:1px solid var(--line);display:grid;place-items:center;padding:28px 20px;isolation:isolate}
.si-card{position:relative;z-index:1;width:min(400px,100%);padding:24px;border-radius:22px;background:var(--raised);border:1px solid var(--line);box-shadow:0 30px 60px -30px rgba(0,0,0,.6);min-width:0}
.si-v{display:none;gap:12px}
.si-card[data-at="in"] .si-v[data-v="in"],.si-card[data-at="code"] .si-v[data-v="code"],.si-card[data-at="so"] .si-v[data-v="so"]{display:grid;animation:fadein .35s var(--ease)}
.si-v h3{font:800 25px var(--display);letter-spacing:-.02em}
.si-p{margin:0;color:var(--muted);font-size:14px}
.si-brand{display:flex;align-items:center;gap:10px}
.si-lg{width:40px;height:40px;flex:none}
.si-lg .mico{width:100%;height:100%}
.si-brand b{font:800 18px var(--display)}
.si-small{margin:0;font-size:12.5px;color:var(--muted);text-align:center}
.si-v>.btn{width:100%}
.otps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.otp{width:100%;min-width:0;height:58px;border-radius:12px;border:1.5px solid var(--border);background:var(--surface);text-align:center;font:800 30px var(--num);color:var(--ink);outline:none;padding:0;transition:border-color .2s,box-shadow .2s,transform .16s var(--ease)}
.otp:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(var(--pk-rgb),.22)}
.otp.fill{animation:pop .3s var(--spring)}
.si-trust{padding:10px 0 0;border-top:1px solid var(--line)}
.si-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.si-v .cks{gap:2px}
.si-v .ck{padding:8px}
.si-deco,.si-steps{display:none}
.sil-1{background:var(--hero)}
.sil-1::before{content:"";position:absolute;right:-80px;top:-120px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.22),transparent 65%)}
.sil-2{grid-template-columns:minmax(0,.85fr) minmax(0,1fr);padding:0;place-items:stretch;background:var(--raised)}
.sil-2 .si-deco{display:grid;align-content:end;gap:6px;padding:26px;background:var(--hero);color:#fff;position:relative;overflow:hidden}
.si-dm{position:absolute;right:-24px;top:22px;width:210px;height:210px;color:#fff;filter:drop-shadow(0 16px 20px rgba(0,0,0,.3))}
.sil-2 .si-deco b{position:relative;font:800 30px/1.05 var(--display);letter-spacing:-.03em}
.sil-2 .si-deco small{position:relative;opacity:.88;font-weight:600}
.sil-2 .si-card{margin:auto;box-shadow:none;border:0;background:transparent}
.sil-3{background:radial-gradient(circle at 18% 18%,rgba(255,110,170,.6),transparent 45%),radial-gradient(circle at 85% 85%,rgba(120,169,255,.55),transparent 50%),#0B0E17}
.sil-3 .si-card{background:rgba(255,255,255,.07);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 30px 60px -30px rgba(0,0,0,.8)}
.sil-3 .fc,.sil-3 .otp{background:rgba(255,255,255,.06)}
.sil-4{background:var(--surface);place-items:start center;padding-top:84px}
.sil-4 .si-steps{display:flex;position:absolute;top:24px;left:50%;transform:translateX(-50%);gap:56px}
.si-steps i{position:relative;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--sunken);border:2px solid var(--line);font:800 15px var(--num);font-style:normal;color:var(--muted);transition:background-color .3s,border-color .3s,color .3s}
.si-steps i+i::before{content:"";position:absolute;right:calc(100% + 6px);top:50%;width:44px;height:2px;background:var(--line)}
.si-steps i.on{background:var(--pink);border-color:var(--pink);color:var(--pink-on)}
.si-steps i.dn{background:var(--pink-tint);border-color:var(--pink);color:var(--pink)}
.sil-4 .si-card{box-shadow:none;border:0;background:transparent;padding:0}

/* ---------- EM customer messages ---------- */
.emw{display:grid;gap:12px;min-width:0}
.em-stage{display:grid;grid-template-columns:250px minmax(0,1fr);gap:16px;align-items:start;padding:16px;border-radius:18px;background:var(--sunken);border:1px solid var(--line)}
.em-ph{width:100%;border-radius:34px;padding:9px;background:#0B0E14;box-shadow:0 20px 40px -20px rgba(0,0,0,.7),inset 0 0 0 2px #2A3242}
.em-phs{display:flex;justify-content:space-between;padding:6px 14px 8px;color:#fff;font:700 11px var(--body)}
.em-ph-n{font-weight:800}
.em-thread{min-height:440px;border-radius:25px;background:#fff;color:#101522;padding:12px 10px;display:flex;flex-direction:column;gap:8px}
.em-day{align-self:center;font-size:11px;color:#6B7280;font-weight:600}
.em-bub{margin:0;max-width:90%;padding:9px 12px;border-radius:18px 18px 18px 4px;background:#E9ECF1;font-size:13.5px;line-height:1.4;align-self:flex-start}
.em-bub.me{align-self:flex-end;background:#1769E0;color:#fff;border-radius:18px 18px 4px 18px}
.em-bub u{color:#1769E0}
.em-mms{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 8px;border-radius:16px;background:#F3F5F8;align-self:flex-start;--vbg:#F3F5F8}
.em-mms b{display:block;font-size:13px}
.em-mms small{font-size:11.5px;color:#6B7280}
.em-lp{display:flex;align-items:center;gap:10px;align-self:flex-start;max-width:90%;padding:8px;border-radius:14px;background:#fff;border:1px solid #E1E6EE;box-shadow:0 6px 14px -8px rgba(0,0,0,.3)}
.em-lpb{width:36px;height:36px;flex:none}
.em-lpb .mico{width:100%;height:100%}
.em-lp b{display:block;font-size:13px}
.em-lp small{font-size:11px;color:#6B7280}
.em-mail{border-radius:16px;overflow:hidden;background:#fff;color:#101522;border:1px solid #D7DEEA;box-shadow:0 20px 40px -24px rgba(0,0,0,.5);min-width:0}
.em-mh{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid #E6EAF0}
.em-from{width:36px;height:36px;flex:none}
.em-from .mico{width:100%;height:100%}
.em-mh b{display:block;font-size:14px}
.em-mh small{font-size:12px;color:#6B7280}
.em-subj{padding:12px 16px 4px;font:800 18px/1.25 var(--display);letter-spacing:-.01em}
.em-body{padding:12px 16px 18px;background:#F5F7FB}
.em-band{display:none}
.em-in{max-width:520px;margin:0 auto;background:#fff;border-radius:14px;padding:22px;display:grid;gap:12px;border:1px solid #E6EAF0}
.em-in h4{margin:0;font:800 22px/1.15 var(--display);letter-spacing:-.02em}
.em-in p{margin:0;font-size:14.5px;line-height:1.5;color:#374151}
.em-t{width:100%;border-collapse:collapse;font-size:13.5px}
.em-t th{text-align:left;color:#6B7280;font-weight:600;padding:7px 10px 7px 0;width:30%;vertical-align:top}
.em-t td{padding:7px 0;font-weight:700}
.em-t tr+tr th,.em-t tr+tr td{border-top:1px solid #EEF1F5}
.em-cta{justify-self:start;display:inline-block;padding:12px 20px;border-radius:12px;background:#101522;color:#fff;font:700 15px var(--body);text-decoration:none}
.em-foot{font-size:11.5px!important;color:#6B7280!important}
.em-tech{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:#F3F5F8;--vbg:#F3F5F8}
.em-tech b{display:block;font-size:15px}
.em-tech small{font-size:12.5px;color:#6B7280}
.em-map{display:none;border-radius:12px;overflow:hidden;border:1px solid #E6EAF0}
.em-map svg{display:block;width:100%;height:auto}
.em-stars{display:none;gap:6px;font-size:34px;color:#F2B233;line-height:1}
.ems-1 .em-body{background:#fff}
.ems-1 .em-in{border:0;padding:8px 4px}
.ems-1 .em-t{display:none}
.ems-1 .em-cta{background:#1769E0}
.ems-2 .em-band{display:flex;align-items:center;gap:10px;max-width:520px;margin:0 auto;padding:14px 20px;border-radius:14px 14px 0 0;background:linear-gradient(135deg,#FF5FA2,#E0327F 48%,#A3175A);color:#fff;font:800 16px var(--display)}
.em-bl{width:30px;height:30px;flex:none}
.em-bl .mico{width:100%;height:100%}
.ems-2 .em-in{border-radius:0 0 14px 14px;border-top:0}
.ems-2 .em-cta{justify-self:stretch;text-align:center;padding:14px;background:#D92E78}
.ems-2 .em-stars,.ems-3 .em-stars{display:flex}
.ems-3 .em-tech{flex-direction:column;text-align:center;padding:18px;background:linear-gradient(160deg,#FDEAF2,#EAF2FF)}
.ems-3 .em-map{display:block}
.ems-3 .em-cta{background:#1769E0}
.ems-4 .em-body{background:#fff}
.ems-4 .em-in{border:0;border-top:4px solid #D92E78;border-radius:0;padding:20px 4px}
.ems-4 .em-in h4{font:800 12px var(--body);letter-spacing:.16em;text-transform:uppercase;color:#D92E78}
.ems-4 .em-in p{font-size:16px;color:#101522}
.ems-4 .em-t th{text-transform:uppercase;font-size:11px;letter-spacing:.1em}
.ems-4 .em-cta{background:none;color:#101522;padding:0;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#D92E78;text-decoration-thickness:2px}

/* ---------- shared panel look for page 5 rows ---------- */
.pgw,.srw,.dtw,.prw,.tlw,.clw,.upw,.vpw,.pfw,.adw{background:var(--raised);border:1px solid var(--line);border-radius:18px;box-shadow:var(--card-sh);min-width:0}

/* ---------- PG pagination ---------- */
.pgw{padding:14px;display:grid;gap:10px}
.pgw-h b{display:block;font:700 16px var(--display)}
.pgw-h small{font-size:12.5px;color:var(--muted);font-weight:600}
.pg-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.pg-list.pg-sw{animation:fadein .3s var(--ease)}
.pg-r{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;background:var(--surface);border:1px solid var(--line);min-width:0}
.pg-new{animation:fadein .35s var(--ease) both;animation-delay:calc(var(--i)*30ms)}
.pg-d{width:44px;flex:none}
.pg-d b{font-size:18px;color:var(--muted)}
.pg-t{flex:1;min-width:0}
.pg-t b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-t small{display:block;font-size:12px;color:var(--muted)}
.pg-r .tag{font-size:12px;padding:4px 9px 4px 7px}
.pg-a{min-width:70px;text-align:right;font-size:19px}
.pg-ctl{min-height:40px}
.pg-nums{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap}
.pg-b{min-width:40px;height:40px;padding:0 10px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:800 17px var(--num);cursor:pointer;display:inline-grid;place-items:center;transition:background-color .2s,transform .16s var(--ease),border-color .2s}
.pg-b .ic{width:16px;height:16px}
.pg-b.on{background:var(--pink);border-color:var(--pink);color:var(--pink-on);box-shadow:0 8px 16px -8px rgba(var(--pk-rgb),.9)}
.pg-b:disabled{opacity:.35;cursor:not-allowed}
@media (hover:hover){.pg-b:hover:not(:disabled):not(.on){background:var(--sunken);transform:translateY(-1px)}}
.pg-b:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.pg-el{color:var(--muted);padding:0 4px;font-weight:700}
.pg-more{display:grid;justify-items:center;gap:8px}
.pg-more b{color:var(--ink)}
.pg-scroll{max-height:360px;overflow:auto;border-radius:12px;scrollbar-width:thin;overscroll-behavior:contain}
.pg-scroll:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.pg-sent{display:grid;gap:6px;padding:10px 0;justify-items:center}
.pg-sent small{color:var(--muted);font-size:12.5px;font-weight:600}
.pg-sk{width:100%;height:44px;border-radius:12px;background:linear-gradient(90deg,var(--sunken),var(--raised3),var(--sunken));background-size:200% 100%;animation:skl 1.2s linear infinite}
@keyframes skl{from{background-position:100% 0}to{background-position:-100% 0}}
.pg-rng{display:flex;align-items:center;gap:12px 16px;flex-wrap:wrap;font-size:13.5px;color:var(--muted);font-weight:600}
.pg-of b{font-size:19px;color:var(--ink)}
.pg-sel,.pg-in{height:36px;border-radius:10px;border:1.5px solid var(--border);background:var(--surface);color:var(--ink);font:700 14px var(--body);padding:0 8px;margin-left:6px}
.pg-in{width:64px;margin-right:4px}
.pg-sel:focus,.pg-in:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 3px rgba(var(--pk-rgb),.22)}
.pg-pn{display:flex;gap:6px;margin-left:auto}

/* ---------- SR search ---------- */
.srw{position:relative;padding:14px;display:grid;gap:10px;align-content:start;min-height:380px;overflow:hidden}
.sr-in{display:flex;align-items:center;gap:8px;height:44px;padding:0 12px;border-radius:12px;background:var(--surface);border:1.5px solid var(--border);color:var(--muted);min-width:0;transition:border-color .2s,box-shadow .2s}
.sr-in:focus-within{border-color:var(--pink);box-shadow:0 0 0 3px rgba(var(--pk-rgb),.2)}
.sr-in input{flex:1;min-width:0;border:0;background:none;outline:none;font:500 15px var(--body);color:var(--ink)}
.sr-in input::-webkit-search-cancel-button{display:none}
.sr-in.sm{height:36px;width:180px;flex:0 1 180px}
.sr-in.big{height:64px;border-radius:18px;padding:0 18px}
.sr-in.big input{font:700 24px var(--display);letter-spacing:-.02em}
.sr-in.big .ic{width:24px;height:24px}
kbd{font:700 11px var(--body);padding:2px 6px;border-radius:6px;background:var(--sunken);border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.sr-list{list-style:none;margin:0;padding:6px;display:grid;gap:2px}
.sr-g{font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:8px 8px 3px}
.sr-i{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;min-width:0}
.sr-i.act{background:var(--pink-tint)}
@media (hover:hover){.sr-i:hover{background:var(--sunken)}.sr-i.act:hover{background:var(--pink-tint)}}
.sr-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--sunken);color:var(--muted);flex:none}
.sr-ic .ic{width:16px;height:16px}
.sr-i.act .sr-ic{background:var(--pink);color:var(--pink-on)}
.sr-t{flex:1;min-width:0}
.sr-t b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-t small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-i kbd{visibility:hidden}
.sr-i.act kbd{visibility:visible}
.sr-list mark{background:rgba(var(--pk-rgb),.3);color:inherit;border-radius:3px}
.sr-none{padding:14px;color:var(--muted);font-size:14px}
.sr-top{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:var(--app-top);border:1px solid var(--line);--vbg:var(--app-top)}
.sr-top .sr-in{flex:0 1 320px}
.sr-pop{position:relative;z-index:2;margin:-6px 0 0 44px;width:min(380px,calc(100% - 44px));border-radius:16px;background:var(--raised);border:1px solid var(--line);box-shadow:0 26px 50px -20px var(--shc);animation:fadein .25s var(--ease)}
.sr-page{display:grid;gap:8px;margin-top:-240px;padding:0 4px;opacity:.35}
.sr-page i{height:54px;border-radius:12px;background:var(--sunken)}
.srw[data-n="2"]{padding:0;background:var(--canvas)}
.sr-dim{margin:0;padding:14px;opacity:1}
.sr-fake{display:grid;gap:10px;filter:blur(1.5px);opacity:.5}
.sr-fake b{font:800 20px var(--display)}
.sr-fake i{height:60px;border-radius:14px;background:var(--raised)}
.srw[data-n="2"]::before{content:"";position:absolute;inset:0;background:rgba(6,8,14,.45);z-index:1}
:root[data-theme="light"] .srw[data-n="2"]::before{background:rgba(16,21,34,.22)}
.sr-pal{position:absolute;left:50%;top:26px;z-index:2;width:min(460px,calc(100% - 28px));transform:translateX(-50%);border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:0 30px 70px -20px rgba(0,0,0,.7);overflow:hidden;animation:palin .3s var(--spring)}
@keyframes palin{from{opacity:0;transform:translateX(-50%) scale(.96)}}
.sr-pal .sr-in{border:0;border-bottom:1px solid var(--line);border-radius:0;height:52px;box-shadow:none;background:none}
.sr-pal .sr-list{max-height:260px;overflow:auto}
.sr-foot{display:flex;gap:14px;padding:8px 12px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);font-weight:600;flex-wrap:wrap}
.sr-spot{display:grid;gap:12px}
.sr-rec{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sr-chip,.sr-fc{padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:700 13px var(--body);cursor:pointer;transition:background-color .2s,border-color .2s}
.sr-fc[aria-pressed="true"]{background:var(--ink);color:var(--canvas);border-color:var(--ink)}
@media (hover:hover){.sr-chip:hover,.sr-fc:hover{background:var(--pink-tint)}.sr-fc[aria-pressed="true"]:hover{background:var(--ink)}}
.sr-chip:focus-visible,.sr-fc:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.sr-hit{display:grid;gap:6px}
.sr-hc{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:linear-gradient(120deg,var(--pink-tint),var(--surface) 70%);border:1px solid color-mix(in srgb,var(--pink) 35%,var(--line))}
.sr-hc .av{width:44px;height:44px;background:var(--pink);color:var(--pink-on)}
.sr-hc>span:nth-child(2){flex:1;min-width:0}
.sr-hc b{display:block;font:700 16px var(--display)}
.sr-hc small{font-size:12.5px;color:var(--muted)}
.sr-spot .sr-list{padding:0}
.sr-chips{display:flex;gap:6px;flex-wrap:wrap}
.sr-list.flat .sr-i{background:var(--surface);border:1px solid var(--line)}
.sr-list.flat .sr-i.act{background:var(--surface)}
.sr-list.flat .sr-i.act .sr-ic{background:var(--sunken);color:var(--muted)}

/* ---------- DT date/time ---------- */
.dtw{padding:14px;display:grid;gap:12px}
.dtw-h{display:flex;align-items:center;gap:10px}
.dtw-h>.ic{color:var(--pink)}
.dtw-h b{display:block;font:700 16px var(--display)}
.dtw-h small{font-size:12.5px;color:var(--muted)}
.dt-out{margin:0;padding:10px 12px;border-radius:12px;background:var(--sunken);border:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.dt-out b{color:var(--ink)}
.dt-g1{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:12px;align-items:start}
.dt-cal{padding:10px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.dt-mh{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.dt-mh b{font:700 15px var(--display)}
.dt-mh .pg-b{min-width:32px;height:32px}
.dt-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;text-align:center}
.dt-dn{font:700 11px var(--body);color:var(--muted);padding:4px 0}
.dt-d{position:relative;height:36px;border:0;border-radius:10px;background:none;color:var(--ink);font:800 16px var(--num);cursor:pointer;transition:background-color .2s}
.dt-d i{position:absolute;left:50%;bottom:4px;width:calc(var(--a)*5px);height:3px;margin-left:calc(var(--a)*-2.5px);border-radius:3px;background:var(--good)}
.dt-d:disabled{color:var(--disabled);cursor:not-allowed}
.dt-d.on{background:var(--pink);color:var(--pink-on)}
.dt-d.on i{background:var(--pink-on)}
@media (hover:hover){.dt-d:hover:not(:disabled):not(.on){background:var(--sunken)}}
.dt-d:focus-visible,.dt-sd:focus-visible,.dt-w:focus-visible,.dt-sm:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.dt-wins{display:grid;gap:6px;align-content:start}
.dt-w{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;text-align:left;transition:border-color .2s,background-color .2s}
.dt-w b{font-size:14.5px}
.dt-w small{font-size:12px;color:var(--good);font-weight:700}
.dt-w[aria-checked="true"]{border-color:var(--pink);background:var(--pink-tint)}
.dt-w:disabled{opacity:.45;cursor:not-allowed}
.dt-w:disabled small{color:var(--muted)}
.dtw[data-n="2"] .dt-wins{grid-template-columns:repeat(4,minmax(0,1fr))}
.dtw[data-n="2"] .dt-w{flex-direction:column;align-items:flex-start;gap:2px}
.dt-strip{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 4px;scroll-snap-type:x mandatory}
.dt-strip::-webkit-scrollbar{display:none}
.dt-sd{flex:none;width:58px;display:grid;justify-items:center;gap:2px;padding:8px 0;border-radius:14px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;scroll-snap-align:start;transition:border-color .2s,background-color .2s}
.dt-sd small{font:700 11px var(--body);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.dt-sd b{font-size:24px;line-height:1}
.dt-av{display:flex;gap:2px}
.dt-av i{width:6px;height:6px;border-radius:50%;background:var(--raised3)}
.dt-av i.on{background:var(--good)}
.dt-sd.on{border-color:var(--pink);background:var(--pink-tint)}
.dt-sd:disabled{opacity:.4;cursor:not-allowed}
.dt-wheel{position:relative;display:grid;grid-template-columns:1.7fr 1fr .8fr 1fr;gap:4px;height:200px;padding:0 8px;border-radius:16px;background:var(--surface);border:1px solid var(--line);overflow:hidden}
.dt-lens{position:absolute;left:8px;right:8px;top:50%;height:40px;margin-top:-20px;border-radius:10px;background:var(--pink-tint);border:1px solid color-mix(in srgb,var(--pink) 40%,transparent);pointer-events:none}
.dt-col{position:relative;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;-webkit-mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);border-radius:8px}
.dt-col::-webkit-scrollbar{display:none}
.dt-col:focus-visible{outline:2px solid var(--focus)}
.dt-cin{padding:80px 0}
.dt-col span{display:grid;place-items:center;height:40px;scroll-snap-align:center;font:700 16px var(--body);color:var(--muted);white-space:nowrap}
.dt-col span.on{color:var(--ink);font-weight:800}
.dt-smart{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dt-sm{position:relative;display:grid;gap:2px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .2s,background-color .2s,transform .16s var(--ease)}
.dt-sm b{font:700 15px var(--display)}
.dt-sm span{font-size:13.5px;font-weight:600}
.dt-sm small{font-size:12px;color:var(--muted)}
.dt-sm[aria-checked="true"]{border-color:var(--pink);background:var(--pink-tint)}
.dt-best{position:absolute;top:10px;right:10px;padding:2px 8px;border-radius:999px;background:var(--good-tint);color:var(--good);font:800 10.5px var(--body);letter-spacing:.06em;text-transform:uppercase}
.dt-more summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:700;font-size:14px;color:var(--blue);list-style:none;padding:4px 2px}
.dt-more summary::-webkit-details-marker{display:none}
.dt-more .dt-cal{margin-top:8px}

/* ---------- PR progress ---------- */
.prw{padding:14px;display:grid;gap:12px}
.prg{display:grid;gap:14px}
.pr{--pv:calc(var(--v)*1%);display:grid;gap:7px;min-width:0;position:relative}
.pr-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pr-l{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:14px;flex:1;min-width:0}
.pr-l .ic{width:16px;height:16px;color:var(--muted)}
.pr-n{font-size:12.5px;color:var(--muted);font-weight:600}
.pr-n b{font-size:18px;color:var(--ink)}
.pr-bar{position:relative;height:8px;border-radius:8px;background:var(--sunken);box-shadow:inset 0 0 0 1px var(--line)}
.pr-f{position:absolute;left:0;top:0;bottom:0;width:var(--pv);border-radius:inherit;background:var(--hero);transition:width .9s var(--ease)}
.prw.zero .pr-f{width:0;transition:none}
.pr-in{display:none}
.pr-pace{display:none;position:absolute;top:-5px;bottom:-5px;left:var(--pc);width:3px;margin-left:-1.5px;border-radius:3px;background:var(--ink)}
.pr-liq,.pr-blk,.pr-ring,.pr-ah{display:none}
.prs-1 .pr-bar{height:4px}
.prs-1 .pr-f{background:var(--pink)}
.prs-1 .pr-top{flex-wrap:nowrap}
.prs-2 .pr-bar{height:26px;border-radius:26px}
.prs-2 .pr-in{display:block;position:absolute;right:10px;top:50%;transform:translateY(-50%);font:800 13px var(--body);color:#fff}
.prs-2 .pr-f{min-width:48px}
.prs-3 .pr-bar{display:none}
.prs-3 .pr-blk{display:grid;grid-template-columns:repeat(10,1fr);gap:4px}
.pr-blk i{height:14px;border-radius:4px;background:var(--sunken);box-shadow:inset 0 0 0 1px var(--line);transition:background-color .3s;transition-delay:calc(var(--n)*50ms)}
.pr-blk i.on{background:var(--pink);box-shadow:none}
.prw.zero .pr-blk i.on{background:var(--sunken);transition:none}
.prs-4 .prg{grid-template-columns:repeat(2,minmax(0,1fr))}
.prs-4 .pr{grid-template-columns:72px minmax(0,1fr);align-items:center;gap:4px 12px}
.prs-4 .pr-bar{display:none}
.prs-4 .pr-ring{display:grid;grid-row:1/3;position:relative;width:72px;height:72px}
.prs-4 .pr-top{flex-direction:column;align-items:flex-start;gap:2px}
.pr-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.pr-ring .t{fill:none;stroke:var(--sunken);stroke-width:7}
.pr-ring .a{fill:none;stroke:var(--pink);stroke-width:7;stroke-linecap:round;stroke-dasharray:var(--v) 100;transition:stroke-dasharray .9s var(--ease)}
.prw.zero .pr-ring .a{stroke-dasharray:0 100;transition:none}
.pr-ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:18px}
.prs-5 .pr-bar{height:14px;border-radius:14px}
.prs-5 .pr-pace{display:block}
.prs-5 .pr-f{background:var(--pink)}
.prs-5 .pr-bar::after{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(90deg,transparent 0 calc(25% - 1px),color-mix(in srgb,var(--canvas) 70%,transparent) calc(25% - 1px) 25%)}
.prs-5 .pr-ah{display:inline-flex;font:800 12px var(--body);justify-self:end;margin-top:-2px}
.pr-ah.up{color:var(--good)}.pr-ah.dn{color:var(--bad-text)}
.prs-6 .pr-bar{height:30px;border-radius:12px;background:color-mix(in srgb,var(--blue-tint) 70%,var(--sunken));overflow:hidden}
.prs-6 .pr-f{display:none}
.prs-6 .pr-liq{display:block;position:absolute;inset:0;overflow:hidden;border-radius:inherit}
.pr-liq i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--pv) + 12px);background:linear-gradient(180deg,#78A9FF,#1769E0);transition:width .9s var(--ease)}
.pr-liq i::after{content:"";position:absolute;top:0;bottom:0;right:-11px;width:24px;background:radial-gradient(circle at 0 50%,#4C8FF5 11px,transparent 12px) 0 0/24px 16px repeat-y;animation:liq 1.4s linear infinite}
@keyframes liq{to{background-position:0 16px}}
.prw.zero .pr-liq i{width:0;transition:none}
.prs-6 .pr-in{display:block;position:absolute;left:10px;top:50%;transform:translateY(-50%);z-index:2;font:800 13px var(--body);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}

/* ---------- TL timeline ---------- */
.tlw{padding:14px;display:grid;gap:14px}
.tlw-h{display:flex;align-items:center;gap:12px}
.tlw-h .av{width:40px;height:40px;background:var(--pink-tint);color:var(--pink)}
.tlw-h>div{flex:1;min-width:0}
.tlw-h b{display:block;font:700 16px var(--display)}
.tlw-h small{font-size:12.5px;color:var(--muted)}
.tl{list-style:none;margin:0;padding:0}
.tl-dot{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--sunken);border:2px solid var(--line);color:var(--muted)}
.tl-dot .ic{width:15px;height:15px;stroke-width:2.4}
.tl-s[data-s="done"] .tl-dot{background:var(--pink);border-color:var(--pink);color:var(--pink-on)}
.tl-s[data-s="next"] .tl-dot{background:var(--raised);border-color:var(--pink);color:var(--pink);animation:livedot 1.6s ease-out infinite}
.tl-tx{display:grid;min-width:0}
.tl-tx b{font-size:14px}
.tl-tx time{font:800 14px var(--num);color:var(--muted);letter-spacing:.02em}
.tl-tx small{font-size:12px;color:var(--muted);line-height:1.3}
.tl-s[data-s="todo"] .tl-tx b{color:var(--muted)}
.tl-gap{display:none}
.tl-1 .tl{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
.tl-1 .tl-s{position:relative;display:grid;justify-items:center;text-align:center;gap:8px;padding:0 3px}
.tl-1 .tl-s::before{content:"";position:absolute;top:15px;right:calc(50% + 18px);left:calc(-50% + 18px);height:3px;border-radius:3px;background:var(--line)}
.tl-1 .tl-s:first-child::before{display:none}
.tl-1 .tl-s[data-s="done"]::before,.tl-1 .tl-s[data-s="next"]::before{background:var(--pink)}
.tl-1 .tl-tx small{display:none}
.tl-2 .tl{display:grid}
.tl-2 .tl-s{position:relative;display:flex;gap:12px;padding-bottom:14px}
.tl-2 .tl-s::before{content:"";position:absolute;left:15px;top:34px;bottom:0;width:2px;background:var(--line)}
.tl-2 .tl-s:last-child::before{display:none}
.tl-2 .tl-s[data-s="done"]::before{background:var(--pink)}
.tl-2 .tl-tx{flex:1;grid-template-columns:1fr auto;column-gap:10px;padding:8px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.tl-2 .tl-tx small{grid-column:1/-1}
.tl-2 .tl-s[data-s="next"] .tl-tx{border-color:var(--pink);background:var(--pink-tint)}
.tl-3 .tl{display:flex;flex-wrap:wrap;align-items:center;row-gap:10px}
.tl-3 .tl-s{display:flex;align-items:center}
.tl-3 .tl-dot{display:none}
.tl-3 .tl-tx{padding:7px 12px;border-radius:12px;background:var(--surface);border:1.5px solid var(--line)}
.tl-3 .tl-tx small{display:none}
.tl-3 .tl-s[data-s="done"] .tl-tx{background:var(--pink-tint);border-color:transparent}
.tl-3 .tl-s[data-s="next"] .tl-tx{border-color:var(--pink);box-shadow:0 0 0 3px rgba(var(--pk-rgb),.18)}
.tl-3 .tl-s[data-s="todo"] .tl-tx{border-style:dashed}
.tl-3 .tl-gap{display:inline-flex;align-items:center;gap:4px;padding:0 8px;font:700 11.5px var(--body);color:var(--muted);white-space:nowrap}
.tl-3 .tl-gap::before,.tl-3 .tl-gap::after{content:"";width:10px;height:2px;background:var(--line)}
.tl-gantt{position:relative;display:grid;gap:6px}
.tl-ax{display:flex;justify-content:space-between;margin-left:130px;margin-right:70px;font:700 11px var(--body);color:var(--muted)}
.tl-gr{display:grid;grid-template-columns:130px minmax(0,1fr) 70px;align-items:center;gap:0;min-height:30px}
.tl-gl{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13px}
.tl-gl .ic{width:15px;height:15px;color:var(--muted)}
.tl-gt{position:relative;height:18px;border-radius:6px;background:var(--sunken)}
.tl-gt i{position:absolute;top:0;bottom:0;border-radius:6px;background:var(--pink)}
.tl-gr[data-s="next"] .tl-gt i{background:repeating-linear-gradient(135deg,var(--pink) 0 6px,color-mix(in srgb,var(--pink) 55%,transparent) 6px 12px)}
.tl-gr[data-s="todo"] .tl-gt i{background:none;border:1.5px dashed var(--border)}
.tl-gr small{font:700 11.5px var(--body);color:var(--muted);padding-left:8px;white-space:nowrap}
.tl-now{position:absolute;top:16px;bottom:0;width:2px;background:var(--ink);font-style:normal}
.tl-now b{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font:800 10.5px var(--body);text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}

/* ---------- KB kanban ---------- */
.kbx{min-width:0;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.kbw{display:grid;grid-template-columns:repeat(6,minmax(170px,1fr));gap:10px;min-width:1060px}
.kb-col{display:grid;grid-template-rows:auto 1fr;gap:8px;padding:8px;border-radius:16px;background:var(--sunken);border:1px solid var(--line);align-content:start;min-height:280px;transition:background-color .2s,border-color .2s}
.kb-col.over{background:var(--pink-tint);border-color:var(--pink)}
.kb-h{display:flex;align-items:center;justify-content:space-between;padding:2px 4px}
.kb-h b{font:700 14px var(--display)}
.kb-n{font:800 17px var(--num);color:var(--muted)}
.kb-n small{font-size:13px;opacity:.7}
.kb-n.over{color:var(--bad-text)}
.kb-cards{display:grid;gap:8px;align-content:start}
.kb-c{padding:10px 10px 8px;display:grid;gap:6px;cursor:grab;user-select:none;-webkit-user-select:none}
.kb-c:active{cursor:grabbing}
.kb-c.dragging{opacity:.45}
.kb-c.kb-land{animation:cepop .35s var(--spring)}
.kb-ct{display:flex;align-items:center;gap:6px}
.kb-ct b{flex:1;min-width:0;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kb-c>small{font-size:12px;color:var(--muted);margin-top:-4px}
.kb-c .tag{font-size:11.5px;padding:3px 8px 3px 6px;justify-self:start}
.kb-cf{display:flex;align-items:center;justify-content:space-between;gap:6px}
.kb-cf .num{font-size:17px}
.kb-cf .vstack{font-size:11.5px;gap:6px;--vbg:var(--raised)}
.kb-cf em{font-style:normal;color:var(--warn);font-weight:700}
.kb-mv{width:26px;height:26px;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--muted);display:grid;place-items:center;cursor:pointer;flex:none}
.kb-mv .ic{width:14px;height:14px}
@media (hover:hover){.kb-mv:hover{color:var(--pink);border-color:var(--pink)}}
.kb-mv:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.kb-age{display:none}
.kb-2{display:grid;grid-template-columns:none;gap:8px}
.kb-lh,.kb-lane{display:grid;grid-template-columns:140px repeat(6,minmax(150px,1fr));gap:8px}
.kb-lh b{font:700 13px var(--display);padding:0 6px}
.kb-lane .kb-col{min-height:90px;grid-template-rows:none;gap:6px}
.kb-ln{display:grid;align-content:center;gap:6px;font:700 12.5px var(--body);color:var(--muted);padding:6px}
.kb-ln .vstack{--vbg:var(--canvas)}
.kb-2 .kb-c>small,.kb-2 .kb-c .tag{display:none}
.kb-3 .kb-col{padding:6px;min-height:0;gap:4px;border-radius:12px}
.kb-3 .kb-h{border-bottom:1px solid var(--line);padding-bottom:6px}
.kb-3 .kb-cards{gap:4px}
.kb-3 .kb-c{padding:6px 8px;gap:2px;border-radius:10px;box-shadow:none}
.kb-3 .kb-c>small,.kb-3 .kb-cf .vstack .grp{display:none}
.kb-3 .kb-c .tag{font-size:10.5px;padding:2px 6px}
.kb-3 .kb-cf .num{font-size:15px}
.kb-3 .kb-mv{width:22px;height:22px}
.kb-4 .kb-h{position:relative;padding-top:8px}
.kb-4 .kb-h::before{content:"";position:absolute;left:0;right:0;top:-2px;height:4px;border-radius:4px;background:var(--hero)}
.kb-4 .kb-age{display:flex;align-items:center;gap:6px;font:800 11px var(--body);color:var(--muted)}
.kb-age i{flex:1;height:4px;border-radius:4px;background:var(--sunken);position:relative;overflow:hidden}
.kb-age i::after{content:"";position:absolute;inset:0;transform-origin:left;transform:scaleX(var(--a));background:var(--good)}
.kb-4 .kb-c[data-age="4"] .kb-age i::after,.kb-4 .kb-c[data-age="3"] .kb-age i::after{background:var(--warn)}
.kb-4 .kb-c[data-age="6"]{box-shadow:0 0 0 1.5px var(--bad),0 12px 24px -16px var(--bad)}
.kb-4 .kb-c[data-age="6"] .kb-age{color:var(--bad-text)}
.kb-4 .kb-c[data-age="6"] .kb-age i::after{background:var(--bad)}

/* ---------- CL calendar ---------- */
.clw{padding:12px;display:grid;gap:6px;overflow:hidden;position:relative}
.cl-b{position:absolute;left:3px;right:3px;padding:5px 7px;border-radius:9px;background:var(--bt,var(--blue-tint));border-left:3px solid var(--bc,var(--blue));overflow:hidden;min-height:0}
.cl-b[data-k="pink"]{--bt:var(--pink-tint);--bc:var(--pink)}
.cl-b[data-k="good"]{--bt:var(--good-tint);--bc:var(--good)}
.cl-b[data-k="warn"]{--bt:var(--warn-tint);--bc:var(--warn)}
.cl-b b{display:block;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-b small{display:block;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-hd{display:grid;grid-template-columns:44px repeat(5,minmax(0,1fr));gap:4px;font:700 12.5px var(--body);color:var(--muted)}
.cl-hd span{display:flex;align-items:center;gap:6px;min-width:0;white-space:nowrap;overflow:hidden;--vbg:var(--raised)}
.cl-hd span.today{color:var(--pink)}
.cl-body{position:relative;display:grid;grid-template-columns:44px repeat(5,minmax(0,1fr));gap:4px;height:430px}
.cl-hrs{display:grid;grid-template-rows:repeat(9,1fr) 0;font:700 11px var(--body);color:var(--muted)}
.cl-hrs span{border-top:1px solid var(--line);padding-top:2px}
.cl-colm{position:relative;border-radius:10px;background:repeating-linear-gradient(180deg,var(--sunken) 0 calc(100%/9 - 1px),var(--line) calc(100%/9 - 1px) calc(100%/9))}
.cl-colm.today{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--pink) 45%,transparent)}
.cl-now{position:absolute;left:44px;right:0;top:var(--t);height:2px;background:var(--pink);z-index:2;font-style:normal;box-shadow:0 0 8px rgba(var(--pk-rgb),.6)}
.cl-now::before{content:"";position:absolute;left:-5px;top:-4px;width:10px;height:10px;border-radius:50%;background:var(--pink)}
.cl-now b{position:absolute;left:-44px;top:-8px;font:800 11px var(--body);color:var(--pink);background:var(--raised);padding:0 2px}
.cl-now.wk{left:calc(44px + (100% - 44px) / 5 + 2px);right:calc((100% - 44px) / 5 * 3)}
.cl-3{gap:12px}
.cl-day h4{margin:0 0 6px;font:700 13px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cl-ag{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;background:var(--surface);border:1px solid var(--line);margin-bottom:6px;--vbg:var(--surface)}
.cl-ag time{min-width:48px;font:800 16px var(--num);letter-spacing:.02em}
.cl-ag time small{display:block;font-size:12px;color:var(--muted)}
.cl-ag>i{width:4px;align-self:stretch;border-radius:4px;background:var(--bc,var(--blue))}
.cl-ag[data-k="pink"]{--bc:var(--pink)}.cl-ag[data-k="good"]{--bc:var(--good)}.cl-ag[data-k="warn"]{--bc:var(--warn)}
.cl-ag>span:not(.va){flex:1;min-width:0}
.cl-ag b{display:block;font-size:14px}
.cl-ag span small{font-size:12px;color:var(--muted)}
.cl-ag.past{opacity:.5}
.cl-ag.now{border-color:var(--pink);background:var(--pink-tint)}
.cl-4{gap:6px}
.cl-th,.cl-tr{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px;align-items:center}
.cl-hx{display:grid;grid-template-columns:repeat(9,1fr) 0;font:700 11px var(--body);color:var(--muted)}
.cl-hx span{border-left:1px solid var(--line);padding-left:3px}
.cl-tn{display:flex;align-items:center;gap:8px;font:700 13px var(--body);--vbg:var(--raised)}
.cl-track{position:relative;height:50px;border-radius:10px;background:repeating-linear-gradient(90deg,var(--sunken) 0 calc(100%/9 - 1px),var(--line) calc(100%/9 - 1px) calc(100%/9))}
.cl-track .cl-b{top:4px;bottom:4px;left:auto;right:auto}
.cl-now.h{top:28px;bottom:4px;left:calc(12px + 104px + (100% - 24px - 104px) * var(--t) / 100%);width:2px;height:auto;right:auto}
.cl-now.h b{left:-16px;top:-18px}

/* ---------- UP upload ---------- */
.upw{padding:14px;display:grid;gap:12px}
.upw-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.upw-h>.ic{color:var(--pink)}
.upw-h>div{flex:1;min-width:140px}
.upw-h b{display:block;font:700 16px var(--display)}
.upw-h small{font-size:12.5px;color:var(--muted)}
.up-add{cursor:pointer}
.up-add:focus-within{outline:3px solid var(--focus);outline-offset:3px}
.up-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.up-t{position:relative;margin:0;height:92px;border-radius:12px;overflow:hidden;background:#222;isolation:isolate}
.up-t[hidden]{display:none}
.up-t img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.up-t .gbadge{position:absolute;right:6px;top:6px;z-index:3;width:24px;height:24px;font-size:13px;background:color-mix(in srgb,var(--gc) 22%,#fff)}
.up-t figcaption{position:absolute;left:6px;right:6px;bottom:6px;z-index:3;font:700 11px var(--body);color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up-t.ing::after{content:"";position:absolute;inset:0;background:rgba(6,8,14,.45);z-index:1}
.up-pr{position:absolute;left:10px;right:10px;top:50%;z-index:3;height:6px;border-radius:6px;background:rgba(255,255,255,.3);overflow:hidden}
.up-pr i{display:block;height:100%;width:0;background:#fff;animation:upfill 1.4s var(--ease) forwards}
@keyframes upfill{to{width:100%}}
.up-t.done{animation:cepop .4s var(--spring)}
.up-t.done::before{content:"";position:absolute;left:6px;top:6px;z-index:3;width:22px;height:22px;border-radius:50%;background:var(--good) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/13px no-repeat}
.up-drop{display:grid;justify-items:center;gap:6px;padding:22px 16px;border-radius:16px;border:2px dashed var(--border);background:repeating-linear-gradient(135deg,transparent 0 12px,color-mix(in srgb,var(--sunken) 60%,transparent) 12px 24px);text-align:center;cursor:pointer;transition:border-color .2s,background-color .2s}
.up-drop .ic.big{width:30px;height:30px;color:var(--pink)}
.up-drop b{font-size:15px}
.up-drop small{font-size:12.5px;color:var(--muted)}
@media (hover:hover){.up-drop:hover{border-color:var(--pink)}}
.up-drop:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.up-cam{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 90px;gap:10px;align-items:center}
.up-vf{position:relative;height:210px;border-radius:16px;overflow:hidden;background:#111}
.up-hint{position:absolute;left:10px;bottom:10px;z-index:2;padding:5px 10px;border-radius:999px;background:rgba(10,12,18,.65);color:#fff;font:700 12px var(--body)}
.up-corner{position:absolute;inset:18px;border:2px solid rgba(255,255,255,.7);border-radius:10px;-webkit-mask:linear-gradient(#000 0 0) top left/22px 22px no-repeat,linear-gradient(#000 0 0) top right/22px 22px no-repeat,linear-gradient(#000 0 0) bottom left/22px 22px no-repeat,linear-gradient(#000 0 0) bottom right/22px 22px no-repeat;mask:linear-gradient(#000 0 0) top left/22px 22px no-repeat,linear-gradient(#000 0 0) top right/22px 22px no-repeat,linear-gradient(#000 0 0) bottom left/22px 22px no-repeat,linear-gradient(#000 0 0) bottom right/22px 22px no-repeat}
.up-shut{display:grid;place-items:center}
.up-sh{width:76px;height:76px;border-radius:50%;border:4px solid var(--ink);background:none;padding:4px;cursor:pointer}
.up-sh i{display:block;width:100%;height:100%;border-radius:50%;background:var(--pink);transition:transform .15s var(--ease)}
.up-sh:active i{transform:scale(.85)}
.up-sh:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.up-need{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.up-need .tag{font-size:12px}
.up-grid.strip{display:flex;overflow-x:auto;scrollbar-width:none}
.up-grid.strip .up-t{flex:none;width:96px;height:72px}
.up-fil{display:flex;gap:6px;flex-wrap:wrap}
.up-grid.mas{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:70px;grid-auto-flow:dense}
.up-grid.mas .up-t{height:auto}
.up-grid.mas .up-t:nth-child(1){grid-row:span 2;grid-column:span 2}
.up-grid.mas .up-t:nth-child(4){grid-row:span 2}
.up-pairs{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.up-pairs li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.up-pairs li.on{border-color:var(--pink);background:var(--pink-tint)}
.up-pairs li b{flex:1;font-size:14px}
.up-pairs .num{font-size:18px;color:var(--good)}
.up-pairs .ic{width:16px;height:16px;color:var(--muted)}

/* ---------- VP video ---------- */
.vpw{padding:14px;display:grid;gap:12px;position:relative}
.vp-h b{display:block;font:700 16px var(--display)}
.vp-h small{font-size:12.5px;color:var(--muted)}
.vp{--p:.3;position:relative;border-radius:16px;overflow:hidden;background:#05070B;color:#fff}
.vp-scr{position:relative;aspect-ratio:16/9;padding:12px}
.vp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;height:100%}
.vp-tile{position:relative;border-radius:12px;background:var(--tb);overflow:hidden;display:grid;place-items:center}
.vp-pt{width:44%;max-width:120px;aspect-ratio:1;border-radius:50%;overflow:hidden}
.vp-pt svg{width:100%;height:100%;display:block}
.vp-tile small{position:absolute;left:8px;bottom:6px;font:700 11.5px var(--body);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.vp-tile.spk{box-shadow:inset 0 0 0 3px #FF6EAA}
.vp-rec{position:absolute;left:18px;top:18px;display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.55);font:700 11px var(--body)}
.vp-rec .ic{width:10px;height:10px;color:#FF3B30}
.vp-cap{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);max-width:80%;padding:5px 10px;border-radius:8px;background:rgba(0,0,0,.72);font:600 13px/1.35 var(--body);text-align:center}
.vp-ctl{display:flex;align-items:center;gap:10px;padding:8px 12px 10px;background:linear-gradient(transparent,rgba(0,0,0,.4)),#0B0E14}
.vp-pl{width:40px;height:40px;border-radius:50%;border:0;background:#fff;color:#0B0E14;display:grid;place-items:center;cursor:pointer;flex:none}
.vp-pl .ic{width:18px;height:18px}
.vp-pl .i-pause{display:none}
.vp[data-play="on"] .vp-pl .i-play{display:none}
.vp[data-play="on"] .vp-pl .i-pause{display:block}
.vp-pl:focus-visible,.vp-sp:focus-visible,.vp-ib:focus-visible,.vp-bar:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.vp-t{font-size:15px;color:rgba(255,255,255,.7);white-space:nowrap}
.vp-t b{color:#fff}
.vp-bar{position:relative;flex:1;height:22px;cursor:pointer;touch-action:none}
.vp-bar::before{content:"";position:absolute;left:0;right:0;top:9px;height:4px;border-radius:4px;background:rgba(255,255,255,.22)}
.vp-f{position:absolute;left:0;top:9px;height:4px;width:calc(var(--p)*100%);border-radius:4px;background:#FF6EAA}
.vp-h{}
.vp-bar .vp-h{position:absolute;top:4px;left:calc(var(--p)*100%);width:14px;height:14px;margin-left:-7px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(255,110,170,.5)}
.vp-tk{position:absolute;top:7px;width:2px;height:8px;margin-left:-1px;background:rgba(255,255,255,.6)}
.vp-sp,.vp-ib{min-width:38px;height:32px;padding:0 8px;border-radius:8px;border:1px solid rgba(255,255,255,.2);background:none;color:#fff;font:800 12px var(--body);cursor:pointer;display:grid;place-items:center}
.vp-ib .ic{width:16px;height:16px}
.vp-side{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:12px;align-items:start}
.vp-tx{max-height:320px;overflow:auto;padding:10px}
.vp-tx .ln{opacity:.55;transition:opacity .3s}
.vp-tx .ln.now{opacity:1;background:linear-gradient(90deg,color-mix(in srgb,var(--rail) 18%,transparent),transparent 70%)}
.vp-tx .txt{font-size:13.5px}
.vp-chs{display:flex;gap:4px}
.vp-ch{flex:var(--w);min-width:0;display:grid;gap:2px;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);text-align:left;cursor:pointer;transition:background-color .2s,border-color .2s}
.vp-ch b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vp-ch small{font:800 13px var(--num);color:var(--muted)}
.vp-ch.on{background:var(--pink-tint);border-color:var(--pink)}
.vp-ch.on b{color:var(--pink)}
.vp-ch:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.vp-3 .vp-tk{top:3px;height:16px;width:3px;background:#FF6EAA}
.vp-4{min-height:420px}
.vp-notes{display:grid;gap:10px;padding-right:0}
.vp-notes h4{margin:0;font:700 15px var(--display)}
.vp-notes ul{margin:0;padding-left:18px;display:grid;gap:6px;font-size:14px;line-height:1.45}
.vp-sk{display:block;height:12px;border-radius:6px;background:var(--sunken);width:90%}
.vp-sk.s{width:60%}
.vp-mini{position:absolute;right:14px;bottom:14px;width:min(300px,62%);border-radius:16px;box-shadow:0 26px 50px -16px rgba(0,0,0,.7);animation:fadein .4s var(--ease)}
.vp-mini .vp-scr{padding:6px}
.vp-mini .vp-grid{gap:4px}
.vp-mini .vp-cap,.vp-mini .vp-rec,.vp-mini .vp-sp,.vp-mini .vp-ib,.vp-mini .vp-t{display:none}
.vp-mini .vp-pl{width:32px;height:32px}
.vp-x{position:absolute;right:8px;top:8px;width:30px;height:30px;border-radius:8px;border:0;background:rgba(0,0,0,.55);color:#fff;display:grid;place-items:center;cursor:pointer;transform:rotate(-45deg)}
.vp-x .ic{width:15px;height:15px}

/* ---------- ER errors ---------- */
.erw{display:grid;gap:12px;min-width:0}
.er-stage{min-height:360px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);display:grid;overflow:hidden}
.er-v{display:grid;justify-items:center;align-content:center;text-align:center;gap:8px;padding:24px 20px;animation:fadein .3s var(--ease)}
.er-v h4{margin:0;font:800 22px var(--display);letter-spacing:-.02em}
.er-v p{margin:0;max-width:44ch;color:var(--muted);font-size:14px;line-height:1.45}
.er-code{font:700 11px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.er-a{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.er-m{width:120px;height:120px;color:var(--pink)}
.er-big{font:800 132px/.85 var(--num);color:transparent;-webkit-text-stroke:2.5px var(--pink);letter-spacing:.01em;text-shadow:0 18px 40px rgba(var(--pk-rgb),.25)}
.er-draw{width:170px;height:110px}
.er-q{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:4px;text-align:left;width:min(360px,100%)}
.er-q li{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:10px;background:var(--sunken);font-size:13px;font-weight:600}
.er-q li .ic{width:15px;height:15px;color:var(--good)}
.er-q li small{margin-left:auto;color:var(--muted);font-size:11.5px}
.er-pg{display:grid;gap:12px;padding:14px;align-content:start}
.er-bg{border-radius:14px;background:var(--surface);border:1px solid var(--line);padding:14px}
.er-fk{display:grid;gap:8px}
.er-fk b{font:700 16px var(--display)}
.er-fk i{height:44px;border-radius:12px;background:var(--sunken)}
.er-fk i.s{width:60%}
.er-pg .er-q{width:100%}

/* ---------- PF profile ---------- */
.pfw{padding:14px;display:grid;gap:14px}
.pf-id{display:flex;align-items:center;gap:14px;--vbg:var(--raised)}
.pf-id b{display:block;font:800 20px var(--display);letter-spacing:-.02em}
.pf-id small{font-size:13px;color:var(--muted)}
.pf-1{grid-template-columns:170px minmax(0,1fr);align-items:start}
.pf-nav{display:grid;gap:2px;padding-right:10px;border-right:1px solid var(--line)}
.pf-ni{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;color:var(--muted);font-size:13.5px;font-weight:500}
.pf-ni .ic{width:16px;height:16px}
.pf-ni.on{background:var(--surface);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--pink)}
.pf-main{display:grid;gap:14px;min-width:0}
.pf-2{padding:0;overflow:hidden;gap:0}
.pf-cover{position:relative;height:110px;background:var(--hero);overflow:hidden}
.pf-cm{position:absolute;right:-14px;top:-6px;width:130px;height:130px;color:#fff;opacity:.95;transform:rotate(-8deg)}
.pf-card{display:grid;gap:12px;padding:0 14px 14px}
.pf-2 .pf-id{margin-top:-30px}
.pf-2 .pf-id .va{box-shadow:0 0 0 4px var(--raised);border-radius:50%}
.pf-2 .pf-id>div{padding-top:30px}
.pf-st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.pf-st>div{padding:8px 10px;border-radius:12px;background:var(--sunken);min-width:0}
.pf-st b{display:block;font-size:22px;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-st small{font-size:11.5px;color:var(--muted);font-weight:600}
.pf-grp h4{margin:0 0 6px 4px;font:700 11.5px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pf-3 .admin{background:var(--surface)}
.pf-3 .arow>.ic{color:var(--muted)}
.pf-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pf-tile{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;background:var(--surface);border:1px solid var(--line);min-width:0}
.pf-ti{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--pink-tint);color:var(--pink);flex:none}
.pf-ti .ic{width:18px;height:18px}
.pf-tile>div{flex:1;min-width:0}
.pf-tile b{display:block;font-size:14px}
.pf-tile small{font-size:12px;color:var(--muted)}

/* ---------- BR breadcrumbs ---------- */
.brw{display:grid;gap:12px;min-width:0}
.br-ctx{display:grid;gap:6px}
.br-page{position:relative;padding:14px 16px;border-radius:16px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);display:grid;gap:4px;min-width:0}
.br-page.ipadish{border-radius:22px;background:var(--surface)}
.br-t{font:800 24px var(--display);letter-spacing:-.02em}
.br-s{margin:0;font-size:13px;color:var(--muted)}
.br ol{list-style:none;margin:0;padding:0;display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:13.5px}
.br a{color:var(--muted);text-decoration:none;font-weight:600;border-radius:6px}
@media (hover:hover){.br a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}}
.br a:focus-visible,.br button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.br-1 li+li::before{content:"/";color:var(--border);margin-right:4px}
.br-1 b{font-weight:800}
.br-2 li{display:inline-flex;align-items:center;gap:4px}
.br-2 li>.ic{width:14px;height:14px;color:var(--border)}
.br-p{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--sunken);border:1px solid var(--line);font-size:12.5px}
.br-p .ic{width:13px;height:13px}
.br-2 a.br-p{color:var(--ink)}
.br-p.on{background:var(--pink-tint);border-color:color-mix(in srgb,var(--pink) 40%,transparent);color:var(--pink);font-weight:800}
.br-3 .br-back{display:inline-flex;align-items:center;gap:2px;color:var(--blue);font-size:15px;font-weight:700;margin-left:-4px}
.br-3 .br-back .ic{width:20px;height:20px}
.br-3 ~ .br-t{font-size:30px}
.br-4 li{position:relative;display:inline-flex;align-items:center}
.br-4 li+li::before{content:"/";color:var(--border);margin:0 6px 0 2px}
.br-4 button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:2px 8px;font:800 13px var(--body);cursor:pointer;display:inline-flex;align-items:center;gap:4px}
.br-4 button .ic{width:14px;height:14px}
.br-cur{background:var(--pink-tint)!important;border-color:color-mix(in srgb,var(--pink) 40%,transparent)!important;color:var(--pink)!important}
.br-menu{position:absolute;left:0;top:calc(100% + 6px);z-index:20;list-style:none;margin:0;padding:6px;min-width:170px;border-radius:12px;background:var(--raised);border:1px solid var(--line);box-shadow:0 22px 44px -16px var(--shc);display:none}
[aria-expanded="true"]+.br-menu{display:grid;gap:2px;animation:fadein .2s var(--ease)}
.br-menu li{padding:7px 10px;border-radius:8px;font-size:13.5px;font-weight:600}
.br-menu li::before{display:none}
.br-menu li.on{background:var(--pink-tint);color:var(--pink)}

/* ---------- AD admin density ---------- */
.adw{padding:0;overflow:hidden;--ad-row:64px;--ad-fs:19px;--ad-av:40px;--ad-pad:16px}
.ad-bar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.ad-bar>b{font:700 16px var(--display)}
.ad-bar>small{font-size:12.5px;color:var(--muted)}
.ad-sc{overflow-x:auto}
.ad-4 .ad-sc{max-height:240px;overflow-y:auto}
.adt{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--ad-fs)}
.adt th{position:sticky;top:0;z-index:2;background:var(--raised);text-align:left;font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:10px var(--ad-pad);border-bottom:1px solid var(--line);white-space:nowrap}
.adt td{height:var(--ad-row);padding:0 var(--ad-pad);border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle}
.adt .r{text-align:right}
.adt td.num{font-size:calc(var(--ad-fs) + 3px)}
.ad-who{display:flex;align-items:center;gap:10px;--vbg:var(--raised)}
.ad-who b{font-weight:700}
.ad-av{width:var(--ad-av);height:var(--ad-av);font-size:calc(var(--ad-av)*.34)}
.ad-ls{color:var(--muted);font-size:calc(var(--ad-fs) - 3px)}
.ad-ls.live{color:var(--pink);font-weight:700}
.ad-mo{border:0;background:none;color:var(--muted);font:800 14px var(--body);letter-spacing:1px;padding:6px 8px;border-radius:8px;cursor:pointer}
@media (hover:hover){.adt tbody tr:hover td{background:color-mix(in srgb,var(--pink-tint) 40%,transparent)}.ad-mo:hover{background:var(--sunken);color:var(--ink)}}
.ad-mo:focus-visible{outline:2px solid var(--focus)}
.ad-ck{width:44px}
.adt .ck{padding:4px;display:inline-flex}
.adt .ck .box{width:22px;height:22px;border-radius:7px}
.adt .ck .box svg{width:14px;height:14px}
.ad-2{--ad-row:52px;--ad-fs:15px;--ad-av:34px;--ad-pad:14px}
.ad-3{--ad-row:40px;--ad-fs:13.5px;--ad-av:26px;--ad-pad:12px}
.ad-3 .sw{--w:60px;--h:24px}
.ad-3 .sw-t{font-size:9.5px;padding:0 8px}
.ad-3 .adt .ck .box{width:18px;height:18px;border-radius:6px}
.ad-4{--ad-row:32px;--ad-fs:12.5px;--ad-av:20px;--ad-pad:10px}
.ad-4 .adt td{border-right:1px solid var(--line)}
.ad-4 .adt td:last-child{border-right:0}
.ad-4 .adt tbody tr:nth-child(even) td{background:var(--surface)}
.ad-4 .sw{--w:48px;--h:20px}
.ad-4 .sw-t{font-size:8.5px;padding:0 6px}
.ad-4 .adt .ck .box{width:16px;height:16px;border-radius:5px;border-width:1.5px}
.ad-4 .adt .ck .box svg{width:11px;height:11px}
.ad-4 .ad-who{gap:6px}
.ad-4 .va{padding:1.5px}
.ad-4 .adt th{padding-top:7px;padding-bottom:7px}

.pr-hint{display:none}.prs-5 .pr-hint{display:inline}
.cl-hrs span:last-child,.cl-hx span:last-child{visibility:hidden}
.vp-2 .vp-cap{display:none}
.vp-4 .vp-notes{padding-right:min(320px,64%)}

/* ---------- P4 / P5 composed preview ---------- */
#pwrap>.gseg{margin-bottom:14px}
.p4 .app-body{min-height:0}
.p4-logo{background:none;width:46px;height:46px}
.p4-logo .mico{width:46px;height:46px}
.p4-search{position:relative;flex:0 1 300px;min-width:0}
.p4-search .sr-in{height:44px;background:var(--sunken)}
.p4-search .sr-pop{display:none;position:absolute;left:0;top:calc(100% + 8px);margin:0;width:min(380px,90vw);z-index:30}
.p4-search:focus-within .sr-pop{display:block}
.p4 .app-top .nb-bell{width:44px;height:44px}
.p4 .side .nav-i{border:0;background:none;width:100%;cursor:pointer;font:inherit;font-size:15px;text-align:left;color:var(--muted)}
.p4 .side .nav-i>span{flex:1;min-width:0}
.p4 .side .nav-i.on{background:var(--raised);color:var(--ink);font-weight:700;box-shadow:inset 3px 0 0 var(--pink)}
@media (hover:hover){.p4 .side .nav-i:hover{color:var(--ink)}}
.p4 .side .nav-i:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.p4 .side .collapse{cursor:default}
.p4main{position:relative;padding:24px;min-width:0}
.p4pg{display:none;gap:20px;min-width:0;position:relative}
.p4[data-pv="today"] .p4pg[data-pg="today"],.p4[data-pv="svc"] .p4pg[data-pg="svc"],.p4[data-pv="tv"] .p4pg[data-pg="tv"]{display:grid;animation:fadein .3s var(--ease)}
.p4hero{grid-template-columns:minmax(0,1fr);padding-right:190px;min-height:220px}
.p4hc{position:relative;z-index:1}
.p4-peek{position:absolute;right:-24px;bottom:-46px;width:200px;height:200px;color:#fff;transform:rotate(-8deg);filter:drop-shadow(0 16px 22px rgba(0,0,0,.35))}
.p4-peek .msc{animation:msbob 3.4s ease-in-out infinite}
.p4g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.p4g2{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:20px;align-items:start}
.p4col{display:grid;gap:20px;min-width:0;align-content:start}
.p4c .card-b{gap:14px}
.p4pr{padding:0;border:0;background:none;box-shadow:none}
.p4acg{grid-template-columns:repeat(4,minmax(0,1fr))}
.p4acg .acb{padding:10px 4px 8px}
.p4acg .acb-art{width:52px;height:52px}
.acs-6 .p4acg .acb-art{width:44px;height:58px}
.p4acg .acb>b{font-size:12.5px}
.p4ph .phx.big{min-height:220px}
.p4 .ce-layer{border-radius:22px}
.p4kb{display:grid;gap:10px;min-width:0}
.p4 .br{margin-bottom:-8px}
.p4 .tvw{padding-top:4px}
.p4.ais-1 .ph-copy{background:var(--surface)!important;color:var(--ink)!important;border-right:1px solid var(--line)}
.p4.ais-1 .ph-copy .ph-eye{color:var(--pink)}
.p4.ais-1 .ph-art{color:var(--pink)!important}
.p4.ais-1 .card{background:var(--raised);border:1px solid var(--line)}
.p4.ais-1 .nb-c{filter:saturate(.2)}
.p4.ais-3 .p4pg .card .num,.p4.ais-3 .ph-stats b,.p4.ais-3 .pg-a{color:var(--pink)}
.p4.ais-3 .side .nav-i.on{background:var(--pink-tint);color:var(--pink)}
.p4.ais-3 .ph{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--pink) 50%,transparent),var(--card-sh)}
.p4.ais-4 .app-body{background:color-mix(in srgb,var(--pink-tint) 50%,var(--canvas))}
.p4.ais-4 .side{background:color-mix(in srgb,var(--pink-tint) 35%,var(--side-bg))}
.p4.ais-4 .side .nav-i.on{background:var(--hero);color:#fff;box-shadow:0 10px 20px -10px rgba(var(--pk-rgb),.9)}
.p4.ais-4 .p4pg .card .num,.p4.ais-4 .ph-stats b,.p4.ais-4 .pg-a{color:var(--pink);text-shadow:0 0 16px rgba(var(--pk-rgb),.5)}
.p4.ais-4 .ph-stats{background:var(--pink-tint)}
.p4.ais-4 .btn.p{--p-bg:var(--pink-deep);--p-fg:#fff}
.p4.ais-4 .btn.p .ic{color:#fff}

@media (max-width:1100px){
  .p4g,.p4g2{grid-template-columns:1fr}
  .em-stage{grid-template-columns:1fr}
  .em-ph{max-width:300px;justify-self:center}
}
@media (max-width:900px){
  .lock4{display:none}
  .p4main{padding:16px}
  .p4hero{padding-right:120px}
  .p4-peek{width:150px;height:150px}
  .p4-search{display:none}
  .ms-grid{grid-template-columns:1fr 1fr}
  .vp-side{grid-template-columns:1fr}
  .pf-1{grid-template-columns:1fr}
  .pf-nav{display:flex;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--line);padding:0 0 8px}
  .other{display:none}
}
@media (max-width:700px){
  .ms-grid{grid-template-columns:1fr}
  .ms-poses{grid-template-columns:1fr}
  .ms-hero{grid-template-columns:minmax(0,1fr) 110px}
  .ms-art{width:110px;height:110px}
  .nb-body{grid-template-columns:1fr}
  .nb-nav{display:none}
  .acg{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ph-main{grid-template-columns:1fr}
  .ph-th{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sil-2{grid-template-columns:1fr}
  .sil-2 .si-deco{min-height:160px}
  .dt-g1{grid-template-columns:1fr}
  .dt-smart{grid-template-columns:1fr}
  .prs-4 .prg{grid-template-columns:1fr}
  .pf-tiles,.pf-st{grid-template-columns:1fr 1fr}
  .p4acg{grid-template-columns:repeat(2,minmax(0,1fr))}
  .aim{grid-template-columns:1fr}
  .aim-side{display:none}
}
@media (prefers-reduced-motion:reduce){
  .tv-tw span{animation:none}
  .ce-conf{display:none}
}
@media (max-width:900px){.intro .intro-art{width:120px;height:120px}}
.p4 .side .nav-i>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


/* ================= ROUND 6: page layouts (placement only; every component above is used as-is) ================= */
/* ---------- row chrome ---------- */
.lock6{grid-template-columns:auto auto}
.lock6 .ic{grid-row:1/3}
.sec-h .vtog{margin-left:auto;flex:none}
.sec-h .vtog~.sec-count{margin-left:0}
.opts6{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.opts6.ph390{grid-template-columns:repeat(auto-fill,minmax(min(100%,432px),1fr));gap:20px}
.opts6.ip2up{grid-template-columns:repeat(auto-fill,minmax(min(100%,600px),1fr));gap:20px}
.stage6{min-width:0;display:grid}
.ph390 .stage6{justify-items:center}
.l6note{display:flex;align-items:flex-start;gap:10px;margin:0;padding:10px 12px;border-radius:12px;background:var(--sunken);border:1px solid var(--line);font-size:13.5px;line-height:1.45;color:var(--muted)}
.l6note .ic{width:16px;height:16px;margin-top:2px;color:var(--pink)}
.l6note b{color:var(--ink);white-space:nowrap}
.l6keys{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.l6keys span{font:800 13px var(--num);letter-spacing:.04em;padding:2px 8px;border-radius:999px;background:var(--sunken);border:1px solid var(--line);color:var(--muted)}

/* ---------- shell ---------- */
.l6{--gap6:20px}
.l6 .app-body{min-height:0}
.l6main{container:l6 / inline-size;display:grid;gap:var(--gap6);align-content:start;min-width:0}
.l6main>*{min-width:0}
.l6 .side .nav-i{padding:11px 14px}
.l6tabs{display:none}

/* ---------- layout grids (placement only) ---------- */
.g6{display:grid;gap:var(--gap6);min-width:0;align-items:start}
.g6>*{min-width:0}
.c6{display:grid;gap:var(--gap6);min-width:0;align-content:start}
.c6>*{min-width:0}
.g6.st{align-items:stretch}
.g6-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g6-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g6-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g6-21{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.g6-12{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.g6-32{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
.g6-311{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)}
.g6-131{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr)}
.g6-r{grid-template-columns:minmax(0,1fr) minmax(280px,320px)}
.g6-l{grid-template-columns:minmax(260px,300px) minmax(0,1fr)}
.g6-lr{grid-template-columns:minmax(230px,260px) minmax(0,1fr) minmax(270px,300px)}
.s2{grid-column:span 2}.s3{grid-column:span 3}.sa{grid-column:1/-1}
.r2{grid-row:span 2}.r3{grid-row:span 3}
@container l6 (max-width:980px){
  .g6-lr{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .g6-lr>:first-child{grid-column:1/-1}
  .g6-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g6-4>.s3,.g6-4>.s2{grid-column:1/-1}
  .g6-311,.g6-131{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g6-311>:first-child,.g6-131>:nth-child(2){grid-column:1/-1}
}
@container l6 (max-width:760px){
  .g6{grid-template-columns:minmax(0,1fr)!important}
  .g6>*{grid-column:auto!important;grid-row:auto!important}
}

/* ---------- small layout helpers built on locked parts ---------- */
.h6{display:flex;align-items:center;gap:10px;min-width:0}
.h6>b{font:700 17px var(--display);letter-spacing:-.01em;flex:1;min-width:0}
.h6 .hint{white-space:nowrap}
.acts6{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.stickbar{position:sticky;bottom:0;z-index:4}
.l6 .p4hero{min-height:0}
.p4hero.cmp{padding:18px 190px 18px 24px}
.p4hero.cmp h2{font-size:clamp(1.5rem,2.4vw,2rem);margin:4px 0 4px}
.p4hero.cmp .hero-stats{margin-top:10px}
.p4hero.cmp .hero-stats div{padding:7px 12px;min-width:92px}
.p4hero.cmp .hero-stats b{font-size:24px}
.p4hero.cmp .p4-peek{width:160px;height:160px;bottom:-40px}
.p4hero .hero-next{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding:10px 12px;border-radius:16px;background:rgba(0,0,0,.16);border:1px solid rgba(255,255,255,.22);max-width:560px}
.p4hero .hero-next b{font:700 15px var(--display)}
.p4hero .hero-next small{display:block;font-size:13px;opacity:.9}
.p4hero .hero-next span{flex:1;min-width:0}
.p4hero .btn.p{--p-bg:#fff;--p-fg:#9C1A56}
.p4hero .btn.p .ic{color:#E0327F}

/* next rep + recommended */
.rep6 q{display:block;font:700 19px/1.3 var(--display);letter-spacing:-.01em;quotes:"\201C" "\201D"}
.rep6 .who6{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.rep6 .who6 .av{width:30px;height:30px;font-size:11px}
.meta6{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--muted);font-weight:600}
.meta6 b{color:var(--ink);font-family:var(--num);font-size:18px;font-weight:800;letter-spacing:.01em}
.rec6{display:flex;gap:14px;align-items:flex-start}
.rec6 .rec6-art{width:64px;height:64px;border-radius:16px;flex:none;display:grid;place-items:center;background:var(--pink-tint);color:var(--pink)}
.rec6 .rec6-art .ic{width:30px;height:30px}
.rec6 p{margin:2px 0 0;font-size:14px;color:var(--muted)}
.rec6 b{font:700 16px var(--display)}

/* streak */
.stk6{display:flex;align-items:center;gap:14px}
.stk6 .fl{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:var(--warn-tint);color:var(--warn);flex:none}
.stk6 .fl .ic{width:28px;height:28px}
.stk6 .n{font:800 44px/1 var(--num);letter-spacing:.01em}
.stk6 small{display:block;font-size:13px;color:var(--muted);font-weight:600}
.days6{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.days6 span{display:grid;justify-items:center;gap:4px;font:700 11px var(--body);color:var(--muted)}
.days6 i{width:100%;max-width:34px;aspect-ratio:1;border-radius:10px;background:var(--sunken);border:1px solid var(--line);display:grid;place-items:center}
.days6 i.on{background:var(--warn-tint);border-color:color-mix(in srgb,var(--warn) 50%,transparent);color:var(--warn)}
.days6 i.now{box-shadow:0 0 0 2px var(--pink)}
.days6 i .ic{width:14px;height:14px}

/* path (TL1 dots, reused for the learning path) */
.path6 .tl-1 .tl-tx small{display:none}
.path6 .tlw{padding:0;border:0;background:none;box-shadow:none}

/* tabs area */
.tp6{display:none}
.tp6.on{display:grid;gap:var(--gap6);animation:fadein .3s var(--ease)}

/* ---------- service board ---------- */
.stg6{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;min-width:0}
.stg6>section{display:grid;gap:10px;align-content:start;min-width:0;padding:10px;border-radius:16px;background:var(--sunken);border:1px solid var(--line)}
.stg6 header{display:flex;align-items:center;gap:8px;padding:2px 4px}
.stg6 header b{font:700 14px var(--display);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stg6 header .n{font:800 18px var(--num);color:var(--muted)}
.stg6 .mtile{font-size:14px}
.stg6 .mtile .card-h{gap:8px}
.stg6 .mtile .job-who b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stg6 .mtile .job-who small{display:block;line-height:1.3}
.stg6 .mtile .tags{flex-wrap:wrap}
.stg6.rows{grid-template-columns:minmax(0,1fr)}
.stg6.rows>section{grid-template-columns:150px minmax(0,1fr);align-items:center}
.stg6.rows>section .tl6{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.stg6 .tl6{display:grid;gap:10px}
.stgw6{container:stg / inline-size;min-width:0}
@container stg (max-width:960px){.stg6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container stg (max-width:620px){.stg6{grid-template-columns:repeat(2,minmax(0,1fr))}.stg6.rows>section{grid-template-columns:minmax(0,1fr)}}
@container stg (max-width:380px){.stg6{grid-template-columns:minmax(0,1fr)}}
.alp6{display:grid;gap:10px;align-content:start}
.alp6 .al{padding:12px}
.alp6 .al-t{flex-basis:160px}
.alp6 .al-t b{font-size:15px}
.alp6 .al-t small{font-size:13px}
.alp6.strip{grid-template-columns:repeat(3,minmax(0,1fr))}
@container l6 (max-width:900px){.alp6.strip{grid-template-columns:minmax(0,1fr)}}

/* per-tech Previous · Working · Next */
.pwn6{display:grid;gap:8px;min-width:0}
.pwn6-h,.pwn6-r{display:grid;grid-template-columns:150px repeat(3,minmax(0,1fr));gap:10px;align-items:center}
.pwn6-h{font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:0 6px}
.pwn6-r{padding:8px 6px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.pwn6-t{display:flex;align-items:center;gap:10px;min-width:0}
.pwn6-t b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pwn6-c{display:grid;gap:1px;min-width:0;padding:6px 10px;border-radius:10px;font-size:13px;border-left:3px solid var(--line)}
.pwn6-c b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pwn6-c small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pwn6-c.p{opacity:.72}
.pwn6-c.w{background:var(--pink-tint);border-left-color:var(--pink)}
.pwn6-c.w small{color:var(--ink)}
.pwn6-c.x{border-left-color:var(--blue)}
.pwn6-c.late{background:var(--bad-tint);border-left-color:var(--bad)}
.pwn6.cmp .pwn6-h,.pwn6.cmp .pwn6-r{grid-template-columns:120px repeat(3,minmax(0,1fr))}
.pwnw6{container:pwn / inline-size;min-width:0}
@container pwn (max-width:640px){
  .pwn6-h{display:none}
  .pwn6-r,.pwn6.cmp .pwn6-r{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .pwn6-t{grid-column:1/-1}
  .pwn6-c.p{display:none}
}
.mini6 .mpw{aspect-ratio:auto}
.mini6 .mpleg{display:none}
.mini6.leg .mpleg{display:flex}

/* ---------- job lift-out ---------- */
.lx6{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--canvas);isolation:isolate;height:var(--lxh,820px)}
.lx6 .mboard{padding:14px;filter:saturate(.8)}
.lx6 .mlayer{top:0;height:100%}
.lx6.wide .mdet{width:min(880px,94%)}
.lx6 .md-b{gap:14px}
.lx6 .md-b>*{min-width:0}
.lx6 .md-b .pc,.lx6 .md-b .xt,.lx6 .md-b .pb,.lx6 .md-b .rec,.lx6 .md-b .cuc{box-shadow:none}
.mdg6{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.mdg6>div{display:grid;gap:14px;min-width:0;align-content:start}
.sec6{display:grid;gap:8px;min-width:0}
.sec6>.ctx-l{margin:0}
.md-h .tags{margin-left:auto}
.cbc6{list-style:none;margin:0;padding:0;display:grid;gap:0}
.cbc6 li{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 0}
.cbc6 li+li{border-top:1px solid var(--line)}
.cbc6 .k{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:800 14px var(--num);background:var(--sunken);color:var(--muted);border:1px solid var(--line)}
.cbc6 .k .ic{width:15px;height:15px}
.cbc6 li[data-s="done"] .k{background:var(--good-tint);color:var(--good);border-color:transparent}
.cbc6 li[data-s="now"] .k{background:var(--pink);color:var(--pink-on);border-color:transparent;box-shadow:0 0 0 4px rgba(var(--pk-rgb),.2)}
.cbc6 li[data-s="miss"] .k{background:var(--bad-tint);color:var(--bad-text);border-color:transparent}
.cbc6 b{font-size:14px;display:block}
.cbc6 small{font-size:12.5px;color:var(--muted);display:block}
.cbc6 time{font:700 12.5px var(--body);color:var(--muted);font-variant-numeric:tabular-nums}
.split6{display:grid;grid-template-columns:minmax(260px,300px) minmax(0,1fr);gap:0;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--raised);min-width:0}
.split6>aside{display:grid;gap:10px;align-content:start;padding:12px;background:var(--sunken);border-right:1px solid var(--line)}
.split6>aside .mtile.sel{box-shadow:0 0 0 2px var(--pink),0 16px 30px -18px rgba(var(--pk-rgb),.8)}
.split6>.pane{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-width:0}
.split6 .md-b{overflow:visible}
@container l6 (max-width:760px){
  .split6{grid-template-columns:minmax(0,1fr)}
  .split6>aside{display:none}
  .mdg6{grid-template-columns:minmax(0,1fr)}
  .lx6 .mdet{width:100%!important;border-radius:0}
  .lx6 .mboard{display:none}
}
.pagehd6{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 16px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh)}
.pagehd6 .av{width:48px;height:48px;font-size:15px}
.pagehd6 .t{flex:1;min-width:180px}
.pagehd6 .t b{display:block;font:800 22px var(--display);letter-spacing:-.02em}
.pagehd6 .t small{color:var(--muted);font-size:13.5px}

/* ---------- full visit ---------- */
.talk6{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px;border-radius:20px;background:color-mix(in srgb,var(--raised) 92%,transparent);border:1px solid var(--line);box-shadow:0 -10px 30px -18px var(--shc),var(--card-sh);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.talk6 .hold{flex:1 1 220px;min-height:56px;font-size:16px}
.talk6 .t6{display:grid;min-width:0;padding:0 6px}
.talk6 .t6 small{font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.talk6 .t6 b{font:800 22px/1 var(--num);letter-spacing:.02em}
.talk6 .dot6{width:10px;height:10px;border-radius:50%;background:var(--disabled);flex:none}
.talk6.on .dot6{background:var(--rec);animation:recpulse 1.4s ease-out infinite}
.talk6.paused .dot6{background:var(--warn)}
.talk6.v{flex-direction:column;align-items:stretch}
.talk6.v .hold{flex:none;min-height:88px;font-size:18px}
.home6{position:relative;border-radius:16px;overflow:hidden;background:var(--sunken);border:1px solid var(--line)}
.home6 svg{display:block;width:100%;height:auto}
.home6 .rm{fill:var(--raised);stroke:var(--border);stroke-width:1.5}
.home6 .rm.cur{fill:var(--pink-tint);stroke:var(--pink);stroke-width:2.5}
.home6 .rm.done{fill:color-mix(in srgb,var(--raised) 80%,var(--good-tint))}
.home6 text{font:700 11px var(--body);fill:var(--muted)}
.home6 .rm.cur+text,.home6 text.cur{fill:var(--ink)}
.home6 .gd{font:800 15px var(--num)}
.home6 .gd[data-g="F"]{fill:var(--bad-text)}.home6 .gd[data-g="D"]{fill:var(--warn)}.home6 .gd[data-g="B"],.home6 .gd[data-g="A"]{fill:var(--good)}.home6 .gd[data-g="C"]{fill:var(--warn)}
.home6 .you{fill:var(--pink)}
.home6 .youh{fill:var(--pink);opacity:.25;animation:recpulse 1.6s ease-out infinite}
.home6-l{display:flex;flex-wrap:wrap;gap:6px 12px;padding:8px 12px;font-size:12px;color:var(--muted);font-weight:600;border-top:1px solid var(--line);background:var(--raised)}
.cds6{display:grid;gap:14px;min-width:0}
.cds6.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.cdw6{container:cdw / inline-size;min-width:0}
@container cdw (max-width:600px){.cds6.two{grid-template-columns:minmax(0,1fr)}}
.fvx6 .xt{max-height:420px;overflow:auto}
.fvx6.tall .xt{max-height:none}
.tray6{display:grid;gap:12px;padding:14px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}

/* ---------- rebuttal rep ---------- */
.line6{position:relative;display:grid;gap:14px;padding:22px;border-radius:22px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);overflow:hidden}
.line6 .who{display:flex;align-items:center;gap:12px}
.line6 .who .av{width:44px;height:44px}
.line6 .who b{display:block;font:700 16px var(--display)}
.line6 .who small{color:var(--muted);font-size:13px}
.line6 q{display:block;font:800 clamp(1.4rem,2.6vw,2.1rem)/1.15 var(--display);letter-spacing:-.025em;quotes:"\201C" "\201D"}
.line6 .ctx6{font-size:14px;color:var(--muted);margin:0}
.line6.big q{font-size:clamp(1.8rem,3.4vw,2.8rem)}
.bigtalk6{display:grid;justify-items:center;gap:10px;padding:18px;text-align:center}
.bigtalk6 .hold{width:min(360px,100%);min-height:96px;font-size:19px;border-radius:24px}
.bigtalk6 .hold .ic{width:26px;height:26px}
.bigtalk6 .hint{max-width:40ch}
.hist6{display:flex;align-items:flex-end;gap:6px;height:56px}
.hist6 i{flex:1;border-radius:6px 6px 2px 2px;background:color-mix(in srgb,var(--blue) 40%,transparent);height:var(--h)}
.hist6 i.last{background:var(--pink)}
.chat6 .xt{box-shadow:none}

/* ---------- overview ---------- */
.help6{display:grid;gap:10px}
.help6 .hr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.help6 .hr b{display:block;font-size:14.5px}
.help6 .hr small{display:block;font-size:13px;color:var(--muted)}
.help6 .hr .acts6{gap:6px}
@container l6 (max-width:560px){.help6 .hr{grid-template-columns:auto minmax(0,1fr)}.help6 .hr .acts6{grid-column:1/-1}}
.cbct6{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px}
.cbct6 th{font:700 11px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;padding:0 8px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.cbct6 td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
.cbct6 tr:last-child td{border-bottom:0}
.cbct6 .who{display:flex;align-items:center;gap:8px;white-space:nowrap}
.cbct6 .r{text-align:right}
.cbct6 .num{font-size:18px}
.dots6{display:inline-flex;gap:4px}
.dots6 i{width:14px;height:14px;border-radius:4px;background:var(--sunken);border:1px solid var(--line)}
.dots6 i.y{background:var(--good);border-color:transparent}
.dots6 i.n{background:var(--bad);border-color:transparent}
.dots6 i.h{background:var(--warn);border-color:transparent}
.tscroll6{overflow-x:auto;min-width:0}
.kpis6{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpis6>div{padding:14px 16px;border-radius:16px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.kpis6 b{display:block;font:800 34px/1 var(--num);letter-spacing:.01em}
.kpis6 small{display:block;font-size:12.5px;color:var(--muted);font-weight:600;margin-top:4px}
.kpis6 .d{font:700 12px var(--body);color:var(--good)}
.kpis6 .d.dn{color:var(--bad-text)}
@container l6 (max-width:760px){.kpis6{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- leaderboards ---------- */
.l6 .lbw .lbw-h .gseg{display:none}
.lbw.cmp6 .lbr .nm small{display:none}
.lbw.cmp6 .lbr{grid-template-columns:30px var(--avs) minmax(0,1fr) auto}
.lbw.cmp6 .tr{display:none}
.lbw.cmp6 .lbr .val{font-size:19px}
.lbw.cmp6 .medal{width:24px;height:24px;font-size:13px}
.me6{display:grid;gap:14px}
.me6 .gap6{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted);font-weight:600}
.me6 .gap6 b{color:var(--ink)}
.acg.four6{grid-template-columns:repeat(4,minmax(0,1fr))}
@container l6 (max-width:560px){.acg.four6{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- reviews ---------- */
.rsum6{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center}
.rsum6 .big{font:800 64px/.9 var(--num);letter-spacing:.01em}
.rsum6 .big small{display:block;font:600 12.5px var(--body);color:var(--muted);letter-spacing:0;margin-top:6px}
.rbar6{display:grid;gap:5px}
.rbar6 div{display:grid;grid-template-columns:22px minmax(0,1fr) 30px;gap:8px;align-items:center;font:700 12.5px var(--body);color:var(--muted)}
.rbar6 i{height:8px;border-radius:8px;background:var(--sunken);overflow:hidden;position:relative}
.rbar6 i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--pink),var(--blue));transform-origin:left;transform:scaleX(var(--p))}
.rv6{display:grid;gap:8px}
.rv6 .rvh{display:flex;align-items:center;gap:10px;min-width:0}
.rv6 .rvh .t{flex:1;min-width:0}
.rv6 .rvh b{display:block;font-size:14.5px}
.rv6 .rvh small{display:block;color:var(--muted);font-size:12.5px}
.rv6 .stars{color:var(--warn);letter-spacing:2px;font-size:15px;white-space:nowrap}
.rv6 p{margin:0;font-size:14.5px;line-height:1.5}
.rv6 .ft{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rv6 .ft .spacer{flex:1}
.rvl6{display:grid;gap:12px}
.rvl6.two{grid-template-columns:repeat(2,minmax(0,1fr))}
@container l6 (max-width:760px){.rvl6.two{grid-template-columns:minmax(0,1fr)}}
.rvi6{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.rvi6 li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:var(--surface);cursor:default}
.rvi6 li.on{background:var(--pink-tint);border-color:var(--pink);box-shadow:inset 3px 0 0 var(--pink)}
.rvi6 li b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rvi6 li small{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rvi6 .stars{color:var(--warn);font-size:12px;letter-spacing:1px}
.ment6{display:grid;gap:8px}
.ment6 div{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;font-size:14px}
.ment6 .num{font-size:22px}

/* ---------- admin ---------- */
.cost6 .tick{display:flex;align-items:baseline;gap:10px}
.cost6 .tick b{font:800 44px/1 var(--num);letter-spacing:.01em}
.cost6 .tick small{color:var(--muted);font-weight:600}
.cost6 ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.cost6 li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13.5px}
.cost6 li .bar{grid-column:2/3;height:6px;border-radius:6px;background:var(--sunken);overflow:hidden;position:relative;margin-top:4px}
.cost6 li .bar::after{content:"";position:absolute;inset:0;background:var(--pink);transform-origin:left;transform:scaleX(var(--p))}
.cost6 li>span{min-width:0}
.cost6 li b{font-size:13.5px}
.cost6 li .num{font-size:18px}
.l6 .pf-tiles{min-width:0}
.l6 .adw{min-width:0}
.l6 .fm{box-shadow:none}

/* ---------- iPad My Work ---------- */
.ipx.l6ip .ip-main{overflow:hidden;display:grid;gap:16px;align-content:start}
.ipx.l6ip .ipv{display:grid}
.ip6-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:16px;align-items:start}
.ip6-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ipx .mpc .mp-foot{font-size:14px}
.ipx .pc{font-size:15px}
.ip6-day{list-style:none;margin:0;padding:0;display:grid;gap:0}
.ip6-day li{display:grid;grid-template-columns:86px 18px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0}
.ip6-day li+li{border-top:1px solid var(--line)}
.ip6-day time{font:800 22px var(--num);color:var(--muted);text-align:right}
.ip6-day i{width:14px;height:14px;border-radius:50%;background:var(--raised3);justify-self:center}
.ip6-day li.done{opacity:.55}
.ip6-day li.done i{background:var(--good)}
.ip6-day li.now i{background:var(--pink);box-shadow:0 0 0 5px rgba(var(--pk-rgb),.22)}
.ip6-day li.now time{color:var(--pink)}
.ip6-day b{display:block;font-size:18px}
.ip6-day small{color:var(--muted);font-size:15px}
.ipq6{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- phone 390 preview ---------- */
.ph390 .shell{width:390px;max-width:100%;border-radius:34px;border-width:6px;border-color:var(--raised3)}
.ph390 .app-top{padding:10px 14px}
.ph390 .app-body{grid-template-columns:minmax(0,1fr)}
.ph390 .side{display:none}
.ph390 .ownersel,.ph390 .p4-search{display:none}
.ph390 .p4main{padding:14px 12px 96px}
.ph390 .l6tabs{display:flex;position:absolute;left:0;right:0;bottom:0;z-index:8;justify-content:space-around;padding:8px 6px 14px;background:color-mix(in srgb,var(--surface) 92%,transparent);border-top:1px solid var(--line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.l6tabs span{display:grid;justify-items:center;gap:2px;font:600 10.5px var(--body);color:var(--muted);min-width:56px}
.l6tabs span .ic{width:22px;height:22px}
.l6tabs span.on{color:var(--pink)}
.ph390 .ph{grid-template-columns:minmax(0,1fr)!important}
.ph390 .ph-copy{grid-row:auto}
.ph390 .ph-stats b{font-size:26px}
.ph390 .p4hero{padding:20px 110px 20px 20px}
.ph390 .p4hero .hero-stats div{min-width:0;padding:8px 10px}
.ph390 .p4hero .hero-stats b{font-size:22px}
.ph390 .p4-peek{width:130px;height:130px;right:-26px;bottom:-30px}
.ph390 .stickbar{bottom:78px}
.ph390 .talk6 .t6{display:none}
.ph390 .lx6{--lxh:720px}
.ph390 .kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
.ph390 .kpis b{font-size:22px}
.ph390 .pf-tiles{grid-template-columns:minmax(0,1fr)}
.ph390 .acg{grid-template-columns:repeat(2,minmax(0,1fr))}
.ph390 .rmc{max-width:100%}

@media (max-width:900px){
  .sec-h .vtog{margin-left:0}
  .opts6.ip2up{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:600px){
  .ph390 .shell{border-width:1px;border-radius:22px}
}

/* ---------- fixes after first screenshots ---------- */
.alp6 .al-a{flex-basis:100%;padding-left:46px}
.lx6 .mtile{font-size:14px}
.lx6 .mtile .card-h{gap:8px}
.lx6 .mtile .job-who b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lx6 .mtile .job-who small{display:block;line-height:1.3}
.l6 .rmc-a{min-width:0}
.l6 .rmc-a .btn{max-width:100%;white-space:normal}
.help6 .hr{grid-template-columns:auto minmax(0,1fr)}
.help6 .hr .acts6{grid-column:2}
.cost6 li>span{display:grid;gap:5px}
.cost6 li .bar{display:block;margin-top:0}
.rv6-c .card-b{padding:14px 16px}
.ph390 .path6 .tl-tx time{display:none}
.ph390 .path6 .tl-tx b{font-size:11.5px;line-height:1.2}
.ph390 .lx6 .md-a .btn{min-height:38px}


/* ================= ROUND 7: pages not yet designed (placement + page parts built from the same tokens; every component above is used as-is) ================= */
/* ---------- copied verbatim from design/PACK-STUDIO.html (its page layout) ---------- */
.nav-sub{display:grid;gap:2px;margin:2px 0 6px 34px}
.nav-sub button{display:flex;align-items:center;gap:8px;padding:8px 12px;border:0;border-radius:10px;background:none;color:var(--muted);font:600 14px var(--body);cursor:pointer;text-align:left}
.nav-sub button[aria-current="page"]{color:var(--pink);background:var(--pink-tint)}
@media (hover:hover){.nav-sub button:hover{color:var(--ink)}}
.nav-sub button:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.blk{display:grid;gap:14px;min-width:0}
.fgrp{display:grid;gap:10px;min-width:0}
.fgrp+.fgrp{margin-top:6px}
.fgrp-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.fgrp-h b{font:700 calc(var(--y-b) - 1px) var(--display);letter-spacing:-.01em}
.fgrp-h small{color:var(--muted);font-size:calc(var(--y-s) - 1px)}
.fgrp-h code{font:600 calc(var(--y-s) - 2px) ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);background:var(--sunken);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,208px),1fr));gap:12px}
.vt{font:inherit;cursor:pointer;width:100%;padding:14px 14px 12px;display:flex;flex-direction:column;gap:8px;min-height:128px;text-align:left;color:inherit}
.vt-top{display:flex;align-items:flex-start;gap:8px;min-width:0}
.vt-name{flex:1;min-width:0;font:700 calc(var(--y-b) - 1px)/1.2 var(--display);letter-spacing:-.01em;overflow-wrap:anywhere}
.vt-pct{font:800 calc(var(--y-b) + 5px)/1 var(--num);color:var(--pink);letter-spacing:.01em;white-space:nowrap}
.vt-big{font:800 calc(var(--y-n) * .62)/1 var(--num);letter-spacing:.01em;color:var(--ink);white-space:nowrap}
.vt-big small{font-size:.55em;color:var(--muted);margin-left:3px}
.vt-frag{color:var(--muted);font-size:calc(var(--y-s) - 1px);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vt-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.vt-meta .tag{font-size:calc(var(--y-s) - 3px);padding:4px 8px 4px 6px}
.vt-bar{height:6px;border-radius:6px;background:var(--sunken);overflow:hidden;flex:none}
.vt-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,rgba(var(--pk-rgb),.95),rgba(var(--pk-rgb),.45));transform-origin:left;transform:scaleX(var(--p,0));transition:transform .6s var(--ease)}
.vt-add{font:700 var(--y-s) var(--body);cursor:pointer;min-height:128px;border-radius:18px;border:2px dashed var(--border);background:transparent;color:var(--muted);display:grid;place-items:center;align-content:center;gap:6px;transition:border-color .2s,color .2s,background-color .2s,transform .18s var(--ease)}
.vt-add .ic{width:24px;height:24px}
@media (hover:hover){.vt-add:hover{border-color:var(--pink);color:var(--pink);background:var(--pink-tint);transform:translateY(-2px)}}
.vt-add:focus-visible{outline:3px solid var(--focus);outline-offset:3px}

/* ---------- shared round 7 helpers ---------- */
.l7 .side{overflow-y:auto}
.l7 .side .nav-i{padding:9px 14px}
.lbl7{display:flex;align-items:center;gap:10px;margin:4px 0 -6px}
.lbl7::after{content:"";flex:1;height:1px;background:var(--line)}
.slim7{padding:10px 12px;align-items:center}
.slim7 .al-t{flex-basis:260px}
.slim7 .al-t b{font-size:15px}
.slim7 .al-t small{font-size:13px}
.slim7 .al-ic{width:30px;height:30px}
.spk7{display:inline-flex;align-items:flex-end;gap:3px;height:22px;vertical-align:middle}
.spk7 i{width:6px;height:var(--h);border-radius:3px 3px 1px 1px;background:color-mix(in srgb,var(--blue) 45%,transparent)}
.spk7 i.on{background:var(--pink)}
[data-g].num,b.num[data-g]{color:var(--gc)}
.k7,.why7 .k,.wk7 .k,.cc7 .k{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:800 14px var(--num);background:var(--pink-tint);color:var(--pink);flex:none}
.cols7{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;min-width:0}
.cols7.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cols7>section{display:grid;gap:10px;align-content:start;min-width:0;padding:10px;border-radius:16px;background:var(--sunken);border:1px solid var(--line)}
.cols7 header{display:flex;align-items:center;gap:8px;padding:2px 4px}
.cols7 header b{font:700 14px var(--display);flex:1;min-width:0}
.cols7 header .n{font:800 18px var(--num);color:var(--muted)}
@container l6 (max-width:980px){.cols7{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container l6 (max-width:560px){.cols7,.cols7.c3{grid-template-columns:minmax(0,1fr)}}

/* ---------- SO solutions ---------- */
.soi7{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.soi7 li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center}
.soi7 b{display:block;font-size:14.5px}
.soi7 small{display:block;font-size:13px;color:var(--muted)}
.soi7.cmp{grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr));gap:8px 14px}
.sog7{display:flex;gap:10px;align-items:flex-start;margin:0;padding:10px 12px;border-radius:12px;background:var(--sunken);border:1px solid var(--line);font-size:13.5px;line-height:1.45;color:var(--muted)}
.sog7 .ic{width:18px;height:18px;color:var(--pink);flex:none;margin-top:1px}
.sog7 b{color:var(--ink)}
.soa7 .acts6{gap:6px}
.soa7 li{grid-template-columns:28px minmax(0,1fr) auto}
.sob7{display:block;height:6px;border-radius:6px;background:var(--sunken);overflow:hidden;margin-top:6px;max-width:260px}
.sob7 i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--pink),var(--blue));transform-origin:left;transform:scaleX(var(--p));animation:sob7 2.4s var(--ease) infinite alternate}
@keyframes sob7{from{transform:scaleX(.35)}to{transform:scaleX(.8)}}
@media (prefers-reduced-motion:reduce){.sob7 i{animation:none}}
.sow7.strip{grid-template-columns:repeat(3,minmax(0,1fr))}
.fx7{display:inline-flex;gap:4px;vertical-align:middle}
.fx7 i{width:12px;height:12px;border-radius:4px;background:var(--sunken);border:1px solid var(--line)}
.fx7 i.y{background:var(--good);border-color:transparent}
.fx7 i.h{background:linear-gradient(90deg,var(--good) 50%,var(--sunken) 50%);border-color:color-mix(in srgb,var(--good) 50%,transparent)}
.fin7{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.fin7-o{font:inherit;color:inherit;cursor:pointer;display:grid;gap:2px;justify-items:start;text-align:left;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line);transition:transform .18s var(--ease),border-color .2s,box-shadow .2s}
.fin7-o b{font:800 24px/1 var(--num);letter-spacing:.01em}
.fin7-o b small{font-size:.55em;color:var(--muted);margin-left:1px}
.fin7-o span{font-size:13px;font-weight:700}
.fin7-o small{font-size:12px;color:var(--muted)}
.fin7-o.on{border-color:var(--pink);background:var(--pink-tint);box-shadow:0 10px 24px -16px rgba(var(--pk-rgb),.9)}
@media (hover:hover){.fin7-o:hover{transform:translateY(-2px)}}
.fin7-o:active{transform:translateY(1px)}
.why7{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.why7 li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;font-size:14.5px;line-height:1.45}
.tier7{display:grid;gap:10px;padding:16px;align-content:start}
.tier7.on{--k-bd:var(--pink);box-shadow:0 0 0 2px var(--pink),0 22px 40px -26px rgba(var(--pk-rgb),.9)}
.tier7-h{display:flex;align-items:center;gap:8px;min-width:0}
.tier7-n{font:800 13px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);flex:1;min-width:0}
.tier7.on .tier7-n{color:var(--pink)}
.tier7-p{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.tier7-p b{font:800 40px/1 var(--num);letter-spacing:.01em}
.tier7-p span{font:800 18px var(--num);color:var(--muted)}
.tier7-p span small{font-size:.7em}
.tier7-s{margin:0;font:700 15px/1.3 var(--display);letter-spacing:-.01em}
.tier7-f{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);font-weight:600}
.tier7-i{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.tier7-i li{display:grid;grid-template-columns:16px minmax(0,1fr);gap:8px;font-size:13.5px;line-height:1.35}
.tier7-i .ic{width:16px;height:16px;color:var(--good);margin-top:1px}
.tier7-i li.w .ic{color:var(--blue)}
.tier7-w{display:flex;gap:8px;align-items:flex-start;margin:0;font-size:12.5px;color:var(--muted);line-height:1.35}
.tier7-w .ic{width:15px;height:15px;color:var(--blue);flex:none;margin-top:1px}
.tier7-a{margin-top:auto}
.tier7-a .btn{width:100%;justify-content:center}
.lad7l{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lad7{display:grid;grid-template-columns:minmax(110px,150px) minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.lad7.on{background:var(--pink-tint);border-color:var(--pink);box-shadow:inset 4px 0 0 var(--pink)}
.lad7-n b{display:block;font:800 13px var(--body);letter-spacing:.08em;text-transform:uppercase}
.lad7.on .lad7-n b{color:var(--pink)}
.lad7-n small{font-size:12.5px;color:var(--muted)}
.lad7-s{display:grid;gap:5px;min-width:0}
.lad7-s b{font-size:14.5px;line-height:1.3}
.lad7-p{text-align:right;display:grid}
.lad7-p b{font:800 26px/1 var(--num);letter-spacing:.01em}
.lad7-p small{font-size:12.5px;color:var(--muted);font-weight:700}
.lad7-x{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:14px;padding-top:10px;border-top:1px solid color-mix(in srgb,var(--pink) 30%,transparent)}
@container l6 (max-width:700px){.lad7{grid-template-columns:minmax(0,1fr) auto}.lad7-s{grid-column:1/-1;grid-row:2}.lad7>.tag,.lad7>.btn{grid-column:1/-1;justify-self:start}.lad7-x{grid-template-columns:minmax(0,1fr)}}
.mx7{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px;min-width:760px}
.mx7 th,.mx7 td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle}
.mx7 thead th{vertical-align:bottom}
.mx7 thead th b{display:block;font:800 11.5px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.mx7 thead th .num{display:block;font-size:22px;margin-top:4px}
.mx7 thead th small{font-size:12px;color:var(--muted);font-weight:700}
.mx7 tbody th{text-align:left;font-weight:700;white-space:nowrap;position:sticky;left:0;background:var(--raised);z-index:1}
.mx7 .on{background:var(--pink-tint)}
.mx7 thead th.on{border-radius:14px 14px 0 0}
.mx7 thead th.on b{color:var(--pink)}
.mx7 tr:last-child td.on{border-radius:0 0 14px 14px}
.mx7-f{display:inline-flex;align-items:center;gap:8px}
.mx7-f .gbadge{width:24px;height:24px;font-size:13px}
.mx7-y{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--good-tint);color:var(--good)}
.mx7-y .ic{width:15px;height:15px}
.mx7-h{font:700 12px var(--body);color:var(--warn)}
.mx7-n{color:var(--muted)}
.mx7 tr.w td{font-size:12.5px;color:var(--muted)}
.mx7 tr.a td{border-bottom:0}
.cho7{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;padding:20px;border-radius:22px;background:var(--raised);border:1px solid var(--pink);box-shadow:0 0 0 1px var(--pink),var(--card-sh);min-width:0}
.cho7-l{display:grid;gap:8px;align-content:start}
.cho7-l>.num{font:800 54px/1 var(--num);letter-spacing:.01em}
.cho7-m{font:700 15px var(--body);color:var(--pink)}
.cho7-l p{margin:0;font-size:14.5px;color:var(--muted)}
@container l6 (max-width:700px){.cho7{grid-template-columns:minmax(0,1fr)}}
.pre7{display:grid;gap:18px;padding:22px;border-radius:24px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.pre7-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pre7-nav{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.pre7-nav span{padding:5px 10px;border-radius:999px;font:700 12px var(--body);color:var(--muted);background:var(--sunken);border:1px solid var(--line)}
.pre7-nav span.on{background:var(--pink);color:var(--pink-on);border-color:transparent}
.pre7-b{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:center}
.pre7-p{display:grid;gap:6px;padding:22px;border-radius:20px;background:var(--hero);color:#fff}
.pre7-p small{font:800 13px var(--body);letter-spacing:.12em;text-transform:uppercase;opacity:.9}
.pre7-p b{font:800 clamp(56px,7vw,88px)/.95 var(--num);letter-spacing:.01em}
.pre7-p b em{font-style:normal;font-size:.36em;opacity:.9}
.pre7-p span{font-size:15px;opacity:.95}
.pre7-fx{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pre7-fx li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:center}
.pre7-fx li>.ic{width:30px;height:30px;padding:6px;border-radius:50%}
.pre7-fx li.y>.ic{background:var(--good-tint);color:var(--good)}
.pre7-fx li.n>.ic{background:var(--sunken);color:var(--muted)}
.pre7-fx b{display:block;font-size:16px}
.pre7-fx small{font-size:13px;color:var(--muted)}
.pre7 .acts6{justify-content:center}
@container l6 (max-width:760px){.pre7-b{grid-template-columns:minmax(0,1fr)}.pre7-nav{margin-left:0}}
.ed7{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ed7 li{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.ed7 li.on{border-color:var(--pink);background:var(--pink-tint)}
.ed7-g{color:var(--muted);letter-spacing:-2px;cursor:grab;font-weight:800}
.ed7-t b{display:block;font:800 12.5px var(--body);letter-spacing:.08em;text-transform:uppercase}
.ed7-t small{font-size:12.5px;color:var(--muted)}
.ed7 .num{font-size:20px}
@container l6 (max-width:520px){.ed7 li{grid-template-columns:auto minmax(0,1fr) auto}.ed7 .fx7{display:none}}

/* ---------- CS csr ---------- */
.cav7{--cc:var(--pink);background:color-mix(in srgb,var(--cc) 18%,var(--raised));color:var(--cc);border:1.5px solid color-mix(in srgb,var(--cc) 55%,transparent)}
.cav7[data-c="blue"]{--cc:var(--blue)}.cav7[data-c="good"]{--cc:var(--good)}
.calls7{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.call7{display:grid;grid-template-columns:46px auto minmax(0,1fr) auto;gap:10px;align-items:start;padding:10px;border-radius:14px;border:1px solid var(--line);background:var(--surface)}
.call7 time{font:800 15px var(--num);color:var(--muted);padding-top:6px}
.call7 .av{width:32px;height:32px;font-size:11px}
.call7-t{display:grid;gap:3px;min-width:0}
.call7-t b{font-size:14.5px}
.call7-t small{font-size:12.5px;color:var(--muted)}
.call7-t .tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:3px}
.call7-t .tag{font-size:11.5px;padding:3px 7px 3px 5px}
.call7.on{background:var(--pink-tint);border-color:var(--pink);box-shadow:inset 3px 0 0 var(--pink)}
.call7.live{border-color:color-mix(in srgb,var(--bad) 45%,transparent)}
.calls7.cmp .call7{grid-template-columns:40px minmax(0,1fr) auto}
.calls7.cmp .call7>.av{display:none}
.cg7{display:grid;justify-items:center;min-width:44px;padding:4px 6px;border-radius:12px;background:var(--gt);color:var(--gc);font:800 13px var(--num);border:1.5px solid color-mix(in srgb,var(--gc) 50%,transparent)}
.cg7 b{font:800 22px/1 var(--display)}
.cg7.none{background:var(--sunken);color:var(--muted);border:1.5px dashed var(--border);font-size:18px;min-height:44px;align-content:center}
.cst7 tr.on td{background:var(--pink-tint)}
.cst7 .cg7{display:inline-flex;gap:6px;align-items:center;min-width:0}
.cst7 .cg7 b{font-size:15px}
.cst7 .tag{font-size:11.5px}
.ok7,.no7{display:inline-flex;align-items:center;gap:4px;font-weight:700}
.ok7{color:var(--good)}.no7{color:var(--bad-text)}
.ok7 .ic,.no7 .ic{width:15px;height:15px}
.cc7{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cc7 li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:start;padding:12px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.cc7 li b{display:block;font:700 14px var(--display);margin-bottom:4px}
.cc7 li p{margin:0;font-size:14px;line-height:1.5}
.cc7 li q{display:block;font-style:italic;color:var(--muted);quotes:none}
.cc7 li q.r{color:var(--bad-text);margin-top:4px}
.cc7 li[data-k="say"]{background:var(--good-tint);border-color:color-mix(in srgb,var(--good) 40%,transparent)}
.cc7 li[data-k="say"] .k{background:var(--good);color:#fff}
.cc7 li[data-k="drill"]{background:var(--pink-tint);border-color:color-mix(in srgb,var(--pink) 40%,transparent)}
.cc7.h{grid-template-columns:repeat(4,minmax(0,1fr))}
.cc7.h li{grid-template-columns:minmax(0,1fr)}
@container l6 (max-width:980px){.cc7.h{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container l6 (max-width:560px){.cc7.h{grid-template-columns:minmax(0,1fr)}}
.qc7 .qv{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.qc7 .q-badge{width:96px;height:106px}
.qc7 .q-badge .l{font-size:58px}
.wk7{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.wk7 li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.wk7 b{display:block;font-size:14.5px}
.wk7 small{font-size:12.5px;color:var(--muted)}
@container l6 (max-width:560px){.wk7 li{grid-template-columns:28px minmax(0,1fr)}.wk7 li>.tag{grid-column:2}}
.live7{display:grid;gap:10px;padding:14px;border-radius:18px;background:var(--raised);border:1px solid color-mix(in srgb,var(--bad) 40%,var(--line));box-shadow:var(--card-sh);align-content:start}
.live7-h{display:grid;gap:4px;justify-items:start}
.live7-h b{font:700 16px var(--display)}
.live7-h small{font-size:13px;color:var(--muted)}
.live7-c{display:flex;flex-wrap:wrap;gap:6px}
.lane7-s{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:10px;align-items:center}
.lane7-s span{display:grid}
.lane7-s .num{font-size:24px}
.lane7-s small{font-size:11.5px;color:var(--muted);font-weight:600}
.lane7-s .av{width:40px;height:40px}
.lx7 .mboard{filter:none;opacity:.55}
.lx7 .mdet .qc{box-shadow:none}

/* ---------- PH practice hub ---------- */
.mode7-i{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--pink-tint);color:var(--pink);flex:none}
.mode7-i .ic{width:22px;height:22px}
.mode7 .card-t{font-size:17px}
.mode7-d{margin:0;font-size:14px;color:var(--muted);line-height:1.45}
.mode7.big .card-t{font-size:22px}
.mode7.big .mode7-i{width:56px;height:56px;background:var(--hero);color:#fff}
.mode7.big .mode7-i .ic{width:28px;height:28px}
.mode7.big .card-b{align-content:start}
.mode7 .acts6{margin-top:auto}
.g6.st>div>.mode7,.g6.st>.mode7{height:100%}
.mrows7,.mrail7{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mrow7{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;border-radius:14px;background:var(--surface);border:1px solid var(--line)}
.mrow7-t b{display:block;font:700 15px var(--display)}
.mrow7-t small{font-size:12.5px;color:var(--muted)}
.mrow7-p{min-width:0}
@container l6 (max-width:1100px){.mrow7{grid-template-columns:auto minmax(0,1fr) auto}.mrow7-p{grid-column:1/-1}}
.mrail7 li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;padding:8px;border-radius:14px;border:1px solid transparent}
.mrail7 li.on{background:var(--pink-tint);border-color:var(--pink)}
.mrail7 b{display:block;font-size:14.5px}
.mrail7 small{font-size:12.5px;color:var(--muted)}
.mrail7 .mode7-i{width:36px;height:36px}
.weak7{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.weak7 li{display:grid;grid-template-columns:100px minmax(0,1fr) 40px;gap:10px;align-items:center;font-size:14px;font-weight:600}
.weak7 .num{font-size:20px;text-align:right}
.bar7{position:relative;height:10px;border-radius:10px;background:var(--sunken)}
.bar7 i{position:absolute;inset:0 auto 0 0;width:calc(var(--p) * 100%);border-radius:inherit;background:linear-gradient(90deg,var(--pink),var(--blue))}
.bar7 em{position:absolute;top:-4px;bottom:-4px;left:calc(var(--p) * 100%);border-left:2px dashed var(--ink);opacity:.55}

/* ---------- GA gauntlet ---------- */
.hud7{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh)}
.hud7-c{display:grid;gap:2px;padding:0 12px;border-right:1px solid var(--line)}
.hud7-c small{font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.hud7-c b{font:800 26px/1 var(--num);letter-spacing:.01em}
.hud7-c b em{font-style:normal;font-size:.6em;color:var(--muted)}
.lives7{display:flex;gap:4px}
.lives7 i{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--good-tint);color:var(--good)}
.lives7 i.x{background:var(--bad-tint);color:var(--bad-text)}
.lives7 .ic{width:15px;height:15px}
.hud7-t{position:relative;width:48px;height:48px;margin-left:auto;display:grid;place-items:center}
.hud7-t svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.hud7-t .t{fill:none;stroke:var(--sunken);stroke-width:5}
.hud7-t .a{fill:none;stroke:var(--pink);stroke-width:5;stroke-linecap:round;stroke-dasharray:calc(var(--p) * 100) 100}
.hud7-t b{position:relative;font:800 17px var(--num)}
.gdots7{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px}
.gdots7 i{height:8px;border-radius:8px;background:var(--sunken);border:1px solid var(--line)}
.gdots7 i.y{background:var(--good);border-color:transparent}
.gdots7 i.x{background:var(--bad);border-color:transparent}
.gdots7 i.now{background:var(--pink);border-color:transparent;box-shadow:0 0 0 3px rgba(var(--pk-rgb),.25)}
.gl7{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.gl7 li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px 8px;border-radius:12px}
.gl7 li .k{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:800 13px var(--num);background:var(--sunken);color:var(--muted);border:1px solid var(--line)}
.gl7 li .k .ic{width:14px;height:14px}
.gl7 li.y .k{background:var(--good-tint);color:var(--good);border-color:transparent}
.gl7 li.x .k{background:var(--bad-tint);color:var(--bad-text);border-color:transparent}
.gl7 li.now{background:var(--pink-tint);box-shadow:inset 3px 0 0 var(--pink)}
.gl7 li.now .k{background:var(--pink);color:var(--pink-on);border-color:transparent}
.gl7 b{display:block;font-size:14px}
.gl7 small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gl7 .num{font-size:18px}
.res7{display:grid;gap:18px;padding:22px;border-radius:24px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);min-width:0}
.res7-b{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:center}
.res7-n{display:grid;place-items:center;width:132px;height:132px;border-radius:50%;background:var(--hero);color:#fff;box-shadow:0 20px 40px -24px rgba(var(--pk-rgb),.9)}
.res7-n b{font:800 64px/.9 var(--num)}
.res7-n small{font:700 13px var(--body);margin-top:-18px;opacity:.9}
.res7-b h3{font:800 clamp(1.4rem,2.4vw,2rem)/1.1 var(--display);letter-spacing:-.02em;margin:4px 0}
.res7-b p{margin:0 0 12px;color:var(--muted)}
.res7-s{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;align-items:end;height:110px}
.res7-r{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:6px;height:100%;min-width:0}
.res7-r i{align-self:end;height:var(--h);border-radius:8px 8px 3px 3px;background:var(--gc);opacity:.85}
.res7-r small{font-size:11px;color:var(--muted);font-weight:700;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@container l6 (max-width:560px){.res7-b{grid-template-columns:minmax(0,1fr);justify-items:start}.res7-n{width:104px;height:104px}.res7-n b{font-size:50px}.res7-r small{display:none}.res7-s{height:80px;gap:4px}}
.focus7{display:grid;gap:18px;padding:22px;border-radius:24px;background:var(--surface);border:1px solid var(--line)}

/* ---------- MW my work ---------- */
.mw7 li{grid-template-columns:70px 18px minmax(0,1fr) auto}
.mw7 time{font-size:18px}
.mw7 b{font-size:16px}
.mw7 small{font-size:13.5px}
.mw7 li>.ic{color:var(--good);width:20px;height:20px}
.pin7{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}
.pin7-i{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--good-tint);color:var(--good)}
.pin7-i .ic{width:24px;height:24px}
.pin7 b{display:block;font-size:15px}
.pin7 small{font-size:13px;color:var(--muted)}
.mwn7 .acts .btn{flex:1 1 auto}

/* ---------- IN install board ---------- */
.ck7{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 14px}
.ck7.cmp{grid-template-columns:minmax(0,1fr)}
.ck7 li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;align-items:center;padding:5px 0}
.ck7 .k{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:800 12.5px var(--num);background:var(--sunken);color:var(--muted);border:1px solid var(--line)}
.ck7 .k .ic{width:14px;height:14px}
.ck7 li[data-s="done"] .k{background:var(--good-tint);color:var(--good);border-color:transparent}
.ck7 li[data-s="now"] .k{background:var(--pink);color:var(--pink-on);border-color:transparent;box-shadow:0 0 0 4px rgba(var(--pk-rgb),.2)}
.ck7 li[data-s="todo"] b{color:var(--muted);font-weight:600}
.ck7 b{display:block;font-size:13.5px}
.ck7 small{display:block;font-size:12px;color:var(--muted)}
@container l6 (max-width:560px){.ck7{grid-template-columns:minmax(0,1fr)}}
.hand7{display:grid;gap:12px}
.hand7-w{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:14px;background:var(--sunken);border:1px solid var(--line)}
.hand7-w>.ic{width:18px;height:18px;color:var(--pink)}
.hand7-w>span:last-child{flex:1;min-width:180px}
.hand7-w b{display:block;font-size:14.5px}
.hand7-w small{font-size:12.5px;color:var(--muted)}
.hn7{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.hn7 li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;font-size:14px;line-height:1.4}
.hn7 .ic{width:18px;height:18px;color:var(--blue);margin-top:1px}
.hn7 li:first-child .ic{color:var(--bad-text)}
.hand7-p{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.hand7-p .up-t{margin:0}
.ckg7 .dots6 i{width:13px;height:13px}
.ckg7 td{white-space:nowrap}

/* ---------- CB call by call ---------- */
.cbs7{display:flex;align-items:center;gap:8px;padding:8px;border-radius:18px;background:var(--raised);border:1px solid var(--line);box-shadow:var(--card-sh);max-width:880px;min-width:0}
.cbs7-s{display:flex;align-items:center;gap:10px;flex:1;min-width:0;padding:6px 10px;border-radius:12px}
.cbs7-s .k{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:800 13px var(--num);background:var(--sunken);color:var(--muted);flex:none;border:1px solid var(--line)}
.cbs7-s .k .ic{width:14px;height:14px}
.cbs7-s b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cbs7-s small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cbs7-s span{min-width:0}
.cbs7-s.done .k{background:var(--good-tint);color:var(--good);border-color:transparent}
.cbs7-s.on{background:var(--pink-tint)}
.cbs7-s.on .k{background:var(--pink);color:var(--pink-on);border-color:transparent}
@container l6 (max-width:620px){.cbs7-s:not(.on) span{display:none}.cbs7-s:not(.on){flex:none}}
.cbp7.on{box-shadow:0 0 0 2px var(--pink),var(--card-sh)}
.ck.now7 .src{display:grid;place-items:center}
.ck.now7 .src .ic{width:12px;height:12px;color:#fff}
.cbt7{display:grid;gap:0;position:relative}
.cbt7-s{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding-bottom:18px;position:relative}
.cbt7-s::before{content:"";position:absolute;left:17px;top:36px;bottom:0;width:2px;background:var(--line)}
.cbt7-s:last-child::before{display:none}
.cbt7-s>.k{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font:800 15px var(--num);background:var(--sunken);color:var(--muted);border:1px solid var(--line);position:relative;z-index:1}
.cbt7-s>.k .ic{width:16px;height:16px}
.cbt7-s.done>.k{background:var(--good-tint);color:var(--good);border-color:transparent}
.cbt7-s.on>.k{background:var(--pink);color:var(--pink-on);border-color:transparent}
.cbt7-s.done>div{padding-top:6px}
.cbt7-s.done b{display:block;font-size:15px}
.cbt7-s.done small{font-size:13px;color:var(--muted)}
.cbr7{align-items:center}
.cbr7 .al-a{flex-basis:auto}

/* ---------- RP reps + CO coaching + TM team ---------- */
.rp7-n{display:flex;align-items:center;gap:14px}
.rp7-n>.num{font:800 46px/1 var(--num)}
.rp7-n>span{display:grid;gap:4px}
.rp7-n small{font-size:12.5px;color:var(--muted);font-weight:600}
.rp7-w{margin:0;font-size:13.5px;color:var(--muted);line-height:1.4}
.rp7-w b{color:var(--ink)}
.rp7[data-s="bad"]{box-shadow:inset 0 3px 0 var(--bad),var(--card-sh)}
.rp7[data-s="pink"]{box-shadow:inset 0 3px 0 var(--pink),var(--card-sh)}
.rpl7 li{grid-template-columns:auto minmax(0,1fr) auto}
.rpl7 .tag{font-size:11.5px}
.l7 .adt td{white-space:nowrap}
.co7-w{margin:0;font-size:14.5px;line-height:1.45}
.co7-l{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.co7-l li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;align-items:center;padding:8px 10px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.co7-l .ic{width:32px;height:32px;padding:7px;border-radius:10px;background:var(--pink-tint);color:var(--pink)}
.co7-l small{display:block;font:700 11px var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.co7-l b{display:block;font-size:14px;font-weight:600}
.co7.big .card-t{font-size:20px}
.co7[data-s="bad"]{box-shadow:inset 0 3px 0 var(--bad),var(--card-sh)}
.co7[data-s="pink"]{box-shadow:inset 0 3px 0 var(--pink),var(--card-sh)}
.cot7{max-width:100%;overflow-x:auto}
.cot7 .gi{gap:8px}
.cot7t td{min-width:120px}
.cot7t td:first-child{min-width:0}
.pos7{display:flex;align-items:center;gap:16px}
.pos7>.num{font:800 72px/.9 var(--num);color:var(--pink)}
.pos7 small{display:block;font-size:13px;color:var(--muted);margin-top:6px}

/* ---------- AJ after the job + membership ---------- */
.ajl7{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.aj7{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 12px;border-radius:6px 14px 14px 6px;background:var(--svt);border-left:4px solid var(--sv)}
.aj7[data-sev="neutral"]{--svx:var(--muted);background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--border)}
.aj7-t{display:grid;min-width:0}
.aj7-t small{font:800 11px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--svx)}
.aj7-t b{font-size:15px}
.aj7-t span{font-size:13px;color:var(--muted)}
.aj7-o{display:grid;text-align:right}
.aj7-o small{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.aj7-o b{font-size:14px}
.cols7 .aj7{grid-template-columns:34px minmax(0,1fr)}
.cols7 .aj7 .aj7-o{text-align:left;grid-column:2}
.cols7 .aj7>.tag{grid-column:2;justify-self:start}
@container l6 (max-width:620px){.aj7{grid-template-columns:34px minmax(0,1fr)}.aj7-o{text-align:left;grid-column:2}.aj7>.tag{grid-column:2;justify-self:start}}
.mb7{grid-template-columns:repeat(2,minmax(0,1fr))}
.mb7>div{box-shadow:none;background:var(--surface)}
.mbl7 li{grid-template-columns:auto minmax(0,1fr) auto}
.mbl7 .tag{font-size:11.5px}
@container l6 (max-width:560px){.mbl7 li{grid-template-columns:auto minmax(0,1fr)}.mbl7 li>.tag{grid-column:2;justify-self:start}}
.rules7{border-radius:16px;background:var(--surface);border:1px solid var(--line);padding:0 14px}
.rules7 summary{display:flex;align-items:center;gap:10px;cursor:pointer;padding:12px 0;font-weight:700;list-style:none}
.rules7 summary::-webkit-details-marker{display:none}
.rules7 summary span{flex:1}
.rules7 .ic{width:18px;height:18px;color:var(--muted)}
.rules7 p{margin:0 0 14px;color:var(--muted);font-size:14px}

/* ---------- PK packs ---------- */
.roll7{display:grid;gap:12px}
.roll7-c{display:flex;align-items:center;gap:12px}
.roll7-c b{display:block;font-size:15px}
.roll7-c small{font-size:13px;color:var(--muted)}
.roll7 .soi7.cmp{grid-template-columns:minmax(0,1fr)}
.tree7,.tree7 ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.tree7>li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;padding:8px 10px;border-radius:12px;font-weight:700;font-size:14.5px}
.tree7>li>span{display:flex;align-items:center;gap:6px}
.tree7>li>span .ic{width:16px;height:16px;color:var(--muted)}
.tree7>li .num{font-size:16px;color:var(--muted)}
.tree7>li.on{background:var(--sunken)}
.tree7 ul{grid-column:1/-1;margin:4px 0 2px 22px}
.tree7 ul li{padding:6px 10px;border-radius:10px;font-weight:600;font-size:13.5px;color:var(--muted)}
.tree7 ul li.on{background:var(--pink-tint);color:var(--pink);box-shadow:inset 3px 0 0 var(--pink)}
.pkc7{font:600 12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);background:var(--sunken);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.pkq7{white-space:normal!important;min-width:220px;color:var(--muted)}
.l7 .adt .tag{font-size:11.5px}

/* ---------- phone 390 ---------- */
.ph390 .sow7.strip{grid-template-columns:minmax(0,1fr)}
.ph390 .fin7{grid-template-columns:minmax(0,1fr)}
.ph390 .fin7-o{grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:center}
.ph390 .fin7-o b{grid-row:1/3}
.ph390 .hand7-p{grid-template-columns:repeat(2,minmax(0,1fr))}
.ph390 .hud7-c{padding:0 8px}
.ph390 .hud7-c b{font-size:20px}
.ph390 .cbs7{max-width:100%}
.ph390 .lane7-s{grid-template-columns:repeat(3,minmax(0,1fr))}
.ph390 .lane7-s .av{display:none}
.ph390 .pos7>.num{font-size:56px}
.ph390 .weak7 li{grid-template-columns:84px minmax(0,1fr) 34px}
.ph390 .call7{grid-template-columns:40px minmax(0,1fr) auto}
.ph390 .call7>.av{display:none}
.ph390 .tier7-p b{font-size:34px}
@container l6 (max-width:760px){.sow7.strip{grid-template-columns:minmax(0,1fr)}}

/* ---------- fixes after first screenshots ---------- */
.l7 .card-h{flex-wrap:wrap;row-gap:8px}
.l7 .card-t{min-width:min(100%,170px)}
.qsub7{display:block;color:var(--muted);font-size:14px;margin-top:2px}
.calls7{container:calls7 / inline-size}
@container calls7 (max-width:430px){
  .call7{grid-template-columns:40px minmax(0,1fr) auto}
  .call7>.av{display:none}
  .call7 time{font-size:14px}
}
.call7-t .tag{max-width:100%}
.call7-t .tag .tv{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.wk7{container:wk7 / inline-size}
@container wk7 (max-width:470px){.wk7 li{grid-template-columns:28px minmax(0,1fr)}.wk7 li>.tag{grid-column:2;justify-self:start}}
.cc7.h li{align-content:start}
.soa7 .acts6{grid-column:2/-1}
@container l6 (max-width:1100px){.mrow7>.btn{grid-row:1;grid-column:3}}
.mode7.big .card-b{gap:14px}
.row7 .al{align-items:center}
.row7 .al-a{flex-basis:auto;padding-left:0}
.stage6{grid-template-columns:minmax(0,1fr)}
@media (max-width:640px){.top-r1{flex-wrap:wrap}.top-r1 .jump{order:3;flex-basis:100%;min-width:0}}
.l7 .l6main .pb,.l7 .l6main .qc{overflow-x:auto}