:root{--bg:#071422;--panel:#0c1d30;--panel2:#102740;--line:#1d3a5a;--ink:#e8f1fb;--muted:#8aa4bd;--brand:#33d6ff;--win:#3cf0a6;--loss:#ff5c7a;--push:#ffc857;--r:12px;
  --font:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;--cond:"Barlow Condensed","Arial Narrow",sans-serif;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0}body{background:radial-gradient(1200px 600px at 20% -10%,#0f2c4a 0,transparent 60%),var(--bg);color:var(--ink);font:15px/1.45 var(--font);min-height:100vh;min-height:100dvh}
button,input{font:inherit;color:inherit}a{color:var(--brand)}
.muted{color:var(--muted)}.small{font-size:12.5px}.center{text-align:center}.pad{padding:10px 4px}.fine{color:var(--muted);font-size:12px;margin:12px 0 0}
.btn{border:1px solid var(--line);background:var(--panel2);border-radius:10px;padding:10px 16px;cursor:pointer;font-weight:600}
.btn.primary{background:var(--brand);color:#02121e;border-color:transparent}.btn.wide{width:100%;margin-top:10px}.btn.small{padding:4px 10px;font-size:12.5px}
.link{border:0;background:none;color:var(--brand);cursor:pointer;padding:0;text-decoration:underline}
body.busy{cursor:progress}body.busy .btn.primary{opacity:.6;pointer-events:none}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}
/* auth */
.auth{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:20px}.auth-card{width:min(420px,100%)}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:16px}.brand h1{margin:0;font:700 34px/1 var(--cond);letter-spacing:.5px}.brand p{margin:4px 0 0}.logo{font-size:40px}
form label{display:block;font-size:13px;color:var(--muted);margin:10px 0 0}form input{display:block;width:100%;margin-top:4px;padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:#06111e}
form input:focus{outline:2px solid var(--brand);outline-offset:1px}.err{color:var(--loss);min-height:1.2em;margin:8px 0 0;font-size:13.5px}
.seg{display:flex;background:#06111e;border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px}.seg button{flex:1;border:0;background:none;padding:8px;border-radius:8px;cursor:pointer;color:var(--muted);font-weight:600}
.seg button[aria-selected=true],.seg button[aria-pressed=true]{background:var(--panel2);color:var(--ink)}.seg.small button{padding:6px 10px;font-size:13px}.seg.center{max-width:320px;margin:0 auto 12px}
/* shell */
.top{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:rgba(7,20,34,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.brand-s{color:var(--ink);text-decoration:none;font:700 22px/1 var(--cond);letter-spacing:.4px}.top .who{color:var(--muted);font-size:13px}
.tabs{position:fixed;bottom:0;left:0;right:0;z-index:5;display:grid;grid-template-columns:repeat(4,1fr);background:rgba(10,24,40,.97);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
.tabs a{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--muted);text-decoration:none;font-size:11.5px;font-weight:600;padding:6px;border-radius:10px}.tabs a span{font-size:18px}
.tabs a[aria-current=page]{color:var(--ink);background:var(--panel2)}
.view{max-width:760px;margin:0 auto;padding:12px 14px 96px}
@media(min-width:900px){.tabs{position:sticky;top:53px;bottom:auto;max-width:760px;margin:0 auto;border:1px solid var(--line);border-radius:12px;margin-top:10px}.view{padding-bottom:40px}}
/* matches */
.days{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}.days::-webkit-scrollbar{display:none}
.chip{flex:none;border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:6px 12px;cursor:pointer;font-weight:600;font-size:13px;color:var(--muted)}.chip[aria-pressed=true]{background:var(--brand);color:#02121e;border-color:transparent}
.tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}.tools .seg{flex:1;min-width:250px}.tools input{flex:1;min-width:160px;padding:8px 12px;border-radius:10px;border:1px solid var(--line);background:#06111e}
.league{margin-top:14px}.league h3{display:flex;justify-content:space-between;margin:0 2px 6px;font:600 13px/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.league h3 span{opacity:.7}
.match{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:6px;cursor:pointer}
.match:hover{border-color:#2d5b88}.mt{display:flex;flex-direction:column;gap:2px;font-size:12px}.ko{font:700 18px/1 var(--cond)}.sc{font:700 20px/1 var(--cond)}
.live{color:var(--loss);font-weight:700}.live::before{content:"● ";animation:p 1.4s infinite}@keyframes p{50%{opacity:.3}}.ft{color:var(--muted);font-weight:600}.lock{color:var(--muted)}.lock.closed{opacity:.7}
.teams{display:flex;flex-direction:column;min-width:0}.teams b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;min-width:104px}
.pbar{display:flex;height:6px;width:104px;border-radius:4px;overflow:hidden;gap:2px}.pbar i:nth-child(1){background:#5ab8ff}.pbar i:nth-child(2){background:#8aa4bd}.pbar i:nth-child(3){background:#c08cff}.pbar.big{width:100%;height:8px;margin-top:10px}
.pv{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.mine{font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;background:rgba(51,214,255,.14);color:var(--brand)}.mine.empty{background:none;border:1px dashed var(--line);color:var(--muted);font-weight:600}
.mine.won{background:rgba(60,240,166,.14);color:var(--win)}.mine.lost{background:rgba(255,92,122,.12);color:var(--loss)}
.empty{text-align:center;color:var(--muted);padding:40px 0}
/* sheet */
dialog#sheet{width:min(480px,100vw);max-height:92vh;max-height:92dvh;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--ink);padding:18px;overflow:auto}
dialog#sheet::backdrop{background:rgba(0,0,0,.6)}
@media(max-width:600px){dialog#sheet{margin:auto 0 0;width:100vw;max-width:100vw;border-radius:16px 16px 0 0}}
.x{position:absolute;right:10px;top:8px;border:0;background:none;font-size:26px;color:var(--muted);cursor:pointer}
.sh-teams{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin-top:8px;font-size:17px}.sh-teams b:last-child{text-align:right}.vs{font:700 22px/1 var(--cond);color:var(--muted)}
.stepper-row{display:flex;justify-content:center;align-items:center;gap:14px;margin:18px 0 8px}.dash{font:700 30px/1 var(--cond);color:var(--muted)}
.stepper{display:grid;grid-template-columns:44px 56px 44px;align-items:center;text-align:center}.stepper button{height:44px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);font-size:22px;cursor:pointer}
.stepper output{font:700 40px/1 var(--cond)}.stepper .small{grid-column:1/-1;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:144px}
.joker{display:flex;gap:8px;align-items:center;justify-content:center;margin:8px 0;font-size:14px}.joker input{width:18px;height:18px}
.preview{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0}.preview div{background:#06111e;border:1px solid var(--line);border-radius:10px;padding:8px;text-align:center;font-size:12px}.preview b{display:block;font:700 22px/1.1 var(--cond);color:var(--win)}
.sh-actions{display:flex;gap:8px;justify-content:flex-end}.sh-actions .primary{flex:1}
.mypick{margin:14px 0;padding:12px;border-radius:10px;background:#06111e;border:1px solid var(--line)}.won{color:var(--win)}.lost{color:var(--loss)}
h4{margin:16px 0 8px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.orow{display:grid;grid-template-columns:auto 1fr auto 64px;gap:8px;align-items:center;padding:6px 0;border-top:1px solid var(--line);font-size:14px}.orow .pts{text-align:right;color:var(--muted)}
.av{display:inline-grid;place-items:center;border-radius:50%;background:hsl(var(--h) 55% 30%);color:hsl(var(--h) 90% 85%);font-weight:700;font-size:12px;flex:none}
/* board */
.board{display:flex;flex-direction:column;gap:6px}.brow{display:grid;grid-template-columns:28px auto 1fr auto;gap:10px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.brow.me{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand) inset}.pos{font:700 18px/1 var(--cond);color:var(--muted);text-align:center}.who{display:flex;flex-direction:column;min-width:0}
.tier{font-size:11.5px;font-weight:700;color:var(--c)}.tier.big{font-size:14px;letter-spacing:.06em;text-transform:uppercase}.nums{text-align:right;display:flex;flex-direction:column}.nums b{font:700 22px/1 var(--cond)}
/* me */
.prof{display:flex;gap:16px;align-items:center}.prof h2{margin:0}
.ring{width:96px;height:96px;border-radius:50%;flex:none;display:grid;place-items:center;background:conic-gradient(var(--c) calc(var(--p)*1%),#173250 0)}.ring>div{width:78px;height:78px;border-radius:50%;background:var(--panel);display:grid;place-items:center;align-content:center}
.ring b{font:700 32px/1 var(--cond)}.ring span{font-size:10px;letter-spacing:.14em;color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}.stats div{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px;text-align:center}.stats b{display:block;font:700 22px/1 var(--cond)}.stats span{font-size:11px;color:var(--muted)}
@media(max-width:520px){.stats{grid-template-columns:repeat(2,1fr)}}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px}.badge{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px;opacity:.4;filter:grayscale(1)}.badge.on{opacity:1;filter:none;border-color:#2d5b88}
.badge span{font-size:22px}.badge b{display:block;font-size:13px}.badge small{color:var(--muted);font-size:11px}
.rules{margin:0;padding-left:18px;color:var(--muted);font-size:13.5px}.rules b{color:var(--ink)}.admin{display:flex;flex-direction:column;gap:6px}
#toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom));z-index:20;background:#0f2c4a;border:1px solid var(--brand);border-radius:10px;padding:10px 14px;font-size:14px;max-width:92vw}#toast.bad{border-color:var(--loss)}
@media(max-width:600px){.match{grid-template-columns:62px minmax(0,1fr) auto}.right{min-width:86px}.pbar{width:86px}}
/* groups, admin list, account */
.seg.scroll{max-width:none;overflow-x:auto;scrollbar-width:none}.seg.scroll button{flex:0 0 auto;white-space:nowrap}.center-t{text-align:center;margin:-4px 0 10px}
.groups{display:flex;flex-direction:column;gap:10px}.grow{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:10px}
.grow>div:first-child{display:flex;flex-direction:column;min-width:0}.gact{display:flex;gap:6px}.code{color:var(--ink);letter-spacing:.06em}
form.inline{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}form.inline input,form.inline label{flex:1;min-width:150px;margin-top:0}form.inline .err{flex-basis:100%;margin:0}
form.inline input{padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:#06111e}
.plist{display:flex;flex-direction:column;gap:4px;max-height:320px;overflow:auto}.prow{display:flex;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line)}.prow b{flex:1}.prow.off b{color:var(--loss);text-decoration:line-through}
/* invite link (admin) */
.inv-share{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.inv-link{display:block;padding:8px 10px;border-radius:8px;background:rgba(127,127,127,.12);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:all}
.inv-btns{display:flex;gap:6px;flex-wrap:wrap}

/* referrals (Me) */
.ref .ref-top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.ref-code{display:block;font:700 30px/1.1 var(--cond);letter-spacing:.18em;color:var(--brand)}
.ref-kpi{display:grid;grid-template-columns:repeat(4,minmax(60px,1fr));gap:6px;flex:1;max-width:420px}
.ref-kpi div{background:#06111e;border:1px solid var(--line);border-radius:10px;padding:8px 6px;text-align:center}.ref-kpi b{display:block;font:700 20px/1 var(--cond);font-variant-numeric:tabular-nums}.ref-kpi span{font-size:11px;color:var(--muted)}
.ref .inv-link{display:block;margin:12px 0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ref-lvs{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}.ref-lv{font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:3px 10px}.ref-lv b{color:var(--ink)}.ref-lv i{font-style:normal}
.ref-tree{margin-top:8px;display:grid;gap:4px}
.ref-m{display:flex;align-items:center;gap:8px;padding:6px 8px;margin-left:calc(var(--d) * 16px);border-left:2px solid var(--line);background:#06111e;border-radius:8px}
.ref-m .muted{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ref-pts{font:700 13px/1 var(--cond);color:var(--win);white-space:nowrap}.ref-pts.pend{color:var(--muted);font-weight:600}
@media(max-width:520px){.ref-kpi{grid-template-columns:repeat(2,1fr);max-width:none}}
/* admin sign-up codes */
.codes{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.code-new{display:grid;grid-template-columns:1fr auto auto;gap:6px}.code-new input,.code-new select{min-width:0;padding:8px 10px;border-radius:8px;border:1px solid var(--line,rgba(127,127,127,.3));background:transparent;color:inherit;font:inherit}
.code-list{display:flex;flex-direction:column;gap:8px}.code-row{padding:10px;border-radius:10px;border:1px solid var(--line,rgba(127,127,127,.25));display:flex;flex-direction:column;gap:8px}
.code-row.off,.code-row.full{opacity:.6}.code-top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.code-c{font:600 18px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}.code-st{font-size:11px;font-weight:600;text-transform:uppercase;padding:2px 6px;border-radius:6px;background:rgba(46,160,67,.18);color:#3fb950}
.code-row.off .code-st,.code-row.full .code-st{background:rgba(127,127,127,.18);color:var(--muted)}
@media (max-width:520px){.code-new{grid-template-columns:1fr 1fr}.code-new input{grid-column:1/-1}}
.code-row a.btn{color:inherit;text-decoration:none}
/* admin: locked sign-ins */
.locks{display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:10px;border:1px solid rgba(239,68,68,.45);background:rgba(239,68,68,.07);margin-bottom:10px}
.locks>b{color:#f87171}.lock-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.lock-row span{min-width:0;overflow-wrap:anywhere}.lock-row small{display:block}
.lock-row.rq{padding:8px;border-radius:8px;background:rgba(251,191,36,.1);box-shadow:inset 0 0 0 1px rgba(251,191,36,.4)}.rqb{display:block;font-style:normal;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fbbf24}.lock-row q{display:block;margin:2px 0}
.lx-req{margin-top:8px}.lx-reqok{color:#fde68a!important;margin-top:8px}
.sh-tl{margin-top:16px}

/* iPhone Safari / Android Chrome */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
button,a,[role=button]{touch-action:manipulation}
@media (pointer:coarse){input,select,textarea{font-size:16px!important}}   /* below 16px iOS zooms the page on focus */
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}   /* landscape notch only; 0 elsewhere */
dialog#sheet{padding-bottom:env(safe-area-inset-bottom)}
img{max-width:100%}
/* the client's real-money markets for this match (their board's Lines page) */
.betlines{display:flex;align-items:center;gap:12px;margin:14px 0 0;padding:12px 14px;border-radius:12px;text-decoration:none;color:var(--ink);
  background:linear-gradient(135deg,rgba(51,214,255,.14),rgba(60,240,166,.08));border:1px solid rgba(51,214,255,.45)}
.betlines:hover,.betlines:focus-visible{border-color:var(--brand);outline:none}
.betlines .bl-t{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.betlines b{font-size:15px}.betlines .bl-t span{color:var(--muted);font-size:12.5px}
.betlines .bl-go{font-size:26px;line-height:1;color:var(--brand)}.bl-note{margin-top:6px}
/* back to the client's own board (only for players who came from one) */
.top{gap:10px}.top .brand-s{margin-right:auto}
.toboard{display:inline-flex;align-items:center;gap:4px;min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none;font:600 13px/1 var(--sans,inherit);white-space:nowrap;background:rgba(255,255,255,.04)}
.toboard span{font-size:18px;line-height:1;margin-top:-2px}.toboard:hover,.toboard:focus-visible{border-color:var(--brand);outline:none}
/* money duels (client vs client) */
.duel{margin-top:14px;padding:14px;border:1px solid #6b3fd6;border-radius:12px;background:linear-gradient(160deg,rgba(124,58,237,.16),rgba(12,29,48,.6))}
.duel h4{margin:0 0 4px;font:700 16px/1.2 var(--font)}.du-lead{margin-top:4px}
.du-row{display:grid;grid-template-columns:1.4fr 1fr;gap:10px;margin-top:8px}
.du-row label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--muted)}
.du-row select,.du-row input{padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:#06111e;color:var(--ink);font:inherit;font-size:16px;min-width:0}
.du-free{margin:8px 0 0}.du-mini{font-size:13px;padding:6px 10px;border-radius:8px;background:rgba(124,58,237,.18);margin:4px 0}
.du-how{margin-top:10px;font-size:13px;color:var(--muted)}.du-how summary{cursor:pointer;color:var(--ink);font-weight:600}
.du-rules{margin:8px 0 0;padding-left:18px;line-height:1.5}
.du-top{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;margin-top:12px}.du-top>b{font-size:17px}.du-top>span{color:var(--muted);font-size:14px}.du-top .fine,.du-top .du-how{flex-basis:100%;margin-top:4px}
.du-card{margin-bottom:8px}.du-card p{margin:8px 0 0}.du-m{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.du-ans{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:10px}
.du-card.du-offered{border-color:#6b3fd6}.du-push{color:var(--push)}
.tabs a{position:relative}.tab-n{position:absolute;top:2px;right:calc(50% - 22px);min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--loss);color:#fff;font:700 10.5px/17px system-ui;text-align:center;font-style:normal}
@media(max-width:420px){.du-row{grid-template-columns:1fr}}
/* duel challenge popup (app.mjs duelPop) */
.du-pop{border:1px solid var(--line,#26324a);border-radius:16px;background:var(--panel);color:inherit;padding:18px 18px 14px;width:min(440px,calc(100vw - 24px))}
.du-pop::backdrop{background:rgba(2,5,12,.7)}
.du-pop h2{margin:0 0 10px;font-size:19px}.du-pop p{margin:0 0 10px;line-height:1.45}
.du-short{color:#fca5a5;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);border-radius:9px;padding:8px 10px;font-size:13.5px}
/* finished duel not watched yet: neon glow until tapped (plays the result animation, ui/duelfx.js) */
[data-dfx]{cursor:pointer}
[data-dfxnew]{animation:dfxNeon 1.6s ease-in-out infinite;border-color:#ff3b5c!important}
@keyframes dfxNeon{0%,100%{box-shadow:0 0 0 1px #ff3b5c,0 0 10px 1px rgba(255,59,92,.55),inset 0 0 8px rgba(255,59,92,.25)}50%{box-shadow:0 0 0 2px #ff5c77,0 0 26px 6px rgba(255,59,92,.75),inset 0 0 14px rgba(255,59,92,.35)}}
@media (prefers-reduced-motion:reduce){[data-dfxnew]{animation:none;box-shadow:0 0 0 2px #ff3b5c,0 0 16px 3px rgba(255,59,92,.6)}}
/* ---------- Quick picks: swipe deck (liquid glass) ---------- */
.sw{margin:4px 0 18px;padding:14px 14px 12px;border-radius:26px;position:relative;isolation:isolate;
  background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.03) 45%,rgba(255,255,255,.06));-webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(0,0,0,.25),0 0 0 1px rgba(255,255,255,.08),0 20px 50px -25px rgba(0,0,0,.8)}
.sw-hd{display:flex;align-items:center;gap:10px;font:800 12px var(--font);letter-spacing:.14em;text-transform:uppercase;color:#cfe3f5}
.sw-hd b{display:flex;align-items:center;gap:7px;font:inherit;white-space:nowrap}.sw-hd b i{font-style:normal;color:#b9ff3c}
.sw-hd>span:last-child{margin-left:auto;letter-spacing:.02em;text-transform:none;color:#fff;font-weight:800}
.sw-dots{display:flex;gap:4px;margin-left:auto;min-width:0;overflow:hidden}.sw-dots i{flex:none;width:12px;height:6px;border-radius:3px;background:rgba(255,255,255,.18)}.sw-dots i.on{background:#b9ff3c;box-shadow:0 0 8px rgba(185,255,60,.6)}
.sw-deck{position:relative;height:354px;max-width:460px;margin:14px auto 6px;perspective:900px}.sw-bt{max-width:460px;margin-inline:auto}
.sw-card{position:absolute;inset:0 0 24px;border-radius:26px;padding:16px 16px 14px;display:grid;grid-template-rows:auto 1fr auto auto;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;
  transform-style:preserve-3d;transform-origin:50% 90%;will-change:transform;
  transform:translate3d(0,calc(var(--i) * 12px),0) scale(calc(1 - var(--i) * .05));
  background:linear-gradient(165deg,rgba(255,255,255,.15),rgba(255,255,255,.04) 42%,rgba(255,255,255,.07)),linear-gradient(180deg,#14304b,#0b1d31);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(0,0,0,.3),0 0 0 1px rgba(255,255,255,.14),0 0 calc(var(--gp,0) * 36px) color-mix(in srgb,var(--glow,transparent) calc(var(--gp,0) * 70%),transparent),0 24px 60px -24px rgba(0,0,0,.9)}
.sw-card:not(.top){pointer-events:none;filter:brightness(.72)}.sw-card:not(.top)>*{visibility:hidden}   /* cards behind: only their edges peek out */.sw-card.top:active{cursor:grabbing}
.sw-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(120% 60% at 15% 0,rgba(255,255,255,.22),transparent 55%);mix-blend-mode:screen}
.sw-card header{display:flex;justify-content:space-between;align-items:center;gap:8px;position:relative}
.sw-lg{font-weight:800;font-size:14px;color:#e8f1fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sw-lock{flex:none;padding:5px 11px;border-radius:999px;background:#b9ff3c;color:#0b1a00;font:800 12px var(--font);box-shadow:0 0 14px rgba(185,255,60,.45)}
.sw-vs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;position:relative}
.sw-t{display:grid;justify-items:center;gap:8px;min-width:0;text-align:center}.sw-t b{font-size:15px;line-height:1.2;overflow-wrap:anywhere}
.sw-t img,.sw-ini{width:84px;height:84px;padding:8px;image-rendering:auto;border-radius:50%;object-fit:contain;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.14),rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 22px -8px rgba(0,0,0,.8);-webkit-user-drag:none}
.sw-ini{display:grid;place-items:center;font:900 30px var(--font);color:#fff}
.sw-ko{display:grid;justify-items:center;gap:2px}.sw-ko strong{font:900 30px/1 var(--font);letter-spacing:-.02em;font-variant-numeric:tabular-nums}.sw-ko small{color:var(--muted);font-weight:700}
.sw-mk{display:flex;gap:3px;margin:6px 4px 0;position:relative;font:800 11px var(--font)}.sw-mk span{min-width:34px;text-align:center;padding:4px 0;border-radius:6px;background:rgba(255,255,255,.08);color:#cfe3f5}
.sw-mk span:first-child{background:rgba(60,240,166,.16);color:#9ff5cf}.sw-mk span:last-child{background:rgba(255,107,139,.16);color:#ffb3c3}.sw-mk.none{justify-content:center;color:var(--muted);font-weight:600}
.sw-q{justify-self:center;margin:10px 0 0;padding:7px 16px;border-radius:999px;position:relative;font-weight:800;font-size:14px;background:rgba(0,0,0,.25);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}.sw-q i{font-style:normal;margin-right:6px}
.sw-st{position:absolute;top:44%;padding:8px 16px;border-radius:14px;font:900 22px var(--font);letter-spacing:.02em;opacity:0;pointer-events:none;border:3px solid;background:rgba(0,0,0,.35);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);white-space:nowrap;max-width:78%;overflow:hidden;text-overflow:ellipsis}
.sw-st.h{left:14px;transform:rotate(-12deg);color:#3cf0a6;border-color:#3cf0a6;box-shadow:0 0 22px rgba(60,240,166,.5)}
.sw-st.a{right:14px;transform:rotate(12deg);color:#ff6b8b;border-color:#ff6b8b;box-shadow:0 0 22px rgba(255,107,139,.5)}
.sw-st.d{left:50%;top:auto;bottom:62px;transform:translateX(-50%);color:#ffc857;border-color:#ffc857;box-shadow:0 0 22px rgba(255,200,87,.5)}
.sw-hint{margin:10px 0 8px;text-align:center;color:#9fb6cc;font-size:13px;font-weight:700}.sw-hint span{display:block;font-size:11.5px;font-weight:600;color:var(--muted);margin-top:2px}
.sw-bt{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.sw-bt button{min-width:0;display:grid;justify-items:center;gap:2px;padding:10px 6px;border:0;border-radius:18px;color:#fff;cursor:pointer;font:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.05));-webkit-backdrop-filter:blur(16px) saturate(170%);backdrop-filter:blur(16px) saturate(170%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(0,0,0,.25),0 0 0 1px rgba(255,255,255,.12),0 10px 24px -14px rgba(0,0,0,.9);transition:transform .15s,box-shadow .2s}
.sw-bt button b{font:900 24px/1 var(--font)}.sw-bt button span{font-size:12px;font-weight:800;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sw-bt button:active{transform:scale(.96)}.sw-bt button[data-swb=d] b{color:#ffc857}.sw-bt button[data-swb=h] b{color:#3cf0a6}.sw-bt button[data-swb=a] b{color:#ff6b8b}
.sw-bt button:focus-visible,.sw-card.top:focus-visible,.sw-undo:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.sw-undo{display:block;margin:10px auto 0;padding:7px 16px;border:0;border-radius:999px;cursor:pointer;color:#e8f1fb;font:700 12.5px var(--font);background:rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 0 1px rgba(255,255,255,.1)}
.sw-done{margin:16px 0 4px;text-align:center;font-weight:800;color:#9ff5cf}
@media (max-width:380px){.sw-deck{height:334px}.sw-t img,.sw-ini{width:64px;height:64px}.sw-ko strong{font-size:26px}}
@media (prefers-reduced-motion:reduce){.sw-card{transition:none!important}}
.sw-card.top{animation:swIn .32s cubic-bezier(.2,.9,.25,1.1)}@keyframes swIn{from{transform:translate3d(0,12px,0) scale(.95)}}

/* Quick picks card v2 (2026-10-31): a symmetric face-off — two equal team columns (the time sits exactly in the middle of the card), crests and time
   on one line, names under the crests in a fixed two-line box (a long name never pushes its crest up), market bar fills the width and adds up to 100 %. */
.sw-vs{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:start;column-gap:6px}
.sw-t{grid-template-rows:var(--cr,84px) 2.4em;gap:10px;align-content:start}
.sw-t img,.sw-ini{width:var(--cr,84px);height:var(--cr,84px);max-width:100%;justify-self:center}
.sw-t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;align-self:start}
.sw-ko{height:var(--cr,84px);align-content:center;min-width:0;white-space:nowrap}
.sw-ko strong{font-size:clamp(22px,7.4cqw,30px)}
.sw-card{container-type:inline-size;grid-template-columns:minmax(0,1fr)}
.sw-card>*{min-width:0}
.sw-mk{margin:8px 0 0;gap:4px;font:800 12px/1 var(--font)}
.sw-mk span{min-width:46px;padding:7px 4px;display:flex;justify-content:center;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}
.sw-mk span i{font-style:normal;opacity:.6;font-size:10px}
@media (max-width:380px){.sw-card{--cr:66px}}
.fvm{color:#ffd166;font-style:normal;margin-right:4px;text-shadow:0 0 8px rgba(255,209,102,.5)}