/* DLBattle originals — shared styles (Dice, Mines, Keno, Plinko) */
:root{
  --bg:#070b09;--panel:#0d1512;--panel2:#111c18;--line:#1d3b31;--green:#3df2a5;--green-dim:#1f8f63;
  --cream:#efe6cf;--muted:#7f9a8f;--red:#ff4d5e;--gold:#f5c25a;--blue:#7fb3ff;--purple:#b98cff;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html,body{min-height:100%;overflow-x:hidden}
body{background:radial-gradient(ellipse 70% 50% at 50% 30%,rgba(61,242,165,.08),transparent 70%),var(--bg);color:var(--cream);font-family:Inter,system-ui,sans-serif}
button{font-family:inherit}
.btn{background:var(--green);color:#04120c;font-weight:800;border:0;padding:12px 20px;font-size:15px;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;
  clip-path:polygon(2% 0,100% 6%,98% 100%,0 92%);white-space:nowrap}
.btn:hover{filter:brightness(1.1)}
.btn:disabled{filter:grayscale(1) brightness(.6);cursor:not-allowed}
.btn.ghost{background:#13221c;color:var(--cream);border:1px solid var(--line);clip-path:none}
.btn.sm{padding:7px 12px;font-size:12px}
.btn.big{width:100%;padding:15px;font-size:17px}
.btn.blue{background:var(--blue)}

header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 28px;border-bottom:1px solid #13231c}
.logo{display:flex;align-items:center;gap:10px;font-family:Oswald,sans-serif;font-weight:700;font-size:22px;letter-spacing:1px;text-transform:uppercase;color:var(--cream);text-decoration:none;flex:none}
.logo svg{width:36px;height:36px}.logo span{color:var(--green)}
.crumbs{display:flex;gap:16px;align-items:center;flex-wrap:wrap;justify-content:center}
.crumbs a{color:var(--muted);text-decoration:none;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.5px}
.crumbs a:hover,.crumbs a.on{color:var(--green)}
.bal{background:rgba(255,255,255,.04);border:1px solid var(--line);padding:9px 14px;font-weight:800;font-size:14px;display:flex;gap:8px;align-items:center;flex:none}
.bal i{width:10px;height:10px;background:var(--green);border-radius:50%;box-shadow:0 0 10px var(--green)}

main{max-width:1320px;margin:0 auto;padding:26px 28px 60px}
h1{font-family:Oswald,sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(30px,4vw,46px);letter-spacing:1px}
h1 small{display:block;font:600 14px Inter,sans-serif;color:var(--muted);letter-spacing:0;text-transform:none;margin-top:4px;max-width:760px}
h1 .edge{display:inline-block;vertical-align:middle;margin-left:10px;font:800 11px Inter,sans-serif;letter-spacing:.8px;padding:4px 8px;border:1px solid var(--green-dim);color:var(--green);background:rgba(61,242,165,.07)}
h2{font-family:Oswald,sans-serif;font-weight:700;text-transform:uppercase;font-size:15px;letter-spacing:1px;margin-bottom:10px;color:#a9bdb4}
.game{display:grid;grid-template-columns:320px minmax(0,1fr);gap:20px;margin-top:22px}
.panel{background:var(--panel);border:1px solid var(--line);padding:18px;min-width:0}
.ctl{display:flex;flex-direction:column;gap:16px}
.stage{display:flex;flex-direction:column;gap:12px;min-width:0}
.board{position:relative;background:var(--panel);border:1px solid var(--line);min-height:360px;overflow:hidden}

.field>label,.lbl{display:block;font:800 10px Inter,sans-serif;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}
.amt{display:flex;border:1px solid var(--line);background:#0a110e;min-width:0}
.amt span{display:grid;place-items:center;padding:0 10px;color:var(--green);font-weight:800}
.amt input,.amt select{flex:1;min-width:0;background:none;border:0;color:var(--cream);font:700 16px Inter,sans-serif;padding:11px 6px;outline:none}
.amt select{padding:11px 10px;cursor:pointer}
.amt select option{background:#0a110e}
.amt input:disabled,.amt select:disabled{opacity:.6}
.amt button{background:#13221c;border:0;border-left:1px solid var(--line);color:var(--cream);font-weight:800;font-size:12px;padding:0 12px;cursor:pointer}
.amt button:hover{color:var(--green)}
.amt button:disabled{opacity:.5;cursor:not-allowed}
.seg{display:flex;gap:3px;background:#0a110e;border:1px solid var(--line);padding:3px}
.seg button{flex:1;background:none;border:0;color:var(--muted);font:700 13px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase;padding:9px 6px;cursor:pointer}
.seg button.on{background:#123327;color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}
.seg button:disabled{cursor:not-allowed;opacity:.6}
.seg button.on:disabled{opacity:1}
.kv{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;color:#b3c4bc;padding:6px 0;border-bottom:1px solid #13231c}
.kv b{color:var(--cream);font:700 17px Oswald,sans-serif}
.keys{font-size:11px;color:var(--muted);font-weight:600;text-align:center}
.keys kbd{background:#1d2b26;color:var(--cream);padding:1px 6px;font-family:inherit;font-size:10px}

.info{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hist{display:flex;gap:6px;flex-wrap:wrap;min-height:30px}
.hist em{font-style:normal;color:var(--muted);font-size:12px;font-weight:600;align-self:center}
.hchip{font:700 12px Oswald,sans-serif;padding:5px 8px;border:1px solid;letter-spacing:.3px}
.hchip.w{color:var(--green);border-color:#1f6b4c;background:rgba(61,242,165,.07)}
.hchip.l{color:#ff8a9a;border-color:#6b2a33;background:rgba(255,77,94,.07)}
.sess{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.sess div{background:var(--panel2);border:1px solid var(--line);padding:8px 10px;min-width:0}
.sess small{display:block;font:800 9px Inter,sans-serif;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.sess b{font:700 17px Oswald,sans-serif}
.pos{color:var(--green)}.neg{color:var(--red)}
.fair{font-size:12px;color:var(--muted);line-height:1.5}
.fair label{display:block;font:800 10px Inter,sans-serif;text-transform:uppercase;letter-spacing:1px;margin:8px 0 4px}
.fair code,.fair input{display:block;width:100%;background:#0a110e;border:1px solid var(--line);color:var(--cream);font:600 11px ui-monospace,Consolas,monospace;padding:7px 8px;word-break:break-all}
.fair input:disabled{opacity:.6}
.fair p{margin-top:8px}
.fair b{color:var(--cream)}
.frow{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;background:#2a1a1e;color:#ff8a9a;border:1px solid #4a2a30;padding:10px 16px;font-weight:700;font-size:14px;display:none}
.toast.ok{background:#10261c;color:var(--green);border-color:#1f6b4c}
.toast.on{display:block}
.winpop{position:absolute;left:50%;top:50%;z-index:20;transform:translate(-50%,-50%) scale(.7);opacity:0;pointer-events:none;background:#0c0f0e;border:2px solid var(--green);
  padding:14px 26px;text-align:center;box-shadow:0 0 60px rgba(61,242,165,.3);transition:opacity .2s,transform .3s cubic-bezier(.2,.9,.3,1.4)}
.winpop b{display:block;font:700 40px Oswald,sans-serif;color:var(--green)}
.winpop span{font:700 15px Inter,sans-serif;color:var(--cream)}
.winpop.show{opacity:1;transform:translate(-50%,-50%) scale(1)}

@media (max-width:1100px){header{flex-wrap:wrap}.crumbs{order:3;width:100%;justify-content:flex-start;gap:12px}}
@media (max-width:1000px){.game{grid-template-columns:minmax(0,1fr)}.stage{order:-1}.info{grid-template-columns:1fr}}
@media (max-width:640px){
  header{padding:12px 16px}.crumbs{gap:10px}.crumbs a{font-size:11px}
  main{padding:18px 16px 40px}
  .sess b{font-size:15px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* styled range slider */
.rng{display:flex;align-items:center;gap:14px;background:#0a110e;border:1px solid var(--line);padding:12px 14px}
.rng input[type=range]{flex:1;min-width:0;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;outline:none;cursor:pointer;
  background:linear-gradient(90deg,var(--green) var(--p,50%),#1d3b31 var(--p,50%))}
.rng input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;background:#efe6cf;border:3px solid #0c0f0e;transform:rotate(45deg);box-shadow:0 0 0 2px var(--green),0 0 12px rgba(61,242,165,.5);cursor:grab}
.rng input[type=range]::-moz-range-thumb{width:14px;height:14px;background:#efe6cf;border:3px solid #0c0f0e;border-radius:0;transform:rotate(45deg);box-shadow:0 0 0 2px var(--green);cursor:grab}
.rng input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--cream)}
.rng input[type=range]:disabled{opacity:.5;cursor:not-allowed}
.rng b{font:700 22px Oswald,sans-serif;min-width:28px;text-align:right;color:var(--cream)}
.rng-ticks{display:flex;justify-content:space-between;font:700 10px Inter,sans-serif;color:var(--muted);padding:5px 2px 0}
.chips{display:flex;gap:4px;margin-top:6px}
.chips button{flex:1;background:#13221c;border:1px solid var(--line);color:var(--muted);font:700 13px Oswald,sans-serif;padding:6px 0;cursor:pointer}
.chips button:hover{color:var(--cream)}
.chips button.on{color:var(--green);border-color:var(--green);background:#123327}
.chips button:disabled{opacity:.5;cursor:not-allowed}

/* win pop-up tiers */
.winpop small{display:block;font:800 11px Inter,sans-serif;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:5px}
.winpop.big{border-color:var(--green);box-shadow:0 0 80px rgba(61,242,165,.35)}
.winpop.big b{font-size:48px}
.winpop.mega{border-color:var(--gold);box-shadow:0 0 90px rgba(245,194,90,.45);background:radial-gradient(circle,#2a2108,#0c0f0e 75%)}
.winpop.mega b{color:var(--gold);font-size:56px;text-shadow:0 0 30px rgba(245,194,90,.6)}
.winpop.mega.show{animation:megaPop .6s cubic-bezier(.2,.9,.3,1.4)}
@keyframes megaPop{0%{transform:translate(-50%,-50%) scale(.5) rotate(-6deg)}60%{transform:translate(-50%,-50%) scale(1.08) rotate(2deg)}100%{transform:translate(-50%,-50%) scale(1)}}