/* ════════════════════════════════════════════════════════════════════
   VANTIQ · 1W DESIGN SYSTEM
   A faithful reconstruction of the 1win visual language, wired onto the
   real app's existing component classes. Loaded last — authoritative.
   Dark canvas · fixed left rail · top pill nav · vivid tiles · green CTA.
   ════════════════════════════════════════════════════════════════════ */

:root,[data-theme="dark"]{
  --shell-max:1680px; --feed-max:none; --side-w:264px; --slip-w:340px;
  --bg:#0D0D0F; --bg-elev:#141418; --rail:#111115; --topbar:#0F0F13;
  --card:#17171C; --card-2:#1C1C22; --card-3:#232329;
  --line:rgba(255,255,255,.06); --line-2:rgba(255,255,255,.10);
  --txt:#FFFFFF; --txt-2:#9A9AA6; --txt-3:#6C6C78; --txt-4:#4A4A54;
  --grn:#1BD15E; --grn-2:#15B84F; --grn-ink:#04140A; --grn-soft:rgba(27,209,94,.14);
  --blu:#2F80ED; --blu-2:#2563EB; --blu-soft:rgba(47,128,237,.14);
  --amber:#F5A524; --red:#F0384B; --red-soft:rgba(240,56,75,.14);
  --purple:#8B5CF6; --pink:#EC4899;
  --r-s:8px; --r-m:12px; --r-l:16px; --r-xl:20px; --r-pill:999px;
  --sb-w:264px; --dock-w:340px; --topbar-h:64px;
  --f:'Onest','Inter',system-ui,-apple-system,sans-serif;
  --shadow:0 8px 30px -12px rgba(0,0,0,.6);
}

/* light theme — coherent light counterpart (1win is dark-first) */
:root[data-theme="light"]{
  --bg:#F4F5F8; --bg-elev:#FFFFFF; --rail:#FFFFFF; --topbar:#FFFFFF;
  --card:#FFFFFF; --card-2:#F1F2F6; --card-3:#E9EBF1;
  --line:rgba(16,18,27,.08); --line-2:rgba(16,18,27,.14);
  --txt:#12131A; --txt-2:#5B5E6B; --txt-3:#8A8D99; --txt-4:#B4B7C2;
  --shadow:0 8px 30px -14px rgba(20,25,50,.2);
}
:root[data-theme="light"] .tb-nav-item.active,
:root[data-theme="light"] .chip.on,
:root[data-theme="light"] .list-tab.on{background:#12131A!important;color:#fff!important;}
:root[data-theme="light"] html,:root[data-theme="light"] body{color:var(--txt)!important;}

/* ── light mode · HERO FIX ──────────────────────────────────────────
   apex.css paints a white "paper" background on `[class*="hero"]`, a
   wildcard that hits every hero-* element and whitewashed the banner
   (invisible title, blank CTA). The banners are art-directed dark scenes
   and must stay dark in BOTH themes — so neutralise that here. */
/* strip apex's white-paper wildcard off the hero's art + text layers
   (an explicit list — never the colour-carrying eyebrow / cta / boost)… */
:root[data-theme="light"] .hero,
:root[data-theme="light"] .hero-track,
:root[data-theme="light"] .hero-art,
:root[data-theme="light"] .hero-svg,
:root[data-theme="light"] .hero-media,
:root[data-theme="light"] .hero-content,
:root[data-theme="light"] .hero-row,
:root[data-theme="light"] .hero-sub,
:root[data-theme="light"] .hero-title,
:root[data-theme="light"] .hero-dots{background:none!important;}
/* …keep the card itself on its art-directed dark gradient… */
:root[data-theme="light"] .hero-card{background:#0b100e!important;}
:root[data-theme="light"] .hero-card.h1{background:linear-gradient(115deg,#0a2015 0%,#080d0b 58%)!important;}
:root[data-theme="light"] .hero-card.h2{background:linear-gradient(115deg,#0d1c10 0%,#080c08 58%)!important;}
:root[data-theme="light"] .hero-card.h3{background:linear-gradient(115deg,#0c1529 0%,#080b14 58%)!important;}
:root[data-theme="light"] .hero-card::before{background:none!important;content:none!important;}
/* …and restore the pieces that carry their own colour. */
:root[data-theme="light"] .hero-title{color:#fff!important;}
:root[data-theme="light"] .hero-sub{color:rgba(255,255,255,.72)!important;}
:root[data-theme="light"] .hero-eyebrow{background:var(--grn-soft)!important;color:var(--grn)!important;}
:root[data-theme="light"] .hero-card.h3 .hero-eyebrow{background:var(--blu-soft)!important;color:#7aa0ff!important;}
:root[data-theme="light"] .hero-cta{background:linear-gradient(180deg,var(--grn),var(--grn-2))!important;color:#fff!important;}
:root[data-theme="light"] .hero-card.h3 .hero-cta{background:linear-gradient(180deg,var(--blu),var(--blu-2))!important;}
:root[data-theme="light"] .hero-boost{color:#fff!important;background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.14)!important;}

/* ── global type & canvas ── */
html,body{background:var(--bg)!important;color:var(--txt)!important;
  font-family:var(--f)!important;-webkit-font-smoothing:antialiased;}
body,button,input,select,textarea{font-family:var(--f)!important;}
*{box-sizing:border-box;}
h1,h2,h3,h4,.sec-title,.page-title,.screen-title{font-family:var(--f)!important;
  font-weight:700!important;letter-spacing:-.01em!important;color:var(--txt)!important;}
a{color:inherit;}

/* ════════════ LAYOUT SHELL ════════════ */
.scroll{background:var(--bg)!important;}
.rail{display:grid!important;grid-template-columns:var(--sb-w) minmax(0,1fr)!important;
  gap:0!important;max-width:1680px!important;margin:0 auto!important;align-items:start!important;}
.rail.has-dock{grid-template-columns:var(--sb-w) minmax(0,1fr) var(--dock-w)!important;}
.feed{padding:20px 24px 80px!important;min-width:0!important;max-width:none!important;}

/* ════════════ TOP BAR ════════════ */
.topbar{background:var(--topbar)!important;border-bottom:1px solid var(--line)!important;
  position:sticky;top:0;z-index:300;height:var(--topbar-h)!important;}
.topbar::after{display:none!important;}
.tb-inner{max-width:1680px;margin:0 auto;height:var(--topbar-h);display:flex!important;
  align-items:center!important;gap:16px;padding:0 20px!important;}
.tb-row{display:flex;align-items:center;gap:14px;flex:1;min-width:0;}
.brand{display:flex;align-items:center;gap:10px!important;width:calc(var(--sb-w) - 20px);flex-shrink:0;cursor:pointer;}
.brand::before,.auth-brand::before{display:none!important;content:none!important;}
.brand-mark{display:inline-block!important;width:34px!important;height:34px!important;flex-shrink:0;
  filter:drop-shadow(0 4px 12px rgba(22,201,95,.35));}
.brand-mark.lg{width:46px!important;height:46px!important;filter:none;}
.brand-word{font-family:var(--f)!important;font-weight:800!important;font-size:25px!important;
  letter-spacing:-.03em!important;color:var(--txt)!important;text-transform:uppercase;font-style:normal!important;}
.brand-word b{color:var(--grn)!important;}

/* center pill nav */
.tb-nav{display:flex!important;align-items:center;gap:6px;background:var(--card)!important;
  border-radius:var(--r-pill)!important;padding:5px!important;margin:0 auto;border:1px solid var(--line);}
.tb-nav-item{display:inline-flex!important;align-items:center;gap:8px;height:40px;padding:0 20px!important;
  border-radius:var(--r-pill)!important;font-weight:600!important;font-size:15px!important;
  color:var(--txt-2)!important;background:transparent!important;border:0!important;cursor:pointer;
  transition:.16s;white-space:nowrap;}
.tb-nav-item:hover{color:var(--txt)!important;background:var(--card-2)!important;}
.tb-nav-item.active{background:#fff!important;color:#0D0D0F!important;}
.tb-nav-item svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.9;}
.tb-nav-item .tb-nav-cnt{background:var(--red);color:#fff;border-radius:var(--r-pill);
  font-size:11px;padding:1px 6px;font-weight:700;}
.tb-nav-item.active .tb-nav-cnt{background:#0D0D0F;color:#fff;}

/* top-right icons + auth */
.tb-icon{width:40px;height:40px;border-radius:var(--r-m)!important;background:var(--card)!important;
  border:1px solid var(--line)!important;color:var(--txt-2)!important;display:inline-flex;
  align-items:center;justify-content:center;cursor:pointer;transition:.15s;}
.tb-icon:hover{color:var(--txt)!important;background:var(--card-2)!important;}
.tb-icon svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.8;}
.guest-row{display:flex;gap:10px;align-items:center;}
.btn-ghost-light{height:42px;padding:0 20px!important;border-radius:var(--r-m)!important;
  background:var(--card)!important;border:1px solid var(--line-2)!important;color:var(--txt)!important;
  font-weight:600!important;font-size:15px;cursor:pointer;transition:.15s;}
.btn-ghost-light:hover{background:var(--card-2)!important;}
.btn-light{height:42px;padding:0 22px!important;border-radius:var(--r-m)!important;
  background:linear-gradient(180deg,var(--grn),var(--grn-2))!important;color:#fff!important;
  font-weight:700!important;font-size:15px;border:0!important;cursor:pointer;transition:.15s;
  box-shadow:0 6px 18px -6px rgba(27,209,94,.5);}
.btn-light:hover{filter:brightness(1.06);}

/* balance pill (signed-in) — display toggled by JS; don't force it on */
.balance-pill{display:flex;align-items:center;gap:12px;}
.bal-block{text-align:right;cursor:pointer;}
.bal-label{font-size:11px;color:var(--txt-3);font-weight:500;}
.bal-amount{font-weight:800;font-size:17px;color:var(--txt);}
.bal-cur{color:var(--txt-2);font-weight:600;font-size:13px;margin-right:2px;}
.bal-deposit{height:42px;padding:0 20px;border-radius:var(--r-m);display:inline-flex;align-items:center;gap:7px;
  background:linear-gradient(180deg,var(--grn),var(--grn-2));color:#fff;font-weight:700;font-size:15px;
  border:0;cursor:pointer;box-shadow:0 6px 18px -6px rgba(27,209,94,.5);transition:.15s;}
.bal-deposit:hover{filter:brightness(1.06);}
.bal-deposit svg{width:18px;height:18px;stroke:currentColor;stroke-width:2.4;}

/* ════════════ LEFT RAIL ════════════ */
.side{background:var(--rail)!important;border-right:1px solid var(--line)!important;
  padding:16px 12px 24px!important;position:sticky;top:var(--topbar-h);
  height:calc(100vh - var(--topbar-h));overflow-y:auto;width:var(--sb-w)!important;}
.side::-webkit-scrollbar{width:6px;}
.side-group{margin-bottom:8px!important;}
.side-label{font-size:11px!important;text-transform:uppercase;letter-spacing:.08em;
  color:var(--txt-3)!important;font-weight:600;padding:12px 12px 6px!important;}
.side-item{display:flex!important;align-items:center;gap:12px!important;width:100%;
  height:46px!important;padding:0 12px!important;border-radius:var(--r-m)!important;
  background:transparent!important;border:0!important;color:var(--txt-2)!important;
  font-weight:600!important;font-size:15px!important;cursor:pointer;transition:.14s;text-align:left;}
.side-item:hover{background:var(--card)!important;color:var(--txt)!important;}
.side-item.active{background:var(--card-2)!important;color:var(--txt)!important;}
.side-item svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.8;flex-shrink:0;color:var(--txt-2);}
.side-item.active svg{color:var(--grn);}
.side-item span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.side-cnt{background:var(--card-3);color:var(--txt-2);font-size:11px;font-weight:700;
  border-radius:var(--r-pill);padding:2px 8px;min-width:20px;text-align:center;}
.side-cnt.new{background:var(--amber);color:#1a1200;}
.side-cnt.hot{background:var(--red);color:#fff;}

/* rail: log-in hero button + free-money card (1win signature) */
.side-login{display:flex;align-items:center;gap:12px;width:100%;height:56px;padding:0 14px;
  border-radius:var(--r-l);background:var(--card);border:1px solid var(--line-2);color:var(--txt);
  font-weight:700;font-size:16px;cursor:pointer;margin-bottom:10px;transition:.15s;}
.side-login:hover{background:var(--card-2);}
.side-login .sl-ava{width:32px;height:32px;border-radius:50%;background:var(--card-3);
  display:grid;place-items:center;}
.side-login .sl-ava svg{width:18px;height:18px;stroke:var(--txt-2);stroke-width:1.8;}
.side-login .sl-chev{margin-left:auto;color:var(--txt-3);}
.side-free{position:relative;border-radius:var(--r-l);overflow:hidden;height:64px;
  margin-bottom:14px;padding:0 16px;display:flex;flex-direction:column;justify-content:center;
  background:linear-gradient(100deg,#0e3b24 0%,#15532f 55%,#1d6b3d 100%);cursor:pointer;}
.side-free b{font-size:16px;font-weight:700;color:#fff;line-height:1.1;}
.side-free .sf-art{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:26px;opacity:.95;}
.side-token{display:flex;align-items:center;gap:12px;width:100%;height:52px;padding:0 12px;
  border-radius:var(--r-m);background:var(--card);border:1px solid var(--line);color:var(--txt);
  font-weight:700;font-size:15px;cursor:pointer;margin-bottom:12px;transition:.15s;}
.side-token:hover{background:var(--card-2);}
.side-token .st-coin{width:28px;height:28px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fde68a,#d4a017);display:grid;place-items:center;
  color:#5a3d00;font-weight:800;font-size:12px;}

/* rail footer: install card + socials + support */
.side-install{margin-top:14px;border-radius:var(--r-l);background:var(--card);border:1px solid var(--line);
  padding:12px;display:flex;align-items:center;gap:10px;cursor:pointer;transition:.15s;}
.side-install:hover{background:var(--card-2);}
.side-install .si-ic{width:36px;height:36px;border-radius:var(--r-s);background:var(--blu);
  display:grid;place-items:center;color:#fff;flex-shrink:0;}
.side-install b{display:block;font-size:13px;font-weight:700;}
.side-install small{color:var(--txt-3);font-size:12px;}
.side-social{display:flex;gap:8px;align-items:center;padding:14px 6px 6px;}
.side-social a,.side-social button{width:34px;height:34px;border-radius:50%;background:var(--card);
  border:1px solid var(--line);display:grid;place-items:center;color:var(--txt-2);cursor:pointer;transition:.15s;}
.side-social a:hover{color:var(--txt);background:var(--card-2);}
.side-support{display:flex;align-items:center;gap:10px;width:100%;height:46px;padding:0 12px;margin-top:6px;
  border-radius:var(--r-m);background:var(--card);border:1px solid var(--line);color:var(--txt);
  font-weight:600;font-size:15px;cursor:pointer;transition:.15s;}
.side-support:hover{background:var(--card-2);}
.side-support .ss-badge{margin-left:auto;background:var(--grn-soft);color:var(--grn);
  font-size:11px;font-weight:700;border-radius:var(--r-pill);padding:2px 8px;}

/* ════════════ SECTION HEADS ════════════ */
.sec-head{display:flex!important;align-items:center;justify-content:space-between;
  margin:24px 0 14px!important;}
.sec-title{display:flex!important;align-items:center;gap:10px;font-size:22px!important;
  font-weight:700!important;color:var(--txt)!important;}
.sec-title::before{display:none!important;}
.sec-title .dot{width:9px;height:9px;border-radius:50%;background:var(--red);
  box-shadow:0 0 10px var(--red);animation:vqpulse 1.4s infinite;}
@keyframes vqpulse{0%,100%{opacity:1}50%{opacity:.4}}
.sec-more{display:inline-flex;align-items:center;gap:4px;background:transparent!important;
  border:0!important;color:var(--txt-2)!important;font-weight:600;font-size:14px;cursor:pointer;}
.sec-more:hover{color:var(--txt)!important;}
.sec-more svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.2;}
.sec-count{color:var(--txt-3);font-size:14px;font-weight:600;}

/* ════════════ BUTTONS (global) ════════════ */
.btn-primary,.btn-place,.btn.primary,button.primary,.btn-cta{
  background:linear-gradient(180deg,var(--grn),var(--grn-2))!important;color:#fff!important;
  font-family:var(--f)!important;font-weight:700!important;border:0!important;border-radius:var(--r-m)!important;
  box-shadow:0 8px 20px -8px rgba(27,209,94,.55)!important;transition:.15s!important;}
.btn-primary:hover,.btn-place:hover{filter:brightness(1.06)!important;}
.btn-blue{background:linear-gradient(180deg,var(--blu),var(--blu-2))!important;color:#fff!important;
  border:0!important;border-radius:var(--r-m)!important;font-weight:700!important;
  box-shadow:0 8px 20px -8px rgba(47,128,237,.5)!important;}
.btn-quiet{background:var(--card)!important;border:1px solid var(--line)!important;color:var(--txt)!important;
  border-radius:var(--r-m)!important;font-weight:600!important;}
.btn-quiet:hover{background:var(--card-2)!important;}

/* ════════════ CHIPS / TABS ════════════ */
.chips{display:flex!important;gap:8px;overflow-x:auto;padding:14px 20px!important;scrollbar-width:none;
  background:var(--topbar)!important;border-bottom:1px solid var(--line)!important;position:sticky;
  top:var(--topbar-h);z-index:100;}
.chips::-webkit-scrollbar{display:none;}
.chips.inline{background:transparent!important;border:0!important;padding:0 0 8px!important;position:static;}
.chip{height:38px;padding:0 16px!important;border-radius:var(--r-pill)!important;background:var(--card)!important;
  border:1px solid var(--line)!important;color:var(--txt-2)!important;font-weight:600!important;font-size:14px;
  white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:.14s;flex-shrink:0;}
.chip:hover{color:var(--txt)!important;background:var(--card-2)!important;}
.chip.on,.chip.active{background:#fff!important;color:#0D0D0F!important;border-color:transparent!important;}

/* list tabs (wallet, my-bets) */
.list-tabs{display:flex;gap:6px;background:var(--card);border-radius:var(--r-pill);padding:5px;
  margin:16px 0;width:fit-content;border:1px solid var(--line);}
.list-tab{height:38px;padding:0 20px;border-radius:var(--r-pill);background:transparent;border:0;
  color:var(--txt-2);font-weight:600;font-size:14px;cursor:pointer;transition:.14s;}
.list-tab:hover{color:var(--txt);}
.list-tab.on,.list-tab.active{background:#fff;color:#0D0D0F;}
.list-tab.on::after,.list-tab.active::after{display:none;}

/* ════════════ HERO BANNERS (art-directed) ════════════ */
.hero{border-radius:0!important;overflow:visible!important;margin-bottom:18px!important;background:none!important;}
.hero-track{display:flex!important;overflow-x:auto!important;scroll-snap-type:x mandatory;
  gap:16px!important;scrollbar-width:none;padding-bottom:2px;}
.hero-track::-webkit-scrollbar{display:none;}
.hero-card{flex:0 0 100%!important;max-width:none!important;scroll-snap-align:start;position:relative!important;
  height:206px!important;min-height:206px!important;border-radius:var(--r-l)!important;overflow:hidden!important;
  border:1px solid var(--line)!important;display:block!important;padding:0!important;--hc:#0a0f0d;
  background:#0b100e!important;box-shadow:0 16px 40px -26px rgba(0,0,0,.65);}
.hero-card.h1{background:linear-gradient(115deg,#0a2015 0%,#080d0b 58%)!important;--hc:#0a1611;}
.hero-card.h2{background:linear-gradient(115deg,#0d1c10 0%,#080c08 58%)!important;--hc:#0a130c;}
.hero-card.h3{background:linear-gradient(115deg,#0c1529 0%,#080b14 58%)!important;--hc:#0a0e18;}
/* art is confined to the right zone — it can never sit under the copy */
.hero-art{position:absolute!important;top:0;right:0;left:auto!important;bottom:0;width:60%!important;height:100%!important;z-index:1;
  background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;}
.hero-art .hero-svg{width:100%;height:100%;display:block;}
.hero-card::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,var(--hc) 0%,var(--hc) 38%,transparent 60%);}
.hero-content{position:absolute!important;left:0;top:0;bottom:0;z-index:3;display:flex;flex-direction:column;
  align-items:flex-start!important;justify-content:center;padding:0 30px!important;width:52%!important;}
.hero-eyebrow,.hero-row{align-self:flex-start!important;}
.hero-eyebrow{display:inline-flex!important;align-items:center;gap:6px;height:24px;padding:0 11px;border-radius:var(--r-pill);
  background:var(--grn-soft)!important;color:var(--grn);font-weight:700;font-size:11px;letter-spacing:.05em;
  text-transform:uppercase;margin-bottom:12px;width:auto!important;}
.hero-card.h3 .hero-eyebrow{background:var(--blu-soft)!important;color:#7aa0ff;}
.hero-title{font-size:24px!important;font-weight:800!important;line-height:1.1!important;
  letter-spacing:-.02em!important;color:#fff!important;margin:0 0 8px!important;background:none!important;}
.hero-sub{color:var(--txt-2)!important;font-size:14px!important;line-height:1.4;margin:0 0 16px!important;background:none!important;}
.hero-row{display:flex;align-items:center;gap:12px;background:none!important;}
.hero-cta{height:42px;padding:0 22px!important;border-radius:var(--r-m)!important;border:0!important;cursor:pointer;
  background:linear-gradient(180deg,var(--grn),var(--grn-2))!important;color:#fff!important;
  font-weight:700!important;font-size:14.5px!important;box-shadow:0 10px 24px -10px rgba(27,209,94,.6);transition:.15s;}
.hero-card.h3 .hero-cta{background:linear-gradient(180deg,var(--blu),var(--blu-2))!important;
  box-shadow:0 10px 24px -10px rgba(47,128,237,.55);}
.hero-cta:hover{filter:brightness(1.07);transform:translateY(-1px);}
.hero-boost{font-weight:700;font-size:13.5px;color:#fff;background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(255,255,255,.14)!important;border-radius:var(--r-pill)!important;padding:6px 13px;}
.hero-content h2,.hero-content p{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;}
.hero-dots{display:flex;gap:7px;justify-content:center;margin-top:12px;}
.hero-dots i{width:7px;height:7px;border-radius:50%;background:var(--line-2);transition:.2s;cursor:pointer;}
.hero-dots i.on{width:22px;border-radius:4px;background:var(--grn);}
.fh-card{border-radius:var(--r-l)!important;}
@media (max-width:720px){
  .hero-card{height:150px!important;min-height:150px!important;border-radius:var(--r-m)!important;}
  .hero-art{width:52%!important;}
  .hero-content{width:62%!important;padding:0 18px!important;}
  .hero-card::after{background:linear-gradient(90deg,var(--hc) 0%,var(--hc) 52%,rgba(0,0,0,.25) 68%,transparent 84%)!important;}
  .hero-eyebrow{margin-bottom:9px;height:22px;font-size:10px;}
  .hero-title{font-size:17px!important;line-height:1.12!important;margin-bottom:10px!important;}
  .hero-sub{display:none!important;}
  .hero-cta{height:36px;padding:0 16px!important;font-size:13px!important;}
  .hero-boost{padding:5px 10px;font-size:12px;}
}

/* ════════════ mobile bottom nav ════════════ */
.bottomnav{background:var(--bg-elev)!important;border-top:1px solid var(--line)!important;}
.nav-item{color:var(--txt-3)!important;}
.nav-item.active,.nav-item.on{color:var(--grn)!important;}
.nav-item.active svg,.nav-item.on svg{filter:none!important;}
.nav-item.active::after{background:var(--grn)!important;box-shadow:none!important;}

/* ════════════ scrollbars / selection ════════════ */
*{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;}
*::-webkit-scrollbar{width:8px;height:8px;}
*::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:8px;}
::selection{background:var(--grn-soft);color:#fff;}
:focus-visible{outline:2px solid var(--grn);outline-offset:2px;}

/* ════════════ MATCH / EVENT CARDS (1win sportsbook) ════════════ */
.match-card,[class*="match-card"]{background:var(--card)!important;border:1px solid var(--line)!important;
  border-radius:var(--r-l)!important;padding:14px 16px!important;margin-bottom:10px!important;transition:.15s;}
.match-card:hover{border-color:var(--line-2)!important;background:var(--card-2)!important;}
.mc-top{display:flex!important;align-items:center;gap:8px;margin-bottom:10px!important;
  color:var(--txt-3)!important;font-size:13px!important;}
.mc-league{color:var(--txt-3)!important;font-weight:600!important;font-size:13px!important;}
.mc-flag{width:18px;height:18px;border-radius:4px;}
.mc-time{margin-left:auto!important;color:var(--txt-3)!important;font-size:13px!important;font-weight:600;}
.mc-live{color:var(--red)!important;font-weight:700!important;display:inline-flex;align-items:center;gap:5px;}
.mc-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red);animation:vqpulse 1.3s infinite;}
.mc-teams{display:flex!important;flex-direction:column;gap:8px!important;}
.mc-team{display:flex!important;align-items:center;gap:10px!important;color:var(--txt)!important;
  font-weight:600!important;font-size:15px!important;}
.mc-crest{width:24px;height:24px;border-radius:50%;flex-shrink:0;}
.mc-score{color:var(--grn)!important;font-weight:800!important;margin-left:auto;}
.odds-row{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important;margin-top:12px!important;}
.odds-btn,.odd,.sel{background:var(--card-3)!important;border:1px solid var(--line)!important;
  border-radius:var(--r-s)!important;padding:10px 8px!important;cursor:pointer;transition:.14s!important;
  display:flex!important;flex-direction:column;align-items:center;gap:3px;min-height:52px;justify-content:center;}
.odds-btn:hover,.odd:hover{background:var(--card-2)!important;border-color:var(--grn)!important;}
.odds-btn .lbl,.odds-btn small,.odd small{color:var(--txt-3)!important;font-size:11px!important;font-weight:600;}
.odds-btn .val,.odds-btn b,.odd b{color:var(--txt)!important;font-weight:800!important;font-size:15px!important;}
.odds-btn.on,.odds-btn.selected,.sel.on{background:linear-gradient(180deg,var(--grn),var(--grn-2))!important;
  border-color:transparent!important;}
.odds-btn.on .val,.odds-btn.on .lbl,.odds-btn.selected b{color:#fff!important;}
.odds-btn.locked,.odds-btn[disabled]{opacity:.4;cursor:not-allowed;}

/* ════════════ BETSLIP DOCK ════════════ */
.dock{background:var(--rail)!important;border-left:1px solid var(--line)!important;
  position:sticky;top:var(--topbar-h);height:calc(100vh - var(--topbar-h));width:var(--dock-w)!important;}
.dock-inner{padding:16px!important;}
.dock-head{display:flex!important;align-items:center;justify-content:space-between;
  background:var(--card)!important;border-radius:var(--r-m) var(--r-m) 0 0;padding:14px 16px!important;
  border:1px solid var(--line);border-bottom:0;}
.dock-title{font-weight:700!important;font-size:17px!important;color:var(--txt)!important;}
.dock-count{background:var(--grn);color:#04140A;font-weight:800;border-radius:var(--r-pill);
  min-width:24px;height:24px;display:grid;place-items:center;font-size:13px;padding:0 7px;}
.dock-body{background:var(--card)!important;border:1px solid var(--line);border-top:0;
  border-radius:0 0 var(--r-m) var(--r-m);padding:18px 16px!important;min-height:300px;}
.slip-empty,.dock-empty{text-align:center;color:var(--txt-3);padding:48px 16px;}
.slip-stub{background:var(--grn)!important;color:#04140A!important;border-radius:var(--r-m)!important;
  font-weight:800!important;}

/* ════════════ GENERIC CARDS / LIST ROWS ════════════ */
.wallet-card,.acct-hero,.detail-hero{background:linear-gradient(160deg,#1a1a20,#121216)!important;
  border:1px solid var(--line)!important;border-radius:var(--r-l)!important;}
.tx-row,.txn-row{background:var(--card)!important;border:1px solid var(--line)!important;
  border-radius:var(--r-m)!important;}
.tx-row:hover,.txn-row:hover{background:var(--card-2)!important;}

/* empty state */
.empty,.empty-state,[class*="empty"]{color:var(--txt-3)!important;}

/* removed per design: the global Live/All sport slab at the very top.
   Live stays reachable from the rail ("Live now") and the mobile bar. */
#sport-tabs-bar{display:none!important;}

/* suppress JS-injected duplicates that collide with the 1win rail */
#eg-stories{display:none!important;}
#left-sidebar .side-item[data-cz],
#left-sidebar .side-item[data-eg]{display:none!important;}

/* responsive */
@media (max-width:1100px){:root{--dock-w:300px;}}
@media (max-width:460px){ .brand-word{display:none!important;} }
@media (max-width:980px){
  .rail,.rail.has-dock{grid-template-columns:1fr!important;}
  .side,.dock{display:none!important;}
  .tb-nav{display:none!important;}
  .feed{padding:14px 14px 92px!important;}
  .topbar{height:58px!important;}
  .tb-inner{gap:8px;padding:0 12px!important;height:58px;}
  .tb-row{gap:8px;}
  .brand{width:auto!important;gap:7px!important;}
  .brand-mark{width:30px!important;height:30px!important;}
  .brand-word{font-size:19px!important;}
  .tb-icon{display:none!important;}              /* search/theme/account live elsewhere on mobile */
  .guest-row{gap:7px;}
  .btn-ghost-light,.btn-light{height:36px;padding:0 13px!important;font-size:13.5px;border-radius:10px!important;white-space:nowrap;}
  .balance-pill{gap:8px;}
  .bal-deposit{height:36px;padding:0 13px;font-size:13.5px;}
  .bal-amount{font-size:15px;}
}

/* ════════════════════════════════════════════════════════════════════
   LEGACY TOKEN REMAP — bring the older components (deposit sheet, booking
   loader, transaction detail, bet cards) onto the VANTIQ palette. They
   read apex.css tokens (--volt was orange, --brass gold, --ink light);
   remapping here, loaded last, re-skins them all in one place.
   ════════════════════════════════════════════════════════════════════ */
:root,[data-theme="dark"]{
  --volt:#1BD15E; --volt-600:#15B84F; --volt-700:#0f9a41; --volt-ink:#04140A;
  --volt-soft:rgba(27,209,94,.14); --volt-border:rgba(27,209,94,.34); --volt-tint:rgba(27,209,94,.08);
  --volt-grad:linear-gradient(135deg,#2BE06E 0%,#1BD15E 50%,#13A94B 100%); --volt-glow:0 10px 30px -10px rgba(27,209,94,.55);
  --brand:#1BD15E; --brand-400:#2BE06E; --brand-500:#1BD15E; --brand-600:#15B84F; --brand-700:#0f9a41;
  --brand-soft:rgba(27,209,94,.14); --brand-border:rgba(27,209,94,.34); --brand-tint:rgba(27,209,94,.08);
  --brass:#E9C56A; --amber:#E9C56A; --gold:#E9C56A;
  --win:#1BD15E; --win-soft:rgba(27,209,94,.14); --win-border:rgba(27,209,94,.3);
  --live:#F0384B; --live-soft:rgba(240,56,75,.14); --live-border:rgba(240,56,75,.3); --live-tint:rgba(240,56,75,.08);
  --info:#2F80ED; --info-soft:rgba(47,128,237,.14);
  --ink:#FFFFFF; --ink-2:#C9C9D2; --ink-3:#9A9AA6; --ink-4:#6C6C78; --ink-5:#4A4A54;
  --paper:#17171C; --paper-2:#1C1C22; --canvas:#0D0D0F; --sunken:#141418; --sunken-2:#1C1C22;
  --line:rgba(255,255,255,.06); --line-2:rgba(255,255,255,.10); --line-3:rgba(255,255,255,.16);
  --sh-1:0 8px 24px -16px rgba(0,0,0,.6); --sh-2:0 16px 40px -22px rgba(0,0,0,.7);
}

/* LIGHT counterpart of the legacy remap — the dark block above is on :root
   (every theme), so without this every legacy component (auth page, deposit,
   booking, bet cards, transaction detail) stayed dark in light mode. This
   maps surfaces/text to light paper while keeping the VANTIQ green identity
   (deepened where it must read as TEXT on white). Specificity (0,2,0) beats
   the :root block, so it wins whenever the theme is light. */
:root[data-theme="light"]{
  --volt:#12B24E; --volt-600:#0FA043; --volt-700:#0C8638; --volt-ink:#FFFFFF;
  --volt-soft:rgba(27,209,94,.12); --volt-border:rgba(18,178,78,.34); --volt-tint:rgba(27,209,94,.07);
  --volt-grad:linear-gradient(135deg,#1BD15E 0%,#15B84F 50%,#12A648 100%); --volt-glow:0 10px 26px -12px rgba(18,178,78,.4);
  --brand:#12B24E; --brand-400:#15B84F; --brand-500:#1BD15E; --brand-600:#15B84F; --brand-700:#0C8638;
  --brand-soft:rgba(27,209,94,.12); --brand-border:rgba(18,178,78,.32); --brand-tint:rgba(27,209,94,.07);
  --brass:#B07A00; --amber:#B07A00; --gold:#B07A00;
  --win:#0E9E54; --win-soft:rgba(14,158,84,.13); --win-border:rgba(14,158,84,.3);
  --live:#E23755; --live-soft:rgba(226,55,85,.11); --live-border:rgba(226,55,85,.26); --live-tint:rgba(226,55,85,.06);
  --info:#2F6FE0; --info-soft:rgba(47,111,224,.12);
  --ink:#111626; --ink-2:#394257; --ink-3:#5C6681; --ink-4:#8690A6; --ink-5:#B2BAC9;
  --paper:#FFFFFF; --paper-2:#F6F8FC; --canvas:#EEF1F6; --sunken:#EDF0F6; --sunken-2:#E6EAF2;
  --line:rgba(16,23,45,.09); --line-2:rgba(16,23,45,.14); --line-3:rgba(16,23,45,.24);
  --sh-1:0 1px 2px rgba(16,24,45,.05),0 3px 10px -5px rgba(16,24,45,.10);
  --sh-2:0 2px 6px rgba(16,24,45,.06),0 18px 40px -22px rgba(16,24,45,.26);
}

/* ── Deposit sheet — premium, on-brand ── */
.dep-sheet{background:var(--card)!important;border:1px solid var(--line)!important;}
.dep-amt{border-radius:var(--r-l)!important;}
.dep-cta.on{background:linear-gradient(180deg,var(--grn),var(--grn-2))!important;color:#fff!important;
  box-shadow:0 14px 30px -12px rgba(27,209,94,.55)!important;}
.dep-reel button,.dep-amt-row button,.dep-spin{border-radius:var(--r-pill)!important;}

/* ── Booking loader — modern, green identity, theme-correct in BOTH modes.
   (The base .bk-board hardcodes color:#fff, so title/sub were invisible on
   the white light card — fixed here along with a cleaner layout.) ── */
.bk-board{background:var(--card)!important;color:var(--txt)!important;border:1px solid var(--line)!important;
  border-radius:24px!important;box-shadow:0 30px 70px -28px rgba(0,0,0,.55)!important;max-width:460px!important;}
@media(min-width:600px){.bk-board{border-radius:24px!important;}}
.bk-rail{border-bottom:1px solid var(--line)!important;}
.bk-rail i{background:var(--line-3)!important;}
.bk-head{padding:20px 22px 0!important;align-items:center!important;}
.bk-badge{background:var(--grn-soft)!important;border:1px solid var(--grn-soft)!important;border-radius:14px!important;
  width:44px!important;height:44px!important;}
.bk-eyebrow{color:var(--grn)!important;font-size:10px!important;letter-spacing:.18em!important;}
.bk-title{color:var(--txt)!important;font-family:'Onest',sans-serif!important;font-size:21px!important;font-weight:800!important;}
.bk-x{background:var(--bg-elev)!important;border:1px solid var(--line)!important;color:var(--txt-2)!important;
  border-radius:10px!important;width:34px!important;height:34px!important;}
.bk-x:hover{background:var(--card-2)!important;color:var(--txt)!important;}
.bk-sub{color:var(--txt-2)!important;padding:10px 22px 0!important;font-size:13px!important;line-height:1.55!important;}
.bk-load-field{padding:20px 22px 0!important;}
.bk-load-inp{background:var(--bg-elev)!important;border:1.5px solid var(--line-2)!important;border-radius:14px!important;
  color:var(--txt)!important;font-family:'Onest',monospace!important;font-size:17px!important;font-weight:700!important;
  letter-spacing:.3em!important;text-align:center!important;text-transform:uppercase!important;height:54px!important;
  caret-color:var(--grn)!important;}
.bk-load-inp::placeholder{color:var(--txt-3)!important;letter-spacing:.14em!important;}
.bk-load-field:focus-within .bk-load-inp,.bk-load-inp:focus{border-color:var(--grn)!important;background:var(--card)!important;box-shadow:0 0 0 3px var(--grn-soft)!important;}
.bk-load-err{padding:0 22px!important;color:var(--live,#F0384B)!important;font-size:12.5px!important;font-weight:600!important;}
.bk-foot{padding:18px 22px 22px!important;display:flex!important;flex-direction:column!important;gap:9px!important;}
.bk-primary{background:linear-gradient(180deg,var(--grn),var(--grn-2))!important;color:#fff!important;border:0!important;
  border-radius:14px!important;height:52px!important;font-weight:700!important;font-size:15px!important;
  box-shadow:0 12px 26px -10px rgba(27,209,94,.5)!important;transition:.15s!important;}
.bk-primary:hover{filter:brightness(1.05)!important;transform:translateY(-1px)!important;}
.bk-secondary{background:transparent!important;border:1px solid var(--line-2)!important;color:var(--txt-2)!important;
  border-radius:14px!important;height:48px!important;font-weight:600!important;}
.bk-secondary:hover{background:var(--card-2)!important;color:var(--txt)!important;}
.bk-rail{opacity:.35!important;}
.bk-load-field{border:0!important;background:none!important;box-shadow:none!important;padding:0!important;}
.bk-badge{filter:grayscale(.2);}
/* deposit: refine disabled CTA + method card */
.dep-cta{border-radius:var(--r-m)!important;}
.dep-who,.dep-method,.dep-ref{border-radius:var(--r-m)!important;}
/* betslip dock: only shows on betting views (navigate() toggles .has-dock);
   prevents the empty dock from wrapping under the feed. */
.rail:not(.has-dock) .dock{display:none!important;}
@media (max-width:980px){.dock{display:none!important;}}
/* ════════════════════════════════════════════════════════════════════
   BETSLIP — "FLOW" · organic redesign (authoritative).
   ════════════════════════════════════════════════════════════════════ */
:root{--bs-r:16px;--bs-grn:#1BD15E;--bs-grn2:#12A64B;}
.slip-stub{position:fixed!important;left:12px;right:12px;bottom:calc(var(--dock-h,62px) + 10px + env(safe-area-inset-bottom));
  z-index:640;display:flex!important;align-items:center;gap:12px;padding:10px 12px!important;border-radius:18px!important;
  background:linear-gradient(135deg,#0F1A14,#0B130F)!important;color:#fff!important;border:1px solid rgba(27,209,94,.28)!important;
  box-shadow:0 18px 40px -16px rgba(0,0,0,.6),0 0 0 1px rgba(27,209,94,.08)!important;
  transform:translateY(140%);opacity:0;pointer-events:none;transition:transform .34s cubic-bezier(.2,.7,.2,1.1),opacity .2s!important;}
.slip-stub.show{transform:none!important;opacity:1!important;pointer-events:auto!important;}
.slip-stub::before{display:none!important;}
.stub-badge{position:relative;width:42px!important;height:42px!important;border-radius:13px!important;flex-shrink:0;display:grid;place-items:center;
  background:linear-gradient(180deg,var(--bs-grn),var(--bs-grn2))!important;box-shadow:0 8px 18px -6px rgba(27,209,94,.6);}
.stub-badge svg{width:19px!important;height:19px!important;stroke:#04140A!important;}
.stub-count{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#fff!important;color:#07130d!important;
  font-size:11px!important;font-weight:800!important;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.4);}
.stub-info{flex:1;min-width:0}
.stub-l1{font-size:11px!important;font-weight:600!important;color:rgba(255,255,255,.6)!important;letter-spacing:.01em}
.stub-l2{font-family:var(--f,'Onest')!important;font-weight:800!important;font-size:16px!important;color:#fff!important;letter-spacing:-.01em;margin-top:1px}
.stub-cta{flex-shrink:0;padding:10px 18px!important;border-radius:12px!important;background:linear-gradient(180deg,var(--bs-grn),var(--bs-grn2))!important;
  color:#04140A!important;font-weight:800!important;font-size:13.5px!important;box-shadow:0 10px 22px -8px rgba(27,209,94,.55)!important;}
.dock{background:var(--bg,var(--rail))!important;border-left:1px solid var(--line)!important;}
.dock-inner{padding:14px!important;}
.dock-head{display:flex!important;align-items:center;gap:9px;margin-bottom:12px!important;padding:2px 2px 0!important;border:0!important;}
.dock-head::before{content:"";width:4px;height:17px;border-radius:3px;background:linear-gradient(180deg,var(--bs-grn),var(--bs-grn2))}
.dock-title{font-weight:800!important;font-size:16px!important;color:var(--txt)!important;letter-spacing:-.02em}
.dock-count{margin-left:auto;background:var(--grn-soft,rgba(27,209,94,.14))!important;color:var(--grn)!important;font-weight:800!important;border-radius:999px!important;
  min-width:22px;height:22px;display:grid;place-items:center;font-size:12px;padding:0 7px;}
.dock-body{background:var(--card)!important;border:1px solid var(--line)!important;border-radius:var(--bs-r)!important;overflow:hidden;}
.overlay#ov-slip .sheet,#slip-sheet{border-radius:26px 26px 0 0!important;background:var(--paper,var(--card))!important;border:1px solid var(--line)!important;border-bottom:none!important;}
.sheet-grip{width:42px!important;height:4px!important;border-radius:999px!important;background:var(--line-3,var(--line-2))!important;margin:10px auto 0!important;}
.sheet-head{display:flex!important;align-items:center;justify-content:space-between;padding:14px 20px 4px!important;border:0!important;}
.sheet-title{font-weight:800!important;font-size:19px!important;letter-spacing:-.02em;color:var(--ink,var(--txt))!important;}
.sheet-title::before{content:"🎟 ";filter:grayscale(.1)}
.sheet-close{width:34px!important;height:34px!important;border-radius:11px!important;background:var(--sunken)!important;border:1px solid var(--line)!important;display:grid;place-items:center;}
.sheet-close svg{stroke:var(--ink-3,var(--txt-2))!important;}
.slip-type{display:flex!important;gap:5px!important;margin:12px 18px 0!important;padding:4px!important;border-radius:13px!important;background:var(--sunken)!important;border:1px solid var(--line)!important;}
.slip-type button{flex:1;border-radius:10px!important;padding:9px 0!important;font-weight:700!important;font-size:13.5px!important;background:transparent!important;border:0!important;color:var(--ink-3,var(--txt-2))!important;transition:.14s;}
.slip-type button.on{background:var(--paper,var(--card))!important;color:var(--ink,var(--txt))!important;border:1px solid var(--line)!important;box-shadow:0 2px 8px -4px rgba(0,0,0,.3)!important;}
.slip-list{padding:14px 18px 2px!important;display:flex;flex-direction:column;gap:9px;}
.slip-row{position:relative;display:flex!important;align-items:stretch;gap:0!important;padding:0!important;border:0!important;background:var(--sunken,var(--card-2))!important;border-radius:14px!important;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line);}
.slip-row.closed{opacity:.55}
.slip-row .idx{display:none!important;}
.slip-row::before{content:"";width:4px;flex-shrink:0;background:linear-gradient(180deg,var(--bs-grn),var(--bs-grn2));}
.slip-row.closed::before{background:var(--ink-4,var(--txt-3))}
.slip-row .body{flex:1;min-width:0;padding:11px 4px 11px 13px!important;}
.slip-row .pick{font-weight:800!important;font-size:14px!important;color:var(--ink,var(--txt))!important;letter-spacing:-.01em;line-height:1.2;}
.slip-row .mkt{font-size:11px!important;color:var(--grn)!important;font-weight:700!important;margin-top:3px;text-transform:none!important;letter-spacing:0!important;}
.slip-row .match{font-size:11.5px!important;color:var(--ink-4,var(--txt-3))!important;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.slip-row .row-tag{display:inline-block;margin-top:5px;font-size:9px!important;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--live,var(--red));background:var(--live-soft,rgba(240,56,75,.14));padding:2px 7px;border-radius:6px;}
.slip-row .odd{display:flex;align-items:center;font-family:var(--f-mono,monospace)!important;font-weight:800!important;font-size:15px!important;color:var(--ink,var(--txt))!important;padding:0 10px!important;}
.slip-row .x{width:34px!important;flex-shrink:0;border:0!important;border-left:1px solid var(--line)!important;background:transparent!important;display:grid;place-items:center;transition:.14s;}
.slip-row .x:hover{background:var(--live-soft,rgba(240,56,75,.12))!important;}
.slip-row .x svg{width:13px!important;height:13px!important;stroke:var(--ink-4,var(--txt-3))!important;}
.slip-row .x:hover svg{stroke:var(--live,var(--red))!important;}
.slip-empty{text-align:center!important;padding:46px 20px!important;color:var(--ink-4,var(--txt-3))!important;}
.slip-empty svg{width:40px!important;height:40px!important;stroke:var(--grn)!important;opacity:.4;margin:0 auto 12px;}
.slip-empty .t{font-weight:800!important;color:var(--ink-2,var(--txt))!important;font-size:15px!important;margin-bottom:4px;}
.stake-box{padding:12px 18px 14px!important;}
.quick-stakes{display:grid!important;grid-template-columns:repeat(4,1fr);gap:7px!important;margin-bottom:11px!important;}
.quick-stakes button{border-radius:11px!important;padding:10px 0!important;font-weight:800!important;font-size:13px!important;background:var(--sunken,var(--card-2))!important;border:1px solid var(--line)!important;color:var(--ink-2,var(--txt-2))!important;transition:.12s;}
.quick-stakes button:hover,.quick-stakes button:active{background:var(--grn-soft,rgba(27,209,94,.14))!important;color:var(--grn)!important;border-color:var(--grn)!important;transform:translateY(-1px);}
.stake-input-wrap{display:flex;align-items:center;gap:8px;border-radius:14px!important;padding:4px 16px!important;height:58px;background:var(--sunken,var(--card-2))!important;border:1.5px solid var(--line-2,var(--line))!important;transition:.15s;}
.stake-input-wrap:focus-within{border-color:var(--grn)!important;background:var(--paper,var(--card))!important;box-shadow:0 0 0 3px var(--grn-soft,rgba(27,209,94,.15))!important;}
.stake-cur{font-weight:800!important;font-size:15px!important;color:var(--ink-4,var(--txt-3))!important;}
.stake-input{flex:1;background:transparent!important;border:0!important;outline:none;font-family:var(--f-mono,monospace)!important;font-size:26px!important;font-weight:800!important;letter-spacing:-.02em;color:var(--ink,var(--txt))!important;text-align:right;min-width:0;}
.slip-summary{margin:0 18px 12px!important;padding:12px 15px!important;border-radius:14px!important;background:var(--sunken,var(--card-2))!important;border:1px solid var(--line)!important;}
.sum-row{display:flex!important;align-items:center;justify-content:space-between;padding:5px 0!important;font-size:13px!important;}
.sum-row .l{color:var(--ink-3,var(--txt-2))!important;font-weight:600!important;}
.sum-row .v{font-family:var(--f-mono,monospace)!important;font-weight:800!important;color:var(--ink-2,var(--txt))!important;}
.sum-row .v.win{color:var(--grn)!important;}
.sum-row.big{padding-top:10px!important;margin-top:6px!important;border-top:1px dashed var(--line-2,var(--line))!important;}
.sum-row.big .l{font-weight:800!important;color:var(--ink,var(--txt))!important;font-size:14px!important;}
.sum-row.big .v{font-size:22px!important;font-weight:800!important;color:var(--grn)!important;letter-spacing:-.02em;}
.slip-actions{display:flex!important;gap:9px!important;padding:0 18px calc(16px + env(safe-area-inset-bottom))!important;}
.btn-clear{width:54px!important;flex-shrink:0;border-radius:14px!important;background:var(--sunken,var(--card-2))!important;border:1px solid var(--line)!important;display:grid;place-items:center;transition:.14s;}
.btn-clear:hover{background:var(--live-soft,rgba(240,56,75,.12))!important;border-color:var(--live,var(--red))!important;}
.btn-clear svg{width:19px!important;height:19px!important;stroke:var(--ink-3,var(--txt-2))!important;}
.btn-clear:hover svg{stroke:var(--live,var(--red))!important;}
.btn-place{flex:1;height:54px!important;border-radius:14px!important;border:0!important;cursor:pointer;background:linear-gradient(180deg,var(--bs-grn),var(--bs-grn2))!important;color:#04140A!important;
  font-weight:800!important;font-size:15px!important;letter-spacing:-.01em;box-shadow:0 14px 30px -10px rgba(27,209,94,.55),inset 0 1px 0 rgba(255,255,255,.35)!important;transition:.16s!important;}
.btn-place:hover{filter:brightness(1.05)!important;transform:translateY(-1px)!important;}
.btn-place:active{transform:translateY(0)!important;}
.dock .slip-actions{padding-bottom:14px!important;}
.book-btn{width:100%;height:46px!important;border-radius:13px!important;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;
  background:var(--grn-soft,rgba(27,209,94,.12))!important;border:1px solid var(--grn-border,rgba(27,209,94,.32))!important;color:var(--grn)!important;font-weight:700!important;font-size:13.5px!important;letter-spacing:-.01em;transition:.15s!important;}
.book-btn:hover{background:var(--grn)!important;color:#04140A!important;border-color:var(--grn)!important;transform:translateY(-1px)!important;box-shadow:0 10px 22px -10px rgba(27,209,94,.5)!important;}

/* ════════════════════════════════════════════════════════════════════
   LIGHT-THEME AUDIT · premium DARK surfaces that must stay dark in both
   modes (their text is light). The apex [class*="hero"] wildcard used to
   whitewash these; it is now narrowed, and these rules make the intent
   explicit + add a subtle brand glow.  (authoritative — end of file)
   ════════════════════════════════════════════════════════════════════ */
.detail-hero,.acct-hero{
  /* re-pin the dark-surface colour tokens locally, so EVERY descendant that
     uses --ink / --txt (team names, phone, score, league…) stays light on
     the dark panel — in light mode too. One rule, no per-child chasing. */
  --ink:#FFFFFF;--ink-2:#D6D9E2;--ink-3:#A6ABBA;--ink-4:#8A90A2;--ink-5:#5E6478;
  --txt:#FFFFFF;--txt-2:rgba(255,255,255,.7);--txt-3:rgba(255,255,255,.5);
  --paper:#171920;--card:#171920;--sunken:#0e0f14;
  background:
    radial-gradient(130% 150% at 100% 0%, rgba(27,209,94,.12) 0%, transparent 52%),
    linear-gradient(160deg,#1b1d24 0%,#121318 100%)!important;
  border:1px solid rgba(255,255,255,.07)!important;
}
.detail-hero .detail-tname,.detail-hero .detail-score,.acct-hero .acct-name{color:#fff!important;}
.detail-hero .ended-badge{background:rgba(255,255,255,.08)!important;color:rgba(255,255,255,.75)!important;}

/* ── Booking-code board: premium dark "boarding pass" in BOTH themes.
   (vanta earlier turned it white in light mode, but the manifest + totals
   text is hardcoded white → invisible. Pin it dark; re-light the few
   token-driven bits.) ── */
[data-theme="light"] .bk-board{
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(27,209,94,.16) 0%, transparent 60%),
    linear-gradient(170deg,#142742 0%,#0F1B2D 45%,#0A1322 100%)!important;
  color:#fff!important;border:1px solid rgba(255,255,255,.08)!important;
}
[data-theme="light"] .bk-title{color:#fff!important;}
[data-theme="light"] .bk-sub{color:rgba(255,255,255,.72)!important;}
[data-theme="light"] .bk-x{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.16)!important;color:rgba(255,255,255,.72)!important;}
[data-theme="light"] .bk-x:hover{background:rgba(255,255,255,.14)!important;color:#fff!important;}
[data-theme="light"] .bk-rail{border-bottom-color:rgba(255,255,255,.1)!important;}
[data-theme="light"] .bk-rail i{background:rgba(255,255,255,.18)!important;}
[data-theme="light"] .bk-manifest{border-top-color:rgba(255,255,255,.1)!important;}
[data-theme="light"] .bk-mani-head{color:rgba(255,255,255,.5)!important;}
[data-theme="light"] .bk-row{border-bottom-color:rgba(255,255,255,.07)!important;}
[data-theme="light"] .bk-totals{border-top-color:rgba(255,255,255,.1)!important;background:rgba(255,255,255,.03)!important;}
[data-theme="light"] .bk-secondary{border-color:rgba(255,255,255,.18)!important;color:rgba(255,255,255,.75)!important;}
[data-theme="light"] .bk-secondary:hover{background:rgba(255,255,255,.08)!important;color:#fff!important;}