/* BetVault UI. Tokens live in tokens.css (loaded first). */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:var(--fs-md);line-height:1.55;color:var(--text);background:var(--bg);
  font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;min-height:100vh;
  background-image:var(--body-glow);background-attachment:fixed}
img,svg{max-width:100%}
a{color:var(--purple-300);text-decoration:none;transition:color var(--t) var(--ease)}
a:hover{color:var(--link-hover)}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:6px}
h1,h2,h3{line-height:1.2;letter-spacing:-.02em;margin:0 0 var(--s4)}
h1{font-size:var(--fs-2xl);font-weight:700}
h2{font-size:var(--fs-lg);font-weight:600;margin-top:var(--s7);color:var(--text)}
h2 a{font-size:var(--fs-sm);font-weight:500;margin-left:var(--s2)}
p{margin:0 0 var(--s4)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--s4);top:-60px;z-index:100;background:var(--purple);color:#fff;padding:var(--s2) var(--s4);border-radius:var(--r-sm)}
.skip:focus{top:var(--s3)}

/* ---------- top nav (sticky, blurred) ---------- */
.topnav{position:sticky;top:0;z-index:50;height:var(--nav-h);display:flex;align-items:center;gap:var(--s5);
  padding:0 var(--s5);background:var(--nav-bg);backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid var(--border)}
.brand{display:flex;align-items:center;gap:var(--s2);color:var(--text);font-weight:700;letter-spacing:-.01em}
/* logo: the original PNG, sized by height only. Never an outline, shadow, filter or pill.
   The artwork fills rows 85-167 of the 250px file (34% transparent above, 33% below), so the rendered
   height is ~3x the letters and negative top/bottom margins of 34%/33% of that height cancel the empty
   rows: the header bar keeps its height while the letters are twice the old size. */
.logo{display:block;height:64px;width:auto;margin:-22px 0 -21px}
.brand{line-height:0;flex-shrink:0}
.auth-brand{display:flex;justify-content:center;margin:0 0 var(--s5)}
.auth-brand .logo{height:auto;width:min(352px,100%);max-width:100%;margin:calc(min(352px,100%) * -.085) 0 calc(min(352px,100%) * -.0825)}
/* <=420px: ~52px, shrinking with the viewport on very narrow phones so the nav never overlaps (width = 4 x height) */
@media (max-width:420px){.topnav .logo{--logo-h:clamp(40px,calc((100vw - 160px) / 4),52px);height:var(--logo-h);
  margin:calc(var(--logo-h) * -.34) 0 calc(var(--logo-h) * -.33)}}
.topnav .links{display:flex;gap:var(--s5);margin-left:auto;align-items:center}
/* <=420px: tighter nav so the larger logo, menu button and toggle all fit at 375px; the trial chip moves to the sidebar plan chip */
@media (max-width:420px){.topnav{gap:var(--s3);padding:0 var(--s3)}.topnav .links{gap:var(--s3)}.topnav .links a{white-space:nowrap}
  .topnav .links .hide-xs,.topnav .trial-chip{display:none}.menu-btn{flex-shrink:0}}
.topnav .links a{color:var(--text-2);font-size:var(--fs-sm);font-weight:500}
.topnav .links a:hover{color:var(--text)}
.topnav .links a.btn{color:#fff}
.menu-btn{display:none}

/* ---------- app shell (logged in) ---------- */
.shell{display:grid;grid-template-columns:var(--side-w) 1fr;min-height:calc(100vh - var(--nav-h))}
.sidebar{position:sticky;top:var(--nav-h);height:calc(100vh - var(--nav-h));overflow-y:auto;padding:var(--s5) var(--s4);
  border-right:1px solid var(--border);background:linear-gradient(180deg,var(--side-bg),transparent)}
.sidebar .group{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:var(--s5) var(--s3) var(--s2)}
.sidebar .group:first-child{margin-top:0}
.sidebar a{display:flex;align-items:center;gap:var(--s3);padding:var(--s2) var(--s3);border-radius:var(--r-sm);color:var(--text-2);
  font-size:var(--fs-sm);font-weight:500;transition:background var(--t),color var(--t)}
.sidebar a:hover{background:var(--surface-2);color:var(--text)}
.sidebar a[aria-current="page"]{background:linear-gradient(90deg,rgba(140,82,255,.22),rgba(140,82,255,.06));color:var(--active-text);
  box-shadow:inset 2px 0 0 var(--purple)}
.sidebar .ico{width:18px;text-align:center;opacity:.85}
.sidebar form{margin-top:var(--s5);padding:0 var(--s3)}
.plan-chip{margin:var(--s5) var(--s3) 0;padding:var(--s3);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);font-size:var(--fs-sm);color:var(--text-2)}
.plan-chip b{color:var(--lime-text)}
main.content{padding:var(--s6) var(--s6) var(--s8);max-width:calc(var(--maxw) + 2*var(--s6));width:100%;min-width:0}
main.page{padding:var(--s6) var(--s5) var(--s8);max-width:var(--maxw);margin:0 auto}
#nav-toggle{position:absolute;opacity:0;pointer-events:none}

@media (max-width:900px){
  .shell{grid-template-columns:1fr}
  .menu-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--r-sm);
    border:1px solid var(--border);color:var(--text);cursor:pointer;margin-left:auto;font-size:18px}
  #nav-toggle:focus-visible + .topnav .menu-btn{box-shadow:var(--ring)}
  .sidebar{position:fixed;left:0;top:var(--nav-h);width:min(84vw,300px);z-index:40;background:var(--bg-2);
    transform:translateX(-100%);transition:transform 220ms var(--ease);box-shadow:24px 0 48px var(--drop)}
  #nav-toggle:checked ~ .shell .sidebar{transform:none}
  main.content{padding:var(--s5) var(--s4) var(--s8)}
  .topnav .links{gap:var(--s4)}
  .topnav .links .hide-sm{display:none}
}

/* ---------- surfaces ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:var(--s4);margin:var(--s4) 0 var(--s5)}
.card,.plan,.panel{position:relative;background:var(--card-bg);
  border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s4) var(--s5);box-shadow:var(--shadow);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.card{color:var(--muted);font-size:var(--fs-sm);font-weight:500}
.card b{display:block;margin-top:var(--s1);color:var(--text);font-size:var(--fs-xl);font-weight:650;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums}
.card::before{content:"";position:absolute;inset:0 0 auto;height:1px;border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:linear-gradient(90deg,transparent,rgba(162,123,255,.5),transparent)}
.pos{color:var(--pos)!important}.neg{color:var(--neg)!important}
.note,.upsell,.warn,.error{border-radius:var(--r-md);padding:var(--s3) var(--s4);margin:var(--s4) 0;font-size:var(--fs-sm);border:1px solid}
.note{background:rgba(143,184,255,.07);border-color:rgba(143,184,255,.2);color:var(--text-2)}
.upsell{background:linear-gradient(135deg,rgba(140,82,255,.16),rgba(193,255,114,.05));border-color:rgba(140,82,255,.4);color:var(--text)}
.upsell a{color:var(--lime-text)}
.warn,.error{background:rgba(255,107,129,.08);border-color:rgba(255,107,129,.35);color:var(--warn-text)}
.locked{color:var(--muted);font-style:normal;filter:blur(3px);user-select:none}

/* ---------- tables ---------- */
.table-wrap,table{margin:var(--s4) 0 var(--s5)}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--fs-sm);font-variant-numeric:tabular-nums;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;display:block;overflow-x:auto}
table tbody,table tr{width:100%}
th{position:sticky;top:0;text-align:left;font-weight:500;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);background:var(--th-bg);padding:var(--s3) var(--s4);border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:var(--s3) var(--s4);border-bottom:1px solid var(--row-line);color:var(--text-2);white-space:nowrap}
tr:last-child td{border-bottom:0}
tr:hover td{background:var(--row-hover);color:var(--text)}
tr.edge td{color:var(--text)}tr.edge td:first-child{box-shadow:inset 2px 0 0 var(--lime)}
.edge{font-weight:600}
tr.stale td{background:rgba(255,194,102,.06)}
.drift-up{color:var(--pos);background:rgba(193,255,114,.07)}.drift-down{color:var(--neg);background:rgba(255,107,129,.07)}
.status-live{color:var(--lime-text);font-weight:600}.status-live::before{content:"● "}
.status-ft{color:var(--muted)}.status-upcoming{color:var(--info)}.status-postponed{color:var(--warn)}
@keyframes pulse{50%{opacity:.3}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- forms & buttons ---------- */
button,.btn,a.button,.cta{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);font:inherit;font-size:var(--fs-sm);
  font-weight:600;line-height:1;padding:var(--s3) var(--s4);border-radius:var(--r-sm);border:1px solid transparent;cursor:pointer;
  color:#fff;background:linear-gradient(180deg,#9A66FF,var(--purple));box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 6px 20px rgba(140,82,255,.35);
  transition:transform var(--t) var(--ease),box-shadow var(--t),filter var(--t);text-decoration:none}
button:hover,.btn:hover,a.button:hover,.cta:hover{filter:brightness(1.08);color:#fff;transform:translateY(-1px)}
button:active{transform:none}
button.secondary,.btn.secondary{background:var(--surface-2);border-color:var(--border-strong);box-shadow:none;color:var(--text)}
button.linkish{background:none;border:0;box-shadow:none;padding:0;color:var(--text-2);font-weight:500}
button.linkish:hover{color:var(--text);transform:none}
a.button{margin-left:var(--s2);padding:var(--s2) var(--s3)}
button.bell{background:var(--surface-2);box-shadow:none;border-color:var(--border);padding:var(--s2) var(--s3)}
button.bell[aria-pressed="true"]{border-color:rgba(193,255,114,.5);background:rgba(193,255,114,.1)}
input,select,textarea{font:inherit;font-size:var(--fs-sm);color:var(--text);background:var(--input-bg);border:1px solid var(--border-strong);
  border-radius:var(--r-sm);padding:var(--s2) var(--s3);min-height:40px;transition:border-color var(--t),box-shadow var(--t)}
input:hover,select:hover,textarea:hover{border-color:var(--input-hover)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--purple-400);box-shadow:0 0 0 3px rgba(140,82,255,.3)}
input[type=checkbox]{min-height:0;width:16px;height:16px;accent-color:var(--purple);vertical-align:-3px;margin-right:var(--s2)}
select[multiple]{min-height:140px}
label{color:var(--text-2);font-size:var(--fs-sm);font-weight:500}
form.inline{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:flex-end;margin:var(--s4) 0}
form.inline label{display:flex;flex-direction:column;gap:var(--s1)}
form p{margin:var(--s3) 0}

/* ---------- auth ---------- */
.auth-wrap{min-height:calc(100vh - var(--nav-h) - 120px);display:grid;place-items:center;padding:var(--s6) var(--s4)}
.auth{width:100%;max-width:420px;background:var(--auth-bg);border:1px solid var(--border);
  border-radius:var(--r-xl);padding:var(--s6);box-shadow:var(--glow)}
.auth h1{font-size:var(--fs-xl);text-align:center}
.auth label{display:block;margin:var(--s4) 0}
.auth label input:not([type=checkbox]){display:block;width:100%;margin-top:var(--s2)}
.auth button{width:100%;margin-top:var(--s3);padding:var(--s4)}
.auth p{text-align:center;color:var(--muted);font-size:var(--fs-sm);margin-top:var(--s4)}
.page .auth{margin:0 auto}
.page > .auth{max-width:520px}

/* ---------- pricing ---------- */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,340px));gap:var(--s5);justify-content:center;margin-top:var(--s6)}
.plan{padding:var(--s6)}
.plan h2{margin:0 0 var(--s2);font-size:var(--fs-lg)}
.plan:last-child{border-color:rgba(140,82,255,.5);box-shadow:var(--glow)}
.plan:last-child::after{content:"Most popular";position:absolute;top:-12px;right:var(--s5);font-size:var(--fs-xs);font-weight:600;
  padding:var(--s1) var(--s3);border-radius:var(--r-pill);background:var(--lime);color:#0B0B10}
.price{font-size:2.5rem;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin-bottom:var(--s4)}
.plan ul{list-style:none;padding:0;margin:0 0 var(--s5);color:var(--text-2);font-size:var(--fs-sm)}
.plan li{padding:var(--s2) 0;border-bottom:1px solid var(--border)}
.plan li::before{content:"✓";color:var(--lime-text);margin-right:var(--s3);font-weight:700}
.plan button,.plan .cta{width:100%}

/* ---------- landing ---------- */
.hero{max-width:1080px;margin:0 auto;padding:var(--s9) var(--s5) var(--s7);text-align:center}
.eyebrow{display:inline-flex;gap:var(--s2);align-items:center;font-size:var(--fs-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--lime-text);padding:var(--s1) var(--s3);border:1px solid var(--eyebrow-line);border-radius:var(--r-pill);background:var(--eyebrow-bg);margin-bottom:var(--s5)}
.hero h1{font-size:var(--fs-hero);font-weight:750;letter-spacing:-.045em;line-height:1.02;margin:0 auto var(--s5);max-width:14ch;
  background:var(--hero-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero h1 em{font-style:normal;background:var(--hero-em);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.sub{font-size:clamp(1.05rem,2vw,1.25rem);color:var(--text-2);max-width:620px;margin:0 auto var(--s6)}
.cta{font-size:var(--fs-md);padding:var(--s4) var(--s6);border-radius:var(--r-md)}
.hero .fine{font-size:var(--fs-sm);color:var(--muted);margin-top:var(--s4)}
.mockup{position:relative;margin:var(--s8) auto 0;max-width:1080px;border-radius:var(--r-lg);border:1px solid var(--border-strong);
  background:var(--surface-solid);box-shadow:var(--mock-shadow);overflow:hidden}
.mockup::before{content:"";position:absolute;inset:-40% -10% auto;height:80%;z-index:-1;background:radial-gradient(closest-side,rgba(140,82,255,.45),transparent);filter:blur(40px)}
.mockup .bar{display:flex;align-items:center;gap:var(--s2);height:40px;padding:0 var(--s4);border-bottom:1px solid var(--border);background:var(--th-bg)}
.mockup .bar i{width:11px;height:11px;border-radius:50%;background:#3A3A46}
.mockup .bar i:nth-child(1){background:#FF5F57}.mockup .bar i:nth-child(2){background:#FEBC2E}.mockup .bar i:nth-child(3){background:#28C840}
.mockup .bar span{margin:0 auto;font-size:var(--fs-xs);color:var(--muted);padding:var(--s1) var(--s6);border-radius:var(--r-sm);background:var(--input-bg)}
.mockup img{display:block;width:100%;height:auto}
.byline{color:var(--muted);font-size:var(--fs-md);margin-top:var(--s7)}
footer.site{border-top:1px solid var(--border);margin-top:var(--s8);padding:var(--s6) var(--s5);display:flex;gap:var(--s5);flex-wrap:wrap;
  align-items:center;justify-content:space-between;color:var(--muted);font-size:var(--fs-sm);max-width:var(--maxw);margin-left:auto;margin-right:auto}
footer.site nav{display:flex;gap:var(--s5)}footer.site a{color:var(--muted)}footer.site a:hover{color:var(--text)}

/* ---------- charts ---------- */
.chart{display:block;width:100%;height:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s3);margin:var(--s3) 0 var(--s5)}
.chart .grid line{stroke:var(--grid)}
.chart stop.c-end,.chart .c-end{stop-color:var(--chart-end)}
.chart circle.marker.win{fill:var(--pos)}.chart circle.marker.loss{fill:var(--neg)}
.spark polyline{stroke:var(--purple)}
.chart circle.marker{stroke:var(--bg);stroke-width:2}
.chart circle.marker:hover{r:7}
.spark{vertical-align:middle}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s5)}

/* ---------- install toast ---------- */
#install-banner{position:fixed;z-index:60;right:var(--s5);bottom:var(--s5);max-width:min(380px,calc(100vw - 2*var(--s4)));
  display:flex;gap:var(--s3);align-items:center;padding:var(--s3) var(--s3) var(--s3) var(--s4);border-radius:var(--r-lg);
  background:var(--toast-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-strong);
  box-shadow:var(--glow);font-size:var(--fs-sm);animation:toast-in 280ms var(--ease)}
#install-banner span{flex:1;color:var(--text)}
#install-banner button{padding:var(--s2) var(--s3)}
#install-banner[hidden]{display:none}
@keyframes toast-in{from{opacity:0;transform:translateY(12px)}}
@media (max-width:600px){#install-banner{left:var(--s4);right:var(--s4);bottom:var(--s4)}}

/* small helpers */
.muted{color:var(--muted)}.small{font-size:var(--fs-sm)}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;margin-bottom:var(--s5)}
.page-head h1{margin:0}

/* ---------- theme toggle (sun/moon) + welcome ---------- */
.theme-toggle{width:38px;height:38px;padding:0;border-radius:var(--r-pill);background:var(--surface-2);border:1px solid var(--border);
  box-shadow:none;color:var(--text);font-size:17px}
.theme-toggle:hover{transform:none;color:var(--text);border-color:var(--border-strong)}
.theme-toggle .moon{display:none}
[data-theme="dark"] .theme-toggle .sun{display:none}[data-theme="dark"] .theme-toggle .moon{display:inline}
.topnav .links .theme-toggle{margin-left:var(--s1)}
.welcome{margin-bottom:var(--s5)}.welcome h1{margin:0 0 var(--s1)}.welcome p{color:var(--muted);margin:0}
/* ---------- landing v2: pure black (dark) / clean white (light), purple + lime accents ---------- */
body.landing{--l-bg:#FFFFFF;background:var(--l-bg);background-image:none}
[data-theme=dark] body.landing{--l-bg:#000000}
body.landing .topnav{background:color-mix(in srgb,var(--l-bg) 86%,transparent)}
.hero-v2{padding:var(--s8) var(--s5) var(--s5)}
.hero-v2 h1{max-width:15ch}
.hero-v2 .cta{display:inline-block}
.hero-login{margin-top:var(--s4);font-size:var(--fs-sm);color:var(--muted)}
body.landing .mockup{max-width:1080px;margin:var(--s6) var(--s4) 0}
@media (min-width:1112px){body.landing .mockup{margin:var(--s6) auto 0}}
[data-theme=dark] body.landing .mockup{background:#0A0A0F;border-color:rgba(140,82,255,.35)}
.proof{max-width:1080px;margin:var(--s8) auto 0;padding:0 var(--s4);display:grid;gap:var(--s4);grid-template-columns:1fr}
@media (min-width:760px){.proof{grid-template-columns:repeat(3,1fr)}}
.proof-item{padding:var(--s5);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-solid,var(--surface))}
[data-theme=dark] body.landing .proof-item{background:#08080B}
.proof-item h2{font-size:var(--fs-md);margin:var(--s3) 0 var(--s1);letter-spacing:-.01em}
.proof-item p{margin:0;color:var(--text-2);font-size:var(--fs-sm)}
.pi-ico{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:var(--r-sm);background:rgba(140,82,255,.14);color:var(--purple-400);font-weight:700}
.proof-item:nth-child(3) .pi-ico{background:rgba(182,255,74,.14);color:var(--lime-text)}
.odds-chip{display:inline-flex;align-items:baseline;gap:3px;padding:0 var(--s2);border-radius:var(--r-pill);font-weight:700;
  font-variant-numeric:tabular-nums;color:var(--text);background:var(--surface-2);border:1px solid var(--border)}
.odds-chip small{font-weight:500;color:var(--muted);font-size:.85em}
body.landing .byline{text-align:center;font-size:var(--fs-sm);margin:var(--s6) auto 0}
footer.site .foot-line{flex-basis:100%;margin:0;font-size:var(--fs-xs);color:var(--muted)}
footer.site .rg b{color:var(--text)}
/* Landing (/) is always pure black, whatever the theme: base.html sets data-theme=dark + html.lp
   server-side, and html/body/header are #000 from the first paint (no white flash). No logo pill here. */
html.lp,html.lp body,html.lp body.landing{--l-bg:#000;background:#000;background-image:none;color-scheme:dark}
html.lp{--text:#F5F5F7;--text-2:#C9C9D6;--muted:#9A9AAE;
  --hero-grad:linear-gradient(180deg,#FFFFFF 30%,#E9E6F5);--hero-em:linear-gradient(90deg,#8C52FF,#B48CFF)}

html.lp .topnav{background:#000;border-bottom-color:rgba(255,255,255,.07)}
html.lp .mockup{background:#000;border-color:rgba(140,82,255,.35);box-shadow:0 0 0 1px rgba(140,82,255,.12),0 30px 90px -30px rgba(140,82,255,.45)}
html.lp .mockup .bar{background:#0B0B10}
html.lp .proof-item{background:#07070A;border-color:rgba(255,255,255,.08)}
html.lp .odds-chip{color:#B6FF4A;background:rgba(182,255,74,.08);border-color:rgba(182,255,74,.28)}
html.lp .odds-chip small{color:#D9FFA6}
html.lp .pi-ico{color:#B48CFF}
html.lp .proof-item:nth-child(3) .pi-ico{color:#B6FF4A;background:rgba(182,255,74,.12)}
html.lp .hero-login a,html.lp footer.site a:hover{color:#B6FF4A}

/* landing mockup: one screenshot per theme */
.mockup img.shot-dark{display:none}
[data-theme="dark"] .mockup img.shot-dark{display:block}[data-theme="dark"] .mockup img.shot-light{display:none}

/* ---------- pro analytics: KPI cards, panels, chips (batch 3) ---------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--s4);margin:var(--s4) 0 var(--s5)}
.kpi{position:relative;overflow:hidden;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:var(--s4) var(--s5) var(--s5);box-shadow:var(--shadow);min-height:132px}
.kpi::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--purple),var(--lime))}
.kpi-label{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}
.kpi b{display:block;font-size:1.65rem;font-weight:700;letter-spacing:-.03em;margin:var(--s1) 0;font-variant-numeric:tabular-nums;color:var(--text)}
.delta{display:inline-flex;gap:4px;align-items:center;font-size:var(--fs-xs);font-weight:600;padding:2px 8px;border-radius:var(--r-pill)}
.delta i{font-style:normal;font-weight:500;color:var(--muted)}
.delta.up{color:var(--pos);background:var(--green-soft)}.delta.down{color:var(--neg);background:rgba(255,107,129,.10)}
.delta.flat{color:var(--muted);padding-left:0}
.kpi-spark{position:absolute;right:var(--s4);bottom:var(--s3);width:96px;height:28px;opacity:.9}
.kpi-spark polyline{fill:none;stroke:var(--chart-end);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s4);margin:var(--s4) 0}
.panel h3{font-size:var(--fs-sm);font-weight:650;margin:0 0 var(--s3);display:flex;justify-content:space-between;align-items:center}
.panel.tight{padding:var(--s4)}.panel.tight table{margin:0;border:0;background:none}
.big{font-size:2rem;font-weight:750;letter-spacing:-.03em;margin:0 0 var(--s2)}
.form-dots{display:flex;gap:4px;margin-bottom:var(--s3)}
.dot{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font-size:11px;font-weight:700}
.dot.w{background:var(--lime);color:#14200A}.dot.l{background:rgba(255,107,129,.16);color:var(--neg)}
.evbars{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2);margin:var(--s3) 0}
.evbars div{background:var(--surface-2);border-radius:var(--r-sm);padding:var(--s2) var(--s3)}
.evbars span{display:block;font-size:var(--fs-xs);color:var(--muted)}.evbars b{font-variant-numeric:tabular-nums}
.vb-mini{display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s2) 0;border-bottom:1px solid var(--row-line)}
.vb-mini:last-child{border-bottom:0}.vb-mini .r{display:flex;gap:var(--s2);align-items:center}
.sub{display:block;font-size:var(--fs-xs);color:var(--muted);font-weight:400}
.price-pill{display:inline-block;font-weight:700;font-variant-numeric:tabular-nums;padding:2px 10px;border-radius:var(--r-pill);
  background:var(--purple-900);color:var(--purple-300);border:1px solid rgba(140,82,255,.25)}
.badge-edge{font-size:var(--fs-xs);font-weight:700;padding:3px 8px;border-radius:var(--r-pill);background:var(--lime);color:#14200A}
.clv-chip{font-size:var(--fs-xs);font-weight:700;padding:2px 8px;border-radius:var(--r-pill)}
.clv-chip.up{background:var(--green-soft);color:var(--pos)}.clv-chip.down{background:rgba(255,107,129,.10);color:var(--neg)}
.res{font-size:var(--fs-xs);font-weight:600;padding:2px 8px;border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-2);text-transform:capitalize}
.res-won{background:var(--green-soft);color:var(--pos)}.res-lost{background:rgba(255,107,129,.10);color:var(--neg)}
.empty{display:flex;flex-direction:column;align-items:center;gap:var(--s3);text-align:center;padding:var(--s7) var(--s5)}
.empty span{color:var(--muted);max-width:52ch;font-size:var(--fs-sm)}
/* value bets */
.chips{display:flex;gap:var(--s2);flex-wrap:wrap;margin:var(--s3) 0}
.chip{font-size:var(--fs-sm);padding:6px 12px;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--surface);color:var(--text-2)}
.chip b{color:var(--text)}.chip b.pos{color:var(--pos)}
.filters{display:flex;flex-wrap:wrap;gap:var(--s4) var(--s6);align-items:center;margin:var(--s4) 0;padding:var(--s4) var(--s5)}
.fgroup{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center}
.flabel{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600;margin-right:var(--s1)}
.flabel select{margin-left:var(--s2);text-transform:none;letter-spacing:0}
.chip-check{position:relative;cursor:pointer}
.chip-check input{position:absolute;opacity:0;pointer-events:none}
.chip-check span{display:inline-block;font-size:var(--fs-sm);padding:6px 12px;border-radius:var(--r-pill);border:1px solid var(--border-strong);color:var(--text-2);transition:all var(--t)}
.chip-check input:checked + span{background:var(--purple);border-color:var(--purple);color:#fff}
.chip-check input:focus-visible + span{box-shadow:var(--ring)}
input[type=range]{min-height:0;padding:0;border:0;background:none;accent-color:var(--purple);width:160px}
output{color:var(--text);font-weight:700}
.pro-table td{vertical-align:middle}
.edgebar{display:flex;flex-direction:column;gap:4px;min-width:96px}
.edgebar i{display:block;height:6px;border-radius:3px;width:var(--w);background:linear-gradient(90deg,var(--lime-600),var(--lime))}
.move{white-space:nowrap}.move .spark polyline{stroke:var(--purple-400)}
.btn.sm{padding:6px 10px;font-size:var(--fs-xs)}
tr.teaser td{color:var(--muted)}
.locked-cta{display:flex;gap:var(--s4);align-items:center;justify-content:space-between;flex-wrap:wrap;padding:var(--s4) var(--s5);
  border-radius:var(--r-lg);border:1px solid rgba(140,82,255,.35);background:linear-gradient(135deg,rgba(140,82,255,.12),rgba(193,255,114,.10))}
/* green accents: active nav + success */
.sidebar a[aria-current="page"] .ico{color:var(--lime-text);opacity:1}
.ok,.success{color:var(--pos)}
/* layout fixes: spark top-right, no wrapping badges, compact breakdown tables */
.kpi-spark{top:var(--s4);bottom:auto;width:72px;height:24px}
.badge-edge,.price-pill,.clv-chip,.delta{white-space:nowrap}
table.mini{display:table;width:100%;font-size:var(--fs-xs)}
table.mini th,table.mini td{padding:var(--s2) var(--s2)}

/* ---------- team kit badges (teams.py) ---------- */
.kit{display:inline-block;flex:none;width:14px;height:14px;border-radius:50%;vertical-align:-2px;
  background:linear-gradient(135deg,var(--c1) 50%,var(--c2) 50%);box-shadow:0 0 0 1px var(--border-strong)}
.team{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.vs{color:var(--muted);font-size:var(--fs-xs);font-weight:500;margin:0 4px}
td.wrap,td.wrap .team{white-space:normal}
.teams2{display:flex;flex-direction:column;gap:2px}

/* ---------- segmented List/Calendar toggle ---------- */
.seg{display:inline-flex;padding:3px;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--surface-solid,var(--surface))}
.seg a{padding:6px 14px;border-radius:var(--r-pill);font-size:var(--fs-sm);color:var(--text-2);font-weight:500}
.seg a[aria-current="page"]{background:var(--purple);color:#fff}

/* ---------- fixtures: one card per match, responsive grid (no horizontal scroll) ---------- */
.fx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:var(--s4);margin:var(--s4) 0}
.fx-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s4);box-shadow:var(--shadow);min-width:0}
.fx-card header{display:flex;justify-content:space-between;gap:var(--s2);font-size:var(--fs-xs);color:var(--muted);margin-bottom:var(--s2)}
.fx-time{font-weight:600;color:var(--text-2)}.fx-time abbr{text-decoration:none;color:var(--lime-text)}
.fx-league{padding:1px 8px;border-radius:var(--r-pill);background:var(--surface-2)}
.fx-teams{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:var(--fs-md);margin:0 0 var(--s3)}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}
.tile{display:flex;flex-direction:column;gap:2px;min-width:0;padding:var(--s2) var(--s3);border-radius:var(--r-md);
  border:1px solid var(--border);background:var(--surface-2);color:var(--text);transition:border-color var(--t),transform var(--t)}
.tile:hover{border-color:var(--purple-400);color:var(--text);transform:translateY(-1px)}
.tile-k{font-size:var(--fs-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.tile b{font-size:1.15rem;font-variant-numeric:tabular-nums}
.tile-m{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile-move{display:flex;flex-direction:column;gap:2px;font-size:11px;font-weight:600}
.tile .spark{width:100%;height:20px}.tile .spark polyline{stroke:var(--purple-400)}
.tile.drift-up{border-color:var(--lime-600)}.tile.drift-down{border-color:rgba(255,107,129,.5)}

/* ---------- calendar ---------- */
.cal-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s3)}
.cal-nav{display:flex;align-items:center;gap:var(--s2)}.cal-nav h2{margin:0 var(--s2);min-width:9ch}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;background:var(--surface);margin:var(--s4) 0}
.cal-h{padding:var(--s2);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--th-bg);border-bottom:1px solid var(--border)}
.cal-d{min-height:112px;padding:6px;border-right:1px solid var(--row-line);border-bottom:1px solid var(--row-line);display:flex;flex-direction:column;gap:3px;min-width:0}
.cal-d:nth-child(7n+7){border-right:0}
.cal-d.out{opacity:.45}
.cal-n{font-size:var(--fs-xs);font-weight:700;color:var(--text-2);width:24px;height:24px;display:grid;place-items:center;border-radius:50%}
.cal-d.today .cal-n{background:var(--lime);color:#14200A}
.cal-f{display:flex;align-items:center;gap:3px;font-size:11px;color:var(--text);padding:2px 4px;border-radius:6px;background:var(--surface-2);min-width:0}
.cal-f:hover{background:var(--purple-900);color:var(--text)}
.cal-f time{color:var(--muted);font-variant-numeric:tabular-nums;margin-right:2px}
.cal-f .kit{width:10px;height:10px}
.cal-f .cal-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left:2px}
.cal-more{font-size:11px;font-weight:600;color:var(--purple-300)}
.agenda{display:none}
.agenda section{margin-bottom:var(--s4)}.agenda h3{font-size:var(--fs-sm);margin:0 0 var(--s2)}
.ag-f{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:var(--s3);border:1px solid var(--border);border-radius:var(--r-md);background:var(--card-bg);margin-bottom:var(--s2);color:var(--text)}
.ag-f time{font-weight:700;margin-right:var(--s2);font-variant-numeric:tabular-nums}.ag-f .sub{width:100%}
@media (max-width:760px){.cal{display:none}.agenda{display:block}}

/* ---------- responsive tables (.rtable): stack rows into cards when narrow ---------- */
.rtable td{white-space:nowrap}
@media (max-width:1280px){
  .pro-table th,.pro-table td{padding:var(--s2) var(--s3)}
  .pro-table td[data-label="Fair odds"],.pro-table th:nth-child(5){display:none}
}
@media (max-width:1180px){
  table.rtable{display:block;border:0;background:none}
  .rtable tbody{display:grid;gap:var(--s3)}
  .rtable tr:first-child{display:none}
  .rtable tr{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:var(--s2) var(--s4);
    padding:var(--s4);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--card-bg);box-shadow:var(--shadow)}
  .rtable td{display:block;padding:0;border:0;white-space:normal;min-width:0}
  .rtable td[data-label]::before{content:attr(data-label);display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:2px}
  .rtable td[data-label=""]::before,.rtable td[data-label="Match"]::before{display:none}
  .rtable td[data-label="Match"]{grid-column:1/-1}
  .pro-table td[data-label="Fair odds"]{display:block}
  tr.edge td:first-child{box-shadow:none}.rtable tr.edge{border-left:3px solid var(--lime)}
  .rtable tr:hover td{background:none}
}
/* calendar entries: time + kit dots on one line, short names below (fits 1024px cells) */
.cal-f{flex-wrap:wrap;row-gap:0}.cal-f .cal-name{flex-basis:100%;margin-left:0}

.theme-form{display:inline-flex;margin:0}

/* ---------- all-sports fixtures ---------- */
.sport-chips{margin:var(--s2) 0}
.sport-chips a.chip{color:var(--text-2)}.sport-chips a.chip:hover{border-color:var(--purple-400);color:var(--text)}
.sport-chips a.chip.on{background:var(--purple);border-color:var(--purple);color:#fff}
/* Fixtures without odds: one muted line instead of an empty tile box */
.fx-note{margin:0;font-size:var(--fs-xs);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-note::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--border-strong);margin-right:6px;vertical-align:1px}
/* Compact grey card: no odds and no model view */
.fx-card.plain{background:var(--surface-2);box-shadow:none;padding:var(--s3)}
.fx-card.plain header{margin-bottom:4px;align-items:center}
.fx-card.plain .fx-time{white-space:nowrap}
.fx-card.plain .fx-league{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-card.plain .fx-teams{font-size:var(--fs-sm);margin-bottom:4px}
.fx-card.plain .fx-league{background:var(--card-bg)}
.fx-grid.compact{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:var(--s3);margin-top:var(--s2)}
/* "More fixtures" divider between featured and plain cards */
.fx-divider{display:flex;align-items:center;gap:var(--s3);margin:var(--s5) 0 0;color:var(--text-2);font-size:var(--fs-sm);font-weight:600}
.fx-divider small{font-weight:400;color:var(--muted)}
.fx-divider::before,.fx-divider::after{content:"";flex:1;border-top:1px solid var(--border)}
.fx-divider::before{flex:0 0 var(--s4)}
.cal-odds{color:var(--lime-text);font-size:10px;font-weight:700;margin-left:2px}

/* ---------- model favourite badge ---------- */
.fav{display:flex;flex-direction:column;gap:6px;margin:0 0 var(--s3)}
.fav-badge{align-self:flex-start;font-size:var(--fs-xs);font-weight:700;padding:3px 10px;border-radius:var(--r-pill);
  background:var(--green-soft);color:var(--lime-text);border:1px solid var(--eyebrow-line)}
.fav-badge.close{background:var(--surface-2);color:var(--muted);border-color:var(--border)}
.hda{display:flex;height:16px;border-radius:5px;overflow:hidden;font-size:10px;font-weight:700;line-height:16px}
.hda i{font-style:normal;text-align:center;min-width:18px;color:#fff}
.hda .h{background:var(--purple)}.hda .d{background:var(--muted)}.hda .a{background:var(--lime-600);color:#14200A}
.form-rows{display:flex;flex-wrap:wrap;gap:var(--s3)}
.form-row{display:inline-flex;align-items:center;gap:2px;font-size:11px}
.fr-n{color:var(--muted);margin-right:4px}
.fr{width:16px;height:16px;border-radius:4px;display:grid;place-items:center;font-size:10px}
.fr.w{background:var(--lime);color:#14200A}.fr.d{background:var(--surface-2);color:var(--text-2)}.fr.l{background:rgba(255,107,129,.18);color:var(--neg)}
.cal-fav{color:var(--lime-text);font-size:10px;margin-left:2px}
.fav-meta{font-size:11px;color:var(--muted)}
.conf.high{color:var(--pos)}.conf.medium{color:var(--warn)}.conf.low{color:var(--muted)}

/* ---------- Team & player analysis (/leagues, /teams, /players) ---------- */
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 var(--s3);padding:0;font-size:var(--fs-sm);color:var(--muted)}
.crumbs li+li::before{content:"›";margin-right:6px;color:var(--muted)}
.crumbs a{color:var(--text-2)}.crumbs [aria-current]{color:var(--text)}
.meter{white-space:nowrap}
.team-filter{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;margin:var(--s4) 0 var(--s2)}
.team-filter input[type=search]{flex:1 1 220px;min-width:0}
.team-filter label{display:flex;gap:var(--s2);align-items:center;font-size:var(--fs-sm);color:var(--text-2)}
.team-grid{display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));margin-top:var(--s4)}
.team-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.team-card header{display:flex;align-items:center;justify-content:space-between;gap:var(--s2)}
.tc-name{display:inline-flex;align-items:center;gap:8px;color:var(--text);min-width:0}
.tc-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tc-meta{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;font-size:var(--fs-xs);color:var(--text-2)}
.tc-meta a.fx-league{color:var(--text-2)}
.fx-league.ucl{background:rgba(140,82,255,.16);color:var(--purple-400)}
.tc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2);margin:0}
.tc-stats.big{grid-template-columns:repeat(4,1fr);margin-bottom:var(--s4)}
.tc-stats div{background:var(--surface-2);border-radius:var(--r-sm);padding:6px 8px}
.tc-stats dt{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.tc-stats dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums}
.tc-next,.tc-nomodel{margin:0}
.form-chips{display:inline-flex;gap:2px;align-items:center;vertical-align:middle}
.sbar{display:grid;grid-template-columns:64px 1fr 34px;align-items:center;gap:var(--s2);font-size:var(--fs-xs);color:var(--text-2)}
.sbar i{position:relative;height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden}
.sbar i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:3px;background:var(--purple)}
.sbar.def i::after{background:var(--lime-600)}
.sbar i::before{content:"";position:absolute;left:50%;top:-2px;bottom:-2px;width:1px;background:var(--border-strong);z-index:1}
.sbar b{text-align:right;font-variant-numeric:tabular-nums;color:var(--text)}
.star-form{margin:0;flex:none}
.star{font-size:20px;line-height:1;width:34px;height:34px;padding:0;display:inline-grid;place-items:center;border-radius:50%;
  background:transparent;border:1px solid var(--border);color:var(--muted);box-shadow:none;cursor:pointer}
.star:hover{color:var(--lime-text);border-color:var(--border-strong)}
.star.on{color:#F5B300;border-color:rgba(245,179,0,.45);background:rgba(245,179,0,.1)}
.star.locked{opacity:.6;text-decoration:none}
.my-teams h3{display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.mt-row{display:flex;gap:var(--s3);overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.mt-chip{flex:none;display:flex;flex-direction:column;gap:4px;min-width:180px;padding:var(--s3);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);color:var(--text)}
.mt-chip b{display:inline}
.mt-chip:hover{border-color:var(--border-strong)}
.edge-banner{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);padding:var(--s4);margin:0 0 var(--s4);border-radius:var(--r-lg);
  border:1px solid rgba(182,255,74,.4);background:linear-gradient(135deg,rgba(182,255,74,.12),rgba(140,82,255,.08))}
.edge-banner p{flex:1 1 280px;margin:0;font-size:var(--fs-sm)}
.eb-actions{display:flex;gap:var(--s2);flex-wrap:wrap}
.btn.sm{padding:6px 12px;font-size:var(--fs-sm)}
.team-head .th-id{display:flex;align-items:center;gap:var(--s3)}
.team-head .th-id > .kit{width:40px;height:40px}
.team-head .th-id p{margin:2px 0 0}
.grid-2{display:grid;gap:var(--s4);grid-template-columns:1fr;margin:var(--s4) 0}
@media (min-width:900px){.grid-2{grid-template-columns:1fr 1fr}}
.grid-2 > .panel{margin:0;min-width:0}
.nm-teams{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;font-weight:600}
.nm-teams .vs{color:var(--muted);font-weight:400}
.hda{margin:var(--s3) 0}
.hda.two .a{background:var(--lime-600)}
.mv-table,.ad-table{display:table;width:100%;font-size:var(--fs-sm);margin:var(--s3) 0}
table.res-table{display:table}
.res-table td{white-space:nowrap}
@media (max-width:600px){
  .res-table th:nth-child(2),.res-table td:nth-child(2){display:none}        /* competition / event column */
  .mv-table th:nth-child(4),.mv-table td:nth-child(4){display:none}          /* implied % (edge stays) */
  .res-table td,.res-table th,.mv-table td,.mv-table th{padding:6px}
}
.res-table .fr,.mt-chip .fr{display:inline-grid;vertical-align:middle;margin-right:4px}
.mv-table td,.mv-table th,.ad-table td,.ad-table th{padding:6px 8px}
.up-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.up-list li{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s3);padding:var(--s3) 0;border-top:1px solid var(--border)}
.up-list li:first-child{border-top:0}
.up-list li > div:first-child{flex:1 1 200px;min-width:0}
.up-odds{display:flex;gap:6px;flex-wrap:wrap}
.up-list form{margin:0}
.bell-btn{font-size:var(--fs-xs);padding:5px 10px;border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-2);border:1px solid var(--border);box-shadow:none;white-space:nowrap}
.bell-btn.on{background:rgba(140,82,255,.16);color:var(--text);border-color:rgba(140,82,255,.5)}
.bell-btn.locked{text-decoration:none;opacity:.75}
.h2h{list-style:none;margin:0;padding:0}.h2h li{padding:6px 0;border-top:1px solid var(--border)}.h2h li:first-child{border-top:0}
.locked-panel{border:1px dashed rgba(140,82,255,.5)}
tr.older td{opacity:.7}
.team-card[hidden],.lt-row[hidden]{display:none}
.footnote{margin-top:var(--s5)}
.lg-group{font-size:var(--fs-lg);margin:var(--s6) 0 var(--s3)}
.league-grid{display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.league-card{display:flex;flex-direction:column;gap:var(--s3);margin:0;color:var(--text);transition:border-color var(--t),transform var(--t)}
.league-card:hover{border-color:rgba(140,82,255,.5);transform:translateY(-1px)}
.league-card header{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s2)}
.league-card p{margin:0}
.lg-top{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:var(--fs-sm)}
.lg-top li{display:flex;align-items:center;gap:8px}.lg-top li span:nth-child(2){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.league-table td,.league-table th{font-variant-numeric:tabular-nums}
.league-table .star{width:28px;height:28px;font-size:16px}
.pl-dot{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--surface-2);font-size:12px;flex:none}
.pl-dot.big{width:44px;height:44px;font-size:22px}
@media (max-width:600px){.tc-stats.big{grid-template-columns:repeat(2,1fr)}}

/* Dashboard skeletons (replaced by /dashboard/part/* fragments) */
.dash-part{margin:var(--s5) 0;display:grid;gap:var(--s3)}
.sk{border-radius:var(--r-md);background:linear-gradient(90deg,var(--surface-2,rgba(127,127,127,.08)) 25%,rgba(127,127,127,.16) 50%,var(--surface-2,rgba(127,127,127,.08)) 75%);background-size:300% 100%}
.sk-h{height:22px;width:38%}.sk-row{height:38px}.sk-cards{height:92px}.sk-chart{height:160px}
@media (prefers-reduced-motion:no-preference){.sk{animation:sk-shimmer 1.4s ease-in-out 6}}
@keyframes sk-shimmer{0%{background-position:100% 0}100%{background-position:0 0}}

/* Landing product preview (static example data; landing is always black) */
.lp-preview{max-width:1080px;margin:var(--s8) auto 0;padding:0 var(--s4)}
.pv-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--s2);margin-bottom:var(--s4)}
.pv-head h2{margin:0;font-size:var(--fs-lg);letter-spacing:-.01em}
.pv-label{font-size:var(--fs-xs);color:var(--muted);border:1px dashed rgba(255,255,255,.18);border-radius:var(--r-pill);padding:2px var(--s3)}
.pv-grid{display:grid;gap:var(--s4);grid-template-columns:1fr}
@media (min-width:860px){.pv-grid{grid-template-columns:1.35fr 1fr}}
.pv-side{display:grid;gap:var(--s4);align-content:start}
.pv-card{padding:var(--s5);border:1px solid rgba(255,255,255,.08);border-radius:var(--r-lg);background:#0A0A0A}
.pv-card h3{margin:0 0 var(--s3);font-size:var(--fs-md)}
.pv-team header{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s4)}
.pv-team header h3{margin:0}.pv-team header p{margin:0;color:var(--muted);font-size:var(--fs-xs)}
.pv-crest{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#EF0107;color:#fff;font-weight:800}
.pv-edge{margin-left:auto;font-size:var(--fs-xs);font-weight:700;color:#000;background:#B6FF4A;border-radius:var(--r-pill);padding:3px var(--s3);white-space:nowrap}
.pv-k{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pv-row{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:var(--s2) 0;border-top:1px solid rgba(255,255,255,.06)}
.pv-form{display:flex;gap:4px}
.pv-form i{font-style:normal;display:grid;place-items:center;width:24px;height:24px;border-radius:6px;font-size:12px;font-weight:700}
.pv-form .w{background:rgba(182,255,74,.16);color:#B6FF4A}.pv-form .d{background:rgba(255,255,255,.08);color:#C9C9D6}.pv-form .l{background:rgba(255,107,129,.16);color:#FF8A9C}
.pv-stats,.pv-mvm{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3);padding:var(--s3) 0;border-top:1px solid rgba(255,255,255,.06)}
.pv-mvm{grid-template-columns:repeat(3,1fr);border:0;padding-bottom:0}
.pv-stats b,.pv-mvm b{display:block;font-size:var(--fs-lg);margin-top:2px}
.pv-stats small,.pv-mvm small{color:var(--muted);font-size:var(--fs-xs)}
.pv-next{padding-top:var(--s3);border-top:1px solid rgba(255,255,255,.06)}
.pv-fx{margin:var(--s1) 0 0}
.pv-why{margin:var(--s3) 0 0;font-size:var(--fs-sm);color:var(--text-2)}
.pv-why::before{content:"Why: ";color:#B48CFF;font-weight:600}
.pv-outcomes{list-style:none;margin:0;padding:0}
.pv-outcomes li{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:var(--s3);padding:var(--s2) 0;border-top:1px solid rgba(255,255,255,.06);font-size:var(--fs-sm)}
.pv-outcomes li:first-child{border-top:0}
.pv-e{color:#B6FF4A;font-weight:700;font-size:var(--fs-xs)}
.pv-perf{margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3)}
.pv-perf dt{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pv-perf dd{margin:2px 0 0;font-weight:600;font-size:var(--fs-sm)}

/* ---------- Legal pages, footers, cookie notice ---------- */
.legal{max-width:760px;margin:0 auto;padding:var(--s6) 0 var(--s8);line-height:1.65}
.legal h1{margin:var(--s4) 0 var(--s1)}
.legal h2{font-size:var(--fs-lg,1.125rem);margin:var(--s6) 0 var(--s2)}
.legal .lead{font-size:1.05rem;color:var(--text)}
.legal ul{padding-left:1.25rem}.legal li{margin:var(--s1) 0}
.legal code{font-size:.85em}
.legal-updated{color:var(--muted);font-size:var(--fs-sm);margin:0 0 var(--s5)}
.legal-nav{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);font-size:var(--fs-sm)}
.legal-nav a{color:var(--muted)}.legal-nav a[aria-current="page"]{color:var(--text);font-weight:600}
.legal-help{margin-top:var(--s8);padding:var(--s4);border:1px solid var(--border);border-radius:12px;font-size:var(--fs-sm);color:var(--muted)}
.legal-help b{color:var(--text)}
.legal-table td{white-space:normal}
footer.site .foot-legal{flex-basis:100%;flex-wrap:wrap;gap:var(--s2) var(--s4);font-size:var(--fs-xs)}
.app-foot{margin-top:var(--s8);padding:var(--s4) 0 var(--s2);border-top:1px solid var(--border);font-size:var(--fs-xs);color:var(--muted)}
.app-foot nav{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4)}.app-foot a{color:var(--muted)}.app-foot a:hover{color:var(--text)}
.app-foot p{margin:var(--s2) 0 0}.app-foot b{color:var(--text)}
.cookie-notice{position:fixed;left:var(--s4);right:var(--s4);bottom:var(--s4);z-index:60;max-width:560px;margin:0 auto;display:flex;gap:var(--s3);
  align-items:center;padding:var(--s3) var(--s4);background:var(--surface-solid);border:1px solid var(--border);border-radius:12px;
  box-shadow:0 8px 28px rgba(0,0,0,.35);font-size:var(--fs-sm)}
.cookie-notice[hidden]{display:none}.cookie-notice p{margin:0;flex:1}
.cookie-notice button{flex:none;padding:var(--s2) var(--s4)}

/* Goal markets without stored prices: model fair prices table */
.model-only{margin-top:var(--s6)}.model-only h2{font-size:var(--fs-lg);margin:0 0 var(--s2)}

/* Notification settings */
.notif-form fieldset{border:1px solid var(--border);border-radius:12px;padding:var(--s4);margin:0 0 var(--s4)}
.notif-form legend{font-weight:600;padding:0 var(--s2)}
.notif-form fieldset > label{display:block;margin:var(--s2) 0}
.chk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:var(--s2) var(--s4);margin:var(--s3) 0}
.notif-row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;margin:var(--s3) 0}
.test-push{display:flex;gap:var(--s3);align-items:center;margin:var(--s3) 0}

/* Staking guide + stake cells */
.guide{max-width:860px}.guide .lead{font-size:1.05rem}
.guide-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--s3);margin:var(--s4) 0}
.guide-status .kpi{border:1px solid var(--border);border-radius:12px;padding:var(--s3) var(--s4);display:flex;flex-direction:column;gap:2px}
.guide-status .kpi span{font-size:var(--fs-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.guide-status .kpi b{font-size:1.25rem;font-variant-numeric:tabular-nums}.guide-status .kpi small{color:var(--muted)}
.guide-form fieldset{border:1px solid var(--border);border-radius:12px;padding:var(--s4);margin:0 0 var(--s4)}
.guide-form legend{font-weight:600;padding:0 var(--s2)}.guide-form .radio{display:inline-flex;gap:6px;align-items:center;margin-right:var(--s4)}
.guide-table tr.on td{background:rgba(140,82,255,.08)}
td.stake .sub{white-space:nowrap}.stake-label{margin-top:var(--s2)}
.loss-limit{margin:var(--s3) 0}

/* ---------- Motion: only when reduced motion isn't requested. transform/opacity only, except the chart
   line draw (stroke-dashoffset) and the 250ms theme cross-fade. Everything runs once: no loops,
   autoplay or parallax. Scroll reveals need static/motion.js (html.mo-js), so no-JS never hides content. ---------- */
@media (prefers-reduced-motion:no-preference){
  html.lp .hero-v2 > *{animation:mo-rise 400ms var(--ease) both}
  html.lp .hero-v2 > :nth-child(2){animation-delay:90ms}
  html.lp .hero-v2 > :nth-child(3){animation-delay:180ms}
  html.lp .hero-v2 > :nth-child(n+4){animation-delay:260ms}
  .btn.cta,a.cta{transition:transform 160ms var(--ease),box-shadow 160ms var(--ease),filter 160ms var(--ease)}
  .btn.cta:hover,a.cta:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(140,82,255,.45)}
  .btn.cta:active,a.cta:active{transform:scale(.98)}
  .mo-js [data-reveal]{opacity:0;transform:translateY(20px);transition:opacity 560ms var(--ease),transform 560ms var(--ease)}
  .mo-js [data-reveal].in{opacity:1;transform:none}
  .mo-js [data-reveal-stagger] > *{opacity:0;transform:translateY(12px);transition:opacity 420ms var(--ease),transform 420ms var(--ease)}
  .mo-js [data-reveal-stagger].in > *{opacity:1;transform:none}
  .mo-js [data-reveal-stagger].in > :nth-child(2){transition-delay:100ms}
  .mo-js [data-reveal-stagger].in > :nth-child(3){transition-delay:200ms}
  .edge-chip,.badge-edge{animation:mo-fade 320ms var(--ease) both}
  .edge-new .edge-chip{position:relative}
  .edge-new .edge-chip::after{content:"";position:absolute;inset:-4px;border-radius:9px;pointer-events:none;
    box-shadow:0 0 14px 2px rgba(193,255,114,.75);opacity:0;animation:mo-glow 1.5s ease-out 1}
  .star.pop,.bell-btn.pop,.bell.pop{animation:mo-pop 300ms var(--ease)}
  .dash-part-loaded{animation:mo-fade 280ms var(--ease) both}
  .px b,.dt td.num b{animation:mo-fade 240ms var(--ease) both}
  svg .mo-draw{stroke-dasharray:1;stroke-dashoffset:1;animation:mo-draw 900ms var(--ease) 120ms forwards}
  svg.chart polygon,svg.chart circle{animation:mo-fade 600ms var(--ease) 500ms both}
  html.theme-transition,html.theme-transition *,html.theme-transition *::before,html.theme-transition *::after{
    transition:background-color 250ms var(--ease),color 250ms var(--ease),border-color 250ms var(--ease),fill 250ms var(--ease)!important}
  .status-live::before{display:inline-block;animation:mo-pulse 1.2s ease-out 1}
  td.score.live{animation:mo-pulse 1.2s ease-out 1;color:var(--lime-text)}
  .empty,.upsell,.note,.locked-panel{animation:mo-rise 360ms var(--ease) both}
  @keyframes mo-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  @keyframes mo-fade{from{opacity:0}to{opacity:1}}
  @keyframes mo-glow{0%{opacity:0}25%{opacity:1}100%{opacity:0}}
  @keyframes mo-pop{0%{transform:scale(1)}45%{transform:scale(1.28)}100%{transform:scale(1)}}
  @keyframes mo-draw{to{stroke-dashoffset:0}}
  @keyframes mo-pulse{0%{opacity:.25;transform:scale(.92)}45%{opacity:1;transform:scale(1.06)}100%{opacity:1;transform:none}}
}

/* Landing hero backdrop: faint 56px grid on pure black, faded out by a radial mask, with a soft purple
   (and a hint of lime) glow behind the headline. Pure CSS, static (no motion), landing only. */
html.lp body{overflow-x:clip}
html.lp .hero-v2{position:relative;isolation:isolate}
html.lp .hero-v2::before,html.lp .hero-v2::after{content:"";position:absolute;z-index:-1;pointer-events:none;
  top:0;bottom:-180px;left:50%;width:100vw;margin-left:-50vw}
html.lp .hero-v2::before{
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:56px 56px;background-position:center top;
  -webkit-mask-image:radial-gradient(ellipse 62% 70% at 50% 34%,#000 22%,rgba(0,0,0,.45) 52%,transparent 78%);
  mask-image:radial-gradient(ellipse 62% 70% at 50% 34%,#000 22%,rgba(0,0,0,.45) 52%,transparent 78%)}
html.lp .hero-v2::after{
  background:radial-gradient(520px 300px at 50% 30%,rgba(140,82,255,.20),transparent 70%),
             radial-gradient(360px 200px at 60% 46%,rgba(182,255,74,.045),transparent 70%)}

/* ---- Odds formats: "2.40 (7/5)" with a quieter secondary; compact on tight cells/pills ---- */
.odds{white-space:nowrap;font-variant-numeric:tabular-nums}
.odds-alt{font-size:.82em;font-weight:500;color:var(--text-2);margin-left:1px}
.odds-alt.sm{font-size:.72em}
.price-pill .odds-alt,.edge-banner .odds-alt{color:inherit;opacity:.72}
.odds-form .seg{display:flex;flex-wrap:wrap;gap:var(--s2);border:0;padding:0;margin:0 0 var(--s3);background:none;box-shadow:none;min-width:0}
.seg-opt{position:relative;cursor:pointer}
.seg-opt input{position:absolute;opacity:0;pointer-events:none}
.seg-opt span{display:flex;flex-direction:column;gap:2px;min-width:118px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--r-md,12px);background:var(--surface-solid,var(--surface))}
.seg-opt small{color:var(--text-2);font-variant-numeric:tabular-nums}
.seg-opt input:checked+span{border-color:var(--purple-400);box-shadow:0 0 0 2px rgba(140,82,255,.3);background:var(--purple-900)}
.seg-opt input:focus-visible+span{box-shadow:var(--ring)}
.foot-odds{display:inline-flex;align-items:center;gap:6px;margin:0 0 var(--s2);font-size:.85rem;color:var(--text-2)}
.foot-odds select{padding:2px 6px;font-size:.85rem;width:auto}

/* Best outcomes */
.outcomes .oc-actions{display:flex;align-items:center;gap:var(--s2);justify-content:flex-end}
.outcomes .oc-actions form{margin:0}
.oc-cov .chip{display:inline-block;margin:0 var(--s1) var(--s1) 0}

/* Notifications switch (role=switch). Lime when on; motion only if the user allows it. */
.push-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);margin:var(--s3) 0 var(--s4)}
.push-toggle{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s3) var(--s4);border:1px solid var(--border);
  border-radius:var(--r-lg);background:var(--surface);max-width:560px}
.push-toggle .switch{position:relative;flex:none;width:46px;height:26px;padding:0;border-radius:999px;border:1px solid var(--border-strong);
  background:var(--surface-2);box-shadow:none;cursor:pointer;margin-top:1px}
.push-toggle .switch .knob{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--text-2)}
.push-toggle .switch[aria-checked=true]{background:#B6FF4A;border-color:#B6FF4A}
.push-toggle .switch[aria-checked=true] .knob{transform:translateX(20px);background:#000}
.push-toggle .switch:disabled{cursor:not-allowed;opacity:.55}
.push-toggle .switch:focus-visible{outline:none;box-shadow:var(--ring)}
.push-toggle .pt-text{display:flex;flex-direction:column;gap:2px}
.push-toggle[data-state=on] .pt-label{color:var(--lime-text)}
.push-toggle[data-state=blocked] .pt-label,.push-toggle[data-state=unsupported] .pt-label{color:var(--warn)}
.push-toggle .pt-err{color:var(--neg)}
@media (prefers-reduced-motion:no-preference){
  .push-toggle .switch,.push-toggle .switch .knob{transition:background-color .2s ease,border-color .2s ease,transform .2s ease}}

/* Team page: best side card, position chip, form summary */
.th-meta{display:flex;gap:var(--s2);flex-wrap:wrap}
.best-side{margin:0 0 var(--s3);padding:var(--s3) var(--s4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.best-side.pos-edge{border-color:rgba(182,255,74,.4)}
.best-side .bs-k{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.best-side p{margin:2px 0 0}
.best-side .eb-actions{margin-top:var(--s2);display:flex;align-items:center;gap:var(--s3)}
.up-model{margin-top:2px}
.freshness{margin:calc(-1 * var(--s2)) 0 var(--s4)}

/* ---- Trial / pricing (no free tier): per-day headline with the monthly billing line right under it ---- */
.per-day{font-size:2.5rem;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1.1;margin:0}
.billed{margin:var(--s2) 0 var(--s5);font-size:var(--fs-md);color:var(--text)}
.trial-wall{max-width:560px;margin:var(--s7) auto;text-align:center}
.trial-wall .plan{text-align:left;margin:var(--s5) 0}
.trial-wall .plan::after,.plans-one .plan::after{content:none}
.pricing-head{text-align:center;margin-top:var(--s7)}
.pricing-head h1{font-size:clamp(2rem,4vw,3rem)}
.trial-chip{display:inline-flex;align-items:center;padding:var(--s1) var(--s3);border:1px solid rgba(193,255,114,.35);border-radius:999px;
  font-size:var(--fs-sm);color:var(--lime-text);font-variant-numeric:tabular-nums;white-space:nowrap}
.trial-chip:hover{border-color:var(--lime-text)}

/* ==========================================================================
   Polish pass: dense data tables (value bets, outcomes, fixtures), compact filter bar,
   edge chips. 4/8px spacing (--s*), one type scale, tabular numbers, subtle borders on black.
   ========================================================================== */
.dt-wrap{position:relative;overflow:auto;max-height:min(74vh,960px);margin:var(--s3) 0 var(--s5);
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);overscroll-behavior-x:contain}
table.dt{display:table;width:100%;margin:0;border:0;border-radius:0;background:none;overflow:visible;
  font-size:13px;line-height:1.35;font-variant-numeric:tabular-nums}
.dt thead th{position:sticky;top:0;z-index:2;height:36px;padding:0 var(--s3);background:var(--surface-solid);
  border-bottom:1px solid var(--border);font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--muted)}
.dt td{height:52px;padding:var(--s1) var(--s3);border-bottom:1px solid var(--row-line);vertical-align:middle;color:var(--text-2)}
.dt tbody tr:nth-child(even) td{background:rgba(255,255,255,.016)}
.dt tbody tr:hover td{background:var(--row-hover);color:var(--text)}
.dt tbody tr:last-child td{border-bottom:0}
.dt tr.edge td:first-child{box-shadow:inset 2px 0 0 var(--lime)}
.dt .num{text-align:right}
.dt td.dim{color:var(--muted)}
.dt td b{color:var(--text);font-weight:600}
.dt .sub{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-top:2px}
.dt td.match{min-width:200px}
.dt td.match .teams2{font-weight:600}
.dt td.why{white-space:normal;min-width:220px;max-width:340px;color:var(--muted)}
.dt td.act{text-align:right;white-space:nowrap}
.dt td.act form{display:inline}
.dt-quiet td{height:40px}
.th-sort{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.th-sort:hover{color:var(--text)}
.th-arrow{opacity:0;font-size:10px}
.th-sort:hover .th-arrow,.th-sort.on .th-arrow{opacity:1}
.th-sort.on{color:var(--text)}
/* The one primary number per row */
.edge-chip{display:inline-flex;align-items:baseline;justify-content:center;gap:2px;min-width:68px;padding:5px var(--s2);
  border-radius:6px;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;border:1px solid transparent;white-space:nowrap}
.edge-chip small{font-size:10px;font-weight:600;opacity:.75}
.edge-chip.pos{background:rgba(193,255,114,.10);border-color:rgba(193,255,114,.28);color:var(--lime-text)}
.edge-chip.hot{background:var(--lime);color:#14200A}
.edge-chip.neu{background:var(--surface-2);border-color:var(--border);color:var(--muted)}
.btn.ghost{background:transparent;border:1px solid var(--border-strong);color:var(--text);box-shadow:none}
.btn.ghost:hover{border-color:var(--purple);background:rgba(140,82,255,.12)}
/* Fixture price cells */
.px{display:inline-flex;flex-direction:column;align-items:flex-end;padding:var(--s1) var(--s2);border-radius:6px;color:var(--text);text-decoration:none}
.px:hover{background:rgba(140,82,255,.14)}
.px i{font-style:normal}
.px.drift-up{background:rgba(193,255,114,.07)}.px.drift-down{background:rgba(255,107,129,.07)}
.fx-table td.model .fav-badge{font-size:11px;padding:2px var(--s2)}
/* Compact single-row filter bar */
.fbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin:var(--s4) 0 var(--s2);padding:var(--s2);
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface)}
.fsel{display:inline-flex;align-items:center;gap:0;height:32px;border:1px solid var(--border-strong);border-radius:var(--r-pill);
  padding:0 0 0 var(--s3);background:var(--surface-2);font-size:12px;color:var(--muted);margin:0}
.fsel span{white-space:nowrap}
.fsel select,.fsel input{height:30px;border:0;background:transparent;color:var(--text);font-size:13px;font-weight:600;
  padding:0 var(--s3) 0 var(--s2);margin:0;box-shadow:none;min-width:0;width:auto}
.fsel:focus-within{border-color:var(--purple);box-shadow:var(--ring)}
.fbar .btn.sm{height:32px}
.fbar-sum{margin-left:auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;padding-right:var(--s2)}
.fbar-sum b{color:var(--text)}
.fdrop{position:relative}
.fdrop summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:var(--s1);height:32px;padding:0 var(--s3);
  border:1px solid var(--border-strong);border-radius:var(--r-pill);background:var(--surface-2);font-size:12px;color:var(--muted)}
.fdrop summary::-webkit-details-marker{display:none}
.fdrop summary::after{content:"▾";font-size:10px;margin-left:2px}
.fdrop summary b{color:var(--text);font-size:13px}
.fdrop[open] summary{border-color:var(--purple)}
.fdrop-menu{position:absolute;z-index:20;top:calc(100% + 4px);left:0;min-width:200px;display:grid;gap:2px;padding:var(--s2);
  background:var(--surface-solid);border:1px solid var(--border-strong);border-radius:var(--r-md);box-shadow:0 12px 32px rgba(0,0,0,.5)}
.fdrop-menu label{display:flex;align-items:center;gap:var(--s2);padding:6px var(--s2);border-radius:6px;font-size:13px;color:var(--text);margin:0;cursor:pointer}
.fdrop-menu label:hover{background:var(--row-hover)}
.fdrop-menu input{width:auto;margin:0}
/* Empty state inside a data table */
.dt .empty{white-space:normal;padding:var(--s6) var(--s4);text-align:center;display:grid;gap:var(--s2);justify-items:center}
/* Team page tables: same density, right-aligned numbers */
.mv-table,.ad-table,.res-table{font-size:13px}
.mv-table td,.ad-table td,.res-table td{height:40px;padding-top:0;padding-bottom:0}
.mv-table th:nth-child(n+2),.mv-table td:nth-child(n+2),.ad-table th:nth-child(n+2),.ad-table td:nth-child(n+2){text-align:right}
.res-table td:last-child,.res-table th:last-child{text-align:right}
.mv-table tbody tr:nth-child(even) td,.ad-table tbody tr:nth-child(even) td,.res-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.016)}
/* Mobile: keep the table, scroll sideways, pin the first column */
@media (max-width:760px){
  .dt-wrap{max-height:none;margin-left:calc(var(--s4) * -1);margin-right:calc(var(--s4) * -1);border-radius:0;border-left:0;border-right:0}
  .dt thead th:first-child,.dt td:first-child{position:sticky;left:0;z-index:1;background:var(--surface-solid);box-shadow:1px 0 0 var(--border)}
  .dt thead th:first-child{z-index:3}
  .dt td.match{min-width:132px;max-width:150px;white-space:normal}
  .dt td.match .team{white-space:normal}
  .dt td{height:56px}
  .fbar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-left:calc(var(--s4) * -1);margin-right:calc(var(--s4) * -1);border-radius:0;border-left:0;border-right:0}
  .fbar::-webkit-scrollbar{display:none}
  .fbar > *{flex:0 0 auto}
  .fbar-sum{display:none}
  .fdrop-menu{position:fixed;left:var(--s4);right:var(--s4);top:auto}
}
html[data-theme="light"] .dt tbody tr:nth-child(even) td{background:rgba(20,16,40,.02)}
/* Secondary columns give way first so the primary ones fit without sideways scrolling at 1280px */
@media (max-width:1440px){.dt .col-opt,.fbar-sum .col-opt{display:none}}
.dt td.why{max-width:260px}
/* Dashboard breakdown tables: fit three across at 1280px */
table.dt-mini{display:table;table-layout:auto;font-size:12px;border:0;background:none;margin:0}
.dt-mini th,.dt-mini td{padding:6px var(--s1);height:32px}
.dt-mini th:first-child,.dt-mini td:first-child{padding-left:0}
.dt-mini .num{text-align:right}
.dt-mini td.nm{max-width:120px;overflow:hidden;text-overflow:ellipsis}
.dt-mini .clv-chip{padding:1px 6px}
.evbars b{white-space:nowrap;font-size:clamp(1rem,1.4vw,1.25rem)}
.vb-mini .edge-chip{min-width:0}
@media (max-width:1440px){.dt-mini .col-opt{display:none}.evbars b{font-size:1rem}.evbars > div{min-width:0}}