/* ===== DECK v33 visual polish layer (Stake-grade). Presentation only. ===== */
:root{
  --sk-page:#1a2c38; --sk-panel:#213743; --sk-felt:#0f212e;
  --sk-btn:#2f4553; --sk-btn-h:#557086; --sk-blue:#1a75ff; --sk-blue-h:#4391ff;
  --sk-green:#00e701; --sk-muted:#b1bad3; --sk-line:rgba(255,255,255,.06);
}
main[class*="bg-[#22394a]"]{background:var(--sk-page)!important}

/* game / felt area */
section[class*="bg-[#0d1e2a]"]{
  background:radial-gradient(115% 80% at 50% 0%,#1b3away 0%,#16303f 0%,#12293a 52%,#0d1f2c 100%)!important;
}
section[class*="bg-[#0d1e2a]"]::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 90px 20px rgba(0,0,0,.28);
}

/* bet panel */
section[class*="linear-gradient(180deg,#2f4f61"]{
  background:var(--sk-panel)!important;
  box-shadow:0 -14px 34px -22px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.05)!important;
  padding-left:.75rem;padding-right:.75rem;
  border-top:1px solid var(--sk-line);
}

/* secondary buttons -> flat Stake grey */
[class*="bg-[linear-gradient(180deg,#38505f"]{
  background:var(--sk-btn)!important;
  border-radius:4px!important;
  box-shadow:0 1px 0 rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.04)!important;
  color:#fff!important;
  transition:background .15s ease, transform .1s ease!important;
}
[class*="bg-[linear-gradient(180deg,#38505f"]:hover{background:var(--sk-btn-h)!important;filter:none!important}
[class*="bg-[linear-gradient(180deg,#38505f"]:active{transform:scale(.985)!important}
button[class*="bg-[#3a5568]"]{background:var(--sk-btn)!important;border-radius:4px!important}
button[class*="bg-[#3a5568]"]:hover{background:var(--sk-btn-h)!important}

/* primary / active blue */
[class*="linear-gradient(180deg,#2f93f5"]{
  background:var(--sk-blue)!important;border-radius:4px!important;
  box-shadow:0 6px 16px -10px rgba(26,117,255,.9)!important;color:#fff!important;
}
[class*="linear-gradient(180deg,#2f93f5"]:hover{background:var(--sk-blue-h)!important}

/* pill groups -> squared segmented control */
[class*="rounded-full"][class*="bg-[#0b1a24]"]{
  background:var(--sk-felt)!important;border-radius:6px!important;
  box-shadow:inset 0 0 0 1px var(--sk-line)!important;padding:3px!important;
}
[class*="rounded-full"][class*="bg-[#0b1a24]"] > button{border-radius:4px!important}

/* inputs / readouts */
[class*="bg-[#0b1a24]"]:not([class*="rounded-full"]){
  background:var(--sk-felt)!important;
  box-shadow:inset 0 0 0 1px var(--sk-line)!important;
}
[class*="bg-[linear-gradient(180deg,#12283a"]{
  background:var(--sk-felt)!important;border-radius:4px!important;
  box-shadow:inset 0 0 0 1px var(--sk-line)!important;
}
.rounded-md,[class*="rounded-md"]{border-radius:4px!important}
[class*="rounded-lg"]{border-radius:4px!important}
input{color:#fff!important}
input::placeholder{color:var(--sk-muted)!important}

/* typography: calmer, Stake-like */
[class*="tracking-[0.16em]"],[class*="tracking-[0.14em]"],[class*="tracking-[0.12em]"]{
  letter-spacing:.04em!important;
}
[class*="text-white/55"],[class*="text-white/45"],[class*="text-white/60"],[class*="text-white/70"]{color:var(--sk-muted)!important}
[class*="text-[#1aef26]"]{color:var(--sk-green)!important}
[class*="tabular-nums"]{font-variant-numeric:tabular-nums;letter-spacing:0!important}

/* disabled CTA */
button[disabled][class*="bg-[#2a3d49]"]{
  background:#2f4553!important;color:rgba(255,255,255,.35)!important;border-radius:4px!important;
}

/* main CTA -> Stake blue */
button[class*="w-full"][class*="text-[15px]"]:not([disabled]){
  position:relative!important;z-index:5!important;pointer-events:auto!important;touch-action:manipulation!important;
  background:var(--sk-blue)!important;background-image:none!important;
  color:#fff!important;border-radius:4px!important;font-weight:700!important;text-transform:uppercase!important;
  box-shadow:0 8px 20px -12px rgba(26,117,255,.85), inset 0 1px 0 rgba(255,255,255,.18)!important;
}
button[class*="w-full"][class*="text-[15px]"]:not([disabled]):hover{background:var(--sk-blue-h)!important;filter:none!important}
/* selected market chips: flat Stake blue */
button[class*="linear-gradient(180deg,#2f93f5"]{box-shadow:0 4px 12px -8px rgba(26,117,255,.8), inset 0 0 0 1px rgba(255,255,255,.08)!important}

/* ===== v33.1 frame polish: match reference screenshots (presentation only) ===== */
html,body{background:#0a1520}
#root{background:#0a1520}
/* rounded inset frame around the felt + panel, like the reference */
section[class*="bg-[#0d1e2a]"]{
  border-radius:10px 10px 0 0!important;
  overflow:hidden!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)!important;
}
section[class*="linear-gradient(180deg,#2f4f61"]{
  border-radius:0 0 10px 10px!important;
}

/* ===== v33.7 polish: sharper Stake finish on controls ===== */
section[class*="linear-gradient(180deg,#2f4f61"] button{
  transition:background .14s ease, box-shadow .14s ease, transform .08s ease!important;
}
section[class*="linear-gradient(180deg,#2f4f61"] button:active{transform:scale(.99)!important}
/* selected market: crisp blue with inner highlight, like Stake */
section[class*="linear-gradient(180deg,#2f4f61"] button[class*="linear-gradient(180deg,#2f93f5"]{
  background:var(--sk-blue)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14), 0 6px 16px -12px rgba(26,117,255,.9)!important;
}
/* icon row: muted grey icons that brighten on hover */
section[class*="linear-gradient(180deg,#2f4f61"] svg{color:var(--sk-muted)!important;opacity:.9}
section[class*="linear-gradient(180deg,#2f4f61"] button:hover svg{color:#fff!important;opacity:1}
/* fairness pill */
section[class*="linear-gradient(180deg,#2f4f61"] button:has(svg) [class*="text-"]{letter-spacing:.02em!important}

/* v34 flat felt */
section[class*="bg-[#0d1e2a]"]{background:#0f212e!important}
section[class*="bg-[#0d1e2a]"]::after{content:none!important;box-shadow:none!important}
