:root{
  --night:#0E1A2B;      /* stadium sky */
  --turf:#13243A;       /* panels */
  --turf-2:#1A2F4A;     /* raised */
  --chalk:#F2EEE3;      /* text, yard lines */
  --dim:#9AA8BC;        /* secondary text */
  --line:#263C59;       /* borders */
  --first:#F5D33C;      /* broadcast first-down yellow: the one accent */
  --over:#3DBE7A;       /* hits / over */
  --under:#E5604A;      /* misses / under */
  --amber:#E9A23B;
  --r-lg:14px; --r:10px; --r-sm:6px;
  --cond:"Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --body:"Barlow", system-ui, -apple-system, sans-serif;
  color-scheme: dark;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--night);color:var(--chalk);font:16px/1.45 var(--body);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--first);outline-offset:2px;border-radius:4px}
img{display:block}
.num,h1,h2,h3,.cond{font-family:var(--cond);letter-spacing:.01em}
h1{font-size:44px;line-height:1;margin:0;font-weight:800}
h2{font-size:26px;line-height:1.1;margin:0 0 12px;font-weight:700}
h3{font-size:19px;margin:0 0 8px;font-weight:700}
.muted{color:var(--dim)}
.small{font-size:13px}
.hide,[hidden]{display:none!important}

/* ---------- top bar ---------- */
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:20px;padding:12px 24px;
  background:rgba(14,26,43,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font:700 22px var(--cond);white-space:nowrap}
.brand img{width:30px;height:30px;border-radius:8px}
.search{position:relative;flex:1;max-width:620px;display:flex;align-items:center;gap:10px;
  background:var(--turf);border:1px solid var(--line);border-radius:999px;padding:0 14px;height:44px}
.search:focus-within{border-color:var(--first);box-shadow:0 0 0 3px rgba(245,211,60,.15)}
.search svg{width:18px;height:18px;fill:none;stroke:var(--dim);stroke-width:2;flex:none}
.search input{flex:1;background:none;border:0;outline:0;font-size:16px;min-width:0}
.search input::-webkit-search-cancel-button{display:none}
.search kbd{font:600 12px var(--body);color:var(--dim);border:1px solid var(--line);border-radius:5px;padding:1px 6px}
.results{position:absolute;left:0;right:0;top:50px;background:var(--turf-2);border:1px solid var(--line);
  border-radius:var(--r-lg);box-shadow:0 20px 50px rgba(0,0,0,.45);max-height:70vh;overflow:auto;padding:6px}
.results .grp{padding:8px 10px 4px;font-size:12px;color:var(--dim)}
.res{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:var(--r);cursor:pointer}
.res[aria-selected=true],.res:hover{background:rgba(245,211,60,.12)}
.res .ph{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--turf);flex:none}
.res .lg{width:32px;height:32px;object-fit:contain;flex:none}
.res b{font-weight:600}
.res .meta{margin-left:auto;color:var(--dim);font-size:13px;white-space:nowrap}
.nav{display:flex;gap:4px}
.nav a{padding:8px 14px;border-radius:999px;font-weight:600;color:var(--dim)}
.nav a:hover{color:var(--chalk)}
.nav a.on{color:var(--night);background:var(--chalk)}
.slip-btn{display:flex;align-items:center;gap:8px;background:var(--first);color:var(--night);border:0;
  border-radius:999px;padding:9px 16px;font-weight:700;cursor:pointer;white-space:nowrap}
.slip-btn b{background:var(--night);color:var(--first);border-radius:999px;min-width:22px;padding:1px 6px;font-size:13px}

main{max-width:1240px;margin:0 auto;padding:28px 24px 120px;outline:0}

/* ---------- generic ---------- */
.panel{background:var(--turf);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.stack>*+*{margin-top:20px}
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--turf-2);
  border-radius:999px;padding:8px 16px;font-weight:600;cursor:pointer}
.btn:hover{border-color:var(--dim)}
.btn.primary{background:var(--first);color:var(--night);border-color:var(--first)}
.btn.ghost{background:none}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;
  padding:5px 12px;font-size:14px;font-weight:600;cursor:pointer;background:none;color:var(--dim)}
.chip.on{background:var(--chalk);color:var(--night);border-color:var(--chalk)}
.field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--dim)}
.field input,.field select{background:var(--night);border:1px solid var(--line);border-radius:var(--r);
  padding:9px 12px;color:var(--chalk);font-size:15px;min-width:0}
.logo{width:40px;height:40px;object-fit:contain}
.logo.sm{width:24px;height:24px}
.logo.lg{width:84px;height:84px}
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-weight:600;color:var(--dim);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:8px 10px;border-bottom:1px solid rgba(38,60,89,.55)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.tablewrap{overflow-x:auto}
.empty{padding:40px;text-align:center;color:var(--dim)}
.err{border:1px solid var(--under);color:#ffd6cf;background:rgba(229,96,74,.1);border-radius:var(--r);padding:14px}
.loading{display:flex;align-items:center;gap:12px;color:var(--dim);padding:60px 0;justify-content:center}
.loading i{width:22px;height:14px;border-radius:50%;background:#8B4A26;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.loading i{animation:none}}

/* ---------- prediction level ---------- */
.lvl{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:14px;white-space:nowrap}
.pips{display:inline-flex;gap:3px}
.pips i{width:7px;height:14px;border-radius:2px;background:var(--line)}
.lvl.elite .pips i.f{background:var(--first)}
.lvl.strong .pips i.f{background:var(--over)}
.lvl.lean .pips i.f{background:#7FD3A6}
.lvl.slight .pips i.f{background:var(--dim)}
.lvl.coin .pips i.f{background:#5E6E86}
.lvl.elite{color:var(--first)} .lvl.strong{color:var(--over)} .lvl.lean{color:#7FD3A6}
.lvl.slight,.lvl.coin{color:var(--dim)}
.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--dim)}

/* ---------- field meter (signature) ---------- */
.meter{position:relative;height:46px;border-radius:8px;overflow:hidden;
  background:linear-gradient(90deg,rgba(229,96,74,.35) 0 8%,#1F5A3A 8% 92%,rgba(61,190,122,.35) 92% 100%)}
.meter .yd{position:absolute;top:0;bottom:0;width:1px;background:rgba(242,238,227,.28)}
.meter .yd span{position:absolute;bottom:3px;left:3px;font:600 10px var(--cond);color:rgba(242,238,227,.55)}
.meter .mid{position:absolute;top:0;bottom:0;left:50%;width:2px;background:rgba(242,238,227,.6)}
.meter .fd{position:absolute;top:-2px;bottom:-2px;width:4px;margin-left:-2px;background:var(--first);
  box-shadow:0 0 0 1px rgba(14,26,43,.6);transition:left .5s cubic-bezier(.2,.8,.2,1)}
.meter .ez{position:absolute;top:0;bottom:0;display:flex;align-items:center;font:700 11px var(--cond);
  color:rgba(242,238,227,.8);writing-mode:vertical-rl;transform:rotate(180deg);padding:0 4px}
.meter .ez.r{right:0;transform:none}
.meter.sm{height:26px}
.meter.sm .yd span,.meter.sm .ez{display:none}
@media (prefers-reduced-motion:reduce){.meter .fd{transition:none}}

.bigprob{font:800 64px/0.9 var(--cond)}
.bigprob small{font-size:24px;color:var(--dim);font-weight:600;margin-left:6px}

/* ---------- money / bets split ---------- */
.split{display:grid;grid-template-columns:52px 1fr 52px;align-items:center;gap:8px;font-size:13px}
.split .bar{display:flex;height:10px;border-radius:5px;overflow:hidden;background:var(--line)}
.split .bar i{display:block;height:100%}
.split .l{text-align:right;font-weight:700} .split .rr{font-weight:700}
.split .t{grid-column:1/-1;color:var(--dim);font-size:12px;display:flex;justify-content:space-between;margin-top:-4px}
.money{display:grid;gap:12px}
.signal{display:flex;gap:8px;align-items:flex-start;background:rgba(245,211,60,.1);border:1px solid rgba(245,211,60,.35);
  color:#FBE7A0;border-radius:var(--r);padding:8px 12px;font-size:13px}

/* ---------- slate ---------- */
.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.pagehead p{margin:6px 0 0;color:var(--dim)}
.day{margin:28px 0 12px;font:700 20px var(--cond);color:var(--dim)}
.slate{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:16px}
.game{display:block;background:var(--turf);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 16px 14px;
  position:relative;overflow:hidden;transition:border-color .15s}
.game:hover{border-color:#3A5578}
.game.prime{border-color:rgba(245,211,60,.4)}
.game .kick{display:flex;justify-content:space-between;color:var(--dim);font-size:13px;margin-bottom:10px}
.game .kick b{color:var(--first);font-weight:700}
.tm{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:10px;padding:5px 0}
.tm .nm{font:700 22px/1 var(--cond)}
.tm .rec{color:var(--dim);font-size:13px;margin-left:6px;font-family:var(--body);font-weight:500}
.tm .wp{font:800 24px var(--cond);font-variant-numeric:tabular-nums}
.tm .wp.fav{color:var(--chalk)} .tm .wp.dog{color:var(--dim)}
.wpbar{display:flex;height:6px;border-radius:3px;overflow:hidden;margin:8px 0 12px}
.lines{display:flex;gap:16px;font-size:14px;color:var(--dim);margin-bottom:10px}
.lines b{color:var(--chalk);font-weight:600}
.game .foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:13px;color:var(--dim);gap:8px;flex-wrap:wrap}
.tag{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:600;
  background:var(--turf-2);color:var(--dim)}
.tag.warn{color:var(--amber)} .tag.hot{color:var(--first);background:rgba(245,211,60,.1)}
.filters{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- headers (game / player / team) ---------- */
.hero{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);
  background:var(--turf);padding:24px}
.hero .stripe{position:absolute;inset:0 auto 0 0;width:8px}
.scoreboard{display:grid;grid-template-columns:1fr minmax(0,260px) 1fr;align-items:center;gap:20px}
.scoreboard .side{display:flex;align-items:center;gap:16px}
.scoreboard .side.r{justify-content:flex-end;text-align:right}
.scoreboard .t1{font:800 34px/1 var(--cond)}
.scoreboard .vs{text-align:center;color:var(--dim)}
.scoreboard .vs .num{font-size:22px;color:var(--chalk);font-weight:700}
.jump{position:sticky;top:69px;z-index:20;display:flex;gap:6px;overflow-x:auto;padding:10px 0;margin:12px 0 4px;
  background:linear-gradient(var(--night) 80%,transparent)}
.jump a{flex:none;padding:6px 14px;border-radius:999px;border:1px solid var(--line);font-weight:600;font-size:14px;color:var(--dim)}
.jump a:hover{color:var(--chalk);border-color:var(--dim)}
section.blk{scroll-margin-top:130px}

.phero{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center}
.phero .ph{width:110px;height:110px;border-radius:50%;object-fit:cover;background:var(--turf-2);border:3px solid var(--line)}
.phero .meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--dim);margin-top:8px;align-items:center}
.inj{display:inline-flex;gap:6px;align-items:center;border-radius:999px;padding:3px 10px;font-size:13px;font-weight:700;
  background:rgba(229,96,74,.15);color:#FFB4A6}
.inj.q{background:rgba(233,162,59,.15);color:#FFD08A}

/* prop board */
.board{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.mk{text-align:left;background:var(--turf);border:1px solid var(--line);border-radius:var(--r);padding:12px;cursor:pointer}
.mk:hover{border-color:#3A5578}
.mk.on{border-color:var(--first);background:rgba(245,211,60,.07)}
.mk .t{font-size:13px;color:var(--dim)}
.mk .v{font:700 24px var(--cond);margin:2px 0 6px}
.mk .v small{font-size:15px;color:var(--dim);font-weight:600}
.mk .p{font-size:13px}

.propgrid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px}
.stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.stepper button{background:var(--turf-2);border:0;width:42px;height:42px;font-size:20px;cursor:pointer}
.stepper input{width:90px;text-align:center;background:var(--night);border:0;height:42px;font:700 22px var(--cond)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px;background:var(--night)}
.seg button{border:0;background:none;padding:7px 16px;border-radius:999px;font-weight:700;cursor:pointer;color:var(--dim)}
.seg button.on.ov{background:var(--over);color:#06240f}
.seg button.on.un{background:var(--under);color:#2a0802}
.seg button.on{background:var(--chalk);color:var(--night)}
.hits{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}
.hit{background:var(--night);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px}
.hit .t{font-size:13px;color:var(--dim)}
.hit .v{font:800 28px var(--cond)}
.hit .f{font-size:12px;color:var(--dim)}
.hit .b{height:4px;border-radius:2px;background:var(--line);margin-top:6px;overflow:hidden}
.hit .b i{display:block;height:100%}
.chart svg{width:100%;height:auto;display:block}
.chart text{font:600 11px var(--body);fill:var(--dim)}

/* team */
.rankbar{display:grid;grid-template-columns:minmax(120px,1.4fr) 60px 1fr 46px;gap:10px;align-items:center;font-size:14px;padding:5px 0}
.rankbar .track{height:8px;border-radius:4px;background:var(--line);overflow:hidden}
.rankbar .track i{display:block;height:100%;border-radius:4px}
.roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.pcard{display:flex;gap:10px;align-items:center;background:var(--turf);border:1px solid var(--line);border-radius:var(--r);padding:10px}
.pcard:hover{border-color:#3A5578}
.pcard img{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--turf-2)}
.pcard .s{font-size:13px;color:var(--dim)}
.results-strip{display:flex;gap:6px;flex-wrap:wrap}
.res-g{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--night);border:1px solid var(--line);border-radius:var(--r-sm);padding:6px 8px;font-size:12px;min-width:58px}
.res-g b{font:700 15px var(--cond)}
.res-g.W b{color:var(--over)} .res-g.L b{color:var(--under)}

/* key players list */
.kp{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(38,60,89,.55)}
.kp:last-child{border-bottom:0}
.kp img{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--turf-2)}
.kp .s{font-size:13px;color:var(--dim)}
.kp .r{text-align:right}
.addbtn{border:1px solid var(--line);background:var(--turf-2);border-radius:999px;width:32px;height:32px;cursor:pointer;font-size:18px;line-height:1}
.addbtn:hover{border-color:var(--first);color:var(--first)}

/* ---------- slip ---------- */
.slip{position:fixed;top:0;right:0;bottom:0;width:min(420px,100vw);z-index:50;background:var(--turf-2);
  border-left:1px solid var(--line);display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.4)}
.slip-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}
.slip-head h2{margin:0}
#slipBody{overflow:auto;padding:16px 20px 30px;flex:1}
.icon{background:none;border:0;font-size:18px;cursor:pointer;color:var(--dim);padding:6px}
.scrim{position:fixed;inset:0;background:rgba(5,10,18,.55);z-index:40}
.leg{background:var(--turf);border:1px solid var(--line);border-radius:var(--r);padding:12px 12px 12px 14px;margin-bottom:10px;position:relative}
.leg .x{position:absolute;top:6px;right:6px}
.leg .n{font-weight:700}
.leg .d{font-size:14px;color:var(--dim)}
.leg .side-o{color:var(--over);font-weight:700} .leg .side-u{color:var(--under);font-weight:700}
.sugg{border:1px solid var(--first);background:rgba(245,211,60,.06);border-radius:var(--r);padding:14px;margin-top:16px}
.sugg .row{margin-top:12px}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%) translateY(20px);opacity:0;background:var(--chalk);
  color:var(--night);font-weight:700;padding:10px 18px;border-radius:999px;z-index:60;pointer-events:none;transition:.25s}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- mobile ---------- */
.tabbar{display:none}
@media (max-width:900px){
  .slip-btn,.search kbd{display:none}
  .top{padding:10px 14px;gap:8px 12px;flex-wrap:wrap}
  /* every section stays reachable on phones: the menu becomes a swipeable row under the search */
  .nav{order:3;width:100%;margin:0 -4px}  /* wraps (rule at the end of this file): every link visible */
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding:6px 12px;font-size:14px}
  .brand span{display:none}
  main{padding:18px 14px 110px}
  h1{font-size:34px}
  .grid2,.grid3,.propgrid{grid-template-columns:1fr}
  .slate{grid-template-columns:1fr}
  .scoreboard{grid-template-columns:1fr;gap:10px}
  .scoreboard .side.r{justify-content:flex-start;text-align:left;flex-direction:row-reverse}
  .phero{grid-template-columns:auto 1fr}
  .phero .ph{width:76px;height:76px}
  .phero>.pick{grid-column:1/-1}
  .jump{top:63px}
  .tabbar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:35;background:rgba(19,36,58,.97);
    border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));justify-content:space-around}
  .tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;font-weight:600;
    color:var(--dim);background:none;border:0;padding:4px 8px;position:relative}
  .tabbar svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}
  .tabbar .on{color:var(--first)}
  .tabbar b{position:absolute;top:0;right:4px;background:var(--first);color:var(--night);border-radius:999px;font-size:10px;padding:0 5px}
  .rankbar{grid-template-columns:1fr 50px 70px 40px}
}

/* ---------- research stat grid ---------- */
.statgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.statgrid>div{background:var(--night);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.statgrid span{font-size:12px;color:var(--dim)}
.statgrid b{font-size:26px;font-weight:800;line-height:1.1}
.statgrid i{font-style:normal;font-size:12px;font-weight:600}
.signal.warnsig{background:rgba(233,162,59,.12);border-color:rgba(233,162,59,.45);color:#FFDDA8}
.venuebar{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);display:grid;gap:4px}
.game .venue{margin:-4px 0 6px}
tr.dimrow td{opacity:.55}
tr.sel td{background:rgba(245,211,60,.08)}
details summary{cursor:pointer;color:var(--dim)}
.tag.okt{color:var(--over);background:rgba(61,190,122,.1)}
.swsec{padding:12px 0;border-top:1px solid var(--line);display:grid;gap:4px}
.livecard{margin-bottom:20px}
.ins .ev summary{display:none}
@media (max-width:640px){
  /* Live insights: one card per player instead of a 9-column table */
  .ins,.ins tbody{display:block}
  .ins thead{display:none}
  .ins tr{display:grid;grid-template-columns:repeat(3,1fr);grid-template-areas:"pl pl bs" "mk ln od" "now need proj" "ev ev ev";
    gap:4px 8px;padding:10px 0;border-bottom:1px solid var(--line)}
  .ins tr:last-child{border-bottom:0}
  .ins td{padding:0;border:0;text-align:left}
  .c-pl{grid-area:pl}.c-bs{grid-area:bs;text-align:right!important}.c-mk{grid-area:mk}.c-ln{grid-area:ln}.c-od{grid-area:od}
  .c-now{grid-area:now}.c-need{grid-area:need}.c-proj{grid-area:proj}.c-ev{grid-area:ev}
  .ins [data-l]{background:var(--night);border:1px solid var(--line);border-radius:var(--r);padding:4px 8px;font-family:var(--cond);font-size:24px;font-weight:700;line-height:1.1}
  .ins [data-l]::before{content:attr(data-l);display:block;font:600 12px var(--body);color:var(--dim)}
  .ins [data-l] .small{font:600 11px var(--body);white-space:nowrap}
  .ins .c-bs .tag{white-space:nowrap;font-size:11px}
  .ins .c-od{text-align:right!important}
  .ins .c-proj .pv{color:var(--first)}
  .ins .ev summary{display:list-item}
  .ins .ev[open] summary{margin-bottom:4px}
}

/* ---------- bet slip v2 ---------- */
.leg{display:grid;gap:8px}
.leg .x{position:static}
.legctl{gap:8px;align-items:flex-end}
.seg.sm button{padding:5px 11px;font-size:14px}
.seg.wide{display:flex}
.seg.wide button{flex:1}
.field.inline{gap:3px;font-size:12px}
.field.inline input,.field.inline select{padding:6px 8px;font-size:14px}
.field.inline .lineIn{width:70px}
.field.inline input[data-stake]{width:90px}
.oddsbox{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;line-height:1.1}
.oddsbox b{font-size:22px}
.stake{gap:12px;align-items:flex-end;padding-top:6px;border-top:1px dashed var(--line)}
.totals{margin-top:12px;padding:14px;display:grid;gap:4px}
.nav a{white-space:nowrap}
@media (max-width:1180px){.top{gap:12px;padding:12px 16px}.nav a{padding:7px 9px;font-size:15px}.search kbd{display:none}.brand span{display:none}}
.recleg{display:grid;gap:6px;padding:10px 0;border-top:1px solid var(--line)}
.recleg .evy,.recleg .evn{display:inline-block;margin-right:10px}
.recleg .evy{color:var(--over)} .recleg .evn{color:var(--dim)}
.parlay{display:flex;flex-direction:column;gap:2px}
.parlay .btn{margin-top:10px;justify-content:center}
.side-o{color:var(--over)} .side-u{color:var(--under)}
.bestc{color:var(--over);font-weight:700}
/* prop tiles: content pinned to the top so a tall neighbour (long QB labels) doesn't shift others */
.mk{display:flex;flex-direction:column;justify-content:flex-start;gap:2px;min-width:0}
.mk .t{flex-wrap:nowrap!important;gap:6px}
.mk .t>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mk .t .tag{flex:none}
.mk .p{margin-top:auto}
.propgrid>*,.grid2>*,.grid3>*,.slate>*,.board>*{min-width:0}
.vline{color:var(--dim);margin-top:6px;line-height:1.5}
.vline b{color:var(--chalk);font-weight:600}

/* ---------- voice search ---------- */
.mic{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:0;background:none;cursor:pointer;color:var(--dim)}
.mic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.mic:hover{color:var(--chalk);background:var(--turf-2)}
.mic.on{color:var(--night);background:var(--first);animation:micpulse 1.2s ease-in-out infinite}
.mic.off{opacity:.45}
@keyframes micpulse{0%,100%{box-shadow:0 0 0 0 rgba(245,211,60,.5)}50%{box-shadow:0 0 0 7px rgba(245,211,60,0)}}
@media (prefers-reduced-motion:reduce){.mic.on{animation:none}}
.voicebar{position:absolute;left:0;right:0;top:50px;background:var(--turf-2);border:1px solid var(--first);border-radius:var(--r);
  padding:10px 14px;font-size:14px;z-index:5;box-shadow:0 12px 30px rgba(0,0,0,.4)}

/* ---------- polish: calmer surfaces, clearer hierarchy, easier tables ---------- */
body{background:radial-gradient(1200px 600px at 50% -200px,#16294A 0%,var(--night) 60%) fixed var(--night)}
.panel{background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0)) ,var(--turf);border-color:rgba(38,60,89,.9);
  box-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 8px 24px rgba(0,0,0,.18)}
h1{letter-spacing:-.01em}
h2{font-size:24px;letter-spacing:.005em}
h3{font-size:18px;letter-spacing:.01em}
.pagehead{padding-bottom:14px;border-bottom:1px solid rgba(38,60,89,.6)}
.pagehead p{max-width:78ch}
th{font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;padding:10px;background:rgba(14,26,43,.35)}
td{padding:10px}
tbody tr{transition:background .12s}
tbody tr:hover td{background:rgba(255,255,255,.025)}
td.n,.num{font-variant-numeric:tabular-nums}
.tablewrap{border-radius:var(--r);-webkit-overflow-scrolling:touch}
.chip{min-height:32px;transition:border-color .12s,color .12s}
.chip:hover{border-color:var(--dim);color:var(--chalk)}
.btn{transition:border-color .12s,transform .06s}
.btn:active{transform:translateY(1px)}
.tag{letter-spacing:.01em}
.blk{scroll-margin-top:80px}
.signal{border-radius:var(--r)}
details>summary{list-style:none;display:inline-flex;align-items:center;gap:6px}
details>summary::-webkit-details-marker{display:none}
details>summary::before{content:"▸";font-size:11px;transition:transform .15s}
details[open]>summary::before{transform:rotate(90deg)}
details.fold>summary::before{content:none}
@media (max-width:900px){
  .panel{padding:16px}
  th{font-size:11px;padding:8px}
  td{padding:8px}
  .pagehead{margin-bottom:16px}
}
img{max-width:100%}
.hs{width:56px;height:56px;border-radius:50%;object-fit:cover;background:var(--turf-2);flex:none}

/* ---------- momentum ---------- */
.momentum{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);display:grid;gap:6px}
.mbar{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;font:700 14px var(--cond)}
.mbar .track{position:relative;height:10px;border-radius:999px;background:linear-gradient(90deg,rgba(229,96,74,.35),var(--turf-2) 50%,rgba(61,190,122,.35))}
.mbar .mid{position:absolute;left:50%;top:-3px;bottom:-3px;width:2px;background:var(--dim)}
.mbar .pin{position:absolute;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:var(--first);box-shadow:0 0 0 3px rgba(245,211,60,.25);transition:left .4s}
.mprobs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:4px}
.mprob{background:var(--night);border:1px solid var(--line);border-radius:var(--r);padding:8px 10px;display:flex;flex-direction:column;gap:1px}
.mprob b{font-size:24px;line-height:1.1}
.wpspark{width:100%;height:110px;margin-top:6px;background:var(--night);border-radius:var(--r)}
@media (max-width:640px){.mprobs{grid-template-columns:1fr 1fr}.mprobs .mprob:last-child{grid-column:span 2}}
.gpick{padding:14px 0;border-top:1px solid var(--line)}
.sgp{padding:12px;display:grid;gap:4px}
.sgp .btn,.gpick .btn{margin-top:8px}
.liveline{margin:-2px 0 8px;padding:8px 10px;border-radius:var(--r);background:rgba(245,211,60,.07);border:1px solid rgba(245,211,60,.3)}
.howlist{margin:6px 0 0;padding-left:18px;display:grid;gap:3px}

/* ---------- plays ---------- */
.play{display:grid;gap:6px;align-content:start;border-left:3px solid var(--first)}
.play.pre{border-left-color:var(--line)}
.nbadge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--first);color:var(--night);font-size:11px;font-weight:800;margin-left:4px}
.tabbar .nbadge{position:absolute;top:2px;margin-left:22px}
.tabbar a{position:relative}
.play.bov{border-left-color:#C8102E}
.bovline{padding:4px 8px;border-radius:var(--r-sm);background:rgba(200,16,46,.12);color:#FFB3BE;justify-self:start}

/* game props: same column widths in every table */
.gptable { table-layout: fixed; width: 100%; }
.gptable td:nth-child(n+2), .gptable th:nth-child(n+2) { width: 92px; }
@media (max-width: 600px) { .gptable td:nth-child(n+2), .gptable th:nth-child(n+2) { width: 64px; } }

/* the menu gets its own row under the search and wraps, so every link is always visible
   (a single row pushed Scores/Fantasy/Live off-screen on laptop-size windows) */
.top{flex-wrap:wrap;row-gap:8px}
.nav{order:3;width:100%;flex-wrap:wrap;margin:0 -6px}
.nav a{padding:6px 12px}

/* Top 5 Picks / MAX LOCK spotlight */
.maxlock { position: relative; margin: 0 0 14px; padding: 4px; border-radius: 16px;
  background: linear-gradient(135deg, rgba(245, 211, 60, .55), rgba(245, 211, 60, .08));
  box-shadow: 0 10px 28px rgba(0, 0, 0, .35); }
.maxlock .panel { margin: 0; border-color: rgba(245, 211, 60, .7); }
.maxlock-tag { font: 800 22px var(--cond); letter-spacing: .06em; color: var(--first); padding: 6px 12px 8px; }
.maxlock-tag span { font: 500 12px var(--body); letter-spacing: 0; color: var(--dim); margin-left: 8px; }
.topn { position: relative; }
.topn-rank { position: absolute; top: -8px; left: -6px; z-index: 1; font: 800 15px var(--cond); background: var(--first); color: var(--night);
  border-radius: 999px; padding: 2px 8px; }
@media (max-width: 600px) { .maxlock-tag span { display: block; margin: 2px 0 0; } }

/* Live edge scanner */
.gstrip { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin-bottom: 14px; }
.gstrip .gs { margin: 0; }
.mvchip { border: 1px solid var(--line); border-radius: 999px; padding: 0 7px; }
.mvchip.up { color: var(--over); } .mvchip.dn { color: var(--under); }
.edges { display: grid; gap: 12px; margin-top: 10px; }
.edge.best { border-color: var(--first); box-shadow: 0 8px 22px rgba(0, 0, 0, .3); }
.edgegrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 4px 14px; margin: 8px 0; }
.noedge { margin-top: 10px; border-left: 4px solid var(--dim); }
.noedge > b { font: 800 22px var(--cond); letter-spacing: .05em; }

/* NFL | NBA switch */
.sportsw { display: flex; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; flex-shrink: 0; }
.sportsw a { padding: 7px 12px; min-height: 38px; display: flex; align-items: center; font: 700 15px var(--cond); letter-spacing: .04em; color: var(--dim); }
.sportsw a.on { background: var(--chalk); color: var(--night); }

/* Phone header: logo, NFL/NBA switch and search on one row; the menu is one swipeable row */
@media (max-width: 640px) {
  .top { flex-wrap: wrap; padding: 8px 12px; gap: 6px 8px; }
  .brand { order: 0; }
  .sportsw { order: 1; }
  .search { order: 2; flex: 1 1 0; min-width: 0; padding-top: 0; padding-bottom: 0; height: 38px; }
  .search input { min-width: 0; }
  .nav { order: 3; width: auto; flex: 1 1 100%; flex-wrap: nowrap; overflow-x: auto; margin: 0 -12px; padding: 0 12px 2px;
         scrollbar-width: none; -webkit-overflow-scrolling: touch;
         -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
  .nav::-webkit-scrollbar { display: none; }
  .nav a { padding: 5px 11px; font-size: 14px; flex-shrink: 0; }
}
@media (max-width: 640px) {
  /* any table not already in a scroll box scrolls on its own instead of pushing the page wider than the screen */
  #app :not(.tablewrap) > table { display: block; overflow-x: auto; max-width: 100%; }
}

/* Home-screen app: the page draws under the iPhone status bar (black-translucent), so the sticky
   header starts below the clock / notch / Dynamic Island. 0 in a normal browser tab. */
.top { padding-top: calc(12px + env(safe-area-inset-top)); padding-left: max(24px, env(safe-area-inset-left)); padding-right: max(24px, env(safe-area-inset-right)); }
@media (max-width: 1180px) { .top { padding-top: calc(12px + env(safe-area-inset-top)); padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); } }
@media (max-width: 640px) {
  .top { padding-top: calc(8px + env(safe-area-inset-top)); padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  /* NFL / NBA switch: a real thumb-size target */
  .sportsw a { padding: 9px 14px; font-size: 15px; min-height: 38px; display: flex; align-items: center; }
}
/* game status on bet cards: NYK @ ATL · Q3 4:12 · 78-71 */
.gstag { white-space: nowrap; }
.gstag.live { color: var(--over); font-weight: 600; }
/* bankroll in the header (My Bets) */
.bankpill { font: 700 14px var(--cond); padding: 6px 10px; border-radius: 999px; border: 1px solid var(--line); color: var(--chalk); white-space: nowrap; }
.bankpill.warn { border-color: var(--under); color: var(--under); }
/* Game Props: one line per bet, tap to see every book */
.gpd summary { cursor: pointer; list-style: none; display: block; }
.gpd summary::-webkit-details-marker { display: none; }
.gpd summary::before { content: "▸"; color: var(--dim); margin-right: 6px; display: inline-block; transition: transform .15s; }
.gpd[open] summary::before { transform: rotate(90deg); }
.gpbooks { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.gpbooks span { font-size: 13px; padding: 3px 8px; border: 1px solid var(--line); border-radius: 999px; white-space: nowrap; }
.gpbooks span.best { border-color: var(--over); color: var(--over); }
.gpbooks span.off { text-decoration: line-through; opacity: .6; }
@media (prefers-reduced-motion: reduce) { .gpd summary::before { transition: none; } }
.gpd summary .small { display: block; margin-left: 16px; }
/* Plays page: big section titles (Player props / Game props / Parlays / Results) */
.sechead { font-size: 26px; padding-bottom: 6px; border-bottom: 2px solid var(--line); scroll-margin-top: 120px; }
section[id^="sec-"] { scroll-margin-top: 120px; }
/* section links sit right under the header, whatever its height (phone header grows with the safe area + menu row) */
.jump { top: var(--hdr, 69px) !important; }
.jump a.on { color: var(--night); background: var(--chalk); border-color: var(--chalk); }
/* jump links land below the header + the links bar */
section.blk, .sechead, [id^="h-"] { scroll-margin-top: calc(var(--hdr, 69px) + 60px); }
/* defensive plays fold-down */
.deffold > summary { cursor: pointer; }
/* game total projection + lean */
.projbox { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: flex-end; padding: 10px 12px; margin: 0 0 8px; border: 1px solid var(--line); border-radius: 12px; }
.projbox > div { display: flex; flex-direction: column; }
.projbox b { font-size: 20px; }
/* sub-tabs of the current main tab (Games / Bets / Live / My Bets / More) */
.subnav { display: flex; gap: 6px; overflow-x: auto; padding: 12px 24px 0; max-width: 1240px; margin: 0 auto; scrollbar-width: none; }
.subnav::-webkit-scrollbar { display: none; }
.subnav a { flex: none; padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line); font-weight: 600; font-size: 14px; color: var(--dim); white-space: nowrap; }
.subnav a:hover { color: var(--chalk); border-color: var(--dim); }
.subnav a.on { color: var(--chalk); border-color: var(--first); background: rgba(245, 211, 60, .08); }
.tabbar a.on { color: var(--first); }
@media (max-width: 640px) { .subnav { padding: 10px 16px 0; } }
/* compact bet cards: the bet, price, chance and edge show; reasons, risks and tools open on tap */
details.more { margin-top: 6px; }
details.more > summary { cursor: pointer; list-style: none; font-size: 13px; color: var(--dim); padding: 4px 0; }
details.more > summary::-webkit-details-marker { display: none; }
details.more > summary::before { content: "▸ "; }
details.more[open] > summary::before { content: "▾ "; }
details.more[open] > summary { margin-bottom: 4px; }
.chip.quickadd { margin-left: auto; padding: 2px 10px; border-color: var(--first); color: var(--first); }
/* refresh button in the header */
.iconbtn { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 999px; border: 1px solid var(--line); background: none; color: var(--chalk); flex: none; }
.iconbtn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.iconbtn.spin svg { animation: spin .8s ease-out; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .iconbtn.spin svg { animation: none; } }
/* game page: secondary sections fold closed; tap the title to open */
details.fold > summary { cursor: pointer; list-style: none; }
details.fold > summary::-webkit-details-marker { display: none; }
details.fold > summary h2 { display: inline-flex; align-items: center; gap: 8px; }
details.fold > summary h2::after { content: "▸"; font-size: 16px; color: var(--dim); }
details.fold[open] > summary h2::after { content: "▾"; }
details.fold:not([open]) { padding-bottom: 0; }
/* Right now strip (Games) */
.rightnow { margin-bottom: 16px; }
.rn { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.rn > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rn-live { font-size: 13px; }
@media (max-width: 640px) { .rn { gap: 8px; } .rn > div { font-size: 13px; } .rn b { font-size: 13px; } .rightnow { padding: 12px; } }
/* phones: live games get the full width (their lines don't wrap); MAX LOCK and your bets share the row under them */
@media (max-width: 640px) { .rn { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; } .rn > div:first-child { grid-column: 1 / -1; }
  .rn-live { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } }
/* favorite star */
.star { background: none; border: 0; color: var(--dim); font-size: 26px; line-height: 1; padding: 0 4px; cursor: pointer; vertical-align: middle; }
.star.on { color: var(--first); }

/* tappable bet cards and result rows (open the case for the play) */
.go{cursor:pointer;-webkit-tap-highlight-color:transparent}
@media (hover:hover){
  .panel.go:hover{border-color:var(--first);box-shadow:0 0 0 1px var(--first) inset}
  tr.go:hover td{background:rgba(255,255,255,.04)}
}
.panel.go:active{transform:scale(.995);border-color:var(--first)}
a.why{color:var(--first);font-weight:700;text-decoration:none;margin-left:auto;display:inline-flex;align-items:center;min-height:32px;padding:0 6px}
a.why:hover{text-decoration:underline}

/* verdict block at the top of a play's case page */
.verdict{margin-bottom:16px;border-left:6px solid var(--line)}
.verdict.v-bet{border-left-color:var(--over,#3ddc84)}
.verdict.v-lean{border-left-color:var(--first)}
.verdict.v-pass{border-left-color:var(--under,#ff5d5d)}
.vbadge{font:800 22px/1 var(--cond);letter-spacing:.04em;padding:10px 12px;border-radius:8px;background:rgba(255,255,255,.08);min-width:72px;text-align:center}
.v-bet .vbadge{background:var(--over,#3ddc84);color:#08130c}
.v-lean .vbadge{background:var(--first);color:#1a1500}
.v-pass .vbadge{background:var(--under,#ff5d5d);color:#1c0505}
.vhead{font:600 17px/1.35 var(--body)}
.vgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 18px;margin-top:12px}
.vlist b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;opacity:.75;margin-bottom:4px}
.vlist ul{margin:0;padding-left:18px;font-size:14px}
.vlist.ok b{color:var(--over,#3ddc84)}.vlist.warn b{color:var(--amber,#f5a623)}.vlist.chg b{color:var(--first)}

/* ---------- iPhone Duo and other mid-size screens ----------
   Cover screen 5.4" (about 466 x 678 pt, wider and shorter than a normal phone), inner screen 7.6"
   (about 626 x 890 pt portrait, 890 x 626 landscape), and Split View (an app can get 300-450 pt).
   Everything re-lays out from CSS alone, so folding or unfolding mid-page just reflows. */
@media (min-width:560px) and (max-width:900px){
  /* inner screen and iPad mini: two columns of cards instead of one stretched column */
  .grid2{grid-template-columns:1fr 1fr;gap:14px}
  .grid3{grid-template-columns:1fr 1fr;gap:14px}
  .slate{grid-template-columns:repeat(2,minmax(0,1fr))}
  .statgrid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
  .vgrid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
}
@media (max-width:480px){
  /* cover screen in Split View, narrow phones: verdict stacks, tiles go two-up, tables tighten */
  .verdict .row{flex-direction:column;gap:8px}
  .vbadge{align-self:flex-start;font-size:18px;padding:6px 10px;min-width:0}
  .vhead{font-size:15.5px}
  .vgrid{grid-template-columns:1fr;gap:8px}
  .statgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .statgrid>div{padding:7px 8px}
  .statgrid b{font-size:19px}
  .statgrid i{font-size:11px;font-weight:500}
  .pagehead h1{font-size:22px!important}
  table{font-size:13px}
  th,td{padding:7px 6px}
  .play .row.small{row-gap:4px}
}
@media (max-width:400px){
  /* an app squeezed to a third of the inner screen: any table may scroll sideways on its own */
  .panel>table{display:block;overflow-x:auto;max-width:100%}
  .statgrid b{font-size:17px}
  .tabbar a,.tabbar button{font-size:11px;padding-left:4px;padding-right:4px}
  .play [style*="font-size:26px"]{font-size:22px!important}
}
@media (max-width:360px){.mic{display:none}}
/* short, wide screens (cover screen landscape, inner screen landscape): keep the header to one row */
@media (max-height:520px) and (min-width:700px){
  .top{padding-top:calc(6px + env(safe-area-inset-top));padding-bottom:6px}
  .nav{order:0;width:auto}
  .pagehead{margin-bottom:12px}
}
/* seven sport pills: their own full-width row on phones, each a thumb-size target */
@media (max-width: 640px) {
  .sportsw { order: 1; flex: 1 1 100%; }
  .sportsw a { flex: 1 1 auto; justify-content: center; padding: 10px 0; min-height: 48px; font-size: 15px; letter-spacing: 0; }
  .search { min-width: 0; flex: 1 1 200px; }   /* too little room next to the pills -> its own full row */
  .bankpill { font-size: 12px; padding: 4px 8px; }
}

/* UFC: round fighter headshots on fight tiles */
.ufcph { border-radius: 50%; object-fit: cover; background: var(--turf); }
.ufcbig { width: 72px; height: 72px; flex: none; }
/* tables in a two-column grid scroll inside their own column instead of spilling over the next one */
.grid2>*>table,.grid3>*>table,.grid2>.panel>table{display:block;overflow-x:auto;max-width:100%}
/* closing-line-value tables have 5 columns: side by side only on wide screens */
@media (max-width:1100px){ .clvgrid{grid-template-columns:1fr} }

/* public copy: read-only (no bankroll, no "I placed this", no phone alerts) + 21+ gate */
.public .bankpill, .public [data-placed], .public #placedSlip, .public #alertsBtn, .public [data-al] { display: none !important; }
.agegate { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgba(8, 14, 24, .94); }
.agegate .panel { max-width: 420px; }
.gate { z-index: 99; display: flex; flex-direction: column; align-items: center; overflow-y: auto; }   /* sign-in / subscribe sheet: under the 21+ gate, scrolls on short phones */
.gate .panel { width: 100%; margin: auto 0; }
.gate .field, .gate .field input { display: block; width: 100%; }
.gate form { display: grid; gap: 10px; margin: 12px 0 0; }
.gate .err { margin: 12px 0 0; padding: 10px 12px; overflow-wrap: anywhere; }
.legal { margin: 30px 16px 90px; text-align: center; font-size: 12px; color: var(--dim); }

/* live edges: the price to take, big; bet ticket sheet */
.entry { margin: 6px 0 2px; font-size: 14px; }
.entry b { font-size: 24px; color: var(--first); margin: 0 4px; }
.chip.primary { background: var(--first); color: var(--night); border-color: var(--first); font-weight: 700; }
.ticket { max-width: 460px; width: 100%; }
.tgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.tgrid > div { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; }
.tgrid b { font-size: 20px; }
.tcheck { margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.04); }

/* My books: cards priced at a book you don't have */
.notmine { display: none !important; }
.subnav a.books { border-style: dashed; }
.subnav a.books.on { border-style: solid; background: var(--chalk); color: var(--night); }

/* phones: page intros are one line; tap to read the rest */
@media (max-width: 640px) {
  .pagehead p { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
  .pagehead p.open { -webkit-line-clamp: unset; }
  .pagehead { margin-bottom: 14px; }
}
/* bet cards: the price stays top-right however long the player / game line is */
.play > .row:first-child { flex-wrap: nowrap; align-items: flex-start; }
.play > .row:first-child > div:first-child { min-width: 0; }
.play > .row:first-child > div:last-child { flex: none; }

/* method notes live in the How it works tab */
.howto { display: none !important; }