/* StakeWorldwide — casino skin. Loaded after Tailwind (see tools/build.mjs).
   Palette: black felt-table base, gold accent, emerald table-green and ruby glows. */
:root{--gold:#D4AF37;--gold-hi:#F4D774;--gold-lo:#B8922B;--felt:#0B6B4A;--ruby:#C8102E}
html{background:#08090C}
body{background:transparent!important}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 520px at 8% -6%,rgba(200,16,46,.11),transparent 62%),
    radial-gradient(900px 620px at 96% 0%,rgba(11,107,74,.16),transparent 62%),
    radial-gradient(700px 500px at 50% 110%,rgba(212,175,55,.06),transparent 60%)}

/* Primary buttons: polished gold */
.bg-teal{background-image:linear-gradient(135deg,var(--gold-hi),var(--gold) 55%,var(--gold-lo))}
a.bg-teal,button.bg-teal{box-shadow:0 10px 30px -12px rgba(212,175,55,.6),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}
a.bg-teal:hover,button.bg-teal:hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 14px 34px -12px rgba(212,175,55,.75),inset 0 1px 0 rgba(255,255,255,.4)}

/* Gradient borders: gold -> ruby */
.grad-border::before{background:linear-gradient(135deg,rgba(244,215,116,.6),rgba(200,16,46,.32) 52%,rgba(255,255,255,.05))}

/* Status dot reads as "live table" green */
.live-dot{background:#2ECC71;animation-name:liveDotGreen}
@keyframes liveDotGreen{0%,100%{box-shadow:0 0 0 0 rgba(46,204,113,.55)}50%{box-shadow:0 0 0 6px rgba(46,204,113,0)}}

/* Hero: card suits floating in the background */
.mesh-bg{overflow:hidden}
.mesh-bg::before,.mesh-bg::after{position:absolute;font-family:Georgia,'Times New Roman',serif;line-height:1;pointer-events:none;user-select:none}
.mesh-bg::before{content:"\2666";left:5%;bottom:6%;font-size:210px;color:rgba(200,16,46,.16);transform:rotate(-14deg)}
.mesh-bg::after{content:"\2660";right:6%;top:14%;font-size:240px;color:rgba(212,175,55,.13);transform:rotate(12deg)}
@media(max-width:768px){.mesh-bg::before,.mesh-bg::after{font-size:120px}}

/* Section headings: thin gold rule under article H2 */
article h2,.prose h2{position:relative}

/* Cards: subtle gold edge on hover */
.card-hover:hover{box-shadow:0 18px 40px -22px rgba(212,175,55,.35)}

/* Gold selection + focus */
::selection{background:rgba(212,175,55,.35);color:#fff}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
