:root{
  --bg:#060807; --bg2:#0c100e; --panel:#10160f; --panel2:#0c110e;
  --line:#1a241f; --line2:#2a3a32;
  --green:#19ff9f; --green-dim:#0bbf75; --green-deep:#063a28;
  --pitch:#0e3b27;
  --ink:#eafff5; --mut:#7e918a; --mut2:#54615a;
  --up:#19ff9f; --down:#ff5470; --amber:#ffcf5c;
  --r:16px; --maxw:1200px;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --disp:'Bricolage Grotesque','Space Grotesk',system-ui,sans-serif;
  --body:'Space Grotesk',system-ui,sans-serif;
  --sh1:0 1px 0 rgba(255,255,255,.02) inset,0 8px 24px -12px rgba(0,0,0,.6);
  --sh2:0 20px 60px -24px rgba(0,0,0,.8);
  --glow:0 0 32px -6px var(--green);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:#040605}
::selection{background:var(--green);color:#042015}
body{
  font-family:var(--body); color:var(--ink);
  -webkit-font-smoothing:antialiased; overflow-x:hidden; line-height:1.5;
  letter-spacing:-.01em;
  /* layered atmosphere: deep base + cool floor + warm green wash up top */
  background:
    radial-gradient(120% 80% at 50% -8%, rgba(25,255,159,.10), transparent 55%),
    radial-gradient(90% 60% at 88% 0%, rgba(20,120,255,.07), transparent 60%),
    linear-gradient(180deg, #0a0f0d 0%, #070b09 42%, #040605 100%);
  background-attachment:fixed;
}
/* fine data grid — a terminal floor, masked to fade at the edges so it reads as depth not wallpaper */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(25,255,159,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(25,255,159,.045) 1px, transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(130% 100% at 50% 0%, #000 30%, transparent 78%);
          mask-image:radial-gradient(130% 100% at 50% 0%, #000 30%, transparent 78%);
  opacity:.6}
h1,h2,h3,.brand{font-family:var(--disp)}
:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:6px}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.05ms!important}.stadium-bg,#bg{animation:none}}
.stadium-bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:url(/stadium.jpg) center 30%/cover no-repeat;opacity:.16;filter:blur(3px) saturate(1.2);animation:kenburns 40s ease-in-out infinite alternate}
.stadium-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,transparent,var(--bg) 72%),linear-gradient(180deg,var(--bg) 0%,transparent 22%,transparent 60%,var(--bg) 100%)}
@keyframes kenburns{from{transform:scale(1.05) translateY(0)}to{transform:scale(1.18) translateY(-12px)}}
#bg{position:fixed;inset:0;z-index:0;opacity:.4;pointer-events:none}
body>*:not(#bg):not(.stadium-bg):not(.depth-vignette):not(.depth-noise):not(.modal-bg):not(.toast){position:relative;z-index:1}
.modal-bg{z-index:200}

/* ── live scoreboard ── */
.scorebar{display:flex;gap:0;overflow:hidden;background:#04100b;border-bottom:1px solid var(--line);min-height:40px;align-items:stretch}
.sc-track{display:flex;gap:0;animation:scroll 34s linear infinite;white-space:nowrap}
.scorebar:hover .sc-track{animation-play-state:paused}
.sc{display:flex;align-items:center;gap:10px;padding:8px 18px;border-right:1px solid var(--line);font-family:var(--mono);font-size:12.5px}
.sc .sc-live{width:7px;height:7px;border-radius:50%;background:var(--down);box-shadow:0 0 8px var(--down);animation:pulse 1.2s infinite}
.sc .sc-emo{font-size:14px}
.sc .sc-t{color:var(--mut)}
.sc .sc-score{color:#fff;font-weight:700}
.sc .sc-clk{color:var(--green);font-size:11px}
.sc-flash{animation:scfl .8s}
@keyframes scfl{0%{background:rgba(19,255,157,.25)}100%{background:transparent}}
a{color:inherit;text-decoration:none}
.muted{color:var(--mut)} .hl{color:var(--green)}
strong,b{color:#fff;font-weight:700}

/* ── ticker ── */
.ticker{height:28px;background:#050d09;border-bottom:1px solid var(--line);overflow:hidden;display:flex;align-items:center;opacity:.62}
.ticker-track{display:flex;gap:34px;white-space:nowrap;animation:scroll 46s linear infinite;font-family:var(--mono);font-size:11px}
.ticker-track:hover{animation-play-state:paused}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk{color:var(--mut)}
.tk b{color:var(--ink)} .tk .o{color:var(--green)} .tk .d{color:var(--down)}

/* ── nav ── */
.nav{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:14px clamp(16px,4vw,40px);background:rgba(6,8,7,.55);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.nav.scrolled{border-bottom-color:var(--line);background:rgba(6,8,7,.8)}
.brand{font-weight:800;font-size:21px;letter-spacing:-.02em;display:flex;align-items:center;gap:8px}
.logo{font-size:20px;filter:drop-shadow(0 0 10px rgba(25,255,159,.5))}
.brand-sub{color:var(--mut2);font-size:12px;font-family:var(--mono);font-weight:400}
.nav-links{display:flex;align-items:center;gap:26px;font-size:14px;color:var(--mut)}
.nav-links a:hover{color:var(--ink)}
.kpi{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:12px;color:var(--mut)}
.kpi .dot{width:8px;height:8px;border-radius:50%;background:var(--mut2)}
.kpi.on .dot{background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}

/* ── hero ── */
.hero{position:relative;max-width:var(--maxw);margin:0 auto;padding:clamp(36px,7vw,80px) clamp(16px,4vw,40px) 0}
.hero-glow{position:absolute;top:-6%;left:-8%;width:60%;height:80%;z-index:-1;background:radial-gradient(ellipse 60% 50% at 30% 40%,rgba(25,255,159,.14),transparent 70%);filter:blur(20px);pointer-events:none;animation:glowpulse 7s ease-in-out infinite}
@keyframes glowpulse{0%,100%{opacity:.7}50%{opacity:1}}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:11.5px;letter-spacing:2px;color:var(--green);border:1px solid var(--green-deep);background:rgba(25,255,159,.06);padding:7px 14px;border-radius:100px;margin-bottom:24px}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 1.4s infinite}
.hero h1{font-size:clamp(46px,8vw,96px);line-height:.92;letter-spacing:-.045em;font-weight:800;color:#f4f0e6;text-shadow:0 0 60px rgba(25,255,159,.12)}
.hero-sub{font-family:var(--disp);font-weight:700;font-size:clamp(26px,4.4vw,52px);line-height:1;letter-spacing:-.03em;color:#9fb0a8;margin-top:6px}
.hero-sub .hl{color:var(--green);text-shadow:0 0 30px rgba(25,255,159,.4)}
.hero .lede{max-width:540px;margin:24px 0 0;font-size:clamp(16px,1.4vw,18.5px);line-height:1.72;color:#cfdcd5}
.hero .lede em{color:var(--ink);font-style:normal;font-weight:600}
/* live edge proof — concrete price-improvement, real numbers (Hypercall-style) */
.hero-proof{display:inline-flex;align-items:center;gap:10px;margin:20px 0 0;padding:9px 13px;border-radius:11px;
  background:linear-gradient(100deg,rgba(25,255,159,.08),rgba(25,255,159,.02));border:1px solid rgba(25,255,159,.22);
  font-family:var(--mono);font-size:13px;color:#cfdcd5;text-decoration:none;max-width:560px;
  transition:border-color .2s,transform .2s,box-shadow .2s}
.hero-proof:hover{border-color:rgba(25,255,159,.5);transform:translateY(-1px);box-shadow:0 10px 30px -16px var(--green)}
.hero-proof .hp-tag{flex:none;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#042015;background:var(--green);padding:3px 7px;border-radius:5px}
.hero-proof .hp-body{line-height:1.4}
.hero-proof .hp-body b{color:var(--ink);font-weight:700}
.hero-proof .hp-body i{color:var(--mut);font-style:normal}
.hero-proof .hp-pct{color:var(--green)!important}
.hero-proof .hp-arrow{flex:none;color:var(--green);font-weight:700;transition:transform .2s}
.hero-proof:hover .hp-arrow{transform:translateX(3px)}
@media(max-width:560px){.hero-proof{font-size:12px}}
/* scannable advantage cards (Hypercall's four-pillar strip) */
.hero-edges{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:30px 0 0;max-width:680px}
.he-card{background:linear-gradient(168deg,rgba(255,255,255,.035),rgba(255,255,255,.008));border:1px solid var(--line);border-radius:12px;padding:13px 14px;position:relative;overflow:hidden;transition:border-color .22s,transform .22s,box-shadow .22s}
.he-card::before{content:"";position:absolute;left:12px;right:12px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(25,255,159,.5),transparent);opacity:.5}
.he-card:hover{border-color:var(--line2);transform:translateY(-2px);box-shadow:0 16px 36px -22px rgba(0,0,0,.8)}
.he-card b{display:block;font-family:var(--disp);font-weight:800;font-size:14px;color:var(--ink);letter-spacing:-.01em;margin-bottom:5px}
.he-card span{font-size:11.5px;line-height:1.45;color:var(--mut)}
@media(max-width:900px){.hero-edges{grid-template-columns:repeat(2,1fr);max-width:460px}}
@media(max-width:430px){.hero-edges{grid-template-columns:1fr 1fr;gap:8px}.he-card{padding:11px}}
.hero-cta{display:flex;gap:14px;margin:32px 0 0;flex-wrap:wrap;align-items:center}
.btn{font-family:var(--disp);font-weight:700;font-size:15px;padding:13px 24px;border-radius:12px;border:1px solid transparent;cursor:pointer;transition:transform .18s var(--ease),box-shadow .25s var(--ease),background .2s,border-color .2s;display:inline-flex;align-items:center;gap:8px}
.btn:active{transform:translateY(1px) scale(.99)}
.btn-primary{background:linear-gradient(180deg,#2bffab,var(--green));color:#042015;box-shadow:0 8px 24px -10px var(--green)}
.btn-primary:hover{box-shadow:0 14px 40px -10px var(--green);transform:translateY(-2px)}
.btn-ghost{background:rgba(255,255,255,.02);border-color:var(--line2);color:var(--ink)}
.btn-ghost:hover{border-color:var(--green);color:var(--green);background:rgba(25,255,159,.05)}
.btn.full{width:100%;justify-content:center}
.hero-stats{display:flex;gap:clamp(16px,3vw,36px);margin:36px 0 0;flex-wrap:wrap}
.hero-stats.glass{background:linear-gradient(160deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:14px;padding:18px 22px;backdrop-filter:blur(8px);box-shadow:var(--sh1);width:fit-content}
.hstat{display:flex;flex-direction:column;gap:4px}
.hstat+.hstat{padding-left:clamp(16px,3vw,36px);border-left:1px solid var(--line)}
.hstat-n{font-family:var(--mono);font-size:clamp(20px,2.2vw,26px);font-weight:700;color:#f4f0e6}
.hstat-l{font-size:11px;color:var(--mut);letter-spacing:.5px}

/* ── hero product visual ── */
.hero-visual{min-width:0}
.hv-card{background:linear-gradient(165deg,rgba(20,28,22,.9),rgba(10,16,13,.92));border:1px solid var(--line2);border-radius:18px;overflow:hidden;box-shadow:var(--sh2);backdrop-filter:blur(10px);animation:cardIn .6s var(--ease) both;animation-delay:.15s}
.hv-bar{display:flex;align-items:center;gap:7px;padding:11px 15px;background:rgba(255,255,255,.025);border-bottom:1px solid var(--line)}
.hv-title{font-family:var(--mono);font-size:11.5px;color:var(--mut);margin-left:8px}
.hv-live{margin-left:auto;display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;color:var(--green);text-transform:uppercase;letter-spacing:1px}
.hv-live .ld{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 1.2s infinite}
.hv-body{padding:18px}
.hv-skel{height:230px;border-radius:12px;background:linear-gradient(100deg,var(--panel2) 30%,#141b16 50%,var(--panel2) 70%);background-size:200% 100%;animation:shimmer 1.3s linear infinite}
.hv-game{font-family:var(--disp);font-weight:700;font-size:17px;margin-bottom:3px}
.hv-meta{font-family:var(--mono);font-size:11px;color:var(--mut);margin-bottom:14px}
.hv-grid{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px}
.hv-grid th{text-align:right;color:var(--mut2);font-weight:500;font-size:9.5px;padding:3px 6px;text-transform:uppercase}
.hv-grid th:first-child{text-align:left}
.hv-grid td{text-align:right;padding:6px;color:var(--mut);border-top:1px solid var(--line)}
.hv-grid td.bk{text-align:left;font-weight:600}
.hv-grid td.is-best{color:var(--green);font-weight:700;background:rgba(25,255,159,.09);border-radius:5px}
.hv-foot{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding-top:14px;border-top:1px solid var(--line2)}
.hv-foot .hv-spread{font-family:var(--mono);font-size:13px;color:var(--mut)}
.hv-foot .hv-spread b{color:var(--green);font-size:22px}
.hv-foot .hv-lock{font-family:var(--disp);font-weight:700;font-size:12px;background:var(--green);color:#042015;padding:8px 14px;border-radius:9px}

.tagline-strip{margin-top:56px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:9px 0;overflow:hidden;white-space:nowrap;font-family:var(--mono);font-size:11px;letter-spacing:3px;color:var(--mut2);opacity:.6}

/* ── sections ── */
.section{max-width:var(--maxw);margin:0 auto;padding:clamp(56px,9vw,100px) clamp(16px,4vw,40px) 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:26px;flex-wrap:wrap}
.section-head h2{font-size:clamp(24px,3.5vw,38px);letter-spacing:-1px}
.board-meta{font-family:var(--mono);font-size:12.5px;color:var(--mut)}

/* ── category tabs ── */
.cat-tabs{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.cat{font-family:var(--mono);font-size:12.5px;padding:8px 15px;border-radius:9px;border:1px solid var(--line);background:#0a0f0d;color:var(--mut);cursor:pointer;transition:.14s;display:inline-flex;align-items:center;gap:7px}
.cat:hover{border-color:var(--line2);color:var(--ink)}
.cat.active{background:var(--green);color:#042015;border-color:var(--green);font-weight:700}
.cat .ld{width:7px;height:7px;border-radius:50%;background:var(--down);box-shadow:0 0 8px var(--down);animation:pulse 1.2s infinite}

.cat.arb{background:linear-gradient(135deg,#10231a,#0a0f0d);border-color:var(--green-deep);color:var(--green)}
.cat.arb.active{background:var(--green);color:#042015}
.arb-count{background:var(--green);color:#042015;font-weight:700;border-radius:20px;padding:1px 7px;font-size:10px;margin-left:2px}
.cat.arb.active .arb-count{background:#042015;color:var(--green)}

/* ── match grid ── */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}
.ct-badges{display:flex;gap:6px;align-items:center}
.arb-badge{font-family:var(--mono);font-size:11px;font-weight:700;color:#042015;background:var(--green);padding:2px 8px;border-radius:6px;box-shadow:0 0 14px -2px var(--green)}
.arb-badge.sm{font-size:10px;padding:2px 6px}
.best-strip{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.best-strip span{font-family:var(--mono);font-size:11px;color:var(--ink);background:#0a0f0d;border:1px solid var(--line);border-radius:7px;padding:5px 8px;display:inline-flex;gap:5px;align-items:center}
.best-strip i{color:var(--mut);font-style:normal}
.best-strip b{color:var(--green);font-weight:600;font-size:10px}

/* ── arb cards ── */
.arb-card{border-color:var(--green-deep)}
.arb-card::before{background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:.6}
.arb-title{font-size:16px;font-weight:600;margin:10px 0 14px}
.book-tbl{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px}
.book-tbl th{text-align:right;color:var(--mut2);font-weight:500;font-size:10px;padding:4px 6px;text-transform:uppercase}
.book-tbl th:first-child{text-align:left}
.book-tbl td{text-align:right;padding:5px 6px;color:var(--mut);border-top:1px solid var(--line)}
.book-tbl td.bk{text-align:left;font-weight:600}
.book-tbl td.is-best{color:var(--green);font-weight:700;background:rgba(19,255,157,.08);border-radius:4px}
.book-tbl td.is-worst{color:var(--down);opacity:.7}
.book-tbl .best-row td{color:#fff;font-weight:700;border-top:1px solid var(--line2);padding-top:8px}
.book-tbl .best-row td:first-child{color:var(--green)}
.book-tbl .bb{display:block;font-size:9px;color:var(--mut2);font-weight:400}
.arb-split{margin-top:14px;font-family:var(--mono);font-size:11.5px;color:var(--mut);line-height:1.7}
.arb-split b{color:var(--ink)}
.arb-foot{margin-top:10px;font-family:var(--mono);font-size:12px;color:var(--mut);border-top:1px solid var(--line);padding-top:10px}
.arb-foot b{color:var(--ink)} .arb-foot .grn{color:var(--green)}

/* ── juice line on cards ── */
.juice{display:flex;align-items:center;gap:7px;margin:8px 0 2px;font-family:var(--mono);font-size:12px;padding:7px 10px;border-radius:8px;border:1px solid var(--line)}
.juice b{font-size:15px;font-weight:700}
.juice span{color:var(--mut2);font-size:10.5px}
.juice.arb{background:rgba(19,255,157,.07);border-color:var(--green-deep);cursor:pointer}
.juice.arb b{color:var(--green)}
.juice.arb:hover{border-color:var(--green)}
.juice.edge b{color:var(--amber)}

/* ── arb modal legs ── */
.arb-spread-big{font-family:var(--mono);font-size:40px;font-weight:700;color:var(--green);margin:6px 0 18px;display:flex;align-items:baseline;gap:10px}
.arb-spread-big span{font-size:13px;color:var(--mut);font-weight:400}
.legs{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.leg{display:flex;justify-content:space-between;align-items:center;background:#0a0f0d;border:1px solid var(--line);border-radius:9px;padding:11px 14px}
.leg-l{display:flex;flex-direction:column;gap:2px}
.leg-l b{font-size:14px}.leg-l span{font-family:var(--mono);font-size:10.5px;color:var(--mut)}
.leg-r{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-family:var(--mono)}
.leg-r span{font-size:13px;color:var(--ink)}.leg-r .leg-ret{font-size:10.5px;color:var(--green)}
.payout-box .grn{color:var(--green)}

/* ── portfolio bar ── */
.portfolio{display:flex;gap:0;flex-wrap:wrap;margin-bottom:14px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.portfolio:empty{display:none}
.pf{flex:1;min-width:120px;padding:14px 18px;border-right:1px solid var(--line);background:var(--panel2)}
.pf:last-child{border-right:none}
.pf-l{display:block;font-family:var(--mono);font-size:10.5px;color:var(--mut);margin-bottom:5px;letter-spacing:.5px}
.pf b{font-family:var(--mono);font-size:19px;color:#fff}
.pf .grn{color:var(--green)}
.snd{cursor:pointer;font-size:14px}
.card-stats{display:flex;gap:14px;margin:10px 0 0;font-family:var(--mono);font-size:10.5px;color:var(--mut2);align-items:center}
.card-stats b{color:var(--mut);font-weight:600}
.spark{margin-left:auto;display:block}
.live-score{display:flex;align-items:center;justify-content:center;gap:14px;margin:4px 0 2px;font-family:var(--mono)}
.live-score .ls-n{font-size:26px;font-weight:700;color:#fff;letter-spacing:1px}
.live-score .ls-x{color:var(--mut2)}
.live-score .ls-clk{font-size:11px;color:var(--down);border:1px solid rgba(255,84,112,.3);padding:2px 8px;border-radius:5px;display:inline-flex;gap:6px;align-items:center}
.live-score .ls-clk::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--down);animation:pulse 1.1s infinite}
.card.is-live{border-color:rgba(255,84,112,.25)}
.card.is-live::before{background:linear-gradient(90deg,transparent,var(--down),transparent);opacity:.5}
.mkt-label{font-family:var(--mono);font-size:10px;color:var(--mut2);letter-spacing:1px;text-transform:uppercase;margin:14px 0 7px}
.odds-row.two{grid-template-columns:1fr 1fr}
.odds-row.totals .ol{text-transform:none;letter-spacing:0}
.q-title{font-size:16px;font-weight:600;line-height:1.3;margin-bottom:6px;min-height:42px}
.prob{font-family:var(--mono);font-size:11px;color:var(--green);margin-bottom:10px}
.card{background:linear-gradient(165deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:var(--r);padding:18px;position:relative;overflow:hidden;box-shadow:var(--sh1);transition:transform .22s var(--ease),border-color .22s,box-shadow .22s;animation:cardIn .5s var(--ease) both}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0;transition:.3s}
.card:hover{border-color:var(--line2);transform:translateY(-3px);box-shadow:var(--sh2)}
.card:hover::before{opacity:.7}
@keyframes cardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.grid .card:nth-child(1){animation-delay:.02s}.grid .card:nth-child(2){animation-delay:.06s}.grid .card:nth-child(3){animation-delay:.1s}.grid .card:nth-child(4){animation-delay:.14s}.grid .card:nth-child(5){animation-delay:.18s}.grid .card:nth-child(6){animation-delay:.22s}.grid .card:nth-child(n+7){animation-delay:.26s}
.card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.league{font-family:var(--mono);font-size:11px;color:var(--mut);letter-spacing:1px;text-transform:uppercase}
.badge-live{font-family:var(--mono);font-size:10px;color:var(--down);border:1px solid rgba(255,84,112,.35);padding:2px 7px;border-radius:5px;display:inline-flex;gap:5px;align-items:center}
.badge-live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--down);animation:pulse 1.2s infinite}
.badge-soon{font-family:var(--mono);font-size:10px;color:var(--mut);border:1px solid var(--line2);padding:2px 7px;border-radius:5px}
.badge-real{font-family:var(--mono);font-size:10px;color:var(--green);border:1px solid var(--green-deep);background:rgba(25,255,159,.07);padding:2px 8px;border-radius:5px}
.cat.real-tab{border-color:var(--green-deep)}
.cat.real-tab .arb-count{background:var(--green-deep);color:var(--green)}
.cat.real-tab.active{background:var(--green);color:#042015}
.match{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.team{display:flex;align-items:center;gap:9px;font-weight:600;font-size:16px}
.team .flag{font-size:20px}
.kick{font-family:var(--mono);font-size:11px;color:var(--mut2);margin:8px 0 14px}
.odds-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.odds-btn{background:#0a0f0d;border:1px solid var(--line);border-radius:11px;padding:11px 8px;cursor:pointer;text-align:center;transition:transform .12s var(--ease),border-color .14s,background .14s;position:relative}
.odds-btn:hover{border-color:var(--green);background:var(--green-deep);transform:translateY(-1px)}
.odds-btn:active{transform:scale(.96)}
.odds-btn .ol{font-size:10px;color:var(--mut);font-family:var(--mono);letter-spacing:.5px;display:block;margin-bottom:5px}
.odds-btn .ov{font-family:var(--mono);font-weight:700;font-size:18px;color:var(--ink);transition:color .3s}
.odds-btn .oa{font-size:10px;color:var(--mut2);font-family:var(--mono);display:block;margin-top:2px}
.odds-btn.up .ov{color:var(--up)} .odds-btn.down .ov{color:var(--down)}
.flash-up{animation:fu .6s} .flash-down{animation:fd .6s}
@keyframes fu{0%{background:rgba(19,255,157,.18)}100%{background:#0a0f0d}}
@keyframes fd{0%{background:rgba(255,84,112,.18)}100%{background:#0a0f0d}}
/* best-strip live flash — value moved at the winning venue */
.best-strip span.bs-up{animation:bsu .8s var(--ease)}
.best-strip span.bs-dn{animation:bsd .8s var(--ease)}
@keyframes bsu{0%{background:rgba(19,255,157,.22);border-color:rgba(19,255,157,.5)}100%{}}
@keyframes bsd{0%{background:rgba(255,84,112,.2);border-color:rgba(255,84,112,.45)}100%{}}

/* ── live terminal ── */
.terminal{background:#05080699;border:1px solid var(--line2);border-radius:12px;overflow:hidden;backdrop-filter:blur(4px)}
.term-bar{display:flex;align-items:center;gap:8px;padding:9px 14px;background:#0a0f0d;border-bottom:1px solid var(--line)}
.td{width:11px;height:11px;border-radius:50%}
.td.r{background:#ff5f57}.td.y{background:#febc2e}.td.g{background:#28c840}
.term-title{font-family:var(--mono);font-size:11.5px;color:var(--mut);margin-left:8px}
.term-stat{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--green);display:flex;align-items:center;gap:6px}
.term-stat::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 1.4s infinite}
.term-body{height:300px;overflow:hidden;padding:14px 16px;font-family:var(--mono);font-size:12.5px;line-height:1.85;display:flex;flex-direction:column;justify-content:flex-end}
.tl{display:flex;gap:12px;white-space:nowrap;animation:tlin .35s ease-out}
@keyframes tlin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.tl .tt{color:var(--mut2);flex:0 0 auto}
.tl .tlv{flex:0 0 64px;font-weight:700}
.tl .tx{color:#c3d3cc;overflow:hidden;text-overflow:ellipsis}
.tl.keeper .tlv{color:#7aa2ff}
.tl.line .tlv{color:var(--mut)}
.tl.fill .tlv{color:var(--green)} .tl.fill .tx{color:var(--green)}
.tl.order .tlv{color:var(--amber)}
.tl .up{color:var(--up)} .tl .dn{color:var(--down)}
.term-cursor{display:inline-block;color:var(--green);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* ── how ── */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.step{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r);padding:22px;position:relative}
.step-n{font-family:var(--mono);font-size:13px;color:var(--green);margin-bottom:14px;letter-spacing:1px}
.step h3{font-size:17px;margin-bottom:8px}
.step p{font-size:13.5px;color:var(--mut);line-height:1.6}

/* ── orders ── */
.feed-label{font-family:var(--mono);color:var(--green-dim);margin-right:6px}
.feed{color:var(--mut)}
.orders-wrap{display:flex;flex-direction:column;gap:10px}
.empty{color:var(--mut);font-family:var(--mono);font-size:13px;padding:30px;text-align:center;border:1px dashed var(--line);border-radius:var(--r)}
.order{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:14px 18px;transition:.16s}
.order.triggered{border-color:var(--green);box-shadow:0 0 0 1px var(--green-deep),0 0 28px -10px var(--green);animation:trig 2s infinite}
@keyframes trig{0%,100%{box-shadow:0 0 0 1px var(--green-deep),0 0 22px -12px var(--green)}50%{box-shadow:0 0 0 1px var(--green),0 0 34px -6px var(--green)}}
.order.filled{opacity:.7} .order.expired,.order.cancelled{opacity:.45}
.o-main .o-pick{font-weight:600;font-size:15px}
.side-pill{font-family:var(--mono);font-size:10px;font-weight:700;padding:2px 7px;border-radius:5px;margin-right:6px;vertical-align:middle}
.side-pill.buy{background:var(--green-deep);color:var(--green)}
.side-pill.sell{background:#2a1f0a;color:var(--amber)}
.o-main .o-sub{font-family:var(--mono);font-size:11.5px;color:var(--mut);margin-top:3px}
.o-target{font-family:var(--mono);text-align:right}
.o-target .ot-n{font-weight:700;font-size:16px;color:var(--ink)}
.o-target .ot-l{font-size:10px;color:var(--mut);display:block}
.o-status{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.tag{font-family:var(--mono);font-size:11px;padding:3px 9px;border-radius:6px;letter-spacing:.5px}
.tag.pending{background:#10221a;color:var(--green-dim)}
.tag.triggered{background:var(--green);color:#042015;font-weight:700}
.tag.filled{background:#13251c;color:var(--green)}
.tag.expired,.tag.cancelled{background:#1a1d1c;color:var(--mut)}
.o-act{display:flex;gap:7px}
.mini{font-family:var(--mono);font-size:11px;padding:5px 11px;border-radius:7px;border:1px solid var(--line2);background:transparent;color:var(--ink);cursor:pointer}
.mini:hover{border-color:var(--green);color:var(--green)}
.mini.go{background:var(--green);color:#042015;border-color:var(--green);font-weight:700}

/* ── modal ── */
.modal-bg{position:fixed;inset:0;background:rgba(2,5,4,.72);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;z-index:50;padding:18px;animation:fadeIn .2s ease}
.modal-bg.show{display:flex}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{background:linear-gradient(165deg,#0e1411,#0a0f0d);border:1px solid var(--line2);border-radius:20px;width:min(440px,100%);max-height:92vh;overflow-y:auto;padding:24px;position:relative;box-shadow:var(--sh2);animation:modalIn .32s var(--ease)}
@keyframes modalIn{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.modal-x{position:absolute;top:16px;right:16px;background:none;border:none;color:var(--mut);font-size:16px;cursor:pointer}
.modal-x:hover{color:var(--ink)}
.modal-head{margin-bottom:18px}
.modal-game{font-family:var(--mono);font-size:12px;color:var(--mut);letter-spacing:1px}
.modal-pick{font-size:22px;font-weight:700;margin-top:4px}
.side-toggle{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}
.side-btn{background:#0a0f0d;border:1px solid var(--line);border-radius:10px;padding:11px;cursor:pointer;color:var(--mut);font-family:var(--disp);font-weight:700;font-size:13px;letter-spacing:.5px;display:flex;flex-direction:column;gap:2px;transition:.15s}
.side-btn span{font-weight:400;font-size:10px;color:var(--mut2);letter-spacing:0}
.side-btn:hover{border-color:var(--line2)}
.side-btn.active{border-color:var(--green);color:var(--green);background:var(--green-deep)}
.side-btn.active span{color:var(--green-dim)}
.ladder{display:flex;flex-direction:column;gap:3px;margin-bottom:18px;font-family:var(--mono);font-size:11px}
.rung{display:flex;align-items:center;gap:8px}
.rung .rl{width:46px;text-align:right;color:var(--mut)}
.rung .rbar{height:14px;border-radius:3px;background:var(--green-deep);flex:0 0 auto;transition:width .3s}
.rung.target .rbar{background:var(--green);box-shadow:0 0 12px var(--green)}
.rung.target .rl{color:var(--green)}
.rung.cur .rbar{background:var(--amber)}
.rung.cur .rl{color:var(--amber)}
.modal-row{margin-bottom:16px}
.modal-row.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.modal-row label{display:block;font-size:12px;color:var(--mut);margin-bottom:8px}
.modal-row .hint{color:var(--mut2);font-size:11px}
.odds-set{display:flex;align-items:center;gap:16px}
input[type=range]{flex:1;accent-color:var(--green);height:4px}
.odds-val{font-family:var(--mono);text-align:right;min-width:78px}
.odds-val #mTargetDec{font-size:24px;font-weight:700;color:var(--green);display:block}
.odds-am{font-size:12px;color:var(--mut)}
.cur-line{font-family:var(--mono);font-size:12px;color:var(--mut);margin-top:10px}
.delta{color:var(--mut)} .delta.good{color:var(--green)} .delta.bad{color:var(--down)}
input[type=number],select{width:100%;background:#0a0f0d;border:1px solid var(--line2);border-radius:9px;padding:11px;color:var(--ink);font-family:var(--mono);font-size:15px}
input:focus,select:focus{outline:none;border-color:var(--green)}
.payout-box{display:flex;align-items:center;justify-content:space-between;background:#0a0f0d;border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin-bottom:16px;font-family:var(--mono)}
.payout-box span{font-size:12px;color:var(--mut)}
.payout-box b{font-size:18px;color:var(--green)}
/* defined-risk framing — a fixed-odds bet caps the downside at the stake */
.risk-box{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin:-8px 0 16px;padding:11px 16px;background:#080c0a;border:1px solid var(--line);border-top:none;border-radius:0 0 10px 10px;font-family:var(--mono)}
.risk-box .rb-item{display:flex;flex-direction:column;gap:2px}
.risk-box .rb-item span{font-size:10px;letter-spacing:.04em;color:var(--mut2);text-transform:uppercase}
.risk-box .rb-item b{font-size:16px;color:var(--ink);font-variant-numeric:tabular-nums}
.risk-box .rb-item.win{text-align:right}
.risk-box .rb-item.win b{color:var(--green)}
.risk-box .rb-arrow{color:var(--mut2);font-size:13px}
.risk-box .rb-note{grid-column:1/-1;font-family:var(--body);font-size:10.5px;color:var(--mut2);border-top:1px dashed var(--line);padding-top:8px;margin-top:2px}
.modal-foot{font-size:11px;color:var(--mut2);text-align:center;margin-top:12px}

/* ── toast ── */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(120px);background:var(--green);color:#042015;font-weight:600;padding:13px 22px;border-radius:11px;z-index:60;transition:.3s;box-shadow:0 12px 40px -8px var(--green);font-size:14px}
.toast.show{transform:translateX(-50%) translateY(0)}
.toast.err{background:var(--down);color:#fff;box-shadow:0 12px 40px -8px var(--down)}

/* ── tokenomics ── */
.token-lede{max-width:680px;color:#b9c8c1;font-size:16px;margin-bottom:28px}
.token-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-bottom:34px}
.tok-card{background:linear-gradient(160deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:var(--r);padding:22px}
.tok-ic{font-size:24px;margin-bottom:12px}
.tok-card h3{font-size:16px;margin-bottom:8px}
.tok-card p{font-size:13px;color:var(--mut);line-height:1.6}
.tok-card b{color:var(--green)}
.supply-bar{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.sb-head{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);margin-bottom:14px}
.sb-head span{color:var(--mut);font-size:13px} .sb-head b{font-size:16px}
.sb-track{display:flex;height:34px;border-radius:9px;overflow:hidden;gap:2px}
.sb-seg{display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10.5px;color:#042015;font-weight:700;overflow:hidden;white-space:nowrap}
.sb-seg span{padding:0 4px;text-overflow:ellipsis;overflow:hidden}
.sb-seg.s1{background:var(--green)} .sb-seg.s2{background:var(--green-dim)} .sb-seg.s3{background:#0e8f5c} .sb-seg.s4{background:#0a6e47}
.sb-legend{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;font-family:var(--mono);font-size:11.5px;color:var(--mut)}
.sb-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:7px;vertical-align:middle}
.sb-legend .d1{background:var(--green)} .sb-legend .d2{background:var(--green-dim)} .sb-legend .d3{background:#0e8f5c} .sb-legend .d4{background:#0a6e47}
.token-foot{margin-top:18px;font-family:var(--mono);font-size:12px;color:var(--mut2)}

/* ── footer ── */
.foot{max-width:var(--maxw);margin:90px auto 0;padding:40px clamp(16px,4vw,40px);border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.foot-brand{font-weight:700;font-size:18px;display:flex;align-items:center;gap:8px}
.foot-note{color:var(--mut);font-size:13px}
.foot-disc{color:var(--mut2);font-size:11.5px;font-family:var(--mono)}

/* ── loading skeletons ── */
.skel-card{height:230px;border-radius:var(--r);border:1px solid var(--line);background:linear-gradient(100deg,var(--panel2) 30%,#141b16 50%,var(--panel2) 70%);background-size:200% 100%;animation:shimmer 1.3s linear infinite}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}

/* ── responsive ── */
@media(max-width:860px){
  .nav-links{gap:16px}
  .nav-links a[href="#orders"],.nav-links a[href="#tape"]{display:none}
}
@media(max-width:640px){
  .nav-links a:not(.kpi){display:none}
  #navBlock{display:none}
  .hero{padding-top:34px}
  .hero-stats{gap:20px 28px}
  .hstat-n{font-size:22px}
  .cat-tabs{gap:6px;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:none}
  .cat-tabs::-webkit-scrollbar{display:none}
  .cat{flex:0 0 auto}
  .grid{grid-template-columns:1fr}
  .order{grid-template-columns:1fr auto;gap:10px}
  .o-target{display:none}
  .term-body{height:240px;font-size:11px}
  .modal{padding:20px;border-radius:18px}
  .sb-legend{font-size:10.5px;gap:10px}
  .portfolio .pf{min-width:50%}
}
@media(hover:none){.card:hover{transform:none}}

/* ════════════ PREMIUM DASHBOARD REDESIGN ════════════ */
:root{
  --mut:#8ea49b; --mut2:#637067;            /* brighter metadata */
  --acc-soccer:#19ff9f; --acc-nba:#ff9d3d; --acc-nfl:#4d9bff; --acc-ufc:#ff5470; --acc-pred:#a779ff;
}
/* grid: more intentional + modular */
#grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(312px,1fr));gap:18px}

/* filters: polished pill group */
.cat-tabs{gap:7px;padding:6px;background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.005));border:1px solid var(--line);border-radius:14px;width:fit-content;max-width:100%}
.cat{border:1px solid transparent;background:transparent;color:var(--mut);padding:9px 15px;font-weight:600}
.cat:hover{background:rgba(255,255,255,.04);color:var(--ink)}
.cat.active{box-shadow:0 6px 18px -8px var(--green)}

/* cards: layered surfaces, depth, category accent — kills sameness */
.card{background:
   radial-gradient(120% 80% at 100% 0,rgba(255,255,255,.035),transparent 50%),
   linear-gradient(168deg,#121a15,#0b110e);
  border:1px solid var(--line);border-radius:18px;padding:17px 17px 15px;box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 30px -18px rgba(0,0,0,.7)}
.card::after{content:"";position:absolute;top:14px;left:0;width:3px;height:20px;border-radius:0 3px 3px 0;background:var(--accc,var(--green));box-shadow:0 0 12px -2px var(--accc,var(--green));opacity:.9}
.card[data-acc=soccer]{--accc:var(--acc-soccer)} .card[data-acc=nba]{--accc:var(--acc-nba)}
.card[data-acc=nfl]{--accc:var(--acc-nfl)} .card[data-acc=ufc]{--accc:var(--acc-ufc)} .card[data-acc=pred]{--accc:var(--acc-pred)}
.card:hover{transform:translateY(-4px);box-shadow:0 24px 60px -24px rgba(0,0,0,.85),0 0 0 1px var(--line2)}

/* header hierarchy + contrast */
.league{font-size:11px;color:#aebfb7;letter-spacing:.4px;font-weight:600;display:inline-flex;align-items:center;gap:7px}
.card-top{margin-bottom:13px;padding-left:8px}
.match{padding-left:8px}
.team{font-size:16.5px;letter-spacing:-.01em}

/* odds = focal point, in a layered tray */
.mkt-label{color:#7f9189;font-size:9.5px;letter-spacing:1.4px;margin:13px 0 7px;padding-left:8px;font-weight:600}
.odds-row{padding:5px;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.15));border:1px solid var(--line);border-radius:13px;gap:5px}
.odds-btn{background:linear-gradient(180deg,#0e150f,#0a0f0c);border-color:#1f2b24}
.odds-btn .ov{font-size:18.5px;letter-spacing:-.02em}
.odds-btn .ol{color:#7d8f87;font-weight:600}

/* metadata footer — higher contrast, cleaner */
.card-stats{margin-top:13px;padding:11px 8px 2px;border-top:1px solid var(--line);font-size:11px;color:#7f9189}
.card-stats b{color:#cdded6}
.best-strip span{background:linear-gradient(180deg,#0e150f,#0a100d);border-color:#1f2b24}
.juice{background:linear-gradient(90deg,rgba(25,255,159,.06),transparent);border-color:var(--green-deep)}

/* live game cards: stronger, distinct */
.card.is-live::after{background:var(--down);box-shadow:0 0 14px -1px var(--down);animation:pulse 1.4s infinite}
.live-score .ls-n{font-size:30px}

/* ── FEATURED top-opportunity card ── */
.featured{grid-column:span 2;background:
   radial-gradient(90% 120% at 100% 0,rgba(25,255,159,.12),transparent 55%),
   linear-gradient(150deg,#13201a,#0a120e);
  border-color:var(--green-deep);box-shadow:0 30px 70px -30px rgba(25,255,159,.35),0 0 0 1px rgba(25,255,159,.08) inset;padding:0;overflow:hidden}
.featured::after{display:none}
.featured:hover{transform:translateY(-4px);box-shadow:0 40px 90px -34px rgba(25,255,159,.45)}
.feat-ribbon{position:absolute;top:16px;left:18px;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:1.5px;color:#042015;background:var(--green);padding:4px 11px;border-radius:7px;box-shadow:0 6px 18px -6px var(--green);z-index:2}
.feat-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:0}
.feat-left{padding:48px 26px 26px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;border-right:1px solid var(--line)}
.feat-title{font-family:var(--disp);font-weight:800;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.03em;line-height:1.04;color:#f4f0e6;margin-top:2px}
.feat-live{color:var(--down);font-weight:700}
.feat-spread{display:flex;flex-direction:column;gap:2px;margin-top:6px}
.feat-spread b{font-family:var(--mono);font-size:clamp(34px,4vw,46px);font-weight:700;color:var(--green);line-height:1;text-shadow:0 0 30px rgba(25,255,159,.4)}
.feat-spread span{font-size:12px;color:#8ea49b}
.feat-meta{font-family:var(--mono);font-size:11.5px;color:#8ea49b}.feat-meta b{color:#cdded6}
.feat-cta{margin-top:8px}
.feat-right{padding:48px 26px 26px;background:rgba(0,0,0,.22)}
.feat-tbl-label{font-family:var(--mono);font-size:9.5px;letter-spacing:1.4px;color:#7f9189;text-transform:uppercase;margin-bottom:10px}
.feat-right .book-tbl td{padding:7px 6px;font-size:12.5px}
.feat-right .book-tbl th{font-size:10px}

@media(max-width:760px){
  .featured{grid-column:span 1}
  .feat-grid{grid-template-columns:1fr}
  .feat-left{border-right:none;border-bottom:1px solid var(--line);padding:44px 20px 22px}
  .feat-right{padding:20px}
}

/* ════════════ HERO v2 — depth, panel, stats module, brand ════════════ */
/* layered background depth */
.depth-vignette{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(130% 90% at 50% -10%,transparent 42%,rgba(0,0,0,.55) 100%),
             radial-gradient(70% 55% at 82% 6%,rgba(25,255,159,.06),transparent 60%),
             radial-gradient(60% 50% at 12% 30%,rgba(25,255,159,.045),transparent 60%)}
.depth-noise{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.04;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* "best juice" — signature brand moment */
.hero-sub .hl{position:relative;color:var(--green);text-shadow:0 0 36px rgba(25,255,159,.55)}
.hero-sub .hl::after{content:"";position:absolute;left:0;right:0;bottom:.08em;height:3px;border-radius:3px;
  background:linear-gradient(90deg,transparent,var(--green),transparent);
  filter:drop-shadow(0 0 8px var(--green));animation:juiceSweep 3.4s var(--ease) infinite}
@keyframes juiceSweep{0%{opacity:.3;transform:scaleX(.4)}50%{opacity:1;transform:scaleX(1)}100%{opacity:.3;transform:scaleX(.4)}}

/* stats: structured dashboard module */
.stats-module{margin:34px 0 0;width:fit-content;max-width:100%;background:linear-gradient(165deg,rgba(255,255,255,.05),rgba(255,255,255,.012));border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 18px 44px -28px rgba(0,0,0,.8);backdrop-filter:blur(10px);overflow:hidden}
.stats-head{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 18px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:10px;letter-spacing:1.6px;color:#8ea49b;background:rgba(0,0,0,.2)}
.sm-net{display:inline-flex;align-items:center;gap:6px;color:var(--green)}
.sm-net .ld{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 1.3s infinite}
.hero-stats{margin:0;padding:16px 6px;gap:0}
.hero-stats .hstat{padding:0 clamp(16px,2.4vw,30px)}
.hero-stats .hstat+.hstat{border-left:1px solid var(--line)}
.hstat-n{font-size:clamp(19px,2vw,24px)}
.hstat-l{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:#7f9189}

/* bigger live product panel */
.hero-visual{align-self:stretch;display:flex}
.hv-card{width:100%;display:flex;flex-direction:column}
.hv-body{padding:18px 18px 6px}
.hv-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.hv-game{font-family:var(--disp);font-weight:800;font-size:18px;letter-spacing:-.02em;color:#f4f0e6}
.hv-meta{font-family:var(--mono);font-size:10.5px;color:#7f9189;margin-top:3px}
.hv-livedot{color:var(--down)}
.hv-spread{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.hv-spread b{font-family:var(--mono);font-size:30px;font-weight:700;color:var(--green);line-height:1;text-shadow:0 0 22px rgba(25,255,159,.45)}
.hv-spread span{font-family:var(--mono);font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase;color:#7f9189}
.hv-grid{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12.5px}
.hv-grid th{text-align:right;color:#7f9189;font-weight:500;font-size:9.5px;padding:4px 6px;text-transform:uppercase}
.hv-grid th:first-child{text-align:left}
.hv-grid td{text-align:right;padding:7px 6px;color:#9fb0a8;border-top:1px solid var(--line);transition:background .5s}
.hv-grid td.bk{text-align:left;font-weight:600}
.hv-grid td.is-best{color:var(--green);font-weight:700;background:rgba(25,255,159,.1);border-radius:5px}
.hv-cta{width:100%;margin:14px 0 0;padding:12px;border:none;border-radius:11px;cursor:pointer;font-family:var(--disp);font-weight:700;font-size:14px;color:#042015;background:linear-gradient(180deg,#2bffab,var(--green));box-shadow:0 10px 26px -12px var(--green);transition:transform .18s var(--ease),box-shadow .25s}
.hv-cta:hover{transform:translateY(-2px);box-shadow:0 16px 38px -12px var(--green)}
.hv-foot-bar{display:flex;align-items:center;justify-content:space-between;padding:11px 18px;border-top:1px solid var(--line);background:rgba(0,0,0,.25);font-family:var(--mono);font-size:10.5px;color:#7f9189}
.hv-foot-bar b{color:#cdded6}
.hv-fb-arb{color:var(--green)}.hv-fb-arb b{color:var(--green)}

@media(max-width:920px){
  .hero-grid{grid-template-columns:1fr;gap:30px}
  .hero-visual{max-width:520px}
}

.stats-module .hero-stats{flex-wrap:nowrap}

/* ════════════ TERMINAL REFINE — depth, interactivity, less noise ════════════ */
/* quieter single top strip */
.scorebar{min-height:33px;background:rgba(4,12,8,.55);backdrop-filter:saturate(1.3) blur(10px);border-bottom:1px solid var(--line)}
.sc{padding:7px 16px;font-size:11.5px;border-right-color:rgba(255,255,255,.04)}
.sc .sc-score{color:#eafff5}

/* arb scanner — dimensional + interactive */
.hv-card{position:relative;border-color:#243229;
  box-shadow:0 34px 80px -36px rgba(0,0,0,.92),0 0 0 1px rgba(25,255,159,.06) inset,0 -40px 80px -60px var(--green) inset}
.hv-card::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(180deg,rgba(25,255,159,.05),transparent 16%)}
.hv-card::after{content:"";position:absolute;left:0;right:0;top:0;height:46%;pointer-events:none;z-index:2;
  background:linear-gradient(180deg,rgba(25,255,159,.07),transparent);transform:translateY(-100%);animation:scan 5s var(--ease) infinite}
@keyframes scan{0%{transform:translateY(-100%)}55%,100%{transform:translateY(240%)}}
.hv-grid tr{transition:background .15s}
.hv-grid tr:hover{background:rgba(255,255,255,.035)}
.hv-grid tr:hover td.is-best{background:rgba(25,255,159,.16)}
.hv-dots{display:flex;gap:6px;justify-content:center;margin:14px 0 2px}
.hv-dot{width:6px;height:6px;border-radius:50%;background:var(--line2);cursor:pointer;transition:.25s var(--ease)}
.hv-dot:hover{background:var(--mut)}
.hv-dot.on{background:var(--green);box-shadow:0 0 9px var(--green);width:18px;border-radius:3px}

/* stats module — integrated, animated scan line */
.stats-head{position:relative;overflow:hidden}
.stats-head::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:38%;
  background:linear-gradient(90deg,transparent,var(--green),transparent);animation:scanx 3.6s linear infinite;opacity:.7}
@keyframes scanx{0%{transform:translateX(-130%)}100%{transform:translateX(340%)}}
.stats-module:hover{border-color:var(--line2)}

/* ════════════ PRODUCTION POLISH (audit pass 2026-06-22) ════════════ */
/* — blueprint coordinate grid behind the whole layout (faint system texture) — */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(25,255,159,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(25,255,159,.035) 1px,transparent 1px),
    linear-gradient(rgba(25,255,159,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(25,255,159,.018) 1px,transparent 1px);
  background-size:240px 240px,240px 240px,48px 48px,48px 48px;
  mask-image:radial-gradient(130% 100% at 50% 0,#000 30%,transparent 85%)}

/* — right-side scanner: more dimensional, floating, stronger glow — */
.hv-card{box-shadow:0 30px 80px -34px rgba(0,0,0,.92),0 0 0 1px rgba(25,255,159,.10),0 0 60px -30px rgba(25,255,159,.4);transition:box-shadow .4s var(--ease),transform .4s var(--ease)}
.hv-card:hover{transform:translateY(-3px);box-shadow:0 44px 100px -34px rgba(0,0,0,.95),0 0 0 1px rgba(25,255,159,.18),0 0 80px -28px rgba(25,255,159,.55)}
.hv-grid td{padding:8px 6px}            /* roomier rows */
.hv-grid tr td{border-top:1px solid rgba(25,255,159,.06)}

/* — stats module: modular chips instead of divider columns — */
.stats-module .hero-stats{padding:14px;gap:10px;flex-wrap:wrap}
.hero-stats .hstat{padding:12px 16px;min-width:88px;border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.01));
  border:1px solid var(--line);box-shadow:0 1px 0 rgba(255,255,255,.04) inset}
.hero-stats .hstat+.hstat{border-left:1px solid var(--line)}   /* keep full border per chip */
.hstat-n{color:#f6fffb}

/* — real live-activity chip in the stats header — */
.sm-live{display:inline-flex;align-items:center;gap:6px;color:var(--green);font-family:var(--mono);font-size:10px;letter-spacing:.6px}
.sm-live .ld{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 1.3s infinite}

/* — top scorebar: quieter, faded into the background — */
.scorebar{opacity:.62;min-height:34px;background:#040d09;filter:saturate(.85)}
.scorebar:hover{opacity:1}
.scorebar::after{content:"";position:absolute;top:0;right:0;bottom:0;width:80px;pointer-events:none;background:linear-gradient(90deg,transparent,#040d09)}

/* — SIM badge: honest, muted amber so simulated demo markets read as demo — */
.badge-sim{font-family:var(--mono);font-size:10px;color:#d9a441;border:1px solid rgba(217,164,65,.35);background:rgba(217,164,65,.08);padding:2px 7px;border-radius:5px;letter-spacing:.5px;margin-right:5px}

/* — accessibility: focusable odds buttons + visible focus ring — */
.odds-btn:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-color:var(--green)}
.cat:focus-visible,.btn:focus-visible,.mini:focus-visible{outline:2px solid var(--green);outline-offset:2px}

/* — bigger tap targets on touch (modal close, scanner dots) — */
.modal-x{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:9px;font-size:18px}
.modal-x:hover{background:rgba(255,255,255,.06)}
.hv-dot{padding:8px;margin:-4px;cursor:pointer}

/* — connection state: amber when reconnecting — */
.term-stat.off{color:#d9a441}
.term-stat.off::before{background:#d9a441;box-shadow:0 0 8px #d9a441}

/* — narrow phones: let wide book tables scroll instead of clipping — */
@media(max-width:520px){
  .card .book-tbl,.feat-right .book-tbl,.hv-grid{display:block;overflow-x:auto;white-space:nowrap}
  .hero-stats .hstat{flex:1 1 40%}
}
.feat-sim{position:absolute;top:16px;right:18px;z-index:2}

/* ── wallet connect button ── */
.btn-connect{font-family:var(--mono);font-size:12px;font-weight:700;padding:8px 16px;border-radius:9px;border:1px solid var(--green);background:linear-gradient(180deg,rgba(25,255,159,.16),rgba(25,255,159,.06));color:var(--green);cursor:pointer;transition:transform .15s var(--ease),box-shadow .2s;white-space:nowrap}
.btn-connect:hover{transform:translateY(-1px);box-shadow:0 8px 22px -10px var(--green)}
.btn-connect.on{background:rgba(255,255,255,.04);border-color:var(--line2);color:var(--ink)}
.btn-connect.on::before{content:"●";color:var(--green);margin-right:6px;font-size:9px;vertical-align:middle}

/* ── bet-at-book outbound links (line-shopping payoff) ── */
.bet-outs{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-top:4px}
.bet-outs-l{font-family:var(--mono);font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:#7f9189;width:100%}
.bet-out{font-family:var(--mono);font-size:11.5px;color:#cdded6;text-decoration:none;padding:6px 10px;border-radius:8px;border:1px solid var(--line2);background:rgba(0,0,0,.25);transition:border-color .15s,color .15s,transform .12s}
.bet-out b{color:var(--green)}
.bet-out:hover{border-color:var(--green);color:#fff;transform:translateY(-1px)}

/* ════════════ CREDIBILITY POLISH (2026-06-22) ════════════ */
/* — data provenance + freshness strip under the board head — */
.data-prov{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;color:#8ea49b;margin:-6px 0 16px;padding:8px 12px;background:linear-gradient(180deg,rgba(255,255,255,.02),transparent);border:1px solid var(--line);border-radius:10px;width:fit-content;max-width:100%}
.data-prov .dp-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 1.5s infinite;flex:0 0 auto}
.data-prov b{color:#cdded6;font-weight:600}
.dp-src{color:#9fb0a8}
.dp-sep{color:#3a463f}
#dpFresh{color:var(--green)}

/* — tabular figures everywhere odds/numbers live (pro alignment) — */
.ov,.oa,.book-tbl td,.hv-grid td,.hstat-n,.ot-n,.feat-spread b,.hv-spread b,.arb-spread-big,.o-target .ot-n{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}

/* — featured: tighter, calmer, more credible — */
.feat-spread b{text-shadow:0 0 24px rgba(25,255,159,.28)}    /* dial back the neon */
.feat-spread span{max-width:340px;line-height:1.35}
.hero-sub .hl{text-shadow:0 0 26px rgba(25,255,159,.4)}       /* calmer hero glow */

/* — upgraded footer — */
.foot{display:block;padding:46px 0 30px;border-top:1px solid var(--line);margin-top:40px}
.foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:32px;max-width:1100px;margin:0 auto;padding:0 24px}
.foot-brand-col .foot-brand{font-family:var(--disp);font-weight:800;font-size:24px;display:flex;align-items:center;gap:9px}
.foot-tag{color:#8ea49b;font-size:13px;margin-top:8px}
.foot-h{font-family:var(--mono);font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#637067;margin-bottom:12px}
.foot-col a{display:block;color:#9fb0a8;text-decoration:none;font-size:13px;padding:4px 0;transition:color .15s}
.foot-col a:hover{color:var(--green)}
.foot-trust{color:#9fb0a8;font-size:12.5px;line-height:1.5}
.foot-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;max-width:1100px;margin:30px auto 0;padding:20px 24px 0;border-top:1px solid var(--line);font-size:11.5px;color:#637067;font-family:var(--mono)}
.foot-src{color:#8ea49b}
.foot-disc{max-width:560px;text-align:right}
@media(max-width:760px){.foot-top{grid-template-columns:1fr 1fr;gap:24px}.foot-bottom{flex-direction:column}.foot-disc{text-align:left}}

/* ── +EV value finder ── */
.cat.value-tab{color:#13ff9d}
.cat.value-tab.active{box-shadow:0 6px 18px -8px #13ff9d}
.val-badge{font-family:var(--mono);font-size:10px;font-weight:700;color:#042015;background:linear-gradient(180deg,#36ffb0,#10c97c);padding:2px 7px;border-radius:5px;box-shadow:0 4px 12px -4px var(--green)}
.val-badge.sm{font-size:9.5px}
.val-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px;padding:9px 11px;border-radius:10px;background:linear-gradient(90deg,rgba(25,255,159,.12),rgba(25,255,159,.03));border:1px solid rgba(25,255,159,.28);font-size:12px;color:#cdded6}
.val-line b{color:var(--green);font-family:var(--mono);font-size:13px}
.val-line span{color:#9fb0a8;font-family:var(--mono);font-size:11px}
.val-line span i{color:#7f9189;font-style:normal}
.vl-bet{margin-left:auto;font-family:var(--mono);font-size:11px;font-weight:700;color:#042015;background:var(--green);padding:4px 10px;border-radius:7px;text-decoration:none;white-space:nowrap;transition:transform .12s}
.vl-bet:hover{transform:translateY(-1px)}

/* ── $JUICE token page ── */
.tk-hero{max-width:860px;margin:0 auto;padding:90px 24px 30px;text-align:center;position:relative}
.tk-hero .eyebrow{justify-content:center;display:inline-flex}
.tk-h1{font-family:var(--disp);font-weight:800;font-size:clamp(56px,11vw,128px);letter-spacing:-.04em;line-height:.9;margin:14px 0 6px;background:linear-gradient(180deg,#f6fffb,#36ffb0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 60px rgba(25,255,159,.25)}
.tk-lede{font-size:clamp(16px,2vw,20px);color:#bccfc6;line-height:1.55;max-width:720px;margin:10px auto 0}
.tk-lede b{color:var(--green)}
.tk-status{font-family:var(--mono);font-size:12px;color:#8ea49b;margin-top:20px;padding:10px 16px;border:1px solid var(--line);border-radius:10px;display:inline-block}
.flywheel{display:flex;align-items:stretch;gap:12px;flex-wrap:wrap;justify-content:center}
.fw-step{flex:1 1 200px;max-width:260px;background:linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:16px;padding:22px 18px;position:relative}
.fw-step.accent{border-color:var(--green-deep);background:radial-gradient(120% 90% at 100% 0,rgba(25,255,159,.12),transparent 55%),linear-gradient(168deg,#13201a,#0a120e);box-shadow:0 24px 60px -30px rgba(25,255,159,.35)}
.fw-n{font-family:var(--mono);font-size:11px;color:var(--green);letter-spacing:2px}
.fw-ic{font-size:28px;margin:8px 0 6px}
.fw-step h3{font-family:var(--disp);font-size:18px;margin-bottom:6px}
.fw-step p{font-size:13px;color:#9fb0a8;line-height:1.5}
.fw-arrow{align-self:center;color:var(--green);font-size:22px;opacity:.6}
.rd-live{font-family:var(--mono);font-size:10px;color:var(--green);margin-left:8px;vertical-align:middle}
@media(max-width:760px){.fw-arrow{display:none}.flywheel{flex-direction:column;align-items:stretch}.fw-step{max-width:none}}

/* ── nav active / scroll-spy highlight ── */
.nav-links a.active{color:var(--green)}
.nav-links a[href^="#"]{position:relative;transition:color .15s}
.nav-links a[href^="#"].active::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;border-radius:2px;background:var(--green);box-shadow:0 0 8px var(--green)}

/* ── calmer background: one clean ambient layer (audit 2026-06-22) ── */
.stadium-bg{display:none}              /* drop the stadium photo — terminal, not a stadium */
.depth-noise{display:none}             /* drop turbulence — it muddied text */
.depth-vignette{background:radial-gradient(125% 90% at 50% -10%,transparent 48%,rgba(0,0,0,.5) 100%),radial-gradient(60% 50% at 80% 4%,rgba(25,255,159,.05),transparent 62%)}
body::before{background-image:linear-gradient(rgba(25,255,159,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(25,255,159,.025) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(120% 95% at 50% 0,#000 35%,transparent 88%)}

/* ── SVG icon set (replaces emoji — crisp, consistent) ── */
.tok-ic,.fw-ic{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:11px;background:linear-gradient(180deg,rgba(25,255,159,.1),rgba(25,255,159,.02));border:1px solid rgba(25,255,159,.2);margin-bottom:12px}
.tok-ic svg,.fw-ic svg{width:22px;height:22px;stroke:var(--green);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tok-ic svg[fill="currentColor"],.fw-ic svg[fill="currentColor"]{color:var(--green);stroke:none}
.icn{display:inline-block;vertical-align:-2px;width:14px;height:14px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.icn.fill{fill:currentColor;stroke:none}

/* icon sizing inside badges/lines/tabs */
.j-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7c4dff;box-shadow:0 0 6px rgba(124,77,255,.7);vertical-align:middle}
.juice .icn,.val-line>.icn{stroke:var(--green);color:var(--green);width:15px;height:15px;flex:0 0 auto}
.val-badge .icn,.arb-badge .icn{width:11px;height:11px;vertical-align:-1px}
.cat .icn{width:13px;height:13px;vertical-align:-2px;margin-right:2px}

/* pre-launch chip on token page */
.tk-pre{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.5px;color:#d9a441;background:rgba(217,164,65,.1);border:1px solid rgba(217,164,65,.3);padding:6px 14px;border-radius:8px;margin:4px 0 14px}
.arb-note{margin-top:9px;font-size:10.5px;color:#7f9189;line-height:1.4;border-top:1px solid var(--line);padding-top:8px}

/* ── book table readability + calmer glow (audit 2026-06-22) ── */
.book-tbl td.is-worst{color:inherit;opacity:1}      /* stop making legit odds look "broken" red */
.book-tbl tr:nth-child(even) td{background:rgba(255,255,255,.012)}
.book-tbl td{padding:7px 7px}                        /* roomier rows */
.book-tbl td.is-best{box-shadow:none}                /* highlight by colour only, no glow */
.hv-grid td.is-best{box-shadow:none}
/* reserve glow for the primary CTA + live dots; calm the rest */
.val-badge{box-shadow:none}
.arb-badge.sm{box-shadow:none}
.cat.active{box-shadow:0 4px 14px -8px var(--green)}

/* ── THE ODDS STACK — every venue, sorted sharpest-first ── */
.dt-sec-n{color:var(--mut2);font-weight:500;font-size:11px;letter-spacing:0}
.odds-stack{display:flex;flex-direction:column;gap:3px;font-family:var(--mono)}
.os-cons{margin-bottom:11px}
.os-cons-bar{display:flex;height:9px;border-radius:6px;overflow:hidden;background:#0a0f0d;border:1px solid var(--line)}
.os-cons-bar span{height:100%;transition:width .7s var(--ease)}
.os-cons-bar span+span{box-shadow:-1px 0 0 rgba(0,0,0,.5)}
.os-cons-l{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:7px;font-size:10.5px;color:var(--mut)}
.os-cons-t{color:var(--mut2);text-transform:uppercase;letter-spacing:.05em;font-size:9.5px}
.os-cons-l i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px;vertical-align:middle}
.os-row{display:grid;grid-template-columns:1fr auto 74px;align-items:center;gap:10px;padding:7px 11px;background:var(--panel2);border:1px solid var(--line);border-radius:9px;animation:osIn .42s var(--ease) both}
.os-row:not(.os-head):hover{border-color:var(--line2)}
.os-head{background:transparent;border:none;padding:0 11px 1px;animation:none}
.os-head .os-bk{color:var(--mut2);font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:500}
.os-head .os-vig{color:var(--mut2);font-size:9.5px;text-transform:uppercase;letter-spacing:.05em}
.os-bk{display:flex;align-items:center;gap:7px;font-weight:600;font-size:12.5px;color:var(--ink);min-width:0}
.os-bn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.os-dot{width:7px;height:7px;border-radius:50%;flex:none;box-shadow:0 0 7px -1px currentColor}
.os-sharp{flex:none;font-size:8px;letter-spacing:.05em;background:rgba(19,255,157,.12);color:var(--green);padding:2px 5px;border-radius:4px;font-weight:700}
.os-odds{display:grid;grid-template-columns:repeat(var(--cols),64px);gap:6px}
.os-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 0;border-radius:7px;position:relative}
.os-cell b{font-size:14px;color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums;line-height:1.1}
.os-cell .os-am{font-size:9px;color:var(--mut2);font-variant-numeric:tabular-nums}
.os-cell.hi{background:rgba(19,255,157,.1)}
.os-cell.hi b{color:var(--green)}
.os-cell.lo b{color:var(--mut)}
.os-up{position:absolute;top:1px;right:5px;font-size:7px;color:var(--green);opacity:.85}
.os-cell.os-h{padding:0;font-size:10px;color:var(--mut2);font-weight:600}
.os-vig{font-size:10px;color:var(--mut);display:flex;flex-direction:column;align-items:flex-end;gap:3px;font-variant-numeric:tabular-nums}
.os-vig-bar{width:54px;height:3px;background:#0a0f0d;border-radius:2px;overflow:hidden}
.os-vig-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--green-dim),var(--green));border-radius:2px;transition:width .6s var(--ease)}
.os-best{background:linear-gradient(90deg,rgba(19,255,157,.09),rgba(19,255,157,.02));border-color:rgba(19,255,157,.28);position:relative;overflow:hidden}
.os-best::after{content:"";position:absolute;top:0;bottom:0;width:40%;background:linear-gradient(90deg,transparent,rgba(19,255,157,.1),transparent);animation:osSheen 4.5s var(--ease) infinite;pointer-events:none}
@keyframes osSheen{0%{left:-45%}55%,100%{left:120%}}
@media(prefers-reduced-motion:reduce){.os-best::after{animation:none;display:none}}
.os-best .os-bk{color:var(--green);font-weight:700;letter-spacing:.03em}
.os-best .os-cell.hi{background:transparent}
.os-best .os-at{font-size:8.5px;color:var(--mut);display:block;margin-top:1px}
.os-best-tag{color:var(--green-dim);font-size:9px;text-transform:uppercase;letter-spacing:.04em;align-items:flex-end}
/* best-execution guarantee microcopy under the BEST LINE pin */
.os-exec{display:flex;gap:8px;align-items:flex-start;margin:-4px 0 9px;padding:9px 11px;border:1px solid rgba(19,255,157,.18);border-radius:9px;background:rgba(19,255,157,.04);font-size:11px;line-height:1.45;color:var(--mut)}
.os-exec-ic{flex:none;width:15px;height:15px;border-radius:50%;background:rgba(19,255,157,.16);color:var(--green);display:grid;place-items:center;font-size:9px;font-weight:700;margin-top:1px}
.os-exec b{color:var(--green);font-family:var(--mono);font-variant-numeric:tabular-nums}
@keyframes osIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.odds-stack.live .os-row{animation:none}   /* no re-stagger on live refresh — just flash moves */
.os-tick-up{animation:osTickUp .95s var(--ease)}
.os-tick-dn{animation:osTickDn .95s var(--ease)}
@keyframes osTickUp{0%{background:rgba(19,255,157,.32);box-shadow:0 0 0 1px rgba(19,255,157,.5)}100%{background:transparent;box-shadow:none}}
@keyframes osTickDn{0%{background:rgba(255,84,112,.3);box-shadow:0 0 0 1px rgba(255,84,112,.45)}100%{background:transparent;box-shadow:none}}
.os-tick-up.hi,.os-tick-dn.hi{background:rgba(19,255,157,.1)}
@media(max-width:560px){
  .os-odds{grid-template-columns:repeat(var(--cols),52px);gap:4px}
  .os-row{grid-template-columns:1fr auto 30px;gap:7px;padding:7px 9px}
  .os-vig-bar{display:none}
  .os-cell b{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.os-row{animation:none}.os-cons-bar span,.os-vig-bar i{transition:none}}
.juice{box-shadow:none}

/* ── methodology / transparency cards ── */
.method-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.method-card{background:linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:16px;padding:22px 20px}
.method-k{font-family:var(--mono);font-size:10px;letter-spacing:1.6px;color:var(--green);margin-bottom:10px}
.method-card h3{font-family:var(--disp);font-size:17px;margin-bottom:8px;letter-spacing:-.01em}
.method-card p{font-size:13.5px;color:#9fb0a8;line-height:1.55}
.method-card b{color:#cdded6}

/* ── why-juice positioning strip ── */
.why-juice{margin-top:22px;padding:20px 24px;border-radius:14px;border:1px solid var(--green-deep);background:linear-gradient(90deg,rgba(25,255,159,.06),transparent);font-size:15px;line-height:1.6;color:#bccfc6}
.why-juice b{color:var(--green)}
.why-k{display:block;font-family:var(--mono);font-size:10px;letter-spacing:1.6px;color:var(--green);margin-bottom:8px}

/* ── FAQ accordion ── */
.faq{max-width:780px;display:flex;flex-direction:column;gap:8px}
.faq details{border:1px solid var(--line);border-radius:12px;background:linear-gradient(168deg,#121a15,#0b110e);overflow:hidden}
.faq summary{padding:16px 20px;cursor:pointer;font-family:var(--disp);font-weight:700;font-size:15.5px;color:#eafff5;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--green);font-size:20px;font-weight:400;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details[open] summary{border-bottom:1px solid var(--line)}
.faq p{padding:14px 20px 18px;font-size:14px;color:#9fb0a8;line-height:1.6}

/* ════════════ UI POLISH (parallel audit 2026-06-22) ════════════ */
/* active pill: always dark ink so the label never goes green-on-green (mobile contrast bug) */
.cat.active,.cat.value-tab.active,.cat.real-tab.active,.cat.arb.active{color:#042015;font-weight:700}
.cat.active .icn{stroke:#042015}.cat.active .icn.fill{color:#042015}
.cat.active .ld{background:#042015 !important;box-shadow:none !important}

/* My alerts empty state — real presence instead of a stranded line */
#orders .orders-wrap .empty{padding:44px 30px;display:flex;flex-direction:column;align-items:center;gap:12px;
  background:linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:18px;text-align:center;color:#9fb0a8}
#orders .orders-wrap .empty::before{content:"";width:44px;height:44px;border-radius:12px;
  background:radial-gradient(circle at 50% 40%,rgba(25,255,159,.25),transparent 70%),linear-gradient(180deg,rgba(25,255,159,.1),rgba(25,255,159,.02));
  border:1px solid rgba(25,255,159,.25)}

/* hero scanner: trim the glow stack to one ambient shadow + the scan beam */
.hv-card{box-shadow:0 28px 70px -36px rgba(0,0,0,.9),0 0 0 1px rgba(25,255,159,.08)}
.hv-card:hover{box-shadow:0 38px 90px -38px rgba(0,0,0,.92),0 0 0 1px rgba(25,255,159,.14)}

/* footer: left-align the legal line for a clean baseline (was ragged right) */
.foot-disc{text-align:left}

/* methodology cards: tiny accent bar so they don't read as downgraded token cards */
.method-card{border-left:2px solid var(--green-deep)}
.method-card .method-k{position:relative}
.hstat-n.zero{color:var(--mut2)}

/* ── cross-venue (the moat) ── */
.cat.cross-tab{color:#a779ff}
.cat.cross-tab.active{color:#1a0a2e;background:linear-gradient(180deg,#c9a3ff,#a779ff);box-shadow:0 4px 14px -8px #a779ff}
.cat.cross-tab .icn{stroke:#a779ff}.cat.cross-tab.active .icn{stroke:#1a0a2e}
.cross-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px;padding:9px 11px;border-radius:10px;background:linear-gradient(90deg,rgba(167,121,255,.12),rgba(167,121,255,.03));border:1px solid rgba(167,121,255,.3);font-size:12px;color:#cdded6}
.cl-tag{font-family:var(--mono);font-size:10px;letter-spacing:.5px;color:#c9a3ff;font-weight:700}
.cross-line b{color:#fff;font-family:var(--mono)}
.cross-line em{color:#c9a3ff;font-style:normal}

/* ── bettor's tools page ── */
.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.tool-card{background:linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:18px;padding:24px 22px}
.tool-k{font-family:var(--mono);font-size:10px;letter-spacing:1.6px;color:var(--green);margin-bottom:6px}
.tool-card h3{font-family:var(--disp);font-size:19px;margin-bottom:6px;letter-spacing:-.01em}
.tool-card label{display:block;font-size:11px;color:#8ea49b;margin:12px 0 5px;font-family:var(--mono);letter-spacing:.3px}
.tool-card input{width:100%;background:#0a0f0d;border:1px solid var(--line2);border-radius:10px;padding:11px 13px;color:var(--ink);font-family:var(--mono);font-size:15px}
.tool-card input:focus{outline:none;border-color:var(--green)}
.tool-out{margin-top:16px;border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:9px}
.tool-out>div{display:flex;justify-content:space-between;align-items:center;font-size:13px;gap:12px}
.tool-out span{color:#8ea49b}
.tool-out b{font-family:var(--mono);font-size:16px;color:var(--ink)}
.tool-out b.grn{color:var(--green)}
.tool-note{margin-top:14px;font-size:11.5px;color:#7f9189;line-height:1.5}

/* ── track record (CLV) ── */
.track-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}
.tb-stat{background:linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:14px;padding:20px 18px;display:flex;flex-direction:column;gap:6px}
.tb-stat b{font-family:var(--mono);font-size:26px;font-weight:700;color:var(--green);letter-spacing:-.02em}
.tb-stat span{font-size:11.5px;color:#8ea49b;letter-spacing:.3px}
.track-note{margin-top:14px;font-size:13px;color:#9fb0a8;line-height:1.6;max-width:760px}

/* ════════════ VISUAL DEPTH (2026-06-22) ════════════ */
/* card expand button */
.card-exp{background:none;border:none;cursor:pointer;padding:3px;border-radius:6px;display:inline-flex;align-items:center;opacity:.5;transition:opacity .15s,background .15s}
.card-exp svg{width:13px;height:13px;stroke:var(--mut);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.card-exp:hover{opacity:1;background:rgba(255,255,255,.06)}.card-exp:hover svg{stroke:var(--green)}

/* wide detail modal */
.modal.modal-wide{max-width:620px;width:94vw}
.dt-head{margin-bottom:16px}
.dt-league{font-family:var(--mono);font-size:11px;color:#aebfb7;letter-spacing:.4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dt-title{font-family:var(--disp);font-weight:800;font-size:clamp(22px,3vw,30px);letter-spacing:-.02em;margin:6px 0 4px}
.dt-meta{font-family:var(--mono);font-size:12px;color:#8ea49b}
.dt-chart-wrap{background:linear-gradient(180deg,rgba(0,0,0,.3),rgba(0,0,0,.1));border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.dt-chart-lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;color:#7f9189;margin-bottom:6px}
.dt-chart{width:100%;height:90px;display:block}
.dt-chart-empty{height:74px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:#7f9189}
.dt-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.dt-chip{flex:1 1 140px;background:linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:11px;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.dt-chip span{font-family:var(--mono);font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:#8ea49b}
.dt-chip b{font-family:var(--mono);font-size:20px;color:var(--ink)}
.dt-chip i{font-size:11px;color:#9fb0a8;font-style:normal}
.dt-chip.val{border-color:rgba(25,255,159,.3)}.dt-chip.val b{color:var(--green)}
.dt-chip.arb b{color:#ffd23d}
.dt-chip.cross{border-color:rgba(167,121,255,.3)}.dt-chip.cross b{color:#c9a3ff}
.dt-sec{font-family:var(--mono);font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#7f9189;margin:6px 0 9px}
.dt-books{margin-bottom:16px}
.dt-acts{display:flex;flex-direction:column;gap:8px}
.dt-act{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;background:#0a0f0d;border:1px solid var(--line2);border-radius:11px}
.dt-act-l{display:flex;flex-direction:column;gap:2px}
.dt-act-l b{font-size:14px}.dt-act-l span{font-family:var(--mono);font-size:11px;color:#8ea49b}
.dt-act-r{display:flex;gap:8px;align-items:center}
/* defined-risk return chip — $100 stake returns this at the best line */
.dt-act-ret{font-family:var(--mono);font-size:10.5px;color:var(--mut2);white-space:nowrap}
.dt-act-ret b{color:var(--green-dim);font-variant-numeric:tabular-nums}
@media(max-width:560px){.dt-act-ret{display:none}}

/* live odds ticker (replaces the static tagline marquee) */
.odds-ticker{position:relative;margin-top:30px;overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.018),transparent);height:38px;display:flex;align-items:center}
.ot-track{display:inline-flex;align-items:center;white-space:nowrap;will-change:transform;animation:tkScroll 60s linear infinite;font-family:var(--mono);font-size:12px}
.odds-ticker:hover .ot-track{animation-play-state:paused}
@keyframes tkScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.tk{display:inline-flex;align-items:center;gap:7px;padding:0 4px;color:#9fb0a8}
.tk b{color:#cdded6;font-weight:500}
.tk-o{color:var(--ink);font-weight:700}
.tk i{font-style:normal;font-size:10px}.tk i.up{color:var(--up,#13ff9d)}.tk i.dn{color:var(--down,#ff5470)}
.tk-ev{font-style:normal;font-size:9px;font-weight:700;color:#042015;background:var(--green);padding:1px 5px;border-radius:4px}
.tk-arb{font-style:normal;font-size:9px;font-weight:700;color:#1a1400;background:#ffd23d;padding:1px 5px;border-radius:4px}
.tk-sep{color:#3a463f;padding:0 10px}
.ot-edge{position:absolute;top:0;bottom:0;width:60px;z-index:2;pointer-events:none}
.ot-edge.l{left:0;background:linear-gradient(90deg,var(--bg),transparent)}
.ot-edge.r{right:0;background:linear-gradient(270deg,var(--bg),transparent)}
@media(prefers-reduced-motion:reduce){.ot-track{animation:none}}

/* ── How JUICE works (overview) ── */
.hiw-grid{display:flex;align-items:stretch;gap:14px;flex-wrap:wrap}
.hiw-step{flex:1 1 260px;position:relative;overflow:hidden;background:
   radial-gradient(120% 80% at 100% 0,rgba(25,255,159,.05),transparent 55%),
   linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:18px;padding:24px 22px;
   transition:transform .28s var(--ease),border-color .28s,box-shadow .28s}
.hiw-step::before{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(25,255,159,.55),transparent);opacity:.55}
.hiw-step:hover{transform:translateY(-3px);border-color:var(--line2);box-shadow:0 20px 44px -26px rgba(0,0,0,.85),0 0 0 1px rgba(25,255,159,.12)}
.hiw-step:hover .hiw-ic{box-shadow:0 0 24px -6px var(--green);border-color:rgba(25,255,159,.5)}
.hiw-ic{width:48px;height:48px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(25,255,159,.12),rgba(25,255,159,.02));border:1px solid rgba(25,255,159,.22);margin-bottom:14px;transition:box-shadow .28s,border-color .28s}
.hiw-ic svg{width:24px;height:24px;stroke:var(--green);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hiw-n{position:absolute;top:20px;right:22px;font-family:var(--mono);font-size:12px;color:var(--green-deep);font-weight:700}
.hiw-step h3{font-family:var(--disp);font-weight:800;font-size:19px;letter-spacing:-.01em;margin-bottom:8px}
.hiw-step p{font-size:14px;color:#9fb0a8;line-height:1.6}
.hiw-step b{color:#cdded6}
.hiw-arrow{align-self:center;flex:0 0 auto;color:var(--green);opacity:.5}
.hiw-arrow svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:880px){.hiw-arrow{display:none}.hiw-step{flex-basis:100%}}

/* ── trending strip (top by volume) ── */
.trend-strip{display:flex;align-items:center;gap:8px;overflow-x:auto;padding:4px 0 12px;margin-bottom:4px;scrollbar-width:none}
.trend-strip::-webkit-scrollbar{display:none}
.trend-lbl{flex:0 0 auto;font-family:var(--mono);font-size:11px;letter-spacing:.5px;color:#ff8a3d;font-weight:700;padding-right:2px}
.trend-pill{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.008));border:1px solid var(--line);border-radius:10px;padding:7px 12px;cursor:pointer;color:#cdded6;font-size:12.5px;transition:border-color .15s,transform .12s;white-space:nowrap}
.trend-pill:hover{border-color:var(--green);transform:translateY(-1px)}
.tp-rank{font-family:var(--mono);font-size:10px;color:#7f9189}
.tp-emo{font-size:13px}
.tp-t{font-weight:500}
.tp-v{font-family:var(--mono);font-size:11px;color:var(--green)}

/* ── steam-move detector ── */
.cat.movers-tab{color:#ff8a3d}
.cat.movers-tab.active{color:#1a0f00;background:linear-gradient(180deg,#ffb070,#ff8a3d);box-shadow:0 4px 14px -8px #ff8a3d}
.steam-badge{font-family:var(--mono);font-size:10px;font-weight:700;padding:2px 6px;border-radius:5px;letter-spacing:.3px}
.steam-badge.in{color:#13ff9d;background:rgba(25,255,159,.12);border:1px solid rgba(25,255,159,.3)}
.steam-badge.out{color:#ff8a3d;background:rgba(255,138,61,.12);border:1px solid rgba(255,138,61,.3)}
.steam-badge.sm{font-size:9.5px}

/* ── sports news (the edge) ── */
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.news-card{display:flex;gap:12px;background:linear-gradient(168deg,#121a15,#0b110e);border:1px solid var(--line);border-radius:14px;overflow:hidden;text-decoration:none;transition:border-color .15s,transform .12s;min-height:92px}
.news-card:hover{border-color:var(--green);transform:translateY(-2px)}
.nc-img{flex:0 0 96px;background-size:cover;background-position:center;background-color:#0a0f0d}
.nc-noimg{background:radial-gradient(circle at 50% 40%,rgba(25,255,159,.15),transparent 70%)}
.nc-body{padding:12px 14px 12px 0;display:flex;flex-direction:column;gap:6px;justify-content:center}
.nc-tag{font-family:var(--mono);font-size:10px;letter-spacing:.4px;color:var(--green)}
.nc-head{font-size:13.5px;line-height:1.35;color:#eafff5;font-weight:500;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-skel{height:92px;border-radius:14px;background:linear-gradient(100deg,#101610,#16201a,#101610);background-size:200% 100%;animation:shimmer 1.4s infinite}
/* detail live score */
.dt-score{margin-top:10px;display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:14px;background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:10px;padding:8px 13px}
.dt-score b{color:#eafff5}.dt-score span{color:#7f9189}.dt-score i{color:#8ea49b;font-style:normal;font-size:11px;margin-left:4px}
.dt-score.live{border-color:rgba(255,84,112,.35)}

/* ════════════ AURORA — state-of-the-art drifting background motion ════════════ */
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.au{position:absolute;border-radius:50%;filter:blur(80px);opacity:.7;will-change:transform}
.au1{width:50vw;height:50vw;left:-10vw;top:-16vw;background:radial-gradient(circle,rgba(25,255,159,.34),transparent 68%);animation:au1 26s ease-in-out infinite}
.au2{width:42vw;height:42vw;right:-8vw;top:-4vw;background:radial-gradient(circle,rgba(20,150,255,.24),transparent 66%);animation:au2 32s ease-in-out infinite}
.au3{width:38vw;height:38vw;left:32vw;top:30vw;background:radial-gradient(circle,rgba(167,121,255,.16),transparent 66%);animation:au3 38s ease-in-out infinite}
@keyframes au1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(8vw,6vw) scale(1.15)}}
@keyframes au2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-7vw,5vw) scale(1.1)}}
@keyframes au3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-5vw,-7vw) scale(1.2)}}
.aurora::after{content:"";position:absolute;inset:0;background:var(--bg);opacity:.32}
/* terminal scanlines — barely-there horizontal texture over the whole field */
.depth-vignette::after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.4;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,.16) 0 1px, transparent 1px 3px)}
@media(prefers-reduced-motion:reduce){.au{animation:none}}

/* ════════════ HERO DE-SLOP — real terminal feel ════════════ */
/* live system-status line (replaces the generic eyebrow pill) */
.term-status{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.3px;color:#8ea49b;background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:8px;padding:7px 13px;margin-bottom:22px}
.term-status .ts-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 1.4s infinite}
.term-status #hsStatus{color:#aebfb7}
.ts-cur{color:var(--green);animation:blink 1.1s step-end infinite;margin-left:-2px}
@keyframes blink{50%{opacity:0}}

/* scanner panel: real terminal header (no fake macOS dots) */
.hv-bar{display:flex;align-items:center;gap:10px;font-family:var(--mono)}
.hv-prompt{color:var(--green);font-size:12px;font-weight:600}
.hv-prompt::before{content:"▸ ";opacity:.7}
.hv-cmd{color:#7f9189;font-size:12px}
.hv-bar .hv-live{margin-left:auto}

/* live price sparkline inside the scanner */
.hv-spark{padding:0 4px 6px}
.hv-spark .dt-chart{height:46px}
.hv-spark .dt-chart-empty{height:40px;font-size:10px}

/* ── rich matchup panel (detail modal) ── */
.dt-matchup{margin-top:12px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:16px;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.12));border:1px solid var(--line);border-radius:14px;position:relative}
.dt-matchup.live{border-color:rgba(255,84,112,.3)}
.dm-team{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.dm-logo{width:46px;height:46px;object-fit:contain}
.dm-noimg{border-radius:50%;background:radial-gradient(circle,rgba(25,255,159,.15),transparent 70%);border:1px solid var(--line2)}
.dm-info{display:flex;flex-direction:column;gap:2px}
.dm-info b{font-size:14px;color:#eafff5;line-height:1.15}
.dm-info span{font-family:var(--mono);font-size:10.5px;color:#8ea49b}
.dm-score{font-family:var(--mono);font-size:28px;font-weight:700;color:var(--green);line-height:1}
.dm-mid{display:flex;flex-direction:column;align-items:center;gap:3px;font-family:var(--mono);font-size:10.5px;color:#9fb0a8;white-space:nowrap}
.dm-venue{position:absolute;bottom:6px;left:0;right:0;text-align:center;font-family:var(--mono);font-size:9.5px;color:#637067}

/* ── team logos + records on cards ── */
.team-logo{width:22px;height:22px;object-fit:contain;vertical-align:middle;margin-right:9px}
.team-rec{font-family:var(--mono);font-size:10px;color:#7f9189;margin-left:8px;font-weight:400}
.m-score{font-family:var(--mono);font-size:17px;font-weight:700;color:var(--green);float:right}
.match{display:flex;align-items:center;justify-content:space-between}

/* ════════════ HERO REFINEMENT (restraint + premium, 2026-06-22) ════════════ */
/* status as clean separate chips (not one dense pill) */
.hero-status{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.hs-chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;color:#9fb0a8;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:8px;padding:6px 11px;letter-spacing:.3px}
.hs-chip b{color:var(--ink);font-weight:700}
.hs-chip.on{color:var(--green);border-color:var(--green-deep);background:rgba(25,255,159,.05)}
.hs-chip.on .ts-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 7px var(--green);animation:pulse 1.4s infinite}

/* lede: tighter width, more line-height, more space before the CTA */
.hero-inner .lede{max-width:470px;line-height:1.65;font-size:clamp(15px,1.55vw,17px);margin-bottom:36px;color:#aebfb7}
.hero-inner .lede b{color:#eafff5}
.hero-inner h1{margin-top:4px}

/* secondary CTA = a light text link that supports, not competes */
.btn-text{background:none;border:none;color:#9fb0a8;padding:13px 4px;font-weight:600;letter-spacing:0;box-shadow:none;transition:color .15s,transform .15s}
.btn-text:hover{color:var(--green);background:none;transform:translateX(2px)}

/* a touch more rhythm + keep the stats module from feeling cramped */
.stats-module{margin-top:38px}
.hero{padding-bottom:8px}

/* distinct role-coded status chips (premium brief #4) */
.hs-chip.ev b{color:var(--green)}
.hs-chip.ev{border-color:rgba(25,255,159,.22)}
.hs-chip.arb b{color:#ffd23d}
.hs-chip.steam b{color:#ff8a3d}
.hs-chip{transition:border-color .2s,background .2s}
.hs-chip:hover{border-color:var(--line2)}

/* ════════════ SECTION COHERENCE / TYPE (premium brief #2,#3) ════════════ */
:root{--mut2:#79887e}   /* lift the dimmest text for readability */
/* every section header gets the same green accent mark — a designed system, not stacked cards */
.section-head h2{position:relative;padding-left:17px;font-weight:800}
.section-head h2::before{content:"";position:absolute;left:0;top:.16em;bottom:.16em;width:3px;border-radius:2px;background:var(--green);box-shadow:0 0 12px -3px var(--green)}
.section-head h2 .muted{font-weight:500}
/* consistent card radius + slightly tighter section rhythm at the top of the stack */
.section{padding-top:clamp(52px,8vw,92px)}

/* ── board search ── */
.board-search-wrap{position:relative;display:flex;align-items:center;margin-bottom:14px;max-width:420px}
.bs-ic{position:absolute;left:13px;width:16px;height:16px;stroke:var(--mut);fill:none;stroke-width:1.8;stroke-linecap:round;pointer-events:none}
.board-search{width:100%;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:11px;padding:11px 36px 11px 38px;color:var(--ink);font-size:14px;font-family:var(--font)}
.board-search::placeholder{color:var(--mut2)}
.board-search:focus{outline:none;border-color:var(--green);background:rgba(25,255,159,.04)}
.board-search-wrap.has .bs-ic{stroke:var(--green)}
.bs-clear{position:absolute;right:10px;background:none;border:none;color:var(--mut);cursor:pointer;font-size:13px;width:24px;height:24px;border-radius:6px;display:none}
.board-search-wrap.has .bs-clear{display:flex;align-items:center;justify-content:center}
.bs-clear:hover{color:var(--ink);background:rgba(255,255,255,.06)}

/* ── watch button + video modal ── */
.btn-watch{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.04);border:1px solid var(--line2);border-radius:11px;padding:12px 16px;color:var(--ink);font-weight:600;font-size:14px;cursor:pointer;transition:border-color .15s,background .15s}
.btn-watch:hover{border-color:var(--green);background:rgba(25,255,159,.05)}
.bw-play{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--green);color:#042015;font-size:9px;padding-left:1px}
.bw-len{font-family:var(--mono);font-size:11px;color:var(--mut)}
.video-modal{position:relative;width:min(920px,94vw);background:#000;border:1px solid var(--line2);border-radius:16px;overflow:hidden;box-shadow:0 40px 100px -30px rgba(0,0,0,.9),0 0 0 1px rgba(25,255,159,.12)}
.video-modal video{width:100%;display:block;background:#000;aspect-ratio:16/9}
.video-modal .modal-x{top:-38px;right:0;color:#eafff5}
@media(max-width:560px){.video-modal .modal-x{top:8px;right:8px;background:rgba(0,0,0,.5);z-index:3}}

/* ── matchup news in detail ── */
.dt-news{display:block;margin-bottom:16px;padding:13px 15px;background:linear-gradient(90deg,rgba(25,255,159,.06),rgba(25,255,159,.01));border:1px solid var(--line);border-radius:12px;text-decoration:none;transition:border-color .15s}
.dt-news:hover{border-color:var(--green)}
.dn-tag{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--green);margin-bottom:5px}
.dn-head{font-size:13.5px;color:#eafff5;line-height:1.4}

/* ════════════ PREMIUM CRAFT LAYER (A-tier details, 2026-06-23) ════════════ */
/* crisp type rendering — the single biggest "expensive vs slop" tell */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3,.hero-sub,.feat-title,.dt-title,.tk-h1,.brand{font-optical-sizing:auto}
body{font-feature-settings:"kern" 1,"liga" 1}
/* every number that matters is tabular + lining — aligned columns like a real terminal */
.ov,.oa,.book-tbl td,.hv-grid td,.hs-chip b,.dm-score,.feat-spread b,.hv-spread b,.tk-h1,.sb-head b,.tb-stat b,.tool-out b,.ot-o,.tk-o,.arb-spread-big,.dt-chip b,.val-line b,.cross-line b,.o-target .ot-n{font-variant-numeric:tabular-nums lining-nums}

/* branded text selection */
::selection{background:rgba(25,255,159,.26);color:#fff;text-shadow:none}
::-moz-selection{background:rgba(25,255,159,.26);color:#fff}

/* custom scrollbar — thin, dark, green on hover (Firefox + WebKit) */
*{scrollbar-width:thin;scrollbar-color:#202b25 transparent}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#1c2620;border-radius:7px;border:3px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#2c3a32;background-clip:padding-box}

/* consistent green focus ring everywhere (a11y + craft) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:7px}

/* smoother interactive feel + precise card edges */
.card,.cat,.btn,.btn-connect,.btn-watch,.trend-pill,.news-card,.tool-card,.faq summary{transition:transform .18s var(--ease),border-color .18s var(--ease),background .18s var(--ease),box-shadow .25s var(--ease)}
.card{border-color:#1b2620}
.card:hover{border-color:#26352c}
/* hairline top highlight on raised surfaces — depth without glow */
.card::before,.tok-card::before,.tool-card::before,.news-card::before,.method-card::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);border-radius:inherit}
.card,.tok-card,.tool-card,.news-card,.method-card{position:relative}

/* ── share to X ── */
.dt-share{margin-top:12px;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.04);border:1px solid var(--line2);border-radius:9px;padding:8px 14px;color:#cdded6;font-size:12.5px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
.dt-share:hover{border-color:var(--green);color:var(--green);background:rgba(25,255,159,.05)}

/* ── watchlist ── */
.cat.watch-tab{color:#ffd23d}
.cat.watch-tab.active{color:#231a00;background:linear-gradient(180deg,#ffe07a,#ffd23d);box-shadow:0 4px 14px -8px #ffd23d}
.cat.watch-tab .icn{stroke:#ffd23d;fill:none}.cat.watch-tab.active .icn{stroke:#231a00}
.card-star{background:none;border:none;cursor:pointer;font-size:15px;line-height:1;color:var(--mut);padding:2px 4px;border-radius:6px;transition:color .15s,transform .12s}
.card-star:hover{color:#ffd23d;transform:scale(1.15)}
.card-star.on{color:#ffd23d;text-shadow:0 0 10px rgba(255,210,61,.5)}

/* ── onboarding ── */
.modal.onboard{max-width:500px;text-align:left}
.ob-brand{font-family:var(--disp);font-weight:800;font-size:26px;display:flex;align-items:center;gap:10px;margin-bottom:6px}
.ob-sub{color:#9fb0a8;font-size:14px;line-height:1.5;margin-bottom:20px}
.ob-list{display:flex;flex-direction:column;gap:12px;margin-bottom:18px}
.ob-item{display:flex;gap:13px;align-items:flex-start}
.ob-ic{flex:0 0 auto;width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.ob-ic.ev{border-color:rgba(25,255,159,.3)}.ob-ic.arb{border-color:rgba(255,210,61,.3)}.ob-ic.cross{border-color:rgba(167,121,255,.3)}.ob-ic.steam{border-color:rgba(255,138,61,.3)}
.ob-item b{display:block;font-size:14.5px;color:#eafff5;margin-bottom:1px}
.ob-item span{font-size:12.5px;color:#9fb0a8;line-height:1.4}
.ob-tip{font-size:12.5px;color:#9fb0a8;line-height:1.55;background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:11px;padding:13px 15px;margin-bottom:18px}
.ob-tip b{color:var(--green)}
.modal.onboard .btn-primary.full{width:100%}

/* ── settings ── */
.modal.settings{max-width:420px;text-align:left}
.set-h{font-family:var(--disp);font-weight:800;font-size:22px;margin-bottom:18px}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid var(--line)}
.set-row:first-of-type{border-top:none}
.set-l b{display:block;font-size:14px;color:#eafff5}
.set-l span{font-size:11.5px;color:#8ea49b}
.set-row select{background:#0a0f0d;border:1px solid var(--line2);border-radius:9px;padding:8px 11px;color:var(--ink);font-size:13px;font-family:var(--font)}
.set-row select:focus{outline:none;border-color:var(--green)}
.toggle{width:46px;height:26px;border-radius:14px;background:#1c2620;border:1px solid var(--line2);position:relative;cursor:pointer;transition:background .2s;flex:0 0 auto}
.toggle .tg-knob{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#7f9189;transition:left .2s,background .2s}
.toggle.on{background:rgba(25,255,159,.25);border-color:var(--green)}
.toggle.on .tg-knob{left:22px;background:var(--green);box-shadow:0 0 8px var(--green)}

/* ── live match tracker (detail) ── */
.dt-live{margin:14px 0 4px;padding:15px;background:linear-gradient(180deg,rgba(255,84,112,.05),rgba(0,0,0,.15));border:1px solid rgba(255,84,112,.22);border-radius:14px}
.lv-head{font-family:var(--mono);font-size:11px;color:#9fb0a8;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.lv-bar{display:flex;height:12px;border-radius:7px;overflow:hidden;background:#0a0f0d;border:1px solid var(--line)}
.lv-h{background:linear-gradient(90deg,#0bbf75,var(--green));transition:width .9s var(--ease)}
.lv-a{background:linear-gradient(90deg,#3a7bd5,#5e9bff);margin-left:auto;transition:width .9s var(--ease)}
.lv-t{background:#637067;transition:width .9s var(--ease)}
@media(prefers-reduced-motion:reduce){.lv-h,.lv-a,.lv-t{transition:none}}
.lv-wp-l{display:flex;justify-content:space-between;margin-top:7px;font-family:var(--mono);font-size:12px;color:#9fb0a8}
.lv-wp-l b{color:#eafff5}
.lv-feed-lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:1.2px;text-transform:uppercase;color:#7f9189;margin:14px 0 7px}
.lv-feed{display:flex;flex-direction:column;gap:1px;max-height:180px;overflow-y:auto}
.lv-play{display:flex;gap:10px;padding:7px 9px;border-radius:8px;font-size:12.5px;color:#cdded6;animation:fadeIn .3s ease}
.lv-play:nth-child(even){background:rgba(255,255,255,.012)}
.lv-play.score{background:rgba(25,255,159,.08);border:1px solid rgba(25,255,159,.2)}
.lv-pmeta{flex:0 0 64px;font-family:var(--mono);font-size:10px;color:#7f9189}
.lv-ptext{flex:1}

/* live tracker: green for pre-game implied, red accent when LIVE */
.dt-live{border-color:rgba(25,255,159,.2);background:linear-gradient(180deg,rgba(25,255,159,.04),rgba(0,0,0,.15))}
.dt-live.on{border-color:rgba(255,84,112,.28);background:linear-gradient(180deg,rgba(255,84,112,.05),rgba(0,0,0,.15))}

/* ── live: pitch graphic + moments timeline + lineups ── */
.lv-pitch{position:relative;margin-bottom:14px;border-radius:10px;overflow:hidden;background:linear-gradient(160deg,#0d3a22,#0a2818)}
.lv-pitch svg{width:100%;height:130px;display:block}
.lv-pitch svg rect,.lv-pitch svg line,.lv-pitch svg circle{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1}
.lv-pitch svg .fill{fill:rgba(255,255,255,.6);stroke:none}
.lv-pitch-sc{position:absolute;top:8px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:14px;font-family:var(--mono);font-size:13px;color:#eafff5;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.lv-pitch-sc b{font-size:22px;font-weight:700}
.lv-timeline{display:flex;flex-direction:column;gap:2px;margin-bottom:6px}
.lv-mom{display:flex;align-items:center;gap:10px;padding:7px 9px;border-radius:8px;font-size:12.5px;color:#cdded6}
.lv-mom.goal{background:rgba(25,255,159,.08);border:1px solid rgba(25,255,159,.22)}
.lv-mt{flex:0 0 34px;font-family:var(--mono);font-size:11px;color:#7f9189;font-weight:700}
.lv-mi{flex:0 0 auto;font-size:14px}
.lv-md b{color:#eafff5;font-weight:600}
.lv-det{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.lv-det summary{cursor:pointer;font-family:var(--mono);font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:#8ea49b;list-style:none}
.lv-det summary::-webkit-details-marker{display:none}
.lv-det summary::before{content:"▸ ";color:var(--green)}
.lv-det[open] summary::before{content:"▾ "}
.lv-lineups{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:10px}
.lv-lu-team{font-family:var(--mono);font-size:10px;letter-spacing:.5px;color:var(--green);margin-bottom:6px;text-transform:uppercase}
.lv-lu-p{font-size:12px;color:#cdded6;padding:3px 0;display:flex;align-items:center;gap:7px}
.lv-lu-n{font-family:var(--mono);font-size:10px;color:#7f9189;width:18px}
.lv-lu-p i{color:#7f9189;font-style:normal;font-size:10px;margin-left:auto}

/* ════════════ LIVE SPORT FIELDS (3D-perspective, animated) ════════════ */
/* ── soccer pitch + animated ball ── */
.pitch3d{position:relative;margin-bottom:14px;border-radius:12px;overflow:hidden;height:200px;background:radial-gradient(120% 90% at 50% 120%,#0a3a22,#05130b);perspective:560px}
.p3-persp{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:14px}
.p3-field{position:relative;width:90%;height:150px;transform:rotateX(54deg);transform-origin:center bottom;background:repeating-linear-gradient(90deg,#10844a 0 9%,#0d7341 9% 18%);border:2px solid rgba(255,255,255,.45);border-radius:2px}
.p3-mid{position:absolute;left:50%;top:0;bottom:0;width:2px;background:rgba(255,255,255,.45);transform:translateX(-1px)}
.p3-circle{position:absolute;left:50%;top:50%;width:58px;height:58px;border:2px solid rgba(255,255,255,.45);border-radius:50%;transform:translate(-50%,-50%)}
.p3-spot{position:absolute;left:50%;top:50%;width:4px;height:4px;background:#fff;border-radius:50%;transform:translate(-50%,-50%)}
.p3-box{position:absolute;top:50%;width:46px;height:78px;border:2px solid rgba(255,255,255,.45);transform:translateY(-50%)}
.p3-box.l{left:-2px;border-left:none}.p3-box.r{right:-2px;border-right:none}
.p3-arc{position:absolute;top:50%;width:24px;height:40px;border:2px solid rgba(255,255,255,.4);border-radius:50%;transform:translateY(-50%)}
.p3-arc.l{left:38px;border-color:transparent rgba(255,255,255,.4) transparent transparent}
.p3-arc.r{right:38px;border-color:transparent transparent transparent rgba(255,255,255,.4)}
.p3-goal{position:absolute;top:50%;width:5px;height:28px;background:rgba(255,255,255,.75);transform:translateY(-50%)}
.p3-goal.l{left:-5px}.p3-goal.r{right:-5px}
.p3-ball{position:absolute;left:50%;top:50%;width:12px;height:12px;background:radial-gradient(circle at 35% 30%,#fff,#c8d0cc);border-radius:50%;box-shadow:0 4px 7px rgba(0,0,0,.55);transform:translate(-50%,-50%);transition:left 1.05s cubic-bezier(.45,.05,.2,1),top 1.05s cubic-bezier(.45,.05,.2,1);z-index:3}
.pitch3d.goal .p3-field{animation:goalFlash .45s 3}
@keyframes goalFlash{50%{box-shadow:0 0 0 3px var(--green) inset,0 0 50px var(--green);filter:brightness(1.3)}}
.p3-hud{position:absolute;top:10px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:16px;z-index:4;font-family:var(--mono);color:#eafff5;text-shadow:0 1px 7px rgba(0,0,0,.85)}
.p3-tm{font-size:13px}.p3-sc{font-size:23px;font-weight:700}.p3-tm b{font-size:17px}
.p3-banner{position:absolute;bottom:12px;left:50%;transform:translateX(-50%) translateY(8px);background:rgba(0,0,0,.72);border:1px solid var(--green);color:var(--green);font-family:var(--mono);font-size:12px;font-weight:700;padding:6px 15px;border-radius:8px;opacity:0;transition:opacity .25s,transform .25s;z-index:5;letter-spacing:.5px;white-space:nowrap}
.p3-banner.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── baseball diamond ── */
.diamond3d{position:relative;margin-bottom:14px;border-radius:12px;overflow:hidden;height:200px;background:radial-gradient(120% 100% at 50% 120%,#0c3a22,#06140c);perspective:600px}
.bd-persp{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding-top:18px}
.bd-field{position:relative;width:150px;height:150px;transform:rotateX(48deg) rotateZ(45deg);transform-origin:center}
.bd-grass{position:absolute;inset:0;background:#0f7a41;border-radius:8px}
.bd-dirt{display:none}
.bd-field::after{content:"";position:absolute;inset:24%;background:#bb813f;border-radius:4px}
.bd-base{position:absolute;width:15px;height:15px;background:#fff;border:1px solid rgba(0,0,0,.25);z-index:2}
.bd-base.home{bottom:14%;right:14%}
.bd-base.first{top:14%;right:14%}
.bd-base.second{top:14%;left:14%}
.bd-base.third{bottom:14%;left:14%}
.bd-base.on{background:var(--green);box-shadow:0 0 12px var(--green)}
.bd-mound{position:absolute;left:50%;top:50%;width:13px;height:13px;background:#bb813f;border:1px solid rgba(0,0,0,.2);border-radius:50%;transform:translate(-50%,-50%);z-index:2}
.bd-hud{position:absolute;top:10px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 18px;z-index:4;font-family:var(--mono);font-size:13px;color:#eafff5;text-shadow:0 1px 7px rgba(0,0,0,.85)}
.bd-hud b{font-size:18px}
.bd-count{display:flex;align-items:center;gap:7px;font-size:12px;color:#cdded6}
.bd-count b{font-size:15px;color:var(--green)}
.bd-outs{display:inline-flex;gap:3px}
.bd-out{width:8px;height:8px;border-radius:50%;border:1px solid #7f9189}
.bd-out.on{background:#ff5470;border-color:#ff5470}

/* ── football field + basketball court (perspective) ── */
.ff-field,.bball-court{position:relative;margin-bottom:14px;border-radius:12px;overflow:hidden;height:175px;perspective:560px}
.ff-field{background:radial-gradient(120% 90% at 50% 120%,#0a3a22,#05130b)}
.bball-court{background:radial-gradient(120% 90% at 50% 120%,#5a3a18,#1a1008)}
.ff-persp,.bc-persp{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:12px}
.ff-turf{position:relative;width:90%;height:120px;transform:rotateX(54deg);transform-origin:center bottom;background:repeating-linear-gradient(90deg,#10844a 0 10%,#0d7341 10% 20%);border:2px solid rgba(255,255,255,.4)}
.ff-ez{position:absolute;top:0;bottom:0;width:14%;background:rgba(25,255,159,.12)}.ff-ez.l{left:0;border-right:2px solid rgba(255,255,255,.5)}.ff-ez.r{right:0;border-left:2px solid rgba(255,255,255,.5)}
.ff-yards{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 9.5%,rgba(255,255,255,.3) 9.5% 10%)}
.ff-ball{position:absolute;left:50%;top:50%;width:11px;height:7px;background:#8a4a2a;border-radius:50%;transform:translate(-50%,-50%)}
.bc-floor{position:relative;width:88%;height:115px;transform:rotateX(52deg);transform-origin:center bottom;background:linear-gradient(#c88a4a,#b87a3a);border:2px solid rgba(255,255,255,.5);border-radius:2px}
.bc-center{position:absolute;left:50%;top:50%;width:40px;height:40px;border:2px solid rgba(255,255,255,.5);border-radius:50%;transform:translate(-50%,-50%)}
.bc-key{position:absolute;top:50%;width:42px;height:54px;border:2px solid rgba(255,255,255,.5);transform:translateY(-50%)}.bc-key.l{left:0}.bc-key.r{right:0}
.bc-hoop{position:absolute;top:50%;width:8px;height:8px;border:2px solid #ff8a3d;border-radius:50%;transform:translateY(-50%)}.bc-hoop.l{left:6px}.bc-hoop.r{right:6px}

/* ── NFL down/distance + line-of-scrimmage ── */
.ff-los{position:absolute;top:0;bottom:0;width:2px;background:#ffd23d;box-shadow:0 0 8px #ffd23d}
.ff-ball{transition:left 1s ease}
.ff-dd{font-family:var(--mono);font-size:12px;font-weight:700;color:#ffd23d;text-shadow:0 1px 6px rgba(0,0,0,.8)}
/* ── NBA mid + ball ── */
.bc-mid{position:absolute;left:50%;top:0;bottom:0;width:2px;background:rgba(255,255,255,.5);transform:translateX(-1px)}
.bc-ball{position:absolute;left:50%;top:50%;width:10px;height:10px;background:radial-gradient(circle at 35% 30%,#ff9d5c,#e8722e);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 3px 6px rgba(0,0,0,.5);animation:bcDrift 6s ease-in-out infinite}
@keyframes bcDrift{0%,100%{left:50%;top:50%}25%{left:62%;top:42%}50%{left:44%;top:56%}75%{left:58%;top:50%}}
@media(prefers-reduced-motion:reduce){.bc-ball{animation:none}}
/* ── UFC octagon ── */
.octagon{position:relative;margin-bottom:14px;border-radius:12px;overflow:hidden;height:200px;background:radial-gradient(120% 100% at 50% 50%,#1a1208,#0a0805);display:flex;align-items:center;justify-content:center}
.oct-cage{width:160px;height:160px;display:flex;align-items:center;justify-content:center}
.oct-shape{width:150px;height:150px;clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%);background:linear-gradient(160deg,#2a2010,#16100a);border:2px solid rgba(255,210,61,.3);display:flex;align-items:center;justify-content:center;position:relative}
.oct-shape::before{content:"";position:absolute;inset:14px;clip-path:inherit;border:1px solid rgba(255,255,255,.08)}
.octagon::before{content:"";position:absolute;left:-20px;top:50%;width:140px;height:140px;transform:translateY(-50%);background:radial-gradient(circle,rgba(255,84,112,.20),transparent 68%);pointer-events:none;animation:octRed 3.4s ease-in-out infinite}
.octagon::after{content:"";position:absolute;right:-20px;top:50%;width:140px;height:140px;transform:translateY(-50%);background:radial-gradient(circle,rgba(94,155,255,.20),transparent 68%);pointer-events:none;animation:octBlue 3.4s ease-in-out infinite}
@keyframes octRed{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes octBlue{0%,100%{opacity:1}50%{opacity:.55}}
.oct-center{font-family:var(--disp);font-weight:800;font-size:26px;color:rgba(255,210,61,.45);letter-spacing:2px;animation:octPulse 2.8s ease-in-out infinite}
@keyframes octPulse{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:.7;transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){.octagon::before,.octagon::after,.oct-center{animation:none}}
.oct-hud{position:absolute;top:14px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 22px;font-family:var(--mono)}
.oct-f{display:flex;flex-direction:column;gap:2px}.oct-f.r{text-align:right}
.oct-f b{font-size:14px;color:#eafff5}.oct-f span{font-size:10px;color:#ff5470}.oct-f.r span{color:#5e9bff}
.oct-rd{font-family:var(--mono);font-size:13px;font-weight:700;color:#ffd23d;align-self:flex-start;margin-top:2px}