
:root{
  --bg:#F5F7F6; --card:#FFFFFF; --ink:#131A17; --muted:#5E6B65; --line:#DDE3E0;
  --accent:#0F7B55; --accent-ink:#FFFFFF; --soft:#E3F2EC;
  --win:#0F7B55; --loss:#C2413A; --pend:#9A6A00; --tkbar:#0F7B55; --tkbar-ink:#FFFFFF; --tkbody:#F8F8FA; --pkhead:#EDEDED;
  --sans:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark;--bg:#0F1412;--card:#171E1B;--ink:#E8EEEB;--muted:#94A39C;--line:#2A3430;
  --accent:#34C08A;--accent-ink:#0B1310;--soft:#1C2E27;--win:#34C08A;--loss:#EF6B63;--pend:#E0B04A;--tkbar:#1E6B4E;--tkbar-ink:#F2F7F4;--tkbody:#1B2220;--pkhead:#222B28;}}
:root[data-theme="dark"]{
  color-scheme:dark;--bg:#0F1412;--card:#171E1B;--ink:#E8EEEB;--muted:#94A39C;--line:#2A3430;
  --accent:#34C08A;--accent-ink:#0B1310;--soft:#1C2E27;--win:#34C08A;--loss:#EF6B63;--pend:#E0B04A;--tkbar:#1E6B4E;--tkbar-ink:#F2F7F4;--tkbody:#1B2220;--pkhead:#222B28;}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.45}
.wrap{max-width:560px;margin:0 auto;padding-inline:16px;padding-block:18px 40px;display:flex;flex-direction:column;gap:16px}
header{display:flex;align-items:center;gap:10px;flex-wrap:wrap;row-gap:8px}
header .bals{margin-left:auto}
.themebtn{width:34px;height:34px;flex:none;display:grid;place-items:center;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:50%;cursor:pointer;padding:0}
.themebtn:hover{border-color:var(--accent)}
.themebtn .sun{display:none}
.dark .themebtn .moon{display:none}.dark .themebtn .sun{display:block}
.logo{font-weight:800;font-size:22px;letter-spacing:-.02em}
.logo span{color:var(--accent)}
.logo .logoimg{display:block;height:34px;width:auto;max-width:200px}
.logo .logoimg.dk{display:none}
:root[data-theme="dark"] .logo .logoimg.lt{display:none}:root[data-theme="dark"] .logo .logoimg.dk{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .logo .logoimg.lt{display:none}:root:not([data-theme="light"]) .logo .logoimg.dk{display:block}}
.bals{display:flex;gap:6px;flex-wrap:nowrap;justify-content:flex-end}
@media (max-width:420px){.bal{padding:4px 8px;font-size:12px}.bal span{font-size:10px}.logo{font-size:20px}header{gap:8px}}
.bal span{font-family:var(--sans);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.bal.free b{color:var(--accent)}
.bal{font-family:var(--mono);font-variant-numeric:tabular-nums;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-size:13px;white-space:nowrap}
/* Nav: underline style. The selected tab gets a green bar under it. */
.tabs{display:grid;grid-template-columns:repeat(6,auto);border-bottom:1px solid var(--line);gap:4px}
.tabs button{font:inherit;font-size:14px;font-weight:700;border:0;background:transparent;color:var(--muted);padding:12px 4px 10px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:4px}
button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
section{display:flex;flex-direction:column;gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:12px}
h2,h1.as-h2{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0;font-weight:700}
.pgh1{font-size:20px;line-height:1.25;font-weight:800;letter-spacing:-.01em;margin:0;color:var(--ink);text-wrap:balance}   /* a page's main heading where it had none (owner 2026-10-15: "Monthly Contest Leaderboard is fine") */
.twobal{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.twobal>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.twobal>div+div{border-left:1px solid var(--line);padding-left:12px}
.lbl{font-size:13px;font-weight:700;color:var(--muted)}
.big.free{color:var(--accent)}
.deposit{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.deposit .btn:not(.primary){align-self:flex-start}
.deposit .row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.deposit .row .btn{padding:9px 4px;font-size:13px;white-space:nowrap}
.big{font-family:var(--mono);font-size:clamp(24px,7vw,32px);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.row{display:flex;gap:8px;flex-wrap:wrap}
.btn{font:inherit;font-weight:700;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:9px 14px;border-radius:8px;cursor:pointer}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.on{background:var(--soft);border-color:var(--accent);color:var(--ink)}
.list{display:flex;flex-direction:column}
.item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block:10px;border-top:1px solid var(--line)}
.item:first-child{border-top:0;padding-top:0}
.item small{display:block;color:var(--muted);font-size:13px}
.amt{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.pill{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;border-radius:999px;border:1px solid currentColor}
.pill.push{color:var(--muted)}.pill.win{color:var(--win)}.pill.loss{color:var(--loss)}.pill.open{color:var(--pend)}
.user{font-weight:700;font-size:14px}
.empty{color:var(--muted);font-size:14px}
.game-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.game-top b{font-size:16px}
.live{font-size:12px;font-weight:700;color:var(--loss)}
.market{display:flex;flex-direction:column;gap:6px}
.market p{margin:0;font-size:14px;color:var(--muted)}
.odds{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.odd{font:inherit;display:flex;justify-content:space-between;gap:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:8px;padding:10px 12px;cursor:pointer;text-align:left}
.odd:hover{border-color:var(--accent)}
.odd span:last-child{font-family:var(--mono);color:var(--accent)}
.periods{display:flex;flex-wrap:wrap;gap:6px}
.periods .btn{white-space:nowrap}
#stakes .btn,#leagues .btn,#periods .btn{padding:5px 10px;font-size:13px;border-radius:7px}
.mhead{display:flex;justify-content:space-between;align-items:center;gap:8px;background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:11px 12px}
.mhead .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:1px;animation:blink 1.4s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.mhead .dot{animation:none}}
.mteams{padding:9px 12px;font-weight:700;font-size:13px;border-top:1px solid var(--line);background:var(--bg)}
.mteams small{font-size:13px}
.mrow{display:grid;grid-template-columns:34% 1fr;border-top:1px solid var(--line)}
.mq{padding:10px 12px;font-weight:700;font-size:13px;display:flex;align-items:center}
.mopts{display:grid}
.mopts>.mcell{border-left:1px solid var(--line);border-radius:0;display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 2px}
.mcell .on{font-family:var(--sans);font-size:11px;color:var(--muted);font-weight:700}
.mcell .v{font-size:13px}
.mcell:hover{background:var(--soft)}
@media (max-width:480px){.mq{font-size:12px;padding-inline:8px}.mteams{font-size:12px}.mteams small{font-size:12px}}
.tblwrap{overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:10px}
table.lines{width:100%;table-layout:fixed;border-collapse:collapse;font-variant-numeric:tabular-nums}
.lines th{background:var(--bg);color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em;padding:11px 8px;text-align:center;white-space:nowrap}
.lines th:first-child{text-align:left;padding-left:12px;text-transform:none;letter-spacing:0;font-size:12px}
.lines td{border-top:1px solid var(--line);padding:4px;text-align:center}
.lines th+th,.lines td+td{border-left:1px solid var(--line)}
.lines th:first-child{color:var(--ink)}
.lines td.team{text-align:left;padding:8px 12px;font-weight:700;font-size:13px;line-height:1.2}
.lines td.team small{display:block;font-weight:500;color:var(--muted);font-size:11px}
.lines col.c1{width:34%}
@media (max-width:480px){.lines col.c1{width:33%}.lines td{padding:2px}.lines th{font-size:11px;letter-spacing:.03em;padding-inline:4px}.lines th{font-size:9px}.lines th:first-child{font-size:10px;padding-left:8px}.lines td.team{font-size:12px;padding-inline:8px}.lines td.team small{font-size:10px}.cell{font-size:11px;padding-inline:2px}.cell .j{display:block;font-size:9px}}
.adbox{display:flex;flex-direction:column;gap:4px;border:1px dashed var(--line);border-radius:10px;padding:10px 12px;background:var(--card);color:var(--ink);text-decoration:none}
a.adbox:hover{border-color:var(--accent)}
.adbox .adl{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.adbox .adt{font-size:14px;font-weight:600}
.adbox .adt b{color:var(--accent)}
.adbox .adgo{font-size:13px;font-weight:700;color:var(--accent)}
.sponsor{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg)}
.sponsor .adt{font-weight:700;font-size:14px}.sponsor small{display:block;color:var(--muted);font-size:12px;font-weight:500}
.sponsor .adl{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);display:block}
.sponsor a{flex:none;font-weight:700;font-size:13px}
.tail{display:inline-block;margin-top:3px;font-size:12px;font-weight:700;color:var(--accent);text-decoration:none}
.tail:hover{text-decoration:underline}
.tail .adl{font-size:10px;color:var(--muted);font-weight:700;letter-spacing:.06em;margin-left:6px}
.offer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:12px;border-top:1px solid var(--line)}
.offer:first-child{border-top:0;padding-top:0}
.offer b{display:block;font-size:16px}.offer span{display:block;color:var(--accent);font-weight:700;font-size:14px}.offer small{display:block;color:var(--muted);font-size:13px;line-height:1.4;margin-top:3px}
.offer .btn{flex:none;text-decoration:none}
.card.offcard{flex-direction:row}
.offcard{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;color:var(--ink)}
.offcard .adl{display:block}.offcard b{font-size:15px}.offcard small{display:block;color:var(--muted);font-size:13px}
.offcard .go{flex:none;font-weight:700;color:var(--accent)}
.convert{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg)}
.convert b{display:block;font-size:14px}.convert small{display:block;color:var(--muted);font-size:12px}
.convert .btn{flex:none;padding:7px 16px}
.convpick{display:flex;flex-direction:column;gap:6px}
.stepper{display:flex;align-items:center;gap:8px}
.stepper b{flex:1;text-align:center;font-size:22px;font-weight:500;border:1px solid var(--line);border-radius:8px;padding:6px;background:var(--bg)}
.stepper .btn{width:44px;padding:8px 0;font-size:18px;line-height:1}
.stepper #convMax{width:auto;padding:8px 12px;font-size:14px}
.fa{gap:14px}
.fa-tag{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:4px 10px}
.fa h1{margin:0;font-size:26px;font-weight:800;letter-spacing:-.02em;text-wrap:balance}
.fa-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.fa-list li{display:flex;flex-direction:column;gap:2px;padding:10px 0 10px 28px;border-top:1px solid var(--line);position:relative}
.fa-list li:first-child{border-top:0}
.fa-list li::before{content:"";position:absolute;left:2px;top:14px;width:16px;height:16px;border-radius:50%;background:var(--soft);box-shadow:inset 0 0 0 2px var(--accent)}
.fa-list li::after{content:"";position:absolute;left:7px;top:18px;width:6px;height:3px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}
.fa-list b{font-size:15px}.fa-list span{color:var(--muted);font-size:13px}
.fa-price{margin:0;font-weight:700;color:var(--muted)}
.faplans{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.faplan{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:12px;cursor:pointer;background:var(--card)}
.faplan:has(input:checked){border:2px solid var(--accent);background:var(--soft);padding:11px}
.faplan input{accent-color:var(--accent);width:18px;height:18px;flex:none;margin:0}
.faplan>span:nth-of-type(1){flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.faplan small{color:var(--muted);font-size:12px;font-weight:500}
.faplan .amt{font-family:var(--mono);font-weight:500;font-size:17px;text-align:right;white-space:nowrap;display:flex;flex-direction:column}
.faplan .save{white-space:nowrap;display:inline-block;font-style:normal;font-size:11px;font-weight:800;color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:1px 7px;margin-left:4px}
.fa .btn.primary{height:48px;font-size:16px}
.facard{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;color:var(--ink);border:1px solid var(--accent);background:var(--soft)}
.card.facard{flex-direction:row}
.facard b{font-size:15px}.facard small{display:block;color:var(--muted);font-size:13px}
.facard .go{flex:none;font-weight:700;color:var(--accent)}
.card.betpromo{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;text-decoration:none;color:var(--ink);border-style:dashed}
.betpromo.fa-p{border-style:solid;border-color:var(--accent);background:var(--soft)}
.betpromo .adl{display:block;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.betpromo b{font-size:14px}.betpromo small{display:block;color:var(--muted);font-size:12px}
.betpromo .go{flex:none;font-weight:700;font-size:13px;color:var(--accent)}
.prizes{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--bg);font-size:14px}
.prizes b{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.prizes span{font-weight:800;font-size:16px}
.prizes small{color:var(--muted);font-size:12px}
.trophy{display:block;margin-left:auto}
.item.winner .plink{font-weight:800}
.amt .prize{display:block;font-family:var(--sans);font-size:11px;font-weight:800;color:var(--accent);text-transform:uppercase;letter-spacing:.04em}
.sk-prize{border-top:1px solid var(--line);padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.ladder{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.ladder div{border:1px solid var(--line);border-radius:8px;padding:6px 4px;text-align:center;background:var(--bg)}
.ladder b{display:block;font-size:15px}.ladder span{font-size:11px;color:var(--muted);font-weight:700}
.ladder.lb{margin:4px 0 2px}.ladder.lb b{display:block;font-size:15px;color:var(--ink);text-transform:none;letter-spacing:0}
.ladder .hit{border-color:var(--accent);background:var(--soft)}
.ladder .hit span{color:var(--accent)}
.sk-next{font-size:13px;color:var(--muted);margin:0}.sk-next b{color:var(--ink)}
.sk-prize .btn.primary{align-self:stretch}
.perks{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.perks li{display:flex;flex-direction:column;gap:2px;padding:12px 0;border-bottom:1px solid var(--line)}
.perks b{font-size:16px}.perks span{color:var(--muted);font-size:14px}
.pitch{min-height:auto!important;padding-top:6vh}
.h2note{float:right;text-transform:none;letter-spacing:0;font-weight:600;color:var(--muted);font-size:12px}
.nolines{align-items:center;text-align:center;color:var(--muted);font-weight:700;padding-block:28px}
.cell{font-family:var(--mono);font-size:12px;width:100%;background:none;border:1px solid transparent;border-radius:6px;padding:8px 2px;color:var(--ink);cursor:pointer}
.cell:hover{border-color:var(--accent);background:var(--soft)}
.cell .j{color:var(--muted);display:block;font-size:10px}
.cell .v{white-space:nowrap}
.dash{color:var(--muted)}
.lg{font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.06em;margin-left:6px}
#leagues{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}
#leagues .btn{padding-inline:4px;white-space:nowrap}
#leagues{max-width:480px}
.stake{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
#stakes{gap:6px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px;font-weight:700;font-size:14px;max-width:min(528px,calc(100% - 32px));z-index:25}/* above the side and footer banners (and the bet slip), within the page's column */
footer{color:var(--muted);font-size:12px;text-align:center;border-top:1px solid var(--line);padding-top:16px;display:flex;flex-direction:column;gap:8px}
footer a{color:var(--accent);font-weight:700;font-size:14px}
.sub{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sub.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.sub.four button{font-size:12px;padding:8px 4px;line-height:1.2}
.item.mb .link{font-size:12px}
.sub.three{grid-template-columns:repeat(3,minmax(0,1fr))}
#board .sub{grid-template-columns:repeat(3,minmax(0,1fr))}
#board .sub button{font-size:13px;padding:8px 4px;line-height:1.2}
.sub button{font:inherit;font-weight:700;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px;color:var(--muted);cursor:pointer}
.sub button:hover{border-color:var(--accent)}
.sub button[aria-selected="true"]{color:var(--ink);background:var(--soft);border-color:var(--accent)}
.sub.sm button{padding:6px;font-size:13px}
.sub button.sel{color:var(--ink);background:var(--soft);border-color:var(--accent)}
.avrow{display:flex;align-items:center;gap:16px}
.avatar{width:72px;height:72px;border-radius:50%;background:var(--soft);color:var(--accent);display:grid;place-items:center;font-size:28px;font-weight:800;flex:none;background-size:cover;background-position:center;border:1px solid var(--line)}
.avbtns{display:flex;gap:8px;flex-wrap:wrap}
.avbtns .btn{font-size:14px;padding:7px 12px}
.form .amtin input{font-family:var(--sans);font-size:15px;padding:10px 0;border:0;border-radius:0;background:transparent;outline:none}
@media (max-width:420px){.tabs button{font-size:12.5px;padding-inline:1px}}
.chatcard{gap:10px}
#chans{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
#chans .btn{padding:5px 2px;font-size:13px;border-radius:7px}
.msgs{display:flex;flex-direction:column;gap:12px;height:min(52vh,440px);overflow-y:auto;border:1px solid var(--line);border-radius:8px;padding:12px;background:var(--bg)}
.msg{display:flex;gap:10px;align-items:flex-start}
.msg .av{width:34px;height:34px;border-radius:50%;background:var(--soft);color:var(--accent);display:grid;place-items:center;font-weight:800;font-size:13px;flex:none;background-size:cover;background-position:center}
.msg .who{font-weight:700;font-size:13px}
.msg .when{color:var(--muted);font-size:11px;margin-left:6px;font-weight:500}
.msg .txt{font-size:14px;overflow-wrap:anywhere}
.msg.me .who{color:var(--accent)}
.msg>div:last-child{flex:1;min-width:0}
.modtag{font-size:10px;font-weight:800;letter-spacing:.04em;color:#3B55C4;background:#E3E8FB;border-radius:4px;padding:1px 5px;margin-left:6px;vertical-align:1px}
.modbtn{float:right;background:none;border:0;color:var(--muted);font-size:18px;line-height:1;padding:0 4px;cursor:pointer;border-radius:6px}
.modbtn:hover,.modbtn:focus-visible{color:var(--ink);background:var(--soft)}
.modmenu{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--bg);font-size:12px}
.modmenu b{width:100%;font-size:12px}
.modmenu button{font:inherit;font-weight:700;border:1px solid var(--line);background:var(--card,#fff);color:var(--ink);border-radius:6px;padding:5px 9px;cursor:pointer}
.modmenu button.dang{border-color:#E4B4B4;color:#B03A3A}
.chatban{padding:10px 12px;border:1px solid #E4B4B4;background:#FBEFEF;color:#8A2B2B;border-radius:8px;font-size:13px;font-weight:600}
.modnote{font-size:12px;color:#3B55C4;font-weight:600;margin:0}
.muted{color:var(--muted)}
.tblwrap .cons{margin:0;padding:12px 14px 14px}
.cons{border-top:1px dashed var(--line);margin-top:10px;padding-top:12px;display:flex;flex-direction:column;gap:14px}
.cons .ch{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:800;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}
.ci{display:flex;flex-direction:column;gap:6px}
.ci .cl{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:800;font-size:15px}
.ci .cl .o{font-family:var(--mono);font-weight:500;font-size:13px;color:var(--muted)}
.tier{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;color:#3B55C4;background:#E3E8FB;border-radius:999px;padding:3px 8px;white-space:nowrap}
.tier svg{display:block;flex:none}
.cbar{display:flex;gap:2px;height:10px;border-radius:5px;overflow:hidden;background:#E4B4B4}
.cbar i{display:block;background:var(--accent)}
.ci .cm{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted)}
.ci .cm b{color:var(--ink)}.ci .net{font-family:var(--mono);color:var(--accent);white-space:nowrap}
.ci .ca{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.ci .ca .btn{padding:8px 14px;font-size:13px}
.tier.t-lock{color:#FFD76A;background:#1A1A1A}
.tier.t-platinum{color:#4B4870;background:#E9E7F5}
.tier.t-diamond{color:#2F4DB8;background:#E3E8FB}
.tier.t-gold{color:#7A5200;background:#FCE9B2}
.tier.t-silver{color:#4F5A63;background:#E8EBEE}
.pkhero .tstar.t-lock,.pkhero .tstar.t-gold{color:#FFD76A}.pkhero .tstar.t-diamond{color:#9DB0F5}.pkhero .tstar.t-platinum{color:#CFCBEF}.pkhero .tstar.t-silver{color:#D5DBE0}
.tier.sm{font-size:10px;padding:2px 7px;flex:none}
.tier.plain{color:var(--muted);background:var(--bg);border:1px solid var(--line)}
.tier.crowdt{color:var(--ink);background:var(--bg);border:1px solid var(--line)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.h2timer{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--line);background:#FFF7E0;color:#7A5200;font-size:13px;font-weight:700}
.h2timer b{font-family:var(--mono);font-size:18px;font-weight:500;color:#7A5200}
.h2timer.soon{background:#FBEFEF;color:#8A2B2B}.h2timer.soon b{color:#B03A3A}
.cell:disabled{opacity:.35;cursor:not-allowed}
.h2head{display:flex;justify-content:space-between;gap:8px;padding:9px 14px;border-bottom:1px solid var(--line);background:var(--bg);font-size:12px;font-weight:800;color:var(--muted)}
.h2head .closed{color:var(--loss);text-transform:uppercase;letter-spacing:.04em}
.h2body{padding:10px 14px;font-weight:800;font-size:15px}.h2body small{display:block;font-size:12px;color:var(--muted)}
.h2sub{font-size:12px;color:var(--muted);font-weight:500;margin-top:2px}
.stlock{color:var(--loss)!important;text-align:right!important}
.started{opacity:.75}
.slipclosed{border:1px solid #E4B4B4;background:#FBEFEF;color:#8A2B2B;border-radius:8px;padding:10px 12px;font-size:14px;font-weight:600;line-height:1.4}
.demolink{background:none;border:0;padding:0;font:inherit;font-size:12px;color:var(--muted);text-decoration:underline;cursor:pointer;align-self:flex-start}
.cxlist{display:flex;flex-direction:column}
.pkrec{gap:8px}
.pkrec .rh{display:flex;justify-content:space-between;align-items:baseline;font-size:clamp(10.5px,3.1vw,12px);font-weight:800;color:var(--muted);letter-spacing:.03em;white-space:nowrap}
.pkrec .rh span:last-child{white-space:nowrap;margin-left:10px}
.pkrec .rs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pkrec .rs div{background:var(--bg);border-radius:8px;padding:8px 10px;display:flex;flex-direction:column;gap:2px;min-width:0}
.pkrec .rs b{font-family:var(--mono);font-weight:500;font-size:16px}
.pkrec .rs span{font-size:11px;color:var(--muted);font-weight:600}
.pkrec .rs em{font-style:normal;font-size:12px;color:var(--accent);font-weight:700}
.pkrec .rrows{display:flex;flex-direction:column;margin-top:8px}
.pkrec .rrows>div{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 0;border-top:1px solid var(--line)}
.pkrec .rrows>div:first-child{border-top:0}
.pkrec .rrows span{font-size:clamp(12px,3.4vw,13px);font-weight:700;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pkrec .rrows small{display:block;font-size:11px;font-weight:500;color:var(--muted)}
.pkrec .rrows b{font-family:var(--mono);font-weight:500;font-size:16px;white-space:nowrap;text-align:right;flex:none}
.pkrec .rrows em{display:block;font-family:var(--sans,inherit);font-style:normal;font-size:12px;color:var(--accent);font-weight:700}
.pkrec .rnote{margin:2px 0 8px;font-size:12px}
.pkrec details{font-size:13px}.pkrec summary{cursor:pointer;color:var(--accent);font-weight:700}
.pkrec table{width:100%;border-collapse:collapse;margin-top:6px;font-size:13px}.pkrec td{padding:5px 0;border-top:1px solid var(--line)}.pkrec td.n{text-align:right;font-family:var(--mono)}
.pknext{gap:0}.pknext .pkrow{border-top:1px solid var(--line);padding-top:8px}.pknext .pkrow:first-child{border-top:0;padding-top:0}
.pknext .pkrow .cx{border-top:0;padding-top:2px}
.pkmore{cursor:pointer;color:var(--accent);font-weight:700;font-size:13px;padding:8px 0}
.cx{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid var(--line)}
.cxlist .cx:first-child{border-top:0}
.cx details{flex:1;min-width:0}
.cxl{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:14px;cursor:pointer;list-style:none}
.cxl::-webkit-details-marker{display:none}
.cx details[open] .cxl{margin-bottom:8px}
.cxs{font-family:var(--mono);font-size:12px;color:var(--muted)}
.cx .btn{padding:0 12px;font-size:12px;flex:none;height:30px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.cx .cxl{min-height:30px} /* same height as the Bet button, so the pick line and the button sit level */
.crowdx{padding:4px 14px 8px;border-top:1px dashed var(--line)}
.crowd{border-top:1px dashed var(--line);padding:10px 14px 12px;display:flex;flex-direction:column;gap:6px;font-size:13px}
.crowd .ch{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:800;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}
.crowd .ch small{font-weight:600;letter-spacing:0;text-transform:none}
.crowd .cl{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.crowd .cl b{font-size:14px}.crowd .pc{font-family:var(--mono);font-weight:500;color:var(--accent);white-space:nowrap}
.crowd .cbar{height:8px;background:var(--line)}
.crowd .mv{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px}
.pub{border-top:1px dashed var(--line);padding:10px 14px 12px;display:flex;flex-direction:column;gap:7px;font-size:13px}
.pub .ph{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:800;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}
.pub .ph small{font-weight:600;letter-spacing:0;text-transform:none}
.pub .pr{display:grid;grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr);gap:8px;align-items:center}
.pub .pr span{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pub .pr span.r{text-align:right}
.pub .pr span b{font-family:var(--mono);font-weight:500;color:var(--muted);margin-left:4px}.pub .pr span.win b{color:var(--accent)}
.pub .pbar{height:8px;border-radius:999px;background:var(--line);overflow:hidden;display:flex}.pub .pbar i{background:var(--accent);display:block}
.psplit{margin-top:2px;padding:8px 10px;border-radius:10px;background:var(--soft);font-size:13px;line-height:1.4}
.psplit b{color:var(--ink)}.psplit.locked{background:var(--bg);border:1px solid var(--line)}.psplit a{font-weight:700}
.crec{padding:0 2px 8px;font-size:13px;color:var(--muted)}.crec b{color:var(--ink);font-family:var(--mono);font-weight:500}
.crowd .mv .mvd{color:var(--pend);font-weight:700;white-space:nowrap;text-transform:none;letter-spacing:0}
.exps{display:flex;flex-direction:column;gap:6px;font-size:13px;line-height:1.5}
.exps p{margin:0}.exps .ag{color:var(--muted)}
.exps .k{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;border-radius:4px;padding:1px 6px;margin-right:6px;vertical-align:1px}
.exps .k.for{background:var(--soft);color:var(--accent)}.exps .k.opp{background:#FBEFEF;color:#8A2B2B}
.pkhero .exps .ag{color:inherit;opacity:.7}
.ci details{font-size:13px}.ci summary{cursor:pointer;color:var(--accent);font-weight:700}
.ci details p{margin:6px 0 0;line-height:1.5}.ci details .ag{color:var(--muted)}
.c1x{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px}
.c1x .btn{padding:6px 10px;font-size:12px}
.blur{filter:blur(6px);user-select:none}
.clock{background:var(--ink);color:var(--bg);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:8px}
.clock b{font-size:15px}.clock p{margin:0;font-size:13px;opacity:.8;line-height:1.4}
.clock .btn{align-self:flex-start}
.pkhero{background:var(--ink);color:var(--bg);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.pkhero .freeday{align-self:flex-start;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);background:#7BE0A8;border-radius:999px;padding:3px 10px}   /* the sport's free pick of the day (owner 2026-10-15) */
.freetag{display:inline-flex;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);background:var(--accent-soft,#E3F4EC);border-radius:999px;padding:2px 7px;margin-left:6px;white-space:nowrap}
.pkhero .top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 8px;font-size:11px;opacity:.85}.pkhero .top>span{white-space:nowrap}.pkhero .top .tier{opacity:1}
.pkhero .big{font-family:var(--sans);font-size:17px;font-weight:800}.pkhero .cbar{height:6px}
.pkhero .foot{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px}
.pkhero .foot .btn{padding:7px 12px;font-size:13px}
.pkhero details summary{cursor:pointer;font-size:12px;font-weight:700;opacity:.85}
.pkhero details .exps{margin-top:6px}
.pkdemo{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.pklist{display:flex;flex-direction:column;gap:14px}
.pkh{font-size:12px;font-weight:800;color:var(--muted);letter-spacing:.06em;margin-top:6px}
.betchip{display:inline-block;margin-top:4px;font-size:12px;font-weight:700;border:1px solid var(--accent);color:var(--accent);border-radius:6px;padding:2px 8px}
.composer{display:flex;gap:8px}
.composer input{flex:1;min-width:0;font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.composer input:focus{outline:2px solid var(--accent);outline-offset:1px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.banner{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--soft);border:1px solid var(--accent);border-radius:10px;padding:10px 12px;font-size:14px;font-weight:700}
.bbtns{display:flex;gap:6px;flex:none}
.banner .btn{padding:7px 14px;font-size:14px;flex:none}
.join-lead{margin:0;font-size:18px;font-weight:700;text-wrap:balance}
.form .agree{display:flex;align-items:center;gap:10px;font-weight:500;font-size:14px;margin-top:10px;cursor:pointer}
.form .agree input{width:18px;height:18px;accent-color:var(--accent)}
.form .btn.primary{align-self:stretch}
#joinForm .err{margin-top:6px}
a{color:var(--accent)}
.stats{display:grid;grid-template-columns:1fr 1fr;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.stats>div{display:flex;align-items:baseline;justify-content:center;gap:8px;padding:8px 10px}
.stats>div+div{border-left:1px solid var(--line)}
.stats span{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.stats b{font-size:18px;font-variant-numeric:tabular-nums}
.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:10px;background:var(--card);overflow:hidden}
.strip>div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 8px;min-width:0}
.strip>div+div{border-left:1px solid var(--line)}
.strip .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.06em;text-align:center}
.strip .num{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:clamp(22px,7vw,28px);letter-spacing:-.02em}
.strip .free .num{color:var(--accent)}
.strip .num{font-size:26px;white-space:nowrap;display:block;max-width:100%}
.strip>div{padding-inline:6px}
.conleft{font-size:11px;color:var(--muted);font-weight:700}
.lbl.up{font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.row3 .btn{padding:9px 4px;font-size:13px;white-space:nowrap}
.link{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.tx .txt-t{font-weight:700;font-size:14px}
.tx .link{font-size:13px}
.amt.win{color:var(--win)}.amt.loss{color:var(--loss)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0;font-size:14px}
.kv dt{color:var(--muted)}
.kv dd{margin:0;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.sheet.vsheet{padding:0;overflow:hidden;gap:0;max-width:460px}
.vhead{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--accent);color:var(--accent-ink);padding:14px 16px}
.vwhen{font-weight:800;font-size:16px}
.vsub{font-size:12px;opacity:.85;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.vx{width:30px;height:30px;border-radius:50%;border:0;background:var(--accent-ink);color:var(--accent);display:grid;place-items:center;cursor:pointer;flex:none}
.vbody{padding:14px 16px 16px;display:flex;flex-direction:column;gap:12px}
.vgrid{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:14px}
.vgrid>div{padding:10px 12px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
.vgrid>div:nth-child(odd){border-right:1px solid var(--line)}
.vgrid>.vteam{border-top:0;background:var(--bg);flex-direction:column;align-items:flex-start;gap:0}
.vteam small{color:var(--muted);font-size:11px}
.vteam b{font-size:15px}
.vgrid .k{color:var(--muted);font-size:12px;display:block}
.vgrid .v{font-family:var(--mono);font-weight:500;white-space:nowrap}
.vgrid>.vsc{justify-content:flex-start;gap:12px}
.vgrid .vscore{font-family:var(--mono);font-size:22px;font-weight:500}
.vgrid .vscore.w{color:var(--accent)}
.vgrid>.picked{background:var(--soft);box-shadow:inset 0 0 0 2px var(--accent)}
/* the bottom corner cells follow the grid's rounded corners, so a picked cell's outline curves with it */
.vgrid>div:first-child{border-top-left-radius:9px}.vgrid>div:nth-child(2){border-top-right-radius:9px}
.vgrid>div:last-child{border-bottom-right-radius:9px}
.vgrid>div:nth-last-child(2):has(+ div:last-child:not(.vprop):not(.vwide):not(.vsc)),.vgrid>.vsc:nth-last-child(2){border-bottom-left-radius:9px}
.vgrid>.vprop:last-child,.vgrid>.vwide:last-child{border-bottom-left-radius:9px}
.chk{color:var(--accent);flex:none}
.vgrid>.vwide{grid-column:1/-1;border-right:0!important;background:var(--soft);box-shadow:inset 0 0 0 2px var(--accent)}
.vwide .k{display:block}
.vsum{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.vsum>div{display:flex;flex-direction:column;align-items:center;padding:8px 4px;gap:1px}
.vsum>div+div{border-left:1px solid var(--line)}
.vsum span{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.vsum b{font-family:var(--mono);font-weight:500;font-size:16px}
.vsum b.win{color:var(--win)}.vsum b.loss{color:var(--loss)}
.vmeta{margin:0;font-size:12px;color:var(--muted);text-align:center}
.streakcard{padding:0;gap:0;overflow:hidden}
.sk-strip{display:grid;grid-template-columns:1fr 1fr 2fr}
.sk-strip>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:12px 6px;text-align:center;min-width:0}
.sk-strip>div+div{border-left:1px solid var(--line)}
.sk-strip span{white-space:nowrap;font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.sk-strip b{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.15}
.sk-strip .wide b{font-size:15px}
.skwait{font-size:11px;font-weight:600;color:var(--muted)}
.sk-strip #skNow{color:var(--accent)}
.sk-tabs{border-top:1px solid var(--line);padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.sk-list .item .btn{flex:none;font-size:13px;padding:7px 12px}
.sk-list .link{font-size:13px}
.sk-pick{border-top:1px solid var(--line);padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--bg)}
.sk-pick .lbl2{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em;display:block}
.sk-pick .pk{font-weight:700;font-size:14px}
.sk-pick .pk small{display:block;color:var(--muted);font-weight:500;font-size:12px}
.sk-pick .btn{flex:none;font-size:13px;padding:7px 12px}
@media (max-width:420px){.sk-strip b{font-size:22px}.sk-strip .wide b{font-size:14px}.sk-strip span{font-size:10px;letter-spacing:.03em}}
.pitch{min-height:52vh;display:flex;flex-direction:column;justify-content:center;gap:14px}
.pitch h1,.pitch .h1{margin:0;font-size:clamp(40px,11vw,56px);line-height:1.05;font-weight:800;letter-spacing:-.03em;text-wrap:balance}
.pitch h1 span,.pitch .h1 span{color:var(--accent)}
.pitch .h1{color:var(--ink);font-family:inherit}
.pitch p{margin:0;font-size:17px;color:var(--muted)}
.pitch-btns{display:flex;flex-direction:column;gap:10px}
.pitch-btns .btn{height:52px;font-size:17px}
.confirm{align-items:center;text-align:center;gap:14px;padding-block:32px}
.confirm .ok{width:64px;height:64px;border-radius:50%;background:var(--soft);color:var(--accent);display:grid;place-items:center}
.confirm .ok.bad{color:var(--pend)}
.confirm h1{margin:0;font-size:26px;font-weight:800;letter-spacing:-.02em}
.confirm p{margin:0;color:var(--muted);max-width:34ch}
.confirm .em{font-family:var(--mono);color:var(--ink);font-size:14px;overflow-wrap:anywhere}
.confirm p.small{font-size:13px}
.confirm .link{font-size:13px}
.cfbar{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--soft);border:1px solid var(--accent);border-radius:10px;padding:10px 12px;font-size:14px;font-weight:700}
.cfbar .link{font-size:13px;flex:none}
.confirm .btn{align-self:stretch;height:48px;font-size:16px}
@media (max-width:400px){.bal{padding:4px 7px;font-size:11.5px}.bal span{font-size:9.5px;letter-spacing:.04em}.logo{font-size:18px}.themebtn{width:30px;height:30px}header{gap:6px}.bals{gap:4px}}
.userbar{display:flex;justify-content:flex-end;align-items:center;gap:12px;font-size:13px;color:var(--muted);margin-bottom:-6px}
.userbar b{color:var(--ink)}
.ublogout{display:inline-flex;align-items:center;gap:5px;font:inherit;font-weight:700;font-size:13px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:5px 11px;cursor:pointer}
.ublogout:hover{border-color:var(--loss);color:var(--loss)}
body.landing .userbar,body.landing .tabs,body.landing #joinBanner,body.landing .bals{display:none!important}
.amtcol{display:flex;flex-direction:column;align-items:flex-end;gap:1px}
.carry{font-family:var(--mono);font-size:11px;color:var(--muted);white-space:nowrap}
.plink{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;text-align:left;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.plink:hover{color:var(--accent);text-decoration-color:var(--accent)}
.pmhead{display:flex;align-items:center;gap:12px}
.pmhead h3{margin:0}
.pmhead .sub2{margin:2px 0 0}
.avatar.sm{width:48px;height:48px;font-size:20px}
.pmcounts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid var(--line);border-radius:10px;overflow:hidden}
.pmcounts>div{display:flex;flex-direction:column;align-items:center;padding:8px 2px;gap:1px}
.pmcounts>div+div{border-left:1px solid var(--line)}
.pmcounts span{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.pmcounts b{font-size:17px;font-variant-numeric:tabular-nums}
.mono{font-family:var(--mono)}
.pmlist{max-height:46vh;overflow-y:auto}
.txr{display:flex;align-items:center;gap:8px;flex:none}
.pen{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--muted);cursor:pointer;padding:0}
.pen:hover{color:var(--accent);border-color:var(--accent)}
.form input[readonly]{color:var(--muted);font-family:var(--mono)}
.sm-btn{padding:6px 12px;font-size:13px}
.tkrow{cursor:pointer;background:none;border:0;border-top:1px solid var(--line);width:100%;text-align:left;font:inherit;color:inherit;padding:10px 0}
.tkrow:first-child{border-top:0;padding-top:0}
.tkrow .item{border:0;padding:0}
.pill.answered{color:var(--accent)}.pill.closed{color:var(--muted)}
.tvsub{margin:0;font-size:16px}
.thread{display:flex;flex-direction:column;gap:10px}
.bub{max-width:85%;padding:10px 12px;border-radius:12px;font-size:14px;display:flex;flex-direction:column;gap:4px}
.bub small{font-size:11px;color:var(--muted);font-weight:700}
.bub.you{align-self:flex-end;background:var(--soft);border:1px solid var(--accent)}
.bub.support{align-self:flex-start;background:var(--bg);border:1px solid var(--line)}
.tk-top{display:flex;justify-content:space-between;align-items:center}
.tk-top h2{margin:0}
.tk-lists{display:flex;flex-direction:column;gap:14px}
.tkcard{gap:12px}
.tkh{margin:0;font-size:17px;font-weight:800}
.tkwrap{border:1px solid var(--line);border-radius:8px;overflow:hidden}
table.tkt,table.pkt{width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px}
.tkt th{background:var(--tkbar);color:var(--tkbar-ink);font-size:11px;text-transform:uppercase;letter-spacing:.05em;padding:10px 6px}
.tkt th:first-child{width:42%}.tkt th:nth-child(2){width:28%}
@media (max-width:420px){.tkt td{font-size:12.5px;padding-inline:6px}.tkview{font-size:12px;margin-left:4px}}
.tkt td{padding:10px 8px;border-top:1px solid var(--line)}
.tkt th+th,.tkt td+td,.pkt th+th,.pkt th+td,.pkt td+td{border-left:1px solid var(--line)}
.ctr{text-align:center}.up{text-transform:uppercase}
.tksub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tkst{display:inline-flex;vertical-align:middle}.tkst.answered{color:#3FA34D}.tkst.open{color:#D08A1C}.tkst.closed{color:#8A948F}
.tkview{margin-left:6px;text-transform:uppercase;font-size:13px;color:var(--accent);font-weight:700;vertical-align:middle}
.pickcard{display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:10px;padding:12px}
.pkt th{background:var(--pkhead);text-align:left;padding:9px 10px;font-size:13px}
.pkt th.ctr{text-align:center}
.pkt td{padding:9px 10px;border-top:1px solid var(--line)}
.pkt tr+tr th{border-top:1px solid var(--line)}
.tkthread{display:flex;flex-direction:column;gap:10px}
.tmsg{border:1px solid var(--line);border-radius:8px;overflow:hidden}
.tmh{background:var(--tkbar);color:var(--tkbar-ink);display:flex;justify-content:space-between;gap:8px;padding:9px 12px;font-weight:700;font-size:13px}
.tmb{background:var(--tkbody);padding:12px 16px;white-space:pre-wrap;font-size:14px}
.req{color:var(--loss)}
.form textarea{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;width:100%}
.rank{display:flex;align-items:center;gap:12px}
.rank .n{font-family:var(--mono);width:24px;color:var(--muted);text-align:right}
.item.me{background:var(--soft);margin-inline:-16px;padding-inline:16px}
.modal{position:fixed;inset:0;background:rgba(10,15,13,.5);display:flex;align-items:flex-end;justify-content:center;padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:10}
@media (min-width:600px){.modal{align-items:center}}
.sheet{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px;width:100%;max-width:420px;padding:18px;display:flex;flex-direction:column;gap:12px}
.sheet h3{margin:0;font-size:17px}
.sheet .sub2{color:var(--muted);font-size:13px;margin:-8px 0 0}
.src{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.src label{cursor:pointer}
.src .conl{grid-column:1/-1}
.src input{position:absolute;opacity:0;pointer-events:none}
.src span{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:12px;font-weight:700;color:var(--muted);background:var(--bg)}
.src b{font-family:var(--mono);font-size:17px;color:var(--ink);font-weight:500}
.src input:checked+span{border-color:var(--accent);background:var(--soft);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent)}
.src input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.amtin{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:8px;padding:0 12px;background:var(--bg)}
.amtin:focus-within{outline:2px solid var(--accent);outline-offset:1px}
.amtin input{font-family:var(--mono);font-size:20px;border:0;background:transparent;color:var(--ink);padding:10px 0;width:100%;outline:none}
.quick{display:flex;gap:6px;flex-wrap:wrap}
.quick .btn{padding:5px 10px;font-size:13px}
.checks{display:flex;flex-direction:column;gap:8px;font-size:14px}
.checks label{display:flex;align-items:center;gap:10px;cursor:pointer}
.checks input{width:18px;height:18px;flex:none;accent-color:var(--accent)}
.checks small{display:block;color:var(--muted);font-size:12px}
.rule{margin:-4px 0 0;font-size:13px;font-weight:700;color:var(--pend)}
.checks label.saver{margin-left:28px}.checks label.saver b::before{content:"\1F6E1  "}
.sk-saver{font-size:13px;color:var(--muted);margin:8px 0 0}.sk-saver b{color:var(--ink)}
.checks label:has(input:disabled){opacity:.45;cursor:not-allowed}
.src input:disabled+span{opacity:.45;cursor:not-allowed}
.back{margin:0;background:var(--soft);border:1px solid var(--accent);border-radius:8px;padding:10px 12px;font-size:15px;font-weight:700;text-align:center}
.back b{font-family:var(--mono);color:var(--accent);font-size:17px}
.back small{display:block;font-weight:500;color:var(--muted);font-size:12px}
.payout{display:flex;justify-content:space-between;font-size:14px;color:var(--muted)}
.payout b{font-family:var(--mono);color:var(--ink)}
.err{color:var(--loss);font-size:13px;margin:0}
.actions{display:grid;grid-template-columns:1fr 2fr;gap:8px}
.tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin-left:6px;white-space:nowrap}
.faq details{border-top:1px solid var(--line);padding-block:12px}
.faq details:first-child{border-top:0}
.faq summary{font-weight:700;cursor:pointer}
.faq p{margin:8px 0 0;color:var(--muted);font-size:14px;max-width:62ch}
footer nav{display:flex;justify-content:center;gap:20px}
.note{margin:0;color:var(--muted);font-size:14px}
.form{display:flex;flex-direction:column;gap:6px}
.form label{font-size:13px;font-weight:700;margin-top:6px}
.form input,.form select,.form textarea{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
.form button{margin-top:10px;align-self:flex-start}

/* ---------- Player site additions (links where the design used buttons) ---------- */
a{color:var(--accent)}
.logo{color:var(--ink);text-decoration:none}
a.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.tabs a{font-size:14px;font-weight:700;color:var(--muted);padding:12px 4px 10px;border-bottom:3px solid transparent;margin-bottom:-1px;text-align:center;text-decoration:none}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--accent)}
.tabs a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:4px}
.tabs{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}
a.ublogout{text-decoration:none}
a.cell{display:block;text-decoration:none}
span.cell{display:block;cursor:not-allowed;opacity:.35}
.modal turbo-frame{display:contents}
.sheet .close{position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;border:0;background:transparent;color:var(--muted);font-size:20px;line-height:1;cursor:pointer}
.sheet{position:relative}
.gamehead{display:flex;justify-content:space-between;align-items:center;gap:8px}
.lgname{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--muted)}
.lines th .when{font-family:var(--mono);font-weight:500}
.nolines{color:var(--muted);text-align:center}
.agree.check{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:14px;margin-top:6px}
.agree.check input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--accent)}
.form .hint{margin:0;color:var(--muted);font-size:12px}
.flashcard{align-items:center;text-align:center}
/* League and period buttons: one row that scrolls sideways on phones (the page itself never scrolls sideways) */
#leagues,.periods{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;max-width:none;
  margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px;scroll-snap-type:x proximity}
#leagues::-webkit-scrollbar,.periods::-webkit-scrollbar{display:none}
#leagues .btn,.periods .btn{flex:none;scroll-snap-align:start;white-space:nowrap}
#leagues .btn{min-width:64px}
/* Main tabs: spread evenly when they fit, one sideways-scrolling row on narrow phones */
.tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:1 0 auto;padding-inline:10px;white-space:nowrap}
.nowrap{white-space:nowrap}
footer a.nowrap{font-size:inherit;font-weight:700}
/* Sub-tabs as links (My bets, history, streak lists) */
.sub a{font-weight:700;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px;color:var(--muted);text-align:center;text-decoration:none}
.sub a:hover{border-color:var(--accent)}
.sub a.sel{color:var(--ink);background:var(--soft);border-color:var(--accent)}
.sub.sm a{padding:6px;font-size:13px}
turbo-frame{display:contents}
.item .link{font-size:12px}
.cfbar form{flex:none;margin:0}
.depo form{margin:0}.depo form .btn{width:100%}
.invite-row{display:flex;gap:8px}.invite-row input{flex:1;min-width:0;font:inherit;font-family:var(--mono);font-size:13px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.betview dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:14px}.betview dt{color:var(--muted);font-weight:700}.betview dd{margin:0;text-align:right;font-family:var(--mono)}
/* Phones: smaller pick names in lists (My bets, streak picks, history) */
@media (max-width:480px){
  .list .item>div:first-child{font-size:14px;line-height:1.3}
  .list .item small{font-size:12px}
  .list .item .amt{font-size:13px}
}
.item .pk{font-weight:700}
.item .tagtxt{color:var(--accent);font-weight:700}
@media (max-width:480px){.list .item>div:first-child{font-size:13.5px}}
/* Big balances ($1,000.28) shrink to fit their box instead of overflowing */
.strip>div{container-type:inline-size}
.strip .num{font-size:min(26px,17cqi)}
header .bals{flex-wrap:wrap;gap:4px}
@media (max-width:400px){header .bal{padding:4px 8px;font-size:12px}header .bal span{font-size:10px}}
footer nav{flex-wrap:wrap;gap:8px 18px}
footer nav a{white-space:nowrap}
.sheet .pmlist{max-height:46vh;overflow-y:auto}
.sub.three a{font-size:13px;padding:10px 4px;line-height:1.2}
.sheet .pmhead .sub2{margin:2px 0 0}
.btn{white-space:nowrap}
@media (max-width:380px){.convert b{font-size:13px}.banner{font-size:13px}}
.banner>span:first-child{white-space:nowrap}
.banner .bbtns{display:flex;gap:6px}
@media (max-width:420px){.banner{padding:8px 10px;gap:8px}.banner .btn{padding:6px 10px;font-size:13px}}
.moddrop{float:right}.moddrop summary{list-style:none}.moddrop summary::-webkit-details-marker{display:none}
.moddrop[open] .modmenu{position:relative;z-index:2}
.modmenu form{margin:0}
.msgs turbo-frame{display:contents}
.chatwarn{margin:0;padding:8px 12px;border-radius:8px;background:#FFF2C9;color:#6B4E00;font-size:13px;font-weight:700}
.chatrules{font-size:13px;color:var(--muted)}.chatrules summary{cursor:pointer;font-weight:700;color:var(--accent)}
.chatrules ul{margin:10px 0 12px;padding:4px 14px;list-style:none;display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line);border-radius:10px}.chatrules li{padding:9px 0;line-height:1.45}.chatrules li+li{border-top:1px solid var(--line)}.chatrules .link{display:inline-block;margin-top:2px}.chatrules b{color:var(--ink)}
.sub.five{grid-template-columns:repeat(5,minmax(0,1fr))}
.sub.five a,.sub.five button{font-size:12px;padding:8px 2px;line-height:1.2}
.faq ul{margin:8px 0 0;padding-left:20px;color:var(--muted);font-size:14px}
.faq .sub{margin-bottom:8px}
.sub.rulesnav{grid-template-columns:repeat(auto-fill,minmax(112px,1fr))}.sub.rulesnav a{font-size:13px;padding:8px 6px}
.rulestext h2{font-size:16px;margin:14px 0 6px;text-transform:none;letter-spacing:0;color:var(--ink)}.rulestext ul{margin:0 0 6px;padding-left:20px}.rulestext li{margin:5px 0;line-height:1.45}

.blog{--gold:#F2C94C;--display:"Archivo",system-ui,sans-serif}
.blog h1,.blog h2,.blog h3{text-transform:none;letter-spacing:normal;color:var(--ink)}
.bfaq .fa-a{margin:0 0 14px;color:var(--muted)}.bfaq .fa-a p{margin:0 0 8px}.bfaq .fa-a p:last-child{margin:0}
/* ---- Blog (list and post): wider page, one reading column (~68ch), 900x500 images. From mockups/blog-list.html and blog-post.html ---- */
.wrap.wide{max-width:1080px}
.wrap.wide>header,.wrap.wide>.banner,.wrap.wide>.tabs,.wrap.wide>.userbar{width:100%;max-width:560px;margin-inline:auto}
.blog{display:grid;gap:22px;min-width:0}
article.blog{max-width:900px;width:100%;margin:0 auto}
.blog h1{font:800 clamp(24px,3.4vw,32px)/1.2 var(--display);margin:0;text-wrap:balance;letter-spacing:-.5px}
.blog .intro{margin:0;color:var(--muted);font-size:18px;max-width:60ch}
.blog .crumbs{font-size:13px;color:var(--muted);display:flex;gap:6px;flex-wrap:wrap}
.blog .crumbs a{color:var(--muted);text-decoration:none}.blog .crumbs a:hover{color:var(--accent)}
.blog .cat{display:inline-block;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--accent);background:var(--soft);padding:4px 10px;border-radius:999px;text-decoration:none;justify-self:start;align-self:flex-start}
.blog .meta{font-size:14px;color:var(--muted);display:flex;gap:14px;flex-wrap:wrap}
.blog .hero{width:100%;height:auto;aspect-ratio:9/5;border-radius:14px;display:block;object-fit:cover}
.blog .vid{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000}
.blog .vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.blog .body{max-width:68ch;font-size:17px;line-height:1.65;min-width:0;overflow-wrap:break-word}
.blog .body h2{font:700 26px/1.25 var(--display);margin:34px 0 10px;text-wrap:balance}
.blog .body h3{font:700 19px/1.3 var(--sans);margin:24px 0 6px}
.blog .body p{margin:0 0 16px}.blog .body ul,.blog .body ol{margin:0 0 16px;padding-left:22px}.blog .body li{margin:4px 0}
.blog .body blockquote{margin:22px 0;padding:6px 0 6px 18px;border-left:4px solid var(--gold);font-size:19px;font-weight:500}
.blog .body a{color:var(--accent)}
.blog.hometext{margin-top:28px}
.banner.ctabig{padding:16px 18px;gap:14px;flex-wrap:wrap}.banner.ctabig>div{display:flex;flex-direction:column;gap:3px;flex:1 1 240px}.banner.ctabig b{font-size:18px;line-height:1.25}.banner.ctabig small{font-size:13px;color:var(--muted)}.banner.ctabig .btn{padding:10px 16px}
.blog .body table{width:100%;border-collapse:collapse;margin:6px 0 20px;font-size:15px;display:block;overflow-x:auto}.blog .body th,.blog .body td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}.blog .body th{background:var(--soft,#f4f6f5);font-weight:700}
.bfaq{max-width:68ch;display:grid;gap:10px}
.blog .bfaq h2{font:700 26px var(--display);margin:10px 0 4px}
.bfaq details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:0 16px}
.bfaq summary{cursor:pointer;font-weight:700;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.bfaq summary::-webkit-details-marker{display:none}
.bfaq summary::after{content:"+";font:700 20px var(--mono);color:var(--accent);line-height:1}
.bfaq details[open] summary::after{content:"–"}

.blog .cta{background:#0F7B55;color:#fff;border-radius:16px;padding:24px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.blog .cta h3{font:800 22px var(--display);margin:0 0 4px}.blog .cta p{margin:0;opacity:.9}
.blog .cta a{background:var(--gold);color:#131A17;font-weight:700;border-radius:999px;padding:12px 22px;text-decoration:none;white-space:nowrap}
.blog .more h2{font:700 22px var(--display);margin:8px 0 12px}
.blog .more .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.blog .more a{display:grid;gap:8px;align-content:start;text-decoration:none;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.blog .more img,.blog .noimg{width:100%;height:auto;aspect-ratio:9/5;object-fit:cover;display:block}
.blog .noimg{background:linear-gradient(135deg,#0F7B55,#0B5E41)}
.blog .more a b{padding:0 14px}.blog .more a small{padding:0 14px 14px;color:var(--muted)}
.blog.lead{max-width:1080px;width:100%;margin:0 auto;container-type:inline-size}
.blog .chips{display:flex;gap:8px;flex-wrap:wrap}
.blog .chip{font:600 14px var(--sans);border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 16px;text-decoration:none;white-space:nowrap}
.blog .chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.blog .feat{display:grid;grid-template-columns:1.25fr 1fr;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:var(--ink)}
.blog .feat img,.blog .feat .noimg{width:100%;height:100%;min-height:100%;aspect-ratio:9/5;align-self:stretch;object-fit:cover;display:block}
.blog .feat .ft{padding:26px;display:flex;flex-direction:column;gap:10px;justify-content:center;min-width:0}
.blog .feat h2{font:800 clamp(22px,3vw,30px)/1.2 var(--display);margin:0;text-wrap:balance}
.blog .feat p{margin:0;color:var(--muted)}.blog .feat small,.blog .bcard small{color:var(--muted);font-size:13px}
.blog .grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.czarts{margin-top:18px;gap:12px}.czarts .grid3{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.czarts .bcard p{display:none}   /* casino page: the 4 newest casino articles, two across */
.blog .bcard{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--ink);transition:transform .15s,border-color .15s}
.blog .bcard:hover,.blog .feat:hover{border-color:var(--accent)}.blog .bcard:hover{transform:translateY(-2px)}
.blog .bcard img{width:100%;height:auto;aspect-ratio:9/5;object-fit:cover;display:block}
.blog .bcard .ct{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.blog .bcard h3{font:700 19px/1.3 var(--display);margin:0;text-wrap:balance}
.blog .bcard p{margin:0;color:var(--muted);font-size:15px;flex:1}
.blog .pager{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}
.blog .pager a,.blog .pager span{min-width:40px;height:40px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;font-weight:600;padding:0 12px}
.blog .pager .on{background:var(--accent);color:#fff;border-color:var(--accent)}
.blog .empty{color:var(--muted);text-align:center;padding:30px 0}
@media (max-width:720px){.blog .feat{grid-template-columns:1fr}.blog .feat .ft{padding:18px}}
/* the blog list in a narrow column (e.g. 560px beside the side banners): the featured post stacks, image on top, so the title isn't squeezed */
@container (max-width:760px){.blog .feat{grid-template-columns:1fr}.blog .feat img,.blog .feat .noimg{height:auto;min-height:0}.blog .feat .ft{padding:18px 20px 20px}.blog .feat h2{font-size:24px}}
@media (prefers-reduced-motion:reduce){.blog .bcard{transition:none}.blog .bcard:hover{transform:none}}
.blog .cta h3{color:#fff}
/* Expert pick the streak crowd agrees with (same bet, same side) */
.agree{align-self:flex-start;display:inline-block;font-size:12px;font-weight:700;color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:3px 10px;white-space:nowrap}
.pkhero .agree{background:var(--gold,#F2C94C);color:#131A17}
/* ---- Most popular picks (/consensus). From mockups/popular-picks.html ---- */
.blog.pp{max-width:860px;width:100%;margin:0 auto}
.pp .upd{font:500 12px var(--mono);color:var(--muted);letter-spacing:.04em}
.pp .plist{display:grid;gap:12px}
.pp .prow{display:grid;grid-template-columns:auto minmax(0,1fr) 110px;gap:16px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.pp .rank{font:800 28px var(--display);color:var(--accent);width:42px;text-align:center}
.pp .pinfo{display:grid;gap:6px;min-width:0}
.pp .pinfo .g{font-size:13px;color:var(--muted)}
.pp .pinfo .pk{font:700 20px/1.2 var(--display)}.pp .pinfo .pk small{font:500 13px var(--mono);color:var(--muted);margin-left:6px}
.pp .pbar{height:8px;border-radius:999px;background:var(--line);overflow:hidden}.pp .pbar i{display:block;height:100%;background:var(--accent)}
.pp .pnum{text-align:right;display:grid;gap:4px;justify-items:end}.pp .pnum b{display:block;font:800 26px var(--display);color:var(--accent)}.pp .pnum small{color:var(--muted);font-size:12px;white-space:nowrap}
.pp .lg{display:inline-block;font:500 11px var(--mono);letter-spacing:.06em;background:var(--soft);color:var(--accent);border-radius:999px;padding:2px 8px;margin-right:6px}
.pp .note{color:var(--muted);font-size:14px;max-width:68ch;margin:0}
@media (max-width:560px){.pp .prow{grid-template-columns:auto minmax(0,1fr)}.pp .pnum{grid-column:2;text-align:left;display:flex;gap:8px;align-items:baseline;justify-items:start}.pp .pnum b{font-size:20px}.pp .rank{font-size:22px;width:30px}}
.agree.sm{font-size:11px;padding:2px 8px;margin-left:4px}

/* Show/hide password (eye button added by app.js) */
.pw{position:relative;display:block}
.pw input{padding-right:46px}
.form .pw-eye,.pw-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);margin:0;padding:8px;border:0;background:transparent;color:var(--muted);cursor:pointer;line-height:0;border-radius:6px}
.pw-eye:hover{color:var(--ink)}
.pw-eye:focus-visible{outline:2px solid var(--accent)}

/* Welcome card (once, after sign-up) and "confirm your email" bar */
.welcome{position:relative}
.welcome h2{font-size:18px;text-transform:none;letter-spacing:0;color:var(--ink);margin-bottom:4px}
.welcome-lead{margin:0 0 6px;color:var(--muted)}
.welcome-steps{margin:0 0 8px;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.welcome .btn.primary{align-self:flex-start}
.welcome-x{position:absolute;right:8px;top:6px;border:0;background:transparent;font-size:24px;line-height:1;color:var(--muted);cursor:pointer;padding:4px 8px}
.confirmbar form{margin:0}
.confirmbar{flex-wrap:wrap;font-weight:600}
.banner.confirmbar>span:first-child{min-width:0;flex:1 1 200px;white-space:normal;overflow-wrap:anywhere}

/* Streak Picks Today star tiers (CMS: Streak crowd) */
.spt{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:800;letter-spacing:.02em;padding:2px 7px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);white-space:nowrap}
.spt-lock{border-color:#6d28d9;color:#6d28d9}.spt-platinum{border-color:#0e7490;color:#0e7490}.spt-diamond{border-color:#2563eb;color:#2563eb}
.spt-gold{border-color:#b45309;color:#b45309}.spt-silver{border-color:#64748b;color:#64748b}
@media (prefers-color-scheme:dark){.spt-lock{color:#c4b5fd;border-color:#c4b5fd}.spt-platinum{color:#67e8f9;border-color:#67e8f9}.spt-diamond{color:#93c5fd;border-color:#93c5fd}.spt-gold{color:#fcd34d;border-color:#fcd34d}.spt-silver{color:#cbd5e1;border-color:#cbd5e1}}

/* Bet details: Free bet / Streak / Contest labels on their own line */
.betview .bvtags{display:flex;flex-wrap:wrap;gap:6px;margin:-4px 0 4px}
.betview .bvtags .tag{margin:0;padding:3px 9px;border:1px solid var(--accent);border-radius:999px;background:var(--soft)}

/* Bet view popup (approved design: mockups/player-app.html #viewModal) */
.sheet.vsheet{padding:0;overflow:hidden;gap:0;max-width:460px}
.vhead{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--accent);color:var(--accent-ink);padding:14px 16px}
.vwhen{font-weight:800;font-size:16px}
.vsub{font-size:12px;opacity:.85;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.vx{width:30px;height:30px;border-radius:50%;border:0;background:var(--accent-ink);color:var(--accent);display:grid;place-items:center;cursor:pointer;flex:none}
.vbody{padding:14px 16px 16px;display:flex;flex-direction:column;gap:12px}
.vpick{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:16px}
.vgrid{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:14px}
.vgrid>div{padding:10px 12px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
.vgrid>div:nth-child(odd){border-right:1px solid var(--line)}
.vgrid>.vteam{border-top:0;background:var(--bg);flex-direction:column;align-items:flex-start;gap:0}
.vteam small{color:var(--muted);font-size:11px}
.vteam b{font-size:15px}
.vgrid .k{color:var(--muted);font-size:12px;display:block}
.vgrid .v{font-family:var(--mono);font-weight:500;white-space:nowrap}
.vgrid>.vsc{justify-content:flex-start;gap:12px}
.vgrid .vscore{font-family:var(--mono);font-size:22px;font-weight:500}
.vgrid .vscore.w{color:var(--accent)}
.vgrid>.picked{background:var(--soft);box-shadow:inset 0 0 0 2px var(--accent)}
.vgrid .chk{color:var(--accent);flex:none}
.vsum{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.vsum>div{display:flex;flex-direction:column;align-items:center;padding:8px 4px;gap:1px}
.vsum>div+div{border-left:1px solid var(--line)}
.vsum span{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.vsum b{font-family:var(--mono);font-weight:500;font-size:16px}
.vsum b.win{color:var(--win)}
.vsum b.loss{color:var(--loss)}
.vmeta{margin:0;font-size:12px;color:var(--muted);text-align:center}
.vsheet .vx svg{display:block}
/* A pick in the bottom row (no score yet): round its outer corner with the grid's, so the green outline isn't cut off */
.vgrid>.picked:nth-last-child(2):nth-child(odd){border-bottom-left-radius:9px}
.vgrid>.picked:last-child:nth-child(even){border-bottom-right-radius:9px}
/* Started game with a live score (from ESPN) */
.stlock.live{color:var(--accent)!important}
.lines td.lscore{text-align:right;font-family:var(--mono);font-size:20px;font-weight:500;padding-right:14px;color:var(--ink)}
.lines td.lscore.lead{color:var(--accent);font-weight:700}
/* Player props: Bet page rows and bet view */
.lines.props td.team.prop{font-size:14px}
.lines.props td.team.prop small{font-weight:700;color:var(--ink);font-size:13px}
.vgrid>.vprop{grid-column:1/-1;border-right:0!important;flex-direction:column;align-items:flex-start;gap:0}
.vgrid>.vprop .k{color:var(--muted);font-size:12px}
.vgrid>.vprop~div:not(.vprop):nth-child(even){border-right:1px solid var(--line)}
.vgrid>.vprop~div:not(.vprop):nth-child(odd){border-right:0}
/* Line movement: "opened ..." under a moved line on the Bet page; Opened / Your line / Closed in the bet popup */
.cell .mv{display:block;font-size:10px;font-weight:600;color:var(--muted);line-height:1.2;margin-top:1px;white-space:nowrap}
.vmove b{font-size:13px}
/* "Line Movement" row under a game: opened -> now for each bet type, from the favorite's side (total: the number) */
.mvrow td{background:var(--bg);padding:8px 2px!important;text-align:center;vertical-align:middle;border-top:1px solid var(--line)}
.mvrow td.lbl{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:left;padding-left:12px!important}
.mvrow .chg{display:inline-flex;align-items:baseline;gap:2px;white-space:nowrap;font-family:var(--mono);font-size:12px;letter-spacing:-.02em;color:var(--muted)}
.mvrow .chg i{font-style:normal;font-size:11px}
.mvrow .chg b{color:var(--ink);font-weight:600}
.mvrow .chg.nomv{font-family:inherit;font-size:11px}
@media (max-width:400px){.mvrow .chg{font-size:11px;gap:1px}.mvrow .chg i{font-size:10px}.mvrow td.lbl{padding-left:10px!important;font-size:9px}}
@media (max-width:370px){.mvrow .chg{font-size:10px;letter-spacing:-.04em}}
/* Picks tab: how our star ratings work */
.stx h2{margin:0 0 8px}
.stx-src p{margin:0 0 8px;font-size:14px;line-height:1.45}
.stx details{font-size:13px}.stx summary{cursor:pointer;color:var(--accent);font-weight:700}
.stx .note{margin:8px 0}
.stx-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:600px){.stx-grid{grid-template-columns:1fr 1fr}}
.stx table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.stx th{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);text-align:left;padding:4px 0}
.stx th+th,.stx td+td{text-align:right;font-family:var(--mono)}
.stx td{padding:5px 0;border-top:1px solid var(--line);white-space:nowrap}
/* Parlays: the bar on the Bet page and the parlay slip */
.parlaybar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom));z-index:9;width:min(560px,calc(100% - 32px));display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;border-radius:12px;background:var(--accent);color:var(--accent-ink,#fff);text-decoration:none;font-size:14px;box-shadow:0 6px 20px rgba(0,0,0,.18);white-space:nowrap}
.parlaybar b{font-weight:800}
.sheet .addpl,.sheet .strkonly{width:100%;text-align:center;border-style:dashed}
.sheet.parlay .legs{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.sheet.parlay .leg{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:10px 12px}
.sheet.parlay .leg+.leg{border-top:1px solid var(--line)}
.sheet.parlay .leg small{display:block;color:var(--muted);font-size:12px}
.sheet.parlay .leg.closed{background:var(--bg)}
.sheet.parlay .lo{font-family:var(--mono);font-size:14px}
.sheet.parlay .x{border:0;background:none;color:var(--muted);font-size:20px;line-height:1;cursor:pointer;padding:2px 4px}
.sheet.parlay .empty{margin:0;padding:12px;color:var(--muted);font-size:14px}
.sheet.parlay .pmore{margin:-4px 0 0}
.item.pl .pleg{display:block;margin-top:4px;line-height:1.4}
.item.pl .pleg .pill{font-size:9px;padding:0 5px;margin-right:6px;vertical-align:1px}
.item.pl .pleg b{color:var(--ink);white-space:nowrap}
.item.pl .pleg .muted{white-space:nowrap}
body:has(#parlaybar){padding-bottom:84px}
body:has(#parlaybar) .toast{bottom:calc(90px + env(safe-area-inset-bottom))}
.pmode{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:360px}
.pmode .btn{font-weight:700}
.pmode .btn.on{background:var(--soft);border-color:var(--accent);color:var(--ink)}
.pnote{margin:-4px 0 0}
.cell.picked{background:var(--accent);border-color:var(--accent);color:var(--accent-ink,#fff)}
.cell.picked .j{color:inherit;opacity:.85}
.cell.busy{opacity:.6}
.parlaybar .podds{margin-left:8px;font-family:var(--mono)}
.parlayview .plegs{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.parlayview .plv{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px}
.parlayview .plv+.plv{border-top:1px solid var(--line)}
.parlayview .plv small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.parlayview .plv .mono{font-family:var(--mono);font-size:13px;color:var(--muted)}

/* Live score on a pending bet while its game is on (My bets, Streak picks) */
.item.lv{flex-wrap:wrap;row-gap:4px}
.item.lv>div:first-child{flex:1 1 0;min-width:0}
.livebet{order:3;flex-basis:100%;display:flex;align-items:center;gap:6px;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.livebet .dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--muted);animation:livepulse 1.6s infinite}
.livebet .st{font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;padding:1px 6px;border-radius:999px;color:var(--muted);background:color-mix(in srgb,var(--muted) 12%,transparent)}
.livebet b{font-weight:700;color:var(--ink)}
.livebet .clk{color:var(--muted);font-weight:600;overflow:hidden;text-overflow:ellipsis}
.livebet.up .dot{background:var(--win)}.livebet.up .st{color:var(--win);background:color-mix(in srgb,var(--win) 12%,transparent)}
.livebet.down .dot{background:var(--loss)}.livebet.down .st{color:var(--loss);background:color-mix(in srgb,var(--loss) 12%,transparent)}
.livebet.even .dot{background:var(--pend)}.livebet.even .st{color:var(--pend);background:color-mix(in srgb,var(--pend) 14%,transparent)}
@keyframes livepulse{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.livebet .dot{animation:none}}
/* Streak on the line (Bet page, while the Streak pick's game is on) */
#streakline:empty{display:none}
.streakline{display:flex;align-items:center;gap:10px;background:#131A17;color:#F5F7F6;border-radius:10px;padding:10px 12px;font-size:13.5px;line-height:1.3;text-decoration:none}
.streakline:hover{color:#F5F7F6;outline:2px solid var(--accent)}
.streakline .fire{font-size:20px;flex:none}
.streakline .sltxt{min-width:0;flex:1 1 auto}
.streakline b,.streakline small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.streakline b{font-weight:800}
.streakline small{opacity:.75;font-size:12px}
.streakline .slsc{flex:none;text-align:right;font-family:var(--mono);font-size:12px;white-space:nowrap}
.streakline .slsc small{display:block;font-size:11px;opacity:.7}
.streakline .slsc .st{display:block;font-family:var(--sans);font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:#94A39C}
.streakline .slsc.up .st{color:#34C08A}.streakline .slsc.down .st{color:#EF6B63}.streakline .slsc.even .st{color:#E0B04A}
:root[data-theme="dark"] .streakline{background:#22302A}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .streakline{background:#22302A}}
/* Win celebration */
.winwrap{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:16px;background:rgba(10,14,12,.4);overflow:hidden}
.wincard{position:relative;z-index:1;background:var(--card);color:var(--ink);border-radius:16px;padding:22px 26px;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.25);min-width:250px;max-width:340px;animation:winpop .35s ease-out}
.wincard .lbl{font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:12px;color:var(--win)}
.wincard .big{font-family:var(--mono);font-size:40px;font-weight:700;color:var(--win);line-height:1.15}
.wincard p{margin:8px 0 14px;color:var(--muted);font-size:14px}
.wincard p span{display:block}
.confetti{position:absolute;top:-20px;width:8px;height:14px;border-radius:2px;animation:confall 3s ease-in forwards}
.confetti.round{width:7px;height:7px;border-radius:50%}
@keyframes confall{to{transform:translate(var(--drift),110vh) rotate(var(--spin));opacity:.9}}
@keyframes winpop{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){.wincard{animation:none}}
/* Teasers: Single Bet / Parlay / Teasers, points chooser, moved lines, slip */
.pmode.three{grid-template-columns:1fr 1fr 1fr;max-width:none}
.tpts{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.tpts span{font-size:13px;font-weight:700;color:var(--muted);white-space:nowrap}
.tpts .btn{padding:6px 14px;font-family:var(--mono);font-weight:700}
.tpts .btn.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.cell .was{display:block;font-size:9px;color:var(--muted);text-decoration:line-through}
.cell.picked .was{color:inherit;opacity:.8}
.cell.tdim{opacity:.3;cursor:default}
.leg .tlo{font-family:var(--mono);font-size:13px;text-align:right;white-space:nowrap}
.leg .tlo s{color:var(--muted);font-size:11px;display:block}
.ttable{width:100%;border-collapse:collapse;font-size:13px;margin:4px 0}
.ttable th,.ttable td{padding:4px 6px;border-bottom:1px solid var(--line);text-align:center;font-family:var(--mono)}
.ttable th{font-family:var(--sans);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.ttable td:first-child,.ttable th:first-child{text-align:left;font-family:var(--sans)}
.ttable td.on{background:var(--soft);font-weight:700}
.parlaybar .tzpts{font-weight:700;opacity:.9}
/* A tall slip (parlay or teaser with many picks, small phones) scrolls inside the popup so every button can be reached */
.modal .sheet{max-height:calc(100dvh - 32px - env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.modal .sheet>*{flex-shrink:0}
/* Banner ads (CMS Banners). Side spots only where the screen has room beside the 560px column; Full Access members see none. */
.adl{display:block;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.adimg{display:block;line-height:0}
.adimg img{display:block;max-width:100%;height:auto;border-radius:8px}
.kindnote{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:12;width:calc(100% - 32px);max-width:520px;background:var(--card);color:var(--ink);border:1px solid var(--accent);border-radius:12px;box-shadow:0 8px 28px rgba(0,0,0,.18);padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.kindnote[hidden],.kindwall[hidden]{display:none}
.kindwall{position:fixed;inset:0;z-index:60;background:rgba(10,16,13,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;padding:16px}
.kindwall-card{width:100%;max-width:460px;background:var(--card);color:var(--ink);border-radius:14px;padding:22px 20px;box-shadow:0 18px 50px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:12px}
.kindwall-card h2{margin:0;font-size:22px;line-height:1.25;font-weight:800;text-transform:none;letter-spacing:-.01em;color:var(--ink)}.kindwall-card p{margin:0;font-size:15px;line-height:1.5}
.kindwall-card .kindnote-b{justify-content:flex-start;flex-wrap:wrap}.kindwall-s{font-size:13px!important;color:var(--muted)}
html.kindlock,html.kindlock body{overflow:hidden}.kindnote p{margin:0;font-size:14px;line-height:1.45}.kindnote-b{display:flex;gap:8px;justify-content:flex-end}
.adrail{display:none}
.advideo{margin-bottom:14px}.advideo .adcode{width:300px;max-width:100%}
/* the right column with the video stays in place like the banners (owner 2026-10-06: no sliding, nothing cut off). Under the video:
   the 300x600 where it fits (940 tall and up), the 300x250 on shorter windows (owner: "show the video, add 300x250"). The video is
   400 wide wherever the screen is wide enough (1440 and up; owner: "video really needs to be 400"), with the banners under it
   staying 300, centered; 300 on narrower screens. */
.adrail.right.withvideo .adshort{display:none}
@media (max-height:939px){.adrail.right.withvideo .adtall{display:none}.adrail.right.withvideo .adshort{display:block}}
@media (min-width:1440px){
  .adrail.right.withvideo{width:400px;right:calc(50% - 280px - 24px - 400px)}
  .adrail.right.withvideo .adtall,.adrail.right.withvideo .adshort{width:300px;margin-left:auto;margin-right:auto}
  .adrail.right.withvideo .advideo .adcode{width:400px}
}
/* windows a bit under 1440 wide (e.g. a laptop with the browser zoomed in): the page and the left banner move 50px left and the gaps
   narrow to 20px, so the 400-wide video column still fits (owner 2026-10-06). Down to 1324 wide; narrower gets the 300 video. */
@media (min-width:1324px) and (max-width:1439px){
  body.hasvideo .wrap{position:relative;left:-50px}
  body.hasvideo .adrail.left{left:calc(50% - 50px - 280px - 20px - 300px)}
  .adrail.right.withvideo{width:400px;right:calc(50% + 50px - 280px - 20px - 400px)}
  .adrail.right.withvideo .adtall,.adrail.right.withvideo .adshort{width:300px;margin-left:auto;margin-right:auto}
  .adrail.right.withvideo .advideo .adcode{width:400px}
}

@media (min-width:1240px){
  .adrail{display:block;position:fixed;top:24px;width:300px;max-height:calc(100vh - 32px);overflow:hidden;z-index:4}
  .adrail.left{left:calc(50% - 280px - 24px - 300px)}
  .adrail.right{right:calc(50% - 280px - 24px - 300px)}
  .adrail .adimg img{width:300px}
}
/* blog pages are wider (1080) but the side banners are placed for the 560 column: when the banners show, blog pages use the 560 column too, so nothing sits under a banner (2026-10-08) */
@media (min-width:1240px){body:has(.adrail) .wrap.wide{max-width:560px}}
.adfoot{--h:62px;position:fixed;left:0;right:0;bottom:0;z-index:8;display:flex;align-items:center;justify-content:center;gap:8px;min-height:var(--h);padding:6px 44px calc(6px + env(safe-area-inset-bottom,0px));background:var(--card);border-top:1px solid var(--line);box-shadow:0 -4px 14px rgba(0,0,0,.08)}
.adfoot .adl{writing-mode:vertical-rl;transform:rotate(180deg);margin:0;font-size:9px}
.adfoot .adimg img{max-height:50px;width:auto;max-width:100%}
.adfoot .adcode{max-width:100%;overflow:hidden}
.adfoot .adx{position:absolute;top:-14px;right:10px;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:16px;line-height:1;display:grid;place-items:center;cursor:pointer;padding:0}
@media (min-width:761px){.adfoot{--h:102px}.adfoot .adimg img{max-height:90px}}
body:has(#adfoot){padding-bottom:calc(var(--adfoot-h,62px) + 16px)}
@media (min-width:761px){body:has(#adfoot){--adfoot-h:102px}}
body:has(#adfoot) .parlaybar{bottom:calc(var(--adfoot-h,62px) + 14px + env(safe-area-inset-bottom,0px))}
body:has(#adfoot) .toast{bottom:calc(var(--adfoot-h,62px) + 20px + env(safe-area-inset-bottom,0px))}
body:has(#adfoot):has(#parlaybar) .toast{bottom:calc(var(--adfoot-h,62px) + 90px + env(safe-area-inset-bottom,0px))}
body:has(#adfoot):has(#parlaybar){padding-bottom:calc(var(--adfoot-h,62px) + 90px)}
/* Desktop: the footer links sit in a light box */
@media (min-width:900px){footer{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 20px}}
.wincard .wx{position:absolute;top:8px;right:8px;width:32px;height:32px;border-radius:50%;border:0;background:transparent;color:var(--muted);font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0}
.wincard .wx:hover{background:var(--soft);color:var(--ink)}
/* ---------- Casino (free play) ---------- */
.cz{display:flex;flex-direction:column;gap:14px}
.czback{font-weight:700;font-size:14px;color:var(--accent);text-decoration:none;align-self:flex-start}
.czhead{gap:12px}
.czrow{display:flex;align-items:center;justify-content:space-between;gap:10px}
.czchips{display:flex;align-items:center;gap:10px}
.czchips b{display:block;font-family:var(--mono);font-size:22px;line-height:1.1}
.czchips small{display:block;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.czchip{width:28px;height:28px;border-radius:50%;flex:none;background:radial-gradient(circle,#F2C94C 38%,#c9971d 40%,#c9971d 52%,#F2C94C 54%);box-shadow:inset 0 0 0 2px #fff}
#czClaim{font-weight:800;white-space:nowrap}
.czrwd{display:flex;flex-direction:column;gap:6px}
.czt{display:flex;justify-content:space-between;gap:10px;font-size:13px}.czt b{color:var(--accent)}
.czbar{height:10px;border-radius:99px;background:var(--soft);overflow:hidden}.czbar i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .3s}
.czrwd small,.czstreak small{color:var(--muted);font-size:12px}
.czstreak{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.czdots{display:flex;gap:5px}.czdots i{width:12px;height:12px;border-radius:50%;background:var(--line)}.czdots i.on{background:#F2C94C;box-shadow:0 0 0 2px rgba(242,201,76,.35)}
.czhuman{display:flex;flex-direction:column;gap:6px;border:1px dashed var(--accent);border-radius:10px;padding:10px 12px;background:var(--soft)}
.czhuman small{color:var(--muted);font-size:12.5px}
.czgames{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.czgame{border-radius:12px;padding:16px 8px;color:#fff;text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center;text-decoration:none}
.czgame:hover{color:#fff;filter:brightness(1.08)}
.czgame .ic{font-size:34px;line-height:1}.czgame b{font-size:15px}.czgame small{font-size:11px;opacity:.85}
.czgame.g1{background:linear-gradient(160deg,#0f5132,#0b3d26)}.czgame.g2{background:linear-gradient(160deg,#5b1a8a,#3a0f5c)}.czgame.g3{background:linear-gradient(160deg,#8a1a1a,#4f0d0d)}
.czking{flex-direction:row;align-items:center;gap:10px;font-size:14px;background:linear-gradient(90deg,rgba(242,201,76,.2),transparent)}
.czboard .czr{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.czboard .czr:first-of-type{border-top:0}.czboard .czr.me{background:var(--soft);margin-inline:-16px;padding-inline:16px}
.czbonus,.czprize{font-style:normal;font-size:11px;font-weight:800;border-radius:99px;padding:1px 7px;white-space:nowrap}
.czbonus{background:#F2C94C;color:#131A17}.czprize{background:var(--soft);color:var(--accent)}
.czwheel .czwhead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.czwheel .czwhead small{display:block;color:var(--muted);font-size:12.5px}
.czwheelbox{position:relative;width:220px;height:220px;margin:6px auto 0}
.czw{--n:6;position:absolute;inset:0;border-radius:50%;border:6px solid #6b4a1a;overflow:hidden;
  background:conic-gradient(#0f7b55 0 16.66%,#F2C94C 0 33.33%,#c2413a 0 50%,#5B8DEF 0 66.66%,#5b1a8a 0 83.33%,#131A17 0 100%)}
.czw span{position:absolute;left:50%;top:0;width:0;height:50%;transform-origin:bottom center;transform:rotate(calc((var(--i) + .5) * 360deg / var(--n)))}
.czw span b{position:absolute;top:18px;left:50%;transform:translateX(-50%);color:#fff;font-weight:900;font-size:15px;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.czwptr{position:absolute;top:-6px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;border-top:20px solid var(--ink);z-index:2}
.felt{background:radial-gradient(ellipse at 50% 30%,#1a7a4c,#0d4a2d 75%);border-radius:14px;padding:16px;color:#fff;display:flex;flex-direction:column;gap:12px}
.felt h3{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.85;font-weight:800;display:flex;align-items:center;gap:8px}
.felt .hand{display:flex;gap:8px;align-items:center;min-height:76px;flex-wrap:wrap}
.pc{width:52px;height:74px;border-radius:7px;background:#fff;color:#131A17;font-weight:800;font-size:18px;padding:5px 6px;box-shadow:0 3px 8px rgba(0,0,0,.3);display:flex;flex-direction:column;justify-content:space-between}
.pc.red{color:#c2413a}.pc span:last-child{align-self:flex-end;font-size:22px}
.pc.back{background:repeating-linear-gradient(45deg,#c2413a 0 6px,#a5342e 6px 12px);border:3px solid #fff}
.tot{background:rgba(0,0,0,.35);border-radius:99px;padding:2px 10px;font-family:var(--mono);font-weight:700;letter-spacing:0}
.tot:empty{display:none}
.czmsg{text-align:center;font-weight:800;font-size:16px;min-height:24px}
.czbetting{display:flex;flex-direction:column;gap:10px}
.czbet{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(0,0,0,.25);border-radius:10px;padding:8px 12px;font-size:14px}
.czbet b{font-family:var(--mono)}
.czchipsel{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.czc{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;color:#fff;border:3px dashed rgba(255,255,255,.75);cursor:pointer;padding:0;font-family:var(--sans)}
.czc.c10{background:#3a7bd5}.czc.c50{background:#c2413a}.czc.c100{background:#5b1a8a}.czc.c500{background:#131A17}
.czc.on{border-style:solid;border-color:#F2C94C;box-shadow:0 0 0 2px #F2C94C}
.czbig{font-size:18px;font-weight:900;padding:13px}
.bjbtns{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.bjbtns .btn{font-weight:800}
.slot{background:linear-gradient(170deg,#5b1a8a,#2a0845);border-radius:14px;padding:16px;color:#fff;display:flex;flex-direction:column;gap:14px}
.reels{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:#1a0530;padding:10px;border-radius:12px;border:3px solid #F2C94C}
.reel{background:#fff;border-radius:8px;height:92px;display:grid;place-items:center;font-size:52px;line-height:1}
.slot .win{text-align:center;font-weight:900;font-size:19px;color:#F2C94C;min-height:26px}
.pay{width:100%;border-collapse:collapse;font-size:14px}.pay td{padding:5px 6px;border-bottom:1px solid var(--line)}.pay td:last-child{text-align:right;font-family:var(--mono);font-weight:700}
.rtab{background:radial-gradient(ellipse at 50% 20%,#1a7a4c,#0b3f27 80%);border-radius:14px;padding:16px 12px;color:#fff;display:flex;flex-direction:column;gap:14px}
.rwheelbox{position:relative;width:230px;margin:0 auto}
.rwheel{display:block;width:230px;height:230px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.35))}
.rptr{position:absolute;top:-4px;left:50%;transform:translateX(-50%);border-left:7px solid transparent;border-right:7px solid transparent;border-top:12px solid #F2C94C}
.rres{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:800;font-size:15px;min-height:42px;text-align:center}
.rres .num{width:42px;height:42px;border-radius:50%;color:#fff;display:grid;place-items:center;font-family:var(--mono);font-size:20px;border:2px solid #F2C94C}
.board{display:grid;grid-template-columns:44px repeat(3,1fr) 52px;grid-auto-rows:38px;gap:3px;border:2px solid rgba(255,255,255,.75);border-radius:8px;padding:3px;background:#0d4a2d}
.rbtn{position:relative;color:#fff;font:inherit;font-weight:800;border:1px solid rgba(255,255,255,.4);border-radius:3px;padding:0;cursor:pointer;background:transparent;display:grid;place-items:center}
.rbtn:hover{filter:brightness(1.2);outline:1px solid #F2C94C}
.board .zero{grid-column:2 / span 3;grid-row:1;background:#0f7b55;border-radius:16px 16px 4px 4px}
.board .rc{font-family:var(--mono);font-size:14px}.board .rc.red{background:#c2413a}.board .rc.black{background:#1b1f1d}
.board .rd{grid-column:1}.board .ro{grid-column:5}
.board .rd>span,.board .ro>span:not(.dia){writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;letter-spacing:.04em}
.board .c21{grid-row:14;font-size:10px}
.dia{width:18px;height:18px;transform:rotate(45deg);display:block;border:1px solid #fff}.dia.red{background:#c2413a}.dia.black{background:#1b1f1d}
.rchip{position:absolute;top:-6px;right:-6px;min-width:24px;height:24px;padding:0 3px;border-radius:12px;background:#F2C94C;color:#131A17;font-size:9.5px;font-weight:900;display:grid;place-items:center;border:2px dashed #fff;box-shadow:0 2px 4px rgba(0,0,0,.4);z-index:2;font-family:var(--sans);writing-mode:horizontal-tb;transform:none}
.rbar{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px}
.rbtns{display:grid;grid-template-columns:1fr 1fr 2fr;gap:8px}.rbtns .btn{font-weight:800}
.czbet.dark{background:rgba(0,0,0,.3)}
@media (prefers-reduced-motion:reduce){.czw,.rspin{transition:none!important}}
/* Bet slip: the Contest bet placed alongside the Free/Paid bet */
.conbox{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--accent);background:var(--soft);border-radius:10px;padding:10px 12px}
.conbox small{display:block;color:var(--muted);font-size:12px}
.conbox .conamt{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.conbox .amtin.ro{display:flex;align-items:center;gap:4px;width:96px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--card)}
.conbox .amtin.ro input{width:100%;border:0;background:transparent;font:inherit;font-weight:700;padding:8px 0;outline:none}
.quick .maxb,.quick .minb{font-weight:800}
.quick{flex-wrap:nowrap}.quick .btn{flex:1 1 0;min-width:0;padding-inline:4px;white-space:nowrap}
.bjbtns{grid-template-columns:repeat(4,1fr)}
.bjhands{display:flex;flex-direction:column;gap:8px}
.bjhand{border-radius:10px;padding:6px;border:2px solid transparent}
.bjhand.on{border-color:#F2C94C;background:rgba(0,0,0,.15)}
.bjhand small{display:block;font-size:12.5px;opacity:.9;margin-top:4px}
.bjhand .r-win,.bjhand .r-blackjack{color:#F2C94C}.bjhand .r-lose,.bjhand .r-bust{color:#ffb3ad}
.czconfirm{border:1px dashed var(--pend);border-radius:8px;padding:8px 10px;font-size:13px}
.sub.six{grid-template-columns:repeat(6,minmax(0,1fr))}
.sub.six a{font-size:11.5px;padding:8px 1px;line-height:1.2}
@media (max-width:520px){.sub.six{grid-template-columns:repeat(3,minmax(0,1fr))}.sub.six a{font-size:13px;padding:8px 2px}}
/* Roulette inside bets: hot spots on the lines between numbers */
.board{position:relative}
.rspot{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border:0;border-radius:7px;background:transparent;z-index:3;padding:0}
/* tap areas hug the lines so a tap on a number bets the number (they used to cover most of a small phone cell) */
.rspot.sh{width:30px;height:12px;margin:-6px 0 0 -15px}
.rspot.sv{width:12px;height:24px;margin:-12px 0 0 -6px}
.rspot.st{width:14px;height:24px;margin:-12px 0 0 -7px}
.rspot.six,.rspot.k4{width:14px;height:14px;margin:-7px 0 0 -7px}
.rspot::before{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:rgba(255,255,255,.3)}
.rspot.k4::before,.rspot.six::before{background:rgba(242,201,76,.6)}
.rspot.st::before{background:rgba(255,255,255,.5)}
.rspot:hover{outline:none;filter:none}.rspot:hover::before{width:10px;height:10px;margin:-5px 0 0 -5px;background:rgba(242,201,76,.9)}
.rspot .rchip{top:50%;right:auto;left:50%;transform:translate(-50%,-50%)}
/* a chip on a number sits in the middle of the number, like a real table (in the corner it looked like a corner bet) */
.board .rc .rchip{top:50%;right:auto;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.board .rc{position:relative}
.rspot:has(.rchip)::before{display:none}

/* Payouts page (footer link) */
.po-tick{display:flex;align-items:center;gap:10px;background:#FFF8E1;border:1px solid #F2C94C;border-radius:10px;padding:10px 14px;font-size:14px;color:#1b1f1d}
.po-tick .dot{width:8px;height:8px;border-radius:50%;background:#2DBE60;box-shadow:0 0 0 4px rgba(45,190,96,.2);flex-shrink:0}
.po-tick small{color:#5b6660;margin-left:auto;white-space:nowrap;font-size:12px}
.po-hero{background:linear-gradient(135deg,#0F7B55,#0b5c40);color:#fff;border:0}
.po-hero small{font-size:11px;font-weight:800;letter-spacing:.08em;opacity:.85;text-transform:uppercase}
.po-hero .big{font-family:var(--mono);font-size:34px;font-weight:700;line-height:1.1}
.po-hero .sub2{font-size:13px;opacity:.9}
.po-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.po-tiles div{background:rgba(255,255,255,.12);border-radius:8px;padding:10px 8px;display:flex;flex-direction:column;gap:2px}
.po-tiles b{font-family:var(--mono);font-size:16px}
.po-tiles span{font-size:11px;opacity:.9;line-height:1.25}
.po-h{font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;margin:4px 2px -4px}
.po-sub{display:flex;gap:6px;flex-wrap:wrap}
.po-sub a{padding:7px 12px;border-radius:999px;border:1px solid var(--line);font-size:13px;font-weight:700;color:var(--ink);text-decoration:none;background:var(--card)}
.po-sub a.on{background:var(--ink);color:var(--card);border-color:var(--ink)}
.po-list,.po-wins{gap:0;padding:4px 16px}
.po-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}
.po-row:last-child,.po-win:last-child{border-bottom:0}
.po-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:16px;flex-shrink:0;background:var(--soft)}
.po-ic.contest{background:#FFF3D6}.po-ic.streak{background:#FFE6E0}.po-ic.converted{background:#E6EEFF}
.po-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.po-mid b{font-size:14px;overflow-wrap:anywhere}.po-mid small{color:var(--muted);font-size:12px}
.po-amt{text-align:right;display:flex;flex-direction:column;gap:1px}
.po-amt b,.po-win b,.po-best .amt{font-family:var(--mono);color:var(--accent)}
.po-amt b{font-size:15px}.po-amt small{color:var(--muted);font-size:11px}
.po-win{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.po-win i{font-style:normal;font-weight:800;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--soft);font-size:12px}
.po-win i.g{background:#F2C94C;color:#3a2a00}.po-win i.sv{background:#D9DEE3;color:#222}.po-win i.bz{background:#E3A774;color:#3a1d00}
.po-best{display:flex;justify-content:space-between;align-items:center;gap:10px}
.po-best .amt{font-size:20px}
.po-tag{font-size:10px;font-weight:800;letter-spacing:.06em;padding:2px 6px;border-radius:4px;background:var(--soft);color:var(--accent);margin-left:6px;vertical-align:1px;white-space:nowrap}

/* Bet page: a few words about the sport, for visitors (CMS Settings → Bet page text) */
.seotext{margin-top:16px;gap:8px}
.seotext h1,.seotext h2{font-size:17px;margin:0;text-transform:none;letter-spacing:0;color:var(--ink)}
.seotext h1{font-size:20px;font-weight:800}
.seotext p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.stlock.fin{color:var(--ink)!important;font-weight:800;letter-spacing:.06em}

.seotext h3{font-size:15px;margin:8px 0 0;color:var(--ink)}
.seofaq details{border-top:1px solid var(--line);padding:10px 0}
.seofaq details:last-child{border-bottom:1px solid var(--line)}
.seofaq summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--ink)}
.seofaq details p{margin-top:6px}

/* 2nd Half countdown in the game's header */
.cdown{color:var(--accent);font-family:var(--mono);font-weight:800;white-space:nowrap}
.cdown.soon{color:var(--loss)}
.cdown.done{color:var(--muted)}
.tblwrap.closed .cell{opacity:.35;pointer-events:none}

/* MLB probable starting pitcher under the team */
.lines .team .starter{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-top:1px;font-family:var(--sans)}

/* Video Poker */
.vp{background:radial-gradient(ellipse at 50% 0%,#1d3f8a,#0b1d47 80%);border-radius:14px;padding:16px 12px;color:#fff;display:flex;flex-direction:column;gap:12px}
.vpay{width:100%;border-collapse:collapse;font-size:12px;font-family:var(--mono)}
.vpay td{padding:2px 6px;color:#F2C94C}.vpay td:first-child{color:#fff;font-family:var(--sans);font-weight:700}.vpay td:last-child{text-align:right}
.vpay tr.hit td{background:#F2C94C;color:#131A17}
.vcards,.vheldrow{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.vcard{background:#fff;border:0;border-radius:8px;aspect-ratio:5/7;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;font-size:22px;color:#131A17;box-shadow:0 3px 8px rgba(0,0,0,.35);padding:0;transition:transform .12s;font-family:var(--sans)}
.vcard.r{color:#c2413a}.vcard small{font-size:20px;line-height:1}
.vcard.back{background:repeating-linear-gradient(45deg,#c2413a 0 6px,#a83630 6px 12px);border:3px solid #fff}
.vcard.held{outline:3px solid #F2C94C;transform:translateY(-4px)}
.vcard:disabled{cursor:default}
.vheld{font-size:10px;font-weight:900;letter-spacing:.08em;text-align:center;color:#F2C94C;height:14px}
.vmsg{text-align:center;font-weight:800;font-size:16px;min-height:22px}
.vnote{opacity:.8;text-align:center;font-size:12px}
/* Crash */
.cr{background:#0f1a2e;border-radius:14px;padding:14px 12px;color:#fff;display:flex;flex-direction:column;gap:12px}
.crhist{display:flex;gap:6px;overflow:hidden;min-height:22px}.crhist span{font-family:var(--mono);font-size:12px;font-weight:800;padding:3px 8px;border-radius:999px;background:#1f2b45;white-space:nowrap}
.crhist .lo{color:#EF6B63}.crhist .hi{color:#34C08A}.crhist .big{color:#F2C94C}
.crgraph{position:relative;height:210px;border-radius:10px;background:linear-gradient(180deg,#14223c,#0b1426);overflow:hidden}
.crgraph svg{position:absolute;inset:0;width:100%;height:100%}
.crplane{position:absolute;font-size:22px;left:0;top:90%;transition:none}
.crmult{position:absolute;left:0;right:0;top:34%;text-align:center;font-family:var(--mono);font-size:44px;font-weight:800;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.crmult.crashed{color:#EF6B63}.crmult.won{color:#34C08A}
.crsub{position:absolute;left:8px;right:8px;top:62%;text-align:center;font-size:12px;opacity:.85}
.crrow{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.crbox{background:#1f2b45;border-radius:10px;padding:8px 10px;font-size:12px;display:flex;flex-direction:column;gap:2px}.crbox b{font-family:var(--mono);font-size:16px}
.crbox input{background:transparent;border:0;color:#fff;font-family:var(--mono);font-size:16px;font-weight:700;padding:0;width:100%}
.crbtn{background:#F2C94C;color:#131A17;border:0;border-radius:12px;font-weight:900;font-size:18px;padding:14px;width:100%}
.crbtn.out{background:#34C08A}
/* Plinko */
.plk{background:radial-gradient(ellipse at 50% 0%,#3b1d6e,#160b2e 80%);border-radius:14px;padding:14px 10px;color:#fff;display:flex;flex-direction:column;gap:12px}
.pkboard{position:relative;height:300px}
.pkpeg{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff;opacity:.85;transform:translate(-50%,-50%)}
.pkball{position:absolute;left:50%;top:0;width:14px;height:14px;border-radius:50%;background:#F2C94C;box-shadow:0 0 10px #F2C94C;transform:translate(-50%,-50%);transition:left .13s linear,top .13s ease-in;z-index:2}
.pkslots{display:grid;gap:3px}.pkslots span{border-radius:5px;text-align:center;font-family:var(--mono);font-size:10px;font-weight:800;padding:6px 0;color:#131A17}
.pkslots span.hit{outline:3px solid #fff;transform:translateY(2px)}
.pkrisk{display:flex;gap:6px}.pkrisk button{flex:1;text-align:center;padding:7px;border-radius:999px;background:#2a1a4d;border:0;color:#fff;font-weight:800;font-size:13px}.pkrisk button.on{background:#fff;color:#2a1a4d}
.czgames.five{grid-template-columns:repeat(2,1fr)}
/* Scratch cards */
.zs{background:radial-gradient(ellipse at 50% 0%,#0f5c43,#06261c 85%);border-radius:14px;padding:14px 12px;color:#fff;display:flex;flex-direction:column;gap:12px}
.zstitle{text-align:center;font-weight:900;font-size:22px;letter-spacing:.02em;color:#FFD76A;text-shadow:0 2px 0 #8a5a00}.zstitle small{display:block;font-size:12px;font-weight:700;color:#fff;opacity:.8;text-shadow:none;letter-spacing:.08em;text-transform:uppercase}
.zspays{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.zspays span{display:flex;justify-content:space-between;align-items:center;gap:4px;background:rgba(0,0,0,.28);border-radius:8px;padding:5px 8px;font-size:12px}
.zspays i{font-style:normal;letter-spacing:-2px;font-size:12px}.zspays b{font-family:var(--mono);color:#FFD76A}
.zspays span.hit{background:#FFD76A;color:#131A17}.zspays span.hit b{color:#131A17}
.zscard{position:relative;border-radius:14px;background:linear-gradient(135deg,#FFE9A8,#F2C94C 55%,#E0A82E);padding:10px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.zsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.zscell{aspect-ratio:1.25;background:#fffaf0;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:clamp(30px,10vw,44px);transition:transform .2s,box-shadow .2s}
.zscell.win{box-shadow:0 0 0 4px #0f5c43,0 0 18px #fff;transform:scale(1.05);animation:zspop .6s ease 2}
@keyframes zspop{50%{transform:scale(1.14)}}
.zsfoil{position:absolute;inset:0;width:100%;height:100%;border-radius:14px;touch-action:none;cursor:pointer;transition:opacity .35s}
.zsidle{position:absolute;inset:10px;border-radius:10px;background:repeating-linear-gradient(45deg,#d4d7de 0 10px,#c6c9d1 10px 20px);display:flex;align-items:center;justify-content:center;text-align:center;padding:20px;color:#4a4f5c;font-weight:800;font-size:15px}
.zsbtns{display:flex;flex-direction:column;gap:8px}
.zsreveal{background:#FFD76A;color:#131A17;border:0}
@media (prefers-reduced-motion:reduce){.zscell.win{animation:none}}
/* Dice */
.zd{background:linear-gradient(180deg,#1b2440,#0d1326);border-radius:14px;padding:14px 12px;color:#fff;display:flex;flex-direction:column;gap:12px}
.zdhist{display:flex;gap:6px;overflow:hidden;min-height:22px}.zdhist span{font-family:var(--mono);font-size:12px;font-weight:800;padding:3px 8px;border-radius:999px;background:#26304f}
.zdhist .w{color:#34C08A}.zdhist .l{color:#EF6B63}
.zdroll{text-align:center;font-family:var(--mono);font-size:60px;font-weight:800;line-height:1.1;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.zdroll.won{color:#34C08A}.zdroll.lost{color:#EF6B63}
.zdbar{position:relative;height:16px;border-radius:999px;background:#EF6B63;margin:14px 6px 0}
.zdzone{position:absolute;top:0;bottom:0;background:#34C08A;border-radius:999px}
.zdpin{position:absolute;top:-30px;transform:translateX(-50%);background:#fff;color:#131A17;width:14px;height:22px;clip-path:polygon(0 0,100% 0,100% 60%,50% 100%,0 60%);transition:left .05s linear}
.zdpin.won{background:#34C08A}.zdpin.lost{background:#EF6B63}
.zdrange{position:absolute;left:-6px;right:-6px;width:calc(100% + 12px);top:-8px;height:32px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;touch-action:none}
.zdrange::-webkit-slider-runnable-track{background:transparent;height:32px}
.zdrange::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:1px;border-radius:8px;background:#fff;border:3px solid #4b6bfb;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.zdrange::-moz-range-track{background:transparent}
.zdrange::-moz-range-thumb{width:24px;height:24px;border-radius:8px;background:#fff;border:3px solid #4b6bfb}
.zdscale{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;opacity:.7;margin:0 2px}
.zddir{display:flex;gap:6px}.zddir button{flex:1;padding:9px;border-radius:999px;background:#26304f;border:0;color:#fff;font-weight:800;font-size:14px}.zddir button.on{background:#fff;color:#1b2440}
.zdstats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.zdstats div{background:#26304f;border-radius:10px;padding:8px;display:flex;flex-direction:column;gap:2px;text-align:center}
.zdstats small{font-size:11px;opacity:.8}.zdstats b{font-family:var(--mono);font-size:18px}
/* My casino plays */
.zhlist{display:flex;flex-direction:column}
.zhrow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.zhrow:first-child{border-top:0}
.zhrow .zhmid{min-width:0;display:flex;flex-direction:column;gap:2px}
.zhrow .zhmid b{font-size:14px}.zhrow .zhmid small{color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.zhrow .zhamt{text-align:right;flex:none;font-family:var(--mono);font-size:15px}
.zhrow .zhamt small{display:block;font-family:var(--sans,inherit);color:var(--muted);font-size:11px}
.zhrow .zhamt.up{color:var(--accent)}.zhrow .zhamt.down{color:var(--muted)}
.czplays{font-size:13px;font-weight:700;align-self:flex-start}
/* Player Props: one dropdown per game */
.propgame{background:var(--card,#fff);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.propgame>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:12px 14px;min-height:56px}
.propgame>summary::-webkit-details-marker{display:none}
.propgame .pgteams{flex:1;min-width:0;font-weight:800;font-size:15px;line-height:1.25}
.propgame .pgteams small{display:block;font-weight:600;font-size:12px;color:var(--muted)}
.propgame .pgcount{flex:none;font-size:12px;font-weight:800;color:var(--accent);background:var(--bg);border-radius:999px;padding:4px 10px;white-space:nowrap}
.propgame .pgchev{flex:none;width:9px;height:9px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin:0 4px 4px 0;transition:transform .15s}
.propgame[open] .pgchev{transform:rotate(-135deg);margin:4px 4px 0 0}
.propgame[open]>summary{border-bottom:1px solid var(--line)}
.propgame .tblwrap{border:0;border-radius:0;margin:0}
.lines.props tr.pgplayer td{font-weight:800;font-size:14px;padding:10px 12px 8px;text-align:left;color:var(--ink);background:var(--bg)}
/* Survivor pool */
.sv{display:flex;flex-direction:column;gap:12px}
.svhero{background:linear-gradient(135deg,#0d3b2c,#0f5c43);color:#fff;border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px}
.svhero h2,.svhero h1.as-h2{color:#fff;margin:0;font-size:22px;font-weight:900;letter-spacing:.01em;text-transform:none}
.svhero h2 small,.svhero h1.as-h2 small{color:#FFD76A;display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.svstats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.svstats div{background:rgba(255,255,255,.12);border-radius:10px;padding:8px;text-align:center}.svstats b{display:block;font-family:var(--mono);font-size:20px}.svstats small{font-size:11px;opacity:.85}
.svme{display:flex;align-items:center;gap:10px;background:#fff;color:#131A17;border-radius:10px;padding:10px 12px}
.svme .dot{width:12px;height:12px;border-radius:50%;background:#34C08A;box-shadow:0 0 0 4px rgba(52,192,138,.25);flex:none}
.svme.out .dot{background:#EF6B63;box-shadow:0 0 0 4px rgba(239,107,99,.25)}.svme.won .dot{background:#F2C94C;box-shadow:0 0 0 4px rgba(242,201,76,.3)}
.svme b{font-size:15px}.svme small{display:block;color:#5c6b64;font-size:12px}
.svjoin{width:100%;background:#FFD76A;color:#131A17;border:0;font-weight:900;font-size:17px;padding:13px}
.svlock{font-size:12px;opacity:.9}
.svweek{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.svweek h3{margin:0;font-size:16px}.svweek small{color:var(--muted);font-size:12px;text-align:right}
.svgame{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.svgame .when{font-size:11px;font-weight:700;color:var(--muted);padding:8px 12px 0;display:flex;justify-content:space-between}
.svteams{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px 10px 10px}
.svform{margin:0;display:flex}
.svteam{width:100%;text-align:left;border:2px solid var(--line);border-radius:10px;padding:9px 10px;display:flex;flex-direction:column;gap:2px;background:var(--card);color:var(--ink);position:relative;cursor:pointer;font:inherit}
.svteam b{font-size:15px}.svteam small{font-size:12px;color:var(--muted)}.svteam .ml{font-family:var(--mono);font-size:12px}
.svteam:disabled{cursor:default}
.svteam.pick{border-color:#0f5c43;background:#e7f4ee;color:#131A17}.svteam.pick::after{content:'YOUR PICK';position:absolute;top:-9px;right:8px;background:#0f5c43;color:#fff;font-size:9px;font-weight:900;letter-spacing:.08em;padding:2px 6px;border-radius:999px}
.svteam.used{opacity:.45;background:repeating-linear-gradient(45deg,var(--bg) 0 8px,var(--line) 8px 16px)}.svteam.used small.u{color:#a14a40;font-weight:800}
.svgame.locked .svteam:not(.pick){opacity:.5}
.svused{display:flex;flex-wrap:wrap;gap:6px}.svused span{background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700}
.svrules{font-size:13px;color:var(--muted);margin:0;padding-left:18px}.svrules li{margin:3px 0}
.svtable{width:100%;border-collapse:collapse;font-size:13px}.svtable th{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);text-align:left;padding:6px 4px}
.svtable td{padding:9px 4px;border-top:1px solid var(--line)}.svtable td.n{font-family:var(--mono);text-align:right}
.svtable .out{color:var(--muted)}.svtable .out td:first-child{text-decoration:line-through}
.svpop{display:flex;flex-direction:column;gap:6px}
.svpop div{display:grid;grid-template-columns:minmax(0,130px) 1fr 42px;gap:8px;align-items:center;font-size:13px;font-weight:700}
.svpop span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.svpop i{height:10px;border-radius:999px;background:#0f5c43;display:block}.svpop span.n{font-family:var(--mono);text-align:right;font-weight:500}
.svtag{display:inline-block;font-size:10px;font-weight:900;letter-spacing:.06em;border-radius:999px;padding:2px 7px}
.svtag.alive{background:#e7f4ee;color:#0f5c43}.svtag.out{background:#f8e7e5;color:#a14a40}.svtag.won{background:#FFF1C2;color:#7a5600}
.svtabs{display:flex;gap:6px}.svtabs a{flex:1;text-align:center;padding:7px 8px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font-weight:800;font-size:13px;text-decoration:none}.svtabs a.on{background:#fff;color:#0f5c43}
/* Bet page: a date bar over each day's games (Today · Mon, Oct 5 …), then Live now and Final */
#games .daybar{margin:6px 0 -6px;font:700 12px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.07em;color:var(--muted);display:flex;align-items:center;gap:10px}
#games .daybar:after{content:"";flex:1;height:1px;background:var(--line)}
#games .daybar:first-child{margin-top:0}
/* Soccer: the Draw row under the two teams (moneyline column only) */
table.lines tr.drawrow td.team{font-weight:600}
/* SOC tab: the league menu, and each game's league over its time when showing all leagues */
.compsel{display:flex;align-items:center;gap:10px}
.compsel label{font-weight:700;font-size:13px;color:var(--muted)}
.compsel select{flex:1;max-width:320px;min-height:44px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:600 15px var(--sans)}
table.lines th.when small.comp{display:block;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent)}
/* Sideways-scrolling rows (leagues, periods): the edge with more buttons out of sight fades and shows an arrow */
.srwrap{position:relative}
.srwrap .srarrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;display:none;width:30px;height:30px;border-radius:50%;
  border:1px solid var(--line);background:var(--card);color:var(--ink);font:700 18px/1 var(--sans);box-shadow:0 2px 8px rgba(0,0,0,.15);cursor:pointer;padding:0}
.srwrap .srl{left:-6px}.srwrap .srr{right:-6px}
.srwrap.more-l .srl,.srwrap.more-r .srr{display:flex;align-items:center;justify-content:center}
.srwrap.more-r > #leagues,.srwrap.more-r > .periods{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 56px),transparent)}
.srwrap.more-l > #leagues,.srwrap.more-l > .periods{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 56px),transparent)}
.srwrap.more-l.more-r > #leagues,.srwrap.more-l.more-r > .periods{-webkit-mask-image:linear-gradient(to right,transparent,#000 56px,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(to right,transparent,#000 56px,#000 calc(100% - 56px),transparent)}
/* Bet slip: Buy points (Full Access) */
.buypts{display:flex;flex-direction:column;gap:6px}
.buypts .fa-tag.sm{font-size:10px;padding:2px 6px;margin-left:6px;vertical-align:middle}
.bpopts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.bpopts label{display:block;cursor:pointer}
.bpopts input{position:absolute;opacity:0;pointer-events:none}
.bpopts span{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border:1px solid var(--line);border-radius:10px;background:var(--card);text-align:center;min-height:44px;justify-content:center}
.bpopts b{font-size:14px;white-space:nowrap}
.bpopts small{font-family:var(--mono);font-size:11px;color:var(--muted)}
.bpopts input:checked + span{border-color:var(--accent);background:var(--soft);box-shadow:inset 0 0 0 1px var(--accent)}
.bpopts input:focus-visible + span{outline:2px solid var(--accent);outline-offset:2px}
.bpnote{color:var(--muted);font-size:12px}
.bpfa{margin:0;font-size:13px}
@media (max-width:380px){.bpopts{grid-template-columns:repeat(2,1fr)}}
/* Banner spots: the swappable inside (timed refresh) keeps the old layout */
.adbody{display:contents}
/* UFC: fighter + fight-winner moneyline only */
.lines.fight col.c1{width:62%}
.lines.fight td.team{font-size:14px}
/* Scores page: the day bar, one card per game (score by period, total), live first */
.scday{display:flex;align-items:center;gap:10px}
.scday b{font-size:15px;flex:0 1 auto}
.scday .btn{padding:4px 12px;font-size:18px;line-height:1}
.scday .btn.off{opacity:.35}
.scday .sctoday{margin-left:auto;font-weight:700}
#scores .daybar,#cpgames .daybar{margin:6px 0 -6px;font:700 12px/1.2 var(--sans);text-transform:uppercase;letter-spacing:.07em;color:var(--muted);display:flex;align-items:center;gap:10px}
#scores .daybar:after,#cpgames .daybar:after{content:"";flex:1;height:1px;background:var(--line)}
#scores .daybar:first-child,#cpgames .daybar:first-child{margin-top:0}
.scard .scroll-x{overflow-x:auto}
table.lines.sc{table-layout:auto}
.lines.sc th.when{min-width:150px;width:100%}
.lines.sc th.scp,.lines.sc td.scp{min-width:30px;font-family:var(--mono);font-size:13px;color:var(--muted);padding-inline:6px}
.lines.sc th.sct,.lines.sc td.sct{min-width:48px;font-family:var(--mono);font-size:18px;font-weight:500;padding-inline:10px}
.lines.sc th.scp,.lines.sc th.sct{font-size:10px}
.lines.sc tr.lead td.sct{color:var(--accent);font-weight:700}
.lines.sc tr.lead td.team{color:var(--ink)}
.scard.s-final .lines.sc tr:not(.lead) td.team{color:var(--muted)}
.scst.s-live,.scst.s-delayed{color:var(--accent);font-weight:700}
.scst.s-postponed{color:var(--muted)}
.scbet{display:block;padding:9px 12px;border-top:1px solid var(--line);font-weight:700;font-size:13px;color:var(--accent);text-decoration:none;text-align:right}
.lines.sc th.when,.lines.sc td.team{position:sticky;left:0;z-index:1;background:var(--card)}
.lines.sc th.when{background:var(--bg)}
.lines.sc th.sct,.lines.sc td.sct{position:sticky;right:0;z-index:1;background:var(--card);box-shadow:-1px 0 0 var(--line)}
.lines.sc th.sct{background:var(--bg)}
@media (max-width:480px){.lines.sc th.when{min-width:118px}.lines.sc td.team{max-width:150px}}
/* Computer picks (cp-): stars, record table, trend chart, picks per game, recent results */
.cph1{font-size:1.5rem;margin:0 0 4px}
.cpsub{margin:0}
.cpst{display:inline-flex;gap:1px;font-size:13px;line-height:1;letter-spacing:0;vertical-align:-1px}
.cpst i{font-style:normal;color:var(--line)}
.cpst i.on{color:#E0A100}
.cprec h2,.cpabout h2,.cpfaq h2{font-size:1.1rem;margin:0}
.cprech{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;justify-content:space-between;margin-bottom:10px}
.cpper{display:flex;gap:4px;flex-wrap:wrap}
.cpper a{font-size:13px;font-weight:700;padding:5px 10px;border-radius:999px;border:1px solid var(--line);color:var(--ink);text-decoration:none}
.cpper a.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.cprec{min-width:0}
.cprec .scroll-x{overflow-x:auto;max-width:100%}
.cptbl{width:100%;border-collapse:collapse;font-size:14px}
.cptbl th,.cptbl td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.cptbl th:first-child{text-align:left}
.cptbl thead th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.cptbl td small,.cptbl th small{color:var(--muted);font-weight:500}
.cptbl tr.cpall th,.cptbl tr.cptop th{font-weight:800}
.cptbl tr.cptop{background:var(--soft)}
.cpchart{margin:12px 0 4px}
.cpchart figcaption{font-size:13px;color:var(--muted);margin-bottom:4px}
.cpchart .k1,.cpchart .k2{font-weight:700}.cpchart .k1{color:var(--accent)}.cpchart .k2{color:#B27C00}
.cpchart svg{width:100%;height:auto;display:block}
.cpchart line.grid{stroke:var(--line);stroke-width:1}.cpchart line.mid{stroke:var(--muted);stroke-width:1;stroke-dasharray:4 4}
.cpchart text{font-size:12px;fill:var(--muted)}
.cpchart polyline{fill:none;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.cpchart .l1{stroke:var(--accent)}.cpchart .l2{stroke:#B27C00}
.cpsec{font-size:1.1rem;margin:4px 0 8px}
.lines.cpl th.cpproj,.lines.cpl td.cpproj{text-align:center;width:110px;font-variant-numeric:tabular-nums;font-weight:700}
.cphid{display:inline-flex;align-items:center;justify-content:center;color:var(--muted)}
.cppicks{padding:8px 12px 10px;border-top:1px solid var(--line);display:grid;grid-template-columns:64px auto 1fr;align-items:center;gap:6px 12px}
.cppk{display:contents}
.cppk .cpst{justify-self:start}
.cppk .cpk{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.cppk b{font-size:15px}
.cplock{display:inline-flex;align-items:center;gap:5px;color:var(--muted)}
.cpopen{grid-column:1/-1;margin:2px 0 0;font-size:13px;color:var(--muted)}
.cpres ul{list-style:none;margin:0;padding:0}
.cpres li{padding:9px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:5px}
.cpres li:last-child{border-bottom:0}
.cpresg{font-weight:700}.cpresg small{display:block;color:var(--muted);font-weight:500;font-size:12px}
.cprj{font-size:12px;color:var(--muted);font-weight:500;margin-left:6px}
.cpresp{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:14px}
.cpr{display:inline-flex;align-items:center;gap:6px}
.cpr>i{font-style:normal;font-weight:800;font-size:12px;width:20px;height:20px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;background:var(--muted)}
.cpr.r-win>i{background:var(--win)}.cpr.r-loss>i{background:var(--loss)}
.cpabout p,.cpabout li{line-height:1.55}
.cpabout ul{padding-left:20px}
.cpkey{list-style:none;padding:0!important;display:flex;flex-wrap:wrap;gap:6px 16px;margin:6px 0 0}
.cptext p,.cptext li{line-height:1.6}.cptext ul{padding-left:20px}.cptext h3{font-size:1.05rem;margin:14px 0 6px}.cptext h3:first-child{margin-top:0}
.cpkey small{color:var(--muted);font-weight:500}
.cpfaq details{border-bottom:1px solid var(--line);padding:8px 0}
.cpfaq summary{font-weight:700;cursor:pointer}
.cpfaq p{margin:6px 0 0;color:var(--ink)}
.cplinks a{white-space:nowrap}
@media (max-width:480px){.cptbl td:not(:last-child) small{display:none}.cptbl{font-size:12.5px}.cptbl th,.cptbl td{padding:6px 3px}.cptbl th small{display:none}.cptbl .cpst{font-size:11px}}
/* Bet page tag (Full Access): the computer's pick under a game */
.cptag{display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:14px;row-gap:2px;align-items:center;padding:8px 12px;border-top:1px solid var(--line);font-size:13px}
.cptag .cpk{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.cptag a{color:inherit;text-decoration:none}
.cptag .cpunlock{grid-column:3;grid-row:1/span 2;display:inline-flex;align-items:center;gap:4px;font-weight:700;color:var(--accent)}
.cptag>*{line-height:20px}
.cptag .cpk{grid-column:1;grid-row:1/span 2;display:inline-flex;align-items:center;height:20px}
.cptag .cpi{grid-column:2;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;font-size:14px}
.cptag .cpi b{font-weight:700}.cptag .cpi .cpi-k{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);min-width:58px}.cptag .cpi-l{min-width:128px}
.cptag .cpst{vertical-align:0;font-size:12px;line-height:20px;display:inline-flex;align-items:center}
.cptag .cpunlock{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;height:20px}
/* Consensus Picks pages (cs-) */
.cshero{display:flex;flex-wrap:wrap;gap:18px;align-items:stretch}
.cshead{flex:999 1 480px;min-width:0;display:flex;flex-direction:column;gap:10px}
.csmeta{margin:0;font:500 12px/1.2 var(--mono,'IBM Plex Mono',monospace);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.csfa{flex:1 1 300px;box-sizing:border-box;background:#131A17;color:#fff;border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:10px}
.csfa h2{margin:0;font-size:1.3rem;line-height:1.2;color:#fff;text-transform:none;letter-spacing:0}
.csfa .csk{margin:0;font:500 12px/1 var(--mono,'IBM Plex Mono',monospace);letter-spacing:.08em;color:#F2C94C}
.csfa ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;line-height:1.4}
.csfa li::marker{color:#34C08A}
.csfa .csfabtn{background:#34C08A;color:#0B1310;border:0;font-weight:800;min-height:46px;justify-content:center}
.csfa small{color:#B8C4BF}
.csbig{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.csbg,.csoff{display:flex;flex-direction:column;gap:8px}
.csbg small,.csoff small{color:var(--muted)}
.csbgl{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:18px}
.csbgl .csp{font-family:var(--display,Archivo,sans-serif);font-size:28px;color:var(--accent)}
.csmo{color:#8A6500}
.csbar{height:8px;border-radius:99px;background:var(--line);overflow:hidden;display:flex}
.csbar>i{display:block;height:8px;background:var(--accent)}
.csbar.two>i{background:#B8C4BF}.csbar.two>i:last-child{flex:1}
.csbar.two>i.on{background:var(--accent)}
.csbar.mo>i{background:#B8C4BF}.csbar.mo>i.on{background:#C98F00}   /* the side with less money: the same gray as picks, so gold stands out (owner 2026-10-16) */
.csoff span{line-height:1.4}.csoff .btn{justify-content:center;margin-top:auto}
.cslist{padding:4px 16px;display:flex;flex-direction:column}
.csrow{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.cslist>.csrow:last-of-type{border-bottom:0}
.csrow .csp{font-family:var(--display,Archivo,sans-serif);font-size:28px;color:var(--accent);min-width:72px}
.csrowt{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.csrowt>b{font-size:17px}.csrowt small{color:var(--muted)}
.csoffr .btn{flex:none}
.cslist>.csoffr:nth-child(even){background:#F2F6F4;margin:0 -16px;padding-left:16px;padding-right:16px}   /* every other offer shaded, like the game tables (owner 2026-10-16) */
.cslist .csterms{color:var(--muted);padding:6px 0 10px;border-top:1px solid var(--line)}
/* Consensus table (owner 2026-10-14, mockup B): one card per day; each game = away row, home row (totals: Over, Under), start time + "Best"
   price per bet. The card's own width decides the layout (container queries): phone below 600, wider columns from 600, the Picks column from 1000. */
.cst{padding:0;gap:0;overflow:hidden;container-type:inline-size}
.csgr{display:grid;grid-template-columns:66px repeat(3,minmax(0,1fr));column-gap:8px;row-gap:3px;align-items:center;padding:8px;font-size:12px;line-height:18px}
@media (max-width:599px){.cst{margin-inline:-8px}}
@container (min-width:440px){.csgr{grid-template-columns:100px repeat(3,minmax(0,1fr));column-gap:20px}.csc{font-size:11.5px;grid-template-columns:6ch auto;column-gap:.8ch}}   /* bigger phones and small tablets: a bit more room */   /* phones: 8px wider each side, as in the mockup */
.csth{background:#EDF1EF;font-size:11px;font-weight:700;line-height:16px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.csth .csday{grid-column:1/-1;margin:0;font:inherit;color:var(--ink);letter-spacing:inherit}.csth .csday+span{grid-column:2}   /* phones: the date on its own line */
.cspkh,.cspk,.cswide,.cswpk,.csbkf{display:none}
.csgm{border-top:1px solid var(--line);background:var(--card)}
.csgm.alt{background:#F2F6F4}
.csgm>summary{list-style:none;cursor:pointer}
.csgm>summary::-webkit-details-marker{display:none}
.csgm>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.cstm{font-size:13px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cstmf{display:none}   /* phones: a long team name as its abbreviation (TOR), the full name from 600px */
/* a side: its line, then its % and picks right beside it (owner 2026-10-14: the % sat too far from its line); the line column is a fixed width so every row lines up */
.csc{display:grid;grid-template-columns:5.4ch auto;justify-content:start;column-gap:.5ch;min-width:0;white-space:nowrap;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:10.5px;color:var(--muted);font-weight:500}
.csou{font-family:var(--sans);font-weight:700;margin-right:1px}
.csc.lead{color:var(--ink);font-weight:800}   /* the side most players are on: bold black, easier to read than green (owner 2026-10-18) */
.csl{overflow:hidden}
.csv{text-align:left}
.csv small{font-size:inherit;color:var(--muted);font-weight:500}   /* the pick count the same size as the line (owner 2026-10-14) */
.csc.lead .csv small,.csrows .num.lead .csn{font-weight:800;color:var(--ink)}   /* the side with more picks: its number in bold (owner 2026-10-18) */
.cstime{font-size:10.5px;line-height:14px;color:var(--muted);min-width:0}   /* "MLB · 12:05 PM" may take two lines, never cut off */
.cshint{margin:-4px 0 10px;font-size:13px;color:var(--muted)}.cshint .csclk{display:none}
@media (hover:hover) and (pointer:fine){.cshint .cstap{display:none}.cshint .csclk{display:inline}}
.csdtl{display:block;font-weight:700;color:var(--accent);white-space:nowrap}
.csmore:after{content:"";display:inline-block;width:5px;height:5px;margin-left:4px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(-2px) rotate(45deg)}
.csgm[open] .csmore:after{transform:translateY(1px) rotate(-135deg)}
.csbest{font-size:10.5px;line-height:16px;color:var(--muted);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.csbest b{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink);font-weight:600}
.csbest .csbw{display:none}
.csbest a{color:inherit;text-decoration:none}.csbest a:hover{text-decoration:underline}
.cspk{grid-row:span 3;grid-column:5;align-self:stretch;flex-direction:column;justify-content:center;gap:4px;padding-left:16px;border-left:1px solid var(--line);font-size:12.5px;line-height:18px}
.cspk>span{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px}.cspk>span>b:first-child{width:72px}
.cspk .mut{color:var(--muted)}.csmono{font-family:var(--mono)}
.cspk .cslock{align-self:flex-start;margin-top:2px;min-height:0;padding:4px 10px;border-radius:999px;border:1px solid var(--accent);background:transparent;color:var(--accent);font-size:12px;font-weight:700;display:inline-flex;gap:6px;align-items:center}
.csdet{border-top:1px solid var(--line);background:var(--card);cursor:auto}
.cskey{font-size:12px}
@container (min-width:600px){
  .csgr{grid-template-columns:150px repeat(3,minmax(0,1fr));column-gap:20px;padding:10px 16px;font-size:13px;line-height:20px}
  .csth{font-size:11px;letter-spacing:.05em}   /* the date stays on its own line above the column names, at every width */
  .cstm{font-size:14px}.cstmf{display:inline}.cstma{display:none}.csc{grid-template-columns:6.4ch auto;column-gap:1ch;font-size:13px}.csou{margin-right:.4ch}
  .csbest .csbw{display:inline}
  .cstime,.csbest{font-size:12px}
  .cswide,.csbkf{display:inline}.csbks{display:none}
  .csbest .cswide{display:none}
}
@container (min-width:1000px){
  .csgr{grid-template-columns:150px repeat(3,minmax(0,1fr)) 290px;column-gap:20px}
  .cspkh{display:block}.cspk{display:flex}.cswpk,.csbest .cswide{display:inline}
  .csdet .csfoot{display:none}   /* the Picks column shows them */
}
.csgh{padding:12px 16px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;align-items:baseline}
.csgh h4{margin:0;font-size:17px}.csgh h4 span{color:var(--muted);font-weight:500}.csgh small{color:var(--muted)}
.csmk{display:flex;flex-direction:column}
.csm{padding:12px 16px;display:flex;flex-direction:column;gap:7px;border-bottom:1px solid var(--line)}
.csmh{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.csmh span,.cshd{font-size:11px;font-weight:800;letter-spacing:.06em;color:var(--muted)}
.csmh small{color:var(--muted)}
.csrows{display:grid;grid-template-columns:minmax(0,1fr) minmax(54px,auto) minmax(54px,auto);gap:3px 8px;align-items:center;font-size:14px}
.csrows.nomoney{grid-template-columns:minmax(0,1fr) minmax(54px,auto)}
.csrows .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.csrows .csn{font-size:inherit;font-weight:500;color:var(--muted);margin-left:.4ch}   /* each side's number of picks beside its % (owner 2026-10-14) */
.csrows .cshd{text-align:right}
.csrows .lead{font-weight:800}
.csrows .mo{color:var(--muted);font-weight:400}.csrows .mo.on,.csrows .cshd.mo{color:#8A6500;font-weight:800}
.csbooks{padding:10px 16px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:6px}.csbooks>small{color:var(--muted)}
.csbkr{display:flex;flex-direction:column;gap:6px;padding:8px 0;border-top:1px solid var(--line)}
.csbkr:first-of-type{border-top:0}
.csbkh{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:34px}
.csbkh .csbet{min-height:34px;padding:0 12px;font-size:13px;font-weight:700;white-space:nowrap}
.csbkc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;font-size:14px}
.csbkc>span{padding:4px 6px;border-radius:6px;white-space:nowrap;background:var(--bg)}
.csbkc small{color:var(--muted);font-size:12px}.csbkc .csbkl{font-weight:700;margin-right:2px}
.csbkc>span.best{background:var(--soft);color:var(--accent)}
.csbig2{align-self:flex-start;font-size:12px;font-weight:700;color:#6B4E00;background:#FBF1D6;border-radius:999px;padding:3px 10px}
.csmv{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.csmv b{color:var(--ink);font-family:var(--mono);font-weight:600}
.csspark{flex:none}.csspark polyline{fill:none;stroke:var(--muted);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}.csspark.up polyline{stroke:#B7791F}.csspark circle{fill:var(--muted)}.csspark.up circle{fill:#B7791F}
.csrlm{align-self:flex-start;font-size:12px;font-weight:700;color:#7A3E00;background:#FDE8D2;border-radius:999px;padding:3px 10px}
.csrlm.sm{display:inline-block;max-width:100%;font-size:9.5px;line-height:12px;padding:1px 6px;margin-top:2px;border-radius:7px}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .csrlm{color:#FFD7AE;background:#4A2A0B}}
:root[data-theme=dark] .csrlm{color:#FFD7AE;background:#4A2A0B}
.csfoot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:10px 16px;background:var(--bg);font-size:14px}
.csfoot .mut{color:var(--muted)}.cssk{color:var(--accent);font-weight:700}
.csfoot .cslock{margin-left:auto;background:#131A17;color:#fff;border:0;display:inline-flex;gap:6px;align-items:center;font-weight:700}
.csmid{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px 20px;background:var(--soft)}
.csmid>div{flex:999 1 340px;min-width:0}.csmid h2{margin:0 0 4px;font-size:1.2rem;text-transform:none;letter-spacing:0;color:var(--ink)}.csmid p{margin:0;line-height:1.5}
.csmid .csproof{margin-top:6px;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px}
.csmid .btn{flex:1 1 200px;justify-content:center;min-height:46px;max-height:52px}
.csstick{position:sticky;bottom:0;z-index:20;display:none;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--card);border-top:1px solid var(--line);margin:12px -16px 0}
.csstick span{flex:1;display:flex;flex-direction:column;font-size:14px;line-height:1.3}.csstick small{color:var(--muted)}
@media (max-width:700px){.csstick{display:flex}.csfoot .cslock{margin-left:0;width:100%;justify-content:center}}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .csbig2{background:#3A3018;color:#F2D58A}:root:not([data-theme=light]) .csmo,:root:not([data-theme=light]) .csrows .mo.on,:root:not([data-theme=light]) .csrows .cshd.mo{color:#E0B04A}}
:root[data-theme=dark] .csth{background:#212B27}:root[data-theme=dark] .csgm.alt,:root[data-theme=dark] .cslist>.csoffr:nth-child(even){background:#1C2521}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .csth{background:#212B27}:root:not([data-theme=light]) .csgm.alt,:root:not([data-theme=light]) .cslist>.csoffr:nth-child(even){background:#1C2521}}
:root[data-theme=dark] .csbig2{background:#3A3018;color:#F2D58A}:root[data-theme=dark] .csmo,:root[data-theme=dark] .csrows .mo.on,:root[data-theme=dark] .csrows .cshd.mo{color:#E0B04A}

/* Pick Points (Pick 3, Pick 5, Moneyline Madness) */
.pp{display:flex;flex-direction:column;gap:12px}
.pphero{background:linear-gradient(135deg,#0d3b2c,#0f5c43);color:#fff;border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:8px}
.pphero h2,.pphero h1.as-h2{color:#fff;margin:0;font-size:22px;font-weight:900;text-transform:none;letter-spacing:.01em}
.pphero small{color:#cfe9dc}
.pptot{display:flex;align-items:baseline;gap:8px}.pptot b{font-family:var(--mono);font-size:34px;line-height:1}
.ppred{margin:0;font-size:13px;color:#cfe9dc}.ppred a{color:#FFD76A;font-weight:700}
.ppjoin{display:flex;gap:8px;flex-wrap:wrap}
.ppgames{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ppg{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:3px;color:inherit;text-decoration:none}
.ppg.on{border:2px solid var(--accent);background:var(--soft)}
.ppg b{font-size:15px;line-height:1.2}.ppg .pts{font-family:var(--mono);color:var(--accent);font-weight:700}
.ppg small{color:var(--muted);font-size:12px;line-height:1.25}
.ppg .st{font-size:12px;font-weight:700;margin-top:2px}.ppg .st.done{color:var(--win)}.ppg .st.todo{color:var(--pend)}.ppg .st.lost{color:var(--muted)}
.ppbonus{margin:0;font-size:13px;background:var(--card);border:1px solid var(--line);border-left:4px solid #E0B04A;border-radius:10px;padding:8px 10px}
.ppme{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}
.ppdots{display:flex;justify-content:center;gap:4px}
.ppdot{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1 1 0;min-width:0;max-width:120px;text-align:center}
.ppdot .c{width:42px;height:42px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;font-weight:800;font-size:18px;background:var(--card)}
.ppdot.f .c{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.ppdot.w .c{background:var(--win);border-color:var(--win)}.ppdot.l .c{background:var(--loss);border-color:var(--loss);color:#fff}
.ppdot.cur .c{border-color:var(--ink);box-shadow:0 0 0 3px var(--soft)}
.ppdot small{font-size:12px;color:var(--muted);line-height:1.25}
.ppdot .pen{display:inline-grid;width:22px;height:22px;border:0;background:transparent;color:var(--accent);vertical-align:-5px}
.ppnote{margin:8px 0 0;text-align:center;font-size:13px;color:var(--muted)}
.ppgame{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px}
.ppgame.used{opacity:.55}
.ppgame .when{font-size:12px;color:var(--muted);margin-bottom:4px}
.pprow{display:grid;grid-template-columns:1fr repeat(2,92px);gap:6px;align-items:center;margin-top:4px}
.pprow:has(> :nth-child(2):last-child){grid-template-columns:1fr 110px}
.pprow .tm{font-weight:700;min-width:0;overflow-wrap:anywhere}
.pphead{font-size:11px;color:var(--muted);text-align:center}
.ppb{display:block;border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:6px 4px;text-align:center;font-family:var(--mono);font-size:14px;color:var(--ink);text-decoration:none}
a.ppb:hover{border-color:var(--accent)}
.ppb small{display:block;font-size:11px;color:var(--muted)}
.ppb.sel{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.ppb.sel small{color:var(--accent-ink);opacity:.85}
.ppb.off{opacity:.4}
/* the pick sheet */
.ppcircles{display:flex;justify-content:center;align-items:flex-start;gap:0;margin:6px 0 10px;position:relative}
.ppcircles div{display:flex;flex-direction:column;align-items:center;gap:4px;width:74px;position:relative}
.ppcircles div:not(:last-child)::after{content:"";position:absolute;top:24px;left:calc(50% + 24px);width:26px;height:1px;background:var(--line)}
.ppcircles span{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:20px;background:var(--card)}
.ppcircles .f span{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.ppcircles .cur span{border:2px solid var(--ink);font-weight:800}
.ppcircles small{font-size:12px}
.pppick{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--bg);border-radius:8px;padding:12px 14px;font-size:15px}
.pppick b{font-family:var(--mono);white-space:nowrap}
.ppfinal{margin:8px 0 0;font-size:13px;color:var(--muted);text-align:center}
.ppbtns{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.ppbtns .btn{width:100%;justify-content:center}
.ppswitch{margin-bottom:6px}
/* the day window */
.ppdh{margin:12px 0 6px;font-size:15px;display:flex;justify-content:space-between;gap:8px}.ppdh span{font-weight:400;color:var(--muted)}
.ppdh b.w{color:var(--win)}.ppdh b.l{color:var(--muted)}
.ppcard{width:100%;border-collapse:collapse;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:10px;font-size:14px}
.ppcard th{background:var(--tkbar);color:var(--tkbar-ink);text-align:left;padding:8px 10px;font-size:15px}
.ppcard th.r{text-align:right;font-size:13px;font-weight:600}.ppcard th .pen{display:inline-grid;vertical-align:middle;margin-left:6px;width:30px;height:30px;background:rgba(255,255,255,.18);border:0;color:var(--tkbar-ink)}
.ppcard td{border-top:1px solid var(--line);padding:7px 10px;vertical-align:top}
.ppcard td:first-child{color:var(--muted);width:72px}
.ppcard td.me{font-weight:700}.ppcard .ck{color:#E0A030;font-weight:900}
/* My Bets card */
.pptop{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.ppbig{background:#E8913A;color:#fff;border-radius:10px;padding:10px 16px;text-align:center;min-width:120px}
.ppbig b{display:block;font-family:var(--mono);font-size:28px;line-height:1.1}.ppbig span{font-size:13px;font-weight:700}
.pphi{margin:0 0 6px;font-weight:700}
.pptablewrap{overflow-x:auto}
.pptable{width:100%;border-collapse:collapse;font-size:13px;text-align:center}
.pptable th{background:var(--tkbar);color:var(--tkbar-ink);padding:7px 6px;font-size:12px}
.pptable td{border-bottom:1px solid var(--line);padding:7px 3px;white-space:nowrap}
@media (max-width:480px){.pptable .yr{display:none}.pptable{font-size:12px}.pptable th{font-size:11px;padding:6px 2px}.pptable td a{display:block}}
.pptable td:first-child{text-align:left}
.pptable b.w{color:var(--win)}.pptable b.l{color:var(--loss)}
@media (max-width:420px){.ppgames{gap:6px}.ppg{padding:8px}.ppg b{font-size:14px}.pprow{grid-template-columns:1fr repeat(2,80px)}}
.pplg{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.pplg::-webkit-scrollbar{display:none}
.pplg a{flex:none;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font-weight:700;font-size:14px;text-decoration:none}
.pplg a.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}

/* Left side as three 300x250s (CMS Banners → Left side layout, owner 2026-10-08). "In place": as many as fit above the sticky footer
   (3 needs a window about 900 tall, e.g. a 1080p monitor; 2 on most laptops). "Scroll": all three, moving with the page. The "Ad"
   label sits in each banner's corner instead of a line above it. */
.ad250{position:relative;width:300px;height:250px;margin-bottom:6px;border-radius:8px;overflow:hidden}
.ad250 .adtag{position:absolute;top:6px;left:6px;z-index:2;margin:0;background:rgba(0,0,0,.55);color:#fff;font-size:9px;line-height:1;padding:3px 5px;border-radius:4px}
.ad250 .adimg img{width:300px;height:250px;object-fit:cover}
.ad250 .adcode{width:300px;height:250px;overflow:hidden}
@media (min-width:1240px){
  .adrail.left.three{max-height:none;overflow:visible}
  .adrail.left.three.scroll{position:absolute}
}
@media (max-height:899px){.adrail.left.three:not(.scroll) .n3{display:none}}
@media (max-height:639px){.adrail.left.three:not(.scroll) .n2{display:none}}
/* Sticky footer as just the banner (CMS Banners → Sticky footer): no white bar across the screen */
.adfoot.slim{left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:calc(100% - 16px);background:transparent;border:0;box-shadow:none;padding:0;min-height:0;bottom:calc(8px + env(safe-area-inset-bottom,0px))}
.adfoot.slim .adl{position:absolute;top:5px;left:5px;z-index:2;writing-mode:horizontal-tb;transform:none;background:rgba(0,0,0,.55);color:#fff;font-size:9px;line-height:1;padding:3px 5px;border-radius:4px}
.adfoot.slim .adimg img{border-radius:6px;box-shadow:0 4px 18px rgba(0,0,0,.28)}
.adfoot.slim .adcode{border-radius:6px;box-shadow:0 4px 18px rgba(0,0,0,.28)}
.adfoot.slim .adx{top:-12px;right:-12px}
/* No "Ad" line above the right side's video and banners (owner 2026-10-08) */
.adrail.right .adl{display:none}
/* no "Ad · 21+" label on the left banners or the sticky footer either (owner 2026-10-08); the sportsbook banners carry their own 21+ line */
.adrail.left .adl,.adfoot .adl{display:none}
/* Right side as video + two 300x250s, centered (CMS Banners → Right side, owner 2026-10-08): both show whatever the window height,
   the second only where it fits (about 780 tall; most laptops and monitors) */
.adrail.right.withvideo.two .adshort{display:block}
.adrail.right.withvideo.two .adshort2{margin-top:6px}
@media (min-width:1240px){.adrail.right.withvideo.two{max-height:none;overflow:visible}}
@media (max-height:779px){.adrail.right.withvideo.two .adshort2{display:none}}
/* Left "stay in place": on laptops (windows about 740-899 tall) a 300x100 under the two 300x250s, where the third doesn't fit (owner 2026-10-08) */
.ad100{display:none;position:relative;width:300px;height:100px;border-radius:8px;overflow:hidden}
.ad100 .adtag{position:absolute;top:6px;left:6px;z-index:2;margin:0;background:rgba(0,0,0,.55);color:#fff;font-size:9px;line-height:1;padding:3px 5px;border-radius:4px}
.ad100 .adimg img{width:300px;height:100px;object-fit:cover}
.ad100 .adcode{width:300px;height:100px;overflow:hidden}
@media (min-height:740px) and (max-height:899px){.adrail.left.three:not(.scroll) .ad100{display:block}}
/* Rotating sportsbook bar under the header (owner 2026-10-08, version D): big number, book, offer, Claim; colors per book */
.sbbar{margin:0 0 4px}
.sbslide{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;background:linear-gradient(135deg,var(--bg1),var(--bg2));border-radius:12px;padding:8px 12px;min-height:56px;animation:sbin .35s ease}
.sbslide[hidden]{display:none}
.sbbig{flex:none;display:flex;flex-direction:column;line-height:1}.sbbig small{font-size:8px;font-weight:800;letter-spacing:.1em;color:var(--c)}.sbbig b{font-size:26px;font-weight:900;color:var(--c)}
.sbtxt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.sbtxt b{font-size:14px}.sbtxt span{font-size:12px;opacity:.85;line-height:1.3}
.sbgo{flex:none;background:var(--c);color:var(--ink);font-weight:800;border-radius:8px;padding:8px 11px;font-size:13px}
@keyframes sbin{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.sbslide{animation:none}}

/* Reduced Juice Day: the board banner, the better price in each cell, the note on the bet slip */
.juicebar{margin:0;padding:10px 14px;border-radius:10px;background:var(--soft);border-left:4px solid var(--pend);font-size:14px;line-height:1.4}
.cell .j.rj{color:var(--accent);font-weight:700}
.sheet .juicenote{margin:6px 0 0;padding:8px 10px;border-radius:8px;background:var(--soft);font-size:13px;line-height:1.4}
/* Important message pop-up (CMS → Important message) */
.imx-bg{position:fixed;inset:0;background:rgba(10,20,16,.45);display:grid;place-items:center;z-index:30;padding:16px}
.imx-bg[hidden]{display:none}
.imx{background:var(--card);color:var(--ink);border-radius:18px;max-width:420px;width:100%;padding:24px 24px 20px;box-shadow:0 20px 60px rgba(0,0,0,.25);position:relative;text-align:left;animation:winpop .25s ease-out}
.imx .tag{display:inline-flex;align-items:center;gap:6px;background:#FFF4D6;color:#8A5A00;font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:999px}
.imx h3{margin:12px 0 6px;font-size:21px;line-height:1.25;font-weight:800;padding-right:20px}
.imx p{margin:10px 0 16px;color:var(--muted);font-size:15px;line-height:1.5}
.imx h3 + p{margin-top:0}
.imx .row{display:flex;gap:10px;flex-wrap:wrap}
.imx .x{position:absolute;top:10px;right:12px;border:0;background:none;font-size:22px;color:var(--muted);cursor:pointer;line-height:1}
/* Chat: who's online, and the sports emoji row (owner 2026-10-09) */
.online{margin:0 0 8px;font-size:13px;color:var(--muted);display:flex;align-items:center;gap:6px}
.online b{color:var(--ink)}
.online .dot{width:8px;height:8px;border-radius:50%;background:#34C08A;box-shadow:0 0 0 3px rgba(52,192,138,.2)}
.emojis{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;max-width:400px;margin:0 0 -2px}   /* 16 emojis: always two full rows of 8 */
.emojis button{border:0;background:none;font-size:20px;line-height:1;padding:5px;border-radius:8px;cursor:pointer}
.emojis button:hover,.emojis button:focus-visible{background:var(--soft)}
.revnote{margin:6px 0 0;font-size:12.5px}
/* Computer Picks: Upcoming / Yesterday (owner 2026-10-10) */
.cpday{display:flex;gap:6px;margin:0 0 10px}
.cpday a{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:50px;text-align:center;font-weight:700;font-size:14px;padding:7px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;line-height:1.2}
.cpday a small{display:block;font-weight:500;font-size:11.5px;color:var(--muted)}
.cpday a.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.cpday a.on small{color:inherit;opacity:.85}
.cpdaysum{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.cpdaysum>div{display:flex;flex-direction:column;gap:2px}
.cpdaysum>div+div{border-left:1px solid var(--line);padding-left:12px}
.cpdaysum .cpk{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);display:inline-flex;align-items:center;gap:4px}
.cpdaysum b{font-size:22px;line-height:1.2;font-variant-numeric:tabular-nums}
.cpdaysum small{color:var(--muted);font-weight:700;font-size:13px}
.lines.cpl th.cpscore,.lines.cpl td.cpscore{text-align:center;width:70px;font-variant-numeric:tabular-nums}
.lines.cpl td.cpscore{font-weight:800;font-size:16px}
.lines.cpl td.cpscore.won{color:var(--accent)}
.cpdonepicks{grid-template-columns:56px auto 1fr}
.cpdonepicks .cpr b{font-size:15px}
.cpdonepicks .cpr:not([class*="r-"])>i{background:var(--line);color:var(--muted)}
@media (max-width:420px){.lines.cpl th.cpproj,.lines.cpl td.cpproj{width:84px}.lines.cpl th.cpscore,.lines.cpl td.cpscore{width:56px}}
/* Contest Balance pill (owner 2026-10-11): desktop only, players in this month's Contest; gold so it doesn't read as spendable money */
.bal.con{display:none;text-decoration:none;color:inherit;border-color:#E6CF8E}
.bal.con b{color:#8A6100}
.bal.con:hover{background:#FBF4DF}
:root[data-theme="dark"] .bal.con{border-color:#5A4A22}:root[data-theme="dark"] .bal.con b{color:#F2C94C}:root[data-theme="dark"] .bal.con:hover{background:#2E2816}
@media (min-width:900px){.bal.con{display:inline-block}}
@media (min-width:900px){header .bals:has(.con){gap:4px}header .bals:has(.con) .bal{padding:5px 8px;font-size:12.5px}header .bals:has(.con) .bal span{letter-spacing:.03em}}
a.blur{color:inherit;text-decoration:none;cursor:pointer}
/* Bet slip: the line moved while it was open (owner 2026-10-12): a box at the top they can't miss */
.moved{display:flex;gap:10px;align-items:flex-start;background:#FFF4D6;border:2px solid #E0A100;border-radius:12px;padding:12px 14px;margin:10px 0 6px;color:#5A3E00;animation:movedin .35s ease-out}
.moved svg{flex:none;color:#C27C00;margin-top:1px}.moved b{display:block;font-size:15px}
.moved .mv{display:block;font-family:var(--mono);font-size:14px;margin:4px 0 2px}.moved .mv s{opacity:.7}.moved .mv strong{color:#14201B;background:#FFE08A;border-radius:4px;padding:0 4px}
.moved small{display:block;font-size:13px}
:root[data-theme="dark"] .moved{background:#3A2E10;border-color:#B8860B;color:#F5DFA0}:root[data-theme="dark"] .moved svg{color:#F2C94C}:root[data-theme="dark"] .moved .mv strong{color:#14201B}
@keyframes movedin{from{transform:scale(.97);opacity:.4}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.moved{animation:none}}
/* Sharps under a game (Bet page): same row as Computer picks */
.shtag .cpi{white-space:normal;flex-wrap:wrap}
.shtag .shm{color:var(--muted);font-size:12px;font-weight:500}
/* locked (owner 2026-10-13: "1 sharp text should match and be on the line"): one line, in the same small capitals as SHARPS and FULL ACCESS */
.shtag.shlock .cpk,.shtag.shlock .cpunlock{grid-row:1}
.shtag.shlock .cpi{white-space:nowrap}.shtag.shlock .cpi .shn{color:var(--ink);min-width:0}
/* Live tab (live betting) */
.lvtest{background:#FFF4D6;border-color:#E8C76A;color:#5A4500;font-weight:600}
.lvnote{flex-direction:row;align-items:center;justify-content:center;gap:10px;padding:10px 14px;background:var(--soft);border-color:var(--accent);font-weight:600;text-align:center}
.lvnote b{color:var(--accent)}
.lvtag{flex:none;background:var(--accent);color:#fff;border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.lvleagues{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin:14px 0}
.lvlg-opt{display:block;cursor:pointer}.lvlg-opt input{position:absolute;opacity:0}
.lvlg-opt span{display:block;border:1px solid var(--line);border-radius:8px;padding:14px;font-weight:700;text-align:center}
.lvlg-opt input:checked+span{border-color:var(--accent);background:var(--soft);color:var(--accent)}
.lvbar{display:block;text-align:center;background:var(--soft);color:var(--accent);font-weight:600;border-color:var(--accent)}
#lvboard{display:flex;flex-direction:column;gap:12px}   /* space between the live games (owner 2026-10-16) */
.lvgame{padding:0;overflow:hidden}
.lvhead{display:flex;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--line);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.lvclock{color:#C0392B}
.lvclosed{margin:0;padding:8px 12px;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line)}
.lvtbl{width:100%;border-collapse:collapse}.lvtbl th{font-size:11px;text-transform:uppercase;color:var(--muted);padding:6px;text-align:center}
.lvtbl td{padding:6px;text-align:center;border-top:1px solid var(--line)}.lvtbl td.team{text-align:left;font-weight:700}
.lvtbl td.team small{display:block;font-weight:500;color:var(--muted);font-size:11px}
.lvscore{float:right;font-size:16px}
.lvbtn{width:100%;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;padding:6px 4px;display:flex;flex-direction:column;align-items:center;line-height:1.2;cursor:pointer}
.lvbtn span{font-size:12px;color:var(--muted)}.lvbtn b{font-size:14px}.lvbtn.ln span{font-size:14px;font-weight:700;color:var(--ink)}.lvbtn.ln b{font-size:12px;font-weight:500;color:var(--muted)}   /* spreads and totals: the line is the big number, the price under it (owner 2026-10-17) */.lvbtn:hover{border-color:var(--accent)}
.lvno{display:block;font-size:12px;color:var(--muted);padding:10px 0}
.lvnone{text-align:center;color:#8A2B2B;background:#F8E1E3;font-weight:700}
.lvback{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:1050;padding:16px}
.lvback[hidden]{display:none}
.lvcount{display:flex;align-items:center;gap:12px}.lvcount b{font-size:34px;color:var(--accent);min-width:44px;text-align:center}
.lvmsg{padding:10px 12px;border-radius:8px;font-weight:600}
.lvmsg.good{background:var(--soft);color:var(--accent)}.lvmsg.bad{background:#F8E1E3;color:#8A2B2B}.lvmsg.warn{background:#FFF4D6;color:#5A4500}
.lvrules{max-height:88vh;overflow-y:auto;max-width:460px}
.lvrl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 14px;font-size:14px;line-height:1.45;font-weight:400}
.lvrl dt{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--accent);padding-top:3px}
.lvrl dd{margin:0}
.lvrh{margin:4px 0 0;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.lvrt{width:100%;border-collapse:collapse;font-size:14px;font-weight:400}
.lvrt th{text-align:left;padding:6px 10px 6px 0;width:56px;font-weight:700}.lvrt td{padding:6px 0}
.lvrt tr+tr th,.lvrt tr+tr td{border-top:1px solid var(--line)}
.lvstamp{margin:6px 0 0;text-align:center;font-size:12px;color:var(--muted)}
@keyframes lvflash{from{background:var(--soft)}to{background:transparent}}
.lvflash{animation:lvflash 1.2s ease-out;border-radius:12px}

.lvbar.lvhurry{background:#fde8e8;border-color:#e02424;color:#b42318;font-weight:700}
:root[data-theme="dark"] .lvclock{color:#fff}
:root[data-theme="dark"] .lvbar.lvhurry{background:#3A1515;border-color:#E02424;color:#FFB4B4}
.lvtaken{background:var(--line);border-color:var(--line);color:var(--muted);cursor:not-allowed;opacity:.75}.lvtaken b{color:var(--muted)}.lvtaken:hover{border-color:var(--line)}
.lvslip{max-width:400px;gap:14px}
.lvslip-head{display:flex;flex-direction:column;gap:4px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.lvslip-tag{align-self:flex-start;background:var(--soft);color:var(--accent);border-radius:999px;padding:2px 10px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.lvslip-head h3{font-size:20px;font-weight:800;margin:2px 0 0}
.lvslip-head p{margin:0;color:var(--muted);font-size:14px}
.lvstake{display:flex;flex-direction:column;gap:8px}
.lvstake>label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.lvin{display:flex;align-items:center;border:2px solid var(--line);border-radius:10px;background:var(--card);padding:0 12px}
.lvin:focus-within{border-color:var(--accent)}
.lvin span{font-size:20px;font-weight:700;color:var(--muted)}
.lvin input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:22px;font-weight:700;padding:10px 6px}
.lvchips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.lvchip{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;padding:8px 0;font-weight:700;cursor:pointer}
.lvchip:hover{border-color:var(--accent);color:var(--accent)}
.lvmeta{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lvmeta span{display:flex;flex-direction:column;background:var(--bg);border-radius:8px;padding:8px 10px;font-size:12px;color:var(--muted)}
.lvmeta b{font-size:17px;color:var(--ink)}.lvmeta b.lvwin{color:var(--accent)}
.lvhint{color:var(--muted);font-size:12px}
.lvacts{display:grid;grid-template-columns:1fr 2fr;gap:10px}
.lvacts .btn[hidden]{display:none}
.lvacts:has(.btn[hidden]){grid-template-columns:1fr}
/* The daily 3x bet (owner 2026-10-14): an orange bar at the top of the bet slip, like the old site's, with a round switch on the right */
.sheet .triple{display:flex;align-items:center;gap:8px;background:var(--accent);color:var(--accent-ink);border-radius:10px;padding:10px 12px;margin:8px 0 4px}
.sheet .triple label{flex:1;min-width:0;font-weight:800;font-size:12px;letter-spacing:.02em;text-transform:uppercase;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet .triple input[role=switch]{appearance:none;-webkit-appearance:none;flex:none;width:46px;height:26px;border-radius:999px;background:rgba(0,0,0,.28);position:relative;cursor:pointer;margin:0;transition:background .15s}
.sheet .triple input[role=switch]::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.3);transition:transform .15s}
.sheet .triple input[role=switch]:checked{background:rgba(0,0,0,.55)}
.sheet .triple input[role=switch]:checked::after{transform:translateX(20px)}
.sheet .triple input[role=switch]:focus-visible{outline:2px solid #fff;outline-offset:2px}
.sheet .trinote{margin:0 0 6px;padding:8px 10px;border-radius:8px;background:var(--soft);color:var(--ink,inherit);font-size:13px;line-height:1.4}
@media (prefers-reduced-motion:reduce){.sheet .triple input[role=switch],.sheet .triple input[role=switch]::after{transition:none}}
.tag.x3,.tagtxt .x3{color:#B85500}
:root[data-theme="dark"] .tag.x3,:root[data-theme="dark"] .tagtxt .x3{color:#F5A54F}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tag.x3,:root:not([data-theme="light"]) .tagtxt .x3{color:#F5A54F}}
/* 7 days in a row (owner 2026-10-14): the count on My Bets */
.diar{display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:14px}
.diar .drow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.diar .drow small{color:var(--muted);font-size:12px}
.diar .dots{display:flex;gap:6px;flex:none}
.diar .dots i{width:12px;height:12px;border-radius:50%;background:var(--line)}
.diar .dots i.on{background:var(--accent)}
.diar.paid{border-color:var(--accent);background:var(--soft)}
/* Squares (owner 2026-10-18) */
.sqkick{color:#FFD76A;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:-8px}
.sqprz{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.sqprz div{background:rgba(255,255,255,.12);border-radius:8px;padding:6px;text-align:center}.sqprz small{display:block;font-size:10px;opacity:.85;text-transform:uppercase;letter-spacing:.06em}.sqprz b{font-family:var(--mono);font-size:15px;color:#FFD76A}
.card.sqrow{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:10px;text-align:left;text-decoration:none;color:var(--ink)}.sqrow small{display:block;color:var(--muted);font-size:12px}.sqgo{font-weight:800;color:var(--accent)}
.sqcard{display:flex;flex-direction:column;gap:6px;padding:10px}
.sqaway{text-align:center;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-left:36px}
.sqwrap{display:flex;align-items:stretch;gap:4px}
.sqhome{writing-mode:vertical-rl;transform:rotate(180deg);text-align:center;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);width:14px;flex:none}
.sqgrid{border-collapse:collapse;table-layout:fixed;width:100%;font-size:10px}
.sqgrid th{font-family:var(--mono);font-size:13px;font-weight:800;color:var(--accent);height:24px;text-align:center}
.sqgrid thead th:first-child,.sqgrid tbody th{width:20px}
.sqgrid td{border:1px solid var(--line);height:34px;padding:0;text-align:center;vertical-align:middle;position:relative;overflow:hidden;line-height:1.1}
.sqgrid td.taken{background:var(--bg);color:var(--muted)}
.sqgrid td.mine{background:#FFF1C2;color:#7a5600;font-weight:800}
.sqgrid td.won{background:#0f5c43;color:#fff;font-weight:800}
.sqgrid td i{display:block;font-style:normal;font-size:9px;font-weight:900;color:#FFD76A}
.sqgrid td span{display:block;overflow:hidden;white-space:nowrap;text-overflow:clip;padding:0 1px}
.sqgrid td label{display:block;width:100%;height:34px;cursor:pointer}
.sqgrid td label input{position:absolute;opacity:0;pointer-events:none}
.sqgrid td.free:hover{background:#e7f4ee}
.sqgrid td.pick{background:#34C08A}
.sqgrid td.pick label::after{content:'✓';color:#fff;font-size:16px;font-weight:900;line-height:34px}
.sqgrid td:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:-2px}
.card.sqwin{display:flex;flex-direction:row;gap:8px;align-items:center;background:#FFF1C2;border-color:#F2C94C;color:#7a5600;font-size:14px}
.sqbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
@media (min-width:700px){.sqgrid td,.sqgrid td label{height:44px}.sqgrid td.pick label::after{line-height:44px}.sqgrid{font-size:11px}}

/* Consensus: today's started games stay until 12:01 AM (owner 2026-10-18) */
.csst{display:inline-block;font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:1px 6px;background:#e7f4ee;color:#0f5c43}.csst.fin{background:var(--bg);color:var(--muted)}
.csscore{display:block;font-family:var(--mono);font-weight:700;color:var(--ink);white-space:nowrap}.csscore>span{display:block}
