/* PashaPredict 2026 — "Floodlight" design system (customer surfaces). */

/* 1 ─ fonts (self-hosted Inter / Inter Display subsets; */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-regular-latin.woff2?v=p5-20261101-195359-21360f87) format("woff2");unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013-2014,U+2018-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+2212,U+2248,U+2264-2265}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-regular-ext.woff2?v=p5-20261101-195359-21360f87) format("woff2");unicode-range:U+0100-017F,U+0218-021B,U+0259,U+1E9E,U+1EA0-1EF9}
@font-face{font-family:"Inter";font-style:normal;font-weight:500 700;font-display:swap;src:url(/assets/fonts/inter-semibold-latin.woff2?v=p5-20261101-195359-21360f87) format("woff2");unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013-2014,U+2018-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+2212,U+2248,U+2264-2265}
@font-face{font-family:"Inter";font-style:normal;font-weight:500 700;font-display:swap;src:url(/assets/fonts/inter-semibold-ext.woff2?v=p5-20261101-195359-21360f87) format("woff2");unicode-range:U+0100-017F,U+0218-021B,U+0259,U+1E9E,U+1EA0-1EF9}
@font-face{font-family:"Inter Display";font-style:normal;font-weight:500 800;font-display:swap;src:url(/assets/fonts/interdisplay-semibold-latin.woff2?v=p5-20261101-195359-21360f87) format("woff2");unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013-2014,U+2018-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+2212,U+2248,U+2264-2265}
@font-face{font-family:"Inter Display";font-style:normal;font-weight:500 800;font-display:swap;src:url(/assets/fonts/interdisplay-semibold-ext.woff2?v=p5-20261101-195359-21360f87) format("woff2");unicode-range:U+0100-017F,U+0218-021B,U+0259,U+1E9E,U+1EA0-1EF9}

/* 2 ─ tokens */
:root{
  --font:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --display:"Inter Display","Inter",ui-sans-serif,system-ui,-apple-system,sans-serif;
  --fs-xs:.72rem;--fs-s:.8125rem;--fs-m:.9375rem;--fs-l:1.0625rem;--fs-xl:1.25rem;
  --fs-h3:1.125rem;--fs-h2:clamp(1.25rem,1.05rem + .9vw,1.6rem);--fs-h1:clamp(1.6rem,1.25rem + 1.6vw,2.4rem);
  --fs-hero:clamp(1.55rem,1.1rem + 2.2vw,2.75rem);--fs-num:clamp(2.2rem,1.6rem + 2.6vw,3.6rem);
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;--sp-12:48px;
  --r-xs:8px;--r-s:12px;--r-m:16px;--r-l:22px;--r-xl:28px;--r-full:999px;
  --gutter:16px;--content:1180px;--rail:252px;
  --top-h:56px;--nav-h:64px;--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px);
  --ease:cubic-bezier(.2,.8,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);--spring:cubic-bezier(.34,1.4,.64,1);
  --t-fast:160ms;--t-mid:240ms;--t-slow:340ms;
  --focus:0 0 0 2px var(--bg),0 0 0 4px var(--accent);
}
/* 3 ─ themes (dark = flagship night fixture; */
:root,html[data-theme=dark]{
  color-scheme:dark;
  --bg:#060F0C;--bg-2:#08130F;--bg-deep:#040A08;
  --ink:#EEF4F1;--ink-2:#A7B5B0;--ink-3:#7D8C87;--ink-inv:#06100D;
  --line:rgba(214,240,230,.075);--line-2:rgba(214,240,230,.13);--line-3:rgba(214,240,230,.22);
  --surface:rgba(236,250,244,.032);--surface-2:rgba(236,250,244,.058);--surface-3:rgba(236,250,244,.09);
  --raised:#0B1514;--raised-2:#101C1A;
  --glass:rgba(8,15,14,.72);--glass-line:rgba(214,240,230,.10);--glass-blur:saturate(170%) blur(20px);
  --shadow-1:0 1px 0 rgba(255,255,255,.04) inset,0 10px 30px -12px rgba(0,0,0,.6);
  --shadow-2:0 1px 0 rgba(255,255,255,.05) inset,0 24px 60px -24px rgba(0,0,0,.75);
  --accent:#E8C46A;--accent-tx:#E8C46A;--accent-2:#F5DA92;--accent-ink:#1A1405;--accent-soft:rgba(232,196,106,.13);--accent-line:rgba(232,196,106,.38);
  --mint:#3FE0B2;--mint-soft:rgba(63,224,178,.12);
  --home:#8E9CFF;--draw:#B7C0CA;--away:#3FD6B3;
  --home-soft:rgba(142,156,255,.16);--draw-soft:rgba(183,192,202,.14);--away-soft:rgba(63,214,179,.15);
  --strong:#3DDC97;--solid:#62A8FF;--lean:#F4C24F;--open:#93A1AE;
  --live:#FF5A5F;--ok:#3DDC97;--warn:#F4C24F;--bad:#FF6B6B;
  --glow-a:rgba(196,255,236,.09);--glow-b:rgba(232,196,106,.065);--pitch-line:rgba(214,240,230,.06);
}
html[data-theme=emerald]{--bg:#06231A;--bg-2:#06221A;--bg-deep:#03120D;--raised:#0A251C;--raised-2:#0E2E23;--glass:rgba(5,28,20,.74);--glow-a:rgba(170,255,214,.11)}
html[data-theme=midnight]{--bg:#0B1220;--bg-2:#0A1020;--bg-deep:#050811;--raised:#0E1528;--raised-2:#131B33;--glass:rgba(9,13,27,.74);--glow-a:rgba(170,196,255,.10);--line:rgba(210,222,255,.08);--line-2:rgba(210,222,255,.14);--surface:rgba(230,236,255,.035);--surface-2:rgba(230,236,255,.06)}
html[data-theme=light]{
  color-scheme:light;
  --bg:#EDF0EA;--bg-2:#E6EAE3;--bg-deep:#DFE4DB;
  --ink:#0B1411;--ink-2:#46534F;--ink-3:#5C6864;--ink-inv:#FFFFFF;
  --line:rgba(11,25,20,.08);--line-2:rgba(11,25,20,.13);--line-3:rgba(11,25,20,.22);
  --surface:rgba(255,255,255,.66);--surface-2:#FFFFFF;--surface-3:#FFFFFF;
  --raised:#FFFFFF;--raised-2:#FAFBF8;
  --glass:rgba(248,250,246,.78);--glass-line:rgba(11,25,20,.09);
  --shadow-1:0 1px 2px rgba(16,32,26,.06),0 8px 24px -14px rgba(16,32,26,.22);
  --shadow-2:0 2px 4px rgba(16,32,26,.05),0 24px 48px -24px rgba(16,32,26,.28);
  --accent:#C9971F;--accent-tx:#7E5A0B;--accent-2:#E1B44A;--accent-ink:#1E1503;--accent-soft:rgba(201,151,31,.12);--accent-line:rgba(170,120,10,.42);
  --mint:#08705A;--mint-soft:rgba(14,159,124,.10);
  --home:#4D5BD8;--draw:#7A8592;--away:#0E9C7D;
  --home-soft:rgba(77,91,216,.11);--draw-soft:rgba(122,133,146,.12);--away-soft:rgba(14,156,125,.11);
  --strong:#08703F;--solid:#2563C9;--lean:#8F6606;--open:#5F6B78;
  --live:#D92D33;--ok:#08703F;--warn:#8F6606;--bad:#C53A3A;
  --glow-a:rgba(255,255,255,.7);--glow-b:rgba(232,196,106,.14);--pitch-line:rgba(11,25,20,.05);
}

/* 4 ─ base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg);scroll-padding-top:calc(var(--top-h) + var(--safe-t) + 12px)}
html[data-font=small]{font-size:15px}html[data-font=medium]{font-size:16px}html[data-font=large]{font-size:17.5px}
body{margin:0;min-height:100dvh;background:var(--bg);color:var(--ink);font:400 var(--fs-m)/1.5 var(--font);font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:hidden}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:650;letter-spacing:-.018em;line-height:1.15;color:var(--ink);text-wrap:balance}
p{margin:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
button:disabled{cursor:default}
img,svg{display:block;max-width:100%}
ul,ol{margin:0;padding:0;list-style:none}
fieldset{margin:0;padding:0;border:0;min-width:0}
legend{padding:0}
details>summary{cursor:pointer;list-style:none}details>summary::-webkit-details-marker{display:none}
:focus{outline:none}:focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--r-xs)}
.num,.tnum{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum","lnum","zero" 0}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--accent);color:var(--accent-ink);padding:10px 14px;border-radius:var(--r-s);font-weight:650}
.skip:focus-visible{top:calc(12px + var(--safe-t))}
.hide,[hidden]{display:none!important}
.muted{color:var(--ink-2)}.faint{color:var(--ink-3)}
.caption{font-size:var(--fs-s);color:var(--ink-2);line-height:1.45}
.small{font-size:var(--fs-s)}
.kicker{display:inline-flex;align-items:center;gap:6px;font:600 var(--fs-xs)/1 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.kicker .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}
.link{color:var(--accent-tx);font-weight:600}.link:hover{text-decoration:underline;text-underline-offset:3px}
.i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.i-s{width:16px;height:16px}.i-l{width:24px;height:24px}
.icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.emoji{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
hr{border:0;border-top:1px solid var(--line);margin:var(--sp-6) 0}

/* 5 ─ atmosphere: floodlights and pitch geometry, CSS only */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(60vmax 40vmax at 12% -12%,var(--glow-a),transparent 62%),
  radial-gradient(50vmax 34vmax at 92% -16%,var(--glow-b),transparent 60%),
  radial-gradient(80vmax 50vmax at 50% 120%,rgba(0,0,0,.35),transparent 70%),
  linear-gradient(180deg,var(--bg-2),var(--bg) 38%,var(--bg-deep))}
html[data-theme=light] body::before{background:
  radial-gradient(70vmax 40vmax at 10% -14%,rgba(255,255,255,.95),transparent 60%),
  radial-gradient(50vmax 30vmax at 95% -10%,var(--glow-b),transparent 62%),
  linear-gradient(180deg,#F7F8F4,var(--bg) 40%,var(--bg-2))}
.atmos{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.atmos::before{content:"";position:absolute;inset:-1px;opacity:1;background:
  radial-gradient(circle at 50% 50%,transparent 0 63px,var(--pitch-line) 64px 65px,transparent 66px),
  linear-gradient(90deg,transparent calc(50% - .5px),var(--pitch-line) calc(50% - .5px) calc(50% + .5px),transparent calc(50% + .5px)),
  linear-gradient(transparent calc(100% - 1px),var(--pitch-line) 0);
  -webkit-mask:radial-gradient(120% 90% at 50% 40%,#000 30%,transparent 78%);mask:radial-gradient(120% 90% at 50% 40%,#000 30%,transparent 78%)}
.atmos::after{content:"";position:absolute;inset:0;background:
  radial-gradient(70% 55% at 0% 0%,rgba(255,255,255,.07),transparent 60%),
  radial-gradient(70% 55% at 100% 0%,rgba(255,240,200,.055),transparent 60%)}
html[data-theme=light] .atmos::after{background:radial-gradient(70% 55% at 0% 0%,rgba(255,255,255,.8),transparent 60%),radial-gradient(70% 55% at 100% 0%,rgba(255,236,190,.35),transparent 60%)}

/* 6 ─ shell */
#progress{position:fixed;left:0;top:0;height:2px;width:0;z-index:120;background:linear-gradient(90deg,var(--mint),var(--accent));opacity:0;transition:width .5s var(--ease),opacity .3s}
#progress.on{opacity:1;width:72%}#progress.done{width:100%;opacity:0}
.app{min-height:100dvh}
.app-main{min-width:0;padding-bottom:calc(var(--nav-h) + var(--safe-b) + 28px)}
.page{width:100%;max-width:var(--content);margin:0 auto;padding:var(--sp-3) var(--gutter) 0;display:flex;flex-direction:column;gap:var(--sp-8)}
.page:focus{box-shadow:none}
.page-head{display:flex;flex-direction:column;gap:6px;padding-top:var(--sp-2)}
.page-head h1{font-size:var(--fs-h1);font-weight:700;letter-spacing:-.028em}
.page-head p{color:var(--ink-2);max-width:60ch}
.page-head .ph-row{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap}
.foot{max-width:var(--content);margin:var(--sp-12) auto 0;padding:var(--sp-6) var(--gutter) calc(var(--sp-6) + var(--nav-h) + var(--safe-b));display:flex;flex-wrap:wrap;gap:var(--sp-3) var(--sp-6);justify-content:space-between;align-items:center;border-top:1px solid var(--line);color:var(--ink-3);font-size:var(--fs-xs)}
.foot nav{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4)}.foot a:hover{color:var(--ink)}

/* top chrome */
.topbar{position:sticky;top:0;z-index:60;height:calc(var(--top-h) + var(--safe-t));padding:var(--safe-t) var(--gutter) 0;display:flex;align-items:center;gap:var(--sp-3);
  background:linear-gradient(180deg,var(--glass),color-mix(in srgb,var(--glass) 70%,transparent));-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-bottom:1px solid transparent;transition:border-color var(--t-mid),background var(--t-mid)}
.topbar.scrolled{border-bottom-color:var(--glass-line)}
.tb-brand{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.mark,.brand-mark{width:30px;height:30px;flex:none;border-radius:9px;display:grid;place-items:center;font:800 15px/1 var(--display);color:var(--accent-ink);background:linear-gradient(145deg,var(--accent-2),var(--accent) 55%,#B9902F);box-shadow:0 0 0 1px rgba(255,255,255,.18) inset,0 6px 18px -6px var(--accent-line)}
.tb-title{min-width:0;display:flex;flex-direction:column;line-height:1.1}
.tb-title b{font:650 var(--fs-m)/1.15 var(--display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-title small{font-size:var(--fs-xs);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-tools{display:flex;align-items:center;gap:6px}
.tb-btn{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--ink-2);transition:background var(--t-fast),color var(--t-fast)}
.tb-btn:hover{background:var(--surface-2);color:var(--ink)}
.tb-btn[aria-busy=true] .i{animation:spin .8s linear infinite}
.me{display:flex;align-items:center;gap:8px;height:40px;padding:0 10px 0 4px;border-radius:var(--r-full);background:var(--surface-2);border:1px solid var(--line);transition:background var(--t-fast)}
.me:hover{background:var(--surface-3)}
.me b{font:650 var(--fs-s)/1 var(--font)}
.avatar{position:relative;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;font:700 13px/1 var(--display);color:var(--accent-ink);background:linear-gradient(145deg,var(--accent-2),var(--accent))}
.avatar-rank{position:absolute;right:-5px;bottom:-5px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--raised);box-shadow:0 0 0 1.5px var(--bg)}
.avatar-rank svg{width:10px;height:13px}
/* cosmetics (reward frames / auras) */
.avatar.frame-gold{box-shadow:0 0 0 2px #E8C25E}.avatar.frame-emerald{box-shadow:0 0 0 2px #2FBF83}.avatar.frame-diamond{box-shadow:0 0 0 2px #CFE8FF}
.avatar.aura-floodlight{box-shadow:0 0 14px 2px rgba(232,196,106,.55)}.avatar.aura-pitch{box-shadow:0 0 14px 2px rgba(63,224,178,.5)}
.top-verdict{display:none}
.topbar.show-verdict .top-verdict{display:flex;align-items:center;gap:8px;min-width:0;font-size:var(--fs-s);animation:fadeIn var(--t-mid) var(--ease)}
.topbar.show-verdict .tb-title{display:none}
.tv-teams{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:38vw}
.tv-pick{display:flex;align-items:center;gap:6px;white-space:nowrap}.tv-name{max-width:30vw;overflow:hidden;text-overflow:ellipsis}

/* 7 ─ navigation */
.nav-bottom{position:fixed;z-index:70;left:50%;transform:translateX(-50%);bottom:calc(10px + var(--safe-b));width:min(calc(100% - 20px),520px);height:var(--nav-h);padding:6px;display:grid;grid-template-columns:repeat(5,1fr);gap:2px;
  border-radius:24px;background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line);box-shadow:0 18px 40px -16px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.05) inset}
html[data-theme=light] .nav-bottom{box-shadow:0 18px 40px -18px rgba(16,32,26,.35),0 1px 0 #fff inset}
.nb-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:18px;color:var(--ink-3);font:600 10.5px/1 var(--font);letter-spacing:.01em;transition:color var(--t-fast);min-width:0;-webkit-tap-highlight-color:transparent}
.nb-item .i{width:22px;height:22px;transition:transform var(--t-mid) var(--spring)}
.nb-item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}
.nb-item::before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--surface-3);opacity:0;transform:scale(.7);transition:opacity var(--t-mid) var(--ease),transform var(--t-mid) var(--ease)}
.nb-item[aria-current=page],.nb-item.active{color:var(--ink)}
.nb-item[aria-current=page]::before,.nb-item.active::before{opacity:1;transform:scale(1)}
.nb-item[aria-current=page] .i,.nb-item.active .i{color:var(--accent-tx);transform:translateY(-1px)}
.nb-item:active .i{transform:scale(.88)}
.nb-count{position:absolute;top:6px;left:calc(50% + 6px);min-width:16px;height:16px;padding:0 4px;border-radius:8px;display:grid;place-items:center;font:700 10px/1 var(--font);color:var(--accent-ink);background:var(--accent)}
/* desktop rail */
.rail{display:none}
.rail-nav{display:flex;flex-direction:column;gap:2px}
.rail-link{display:flex;align-items:center;gap:12px;height:42px;padding:0 12px;border-radius:12px;color:var(--ink-2);font-weight:550;transition:background var(--t-fast),color var(--t-fast)}
.rail-link:hover{background:var(--surface-2);color:var(--ink)}
.rail-link[aria-current=page],.rail-link.active{background:var(--surface-3);color:var(--ink)}
.rail-link[aria-current=page] .i,.rail-link.active .i{color:var(--accent-tx)}
.rail-link .nb-count{position:static;margin-left:auto}
.rail-label{margin:18px 12px 6px;font:600 var(--fs-xs)/1 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.rail-foot{margin-top:auto;display:flex;flex-direction:column;gap:6px}
.rail-me{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;text-align:left;border:1px solid var(--line);background:var(--surface)}
.rail-me:hover{background:var(--surface-2)}
.rail-me span{display:flex;flex-direction:column;min-width:0;font-size:var(--fs-s)}
.rail-me small{color:var(--ink-3);font-size:var(--fs-xs)}
.brand{display:flex;align-items:center;gap:10px;padding:4px 8px 18px}
.brand-name{display:flex;flex-direction:column;font:700 1.05rem/1.1 var(--display);letter-spacing:-.02em}
.brand-name small{font:500 var(--fs-xs)/1.2 var(--font);color:var(--ink-3);letter-spacing:.02em}
/* More sheet */
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.more-tile{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:14px 12px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);font-weight:600;font-size:var(--fs-s);min-height:84px;transition:background var(--t-fast),transform var(--t-fast)}
.more-tile:hover{background:var(--surface-2)}.more-tile:active{transform:scale(.97)}
.more-tile .i{color:var(--accent-tx)}
.more-list{display:flex;flex-direction:column;margin-top:var(--sp-4);border-top:1px solid var(--line)}
.more-row{display:flex;align-items:center;gap:12px;min-height:52px;border-bottom:1px solid var(--line);font-weight:550}
.more-row .i{color:var(--ink-2)}.more-row .end{margin-left:auto;color:var(--ink-3);font-size:var(--fs-s);font-weight:500}
.more-row select{margin-left:auto}

/* 8 ─ primitives */
.btn{--h:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--h);padding:0 18px;border-radius:var(--r-full);font:600 var(--fs-m)/1 var(--font);letter-spacing:-.005em;white-space:nowrap;color:var(--ink);background:var(--surface-2);border:1px solid var(--line-2);transition:background var(--t-fast),border-color var(--t-fast),transform var(--t-fast),box-shadow var(--t-mid);-webkit-tap-highlight-color:transparent;text-align:center}
.btn:hover{background:var(--surface-3);border-color:var(--line-3)}
.btn:active{transform:scale(.97)}
.btn[disabled],.btn[aria-disabled=true]{opacity:.45;pointer-events:none}
.btn-gold,.btn-primary{color:var(--accent-ink);border-color:transparent;background:linear-gradient(180deg,var(--accent-2),var(--accent));box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 10px 26px -12px var(--accent-line)}
.btn-gold:hover,.btn-primary:hover{background:linear-gradient(180deg,#FBE3A6,var(--accent-2));border-color:transparent}
html[data-theme=light] .btn-gold{color:#1E1503}
.btn-ghost{background:transparent;border-color:transparent;color:var(--ink-2)}.btn-ghost:hover{background:var(--surface-2);color:var(--ink)}
.btn-sm{--h:40px;padding:0 14px;font-size:var(--fs-s)}
.btn-lg{--h:52px;padding:0 24px;font-size:var(--fs-l)}
.btn-block{width:100%}
.btn .i{width:18px;height:18px}
.icon-btn{width:44px;height:44px;border-radius:50%;display:inline-grid;place-items:center;color:var(--ink-2);background:var(--surface);border:1px solid var(--line);transition:background var(--t-fast),color var(--t-fast),transform var(--t-fast)}
.icon-btn:hover{background:var(--surface-2);color:var(--ink)}.icon-btn:active{transform:scale(.92)}
/* save toggle */
.save{width:44px;height:44px;border-radius:50%;display:inline-grid;place-items:center;flex:none;color:var(--ink-3);background:transparent;border:1px solid var(--line);transition:color var(--t-fast),background var(--t-fast),border-color var(--t-fast)}
.save .i{transition:transform var(--t-mid) var(--spring)}
.save:hover{color:var(--ink);border-color:var(--line-2)}
.save[aria-pressed=true]{color:var(--accent-ink);background:var(--accent);border-color:transparent}
.save[aria-pressed=true] .i{fill:currentColor}
.save.pop .i{animation:pop var(--t-slow) var(--spring)}
.save-wide{width:auto;padding:0 14px;gap:8px;border-radius:var(--r-full);font:600 var(--fs-s)/1 var(--font);height:40px;display:inline-flex;align-items:center}
/* follow star */
.fav{position:relative;width:34px;height:34px;border-radius:50%;display:inline-grid;place-items:center;color:var(--ink-3);border:1px solid var(--line);transition:color var(--t-fast),background var(--t-fast)}
.fav[aria-pressed=true]{color:var(--accent-tx);border-color:var(--accent-line);background:var(--accent-soft)}
.fav[aria-pressed=true] .i{fill:currentColor}
.fav.pop .i{animation:pop var(--t-slow) var(--spring)}
.fav::after,.wl-remove::after,.topbar .mark::after{content:"";position:absolute;inset:-5px;border-radius:50%}   /* ≥44 px touch area, smaller visual */
.wl-remove,.topbar .mark{position:relative}
.topbar .mark::after{inset:-7px;border-radius:12px}
/* chips / pills */
.chip{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:0 10px;border-radius:var(--r-full);font:600 var(--fs-xs)/1 var(--font);color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);white-space:nowrap}
.chip .i{width:14px;height:14px}
.chip-gold{color:var(--accent-tx);background:var(--accent-soft);border-color:var(--accent-line)}
.chip-win,.chip-ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent);border-color:color-mix(in srgb,var(--ok) 32%,transparent)}
.chip-live{color:#fff;background:var(--live);border-color:transparent}
.chip-warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 12%,transparent);border-color:color-mix(in srgb,var(--warn) 30%,transparent)}
.chip-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 16px;border-radius:var(--r-full);font:600 var(--fs-s)/1.1 var(--font);color:var(--ink-2);background:var(--surface);border:1px solid var(--line-2);transition:all var(--t-fast) var(--ease)}
.chip-btn:hover{color:var(--ink);background:var(--surface-2)}
.chip-btn[aria-pressed=true],.chip-btn[aria-checked=true]{color:var(--accent-ink);background:var(--accent);border-color:transparent;box-shadow:0 8px 20px -10px var(--accent-line)}
.chip-btn:active{transform:scale(.96)}
/* signal */
.sig{--c:var(--open);display:inline-flex;align-items:center;gap:6px;font:650 var(--fs-xs)/1 var(--font);letter-spacing:.02em;color:var(--c);white-space:nowrap}
.sig::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 20%,transparent)}
.sig-strong{--c:var(--strong)}.sig-solid{--c:var(--solid)}.sig-lean{--c:var(--lean)}.sig-open{--c:var(--open)}
.sig-pill{padding:5px 10px 5px 8px;border-radius:var(--r-full);background:color-mix(in srgb,var(--c) 12%,transparent);border:1px solid color-mix(in srgb,var(--c) 28%,transparent)}
/* legacy signal classes used by JS-rendered analysis */
.signal,.signal-mini{--c:var(--open);display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:var(--r-full);font:650 var(--fs-xs)/1 var(--font);color:var(--c);background:color-mix(in srgb,var(--c) 12%,transparent);border:1px solid color-mix(in srgb,var(--c) 26%,transparent);white-space:nowrap}
.signal-mini{padding:3px 8px;font-size:11px}
.sig-dot{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 18%,transparent)}
.signal-strong{--c:var(--strong)}.signal-solid{--c:var(--solid)}.signal-lean{--c:var(--lean)}.signal-open{--c:var(--open)}
/* crest */
.crest{width:28px;height:28px;flex:none;border-radius:50%;display:grid;place-items:center;overflow:hidden;font:700 10px/1 var(--display);letter-spacing:.02em;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);text-transform:uppercase}
.crest img{width:78%;height:78%;object-fit:contain}
.crest.big,.crest-l{width:56px;height:56px;font-size:15px}
.crest-xl{width:68px;height:68px;font-size:18px;background:radial-gradient(circle at 50% 35%,var(--surface-3),var(--surface));border-color:var(--line-2);box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}
.crest-s{width:22px;height:22px;font-size:8px}
/* surfaces */
.surface{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l)}
.panel{position:relative;background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--line);border-radius:var(--r-l);padding:var(--sp-5);box-shadow:var(--shadow-1)}
.glass{background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line)}
.divider{height:1px;background:var(--line)}
/* section header */
.sec{display:flex;flex-direction:column;gap:var(--sp-3)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3)}
.sec-head h2{font-size:var(--fs-h3);font-weight:650;letter-spacing:-.012em}
.sec-head .sec-sub{display:block;margin-top:2px;font:400 var(--fs-s)/1.4 var(--font);color:var(--ink-3);letter-spacing:0}
.sec-link{display:inline-flex;align-items:center;gap:4px;font:600 var(--fs-s)/1 var(--font);color:var(--accent-tx);white-space:nowrap;padding:8px 0}
.sec-link .i{width:16px;height:16px}
/* forms */
.field{display:flex;flex-direction:column;gap:6px}
.field>span,.field label{font:600 var(--fs-s)/1.2 var(--font);color:var(--ink-2)}
input[type=text],input[type=email],input[type=password],input[type=search],input:not([type]),select,textarea{width:100%;min-height:48px;padding:0 14px;border-radius:var(--r-s);color:var(--ink);background:var(--surface);border:1px solid var(--line-2);transition:border-color var(--t-fast),background var(--t-fast),box-shadow var(--t-fast);font-size:16px}
textarea{padding:12px 14px;min-height:120px;resize:vertical}
select{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%;background-size:5px 5px;background-repeat:no-repeat}
input:focus,select:focus,textarea:focus{border-color:var(--accent-line);background:var(--surface-2);box-shadow:0 0 0 3px var(--accent-soft)}
input::placeholder,textarea::placeholder{color:var(--ink-3)}
.search{position:relative;display:flex;align-items:center}
.search .i{position:absolute;left:14px;color:var(--ink-3);pointer-events:none}
.search input{padding-left:42px;border-radius:var(--r-full);background:var(--surface)}
.search-spin{position:absolute;right:14px;width:16px;height:16px;border-radius:50%;border:2px solid var(--line-2);border-top-color:var(--accent);opacity:0;animation:spin .8s linear infinite;transition:opacity var(--t-fast)}
.search.busy .search-spin{opacity:1}
.search-state{min-height:0;font-size:var(--fs-s);color:var(--ink-3)}
.switch{position:relative;display:inline-block;width:46px;height:28px;flex:none}
.switch input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;z-index:1}
.switch i{position:absolute;inset:0;border-radius:14px;background:var(--surface-3);border:1px solid var(--line-2);transition:background var(--t-fast)}
.switch i::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);transition:transform var(--t-mid) var(--spring)}
.switch input:checked+i{background:var(--accent);border-color:transparent}.switch input:checked+i::after{transform:translateX(18px)}
.switch input:focus-visible+i{box-shadow:var(--focus)}
/* segmented control */
.seg{display:flex;gap:4px;padding:4px;border-radius:var(--r-full);background:var(--surface);border:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg-btn{flex:1 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:0 14px;border-radius:var(--r-full);font:600 var(--fs-s)/1 var(--font);color:var(--ink-2);white-space:nowrap;transition:background var(--t-mid) var(--ease),color var(--t-fast)}
.seg-btn:hover{color:var(--ink)}
.seg-btn[aria-pressed=true],.seg-btn.active,.seg-btn[aria-selected=true]{background:var(--raised-2);color:var(--ink);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 6px 16px -8px rgba(0,0,0,.6)}
html[data-theme=light] .seg-btn[aria-pressed=true],html[data-theme=light] .seg-btn.active{background:#fff;box-shadow:0 1px 3px rgba(16,32,26,.12)}
.seg-count{font-size:11px;color:var(--ink-3);font-weight:600}
.seg-count:empty{display:none}
.seg-btn.is-empty{opacity:.55}
.seg-btn:disabled{opacity:.35}
/* lists */
.list{display:flex;flex-direction:column}
.list>a,.lrow{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 4px;border-bottom:1px solid var(--line);transition:background var(--t-fast)}
.list>a:last-child,.lrow:last-child{border-bottom:0}
.list>a:hover,a.lrow:hover{background:linear-gradient(90deg,transparent,var(--surface),transparent)}
.chev{margin-left:auto;color:var(--ink-3);flex:none}
.tag{display:inline-flex;align-items:center;gap:4px;font:600 11px/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.live-dot{display:inline-flex;align-items:center;gap:6px;color:var(--live);font:700 var(--fs-xs)/1 var(--font);letter-spacing:.06em;text-transform:uppercase}
.live-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--live);animation:pulse 1.6s ease-in-out infinite}

/* 9 ─ probability visuals */
/* segmented 1X2 bar: */
.prob{display:flex;gap:4px;height:10px;width:100%}
.prob i{flex:var(--w,1) 1 0;min-width:6px;border-radius:6px;background:var(--seg);opacity:.42;transform-origin:left center;transition:opacity var(--t-mid),flex-grow var(--t-slow) var(--ease-out)}
.prob i.h{--seg:var(--home)}.prob i.d{--seg:var(--draw)}.prob i.a{--seg:var(--away)}
.prob i.pick{opacity:1;box-shadow:0 0 16px -2px var(--seg)}
.prob-s{height:6px;gap:3px}.prob-s i{border-radius:4px}
.prob-l{height:14px;gap:6px}.prob-l i{border-radius:8px}
.prob.reveal i{animation:segIn var(--t-slow) var(--ease-out) both}
.prob.reveal i:nth-child(2){animation-delay:60ms}.prob.reveal i:nth-child(3){animation-delay:120ms}
/* labelled 1X2 triad */
.triad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}
.triad>*{display:flex;flex-direction:column;gap:6px;padding:12px;border-radius:var(--r-m);border:1px solid var(--line);background:var(--surface);text-align:left;min-width:0;transition:border-color var(--t-fast),background var(--t-fast),transform var(--t-fast)}
.triad .t-p{font:700 clamp(1.35rem,1.1rem + 1.2vw,1.9rem)/1 var(--display);letter-spacing:-.03em}
.triad .t-p small{font-size:.55em;margin-left:1px;color:var(--ink-3);font-weight:600}
.triad .t-l{font-size:var(--fs-xs);color:var(--ink-2);font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.triad .t-l::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:var(--c);vertical-align:1px}
.triad .k-home{--c:var(--home)}.triad .k-draw{--c:var(--draw)}.triad .k-away{--c:var(--away)}
.triad .lead,.triad [aria-pressed=true]{border-color:color-mix(in srgb,var(--c) 55%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--c) 16%,transparent),color-mix(in srgb,var(--c) 5%,transparent))}
.triad .lead .t-p{color:var(--ink)}
.triad button:active{transform:scale(.98)}
/* compact read used in rows: pick + probability + signal */
.read{display:flex;flex-direction:column;gap:6px;min-width:0}
.read-line{display:flex;align-items:baseline;gap:8px;min-width:0}
.read-pick{font-weight:600;font-size:var(--fs-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.read-p{font:700 var(--fs-l)/1 var(--display);letter-spacing:-.02em;margin-left:auto}
/* rings (gauges for markets) */
.ring{--p:50;--c:var(--accent);position:relative;width:56px;height:56px;border-radius:50%;flex:none;background:conic-gradient(var(--c) calc(var(--p)*1%),var(--surface-3) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px));mask:radial-gradient(farthest-side,transparent calc(100% - 6px),#000 calc(100% - 5px))}
.meter{height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--mint),var(--accent));transform-origin:left;animation:barIn var(--t-slow) var(--ease-out) both}

/* 10 ─ match rows (Matches, Saved, Finder, My Teams) */
.day{position:sticky;top:calc(var(--top-h) + var(--safe-t));z-index:5;margin:var(--sp-4) calc(-1 * var(--gutter)) 0;padding:10px var(--gutter);background:linear-gradient(180deg,var(--bg) 70%,transparent);font:650 var(--fs-s)/1 var(--font);letter-spacing:.02em;color:var(--ink-2)}
.day:first-child{margin-top:0}
.day h3{font:inherit;color:inherit;letter-spacing:inherit}
.mrow{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr) auto;grid-template-areas:"when teams act" "when read read";column-gap:12px;row-gap:10px;padding:14px 12px 14px 10px;border-radius:var(--r-m);border:1px solid transparent;background:transparent;transition:background var(--t-fast),border-color var(--t-fast)}
.mrow+.mrow{margin-top:2px}
.mrow::after{content:"";position:absolute;left:74px;right:12px;bottom:-1px;height:1px;background:var(--line)}
.mrow:last-child::after{display:none}
.mrow:hover{background:var(--surface);border-color:var(--line)}
.mrow:hover::after{opacity:0}
.mr-link{position:absolute;inset:0;z-index:1;border-radius:inherit}
.mr-when{grid-area:when;display:flex;flex-direction:column;gap:3px;padding-top:2px}
.mr-when strong{font:650 var(--fs-m)/1 var(--font);letter-spacing:-.01em}
.mr-when span{font-size:11px;color:var(--ink-3);line-height:1.2}
.mr-when .live-dot{font-size:10px}
.mr-teams{grid-area:teams;display:flex;flex-direction:column;gap:7px;min-width:0}
.mr-team{display:flex;align-items:center;gap:10px;min-width:0;font:600 var(--fs-m)/1.2 var(--font)}
.mr-team span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mr-team .sc{margin-left:auto;font:700 var(--fs-m)/1 var(--display)}
.mr-team.w span{color:var(--ink)}.mrow.done .mr-team:not(.w) span{color:var(--ink-2)}
.mr-comp{font-size:11px;color:var(--ink-3);font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:-2px}
.mr-act{grid-area:act;position:relative;z-index:2;display:flex;align-items:flex-start;gap:6px}
.mr-read{grid-area:read;position:relative;z-index:0;display:flex;flex-direction:column;gap:8px;min-width:0}
.mr-read .read-line{font-size:var(--fs-s)}
.mr-note{font-size:var(--fs-xs);color:var(--ink-3);line-height:1.35}
.mr-meta{display:flex;flex-wrap:wrap;gap:6px;position:relative;z-index:2}
.mr-meta .chip{min-height:22px;padding:0 8px;font-size:10.5px}
.fx-updated{font-size:var(--fs-xs);color:var(--ink-3)}
.fresh-sep{opacity:.6}
.mrow.changed{background:linear-gradient(90deg,var(--accent-soft),transparent 70%)}
.mrow.flash{animation:flash 1.2s var(--ease)}
.mlist{display:flex;flex-direction:column}
.mlist.boxed{padding:4px;border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line)}
.mlist.boxed .mrow::after{left:70px}
.criteria{display:flex;flex-direction:column;gap:6px}
.crit{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r-s);background:var(--accent-soft);border:1px solid var(--accent-line);font-size:var(--fs-s)}
.crit b{margin-left:auto;font:700 var(--fs-m)/1 var(--display)}
.crit-fit{font-size:var(--fs-xs);color:var(--ink-3)}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:var(--sp-4);font-size:var(--fs-s);color:var(--ink-3)}
.pagination:empty{display:none}
.pagination div{display:flex;gap:8px}

/* 11 ─ Home */
.home{gap:var(--sp-8)}
.greet{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:var(--sp-1)}
.greet h1{font:650 var(--fs-xl)/1.15 var(--display);letter-spacing:-.02em}
.greet p{font-size:var(--fs-s);color:var(--ink-3);margin-top:3px}
.greet .streak{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:var(--r-full);font:650 var(--fs-s)/1 var(--font);color:var(--accent-tx);background:var(--accent-soft);border:1px solid var(--accent-line)}
/* the intelligence hero */
.hero{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r-xl);padding:var(--sp-5) var(--sp-5) var(--sp-5);border:1px solid var(--line-2);
  background:radial-gradient(120% 90% at 50% -10%,var(--raised-2),var(--raised) 55%,var(--bg-2));box-shadow:var(--shadow-2)}
html[data-theme=light] .hero{background:radial-gradient(120% 90% at 50% -10%,#fff,#F7F8F4 60%,#EEF2EA)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 50% at 18% 108%,var(--home-soft),transparent 70%),radial-gradient(60% 50% at 82% 108%,var(--away-soft),transparent 70%)}
.hero-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:var(--fs-xs);color:var(--ink-2);font-weight:600}
.hero-why{flex:0 1 auto;display:inline-flex;align-items:center;gap:6px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-tx)}
.hero-why .i{width:14px;height:14px}
.hero-comp{display:block;min-width:0;flex:0 1 auto;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero-match{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--sp-2);margin:var(--sp-6) 0 var(--sp-5)}
.hero-team{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;min-width:0}
.hero-team b{font:650 clamp(1rem,.85rem + .9vw,1.45rem)/1.15 var(--display);letter-spacing:-.02em;overflow-wrap:break-word;hyphens:auto}
.hero-team small{font-size:var(--fs-xs);color:var(--ink-3)}
.hero-center{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:72px}
.hero-time{font:700 clamp(1.5rem,1.2rem + 1.4vw,2.2rem)/1 var(--display);letter-spacing:-.03em}
.hero-day{font-size:var(--fs-xs);color:var(--ink-3);font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.hero-read{display:flex;flex-direction:column;gap:12px;padding:var(--sp-4);border-radius:var(--r-l);background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line)}
.hero-read .hr-line{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.hr-pick{display:flex;flex-direction:column;gap:4px;min-width:0}
.hr-pick span{font-size:var(--fs-xs);color:var(--ink-3);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.hr-pick b{font:650 var(--fs-l)/1.2 var(--display);letter-spacing:-.01em}
.hr-p{font:700 var(--fs-num)/.9 var(--display);letter-spacing:-.045em}
.hr-p small{font-size:.42em;color:var(--ink-3);font-weight:600;letter-spacing:0;margin-left:2px}
.hr-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;font-size:var(--fs-xs);color:var(--ink-3)}
.hr-legend span{display:flex;flex-direction:column;gap:2px}.hr-legend span:nth-child(2){text-align:center}.hr-legend span:last-child{text-align:right}
.hr-legend b{font:650 var(--fs-s)/1 var(--font);color:var(--ink-2)}
.hr-legend .on b{color:var(--ink)}
.hero-cta{display:flex;align-items:center;gap:10px;margin-top:var(--sp-4)}
.hero-cta .btn-gold{flex:1}
.hero-empty{padding:var(--sp-4) 0;color:var(--ink-2)}
.hero-state{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:var(--fs-xs);color:var(--ink-3)}
/* today's intelligence rail */
.scroller{display:flex;gap:var(--sp-3);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--gutter);margin:0 calc(-1 * var(--gutter));padding:2px var(--gutter) 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.scroller::-webkit-scrollbar{display:none}
.intel{scroll-snap-align:start;flex:0 0 min(78%,300px);display:flex;flex-direction:column;gap:12px;padding:var(--sp-4);border-radius:var(--r-l);background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--line);transition:border-color var(--t-fast),transform var(--t-fast)}
.intel:hover{border-color:var(--line-2)}.intel:active{transform:scale(.985)}
.intel-k{display:flex;align-items:center;gap:6px;font:650 11px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--c,var(--ink-3))}
.intel-k .i{width:14px;height:14px}
.intel-teams{display:flex;flex-direction:column;gap:6px;font:600 var(--fs-m)/1.2 var(--font)}
.intel-teams span{display:flex;align-items:center;gap:8px;min-width:0}
.intel-teams span em{font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.intel-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;font-size:var(--fs-xs);color:var(--ink-3)}
.intel-foot b{font:700 var(--fs-l)/1 var(--display);color:var(--ink);letter-spacing:-.02em}
.intel.k-strong{--c:var(--strong)}.intel.k-change{--c:var(--accent)}.intel.k-lineups{--c:var(--mint)}.intel.k-saved{--c:var(--solid)}.intel.k-review{--c:var(--ink-2)}
/* finder entry */
.ask{position:relative;display:flex;flex-direction:column;gap:14px;padding:var(--sp-5);border-radius:var(--r-xl);overflow:hidden;isolation:isolate;
  background:linear-gradient(135deg,color-mix(in srgb,var(--mint) 10%,transparent),transparent 45%),linear-gradient(315deg,var(--accent-soft),transparent 50%),var(--surface);border:1px solid var(--line-2);transition:border-color var(--t-mid),transform var(--t-fast)}
.ask:hover{border-color:var(--accent-line)}.ask:active{transform:scale(.99)}
.ask-k{display:flex;align-items:center;gap:8px;font:650 var(--fs-xs)/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--mint)}
.ask-q{display:flex;align-items:center;gap:12px;min-height:52px;padding:0 8px 0 16px;border-radius:var(--r-full);background:var(--glass);border:1px solid var(--glass-line);color:var(--ink-2);font-size:var(--fs-m)}
.ask-q .i{color:var(--accent-tx)}
.ask-q em{font-style:normal;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ask-go{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:var(--accent-ink);flex:none}
.ask-ex{display:flex;gap:8px;flex-wrap:wrap}
.ask-ex span{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:var(--r-full);font:600 var(--fs-xs)/1 var(--font);color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line)}
.ask-ex b{color:var(--ink)}
/* personal strip */
.me-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-3)}
.me-card{display:flex;flex-direction:column;gap:12px;padding:var(--sp-4);border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line)}
.me-card h3{display:flex;align-items:center;gap:8px;font:650 var(--fs-m)/1.2 var(--display)}
.me-card h3 .i{color:var(--accent-tx);width:18px;height:18px}
.me-card h3 a{margin-left:auto}
.team-chips{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;margin:0 -4px;padding:2px 4px}
.team-chips::-webkit-scrollbar{display:none}
.tchip{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border-radius:var(--r-full);background:var(--surface-2);border:1px solid var(--line);max-width:260px}
.tchip span{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.tchip b{font-size:var(--fs-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tchip small{font-size:11px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-line{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;font-size:var(--fs-s);color:var(--ink-2)}
.stat-line b{font:700 var(--fs-xl)/1 var(--display);color:var(--ink);margin-right:4px}
.continue{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);transition:background var(--t-fast)}
.continue:hover{background:var(--surface-2)}
.continue .i{color:var(--ink-3)}
.continue span{min-width:0;display:flex;flex-direction:column;gap:2px}
.continue small{font-size:var(--fs-xs);color:var(--ink-3)}
.continue b{font-size:var(--fs-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* review strip (finished saved matches) */
.recap{display:flex;flex-direction:column}
.recap a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:12px 4px;border-bottom:1px solid var(--line)}
.recap a:last-child{border-bottom:0}
.recap .rc-teams{font-weight:600;font-size:var(--fs-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recap .rc-score{font:700 var(--fs-m)/1 var(--display)}
.recap .rc-pick{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:var(--fs-xs);color:var(--ink-3)}
.mark-ok,.mark-miss{display:inline-flex;align-items:center;gap:4px;font:650 var(--fs-xs)/1 var(--font)}
.mark-ok{color:var(--ok)}.mark-miss{color:var(--ink-3)}

/* 12 ─ Matches + Finder */
.mx-head{display:flex;flex-direction:column;gap:var(--sp-3)}
.mx-flow{display:flex;flex-direction:column;gap:10px}
.mx-step{display:flex;align-items:center;gap:10px}
.mx-step>.kicker{width:68px;flex:none}
.comp-pick{flex:1;min-width:0;display:flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;border-radius:var(--r-full);background:var(--surface);border:1px solid var(--line-2);text-align:left;transition:border-color var(--t-fast),background var(--t-fast)}
.comp-pick:hover{background:var(--surface-2)}
.comp-pick b{min-width:0;flex:1;font-size:var(--fs-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.comp-pick .lp-label{display:none}
.lp-count{min-width:20px;height:20px;padding:0 6px;border-radius:10px;display:grid;place-items:center;font:700 11px/1 var(--font);color:var(--accent-ink);background:var(--accent)}
.leagues{display:none}
.mx-tools{display:flex;gap:8px;align-items:center}
.mx-tools .search{flex:1}
.active-filter:empty{display:none}
#active-match-filter:empty{display:none}
#active-match-filter{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:var(--fs-s);color:var(--ink-2)}
.af{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.recent-comps{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.recent-comps:empty{display:none}
/* finder entry inside Matches */
.pred-bar{display:block}
.pred-open{width:100%;display:flex;align-items:center;gap:12px;min-height:56px;padding:0 10px 0 16px;border-radius:var(--r-l);text-align:left;color:var(--ink);
  background:linear-gradient(120deg,color-mix(in srgb,var(--mint) 12%,transparent),transparent 55%),var(--surface);border:1px solid var(--line-2);transition:border-color var(--t-mid),transform var(--t-fast)}
.pred-open:hover{border-color:var(--accent-line)}.pred-open:active{transform:scale(.99)}
.pred-open .po-t{display:flex;flex-direction:column;min-width:0;flex:1}
.pred-open .po-t b{font:650 var(--fs-m)/1.2 var(--display)}
.pred-open .po-t small{font-size:var(--fs-xs);color:var(--ink-3)}
.pred-open .ask-go{width:36px;height:36px}
.pred-active{display:flex;flex-direction:column;gap:10px;padding:var(--sp-4);border-radius:var(--r-l);background:linear-gradient(120deg,var(--accent-soft),transparent 60%),var(--surface);border:1px solid var(--accent-line)}
.pa-k{display:flex;align-items:center;gap:8px;font:650 var(--fs-xs)/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-tx)}
.pa-list{display:flex;flex-wrap:wrap;gap:6px}
.pa-list .chip{min-height:30px;font-size:var(--fs-s);padding:0 12px}
.pa-actions{display:flex;gap:8px}
.pred-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:var(--sp-2);font-size:var(--fs-s);color:var(--ink-2)}
.pred-summary b{font:700 var(--fs-l)/1 var(--display);color:var(--ink)}
.pred-rule summary{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);color:var(--ink-3)}
.pred-rule[open]{flex-basis:100%}
.pred-notes{margin-top:var(--sp-3)}
/* finder sheet */
.pred-hero{display:flex;flex-direction:column;gap:4px;padding:2px 0 var(--sp-3)}
.pred-hero h2{font:700 var(--fs-h2)/1.1 var(--display);letter-spacing:-.025em}
.pred-hero p{font-size:var(--fs-s);color:var(--ink-3)}
.pred-scroll{display:flex;flex-direction:column;gap:var(--sp-5);overflow-y:auto;padding:2px 2px var(--sp-4);overscroll-behavior:contain}
.pred-group{display:flex;flex-direction:column;gap:10px}
.pred-group legend{display:flex;align-items:center;gap:8px;margin-bottom:10px;font:650 var(--fs-s)/1 var(--font);color:var(--ink)}
.pred-group legend .i{color:var(--accent-tx);width:18px;height:18px}
.pred-choices{display:flex;flex-wrap:wrap;gap:8px}
.pred-choices-goals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.pred-choices-goals .chip-btn{padding:0 6px}
.pred-one{font-size:var(--fs-xs);color:var(--ink-3)}
.pred-limited{display:flex;align-items:flex-start;gap:12px;padding:14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line)}
.pred-limited input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent);flex:none}
.pred-limited span{display:flex;flex-direction:column;gap:3px}.pred-limited small{color:var(--ink-3);font-size:var(--fs-xs)}
.pred-foot{display:flex;flex-direction:column;gap:10px}
.pred-count{font-size:var(--fs-s);color:var(--ink-2);text-align:center}
.pred-foot-actions{display:grid;grid-template-columns:auto 1fr;gap:8px}

/* 13 ─ Analysis story */
.back{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;min-height:36px;padding:0 12px 0 8px;margin-bottom:calc(-1 * var(--sp-4));border-radius:var(--r-full);font:600 var(--fs-s)/1 var(--font);color:var(--ink-2);background:var(--surface);border:1px solid var(--line)}
.back:hover{color:var(--ink)}
.stage{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r-xl);padding:var(--sp-5);border:1px solid var(--line-2);background:radial-gradient(120% 100% at 50% -20%,var(--raised-2),var(--raised) 55%,var(--bg-2));box-shadow:var(--shadow-2)}
html[data-theme=light] .stage{background:radial-gradient(120% 100% at 50% -20%,#fff,#F6F8F3 60%,#EDF1E9)}
.stage::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(55% 60% at 0% 100%,var(--home-soft),transparent 70%),radial-gradient(55% 60% at 100% 100%,var(--away-soft),transparent 70%)}
.stage-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:var(--fs-xs);color:var(--ink-2);font-weight:600}
.stage-comp{display:flex;align-items:center;gap:8px;min-width:0}
.stage-comp span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stage-match{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:start;gap:var(--sp-3);margin:var(--sp-6) 0 var(--sp-4)}
.stage-team{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;min-width:0}
.stage-team h2{font:650 clamp(1.05rem,.85rem + 1.1vw,1.7rem)/1.15 var(--display);letter-spacing:-.025em;overflow-wrap:break-word;hyphens:auto}
.stage-team .pos{display:flex;align-items:center;gap:8px;font-size:var(--fs-xs);color:var(--ink-3)}
.stage-center{display:flex;flex-direction:column;align-items:center;gap:6px;padding-top:12px;min-width:76px}
.stage-center strong{font:700 clamp(1.8rem,1.4rem + 1.8vw,2.8rem)/1 var(--display);letter-spacing:-.04em}
.stage-center span{font-size:var(--fs-xs);color:var(--ink-3);font-weight:600;text-transform:uppercase;letter-spacing:.06em;text-align:center}
.stage-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding-top:var(--sp-4);border-top:1px solid var(--line)}
.stage-venue{font-size:var(--fs-xs);color:var(--ink-3);display:flex;align-items:center;gap:6px;min-width:0}
.state-line{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin-top:var(--sp-3);font-size:var(--fs-xs);color:var(--ink-3)}
.state-line .ok{color:var(--ok)}.state-line .warn{color:var(--warn)}
.state-line>span{display:inline-flex;align-items:center;gap:6px}
.live-pulse{display:inline-flex;width:8px;height:8px}.live-pulse i{width:8px;height:8px;border-radius:50%;background:var(--mint);animation:pulse 1.6s infinite}
.tourney{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-top:var(--sp-3);font-size:var(--fs-xs);color:var(--ink-2)}
/* the read: centrepiece */
.read-card{position:relative;display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-5);border-radius:var(--r-xl);background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--line-2)}
.read-k{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font:650 var(--fs-xs)/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-tx)}
.verdict-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;font:700 var(--fs-hero)/1.05 var(--display);letter-spacing:-.035em}
.verdict-line:focus{box-shadow:none}
.vl-p{color:var(--accent-tx)}
.vl-dash{color:var(--ink-3);font-weight:400}
.verdict-line .signal{font-size:var(--fs-xs);letter-spacing:0;align-self:center}
.verdict-lead{color:var(--ink-2);font-size:var(--fs-m);max-width:62ch}
.signal-brief,.verdict-sub{font-size:var(--fs-s);color:var(--ink-3)}
.signal-brief b{color:var(--ink-2)}
.limited-note{padding:12px 14px;border-radius:var(--r-m);background:color-mix(in srgb,var(--warn) 10%,transparent);border:1px solid color-mix(in srgb,var(--warn) 28%,transparent);font-size:var(--fs-s)}
.tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}
.tri-col{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px 12px;border-radius:var(--r-m);text-align:left;background:var(--surface);border:1px solid var(--line);min-width:0;transition:border-color var(--t-fast),background var(--t-fast),transform var(--t-fast)}
.tri-col .tri-num{font:700 clamp(1.6rem,1.2rem + 1.8vw,2.6rem)/.95 var(--display);letter-spacing:-.04em}
.tri-col .tri-num small{font-size:.48em;color:var(--ink-3);margin-left:1px;letter-spacing:0}
.tri-col .tri-label{font:600 var(--fs-xs)/1.25 var(--font);color:var(--ink-2);overflow-wrap:anywhere}
.tri-col.k-home{--c:var(--home)}.tri-col.k-draw{--c:var(--draw)}.tri-col.k-away{--c:var(--away)}
.tri-col .tri-label::before{content:"";display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;background:var(--c);vertical-align:0}
.tri-col.lead,.tri-col[aria-pressed=true]{border-color:color-mix(in srgb,var(--c) 55%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--c) 16%,transparent),color-mix(in srgb,var(--c) 4%,transparent))}
.tri-col:active{transform:scale(.98)}
.tri-bar{display:flex;gap:4px;height:10px}
.tri-bar i,.qv-bar i,.hh-bar i{flex-basis:0;min-width:6px;border-radius:6px;opacity:.42;background:var(--seg);animation:segIn var(--t-slow) var(--ease-out) both}
.tri-bar i.h,.qv-bar i.h,.hh-bar i.h{--seg:var(--home)}.tri-bar i.d,.qv-bar i.d,.hh-bar i.d{--seg:var(--draw)}.tri-bar i.a,.qv-bar i.a,.hh-bar i.a{--seg:var(--away)}
.tri-bar i.pick,.qv-bar i.pick,.hh-bar i.pick{opacity:1;box-shadow:0 0 14px -2px var(--seg)}
.qv-bar,.hh-bar{display:flex;gap:3px;height:6px}
.tri-read{font-size:var(--fs-s);color:var(--ink-2);min-height:1.4em}
.movement{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:12px 14px;border-radius:var(--r-m);background:var(--accent-soft);border:1px solid var(--accent-line);font-size:var(--fs-s)}
.mv-label{display:inline-flex;align-items:center;gap:6px;font-weight:650;color:var(--accent-tx)}
/* story navigation + chapters */
.story-nav{position:sticky;top:calc(var(--top-h) + var(--safe-t));z-index:20;margin:0 calc(-1 * var(--gutter));padding:8px var(--gutter);background:linear-gradient(180deg,var(--bg) 75%,transparent);display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.story-nav::-webkit-scrollbar{display:none}
.story-nav .tab{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border-radius:var(--r-full);font:600 var(--fs-s)/1 var(--font);color:var(--ink-2);background:var(--surface);border:1px solid var(--line);white-space:nowrap;transition:all var(--t-fast)}
.story-nav .tab:hover{color:var(--ink)}
.story-nav .tab.active,.story-nav .tab[aria-selected=true]{color:var(--accent-ink);background:var(--accent);border-color:transparent}
.story-nav .tab .emoji{display:none}
.story-nav .tab:disabled{opacity:.6}
.story{display:flex;flex-direction:column;gap:var(--sp-8)}
.chapter{display:flex;flex-direction:column;gap:var(--sp-4);scroll-margin-top:calc(var(--top-h) + var(--safe-t) + 60px)}
.ch-head{display:flex;align-items:baseline;gap:12px}
.ch-n{font:600 var(--fs-xs)/1 var(--font);color:var(--accent-tx);letter-spacing:.08em;font-variant-numeric:tabular-nums}
.ch-head h2{font-size:var(--fs-h2);letter-spacing:-.025em}
.ch-head p{font-size:var(--fs-s);color:var(--ink-3)}
.ch-head-t{display:flex;flex-direction:column;gap:4px;min-width:0}
/* key markets */
.km{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2)}
.kmi{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);min-width:0}
.kmi strong{font:700 var(--fs-xl)/1 var(--display);letter-spacing:-.02em}
.kmi span{font-size:var(--fs-xs);color:var(--ink-2);line-height:1.3}
.kmi.lead{border-color:var(--accent-line);background:linear-gradient(180deg,var(--accent-soft),transparent)}
.kmi .meter{margin-top:auto}
.kmi small{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11px;color:var(--ink-3)}
.km-picks{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--sp-3)}
/* why short */
.ws-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-4)}
.ws-col{display:flex;flex-direction:column;gap:10px}
.ws-col h3{display:flex;align-items:center;gap:8px;font:650 var(--fs-s)/1.2 var(--font)}
.ws-col h3 .i{width:18px;height:18px}
.ws-col.for h3 .i{color:var(--ok)}.ws-col.against h3 .i{color:var(--warn)}
.ws-list{display:flex;flex-direction:column;gap:2px}
.ws-list li{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s);color:var(--ink-2);line-height:1.45}
.ws-list li:last-child{border-bottom:0}
.ws-list li>span:first-child{flex:none}
.glyph{display:inline-grid;place-items:center;flex:none;width:26px;height:26px;border-radius:9px;background:var(--surface-2);color:var(--accent-tx);box-shadow:inset 0 0 0 1px var(--line)}
.glyph .i{width:15px;height:15px}
.chapter-more{width:100%;justify-content:center;gap:8px}
.ws-col.for .glyph{color:var(--strong)}
.ws-list.against .glyph{color:var(--ink-3)}
.empty .medal .glyph{width:auto;height:auto;background:none;box-shadow:none}
.empty .medal .glyph .i{width:22px;height:22px}
/* review (finished match) */
.review{display:flex;flex-direction:column;gap:var(--sp-4)}
.rv-steps{display:flex;flex-direction:column;gap:var(--sp-4);counter-reset:none}
.rv-step{display:flex;flex-direction:column;gap:10px;padding:var(--sp-4);border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line)}
.rv-step-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font:650 var(--fs-s)/1.2 var(--font)}
.rv-n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:700 12px/1 var(--font);color:var(--accent-ink);background:var(--accent)}
.rv-pick{font:700 var(--fs-xl)/1.15 var(--display);letter-spacing:-.02em;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.rv-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;font-size:var(--fs-xs)}
.rv-tri span{display:flex;flex-direction:column;gap:4px;padding:10px;border-radius:var(--r-s);border:1px solid var(--line);color:var(--ink-2);min-width:0;overflow-wrap:anywhere}
.rv-tri span b{font:700 var(--fs-l)/1 var(--display);color:var(--ink)}
.rv-tri .on{border-color:var(--accent-line);background:var(--accent-soft)}
.rv-tri .actual{box-shadow:inset 0 0 0 1.5px var(--ok)}
.rv-final-tag{font-size:10px;color:var(--ok);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.rv-result{display:flex;align-items:center;gap:var(--sp-4)}
.rv-score{font:700 2.6rem/1 var(--display);letter-spacing:-.04em}
.rv-summary{display:flex;flex-wrap:wrap;gap:8px}
.rv-sum{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:var(--r-full);font:650 var(--fs-xs)/1 var(--font)}
.rv-sum.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent)}.rv-sum.miss{color:var(--ink-2);background:var(--surface-2)}
.rv-sum-m2{font-size:var(--fs-xs);color:var(--ink-3)}
.rv-list{display:flex;flex-direction:column}
.rv-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.rv-list li:last-child{border-bottom:0}
.rv-state{font:650 var(--fs-xs)/1 var(--font);padding:5px 9px;border-radius:var(--r-full);white-space:nowrap}
.rv-state.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent)}.rv-state.miss{color:var(--ink-2);background:var(--surface-2)}.rv-state.na{color:var(--ink-3)}
.rv-context{grid-column:1/-1}
.rv-tag{font-size:10px;color:var(--accent-tx);font-weight:700}
.rv-eval{padding:var(--sp-4);border-radius:var(--r-m);border:1px dashed var(--line-2);font-size:var(--fs-s)}
.rv-eval summary{font-weight:650;color:var(--ink-2)}
.rv-metrics{margin-top:8px}
.rv-proj{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:8px}
.rv-proj div{display:flex;justify-content:space-between;padding:8px 10px;border-radius:var(--r-s);background:var(--surface)}
.rv-trust{font-size:var(--fs-xs);color:var(--ink-3)}
.mark{flex:none}

/* 13b ─ analysis chapter content (rendered by customer-analysis.js) */
.stack{display:flex;flex-direction:column;gap:var(--sp-4)}
.grid-2{display:grid;grid-template-columns:1fr;gap:var(--sp-4)}
.card{position:relative;display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-5);border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line);min-width:0}
.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.card-title{display:flex;align-items:center;gap:10px;font:650 var(--fs-l)/1.2 var(--display);letter-spacing:-.015em}
.card-title .medal{display:none}
.card-sub{margin-top:4px;font-size:var(--fs-s);color:var(--ink-3);line-height:1.45}
.medal{display:none}
.mini-title{margin:var(--sp-3) 0 var(--sp-2);font:650 var(--fs-xs)/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.mini-title.against{color:var(--warn)}
.section-title{font:650 var(--fs-l)/1.2 var(--display)}
.serif{font-family:var(--display)}
.note{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);font-size:var(--fs-s);color:var(--ink-2)}
.note strong{display:block;color:var(--ink);font-weight:650;margin-bottom:2px}
.note-neutral{background:transparent;border-style:dashed}
.note-locked{background:var(--accent-soft);border-color:var(--accent-line)}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:var(--sp-10) var(--sp-5);border-radius:var(--r-l);border:1px dashed var(--line-2);color:var(--ink-2)}
.empty h3{font-size:var(--fs-l)}
.empty p{max-width:44ch;font-size:var(--fs-s)}
.empty .actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.empty .medal,.empty-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--surface-2);color:var(--accent-tx)}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:var(--sp-2)}
.tile{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);min-width:0}
.tile strong{font:700 var(--fs-xl)/1.1 var(--display);letter-spacing:-.02em}
.tile span{font-size:var(--fs-xs);color:var(--ink-2);line-height:1.3}
.tile small{font-size:11px;color:var(--ink-3)}
.tile.lead{border-color:var(--accent-line);background:linear-gradient(180deg,var(--accent-soft),transparent)}
.tile.gauge{position:relative}.tile.gauge strong{padding-right:30px}
.tile.gauge::after{content:"";position:absolute;top:14px;right:12px;width:22px;height:22px;border-radius:50%;background:conic-gradient(var(--gc,var(--ink-2)) calc(var(--g) * 1%),var(--surface-3) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px))}
.tile.gauge.lead{--gc:var(--accent)}
.split{display:grid;grid-template-columns:1fr;gap:8px}
.mini{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.mini:last-child{border-bottom:0}
.mini span{color:var(--ink-2)}.mini strong{font-weight:650}
.table-wrap{overflow-x:auto;border-radius:var(--r-m);border:1px solid var(--line)}
table.table{width:100%;border-collapse:collapse;font-size:var(--fs-s)}
.table th{text-align:left;font:650 var(--fs-xs)/1.2 var(--font);color:var(--ink-3);padding:11px 12px;border-bottom:1px solid var(--line);white-space:nowrap;letter-spacing:.04em;text-transform:uppercase}
.table td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle}
.table tr:last-child td{border-bottom:0}
.table td small{display:block;color:var(--ink-3);font-size:var(--fs-xs)}
.table .you td{background:var(--accent-soft)}
.table .r{text-align:right}
.insights{display:flex;flex-direction:column}
.insight{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s);line-height:1.5;color:var(--ink-2)}
.insight:last-child{border-bottom:0}
.insight b{color:var(--ink);font-weight:650}
.read-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:var(--fs-s);color:var(--ink-2)}
.bands{display:flex;flex-direction:column;gap:10px}
.band{display:grid;grid-template-columns:92px 1fr 54px;gap:12px;align-items:center;font-size:var(--fs-s);color:var(--ink-2)}
.band .bar{height:8px;border-radius:5px;background:var(--surface-3);overflow:hidden}
.band .bar i{display:block;height:100%;border-radius:inherit;background:var(--ink-3);transform-origin:left;animation:barIn var(--t-slow) var(--ease-out) both}
.band.lead{color:var(--ink)}.band.lead .bar i{background:linear-gradient(90deg,var(--mint),var(--accent))}
.band b{text-align:right;font-weight:650}
.ladder{display:flex;flex-direction:column}
.ladder-head,.ladder-row{display:grid;grid-template-columns:52px 1fr 60px 1fr 52px;gap:8px;align-items:center}
.ladder-head{font-size:var(--fs-xs);color:var(--ink-3);font-weight:650;padding-bottom:8px}
.ladder-head span:nth-child(5){text-align:right}
.ladder-row{padding:9px 0;border-top:1px solid var(--line);font-size:var(--fs-s)}
.ladder-row .u,.ladder-row .o{font-weight:650}.ladder-row .o{text-align:right}
.ladder-row .line{text-align:center;font-weight:650;font-size:var(--fs-xs);background:var(--surface-2);border-radius:8px;padding:5px 0}
.ladder-row .bar{height:8px;border-radius:5px;background:var(--surface-2);overflow:hidden;display:flex}
.ladder-row .bar.left{justify-content:flex-end}
.ladder-row .bar i{display:block;height:100%;border-radius:inherit;background:var(--ink-3);opacity:.6}
.ladder-row.strong .o,.ladder-row.weak .u{color:var(--accent-tx)}
.ladder-row.strong .bar.right i,.ladder-row.weak .bar.left i{background:linear-gradient(90deg,var(--mint),var(--accent));opacity:1}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2)}
.duo .tile strong{font-size:var(--fs-num)}
.duo .tile.lead strong{color:var(--accent-tx)}
.dist{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;align-items:end;height:140px;margin-top:8px}
.dist div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;height:100%}
.dist i{display:block;width:100%;max-width:38px;border-radius:8px 8px 3px 3px;min-height:3px;background:linear-gradient(180deg,color-mix(in srgb,var(--home) 60%,#fff),var(--home));transform-origin:bottom;animation:growUp var(--t-slow) var(--ease-out) both}
.dist.away i{background:linear-gradient(180deg,color-mix(in srgb,var(--away) 60%,#fff),var(--away))}
.dist b{font-size:11px;font-weight:650}
.dist span{font-size:11px;color:var(--ink-3);font-weight:650}
.scoregrid{display:grid;gap:4px;font-size:var(--fs-xs)}
.scoregrid .h{display:grid;place-items:center;color:var(--ink-3);font-weight:650;min-height:28px}
.scoregrid button{min-height:42px;border-radius:9px;background:color-mix(in srgb,var(--accent) var(--a),var(--surface));color:var(--ink);font-weight:650;font-size:11px;line-height:1.1;padding:2px}
.scoregrid button.best{box-shadow:inset 0 0 0 2px var(--accent),0 0 18px -6px var(--accent)}
.scoregrid button small{display:block;font-size:10px;color:var(--ink-2);font-weight:550}
.dossier{display:flex;flex-direction:column;gap:var(--sp-4)}
.dossier-head{display:flex;align-items:center;gap:12px}
.dossier-head h3{font:650 var(--fs-l)/1.2 var(--display)}
.dossier-head p{font-size:var(--fs-xs);color:var(--ink-3)}
.dossier .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
.formline{display:flex;gap:4px;flex-wrap:wrap}
.res{min-width:40px;padding:6px 4px 5px;border-radius:9px;text-align:center;font:700 var(--fs-xs)/1.15 var(--font)}
.res small{display:block;font-size:10px;font-weight:600;opacity:.8}
.res.w{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
.res.l{background:color-mix(in srgb,var(--bad) 13%,transparent);color:var(--bad)}
.res.d{background:var(--surface-2);color:var(--ink-2)}
.vs-head{display:grid;grid-template-columns:1fr 1fr;font-weight:650;font-size:var(--fs-s);margin-bottom:6px}
.vs-head span:last-child{text-align:right}
.vs-row{display:grid;grid-template-columns:56px 1fr 56px;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.vs-row:first-child{border-top:0}
.vs-row .l{font-weight:650}.vs-row .r{font-weight:650;text-align:right}
.vs-row .mid{text-align:center}
.vs-row .mid span{display:block;font-size:var(--fs-xs);color:var(--ink-2);font-weight:600;margin-bottom:6px}
.vs-row .mid small{display:block;font-size:11px;color:var(--ink-3);margin-top:4px}
.vs-bar{display:flex;height:6px;gap:3px}
.vs-bar i{display:block;height:100%;border-radius:4px}
.vs-bar i:first-child{background:var(--home)}.vs-bar i:last-child{background:var(--away)}
.meetings{display:flex;flex-direction:column}
.meeting{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.meeting .score{font:700 var(--fs-l)/1 var(--display);padding:0 6px}
.reasons{display:flex;flex-direction:column;gap:2px}
.reason{display:grid;grid-template-columns:28px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);position:relative}
.reason:last-child{border-bottom:0}
.reason::before{content:"";position:absolute;left:-12px;top:14px;bottom:14px;width:2px;border-radius:2px;background:var(--ok)}
.reasons.against .reason::before{background:var(--warn)}
.reason p{font-size:var(--fs-s);line-height:1.5;color:var(--ink-2)}
.reason b{color:var(--ink);font-weight:650}
.reason-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:6px;font-size:11px;color:var(--ink-3);font-weight:600}
.reason-meta .who{display:inline-flex;align-items:center;gap:6px}
.reason-meta .who .crest{width:18px;height:18px;font-size:7px}
.reason-meta .kind{padding:2px 8px;border-radius:var(--r-full);background:var(--surface-2)}
.reason.fact .reason-meta .kind{background:var(--mint-soft);color:var(--mint)}
.weight{display:inline-flex;gap:2px}
.why-hero{gap:var(--sp-3)}
.why-headline{font:650 clamp(1.2rem,1rem + 1vw,1.6rem)/1.25 var(--display);letter-spacing:-.02em}
.why-split{align-items:start}
.checks{display:flex;flex-direction:column}
.checks li{display:flex;gap:10px;align-items:center;font-size:var(--fs-s);padding:9px 0;border-bottom:1px solid var(--line)}
.checks li:last-child{border-bottom:0}
.checks li>span{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;flex:none}
.checks .ok>span{background:color-mix(in srgb,var(--ok) 15%,transparent);color:var(--ok)}
.checks .wait{color:var(--ink-3)}.checks .wait>span{background:var(--surface-2)}
.signal-guide{display:flex;flex-direction:column;gap:6px}
.signal-guide>div{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center;padding:9px 10px;border-radius:var(--r-s);opacity:.6}
.signal-guide>div.on{opacity:1;background:var(--surface-2)}
.signal-guide p{font-size:var(--fs-xs);color:var(--ink-2)}
.market-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-3)}
.market-why{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line)}
.market-why h4{display:flex;gap:10px;align-items:center;font:650 var(--fs-s)/1.3 var(--font)}
.market-why ul{padding-left:18px;list-style:disc;display:flex;flex-direction:column;gap:5px;font-size:var(--fs-s);color:var(--ink-2)}
.market-why b{color:var(--ink)}
.mbar{height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.mbar i{display:block;height:100%;background:linear-gradient(90deg,var(--mint),var(--accent));border-radius:inherit;transform-origin:left;animation:barIn var(--t-slow) var(--ease-out) both}
.timeline{margin:0;padding:0 0 0 16px;border-left:2px solid var(--line-2);display:flex;flex-direction:column;gap:12px}
.timeline li{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:var(--fs-s)}
.timeline li::before{content:"";position:absolute;left:-22px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--surface-3);border:2px solid var(--bg)}
.timeline li:first-child::before{background:var(--accent)}
.timeline time{color:var(--ink-3);font-size:var(--fs-xs);min-width:104px}
.timeline .up{color:var(--ok);font-weight:650}.timeline .down{color:var(--bad);font-weight:650}
.timeline .why-block{flex-basis:100%;display:flex;flex-direction:column;gap:2px;font-size:var(--fs-xs);color:var(--ink-2)}
.proj{display:flex;align-items:baseline;gap:12px}
.proj strong{font:700 var(--fs-num)/1 var(--display);color:var(--accent-tx);letter-spacing:-.04em}
.proj span{color:var(--ink-3);font-size:var(--fs-s)}
.row{display:flex;align-items:center;gap:8px;font-size:var(--fs-s);padding:6px 0}
.row .line-bar{flex:1;height:6px;margin:0 10px;border-radius:4px;background:var(--surface-3);overflow:hidden;min-width:40px}
.row .line-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--mint),var(--accent));border-radius:inherit}
.players{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.player{padding:12px 14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line)}
.player strong{display:block;font-weight:650}
.player span{font-size:var(--fs-xs);color:var(--ink-3)}
.player .stats{display:flex;gap:12px;margin-top:8px;font-size:var(--fs-xs);font-weight:650}
.player .rating{float:right;font:700 var(--fs-l)/1 var(--display);color:var(--accent-tx)}
.absence{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.lineup{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin-top:10px}
.lineup div{padding:8px 10px;border-radius:var(--r-s);background:var(--surface);font-size:var(--fs-s)}
.lineup b{color:var(--accent-tx);margin-right:8px}
.lineup small{display:block;color:var(--ink-3);font-size:11px;margin-top:2px}
.lineup.expected b{color:var(--ink-3)}
.lineup-card .dossier-head{margin-bottom:6px}
.bench{display:flex;flex-wrap:wrap;gap:6px}
.bench span{padding:4px 9px;border-radius:8px;background:var(--surface-2);font-size:var(--fs-xs);color:var(--ink-2)}
.pitch{position:relative;display:flex;flex-direction:column;gap:14px;padding:18px 8px;border-radius:var(--r-l);background:repeating-linear-gradient(180deg,color-mix(in srgb,var(--mint) 7%,transparent) 0 36px,color-mix(in srgb,var(--mint) 3%,transparent) 36px 72px);border:1px solid color-mix(in srgb,var(--mint) 18%,transparent);overflow:hidden}
.pitch::before{content:"";position:absolute;left:50%;top:50%;width:80px;height:80px;margin:-40px;border-radius:50%;border:1px solid color-mix(in srgb,var(--mint) 18%,transparent)}
.pitch-row{position:relative;display:flex;justify-content:space-around;gap:4px}
.pitch-player{display:flex;flex-direction:column;align-items:center;min-width:0;max-width:72px}
.pitch-player b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--raised);border:2px solid var(--accent);font-size:11px;font-weight:700}
.pitch-player small{font-size:10px;font-weight:600;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:72px;color:var(--ink-2)}
.prob-history{margin:4px 0 12px}
.prob-history svg{width:100%;height:auto;max-height:140px;overflow:visible}
.prob-history figcaption{font-size:var(--fs-xs);font-weight:650;color:var(--ink-3)}
.prob-history polyline{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round}
.prob-history circle{fill:var(--raised);stroke:var(--accent);stroke-width:2}
.prob-history text{font-size:10px;font-weight:700;fill:var(--ink)}
.evo svg{width:100%;height:auto;overflow:visible}
.evo svg rect.h{fill:var(--home)}.evo svg rect.d{fill:var(--draw)}.evo svg rect.a{fill:var(--away)}
.evo svg rect.pick{stroke:var(--accent);stroke-width:1.6}
.evo .evo-lineups{fill:var(--ink-2)}.evo .evo-axis{font-size:9px;fill:var(--ink-3)}
.evo figcaption b{color:var(--accent-tx)}
.evo-legend{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:6px;font-size:var(--fs-xs);color:var(--ink-3)}
.evo-legend .lg::before{content:"";display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:2px;vertical-align:-1px;background:var(--c)}
.evo-legend .h{--c:var(--home)}.evo-legend .d{--c:var(--draw)}.evo-legend .a{--c:var(--away)}.evo-legend .l::before{display:none}
.ctx-note p{margin:4px 0 0}
.ctx-list{margin:6px 0 12px;display:flex;flex-direction:column;gap:6px}
.ctx-row{display:flex;align-items:center;gap:10px;min-width:0}
.ctx-row .res{flex:none}
.ctx-match{display:flex;flex-direction:column;min-width:0}
.ctx-match b{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctx-match small{color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-xs)}
.ctx-match small.ctx-stat{white-space:normal;overflow:visible}
.ctx-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:4px 0 10px}
.ctx-facts .mini{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-s)}
.ctx-facts .mini span{font-size:var(--fs-xs);color:var(--ink-3);overflow-wrap:anywhere}
.ctx-players{margin:2px 0 8px;overflow-wrap:anywhere}
.ctx-section{margin:var(--sp-5) 0 var(--sp-2)}
.ctx-section h2{font-size:var(--fs-l)}
.ctx-flag{display:inline-block;font-size:10px;font-weight:700;padding:1px 6px;border-radius:var(--r-full);background:var(--surface-2);color:var(--ink-3);vertical-align:1px}
.ctx-sample{flex:none;font-size:11px}
.ctx-stand{margin:4px 0 0;display:flex;flex-direction:column;gap:8px}
.ctx-stand li{position:relative;padding-left:16px;overflow-wrap:anywhere;font-size:var(--fs-s)}
.ctx-stand li::before{content:"";position:absolute;left:2px;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--ink-3)}
.ctx-euro{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line-2)}
.ctx-sample-line{margin:6px 0 0}
.kn-summary{margin:0 0 10px}
.kn-table,.kn-table thead,.kn-table tbody{display:block;width:100%}
.kn-table tr{display:grid;grid-template-columns:1fr 1fr;column-gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.kn-table thead th:first-child{display:none}
.kn-table th[scope=row]{grid-column:1/-1;min-width:0;padding:0 0 4px;border:0;font-weight:650;text-align:left}
.kn-table th[scope=row] .kn-why,.kn-table td small{display:block;font-weight:500;color:var(--ink-3);font-size:var(--fs-xs);margin-top:2px}
.kn-table td,.kn-table thead th{padding:0;border:0;white-space:normal}
.kn-table td.ahead b{color:var(--accent-tx)}
.kn-ahead{font-size:var(--fs-xs);font-weight:700;color:var(--accent-tx)}
.kn-none{color:var(--ink-3)}
.warn-text{color:var(--warn)}
.chip-loss{color:var(--bad);background:color-mix(in srgb,var(--bad) 12%,transparent);border-color:color-mix(in srgb,var(--bad) 30%,transparent)}
.keys{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px}
.key{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-radius:var(--r-s);background:var(--surface);border:1px solid var(--line)}
.key em{font-style:normal}.key strong{font:700 var(--fs-l)/1 var(--display)}.key span{font-size:var(--fs-xs);color:var(--ink-3)}
.chart-detail{font-size:var(--fs-xs);color:var(--ink-3);margin-top:6px}
.skeleton{gap:12px}
.sk-title,.sk-line{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,var(--surface-2),var(--surface-3),var(--surface-2));background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.sk-title{height:18px;width:45%}

/* 14 ─ Saved / Recent / My Teams */
.tabs-bar{display:flex;gap:6px}
.wl-sections{display:flex;flex-direction:column;gap:var(--sp-6)}
.wl-group{display:flex;flex-direction:column;gap:var(--sp-2)}
.wl-group>h2,.wl-group>.sec-head h2{display:flex;align-items:center;gap:10px;font-size:var(--fs-m)}
.wl-group .count{font:650 var(--fs-xs)/1 var(--font);color:var(--ink-3);padding:4px 8px;border-radius:var(--r-full);background:var(--surface-2)}
.wl-row,.saved-row{position:relative}
.history{display:flex;flex-direction:column}
.history a{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--line)}
.history a:last-child{border-bottom:0}
.history .h-t{display:flex;flex-direction:column;min-width:0;flex:1}
.history .h-t b{font-size:var(--fs-s);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.history .h-t small{font-size:var(--fs-xs);color:var(--ink-3)}
.team-hub{position:relative;display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-5);border-radius:var(--r-xl);overflow:hidden;isolation:isolate;background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--line)}
.team-hub::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 80% at 100% 0%,var(--accent-soft),transparent 60%)}
.th-head{display:flex;align-items:center;gap:14px}
.th-id{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.th-id h2{font:700 var(--fs-xl)/1.15 var(--display);letter-spacing:-.02em;overflow-wrap:anywhere}
.th-id small{font-size:var(--fs-xs);color:var(--ink-3)}
.th-form{display:flex;align-items:center;gap:6px}
.th-form .res{min-width:26px;padding:4px 0;font-size:11px}
.th-next{display:flex;flex-direction:column;gap:10px;padding:var(--sp-4);border-radius:var(--r-l);background:var(--glass);border:1px solid var(--glass-line)}
.th-next .k{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:var(--fs-xs);color:var(--ink-3);font-weight:600}
.th-vs{font:650 var(--fs-l)/1.2 var(--display);letter-spacing:-.01em}
.th-actions{display:flex;gap:8px;align-items:center}
.th-actions .btn-gold{flex:1}
.th-more{display:flex;flex-direction:column}
.th-more a{display:flex;align-items:center;gap:10px;padding:11px 2px;border-top:1px solid var(--line);font-size:var(--fs-s)}
.th-more small{color:var(--ink-3);font-size:var(--fs-xs);min-width:84px}
.th-more b{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.th-last{display:flex;align-items:center;gap:10px;font-size:var(--fs-s);color:var(--ink-2)}
.th-last .res{min-width:30px}
.team-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.team-pick button,.team-row{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 10px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);text-align:left;font-size:var(--fs-s);font-weight:600;min-width:0}
.team-pick button span,.team-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.team-pick button[aria-pressed=true]{border-color:var(--accent-line);background:var(--accent-soft)}

/* 15 ─ other pages */
.comp-grid{display:grid;grid-template-columns:1fr;gap:6px}
.comp-row{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 12px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);transition:border-color var(--t-fast),background var(--t-fast)}
.comp-row:hover{background:var(--surface-2)}
.comp-row .c-t{display:flex;flex-direction:column;min-width:0;flex:1}
.comp-row .c-t b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.comp-row .c-t small{font-size:var(--fs-xs);color:var(--ink-3)}
.comp-row .c-go{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border-radius:var(--r-full);font:600 var(--fs-s)/1 var(--font);color:var(--ink);background:var(--surface-2);border:1px solid var(--line)}
.comp-row .follow{width:36px;height:36px}
.country-pick{display:flex;gap:8px;align-items:center}
.stat-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.stat{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line)}
.stat strong{font:700 var(--fs-xl)/1.1 var(--display);letter-spacing:-.02em}
.stat span{font-size:var(--fs-xs);color:var(--ink-3)}
.rank-hero{position:relative;display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-5);border-radius:var(--r-xl);overflow:hidden;isolation:isolate;background:radial-gradient(120% 100% at 0% 0%,var(--raised-2),var(--raised));border:1px solid var(--line-2)}
.rank-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 70% at 100% 0%,var(--accent-soft),transparent 70%)}
.rank-hero .rank-lg,.rank-hero .rank-icon{width:56px;height:74px;flex:none}
.rank-hero h2{font:700 var(--fs-xl)/1.15 var(--display)}
.rank-hero .rh-t{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.progress{height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--mint),var(--accent))}
.rewards-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-3)}
.reward{display:flex;flex-direction:column;gap:10px;padding:var(--sp-4);border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line)}
.reward .rw-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.reward strong{font:700 var(--fs-xl)/1 var(--display)}
.reward.owned{border-color:var(--accent-line)}
.kv{display:flex;flex-direction:column}
.kv>div{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.kv>div:last-child{border-bottom:0}
.kv dt,.kv>div>span:first-child{color:var(--ink-2)}
.kv dd{margin:0;font-weight:600;text-align:right;overflow-wrap:anywhere}
.settings-group{display:flex;flex-direction:column;gap:var(--sp-3)}
.set-row{display:flex;align-items:center;gap:var(--sp-3);min-height:56px;padding:8px 0;border-bottom:1px solid var(--line)}
.set-row:last-child{border-bottom:0}
.set-row .st{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.set-row .st b{font-weight:600;font-size:var(--fs-m)}
.set-row .st small{font-size:var(--fs-xs);color:var(--ink-3)}
.set-row select{width:auto;min-width:150px;max-width:55%}
.guide{display:flex;flex-direction:column;gap:var(--sp-4)}
.guide-step{display:grid;grid-template-columns:36px 1fr;gap:14px;padding:var(--sp-4) 0;border-bottom:1px solid var(--line)}
.guide-step .n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:700 var(--fs-s)/1 var(--display);color:var(--accent-ink);background:var(--accent)}
.guide-step h3{font-size:var(--fs-l);margin-bottom:4px}
.guide-step p{font-size:var(--fs-s);color:var(--ink-2)}
.prose{display:flex;flex-direction:column;gap:var(--sp-3);max-width:68ch;color:var(--ink-2);font-size:var(--fs-m)}
.prose h2{font-size:var(--fs-h3);color:var(--ink);margin-top:var(--sp-4)}
.prose strong,.prose b{color:var(--ink)}
.lb-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px 4px;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.lb-row.you{background:var(--accent-soft);border-radius:var(--r-s)}
/* public / login */
.public{min-height:100dvh;display:flex;flex-direction:column}
.public-top{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(12px + var(--safe-t)) var(--gutter) 12px;background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
.public-top>div{display:flex;align-items:center;gap:8px}
.auth{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:var(--sp-6) var(--gutter) var(--sp-12);display:grid;grid-template-columns:1fr;gap:var(--sp-8);align-items:center}
.auth-story{position:relative;display:flex;flex-direction:column;gap:var(--sp-5)}
.auth-story h1{font:700 var(--fs-hero)/1.04 var(--display);letter-spacing:-.04em}
.auth-story>p{color:var(--ink-2);font-size:var(--fs-l);max-width:44ch}
.auth-demo{position:relative;overflow:hidden;isolation:isolate;padding:var(--sp-5);border-radius:var(--r-xl);border:1px solid var(--line-2);background:radial-gradient(120% 100% at 50% -20%,var(--raised-2),var(--raised))}
.auth-points{display:flex;flex-direction:column;gap:var(--sp-3)}
.auth-points li{display:flex;gap:12px;align-items:flex-start;font-size:var(--fs-s);color:var(--ink-2)}
.auth-points li .i{color:var(--accent-tx);margin-top:1px}
.auth-points b{display:block;color:var(--ink);font-size:var(--fs-m);font-weight:600}
.auth-card{display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-6);border-radius:var(--r-xl);background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line);box-shadow:var(--shadow-2)}
.auth-card h2{font-size:var(--fs-h2)}
.auth-card .btn-gold{width:100%}
.form-error{padding:12px 14px;border-radius:var(--r-m);color:var(--bad);background:color-mix(in srgb,var(--bad) 10%,transparent);border:1px solid color-mix(in srgb,var(--bad) 30%,transparent);font-size:var(--fs-s)}

/* 16 ─ sheets, popovers, toast */
.sheet{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-end;justify-content:center;background:rgba(2,6,5,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn var(--t-mid) var(--ease)}
html[data-theme=light] .sheet{background:rgba(20,30,26,.28)}
.sheet-panel{position:relative;width:100%;max-width:640px;max-height:min(88dvh,820px);display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-3) var(--gutter) calc(var(--sp-4) + var(--safe-b));border-radius:28px 28px 0 0;background:var(--raised);border:1px solid var(--line-2);border-bottom:0;box-shadow:0 -30px 60px -30px rgba(0,0,0,.7);animation:sheetUp var(--t-slow) var(--ease-out)}
html[data-theme=light] .sheet-panel{background:#FBFCFA}
.sheet-panel::before{content:"";align-self:center;width:40px;height:5px;border-radius:3px;background:var(--line-3);flex:none}
.sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.sheet-head h2{font-size:var(--fs-h3)}
.sheet-count{font-size:var(--fs-s);color:var(--ink-3);margin-top:4px}
.sheet-tools{display:flex;gap:8px;flex-wrap:wrap}
.sheet-list{display:flex;flex-direction:column;overflow-y:auto;min-height:0;flex:1;overscroll-behavior:contain;margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter)}
.league-row{display:flex;align-items:center;gap:12px;min-height:56px;padding:6px 2px;border-bottom:1px solid var(--line);text-align:left}
.lr-box{width:22px;height:22px;flex:none;border-radius:7px;border:1.5px solid var(--line-3);display:grid;place-items:center;transition:all var(--t-fast)}
.league-row[aria-checked=true] .lr-box{background:var(--accent);border-color:transparent}
.league-row[aria-checked=true] .lr-box::after{content:"";width:10px;height:6px;border:2px solid var(--accent-ink);border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
.lr-name{display:flex;flex-direction:column;min-width:0;font-weight:600;font-size:var(--fs-s)}
.lr-name small{font-size:var(--fs-xs);color:var(--ink-3);font-weight:500}
.sheet-foot{display:flex;gap:8px;padding-top:var(--sp-2)}
.sheet-foot .btn-gold,.sheet-apply{flex:1}
.profile-pop{position:fixed;z-index:95;right:var(--gutter);top:calc(var(--top-h) + var(--safe-t) + 6px);width:min(340px,calc(100vw - 2 * var(--gutter)));display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-5);border-radius:var(--r-xl);background:var(--raised);border:1px solid var(--line-2);box-shadow:var(--shadow-2);animation:popIn var(--t-mid) var(--ease-out)}
.pp-head{display:flex;gap:14px;align-items:flex-start}
.pp-head>div{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.pp-head strong{font:700 var(--fs-l)/1.2 var(--display)}
.pp-head small{font-size:var(--fs-xs);color:var(--ink-3)}
.pp-tier{font:650 11px/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-tx)}
.pp-close{width:36px;height:36px}
.pp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pp-stats div{display:flex;flex-direction:column;gap:4px;padding:10px;border-radius:var(--r-s);background:var(--surface)}
.pp-stats b{font:700 var(--fs-m)/1 var(--display)}
.pp-stats span{font-size:11px;color:var(--ink-3)}
.pp-next{display:flex;flex-direction:column;gap:8px;font-size:var(--fs-xs);color:var(--ink-2)}
.pp-next-row{display:flex;justify-content:space-between;gap:8px}
.pp-bar{height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.pp-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--mint),var(--accent))}
.pp-links{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pp-links a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border-radius:var(--r-s);background:var(--surface);font-size:var(--fs-xs);font-weight:600;text-align:center}
.pp-cosmetics{display:flex;gap:6px;flex-wrap:wrap;font-size:11px}
.cos-title,.cos-badge{padding:2px 8px;border-radius:var(--r-full);background:var(--accent-soft);color:var(--accent-tx)}
.pp-max{font-size:var(--fs-s)}
#toast{position:fixed;z-index:130;left:50%;bottom:calc(var(--nav-h) + var(--safe-b) + 24px);transform:translate(-50%,20px);max-width:min(92vw,440px);padding:12px 18px;border-radius:var(--r-full);font:600 var(--fs-s)/1.3 var(--font);color:var(--ink);background:var(--raised-2);border:1px solid var(--line-2);box-shadow:var(--shadow-2);opacity:0;pointer-events:none;transition:opacity var(--t-mid),transform var(--t-mid) var(--ease-out)}
#toast.show{opacity:1;transform:translate(-50%,0)}
.reward-pop{position:fixed;z-index:131;left:50%;top:calc(var(--top-h) + var(--safe-t) + 12px);transform:translateX(-50%);padding:14px 18px;border-radius:var(--r-l);background:var(--raised-2);border:1px solid var(--accent-line);box-shadow:var(--shadow-2);animation:popIn var(--t-slow) var(--spring)}
.update-strip{position:fixed;z-index:110;left:50%;transform:translateX(-50%);top:calc(var(--top-h) + var(--safe-t) + 8px);width:min(calc(100% - 24px),520px);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 16px;border-radius:var(--r-l);background:var(--raised-2);border:1px solid var(--accent-line);box-shadow:var(--shadow-2);font-size:var(--fs-s)}
.ptr{position:fixed;z-index:65;left:50%;top:calc(var(--top-h) + var(--safe-t));transform:translate(-50%,-60px);display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--r-full);background:var(--raised-2);border:1px solid var(--line);font-size:var(--fs-xs);opacity:0;transition:transform var(--t-mid),opacity var(--t-mid)}
.ptr.pull,.ptr.on{opacity:1}
.ptr-spin{width:14px;height:14px;border-radius:50%;border:2px solid var(--line-2);border-top-color:var(--accent)}
.ptr.on .ptr-spin{animation:spin .8s linear infinite}
.busy-label,[aria-busy=true]>.busy-label{opacity:.7}

/* 17 ─ states */
.state-box{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r-m);font-size:var(--fs-s);background:var(--surface);border:1px solid var(--line)}
.state-ok{color:var(--ok)}.state-warn{color:var(--warn)}.state-bad{color:var(--bad)}
.notify-devices{display:flex;flex-direction:column;gap:8px}

/* 18 ─ motion */
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes rise{from{transform:translateY(8px)}to{transform:none}}
@keyframes riseFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes sheetUp{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes popIn{from{opacity:0;transform:translateY(-6px) scale(.97)}to{opacity:1;transform:none}}
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.28)}100%{transform:scale(1)}}
@keyframes segIn{from{transform:scaleX(0);opacity:0}}
@keyframes barIn{from{transform:scaleX(0)}}
@keyframes growUp{from{transform:scaleY(0)}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.8)}}
@keyframes flash{0%{background:var(--accent-soft)}100%{background:transparent}}
@keyframes shimmer{to{background-position:-200% 0}}
.page>*{animation:rise var(--t-slow) var(--ease-out) both}
.page>*:nth-child(2){animation-delay:40ms}.page>*:nth-child(3){animation-delay:80ms}.page>*:nth-child(4){animation-delay:120ms}.page>*:nth-child(n+5){animation-delay:150ms}
.chapter-body>*{animation:riseFade var(--t-mid) var(--ease-out) both}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}
  .live-dot::before,.live-pulse i{animation:none}
}

/* 19 ─ responsive */
@media (max-width:359px){
  :root{--gutter:12px}
  .nb-item{font-size:9.5px}
  .mrow{grid-template-columns:44px minmax(0,1fr) auto;column-gap:10px;padding-left:6px}
  .mrow::after{left:60px}
  .hero{padding:var(--sp-4)}
  .triad>*,.tri-col{padding:10px 8px}
  .more-grid{grid-template-columns:repeat(2,1fr)}
  .ladder-head,.ladder-row{grid-template-columns:44px 1fr 52px 1fr 44px;gap:5px}
}
@media (min-width:600px){
  :root{--gutter:24px}
  .me-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .km{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ws-grid{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:repeat(2,1fr)}
  .market-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .comp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rewards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat-row{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dossier .tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
  .mrow{grid-template-columns:64px minmax(0,1fr) minmax(200px,38%) auto;grid-template-areas:"when teams read act";align-items:center;padding:14px 14px 14px 12px}
  .mrow::after{left:88px}
  .mr-read{padding-left:12px;border-left:1px solid var(--line)}
  .sheet{align-items:center;padding:24px}
  .sheet-panel{border-radius:var(--r-xl);border-bottom:1px solid var(--line-2);padding-bottom:var(--sp-5)}
  .sheet-panel::before{display:none}
  .intel{flex-basis:280px}
}
@media (min-width:1024px){
  :root{--top-h:64px}
  .app{display:grid;grid-template-columns:var(--rail) minmax(0,1fr)}
  .rail{display:flex;flex-direction:column;position:sticky;top:0;height:100dvh;padding:20px 14px;border-right:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--bg-2) 70%,transparent),transparent)}
  .nav-bottom{display:none}
  .app-main{padding-bottom:var(--sp-12)}
  .topbar{padding:0 32px;background:linear-gradient(180deg,var(--bg) 40%,color-mix(in srgb,var(--bg) 0%,transparent));-webkit-backdrop-filter:none;backdrop-filter:none}
  .topbar.scrolled{background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
  .tb-brand .mark{display:none}
  .page{padding:var(--sp-4) 32px 0}
  .foot{padding:var(--sp-6) 32px;margin-top:var(--sp-12)}
  #toast{bottom:32px}
  .day{margin:var(--sp-4) 0 0;padding:10px 4px;top:var(--top-h)}
  .story-nav{margin:0;padding:8px 0;top:var(--top-h)}
  /* home: hero + context column */
  .home-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);gap:var(--sp-6);align-items:start}
  .home-side{display:flex;flex-direction:column;gap:var(--sp-6);position:sticky;top:calc(var(--top-h) + 12px)}
  .hero{padding:var(--sp-8)}
  .hero-match{margin:var(--sp-8) 0 var(--sp-6)}
  .me-grid{grid-template-columns:1fr}
  .scroller{margin:0;padding:2px 0 6px}
  /* analysis: story + sticky read column */
  .match-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--sp-6);align-items:start}
  .match-side{position:sticky;top:calc(var(--top-h) + 12px);display:flex;flex-direction:column;gap:var(--sp-4)}
  .stage{padding:var(--sp-8)}
  .km{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* matches: list + context */
  .mx-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--sp-6);align-items:start}
  .mx-side{position:sticky;top:calc(var(--top-h) + 12px);display:flex;flex-direction:column;gap:var(--sp-4)}
  .leagues{display:flex;flex-direction:column;gap:2px;max-height:calc(100dvh - 220px);overflow-y:auto;padding:6px;border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line);scrollbar-width:thin}
  .league{display:flex;align-items:center;gap:10px;min-height:40px;padding:4px 10px;border-radius:10px;text-align:left;font-size:var(--fs-s);font-weight:550;color:var(--ink-2)}
  .league:hover{background:var(--surface-2);color:var(--ink)}
  .league[aria-pressed=true]{background:var(--accent-soft);color:var(--ink)}
  .league .lg-check{display:none}.league .all{width:22px;text-align:center}
  .league span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .league-bar .comp-pick{display:none}
  .auth{grid-template-columns:1.1fr .9fr;padding-top:var(--sp-12)}
  .rewards-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .comp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .team-hubs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4)}
}
@media (min-width:1440px){
  :root{--content:1240px;--rail:272px}
  .match-grid{grid-template-columns:minmax(0,1fr) 320px}
}
@media (hover:none){.mrow:hover{background:transparent;border-color:transparent}.mrow:hover::after{opacity:1}}

/* 20 ─ print */
@media print{.rail,.nav-bottom,.topbar,.foot,.story-nav{display:none!important}body::before{display:none}.page>*{animation:none}}
.hero-read .hh-bar{display:block;height:auto}
.ask-q .ask-go .i{color:var(--accent-ink)}
/* analysis: side column (desktop) + limited-data hero */
.match-side{display:none}
@media (min-width:1024px){.match-side{display:flex}}
.side-read{display:flex;flex-direction:column;gap:12px}
.sr-pick{font:650 var(--fs-l)/1.2 var(--display);letter-spacing:-.015em}
.sr-p{font:700 3.2rem/.9 var(--display);letter-spacing:-.05em;color:var(--accent-tx)}
.sr-p small{font-size:.4em;color:var(--ink-3);margin-left:2px}
.side-read .sig{align-self:flex-start}
.side-chapters{display:flex;flex-direction:column;padding:8px}
.side-chapters a{display:flex;align-items:center;min-height:38px;padding:0 10px;border-radius:10px;font-size:var(--fs-s);color:var(--ink-2);font-weight:550}
.side-chapters a:hover{background:var(--surface-2);color:var(--ink)}
.side-chapters a[aria-current=true],.side-chapters a.active{color:var(--accent-tx)}
.mi-hero{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-5);border-radius:var(--r-xl);background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--line-2)}
.mi-kicker{display:flex;align-items:center;gap:8px;font:650 var(--fs-xs)/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--mint)}
.mi-title{font:700 var(--fs-h2)/1.15 var(--display);letter-spacing:-.025em}
.mi-text,.mi-note{font-size:var(--fs-s);color:var(--ink-2)}
.mi-ready{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 14px;align-items:center;margin:4px 0;padding:14px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line)}
.mi-ready-title{grid-column:1/-1;font:650 var(--fs-xs)/1.2 var(--font);color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase}
.mi-ready dt{font-weight:600;font-size:var(--fs-s);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mi-ready dd{margin:0;display:flex;align-items:center;gap:10px;font-size:var(--fs-xs)}
.mi-pips{display:flex;gap:4px}.mi-pips i{width:18px;height:6px;border-radius:3px;background:var(--surface-3)}.mi-pips i.on{background:var(--mint)}
.qv-list{display:flex;flex-direction:column;gap:6px}
.qv-item{display:flex;align-items:center;gap:10px;font-size:var(--fs-s)}
.qv-item .qv-name{min-width:0;flex:1}
.qv-item b{font:700 var(--fs-m)/1 var(--display)}
.crit.noedge{background:var(--surface);border-color:var(--line)}
.mv-why{flex-basis:100%;font-size:var(--fs-xs);color:var(--ink-2)}
.movement .up{color:var(--ok)}.movement .down{color:var(--bad)}
.chapter-body .card{background:none;border:0;border-top:1px solid var(--line);border-radius:0;padding:var(--sp-5) 0 0}
.chapter-body .card.skeleton{border-top:0}
.chapter-body>.stack>.card:first-child,.chapter-body>.stack>.grid-2:first-child>.card{border-top:0;padding-top:var(--sp-2)}
.state-line .fx-updated{display:inline-flex;flex-wrap:wrap;gap:2px 6px}

.mx-step .seg{flex:1}

.qv-more{display:flex;flex-direction:column;gap:2px}
.qv-more b{color:var(--ink-2);font-weight:650}

/* busy states (ui-state.js busy()) */
.spin{display:inline-block;width:14px;height:14px;flex:none;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
.is-busy{cursor:progress}
.show-label{gap:8px}
.show-spinner{position:relative}
.show-spinner>*{opacity:.35}
.mr-link.show-label{display:flex;align-items:center;justify-content:center;gap:8px;z-index:3;background:color-mix(in srgb,var(--bg) 70%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font:600 var(--fs-s)/1 var(--font);color:var(--ink);border-radius:inherit}
.skeleton-list{display:flex;flex-direction:column;gap:8px}
.sk-row{height:96px;border-radius:var(--r-m);background:linear-gradient(90deg,var(--surface),var(--surface-2),var(--surface));background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.nav-pending{opacity:.7}

.mx-step>.kicker{width:52px;flex:none}
.mx-tools{flex:1;min-width:0;display:flex;gap:8px}
.mx-tools .league-bar{flex:1.25;min-width:0;display:flex}
.mx-tools .comp-pick{width:100%}
.mx-tools .search{flex:1;min-width:0}
.mx-tools .search input{min-height:44px;font-size:15px;padding-right:12px}
@media (max-width:599px){.mx-head p{display:none}}
@media (min-width:1024px){.mx-tools .league-bar{display:none}.mx-which>.kicker{display:none}}
/* behaviour hooks shared with tap.js / ui-state.js / app.js (ported… */
.tap{transform:scale(.97)}
.nb-item.tap,.rail-link.tap,.mrow .mr-link.tap{transform:scale(.95)}
.tap-queued{position:relative}
.tap-queued::after{content:"";position:absolute;left:18%;right:18%;bottom:3px;height:2px;border-radius:2px;background:var(--accent);animation:pulse 1s ease-in-out infinite}
.is-busy{pointer-events:none}
.show-spinner::after{content:"";position:absolute;inset:0;margin:auto;width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
body.is-refreshing .page{opacity:.7;transition:opacity var(--t-fast) var(--ease)}
body.is-refreshing .refresh-btn .i{animation:spin .8s linear infinite}
.busy-text{white-space:nowrap}
html.standalone .app-card .ah-browser{display:none}
.one-empty h3{font-size:var(--fs-l)}
.fresh-part{white-space:nowrap}
.fx-updated .fresh-part:not(:last-child)::after{content:"\00a0· ";color:var(--ink-3)}
.pc-fit,.pc-limited{margin:0;font-size:var(--fs-xs);color:var(--ink-3);font-weight:600}
.sel-leagues{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 0 12px;padding-bottom:2px}
.sel-leagues::-webkit-scrollbar{display:none}
.sel-leagues .chip{flex:none;cursor:pointer;min-height:36px}
.setting-label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs-s);font-weight:600;color:var(--ink-2)}
@media (prefers-reduced-motion:reduce){.tap,.nb-item.tap,.rail-link.tap,.mrow .mr-link.tap{transform:none}.tap-queued::after,.show-spinner::after,body.is-refreshing .refresh-btn .i{animation:none}}
/* Saved */
.page-saved .page-head{gap:4px}
.wl-search .search{max-width:520px}
.wl-saved{display:flex;flex-direction:column;gap:var(--sp-4)}
.wl-jump{max-width:520px}
.wl-jump .seg-btn.is-empty{opacity:.5}
.wl-review-hint{display:flex;align-items:center;gap:8px;font-size:var(--fs-s);color:var(--accent-tx)}
.wl-group{display:flex;flex-direction:column;gap:10px;scroll-margin-top:calc(var(--top-h) + var(--safe-t) + 16px)}
.wl-group-title h3{display:flex;align-items:center;gap:8px;font:650 var(--fs-m)/1.2 var(--display)}
.wl-group-title p{font-size:var(--fs-xs);color:var(--ink-3);margin-top:4px}
.count{font:650 var(--fs-xs)/1 var(--font);color:var(--ink-3);padding:4px 8px;border-radius:var(--r-full);background:var(--surface-2)}
.wl-remove{width:36px;height:36px}
.wl-verdict{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.wl-open{display:inline-flex;align-items:center;gap:2px;margin-left:auto;font:600 var(--fs-xs)/1 var(--font);color:var(--accent-tx)}
.wl-older summary,.hist-more summary{display:inline-flex;align-items:center;min-height:40px;font-size:var(--fs-s);font-weight:600;color:var(--ink-2)}
.wl-saved-foot{display:flex;justify-content:flex-end}
.wl-history{display:flex;flex-direction:column;gap:var(--sp-3);padding-top:var(--sp-4);border-top:1px solid var(--line)}
.wl-history-head h2{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-h3)}
.hist-list{display:flex;flex-direction:column}
.hist-row{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line)}
.hist-row:last-child{border-bottom:0}
.hist-main{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.hist-name{font-weight:600;font-size:var(--fs-s)}
.hist-meta{font-size:var(--fs-xs);color:var(--ink-3)}
.hist-actions{display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.hist-hide{width:36px;padding:0}
@media (max-width:599px){.hist-row{flex-wrap:wrap}.hist-actions{width:100%;justify-content:flex-start}}
/* My Teams hubs */
.team-board{display:flex;flex-direction:column;gap:var(--sp-4)}
.th-next{color:inherit}
.th-next .k{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.th-next .read{gap:8px}
.th-last{padding-top:var(--sp-3);border-top:1px solid var(--line)}
.th-last .tc-result-score{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.th-last b{font-weight:600;font-size:var(--fs-s)}
.th-last small{font-size:var(--fs-xs)}
.tc-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.th-more li a{display:flex;align-items:center;gap:10px;padding:11px 2px;border-top:1px solid var(--line);font-size:var(--fs-s)}
.th-more li a b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.th-more li a .caption{margin-left:auto;white-space:nowrap}
.team-choice{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 12px 8px 10px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);text-align:left;font-size:var(--fs-s);font-weight:600;min-width:0}
.team-choice span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.team-choice .tc-star{color:var(--ink-3)}
.team-choice[aria-pressed=true]{border-color:var(--accent-line);background:var(--accent-soft)}
.team-choice[aria-pressed=true] .tc-star{color:var(--accent-tx);fill:currentColor}
.add-teams .search{max-width:520px}
.page-head.keep-lede{gap:6px}
@media (max-width:599px){.mx-step>.kicker{display:none}}
.comp-tools{max-width:720px}.comp-tools select{max-width:46%}
.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:end}
.pod{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line);min-width:0}
.pod-1{background:linear-gradient(180deg,var(--accent-soft),var(--surface));border-color:var(--accent-line);padding-top:24px}
.pod.you{box-shadow:inset 0 0 0 1.5px var(--accent)}
.pod-n{font:700 var(--fs-xs)/1 var(--font);color:var(--accent-tx)}
.pod strong{font:700 var(--fs-xl)/1 var(--display)}
.pod-name{font-size:var(--fs-xs);color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pod small{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--ink-3)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:600}
.guide-step .n .i{color:var(--accent-ink)}
.kv .row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.kv .row:last-child{border-bottom:0}
.kv .row>span:first-child{color:var(--ink-2)}
.kv .row strong{font-weight:600;text-align:right;overflow-wrap:anywhere}
.scroll-box{max-height:360px;overflow:auto}
.card-title .i{color:var(--accent-tx)}
@media (min-width:600px){.acc-links{grid-template-columns:repeat(5,minmax(0,1fr))}}
/* Rewards */
.rank-hero .rh-icon{flex:none}
.rank-hero .rh-main{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.rh-kicker{font:650 var(--fs-xs)/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-tx)}
.rank-hero{flex-wrap:wrap}
.rh-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%}
.rh-stats div{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border-radius:var(--r-s);background:var(--glass);border:1px solid var(--glass-line)}
.rh-stats b{font:700 var(--fs-l)/1 var(--display)}
.rh-stats span{font-size:11px;color:var(--ink-3)}
.section-title h2{font-size:var(--fs-h3)}
.section-title p{font-size:var(--fs-s);color:var(--ink-3);margin-top:4px}
.reward-grid,.shop-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-3)}
.reward .price{font:700 2rem/1 var(--display);letter-spacing:-.03em}
.reward .price small{font-size:.4em;color:var(--ink-3);margin-left:6px;letter-spacing:0}
progress{width:100%;height:6px;appearance:none;-webkit-appearance:none;border:0;border-radius:4px;background:var(--surface-3);overflow:hidden}
progress::-webkit-progress-bar{background:var(--surface-3);border-radius:4px}
progress::-webkit-progress-value{background:linear-gradient(90deg,var(--mint),var(--accent));border-radius:4px}
progress::-moz-progress-bar{background:linear-gradient(90deg,var(--mint),var(--accent));border-radius:4px}
.shop-item{gap:10px}
.shop-preview{height:72px;border-radius:var(--r-m);display:flex;align-items:center;justify-content:center;gap:6px;background:var(--surface-2);font-weight:700}
.shop-preview i{width:22px;height:22px;border-radius:50%;background:var(--accent)}
.preview-emerald i:nth-child(1){background:#041912}.preview-emerald i:nth-child(2){background:#2FBF83}.preview-emerald i:nth-child(3){background:#E8C46A}
.preview-midnight i:nth-child(1){background:#070B16}.preview-midnight i:nth-child(2){background:#62A8FF}.preview-midnight i:nth-child(3){background:#E8C46A}
.shop-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.shop-head h3{font-size:var(--fs-m)}
.shop-state{font:650 11px/1 var(--font);color:var(--ink-3)}
.shop-state.state-equipped{color:var(--ok)}.shop-state.state-owned{color:var(--accent-tx)}
.shop-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}
.shop-foot b{font:700 var(--fs-l)/1 var(--display)}
.daily-state{margin-top:10px;font-size:var(--fs-s);color:var(--ink-2)}.daily-state.done{color:var(--ok)}
.ach-list{display:flex;flex-direction:column}
.ach{display:grid;grid-template-columns:24px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.ach:last-child{border-bottom:0}
.ach>span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-size:11px}
.ach.done>span{background:color-mix(in srgb,var(--ok) 15%,transparent);color:var(--ok)}
.ach b{display:block;font-weight:600;margin-bottom:6px}
.ladder-ranks{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.ladder-ranks .lr{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line);font-size:var(--fs-xs);opacity:.55;text-align:center}
.ladder-ranks .lr.reached{opacity:1}.ladder-ranks .lr.current{border-color:var(--accent-line);background:var(--accent-soft);opacity:1}
.ladder-ranks .lr small{color:var(--ink-3)}
@media (min-width:600px){.reward-grid,.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.shop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.reward-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Settings */
.field{font:600 var(--fs-s)/1.2 var(--font);color:var(--ink-2)}
.field select{margin-top:6px}
.notify-prefs{display:flex;flex-direction:column}
.switch-row{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer}
.switch-row:last-child{border-bottom:0}
.switch-row input.switch{appearance:none;-webkit-appearance:none;position:relative;width:46px;height:28px;flex:none;border-radius:14px;background:var(--surface-3);border:1px solid var(--line-2);transition:background var(--t-fast);cursor:pointer;margin:0}
.switch-row input.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);transition:transform var(--t-mid) var(--spring)}
.switch-row input.switch:checked{background:var(--accent);border-color:transparent}
.switch-row input.switch:checked::after{transform:translateX(18px)}
.switch-row input.switch:disabled{opacity:.45}
.switch-row span{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-s)}
.switch-row small{color:var(--ink-3);font-size:var(--fs-xs)}
.notify-actions{display:flex;gap:8px;flex-wrap:wrap}
.app-status{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:var(--r-m);background:var(--surface)}
.as-actions{display:flex;gap:6px}
.as-support{font-size:var(--fs-xs);color:var(--ink-3);text-decoration:underline;text-underline-offset:3px;align-self:flex-start}
.as-tech{font-size:var(--fs-xs);color:var(--ink-3)}
.as-tech dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px}
.ah-version{padding:12px;border-radius:var(--r-m);background:color-mix(in srgb,var(--warn) 10%,transparent);font-size:var(--fs-s)}
/* editorial pages (help, about, contact, model) */
.public-main{width:100%;max-width:var(--content);margin:0 auto;padding:var(--sp-6) var(--gutter) var(--sp-12);display:flex;flex-direction:column;gap:var(--sp-8)}
.editorial{display:grid;grid-template-columns:1fr;gap:var(--sp-6);align-items:center}
.editorial h1{font:700 var(--fs-hero)/1.05 var(--display);letter-spacing:-.04em}
.lede{font-size:var(--fs-l);color:var(--ink-2);margin-top:var(--sp-3);max-width:58ch}
.editorial .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:var(--sp-5)}
.specimen{position:relative;display:flex;flex-direction:column;gap:8px;padding:var(--sp-5);border-radius:var(--r-xl);background:radial-gradient(120% 100% at 50% -20%,var(--raised-2),var(--raised));border:1px solid var(--line-2);box-shadow:var(--shadow-2)}
.specimen-head,.ex-head{font:650 var(--fs-xl)/1.2 var(--display);letter-spacing:-.02em}
.specimen-tri{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.specimen-tri div{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:var(--r-m);border:1px solid var(--line);background:var(--surface)}
.specimen-tri .lead{border-color:color-mix(in srgb,var(--home) 55%,transparent);background:var(--home-soft)}
.specimen-tri b{font:700 var(--fs-xl)/1 var(--display)}
.specimen-tri span{font-size:var(--fs-xs);color:var(--ink-2)}
.specimen .row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:var(--fs-s)}
.specimen .row .i{color:var(--accent-tx)}
.steps{display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:36px 1fr;gap:14px;padding:var(--sp-5) 0;border-bottom:1px solid var(--line)}
.step-n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:700 var(--fs-s)/1 var(--display);color:var(--accent-ink);background:var(--accent)}
.step h3{font-size:var(--fs-l);margin-bottom:6px}
.step p{font-size:var(--fs-s);color:var(--ink-2)}
.shot{display:flex;align-items:center;gap:8px;margin-top:10px;padding:10px 12px;border-radius:var(--r-s);background:var(--surface);font-size:var(--fs-xs);color:var(--ink-2)}
.shot .i{color:var(--accent-tx)}
.glossary{display:grid;grid-template-columns:1fr;gap:var(--sp-2)}
.term{padding:var(--sp-4);border-radius:var(--r-m);background:var(--surface);border:1px solid var(--line)}
.term h4{font:650 var(--fs-m)/1.3 var(--display);margin-bottom:6px}
.term p{font-size:var(--fs-s);color:var(--ink-2)}
.faq{padding:var(--sp-4) 0;border-bottom:1px solid var(--line)}
.faq:last-child{border-bottom:0}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600}
.faq summary::after{content:"+";font:400 1.4rem/1 var(--font);color:var(--ink-3);transition:transform var(--t-mid)}
.faq[open] summary::after{transform:rotate(45deg)}
.faq p{margin-top:10px;font-size:var(--fs-s);color:var(--ink-2)}
.values{display:grid;grid-template-columns:1fr;gap:var(--sp-3)}
.value h3{font-size:var(--fs-l)}.value p{font-size:var(--fs-s);color:var(--ink-2)}
.contact-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-4);align-items:start}
.form{display:flex;flex-direction:column;gap:var(--sp-4)}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.mail{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-weight:600;font-size:var(--fs-s)}
.mail .i{color:var(--accent-tx)}
.mail div{display:flex;flex-direction:column;gap:2px}
.mail div span{font-weight:400;font-size:var(--fs-xs);color:var(--ink-3)}
#contact-status{font-size:var(--fs-s)}
.check{display:flex;align-items:center;gap:10px;font-size:var(--fs-s);color:var(--ink-2)}
.check input{width:20px;height:20px;accent-color:var(--accent)}
.demo{padding:12px 14px;border-radius:var(--r-m);border:1px dashed var(--line-2);font-size:var(--fs-s)}
.demo summary{font-weight:600;color:var(--ink-2)}
.demo code{display:block;margin:8px 0;font-size:var(--fs-xs);color:var(--ink-2)}
.login-replace-actions{display:flex;gap:8px;margin-top:10px}
.auth-demo{display:flex;flex-direction:column;gap:12px}
.auth-demo>*{position:relative}
.public-foot{border-top:0;padding-bottom:calc(var(--sp-6) + var(--safe-b))}
.error-page{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center}
.error-page h1{font-size:var(--fs-h1)}
.error-page p{color:var(--ink-2);max-width:44ch}
@media (min-width:900px){.editorial{grid-template-columns:1.2fr .8fr}.glossary{grid-template-columns:repeat(2,minmax(0,1fr))}.values{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-grid{grid-template-columns:1.2fr .8fr}}
.comp-row{min-width:0}.comp-row .c-go{padding:0 10px;font-size:var(--fs-xs);flex:none}.grid-2>*,.km>*,.me-grid>*{min-width:0}
.nb-item{isolation:isolate}.nb-item::before{z-index:-1}
/* ported state components (restyled) */
.reason .medal{display:block;line-height:0;padding-top:1px}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:var(--fs-xs);color:var(--ink-3);margin-top:10px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.timing{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;align-items:end;height:160px}
.timing .col{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:3px;height:100%}
.timing .bars{display:flex;gap:3px;align-items:flex-end;height:110px}
.timing .bars i{display:block;width:12px;border-radius:5px 5px 2px 2px;min-height:2px;transform-origin:bottom;animation:growUp var(--t-slow) var(--ease-out) both}
.timing .s{background:var(--ok)}.timing .c{background:var(--bad)}
.timing b{font-size:11px;font-weight:650}
.timing span{font-size:10px;color:var(--ink-3);font-weight:650}
.vs{display:flex;flex-direction:column;gap:2px}
.meeting .t2{text-align:right}
.reward-pop{position:fixed;z-index:160;right:16px;left:auto;top:calc(16px + var(--safe-t));transform:translateY(-10px) scale(.97);width:min(340px,calc(100vw - 24px));display:flex;gap:12px;padding:18px;border-radius:var(--r-l);background:var(--raised-2);border:1px solid var(--accent-line);box-shadow:var(--shadow-2);opacity:0;overflow:hidden;transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease);animation:none}
.reward-pop.show{opacity:1;transform:none}
.reward-pop .rp-glow{position:absolute;inset:-40% -20% auto auto;width:180px;height:180px;background:radial-gradient(circle,var(--accent-soft),transparent 70%);pointer-events:none}
.rp-body{flex:1;position:relative}
.rp-kicker{font:650 var(--fs-xs)/1 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-tx)}
.rp-total{display:block;font:700 2.2rem/1.1 var(--display);letter-spacing:-.03em;margin:4px 0}
.rp-plus{font-weight:600;color:var(--accent-tx);margin-right:3px;font-size:.8em}
.rp-total small{font:500 var(--fs-s)/1 var(--font);color:var(--ink-3)}
.rp-streak{font-weight:650}
.reward-pop ul{margin:10px 0 0;display:flex;flex-direction:column;gap:4px;font-size:var(--fs-s);color:var(--ink-2)}
.reward-pop li{display:flex;justify-content:space-between;gap:10px}
.reward-pop li b{color:var(--ok)}
.update-bar{position:fixed;left:50%;bottom:calc(var(--nav-h) + var(--safe-b) + 22px);transform:translateX(-50%);z-index:80;display:flex;flex-wrap:wrap;gap:12px;align-items:center;max-width:calc(100vw - 24px);padding:10px 12px 10px 16px;border-radius:18px;background:var(--raised-2);border:1px solid var(--accent-line);box-shadow:var(--shadow-2);font-size:var(--fs-s);animation:popIn var(--t-slow) var(--ease-out)}
@media (min-width:1024px){.update-bar{bottom:24px}}
body.sheet-open{overflow:hidden}
#match-list{position:relative}
#match-list[aria-busy="true"]>:not(.list-busy){opacity:.42;pointer-events:none;filter:saturate(.6);transition:opacity .15s .12s}
.list-busy{position:absolute;left:50%;top:min(120px,35%);transform:translateX(-50%);z-index:6;display:flex;align-items:center;gap:10px;padding:10px 18px;border-radius:var(--r-full);background:var(--raised-2);border:1px solid var(--accent-line);box-shadow:var(--shadow-2);font-size:var(--fs-s);font-weight:600;white-space:nowrap}
body.navigating .page{opacity:.55;pointer-events:none;transition:opacity .18s ease .06s}
.ptr.pulling,.ptr.refreshing{opacity:1}
.ptr.pulling{transition:none}
.ptr.refreshing{transform:translate(-50%,10px)}
.ptr .ptr-spin{transform:rotate(calc(var(--pull,0px) * 4))}
.ptr.ready .ptr-spin{border-color:var(--accent)}
.ptr.refreshing .ptr-spin{animation:spin .8s linear infinite}
.device-list{margin:6px 0 0;display:grid;gap:6px}
.device-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:var(--r-s);border:1px solid var(--line);font-size:var(--fs-s)}
.notify-onboard{position:fixed;z-index:85;left:12px;right:12px;bottom:calc(var(--nav-h) + var(--safe-b) + 22px);display:flex;gap:12px;align-items:flex-start;background:var(--raised-2);border:1px solid var(--line-2);border-radius:var(--r-l);padding:16px;box-shadow:var(--shadow-2);opacity:0;transform:translateY(10px);transition:opacity var(--t-slow),transform var(--t-slow) var(--ease-out)}
.notify-onboard.show{opacity:1;transform:none}
.notify-onboard .no-icon{font-size:1.2rem;flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--accent-soft)}
.notify-onboard h2{font-size:var(--fs-m);margin:0 0 4px}
.notify-onboard p{font-size:var(--fs-s);color:var(--ink-3)}
.notify-onboard ul{margin:6px 0 10px;padding-left:18px;list-style:disc;font-size:var(--fs-s);line-height:1.45}
.notify-onboard .no-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.notify-onboard.busy .no-body{opacity:.75}
@media (min-width:1024px){.notify-onboard{left:auto;right:24px;bottom:24px;width:min(380px,calc(100vw - 24px))}}
.ctx-comp .card-head{align-items:flex-start}
.kn-table td.kn-v{white-space:nowrap}
.wl-clear.is-armed{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 55%,var(--line))}
@media (prefers-reduced-motion:reduce){.reward-pop,.notify-onboard{transform:none!important}}
.reason{padding-left:12px}.reason::before{left:0}
@media (min-width:1024px){.team-board.team-hubs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}}
@media (max-width:359px){.stage-team h2,.hero-team b{font-size:.98rem;letter-spacing:-.02em}.stage-center,.hero-center{min-width:62px}.stage-center strong,.hero-time{font-size:1.55rem}.stage{padding:var(--sp-4)}.crest-xl{width:56px;height:56px}}

/* 21 ─ shared outcome colour channels (phase 2) */
:root{--home-rgb:142,156,255;--away-rgb:63,214,179;--draw-rgb:183,192,202;--gold-rgb:232,196,106;--ease-cine:cubic-bezier(.22,1,.36,1)}
html[data-theme=light]{--home-rgb:77,91,216;--away-rgb:14,156,125;--draw-rgb:122,133,146;--gold-rgb:201,151,31}

/* ── Premium intelligence cards (match lists, phase 2) */
.mlist:not(.boxed) .mrow{margin-top:8px;padding:14px 14px 14px 12px;border-radius:20px;border:1px solid var(--line);
  background:radial-gradient(90% 120% at 100% 0%,rgba(var(--gold-rgb),.05),transparent 55%),linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.01));box-shadow:0 14px 34px -26px rgba(0,0,0,.9)}
html[data-theme=light] .mlist:not(.boxed) .mrow{background:#fff;box-shadow:0 10px 28px -22px rgba(16,32,26,.35)}
.mlist:not(.boxed) .mrow::after{display:none}
.mlist:not(.boxed) .mrow:hover{border-color:var(--line-2);background:radial-gradient(90% 120% at 100% 0%,rgba(var(--gold-rgb),.08),transparent 55%),var(--surface)}
.qv2{gap:8px}
.qv-tri{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.qt{display:flex;align-items:baseline;justify-content:center;gap:5px;padding:6px 4px 5px;border-radius:10px;background:rgba(255,255,255,.035);color:var(--ink-3)}
.qt small{font:700 9.5px/1 var(--font);letter-spacing:.06em;opacity:.8}
.qt b{font:700 1.05rem/1 var(--display);letter-spacing:-.03em;color:var(--ink-2)}
.qt.k-home b{color:rgb(var(--home-rgb))}.qt.k-away b{color:rgb(var(--away-rgb))}
.qt.pick{background:linear-gradient(180deg,rgba(var(--gold-rgb),.16),rgba(var(--gold-rgb),.05));box-shadow:inset 0 0 0 1px rgba(var(--gold-rgb),.35)}
.qt.pick b{color:var(--accent-tx)}
html[data-theme=light] .qt{background:#F2F5F0}
.qv2 .prob-s{height:4px}
.qv2 .read-line{gap:7px;padding-top:2px}
.qv-by{font:800 9.5px/1 var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-tx);flex:none}
.qv-ins{display:grid;grid-template-columns:repeat(auto-fit,minmax(116px,1fr));gap:6px}
.qi{position:relative;display:grid!important;grid-template-columns:1fr auto;grid-template-areas:"k p" "v p";gap:2px 8px;align-items:center;padding:8px 10px 10px;border-radius:12px;background:var(--surface);border:1px solid var(--line);overflow:hidden}
.qi-k{grid-area:k;display:inline-flex;align-items:center;gap:5px;font:700 9.5px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.qi-k .i{width:12px;height:12px}
.qi-v{grid-area:v;font:600 var(--fs-xs)/1.25 var(--font);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qi b{grid-area:p;font:700 1.05rem/1 var(--display)!important;letter-spacing:-.03em}
.qi-m{position:absolute;left:0;bottom:0;height:2px;width:calc(var(--p) * 1%);background:var(--c,var(--open))}
.qi-m.sig-strong{--c:var(--strong)}.qi-m.sig-solid{--c:var(--solid)}.qi-m.sig-lean{--c:var(--lean)}.qi-m.sig-open{--c:var(--open)}
.qi.noedge{opacity:.78}
@media (min-width:1024px){.mlist:not(.boxed) .mrow{grid-template-columns:64px minmax(0,1fr) minmax(260px,46%) auto}}

/* ── Motion: */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:220ms;animation-timing-function:var(--ease-cine)}
  ::view-transition-group(match-stage){animation-duration:340ms;animation-timing-function:var(--ease-cine)}
  ::view-transition-group(match-core){animation-duration:340ms;animation-timing-function:var(--ease-cine)}
  .stage2 .st-battle{view-transition-name:match-stage}
  .stage2 .core{view-transition-name:match-core}
  .qread .qr-pick .vl-p{view-transition-name:match-pick}
  .stage2 .stage-comp{view-transition-name:match-comp}
  ::view-transition-group(match-pick),::view-transition-group(match-comp){animation-duration:380ms;animation-timing-function:var(--ease-cine)}
  .nav-bottom{view-transition-name:nav-bottom}.rail{view-transition-name:rail}.topbar{view-transition-name:topbar}
}
.goals-grid>*{min-width:0}.land-wrap{grid-template-columns:22px minmax(0,1fr)}.land-grid,.land-ax-x,.land-ax-xl{width:100%}
.stage2 .fav,.stage-team .fav{flex:none}
.mlist .mrow{content-visibility:auto;contain-intrinsic-size:auto 190px}

/* ═══ 22 ─ INTELLIGENCE CARDS (vT, owner brief 25 Oct 2026: */
.mlist .mrow.mcard,.mcard{display:flex;flex-direction:column;gap:12px;padding:14px 14px 12px;border-radius:22px;border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(var(--gold-rgb),.06),rgba(255,255,255,.012) 40%),var(--surface);contain-intrinsic-size:auto 430px}
.mlist .mrow.mcard{margin-top:10px}
.mcard::after{display:none}
.mcard:hover{border-color:var(--line-2)}
html[data-theme=light] .mcard{background:#fff;box-shadow:0 12px 28px -22px rgba(16,32,26,.35)}
.mc-top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.mcard .mc-comp{display:inline-flex;align-items:center;gap:7px;min-width:0;margin:0;font:600 11.5px/1.2 var(--font);color:var(--ink-3)}
.mc-comp>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crest-xs{width:16px;height:16px;font-size:6px;border-radius:5px}
.crest-m{width:30px;height:30px;font-size:10px}
.mcard .mc-when{flex-direction:row;align-items:baseline;gap:7px;padding:0;flex:none}
.mcard .mc-when strong{font:700 1rem/1 var(--display);letter-spacing:-.02em;color:var(--ink)}
.mcard .mc-when span{font-size:11px;color:var(--ink-3)}
.mcard .mc-teams{gap:8px}
.mcard .mr-team{gap:11px;font:650 1.02rem/1.2 var(--font)}
.mcard .mr-read{gap:9px}
/* Pasha's read: the answer first */
.qv2 .qv-main{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"by p" "name s";align-items:center;gap:4px 12px;padding:10px 12px;border-radius:14px;
  background:linear-gradient(90deg,rgba(var(--gold-rgb),.13),rgba(var(--gold-rgb),.02));border:1px solid rgba(var(--gold-rgb),.24)}
.qv2 .qv-main .qv-by{grid-area:by;display:inline-flex;align-items:center;gap:5px}
.qv2 .qv-main .qv-name{grid-area:name;min-width:0;font:650 var(--fs-m)/1.25 var(--font);color:var(--ink)}
.qv2 .qv-main .read-p{grid-area:p;justify-self:end;font:750 1.35rem/1 var(--display);letter-spacing:-.03em;color:var(--accent-tx)}
.qv2 .qv-main .sig,.qv2 .qv-main .qv-noedge{grid-area:s;justify-self:end;align-self:center}
.emo{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-style:normal;line-height:1}
.qv-by .emo{font-size:13px;letter-spacing:0}
.qt i{font-style:normal;font-size:10px;font-weight:650;color:var(--ink-3);margin-left:-3px}
/* Quick View insights: full-width rows, nothing truncated */
.qv-ins:is(.qv2 *,.pred-crit *){display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
:is(.qv2,.pred-crit) .qi{display:grid!important;grid-template-columns:26px minmax(0,1fr) auto auto;grid-template-areas:"e v p s";align-items:center;gap:4px 10px;
  padding:9px 12px 11px 10px;border-radius:13px;background:rgba(255,255,255,.035);border:1px solid var(--line);overflow:hidden;
  animation:qiIn 420ms var(--ease-cine) both;animation-delay:calc(140ms + var(--d,1) * 80ms)}
html[data-theme=light] :is(.qv2,.pred-crit) .qi{background:#F4F6F2}
.qi-e{grid-area:e;font-size:17px;text-align:center}
:is(.qv2,.pred-crit) .qi-v{grid-area:v;white-space:normal;overflow:visible;font:600 var(--fs-s)/1.25 var(--font);color:var(--ink)}
:is(.qv2,.pred-crit) .qi b{grid-area:p;font:750 1.08rem/1 var(--display)!important;letter-spacing:-.03em;color:var(--ink)}
:is(.qv2,.pred-crit) .qi .sig,:is(.qv2,.pred-crit) .qi .qv-noedge{grid-area:s;justify-self:end;font-size:11px}
:is(.qv2,.pred-crit) .qi .qv-noedge{color:var(--ink-3);font-weight:600}
:is(.qv2,.pred-crit) .qi-m{height:2px;opacity:.9}
:is(.qv2,.pred-crit) .qi.noedge{opacity:.86}
@keyframes qiIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* state + freshness */
.mcard .mr-meta .chip,.mr-meta .chip{min-height:24px;padding:0 9px;font-size:11px;gap:5px}
.mr-meta .chip .emo{font-size:12px}
.mcard .mr-meta{align-items:center;gap:6px 8px}
.mcard .fx-updated{display:inline-flex;flex-wrap:wrap;align-items:center;gap:2px 5px;font-size:10.5px;line-height:1.35}
.mcard .fx-updated .i{width:12px;height:12px}
/* explicit actions */
.mcard .mc-actions{position:relative;z-index:2;display:flex;align-items:center;gap:8px;padding-top:2px}
.mc-analyse{flex:1 1 auto;--h:46px;font-weight:700;letter-spacing:.01em}
.mc-analyse .i{transition:transform var(--t-fast) var(--ease)}
.mc-analyse:hover .i{transform:translateX(3px)}
.mc-save{height:46px!important;flex:none}
.mcard .mc-remove{--h:46px}
.mcard.done .mc-analyse{background:var(--surface-2);color:var(--ink);box-shadow:none;border:1px solid var(--line-2)}
.mcard .mr-link{z-index:1}
.mcard .mr-read{position:relative;z-index:0}
@media (min-width:900px){
  .mlist .mrow.mcard,.mcard{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr);grid-template-areas:"top read" "teams read" "act read";
    align-items:start;column-gap:22px;row-gap:12px}
  .mcard .mc-top{grid-area:top}.mcard .mc-teams{grid-area:teams}.mcard .mr-read{grid-area:read;padding-left:20px;border-left:1px solid var(--line)}
  .mcard .mc-actions{grid-area:act;align-self:end}
}
@media (prefers-reduced-motion:reduce){:is(.qv2,.pred-crit) .qi{animation:none}}
.mlist .mrow.mcard{content-visibility:auto}
:is(.qv2,.pred-crit) .qi.crit b{margin-left:0}
:is(.qv2,.pred-crit) .qi.crit{font-size:inherit}
.mcard .mc-remove{width:auto;height:46px;min-height:46px;padding:0 16px;border-radius:var(--r-full);flex:none;gap:6px}
/* vT: */
:is(.qv2,.pred-crit,.qread) .qi{grid-template-columns:26px minmax(0,1fr) auto;grid-template-areas:"e v p" "e v s";row-gap:3px}
:is(.qv2,.pred-crit,.qread) .qi .sig,:is(.qv2,.pred-crit,.qread) .qi .qv-noedge{justify-self:end}
.qread .qi-v{white-space:normal;overflow:visible}
.tn-qv{display:flex;flex-direction:column;gap:9px;margin:8px 0 12px}
.tn-actions .btn-gold{flex:1 1 auto;--h:46px}

/* ═══ 23 ─ CREST STAGE (vU) */
.crest{width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:50%;overflow:hidden;position:relative;isolation:isolate;
  background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.13),rgba(255,255,255,.035) 62%,rgba(255,255,255,.015));
  border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 2px 6px -2px rgba(0,0,0,.5);
  font:750 10px/1 var(--display);letter-spacing:.02em;color:#EAF2EE;text-transform:uppercase}
.crest img{width:70%;height:70%;object-fit:contain;object-position:center;display:block;filter:drop-shadow(0 1px 1.2px rgba(0,0,0,.45))}
.crest-mono{background:radial-gradient(circle at 50% 28%,hsl(var(--h,150) 42% 38%),hsl(var(--h,150) 46% 18%));border-color:hsl(var(--h,150) 40% 45% / .5)}
html[data-theme=light] .crest{background:radial-gradient(circle at 50% 30%,#fff,#EEF2EC);border-color:rgba(16,32,26,.10);box-shadow:inset 0 1px 0 #fff,0 2px 6px -3px rgba(16,32,26,.35)}
html[data-theme=light] .crest-mono{background:radial-gradient(circle at 50% 28%,hsl(var(--h,150) 45% 52%),hsl(var(--h,150) 45% 34%));color:#fff}
.crest-xs{width:18px;height:18px;font-size:6.5px;border-width:0;box-shadow:none;background:transparent}
.crest-xs img{width:100%;height:100%;filter:none}
.crest-xs.crest-mono{background:hsl(var(--h,150) 40% 30%)}
.crest-s{width:24px;height:24px;font-size:8px}.crest-s img{width:74%;height:74%}
.crest-m{width:32px;height:32px;font-size:10.5px}.crest-m img{width:72%;height:72%}
.crest.big,.crest-l{width:56px;height:56px;font-size:16px}
.crest-xl{width:68px;height:68px;font-size:19px;border-color:rgba(255,255,255,.14)}
.crest-xl img,.crest-l img,.crest.big img{width:68%;height:68%;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}

/* Crest guard (vU): */
span.crest{flex:0 0 auto!important;padding:0!important;max-width:none}
/* vU: */
.mcard .mc-actions{min-width:0}.mcard .mc-actions>*{min-width:0}
.mc-actions .mc-save{flex:0 1 auto;overflow:hidden}.mc-actions .mc-save span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:379px){.mc-actions .snap-toggle{font-size:0;gap:0;width:44px;padding:0;justify-content:center;flex:none}.mc-actions .snap-toggle .i{margin:0}}
.snap-toggle{min-height:40px}

/* §30 One state language (vV Action State Controller): */
@keyframes stOk{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 60%,transparent)}100%{box-shadow:0 0 0 9px transparent}}
@keyframes stErr{0%,100%{transform:none}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
@keyframes stNudge{0%,100%{transform:none}40%{transform:scale(.96)}}
[data-state=success]{animation:stOk .7s ease-out;position:relative}
[data-state=success]:not(.icon-btn):not(.save)::before{content:"✓";position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font:800 11px/1 var(--font);color:#06231A;background:var(--ok);box-shadow:0 0 0 2px var(--bg);z-index:4;pointer-events:none}
[data-state=error]{box-shadow:0 0 0 2px color-mix(in srgb,var(--bad) 75%,transparent)!important;animation:stErr .32s ease-in-out}
.nudge{animation:stNudge .38s ease-out}
button:disabled,.btn[aria-disabled=true]{cursor:not-allowed}
/* Route transition: */
.is-opening{position:relative}
.is-opening>*{transition:opacity .15s ease}
.is-opening>:not(.mr-act):not(.mc-actions){opacity:.6}
.is-opening::after{content:"";position:absolute;left:14px;right:14px;top:0;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);background-size:40% 100%;background-repeat:no-repeat;animation:stLine 1s linear infinite;pointer-events:none}
@keyframes stLine{0%{background-position:-40% 0}100%{background-position:140% 0}}
#toast.has-act{display:flex;align-items:center;gap:12px;pointer-events:auto;padding:8px 8px 8px 18px}
.toast-act{flex:none;min-height:36px;padding:0 14px;border-radius:var(--r-full);border:1px solid var(--line-2);background:var(--accent-soft,rgba(232,196,106,.14));color:var(--accent-tx,var(--accent));font:700 var(--fs-s)/1 var(--font);cursor:pointer}
@media (prefers-reduced-motion:reduce){[data-state=success],[data-state=error],.nudge{animation:none}.is-opening::after{animation:none;background:var(--accent);opacity:.5}}

/* §32 Equipped cosmetics, everywhere an avatar is shown (vV Pasha Vault). */
:root{--laurel:url(/assets/laurel.svg?v=p5-20261101-195359-21360f87)}
.avatar.frame-laurel::before{content:"";position:absolute;inset:-26%;background:var(--laurel) center/contain no-repeat;pointer-events:none;z-index:0;filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.45))}
html[data-theme=light] .avatar.frame-laurel::before{filter:drop-shadow(0 1px 1px rgba(80,55,10,.35))}
.avatar .avatar-rank{z-index:2}
.avatar.aura-gold{box-shadow:0 0 0 1.5px rgba(255,216,128,.6),0 0 14px 3px rgba(232,196,106,.42),0 0 30px 8px rgba(232,196,106,.14)}
.avatar.aura-gold::after{content:"";position:absolute;inset:-7px;border-radius:50%;background:radial-gradient(circle,transparent 58%,rgba(255,222,140,.30) 68%,transparent 75%);animation:auraBreath 4.6s ease-in-out infinite;pointer-events:none;z-index:0}
@keyframes auraBreath{0%,100%{opacity:.45;transform:scale(.97)}50%{opacity:1;transform:scale(1.04)}}
html[data-theme=light] .avatar.aura-gold{box-shadow:0 0 0 1.5px rgba(196,146,40,.65),0 0 14px 3px rgba(214,169,65,.45),0 0 28px 8px rgba(214,169,65,.18)}
.cos-title{display:inline-flex;align-items:center;gap:5px;padding:2px 9px 2px 7px;border-radius:7px;font:italic 700 12px/1.3 Georgia,"Times New Roman",serif;letter-spacing:.03em;color:#2A1C04;background:linear-gradient(135deg,#FFF1C2,#E8C46A 45%,#B98A2A 70%,#F2D88C);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(90,60,10,.35),0 1px 2px rgba(0,0,0,.35)}
.cos-title::before{content:"✦";font-style:normal;font-size:10px;opacity:.8}
.cos-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:var(--r-full);font:700 11.5px/1.4 var(--font);color:#E9F3FF;background:linear-gradient(160deg,#3B6FB6,#1D3E73);border:1px solid rgba(190,215,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 2px rgba(0,0,0,.35)}
@media (prefers-reduced-motion:reduce){.avatar.aura-gold::after{animation:none;opacity:.7}}
.snap-toggle{min-height:40px!important}
/* vV.2 · no sideways strips on phones (brief part 1/10): */
@media (max-width:560px){
  .seg.period-bar{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;border-radius:18px;overflow:visible}
  .seg.period-bar>.seg-btn{grid-column:span 2;min-width:0;padding:0 8px;border-radius:14px}
  .seg.period-bar>.seg-btn:nth-child(n+4){grid-column:span 3}
}
/* vV.2 · tap target: */
.as-support{padding:11px 0;margin:-11px 0}
/* vV.2 · the toast was positioned from the centre line, so its… */
#toast{width:max-content}
#toast.has-act{border-radius:18px;text-align:left}
/* vW · Pasha mark (docs/BRAND_SYSTEM.md): */
.pmark{display:inline-grid;line-height:0}
.pmark-svg{width:100%;height:100%;display:block}
.pm-tile{fill:#0B2219}
.pm-ink{color:#E7C26F}
.pm-host{background:none!important;box-shadow:0 6px 18px -8px rgba(231,194,111,.45),0 0 0 1px rgba(231,194,111,.22) inset!important;padding:0;overflow:hidden}
.pm-host .pmark{width:100%;height:100%}
html[data-theme=light] .pm-host{box-shadow:0 4px 12px -6px rgba(15,31,25,.35)!important}
/* ===== vW · one loading / transition language (docs/UI_UX_SYSTEM.md) */
.pp-core{position:relative;display:inline-block;width:18px;height:18px;flex:none;border-radius:50%;
  box-shadow:inset 0 0 0 1.5px rgba(231,194,111,.22)}
.pp-core::before{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid transparent;border-top-color:#E7C26F;border-right-color:rgba(231,194,111,.55);
  animation:pp-core-turn .9s cubic-bezier(.45,.1,.4,.9) infinite}
.pp-core>i{position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#E7C26F}
@keyframes pp-core-turn{to{transform:rotate(360deg)}}
/* INTERACTION SHIELD (level C): */
.route-shield{position:fixed;inset:0;z-index:2147482000;display:flex;align-items:flex-start;justify-content:center;
  padding-top:calc(env(safe-area-inset-top,0px) + 72px);background:rgba(4,12,9,0);pointer-events:auto;cursor:progress;
  transition:background-color .18s ease}
.route-shield.on{background:rgba(4,12,9,.38)}
html[data-theme=light] .route-shield.on{background:rgba(237,240,234,.55)}
.rs-chip{display:flex;flex-wrap:wrap;align-items:center;gap:10px;max-width:min(92vw,420px);padding:10px 16px 10px 12px;border-radius:999px;
  background:rgba(10,24,18,.94);color:#F3F1EA;box-shadow:0 12px 34px -12px rgba(0,0,0,.6),0 0 0 1px rgba(231,194,111,.22) inset;
  font:600 14px/1.3 var(--font,system-ui,sans-serif);opacity:0;transform:translateY(-6px);transition:opacity .16s ease,transform .2s ease}
html[data-theme=light] .rs-chip{background:rgba(255,255,255,.97);color:#0F1F19;box-shadow:0 12px 30px -14px rgba(15,31,25,.4),0 0 0 1px rgba(154,113,33,.25) inset}
.route-shield.on .rs-chip{opacity:1;transform:none}
.route-shield.stuck .rs-chip{border-radius:18px;padding:14px 16px}
.rs-help{flex-basis:100%;margin-top:4px}
.rs-help p{margin:0 0 10px;font-weight:500;font-size:13px;opacity:.85}
.rs-actions{display:flex;gap:8px}
html.shielded .page-skel{filter:saturate(.9)}
/* Background: */
html[data-life=background] *,html[data-life=background] *::before,html[data-life=background] *::after{animation-play-state:paused!important}
/* Offline: */
html.is-offline .top::after,html.is-offline .cc-top::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;
  background:repeating-linear-gradient(90deg,rgba(231,194,111,.7) 0 10px,transparent 10px 18px)}
/* A pending control that is slow says so (ui-state.js busy(): */
.is-slow .busy-text{opacity:.9}
@media (prefers-reduced-motion:reduce){.pp-core::before{animation:none;transform:rotate(45deg)}.route-shield,.rs-chip{transition:none}}
/* vW · directional page transitions (ui-state.js adds the type on… */
@media (prefers-reduced-motion:no-preference){
  @keyframes vt-out-left{to{opacity:0;transform:translateX(-6%)}}
  @keyframes vt-in-right{from{opacity:0;transform:translateX(8%)}}
  @keyframes vt-out-right{to{opacity:0;transform:translateX(6%)}}
  @keyframes vt-in-left{from{opacity:0;transform:translateX(-8%)}}
  html:active-view-transition-type(forward)::view-transition-old(root){animation:200ms var(--ease-cine,ease) both vt-out-left}
  html:active-view-transition-type(forward)::view-transition-new(root){animation:260ms var(--ease-cine,ease) both vt-in-right}
  html:active-view-transition-type(back)::view-transition-old(root){animation:200ms var(--ease-cine,ease) both vt-out-right}
  html:active-view-transition-type(back)::view-transition-new(root){animation:260ms var(--ease-cine,ease) both vt-in-left}
}
/* vW: */
.update-strip.update-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px}
.update-card .uc-mark{width:38px;height:38px;border-radius:11px;display:block}
.update-card .uc-text{min-width:0;display:flex;flex-direction:column;gap:2px}
.update-card .uc-text b{font-weight:600;color:var(--ink)}
.update-card .uc-text small{color:var(--ink-2);font-size:var(--fs-xs);line-height:1.35}
.update-card .uc-actions{display:flex;gap:6px}
@media (max-width:480px){.update-strip.update-card{grid-template-columns:auto minmax(0,1fr)}
  .update-card .uc-actions{grid-column:1/-1;justify-content:flex-end}}
/* ===== vW · sign-in (docs/UI_UX_SYSTEM.md "Sign-in and session states") */
.auth-v{grid-template-areas:"hero" "panel" "story";align-items:start;gap:var(--sp-6);padding-top:var(--sp-5)}
.auth-v .auth-hero{grid-area:hero;display:flex;align-items:center;gap:16px;min-width:0}
.auth-v .login-panel{grid-area:panel}
.auth-v .auth-story{grid-area:story}
.auth-hero-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.auth-hero h1{font:700 clamp(1.45rem,1.05rem + 2.4vw,2.9rem)/1.06 var(--display);letter-spacing:-.035em;text-wrap:balance}
.auth-hero-text>p:last-child{color:var(--ink-2);font-size:var(--fs-m);max-width:46ch}
.pemblem{display:block;overflow:visible}
.pemblem .pe-pitch{stroke:var(--accent);stroke-opacity:.16;stroke-width:1.3}
.pemblem .pe-arc{stroke:var(--accent);stroke-opacity:.55;stroke-width:2.2;stroke-linecap:round}
html[data-theme=light] .pemblem .pe-pitch{stroke:#0F1F19;stroke-opacity:.16}
html[data-theme=light] .pemblem .pe-arc{stroke:#9C7019}
.auth-emblem{flex:none;width:68px;height:61px;filter:drop-shadow(0 10px 26px rgba(232,196,106,.18))}
@media (max-width:599px){.auth-hero-text>p:last-child{display:none}.auth-hero .kicker{display:none}}
@media (min-width:1024px){
  .auth-v{grid-template-columns:1.1fr .9fr;grid-template-areas:"hero panel" "story panel";column-gap:var(--sp-12);row-gap:var(--sp-6);padding-top:var(--sp-10)}
  .auth-v .auth-hero{flex-direction:column;align-items:flex-start;gap:var(--sp-5)}
  .auth-emblem{width:132px;height:119px;margin-left:-14px}
  .auth-v .login-panel{position:sticky;top:calc(var(--top-h, 64px) + 24px)}
}
/* one orchestrated moment: the read arc turns in once, the rest is still */
@media (prefers-reduced-motion:no-preference){
  .auth-emblem .pe-arc{stroke-dasharray:80;stroke-dashoffset:80;animation:pe-draw .9s cubic-bezier(.2,.8,.2,1) .15s forwards}
  @keyframes pe-draw{to{stroke-dashoffset:0}}
}
/* session states: one card, its cause in plain words, the action that actually helps */
.session-ended{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;padding:14px;border-radius:var(--r-l);
  background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--ink-2)}
.session-ended.se-blocked{background:rgba(255,107,107,.08);border-color:rgba(255,107,107,.32)}
.session-ended .se-icon{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);color:var(--accent-tx)}
.session-ended.se-blocked .se-icon{color:var(--bad)}
.session-ended p{margin:2px 0 0}
.se-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.auth-card .se-actions .btn-gold{width:auto}
/* the language picker is the select itself (class="lang"); */
select.lang{min-height:38px;height:38px;width:auto;min-width:68px;padding:0 30px 0 13px;border-radius:var(--r-full);font-size:var(--fs-s);font-weight:600;background-position:calc(100% - 16px) 52%,calc(100% - 11px) 52%}
/* error pages (404 / 500): the tiled mark, the cause, the next step */
.error-page{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  padding:24px;text-align:center;background:radial-gradient(90% 60% at 50% 0%,var(--glow-b),transparent 70%),var(--bg);color:var(--ink)}
.error-page .ep-mark{width:64px;height:64px;border-radius:16px;margin-bottom:6px}
.error-page .ep-code{font:600 var(--fs-xs)/1 var(--font);letter-spacing:.08em;color:var(--ink-3)}
.error-page h1{font:700 var(--fs-h1)/1.1 var(--display);letter-spacing:-.03em;margin:0}
.error-page p{margin:0;color:var(--ink-2);max-width:38ch}
.error-page .ep-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:8px}
/* vW: */
.offline-boot-on .login-panel>*:not(#offline-boot){display:none}
.offline-boot{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start}
.offline-boot .pp-core{margin-top:3px}
.offline-boot strong{display:block;font:650 var(--fs-h3)/1.25 var(--display);color:var(--ink)}
.offline-boot p{margin:6px 0 14px;color:var(--ink-2);font-size:var(--fs-s)}
.auth-card .offline-boot .btn-gold{width:auto}
.is-slow.show-spinner{box-shadow:0 0 0 2px var(--accent-line)}
/* vW: */
.brand-mark.pm-host{width:34px;height:34px;border-radius:10px}
/* Public footer: legal links (owner brief 28 Oct 2026 §10) */
.public-foot{display:grid;gap:var(--sp-2);margin:var(--sp-6,40px) auto 0;padding:var(--sp-4) var(--sp-4) calc(var(--sp-4) + env(safe-area-inset-bottom));max-width:1100px;border-top:1px solid var(--line-2);color:var(--ink-3,var(--ink-2));font-size:.86rem}
.public-foot nav{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4)}
.public-foot a{color:var(--ink-2)}
/* Narrow phones: */
.public-top>div{min-width:0;flex-wrap:wrap;justify-content:flex-end}
.public-top>div .btn{max-width:100%;white-space:normal;text-align:center;line-height:1.15}
@media (max-width:380px){.public-top{gap:8px}.public-top .brand-name small{display:none}}

/* 22 ─ "Signal Room" 2026 layer (docs/UI_REDESIGN_2026.md): */
:root{--edge:linear-gradient(90deg,transparent,rgba(232,196,106,.7) 28%,rgba(63,224,178,.55) 72%,transparent);
  --raised:#0A1513;--raised-2:#0F1C19;--card-bg:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.012));
  --e1:0 1px 0 rgba(255,255,255,.045) inset,0 12px 32px -18px rgba(0,0,0,.7);
  --e2:0 1px 0 rgba(255,255,255,.06) inset,0 30px 70px -28px rgba(0,0,0,.85),0 0 0 1px rgba(214,240,230,.05);
  --r-ctl:14px;--r-card:20px;--r-hero:28px}
html[data-theme=light]{--edge:linear-gradient(90deg,transparent,rgba(201,151,31,.75) 28%,rgba(8,112,90,.55) 72%,transparent);
  --raised:#FFFFFF;--raised-2:#FAFBF8;--card-bg:linear-gradient(180deg,#fff,#FBFCF9);
  --e1:0 1px 2px rgba(16,32,26,.05),0 10px 28px -18px rgba(16,32,26,.28);--e2:0 2px 6px rgba(16,32,26,.06),0 30px 60px -30px rgba(16,32,26,.35)}
body{font-feature-settings:"cv11","ss01","tnum"}
.num,[class*=pct],.pricing-price,.kv dd,.kv .row strong{font-variant-numeric:tabular-nums}
h1,h2,.page-head h1{text-wrap:balance}
.page-head h1{font-size:clamp(1.75rem,1.3rem + 1.9vw,2.6rem);letter-spacing:-.034em;line-height:1.08}
.page-head p{font-size:var(--fs-l);line-height:1.55}
/* cards: */
.card{background:var(--card-bg),var(--raised);border-color:var(--line);border-radius:var(--r-card);box-shadow:var(--e1)}
.card-title{font-size:1.125rem;letter-spacing:-.02em}
.sig-edge,.home-hero,.verdict,.match-hero,.pricing-card.is-best,.hero-card{position:relative}
.sig-edge::after,.home-hero::after,.verdict::after,.match-hero::after,.pricing-card.is-best::after,.hero-card::after{content:"";position:absolute;left:18px;right:18px;top:-1px;height:1px;background:var(--edge);pointer-events:none}
/* buttons */
.btn{border-radius:var(--r-ctl);font-weight:620;letter-spacing:-.005em;transition:background var(--t-fast),border-color var(--t-fast),transform var(--t-fast),box-shadow var(--t-mid)}
.btn-gold,.btn-primary{box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 -1px 0 rgba(0,0,0,.12) inset,0 14px 30px -14px rgba(232,196,106,.55)}
.btn-gold:hover,.btn-primary:hover{box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 18px 36px -14px rgba(232,196,106,.7)}
.btn:focus-visible,.chip-btn:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:none;box-shadow:var(--focus)}
.chip{border-radius:var(--r-full);letter-spacing:.01em}
/* fields */
input[type=text],input[type=email],input[type=password],input[type=search],input:not([type]),select,textarea{border-radius:var(--r-ctl);background:rgba(255,255,255,.035);border-color:var(--line-2);transition:border-color var(--t-fast),background var(--t-fast),box-shadow var(--t-fast)}
html[data-theme=light] input[type=text],html[data-theme=light] input[type=email],html[data-theme=light] input[type=password],html[data-theme=light] select{background:#fff}
input:hover,select:hover,textarea:hover{border-color:var(--line-3)}
input:focus,select:focus,textarea:focus{border-color:var(--accent-line);background:rgba(255,255,255,.05)}
/* chrome: glass top bar and dock */
.topbar{border-bottom:1px solid var(--glass-line)}
.nav-bottom{border-radius:22px;box-shadow:var(--e2)}
.nb-item[aria-current=page]::before,.nb-item.active::before{background:linear-gradient(180deg,rgba(232,196,106,.16),rgba(232,196,106,.06));box-shadow:0 0 0 1px rgba(232,196,106,.22) inset}
html[data-theme=light] .nb-item[aria-current=page]::before{background:var(--accent-soft)}
/* section headings: quieter, stronger */
.sec-head h2{font-size:1.1875rem;letter-spacing:-.022em}
/* states */
.empty{border-style:solid;border-color:var(--line);background:var(--card-bg),transparent;padding:var(--sp-10) var(--sp-6)}
.empty .medal,.empty-ico{background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent-line) inset}
.note{border-radius:var(--r-ctl);background:var(--card-bg),var(--raised)}
.form-error{border-radius:var(--r-ctl)}
.skeleton .sk,.sk{background:linear-gradient(90deg,var(--surface) 0%,var(--surface-3) 50%,var(--surface) 100%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}
/* account: subscription block */
.sub-block{position:relative;border-radius:var(--r-card);padding:16px;background:var(--card-bg),var(--raised-2);border:1px solid var(--line)}
.sub-block::after{content:"";position:absolute;left:16px;right:16px;top:-1px;height:1px;background:var(--edge)}
.sub-block[data-sub-state=cancelled]::after,.sub-block[data-sub-state=ended]::after,.sub-block[data-sub-state=expired]::after{background:linear-gradient(90deg,transparent,var(--line-3),transparent)}
.sub-block[data-sub-state=payment_failed]::after{background:linear-gradient(90deg,transparent,var(--warn),transparent)}
/* tables / key-value */
.kv>div,.kv .row{padding:13px 0}
/* desktop polish */
@media (hover:hover) and (min-width:900px){.card:where(a,.mrow,.match-card):hover{transform:translateY(-1px);box-shadow:var(--e2)}}
@media (min-width:1024px){.page{gap:var(--sp-10)}}
.public-foot nav{gap:0 var(--sp-4)}.public-foot nav a{min-height:44px;display:inline-flex;align-items:center}.public-top select.lang{min-height:44px;height:44px}
label.check{min-height:44px}.demo>summary{min-height:44px;display:flex;align-items:center}.auth-card::after{content:"";position:absolute;left:18px;right:18px;top:-1px;height:1px;background:var(--edge);pointer-events:none}.auth-card{position:relative}
@media (max-width:520px){.public-top .brand-name small{display:none}.public-top>div{flex-wrap:nowrap}.public-top>div .btn{white-space:nowrap;padding-inline:12px}}@media (max-width:359px){.public-top .brand-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
/* 22b ─ 44 px tap targets (WCAG 2.5.5 / owner brief U) */
.tb-btn{width:44px;height:44px}.seg-btn{min-height:44px}.back{min-height:44px}.ds-c,.lf-chip{min-height:44px}.sec-link{min-height:44px;padding-block:0}.lp-more{display:inline-flex;align-items:center;min-height:44px}.save-wide{height:44px}.hist-hide{width:44px;min-height:44px}.top-verdict{min-height:44px}
.streak,.hist-name{position:relative}.streak::after{content:"";position:absolute;inset:-5px}.hist-name::after{content:"";position:absolute;inset:-12px -4px}
.foot nav{gap:0 var(--sp-4)}.foot nav a{min-height:44px;display:inline-flex;align-items:center}
/* Brief 29 Oct 2026 (§6-7): */
.public-top .btn{min-height:44px}
.lang-pick{position:relative;display:inline-flex;align-items:center;min-width:0}
.lang-pick .lang-globe{position:absolute;left:12px;width:16px;height:16px;color:var(--ink-2);pointer-events:none}
.lang-pick select.lang{min-height:44px;height:44px;max-width:150px;padding-left:34px}
.foot-support{margin:0}.foot-support a{display:inline-flex;align-items:center;min-height:44px}
html.standalone [data-install-entry]{display:none !important}

/* ═══ 24 ─ SIGNAL ROOM DESIGN SYSTEM (brief 29 Oct 02:12 §7-10, docs/DESIGN_SYSTEM_SIGNAL_ROOM.md) ═══ */
:root{--ink-3:#8E9D98;--fs-xs:.75rem;--fs-s:.875rem;
  --layer-0:var(--bg);--layer-1:var(--raised);--layer-2:var(--raised-2);--layer-3:color-mix(in srgb,var(--raised-2),#fff 6%);
  --elevated:color-mix(in srgb,var(--raised-2),#fff 4%);--border-subtle:var(--line);--border:var(--line-2);--border-strong:var(--line-3);
  --text-1:var(--ink);--text-2:var(--ink-2);--text-3:var(--ink-3);--on-accent:var(--accent-ink);
  --success:var(--ok);--warning:var(--warn);--error:var(--bad);--info:var(--solid);--focus-ring:#F5DA92;
  --focus:0 0 0 2px var(--bg),0 0 0 4px var(--focus-ring);
  --shadow-sm:var(--e1);--shadow-md:var(--e2);--shadow-pop:0 1px 0 rgba(255,255,255,.06) inset,0 28px 64px -22px rgba(0,0,0,.85),0 0 0 1px rgba(0,0,0,.4);
  --radius-xs:8px;--radius-s:12px;--radius-ctl:14px;--radius-card:20px;--radius-hero:28px;--radius-full:999px;
  --sp-14:56px;--sp-16:64px;--sp-20:80px;
  --type-display:700 clamp(2.5rem,1.4rem + 4.6vw,4.75rem)/1 var(--display);
  --type-h1:700 clamp(2rem,1.45rem + 2.3vw,3.25rem)/1.06 var(--display);
  --type-h2:680 clamp(1.5rem,1.15rem + 1.5vw,2.25rem)/1.12 var(--display);
  --type-h3:650 1.25rem/1.25 var(--display);--type-section:650 1.1875rem/1.25 var(--display);--type-card:650 1.125rem/1.3 var(--display);
  --type-lede:400 clamp(1.0625rem,1rem + .35vw,1.25rem)/1.55 var(--font);--type-body:400 1rem/1.6 var(--font);
  --type-small:400 .875rem/1.5 var(--font);--type-meta:500 .8125rem/1.4 var(--font);--type-label:600 .8125rem/1.2 var(--font)}
html[data-theme=light]{--ink-3:#56625E;--warn:#805B05;--lean:#805B05;--bad:#B83232;--layer-3:#F3F5F0;--elevated:#FFFFFF;--focus-ring:#7E5A0B;
  --shadow-pop:0 1px 2px rgba(16,32,26,.06),0 24px 56px -20px rgba(16,32,26,.32),0 0 0 1px rgba(11,25,20,.06)}
.t-display{font:var(--type-display);letter-spacing:-.045em}.t-h1{font:var(--type-h1);letter-spacing:-.035em}.t-h2{font:var(--type-h2);letter-spacing:-.028em}
.t-h3{font:var(--type-h3);letter-spacing:-.018em}.t-section{font:var(--type-section);letter-spacing:-.02em}.t-card{font:var(--type-card);letter-spacing:-.015em}
.t-lede{font:var(--type-lede);color:var(--text-2)}.t-body{font:var(--type-body)}.t-small{font:var(--type-small)}.t-meta{font:var(--type-meta);color:var(--text-3)}.t-label{font:var(--type-label);color:var(--text-2)}
html{accent-color:var(--accent);scrollbar-color:var(--border-strong) transparent}
::selection{background:rgba(var(--gold-rgb),.3);color:var(--text-1)}
/* native controls: opaque, themed surfaces (a translucent select made Windows draw white text on a white list) */
select,select:focus{background-color:var(--layer-2);background-image:linear-gradient(45deg,transparent 50%,var(--text-2) 50%),linear-gradient(135deg,var(--text-2) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%;background-size:5px 5px;background-repeat:no-repeat;color:var(--text-1)}
select:focus{background-color:var(--layer-3)}
html[data-theme=light] select,html[data-theme=light] select:focus{background-color:#fff}
option,optgroup{background-color:var(--elevated);color:var(--text-1)}option:checked{background-color:var(--layer-3)}
input::-webkit-calendar-picker-indicator{opacity:.75;cursor:pointer}
input::placeholder,textarea::placeholder{color:var(--text-3);opacity:1}
.btn:focus-visible,.chip-btn:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:none;box-shadow:var(--focus)}
/* shell: 44 px targets, larger labels */
.topbar .brand-mark.pm-host{width:44px;height:44px;margin:-5px;padding:5px;border-radius:14px;box-shadow:none!important;overflow:visible}
.topbar .brand-mark .pmark{border-radius:10px;overflow:hidden;box-shadow:0 6px 18px -8px rgba(231,194,111,.45)}
.me{height:44px}.rail-link{height:44px}.pp-close{width:44px;height:44px}.rail-me{min-height:56px}
.nb-item{font-size:11.5px}.tb-title small{font-size:var(--fs-xs)}
/* premium primary CTA (§4): gold body, ink arrow chip, lift on hover, press on tap */
.btn.btn-cta{--h:52px;gap:14px;padding:0 8px 0 22px;border:0;border-radius:16px;font:650 1.0625rem/1 var(--display);letter-spacing:-.012em;color:#17120A;
  background:linear-gradient(180deg,#F9E4AA,#E9C66D 50%,#D7AA45);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(110,72,6,.26),0 0 0 1px rgba(150,104,18,.4),0 16px 36px -14px rgba(232,196,106,.55);
  transition:transform var(--t-fast) var(--ease),box-shadow var(--t-mid),filter var(--t-fast)}
.btn-cta .cta-ar{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#15100A;color:#F5DA92;box-shadow:inset 0 1px 0 rgba(255,255,255,.1);transition:transform var(--t-mid) var(--ease-out)}
.btn-cta .cta-ar .i{width:18px;height:18px;stroke-width:2}
.btn.btn-cta:hover{background:linear-gradient(180deg,#FBE9B6,#EDCB74 50%,#DBAF4B);filter:saturate(1.05);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -2px 0 rgba(110,72,6,.26),0 0 0 1px rgba(150,104,18,.45),0 22px 44px -16px rgba(232,196,106,.7)}
.btn-cta:hover .cta-ar{transform:translateX(3px)}
.btn.btn-cta:active{transform:translateY(1px) scale(.985);box-shadow:inset 0 2px 5px rgba(110,72,6,.38),0 0 0 1px rgba(150,104,18,.45),0 8px 18px -12px rgba(232,196,106,.5)}
.btn.btn-cta:focus-visible{box-shadow:var(--focus),0 16px 36px -14px rgba(232,196,106,.55)}
.btn.btn-cta-sm{--h:44px;gap:10px;padding:0 5px 0 15px;border-radius:13px;font-size:.9375rem}.btn-cta-sm .cta-ar{width:34px;height:34px;border-radius:9px}
.btn.btn-line{--h:52px;padding:0 20px;border-radius:16px;font:600 1rem/1 var(--display);background:transparent;border:1px solid var(--border-strong);color:var(--text-1)}
.btn.btn-line:hover{background:var(--layer-2);border-color:var(--text-3)}
@media (prefers-reduced-motion:reduce){.btn.btn-cta,.btn-cta .cta-ar{transition:none}.btn.btn-cta:hover{transform:none}.btn-cta:hover .cta-ar{transform:none}}
/* one selector component (§5-6): listbox over a real <select> (works without JS) */
.psel{position:relative;display:inline-flex;min-width:0;max-width:100%;vertical-align:middle}
.psel.is-ready>select,.psel.is-ready>.lang-pick{position:absolute!important;inset:0;width:1px;height:1px;opacity:0;pointer-events:none;overflow:hidden}
.psel-btn{display:inline-flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:0 12px;border-radius:var(--radius-ctl);border:1px solid var(--border);background:var(--layer-1);color:var(--text-1);font:600 var(--fs-m)/1.15 var(--font);text-align:left;transition:border-color var(--t-fast),background var(--t-fast)}
.psel-btn:hover,.psel-btn[aria-expanded=true]{border-color:var(--border-strong);background:var(--layer-2)}
.psel-btn[aria-expanded=true]{border-color:var(--accent-line)}
.psel-btn>.i{width:18px;height:18px;color:var(--text-2)}
.psel-v{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.psel-v>b{font-weight:inherit;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.psel-v small,.psel-o small{flex:none;color:var(--text-3);font:650 .75rem/1 var(--font);letter-spacing:.03em}
.psel-btn .psel-c{width:16px;height:16px;margin-left:auto;color:var(--text-3);transition:transform var(--t-mid) var(--ease)}
.psel-btn[aria-expanded=true] .psel-c{transform:rotate(180deg)}
.psel-pop{position:fixed;z-index:200;top:0;left:0;min-width:236px;max-width:min(360px,calc(100vw - 24px));max-height:min(60vh,440px);overflow-y:auto;overscroll-behavior:contain;padding:6px;border-radius:18px;background:var(--elevated);border:1px solid var(--border-strong);box-shadow:var(--shadow-pop);color:var(--text-1);transform-origin:50% 0}.psel-pop[data-y=up]{transform-origin:50% 100%}
.psel-pop:focus,.psel-pop:focus-visible{outline:none;box-shadow:var(--shadow-pop)}
.psel-o{display:flex;align-items:center;gap:12px;min-height:46px;padding:8px 10px 8px 12px;border-radius:12px;cursor:pointer;font-weight:550;white-space:nowrap;scroll-margin:6px;-webkit-tap-highlight-color:transparent}
.psel-o>span{min-width:0;overflow:hidden;text-overflow:ellipsis}.psel-o small{margin-left:auto}
.psel-o.is-act{background:var(--layer-3)}.psel-pop:focus-visible .psel-o.is-act{box-shadow:inset 0 0 0 2px var(--focus-ring)}
@media (hover:hover){.psel-o:hover{background:var(--layer-3)}}
.psel-o[aria-selected=true]{font-weight:700;background:var(--accent-soft)}
.psel-o .psel-k{width:18px;height:18px;flex:none;color:var(--accent-tx);visibility:hidden}.psel-o:not(:has(small)) .psel-k{margin-left:auto}
.psel-o[aria-selected=true] .psel-k{visibility:visible}
.psel-flag{width:22px;height:16px;flex:none;border-radius:4px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.14)}
html[data-theme=light] .psel-flag{box-shadow:0 0 0 1px rgba(11,25,20,.14)}
.psel-flag svg{width:100%;height:100%;display:block}
@media (prefers-reduced-motion:no-preference){.psel-pop{animation:psel-in .16s var(--ease-out) both}}
@keyframes psel-in{from{opacity:0;transform:scale(.97)}}
.psel-lang .psel-short{display:none}
@media (max-width:479px){.public-top .psel-long{display:none}.public-top .psel-short{display:inline}.public-top .psel-btn{gap:7px;padding:0 10px}}
.public-top .psel-btn{border-radius:var(--radius-full)}.psel-form .pm-update{display:none}.field .psel,.hub-r .psel{margin-top:0}.hub-r .psel{margin-left:auto;flex:none}
/* public header + atmosphere (first visit, §3) */
.public-top{gap:10px}.public-top>div{gap:8px}.public-top .psel{flex:none}@media (max-width:419px){.public-top:has(.btn-sm) .brand-name{display:none}}.pt-cta{display:none}
@media (min-width:600px){.pt-cta{display:inline-flex}}
html[data-public]:not([data-theme=light]){--glow-a:rgba(196,255,236,.12);--glow-b:rgba(232,196,106,.1)}
.plans-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;margin-top:var(--sp-10);padding:clamp(20px,3vw,32px);border-radius:var(--radius-hero);border:1px solid var(--accent-line);background:radial-gradient(90% 140% at 100% 0,rgba(var(--gold-rgb),.14),transparent 60%),var(--layer-1)}
.plans-band h2{font:var(--type-h2);letter-spacing:-.03em}.plans-band p{margin-top:6px;color:var(--text-2);max-width:52ch}
.faq{padding:var(--sp-2) 0}.faq summary{min-height:48px}.faq p{font-size:.9375rem;margin:4px 0 8px}
.editorial>*,.specimen-tri>*{min-width:0}.specimen-tri span,.triad .t-l{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:anywhere}@media (max-width:360px){.nb-item{font-size:11px;letter-spacing:-.01em}.nb-item span{padding:0}}
.avatar .av-anon{width:56%;height:56%;stroke-width:1.9}
.av-ini{line-height:1}.av-ini-2{font-size:.8em;letter-spacing:-.02em;transform:translate(-1px,-1px)}
.rail-me .av-ini-2,.top-avatar .av-ini-2{font-size:.68em}