/* /play/ mini-games (2026-11-13). Loaded only on /play/ pages, after site.css (navy + gold tokens from there).
   Forced-dark safe: dark fills + SOLID light/gold text only; every light fill uses site.css's invert trick. */
:root{color-scheme:dark}
.pl{--felt:#0b1426;--cell:#111a2e;--hi:#ffffff;--ok:#3ddc97;--no:#ff7a8a;color:var(--ink);font-size:18px}
.pl-badge{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;padding:8px 14px;border-radius:999px;
  border:1.5px solid rgba(61,220,151,.55);background:rgba(61,220,151,.08);color:#9ff5cf;font:700 15px/1.25 var(--fb)}
.pl-badge::before{content:"";width:9px;height:9px;border-radius:50%;background:#3ddc97;flex:none}
.pl-box{position:relative;margin:8px 0 28px;padding:22px;border-radius:var(--r);background:var(--felt);
  border:1px solid rgba(246,198,98,.28);box-shadow:var(--sh),inset 0 1px 0 rgba(255,255,255,.06)}
.pl-lbl{display:block;margin:0 0 10px;color:#ffffff;font:700 17px/1.3 var(--fd)}
.pl-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.pl-row .btn{flex:1 1 160px;width:auto;min-height:58px;font-size:18px}
.pl-k{display:block;color:#c9d2e3;font:600 14px/1.25 var(--fb);letter-spacing:.01em}
.pl-v{display:block;color:#ffffff;font:800 26px/1.15 var(--fd);font-variant-numeric:tabular-nums}
.pl-v.gold{color:var(--gold)}
.pl-rg{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--line2);color:#e3e8f2;font-size:16px;line-height:1.5}
.pl-rg a{color:var(--gold);font-weight:700}
.pl-how{max-width:760px;margin:40px 0}
.pl-how h2{color:#fff}
.pl-how li,.pl-how p{color:#dfe5f0;font-size:17px;line-height:1.6}
.pl-how .src{color:#b9c3d6;font-size:15px}
.pl-how a{color:var(--gold)}
.pl-soft{margin:20px 0 0}
.pl-soft a{color:var(--gold);font-weight:700;font-size:17px}
.pl [hidden]{display:none!important}
.pl .btn:disabled{opacity:.38;cursor:default;transform:none}
.pl-box{max-width:820px}
.bj-next,#he-next{display:flex;width:100%;margin-top:12px}
button{font-family:inherit}

/* ---- segmented rollover pick */
.pl-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pl-seg button{min-height:66px;padding:8px 6px;border-radius:14px;border:1.5px solid rgba(255,255,255,.22);background:#0e1730;
  color:#ffffff;cursor:pointer;font:800 22px/1.1 var(--fd)}
.pl-seg button small{display:block;margin-top:4px;color:#c9d2e3;font:600 13px/1.2 var(--fb)}
.pl-seg button[aria-pressed=true]{border-color:var(--gold);background:#2a2412;color:var(--gold);box-shadow:0 0 0 2px rgba(246,198,98,.35)}
.pl-seg button[aria-pressed=true] small{color:#f3dfae}

/* ---- Bonus Buster machine */
.bb-machine{margin:18px 0 0;padding:14px;border-radius:18px;background:#060a16;border:2px solid rgba(246,198,98,.55);
  box-shadow:0 0 0 4px rgba(246,198,98,.08),inset 0 0 40px rgba(0,0,0,.6)}
.bb-reels{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.bb-reels::before,.bb-reels::after{content:"";position:absolute;left:-4px;right:-4px;height:2px;background:#f6c662;z-index:2;opacity:.9}
.bb-reels::before{top:calc(33.333% + 1px)}.bb-reels::after{top:calc(66.666% - 3px)}
.bb-reels.hit{animation:bbhit .5s ease}
@keyframes bbhit{50%{box-shadow:0 0 0 3px rgba(246,198,98,.6);border-radius:12px}}
.bb-reel{display:grid;grid-template-rows:repeat(3,72px);border-radius:12px;overflow:hidden;background:#0d1426;border:1px solid rgba(255,255,255,.1)}
.bb-sym{display:flex;align-items:center;justify-content:center;min-width:0}
.bb-sym:nth-child(1),.bb-sym:nth-child(3){opacity:.38}
.bb-sym:nth-child(2){background:#141e38}
.s7{color:#ff5a68;font:800 54px/1 var(--fd);text-shadow:0 0 18px rgba(255,90,104,.55),0 2px 0 #7a1020}
.sch img{width:50px;height:50px;display:block}
.sbar{display:flex;flex-direction:column;gap:3px;align-items:center}
.sbar u{display:block;width:62px;padding:1px 0;border-radius:4px;border:1.5px solid #9cc1ff;background:#13285a;color:#ffffff;
  font:800 12px/1.25 var(--fd);letter-spacing:.12em;text-align:center;text-decoration:none}
.sbl{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.14)}
.bb-win{min-height:34px;margin:10px 0 0;text-align:center;color:transparent;font:800 24px/1.3 var(--fd)}
.bb-win.on{color:#ffffff}
.bb-win.big{color:var(--gold);font-size:30px;text-shadow:0 0 20px rgba(246,198,98,.5)}
.bb-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0 0}
.bb-stats>div{min-width:0;padding:12px;border-radius:14px;background:#0e1730;border:1px solid rgba(255,255,255,.1)}
.bb-stats .pl-v{font-size:24px;overflow-wrap:anywhere}
.bb-prog{height:12px;margin:14px 0 4px;border-radius:999px;background:#1f2a46;overflow:hidden}
.bb-prog i{display:block;height:100%;width:0;border-radius:999px;color-scheme:only light;background:#0f4ab5;filter:invert(1)}
.bb-progk{display:flex;justify-content:space-between;gap:10px;color:#c9d2e3;font-size:14px}
.bb-progk b{color:#fff}
.bb-chart{display:block;width:100%;height:120px;margin:12px 0 0;border-radius:12px;background:#0a1122;border:1px solid rgba(255,255,255,.08)}
.bb-res{margin:16px 0 0;padding:14px 16px;border-radius:14px;font:700 20px/1.35 var(--fd);color:#fff}
.bb-res.cleared{background:rgba(61,220,151,.1);border:1.5px solid rgba(61,220,151,.6);color:#b6f7da}
.bb-res.busted{background:rgba(255,122,138,.1);border:1.5px solid rgba(255,122,138,.6);color:#ffc4cc}
.bb-tally{margin:14px 0 0;padding:16px;border-radius:14px;background:#0e1730;border:1px solid rgba(246,198,98,.35)}
.bb-t-main{margin:0;color:#ffffff;font:700 20px/1.4 var(--fd)}
.bb-t-med{margin:8px 0 0;color:var(--gold);font:700 18px/1.4 var(--fb)}
.bb-t-note{margin:8px 0 0;color:#dfe5f0;font-size:16px}
.bb-go{margin:12px 0 0;font-size:16px}
.bb-go a{color:var(--gold);font-weight:700}
.bb-go small{display:block;color:#b9c3d6;font-size:14px}
.bb-pay{margin:16px 0 0}
.bb-pay summary{cursor:pointer;color:var(--gold);font:700 17px/1.4 var(--fd)}
.bb-pay table{width:100%;margin-top:10px;border-collapse:collapse;font-size:16px}
.bb-pay td{padding:7px 4px;border-bottom:1px solid var(--line2);color:#e9edf5}
.bb-pay td:last-child{text-align:right;color:#fff;font-weight:700}

/* ---- Blackjack trainer */
.bj-table{padding:18px 12px;border-radius:18px;background:radial-gradient(120% 90% at 50% 0%,#0f3a2d 0%,#0a1f1b 55%,#081420 100%);
  border:2px solid rgba(246,198,98,.45)}
.bj-side{text-align:center}
.bj-side+.bj-side{margin-top:14px}
.bj-cap{display:block;margin:0 0 8px;color:#e8f3ee;font:700 15px/1.2 var(--fb);letter-spacing:.06em;text-transform:uppercase}
.bj-cards{display:flex;justify-content:center;gap:12px;min-height:118px}
.bj-card{position:relative;width:82px;height:116px;border-radius:12px;background:#121a2e;border:2px solid rgba(246,198,98,.75);
  box-shadow:0 10px 24px -10px rgba(0,0,0,.8);color:#ffffff}
.bj-card b{position:absolute;top:6px;left:9px;font:800 30px/1 var(--fd)}
.bj-card i{position:absolute;top:36px;left:10px;font-style:normal;font-size:20px;line-height:1}
.bj-card em{position:absolute;right:8px;bottom:4px;font-style:normal;font-size:44px;line-height:1}
.bj-card.red{color:#ff6b7d}
.bj-card.back{background:repeating-linear-gradient(45deg,#16224a 0 8px,#0d1633 8px 16px);border-color:rgba(246,198,98,.5)}
.bj-total{display:block;margin:10px 0 0;color:#ffffff;font:800 22px/1.2 var(--fd)}
.bj-acts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0 0}
.bj-act{min-height:62px;border-radius:14px;border:2px solid rgba(246,198,98,.6);background:#0e1730;color:#ffffff;cursor:pointer;
  font:800 20px/1.1 var(--fd)}
.bj-act:hover:not(:disabled){background:#1a2442}
.bj-act:disabled{opacity:.35;cursor:default}
.bj-act.ok{opacity:1;border-color:#3ddc97;background:#0f3326;color:#b6f7da}
.bj-act.no{opacity:1;border-color:#ff7a8a;background:#3a1219;color:#ffc4cc}
.bj-fb{min-height:58px;margin:14px 0 0;color:#ffffff;font:700 21px/1.35 var(--fd);text-align:center}
.bj-fb.ok{color:#b6f7da}.bj-fb.no{color:#ffc4cc}
.bj-score{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0 0;text-align:center}
.bj-score>div{padding:10px 6px;border-radius:14px;background:#0e1730;border:1px solid rgba(255,255,255,.1)}
.bj-next{margin-top:12px}
.bj-chartw{margin:20px 0 0}
.bj-chartw summary{cursor:pointer;color:var(--gold);font:700 17px/1.4 var(--fd)}
.bj-tw{max-width:100%;overflow-x:auto;margin:12px 0 0}
.bj-tw table{border-collapse:separate;border-spacing:2px;font:700 14px/1 var(--fb);min-width:100%}
.bj-tw caption{text-align:left;padding:0 0 6px;color:#fff;font:700 16px/1.3 var(--fd)}
.bj-tw th{padding:6px 3px;color:#e3e8f2;font-weight:700}
.bj-tw td{width:9%;padding:8px 0;text-align:center;border-radius:5px;color:#fff}
.bj-tw td.mH{background:#3a2430}.bj-tw td.mS{background:#18432f}.bj-tw td.mD{background:#5a4512}.bj-tw td.mP{background:#2c2a66}
.bj-tw td.cur{outline:3px solid #ffffff;outline-offset:-1px}
.bj-leg{margin:10px 0 0;color:#dfe5f0;font-size:15px}

/* ---- House edge quiz */
.he-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;color:#fff;font:700 18px/1.3 var(--fd)}
.he-top b{color:var(--gold)}
.he-q{margin:12px 0 0;color:#fff;font:700 20px/1.35 var(--fd)}
.he-opts{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:14px 0 0}
.he-opt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:96px;padding:14px;border-radius:16px;
  border:2px solid rgba(246,198,98,.55);background:#0e1730;color:#fff;cursor:pointer;text-align:center}
.he-opt:hover:not(:disabled){background:#1a2442}
.he-opt:disabled{cursor:default}
.he-name{font:800 21px/1.25 var(--fd)}
.he-edge{font:800 30px/1 var(--fd);color:#fff}
.he-edge:empty{display:none}
.he-opt.lo{border-color:#3ddc97;background:#0f3326}.he-opt.lo .he-edge{color:#7ff0bd}
.he-opt.hi{border-color:#ff7a8a;background:#3a1219}.he-opt.hi .he-edge{color:#ffb3bd}
.he-opt.picked{box-shadow:0 0 0 4px rgba(255,255,255,.35)}
.he-fb{min-height:52px;margin:14px 0 0;color:#fff;font:600 18px/1.45 var(--fb)}
.he-fb.ok{color:#b6f7da}.he-fb.no{color:#ffc4cc}
.he-big{margin:6px 0 0;color:var(--gold);font:800 64px/1 var(--fd);text-align:center}
.he-res{margin:12px 0 0;color:#fff;font:700 20px/1.4 var(--fd);text-align:center}

/* ---- /play/ index */
.pl-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:10px 0 30px}
.pl-card{display:flex;flex-direction:column;gap:12px;padding:20px;border-radius:var(--r);background:var(--felt);border:1px solid rgba(246,198,98,.3);box-shadow:var(--sh)}
.pl-card h2{margin:0;color:#fff;font:800 24px/1.2 var(--fd)}
.pl-card p{margin:0;color:#e3e8f2;font-size:18px;line-height:1.45;flex:1}
.pl-art{display:flex;align-items:center;justify-content:center;gap:8px;height:110px;border-radius:14px;background:#060a16;border:1px solid rgba(255,255,255,.1)}
.pl-art .s7{font-size:58px}
.pl-art .bj-card{width:62px;height:88px}.pl-art .bj-card b{font-size:24px}.pl-art .bj-card em{font-size:32px}.pl-art .bj-card i{top:30px;font-size:16px}
.pl-art .pct{color:#7ff0bd;font:800 34px/1 var(--fd)}.pl-art .pct.bad{color:#ffb3bd}
.pl-art .vs{color:#c9d2e3;font:700 16px/1 var(--fb)}

@media (min-width:761px){
  .bb-reel{grid-template-rows:repeat(3,88px)}
  .s7{font-size:64px}
  .bj-acts{grid-template-columns:repeat(4,minmax(0,1fr))}
  .bj-card{width:92px;height:130px}
  .he-opts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pl-game{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:28px;align-items:start}
}
@media (max-width:900px){.pl-cards{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .pl{font-size:17px}
  .pl-box{padding:14px;border-radius:16px}
  .bb-machine{padding:10px}
  .bb-stats{gap:8px}.bb-stats>div{padding:10px 8px}.bb-stats .pl-v{font-size:20px}
  .sbar u{width:52px;font-size:11px}
  .pl-row .btn{flex:1 1 100%}
}
@media (max-width:360px){.bb-stats{grid-template-columns:minmax(0,1fr)}}
