@import url('https://fonts.googleapis.com/css2?family=Rye&family=Oswald:wght@400;600;700&display=swap');
:root{--gold:#FFD700;--gdark:#B8860B;--gdim:#7a6000;--red:#CC0000;--rdark:#8b0000;--rbright:#ff2244;--green:#4caf50;--gdark2:#2d6b2d;--bg:#0e0700;--wood:#3d1a00;--wl:#5c2800;--bdr:#2a1800;--txt:#e8d5b0;--tdim:#8a7060;--tfaint:#4a3828}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%;font-family:'Oswald',sans-serif;color:var(--txt);background:var(--bg);overflow-x:hidden}
button{cursor:pointer;font-family:'Oswald',sans-serif}
a{text-decoration:none}
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:#0a0500}::-webkit-scrollbar-thumb{background:#3a1800;border-radius:4px}

/* ─── ANIMATIONS ─── */
@keyframes blink{0%,100%{opacity:1}50%{opacity:.15}}
@keyframes winpop{0%{transform:scale(.5)rotate(-5deg);opacity:0}60%{transform:scale(1.1)rotate(2deg)}100%{transform:scale(1)rotate(0);opacity:1}}
@keyframes cffall{0%{transform:translateY(0)rotate(0);opacity:1}100%{transform:translateY(110vh)rotate(720deg);opacity:0}}
@keyframes tflash{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.04);opacity:.85}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes thunderFlash{0%{opacity:0}5%{opacity:.9}10%{opacity:.2}15%{opacity:.8}25%{opacity:0}100%{opacity:0}}
@keyframes thunderBolt{0%,100%{opacity:0;transform:scaleY(0)}8%{opacity:1;transform:scaleY(1)}20%{opacity:.3;transform:scaleY(1)}30%{opacity:0}}
@keyframes spinGlow{0%,100%{box-shadow:0 0 10px rgba(255,215,0,.3)}50%{box-shadow:0 0 30px rgba(255,215,0,.8),0 0 60px rgba(255,150,0,.4)}}
@keyframes goldRain{0%{transform:translateY(-20px);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(100vh);opacity:0}}
@keyframes slideIn{0%{transform:translateX(100%);opacity:0}100%{transform:translateX(0);opacity:1}}
@keyframes popIn{0%{transform:scale(0);opacity:0}70%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}
@keyframes crashShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}

/* ─── THUNDER OVERLAY ─── */
.thunder-overlay{position:fixed;inset:0;pointer-events:none;z-index:500;display:none}
.thunder-overlay.active{display:block;animation:thunderFlash .6s ease forwards}
.thunder-bolt{position:absolute;width:4px;background:linear-gradient(180deg,#fff,#ffe040,#ff8000);border-radius:2px;transform-origin:top center;animation:thunderBolt .5s ease forwards;filter:drop-shadow(0 0 8px #ffe040) drop-shadow(0 0 20px #ffaa00);display:none}
.thunder-bolt.show{display:block}

/* ─── TOPBAR ─── */
.topbar{height:52px;background:linear-gradient(180deg,#2a0e00,#160700);border-bottom:1px solid var(--gdim);display:flex;align-items:center;justify-content:space-between;padding:0 16px;box-shadow:0 2px 20px rgba(0,0,0,.7);position:sticky;top:0;z-index:50}
.tb-brand{font-family:'Rye',cursive;font-size:1.1rem;color:var(--gold);letter-spacing:2px}
.tb-brand span{color:#ff6633}
.tb-nav{display:flex;gap:3px}
.tb-nav a{background:transparent;border:1px solid transparent;color:var(--tdim);font-size:.72rem;letter-spacing:1px;padding:5px 11px;border-radius:6px;transition:all .2s;display:inline-block}
.tb-nav a:hover{color:var(--txt);border-color:var(--bdr)}
.tb-nav a.active{background:#1a0d00;border-color:var(--gdim);color:var(--gold)}
.tb-right{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tb-bal{background:#0a0500;border:1px solid var(--bdr);border-radius:6px;padding:4px 10px;font-size:.78rem;color:var(--gold);letter-spacing:1px}
.tb-user{font-size:.72rem;color:var(--tdim)}
.tb-user span{color:var(--txt)}
.btn-sm{border:1px solid var(--bdr);background:transparent;color:var(--tdim);font-size:.68rem;padding:5px 9px;border-radius:5px;transition:all .2s;letter-spacing:1px}
.btn-sm:hover{border-color:var(--gdim);color:var(--gold)}
.btn-sm.red{border-color:#3a0000;color:#884444}.btn-sm.red:hover{border-color:var(--rbright);color:var(--rbright)}
.btn-sm.grn{border-color:var(--gdark2);color:var(--green)}.btn-sm.grn:hover{border-color:var(--green)}
.btn-sm.gold{background:linear-gradient(180deg,#cc0000,#8b0000);border:2px solid var(--gold);color:var(--gold);font-family:'Rye',cursive;font-size:.78rem;letter-spacing:2px;padding:5px 13px}
.btn-sm.gold:hover{background:linear-gradient(180deg,#ff1111,#aa0000)}

/* ─── LIVE WINNER TOAST ─── */
.winner-toast{position:fixed;bottom:80px;right:20px;background:linear-gradient(135deg,#1a0d00,#2a1500);border:1px solid var(--gold);border-radius:10px;padding:10px 16px;font-size:.75rem;color:var(--txt);z-index:60;animation:slideIn .4s ease;box-shadow:0 4px 20px rgba(0,0,0,.6),0 0 15px rgba(255,200,0,.15);max-width:260px;display:none}
.winner-toast.show{display:block}
.wt-icon{font-size:1.2rem;margin-right:6px}
.wt-name{color:var(--gold);font-weight:700}
.wt-amt{color:var(--green);font-weight:700}

/* ─── MODALS ─── */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:200;display:flex;align-items:center;justify-content:center}
.auth-box{background:linear-gradient(160deg,var(--wl),var(--wood),#1a0800);border:2px solid var(--gdark);border-radius:16px;padding:26px 30px;width:360px;max-width:95vw;box-shadow:0 30px 80px rgba(0,0,0,.9)}
.auth-logo{font-family:'Rye',cursive;font-size:1.9rem;color:var(--gold);text-align:center;letter-spacing:3px;text-shadow:0 0 15px rgba(255,215,0,.5),2px 2px 0 #5a2a00;margin-bottom:4px}
.auth-sub{text-align:center;font-size:.68rem;color:var(--tdim);letter-spacing:3px;margin-bottom:16px}
.auth-tabs{display:flex;border:1px solid var(--gdim);border-radius:8px;overflow:hidden;margin-bottom:16px}
.auth-tab{flex:1;padding:9px;text-align:center;font-size:.78rem;letter-spacing:2px;border:none;background:#0d0700;color:var(--tdim);transition:all .2s;cursor:pointer}
.auth-tab.active{background:linear-gradient(180deg,#2a1400,#180a00);color:var(--gold)}
.auth-form{display:flex;flex-direction:column;gap:9px}
.fgroup{display:flex;flex-direction:column;gap:4px}
.flabel{font-size:.63rem;color:var(--tdim);letter-spacing:2px;text-transform:uppercase}
.finput{background:#080500;border:1px solid #2a1800;border-radius:6px;color:#fff;font-family:'Oswald',sans-serif;font-size:.9rem;padding:8px 11px;outline:none;transition:border-color .2s;width:100%}
.finput:focus{border-color:var(--gdim)}
.finput::placeholder{color:#2a1c10}
.auth-btn{margin-top:3px;background:linear-gradient(180deg,#cc0000,#8b0000,#5a0000);border:2px solid var(--gdark);color:var(--gold);font-family:'Rye',cursive;font-size:.95rem;letter-spacing:3px;padding:11px;border-radius:8px;box-shadow:0 4px 0 #3a0000;position:relative;top:0;transition:all .15s;width:100%}
.auth-btn:hover{background:linear-gradient(180deg,#ff1111,#aa0000,#770000)}
.auth-btn:active{top:3px;box-shadow:0 1px 0 #3a0000}
.form-msg{border-radius:6px;font-size:.72rem;padding:7px 11px;letter-spacing:1px;display:none}
.wd-box,.tu-box{background:linear-gradient(160deg,var(--wl),var(--wood),#150900);border:2px solid var(--gdark);border-radius:16px;padding:22px 26px;width:400px;max-width:95vw;max-height:90vh;overflow-y:auto;box-shadow:0 30px 80px rgba(0,0,0,.9)}
.wd-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.wd-title{font-family:'Rye',cursive;font-size:1.3rem;color:var(--gold);letter-spacing:2px}
.wd-close{background:transparent;border:1px solid #333;color:#888;width:26px;height:26px;border-radius:4px;font-size:.9rem}.wd-close:hover{border-color:var(--rbright);color:var(--rbright)}
.wd-bal-row{display:flex;justify-content:space-between;align-items:center;background:rgba(0,0,0,.4);border:1px solid var(--bdr);border-radius:8px;padding:8px 12px;margin-bottom:13px}
.wd-bal-lbl{font-size:.63rem;color:var(--tdim);letter-spacing:2px;text-transform:uppercase}
.wd-bal-val{font-size:1.2rem;color:var(--gold);font-weight:700}
.wd-form{display:flex;flex-direction:column;gap:9px}
.wd-quick{display:flex;gap:5px;flex-wrap:wrap;margin-top:3px}
.wd-q{background:#0d0700;border:1px solid #2a1800;color:var(--tdim);font-family:'Oswald',sans-serif;font-size:.7rem;padding:4px 8px;border-radius:4px;letter-spacing:1px;transition:all .15s}
.wd-q:hover{border-color:var(--gdim);color:var(--gold)}
.wd-submit{background:linear-gradient(180deg,#cc0000,#8b0000,#5a0000);border:2px solid var(--gold);color:var(--gold);font-family:'Rye',cursive;font-size:.95rem;letter-spacing:3px;padding:11px;border-radius:8px;width:100%;box-shadow:0 4px 0 #3a0000;position:relative;top:0;transition:all .15s;margin-top:3px}
.wd-submit:hover{background:linear-gradient(180deg,#ff1111,#aa0000,#770000)}
.wd-note{font-size:.61rem;color:var(--tfaint);letter-spacing:1px;text-align:center;margin-top:9px;line-height:1.6}

/* ─── GAME LOCK ─── */
.game-lock{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px}
.game-lock h2{font-family:'Rye',cursive;font-size:1.8rem;color:var(--gold);letter-spacing:3px;text-shadow:0 0 14px rgba(255,215,0,.5)}
.game-lock p{color:var(--tdim);font-size:.78rem;letter-spacing:2px}
.lock-btn{background:linear-gradient(180deg,#cc0000,#8b0000);border:2px solid var(--gold);color:var(--gold);font-family:'Rye',cursive;font-size:.9rem;letter-spacing:3px;padding:12px 28px;border-radius:8px;box-shadow:0 4px 0 #3a0000;transition:all .15s}
.lock-btn:hover{background:linear-gradient(180deg,#ff1111,#aa0000)}

/* ─── WIN OVERLAY ─── */
.win-overlay{position:fixed;inset:0;pointer-events:none;z-index:300;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}
.win-overlay.show{opacity:1;pointer-events:all}
.win-banner{font-family:'Rye',cursive;font-size:3rem;color:var(--gold);text-shadow:0 0 20px rgba(255,200,0,.9),3px 3px 0 #8B4500;text-align:center;animation:winpop .5s cubic-bezier(.36,.07,.19,.97);background:rgba(0,0,0,.78);padding:18px 34px;border:2px solid var(--gold);border-radius:12px}
.win-sub{display:block;font-size:1.6rem;color:#fff;margin-top:5px}
.confetti-piece{position:fixed;width:9px;height:9px;top:-10px;animation:cffall linear forwards;z-index:299;border-radius:2px}

/* ─── HOME ─── */
.home-page{display:flex;flex-direction:column;align-items:center;padding:18px 18px 60px;min-height:calc(100vh - 52px);background:radial-gradient(ellipse at 50% 0%,#3d1a0044,transparent 65%),var(--bg);position:relative;overflow:hidden}
/* floating particles */
.bg-particle{position:absolute;border-radius:50%;pointer-events:none;animation:float 3s ease-in-out infinite}
.jp-bar{width:100%;max-width:820px;margin-bottom:12px;background:linear-gradient(90deg,#1a0800,#2e1400,#1a0800);border:1px solid var(--gdim);border-radius:10px;padding:9px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative;overflow:hidden}
.jp-bar::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,215,0,.05),transparent);animation:shimmer 3s linear infinite;background-size:200% 100%}
.jp-left{display:flex;align-items:center;gap:8px;flex-shrink:0}
.jp-live{font-size:.58rem;color:#ff2244;letter-spacing:2px;display:flex;align-items:center;gap:4px}
.jp-live::before{content:'';width:6px;height:6px;border-radius:50%;background:#ff2244;box-shadow:0 0 6px #ff2244;animation:blink .7s infinite;display:block}
.jp-lbl{font-size:.6rem;color:var(--tdim);letter-spacing:2px}
.jp-amt{font-family:'Rye',cursive;font-size:1.4rem;color:var(--gold);letter-spacing:2px;text-shadow:0 0 12px rgba(255,215,0,.5);flex:1;text-align:center;transition:all .3s}
.jp-winner{text-align:right;font-size:.62rem;color:var(--tdim);letter-spacing:1px;line-height:1.5}
.jp-winner strong{color:var(--green);display:block}
.ticker-wrap{width:100%;max-width:820px;margin-bottom:12px;background:rgba(0,0,0,.4);border:1px solid var(--bdr);border-radius:8px;overflow:hidden;display:flex;align-items:center}
.ticker-lbl{background:var(--rdark);color:var(--gold);font-size:.6rem;letter-spacing:2px;padding:7px 11px;white-space:nowrap;flex-shrink:0}
.ticker-scroll{flex:1;overflow:hidden;height:32px;display:flex;align-items:center}
.ticker-inner{display:flex;animation:tick 26s linear infinite;white-space:nowrap}
.ticker-item{font-size:.7rem;color:var(--tdim);padding:0 15px;letter-spacing:1px}
.ticker-item span{color:var(--green)}
@keyframes tick{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.hero{display:flex;align-items:flex-end;justify-content:center;width:100%;max-width:820px;margin-bottom:14px;position:relative}
.hero-char{width:135px;height:255px;flex-shrink:0;border-radius:10px;overflow:hidden;border:1px solid var(--gdim);background:#0a0510;transition:transform .3s}
.hero-char:hover{transform:scale(1.03)}
.hero-center{flex:1;text-align:center;padding:0 10px}
.hero-center h1{font-family:'Rye',cursive;font-size:2.8rem;color:var(--gold);text-shadow:0 0 20px rgba(255,215,0,.6),3px 3px 0 #5a2a00;letter-spacing:4px;line-height:1;animation:pulse 3s ease infinite}
.hero-center h1 span{color:#ff6633}
.hero-center p{color:var(--tdim);font-size:.72rem;letter-spacing:3px;margin-top:7px}
.hlights{display:flex;gap:9px;justify-content:center;margin-top:10px}
.hlight{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 7px var(--gold);animation:blink 1.5s infinite}
.hlight:nth-child(2n){animation-delay:.25s}.hlight:nth-child(3n){animation-delay:.5s}
.games-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;width:100%;max-width:820px}
.game-card{background:linear-gradient(160deg,var(--wl),var(--wood),#1a0a00);border:2px solid var(--gdim);border-radius:14px;padding:24px 18px;text-align:center;cursor:pointer;transition:all .3s;position:relative;overflow:hidden;display:block}
.game-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,215,0,.06),transparent);opacity:0;transition:opacity .3s}
.game-card::after{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,215,0,.08) 0%,transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.game-card:hover{border-color:var(--gold);transform:translateY(-5px) scale(1.01);box-shadow:0 14px 40px rgba(0,0,0,.7),0 0 25px rgba(255,200,0,.15)}
.game-card:hover::before,.game-card:hover::after{opacity:1}
.game-icon{font-size:3rem;margin-bottom:9px;display:block;animation:float 2.5s ease-in-out infinite}
.game-card:hover .game-icon{animation:none;transform:scale(1.15)}
.game-name{font-family:'Rye',cursive;font-size:1.3rem;color:var(--gold);letter-spacing:2px;margin-bottom:4px}
.game-desc{font-size:.68rem;color:var(--tdim);letter-spacing:1px;line-height:1.6}
.game-badge{display:inline-block;margin-top:9px;background:linear-gradient(180deg,#cc0000,#8b0000);border:1px solid var(--gdim);color:var(--gold);font-size:.6rem;letter-spacing:2px;padding:4px 11px;border-radius:20px;animation:pulse 2s ease infinite}
.hstats{display:flex;width:100%;max-width:820px;margin-top:13px;background:rgba(0,0,0,.35);border:1px solid var(--bdr);border-radius:12px;overflow:hidden}
.hstat{flex:1;text-align:center;padding:13px 8px;position:relative}
.hstat+.hstat::before{content:'';position:absolute;left:0;top:20%;height:60%;width:1px;background:var(--bdr)}
.hstat-v{font-size:1.3rem;color:var(--gold);font-weight:700}
.hstat-l{font-size:.58rem;color:var(--tfaint);letter-spacing:2px;text-transform:uppercase;margin-top:2px}
.hstat-dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);display:inline-block;margin-right:4px;animation:blink .8s infinite}
.hfooter{margin-top:16px;text-align:center;font-size:.6rem;color:var(--tfaint);letter-spacing:1px}

/* ─── LAST WINNER STRIP ─── */
.last-winners{width:100%;max-width:820px;margin-bottom:12px;background:rgba(0,0,0,.3);border:1px solid #1a1000;border-radius:8px;padding:8px 14px;display:flex;align-items:center;gap:10px;overflow:hidden}
.lw-title{font-size:.6rem;color:var(--tdim);letter-spacing:2px;white-space:nowrap;flex-shrink:0}
.lw-items{display:flex;gap:10px;overflow:hidden;flex:1}
.lw-item{display:flex;align-items:center;gap:6px;flex-shrink:0;background:rgba(255,200,0,.06);border:1px solid rgba(255,200,0,.15);border-radius:20px;padding:3px 10px;font-size:.68rem;white-space:nowrap;animation:slideIn .3s ease}
.lw-item .lw-name{color:var(--gold)}
.lw-item .lw-val{color:var(--green)}
.lw-item .lw-game{color:var(--tdim);font-size:.62rem}

/* ─── SLOTS ─── */
.slots-page{display:flex;align-items:flex-start;justify-content:center;padding:18px;gap:0;min-height:calc(100vh - 52px);background:radial-gradient(ellipse at 50% 20%,#2a0a0022,transparent 60%),var(--bg);position:relative;overflow:hidden}
.slot-char{width:130px;height:280px;flex-shrink:0;border-radius:10px;overflow:hidden;border:1px solid var(--gdim);background:#0a0510;align-self:flex-end;transition:transform .3s}
.slot-char:hover{transform:scale(1.04)}
.machine-wrap{flex-shrink:0;position:relative}
.marquee-sign{background:linear-gradient(180deg,#2a0a00,#4a1500);border:3px solid var(--gold);border-bottom:none;border-radius:12px 12px 0 0;padding:9px 36px 11px;text-align:center;box-shadow:0 -4px 26px rgba(255,200,0,.3),inset 0 0 20px rgba(255,100,0,.1)}
.marquee-sign h2{font-family:'Rye',cursive;font-size:1.9rem;color:var(--gold);letter-spacing:4px;text-shadow:0 0 10px rgba(255,215,0,.8),2px 2px 0 #8B4500;animation:pulse 2s ease infinite}
.mlights{display:flex;gap:7px;justify-content:center;margin-top:4px}
.mlight{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 5px var(--gold);animation:blink 1.5s infinite}
.mlight:nth-child(2n){animation-delay:.2s}.mlight:nth-child(3n){animation-delay:.4s}
.machine{background:linear-gradient(160deg,var(--wl) 0%,var(--wood) 40%,#1a0a00 100%);border:4px solid var(--gold);border-radius:0 0 20px 20px;padding:20px 26px 26px;width:460px;box-shadow:0 20px 60px rgba(0,0,0,.8),inset 0 2px 10px rgba(255,200,0,.08),0 0 0 2px var(--gdark),5px 5px 0 #0a0300;position:relative;transition:box-shadow .3s}
.machine.spinning{animation:spinGlow .5s ease infinite}
.machine::before,.machine::after{content:'✦';position:absolute;top:13px;font-size:1.2rem;color:var(--gold);opacity:.7}
.machine::before{left:11px}.machine::after{right:11px}
.paytable{background:rgba(0,0,0,.6);border:1px solid var(--gdim);border-radius:8px;padding:7px 11px;margin-bottom:14px;display:grid;grid-template-columns:1fr 1fr;gap:2px 12px}
.pt-title{grid-column:1/-1;text-align:center;color:var(--gold);font-size:.63rem;letter-spacing:3px;text-transform:uppercase;margin-bottom:3px;border-bottom:1px solid var(--gdim);padding-bottom:3px}
.pt-row{display:flex;justify-content:space-between;align-items:center;font-size:.7rem;color:#bbb}
.pt-row .sym{font-size:.88rem}.pt-row .mx{color:var(--gold);font-weight:700}
.reel-cabinet{background:rgba(0,0,0,.7);border:2px solid var(--gdim);border-radius:10px;padding:12px;margin-bottom:16px;position:relative;box-shadow:inset 0 4px 20px rgba(0,0,0,.9);transition:border-color .3s}
.reel-cabinet.spinning{border-color:rgba(255,215,0,.5);box-shadow:inset 0 4px 20px rgba(0,0,0,.9),0 0 15px rgba(255,200,0,.2)}
.win-line{position:absolute;left:10px;right:10px;top:50%;transform:translateY(-50%);height:2px;background:linear-gradient(90deg,transparent,#cc0000,transparent);z-index:10;pointer-events:none}
.reels-row{display:flex;gap:10px}
.reel-wrap{flex:1;background:#0a0a0a;border:2px solid #1a1a1a;border-radius:6px;height:120px;overflow:hidden;position:relative;transition:border-color .3s,box-shadow .3s}
.reel-wrap::before,.reel-wrap::after{content:'';position:absolute;left:0;right:0;height:32px;z-index:5;pointer-events:none}
.reel-wrap::before{top:0;background:linear-gradient(to bottom,rgba(0,0,0,.92),transparent)}
.reel-wrap::after{bottom:0;background:linear-gradient(to top,rgba(0,0,0,.92),transparent)}
.reel-wrap.spinning-reel{border-color:rgba(255,215,0,.3);box-shadow:0 0 8px rgba(255,200,0,.2) inset}
.reel{display:flex;flex-direction:column;align-items:center;will-change:transform}
.rsym{width:100%;height:120px;display:flex;align-items:center;justify-content:center;font-size:2.8rem;user-select:none;flex-shrink:0}
.reel-wrap.winner{border-color:var(--gold)!important;box-shadow:0 0 25px var(--gold),0 0 50px rgba(255,215,0,.3);animation:rw .3s ease 5}
@keyframes rw{0%,100%{background:#0a0a0a}50%{background:#1a1200}}
.slot-controls{display:flex;flex-direction:column;gap:11px}
.bal-row{display:flex;justify-content:space-between;background:rgba(0,0,0,.5);border:1px solid var(--bdr);border-radius:7px;padding:7px 12px}
.bal-item{text-align:center}
.bal-lbl{font-size:.58rem;color:var(--tfaint);letter-spacing:2px;text-transform:uppercase}
.bal-val{font-size:1.1rem;color:#fff;font-weight:600}
.bal-val.gld{color:var(--gold)}.bal-val.grn{color:var(--green)}
.bet-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:center}
.bet-lbl{color:var(--gold);font-size:.78rem;letter-spacing:2px}
.bet-adj{background:linear-gradient(180deg,#333,#1a1a1a);border:1px solid var(--gdim);color:var(--gold);width:30px;height:30px;border-radius:5px;font-size:1rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.bet-adj:hover{border-color:var(--gold);background:#2a2a2a}.bet-adj:active{transform:scale(.9)}
.bet-disp{background:#000;border:1px solid var(--gdim);color:var(--gold);font-size:.9rem;font-weight:700;width:88px;text-align:center;padding:4px;border-radius:5px;letter-spacing:1px}
.presets{display:flex;gap:4px;flex-wrap:wrap}
.pset{background:linear-gradient(180deg,#1e1e1e,#0d0d0d);border:1px solid #333;color:#666;font-size:.66rem;padding:4px 7px;border-radius:4px;font-family:'Oswald',sans-serif;letter-spacing:1px;transition:all .15s}
.pset:hover{border-color:var(--gold);color:var(--gold)}.pset.active{border-color:var(--gold);color:var(--gold);background:#110e00}
.wmsg{text-align:center;font-size:.76rem;letter-spacing:2px;color:var(--tfaint);min-height:18px;transition:all .3s}
.wmsg.flash{color:var(--gold);animation:tflash .5s ease 3}
.spin-btn{background:linear-gradient(180deg,#cc0000,#8b0000,#5a0000);border:2px solid var(--gold);color:var(--gold);font-family:'Rye',cursive;font-size:1.35rem;letter-spacing:4px;padding:12px 0;width:100%;border-radius:10px;box-shadow:0 5px 0 #3a0000;position:relative;top:0;transition:all .15s}
.spin-btn:hover:not(:disabled){background:linear-gradient(180deg,#ff1111,#aa0000,#770000);box-shadow:0 5px 0 #3a0000,0 0 20px rgba(255,50,50,.3)}
.spin-btn:active:not(:disabled){top:4px;box-shadow:0 1px 0 #3a0000}
.spin-btn:disabled{opacity:.45;cursor:not-allowed}
.auto-row{display:flex;align-items:center;gap:7px;justify-content:center}
.auto-lbl{color:var(--tfaint);font-size:.7rem;letter-spacing:2px}
.auto-sel{background:#0a0500;border:1px solid #2a1800;color:#ccc;font-family:'Oswald',sans-serif;font-size:.8rem;padding:3px 7px;border-radius:4px}
.auto-go{background:linear-gradient(180deg,#0f2a0f,#071407);border:1px solid var(--gdark2);color:var(--green);font-family:'Oswald',sans-serif;font-size:.72rem;letter-spacing:2px;padding:5px 11px;border-radius:5px;transition:all .15s}
.auto-go:hover{border-color:var(--green)}
.auto-go.stop{background:linear-gradient(180deg,#2a0f0f,#140707);border-color:#6a0000;color:var(--rbright)}
.auto-cnt{font-size:.76rem;color:var(--green);min-width:52px;text-align:center}

/* ─── CRASH ─── */
.crash-page{display:flex;flex-direction:column;align-items:center;padding:14px 18px 50px;min-height:calc(100vh - 52px);background:radial-gradient(ellipse at 50% 0%,#1a0a3022,transparent 60%),var(--bg);position:relative}
.crash-wrap{width:100%;max-width:820px;display:flex;flex-direction:column;gap:10px}
.crash-hdr{text-align:center}
.crash-hdr h2{font-family:'Rye',cursive;font-size:1.8rem;color:var(--gold);letter-spacing:3px;text-shadow:0 0 12px rgba(255,215,0,.4),2px 2px 0 #5a2a00}
.crash-hdr p{font-size:.67rem;color:var(--tdim);letter-spacing:2px;margin-top:2px}
.ch-bar{display:flex;gap:5px;flex-wrap:wrap;align-items:center;min-height:26px}
.ch-item{font-size:.68rem;font-weight:700;letter-spacing:1px;padding:2px 7px;border-radius:4px;animation:popIn .2s ease}
.ch-item.lo{background:rgba(255,50,50,.15);color:#ff6666;border:1px solid rgba(255,50,50,.3)}
.ch-item.mi{background:rgba(255,200,0,.1);color:var(--gold);border:1px solid rgba(255,200,0,.2)}
.ch-item.hi{background:rgba(0,255,136,.1);color:#00ff88;border:1px solid rgba(0,255,136,.2)}
/* MULTIPLIER HISTORY STRIP */
.mult-hist-strip{background:rgba(0,0,0,.4);border:1px solid var(--bdr);border-radius:8px;padding:8px 12px;display:flex;align-items:center;gap:8px;overflow-x:auto}
.mhs-label{font-size:.6rem;color:var(--tdim);letter-spacing:2px;white-space:nowrap;flex-shrink:0}
.mhs-items{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.mhs-items::-webkit-scrollbar{display:none}
.mhs-item{flex-shrink:0;padding:4px 10px;border-radius:6px;font-size:.75rem;font-weight:700;letter-spacing:1px;animation:popIn .25s ease}
.mhs-item.lo{background:rgba(255,50,50,.2);color:#ff7777;border:1px solid rgba(255,50,50,.4)}
.mhs-item.mi{background:rgba(255,180,0,.15);color:#ffcc44;border:1px solid rgba(255,180,0,.3)}
.mhs-item.hi{background:rgba(0,200,100,.15);color:#00ee88;border:1px solid rgba(0,200,100,.3)}
.mhs-item.moon{background:rgba(100,50,255,.2);color:#cc88ff;border:1px solid rgba(100,50,255,.4)}
.crash-main{display:flex;gap:12px}
.crash-left{flex:1;display:flex;flex-direction:column;gap:9px;min-width:0}
.crash-right{width:200px;flex-shrink:0;display:flex;flex-direction:column;gap:9px}
.graph-box{background:#050300;border:2px solid var(--bdr);border-radius:12px;padding:12px;position:relative;overflow:hidden;box-shadow:inset 0 0 30px rgba(0,0,0,.8);transition:border-color .3s}
.graph-box.crashed{border-color:rgba(255,50,70,.4);animation:crashShake .4s ease}
.dragon-bg{position:absolute;right:0;bottom:0;width:150px;opacity:.12;pointer-events:none;z-index:0}
#cCanvas{display:block;width:100%;height:220px;position:relative;z-index:1}
.cmult{position:absolute;top:36%;left:50%;transform:translate(-50%,-50%);font-family:'Rye',cursive;font-size:3.4rem;font-weight:700;text-align:center;pointer-events:none;z-index:2;text-shadow:0 0 25px currentColor;white-space:nowrap;transition:color .12s}
.cmult.run{color:#00ff88}
.cmult.crash{color:#ff3355;animation:csh .35s ease}
.cmult.wait{color:#444;font-size:1.6rem}
@keyframes csh{0%,100%{transform:translate(-50%,-50%)}25%{transform:translate(-47%,-47%)}75%{transform:translate(-53%,-53%)}}
.gcash{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);z-index:10;padding:11px 26px;font-family:'Rye',cursive;font-size:1.1rem;letter-spacing:2px;border-radius:9px;border:2px solid var(--gold);background:linear-gradient(180deg,#cc8800,#885500);color:var(--gold);cursor:pointer;white-space:nowrap;animation:gcp .65s ease infinite;transition:all .15s}
.gcash:hover{transform:translateX(-50%) scale(1.04)}
@keyframes gcp{0%,100%{box-shadow:0 0 12px rgba(255,180,0,.3)}50%{box-shadow:0 0 32px rgba(255,180,0,.8)}}
.cstatus{text-align:center;font-size:.7rem;letter-spacing:2px;color:var(--tdim);padding:3px}
.cpanel{background:rgba(0,0,0,.5);border:1px solid var(--bdr);border-radius:10px;padding:11px;display:flex;flex-direction:column;gap:8px}
.cplbl{font-size:.6rem;color:var(--tdim);letter-spacing:2px;text-transform:uppercase}
.cpinp{background:#080500;border:1px solid #2a1800;border-radius:5px;color:#fff;font-family:'Oswald',sans-serif;font-size:1rem;padding:7px 10px;outline:none;width:100%;transition:border-color .2s}
.cpinp:focus{border-color:var(--gdim)}
.cprow{display:flex;gap:5px}
.cppre{flex:1;background:#0d0700;border:1px solid #222;color:#555;font-family:'Oswald',sans-serif;font-size:.68rem;padding:4px 3px;border-radius:4px;letter-spacing:1px;transition:all .15s}
.cppre:hover{border-color:var(--gdim);color:var(--gold)}
.cbet-btn{width:100%;padding:11px;border-radius:8px;font-family:'Rye',cursive;font-size:.95rem;letter-spacing:3px;transition:all .2s;border:2px solid}
.cbet-btn.place{background:linear-gradient(180deg,#006600,#004400);border-color:var(--green);color:var(--green);box-shadow:0 4px 0 #002200;position:relative;top:0}
.cbet-btn.place:hover:not(:disabled){background:linear-gradient(180deg,#009900,#005500)}
.cbet-btn.place:active:not(:disabled){top:3px;box-shadow:0 1px 0 #002200}
.cbet-btn.cashout{background:linear-gradient(180deg,#cc8800,#885500);border-color:var(--gold);color:var(--gold);animation:gcp .65s ease infinite}
.cbet-btn.wt{background:#0a0700;border-color:#222;color:#444;cursor:not-allowed}
.cbet-btn:disabled{opacity:.55;cursor:not-allowed}
.cinfo{background:rgba(0,0,0,.4);border:1px solid var(--bdr);border-radius:8px;padding:9px 12px;display:flex;flex-direction:column;gap:6px}
.ci-row{display:flex;justify-content:space-between;font-size:.73rem}
.ci-l{color:var(--tfaint);letter-spacing:1px}
.ci-v{color:#fff;font-weight:600}
.ci-v.gld{color:var(--gold)}.ci-v.grn{color:var(--green)}.ci-v.red{color:var(--rbright)}
.cbets{background:rgba(0,0,0,.4);border:1px solid var(--bdr);border-radius:8px;overflow:hidden}
.cbh{display:grid;grid-template-columns:1fr 1fr 1fr;font-size:.6rem;color:var(--tfaint);letter-spacing:1px;text-transform:uppercase;padding:6px 10px;border-bottom:1px solid var(--bdr)}
.cbr{display:grid;grid-template-columns:1fr 1fr 1fr;font-size:.7rem;padding:5px 10px;border-bottom:1px solid rgba(255,255,255,.03)}
.cbr:last-child{border:none}
.cbr .won{color:var(--green)}.cbr .lost{color:var(--rbright)}

/* ─── ADMIN ─── */
body.admin-body{overflow:auto}
.adm-page{padding:22px;display:flex;flex-direction:column;gap:13px;min-height:calc(100vh - 52px);background:linear-gradient(180deg,#0a0500,#060300)}
.acard{background:rgba(0,0,0,.5);border:1px solid var(--bdr);border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:10px}
.acard-ttl{font-size:.7rem;color:var(--gold);letter-spacing:3px;text-transform:uppercase;border-bottom:1px solid var(--bdr);padding-bottom:8px;display:flex;align-items:center;gap:8px}
.acard-ttl button{margin-left:auto;background:transparent;border:1px solid var(--bdr);color:var(--tfaint);font-size:.62rem;padding:2px 8px;border-radius:4px;letter-spacing:1px;transition:all .2s}
.acard-ttl button:hover{border-color:var(--gdim);color:var(--gold)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.sbox{background:rgba(255,255,255,.03);border:1px solid var(--bdr);border-radius:7px;padding:11px 12px}
.sbox-v{font-size:1.25rem;color:var(--gold);font-weight:700}
.sbox-l{font-size:.6rem;color:var(--tfaint);letter-spacing:2px;text-transform:uppercase;margin-top:2px}
.adm-row{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.adm-inp{background:#080500;border:1px solid var(--bdr);border-radius:5px;color:#fff;font-family:'Oswald',sans-serif;font-size:.88rem;padding:7px 10px;outline:none;transition:border-color .2s}
.adm-inp:focus{border-color:var(--gdim)}
.adm-inp.w{flex:1}.adm-inp.wn{width:140px}
.adm-btn{border:1px solid var(--gdim);color:var(--gold);background:linear-gradient(180deg,#2a1400,#150a00);font-family:'Oswald',sans-serif;font-size:.75rem;letter-spacing:1px;padding:7px 13px;border-radius:5px;transition:all .15s;white-space:nowrap}
.adm-btn:hover{border-color:var(--gold);background:#2a1800}
.adm-btn.ok{border-color:var(--gdark2);color:var(--green);background:rgba(0,80,0,.22)}.adm-btn.ok:hover{border-color:var(--green)}
.adm-btn.ng{border-color:#6a0000;color:#ff7777;background:rgba(100,0,0,.22)}.adm-btn.ng:hover{border-color:var(--rbright)}
.adm-msg{font-size:.72rem;letter-spacing:1px;padding:7px 10px;border-radius:5px;min-height:28px}
.adm-msg.ok{background:rgba(0,100,0,.2);border:1px solid var(--gdark2);color:var(--green)}
.adm-msg.ng{background:rgba(150,0,0,.2);border:1px solid var(--rdark);color:#ff8888}
.adm-msg.hide{display:none}
.tbl-wrap{overflow-x:auto}
.utbl{width:100%;border-collapse:collapse;font-size:.74rem}
.utbl th{text-align:left;color:var(--tdim);letter-spacing:1px;font-size:.63rem;text-transform:uppercase;padding:7px 9px;border-bottom:1px solid var(--bdr);font-weight:400}
.utbl td{padding:8px 9px;border-bottom:1px solid rgba(255,255,255,.04);vertical-align:middle}
.utbl tr:hover td{background:rgba(255,255,255,.02)}
.uname{color:var(--txt);font-weight:600}.ubal{color:var(--gold);font-weight:600}.uwon{color:var(--green)}.uph,.ujoin{color:var(--tdim);font-size:.69rem}
.ra-wrap{display:flex;gap:4px;flex-wrap:wrap}
.ra{background:transparent;border:1px solid #2a1800;color:var(--tfaint);font-family:'Oswald',sans-serif;font-size:.62rem;padding:3px 8px;border-radius:3px;letter-spacing:1px;transition:all .15s;white-space:nowrap}
.ra:hover{border-color:var(--gdim);color:var(--gold)}
.ra.ban:hover{border-color:var(--rbright);color:var(--rbright)}
.ra.unban:hover{border-color:var(--green);color:var(--green)}
.badge-ok{background:rgba(0,150,0,.2);border:1px solid #1a5a1a;color:var(--green);font-size:.6rem;padding:2px 7px;border-radius:10px}
.badge-ng{background:rgba(180,0,0,.25);border:1px solid var(--rdark);color:#ff7777;font-size:.6rem;padding:2px 7px;border-radius:10px}
.ltbl{width:100%;border-collapse:collapse;font-size:.71rem}
.ltbl th{color:var(--tfaint);font-size:.61rem;letter-spacing:1px;text-transform:uppercase;padding:5px 8px;border-bottom:1px solid var(--bdr);font-weight:400;text-align:left}
.ltbl td{padding:5px 8px;border-bottom:1px solid rgba(255,255,255,.03);color:var(--tdim)}
.lwin{color:var(--green);font-weight:600}.llose{color:#ff6666}.lgame{color:var(--gold);font-size:.64rem;text-transform:uppercase}
.access-denied{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;min-height:60vh}
.access-denied h2{font-family:'Rye',cursive;color:var(--rbright);font-size:2rem}

/* ─── TOP UP ─── */
.tu-pkg{background:linear-gradient(180deg,#1a0d00,#0d0600);border:1px solid #2a1800;border-radius:8px;padding:12px 10px;text-align:center;cursor:pointer;transition:all .2s;font-family:'Oswald',sans-serif}
.tu-pkg:hover{border-color:var(--gdim)}
.tu-pkg.sel{border-color:var(--gold);background:linear-gradient(180deg,#2a1500,#150b00);box-shadow:0 0 10px rgba(255,215,0,.2)}

/* ── THUNDER ── */
.thunder-overlay{position:fixed;inset:0;pointer-events:none;z-index:499;display:none;background:rgba(180,200,255,.07)}
.thunder-overlay.flash{display:block;animation:thunderFlash .5s ease forwards}
@keyframes thunderFlash{0%{opacity:0}8%{opacity:1}15%{opacity:.1}22%{opacity:.85}35%{opacity:0}100%{opacity:0}}
.thunder-bolt{position:fixed;width:3px;top:0;transform-origin:top center;animation:thunderBolt .45s ease forwards;z-index:500;pointer-events:none;filter:drop-shadow(0 0 8px #ffe040) drop-shadow(0 0 20px #aaddff)}
@keyframes thunderBolt{0%{opacity:0;height:0}10%{opacity:1;height:60vh}20%{opacity:.4}30%{opacity:1;height:70vh}50%{opacity:.2}60%{opacity:0}}

/* ── SPINNING GLOW ── */
@keyframes spinGlow{0%,100%{box-shadow:0 0 8px rgba(255,215,0,.3),inset 0 2px 10px rgba(255,200,0,.06)}50%{box-shadow:0 0 35px rgba(255,215,0,.8),0 0 60px rgba(255,150,0,.4),inset 0 2px 10px rgba(255,200,0,.15)}}
.machine.spinning{animation:spinGlow .6s ease infinite!important}
.reel-wrap.spinning-reel{border-color:rgba(255,200,0,.4)!important;box-shadow:0 0 12px rgba(255,200,0,.25) inset!important}

/* ── CRASH SHAKE ── */
@keyframes crashShake{0%,100%{transform:translateX(0)}15%{transform:translateX(-7px)}30%{transform:translateX(7px)}45%{transform:translateX(-5px)}60%{transform:translateX(5px)}75%{transform:translateX(-3px)}90%{transform:translateX(3px)}}
.graph-box.crashed{animation:crashShake .5s ease;border-color:rgba(255,50,70,.5)!important}

/* ── BG PARTICLES ── */
.bg-particle{position:fixed;border-radius:50%;pointer-events:none;animation:bgFloat linear infinite;opacity:.12}
@keyframes bgFloat{0%{transform:translateY(100vh) rotate(0deg)}100%{transform:translateY(-20px) rotate(360deg)}}

/* ── COIN RAIN ── */
.coin-rain{position:fixed;pointer-events:none;z-index:298;font-size:1.2rem;animation:coinFall linear forwards}
@keyframes coinFall{0%{transform:translateY(-30px) rotate(0);opacity:1}100%{transform:translateY(110vh) rotate(720deg);opacity:0}}

/* ── MULT HISTORY STRIP ── */
.mult-hist-strip{background:rgba(0,0,0,.45);border:1px solid var(--bdr);border-radius:8px;padding:7px 12px;display:flex;align-items:center;gap:8px;overflow:hidden}
.mhs-label{font-size:.6rem;color:var(--tdim);letter-spacing:2px;white-space:nowrap;flex-shrink:0}
.mhs-items{display:flex;gap:5px;overflow-x:auto;flex:1;scrollbar-width:none}
.mhs-items::-webkit-scrollbar{display:none}
.mhs-item{flex-shrink:0;padding:3px 9px;border-radius:5px;font-size:.74rem;font-weight:700;letter-spacing:1px}
.mhs-item.lo{background:rgba(255,50,50,.18);color:#ff7777;border:1px solid rgba(255,50,50,.35)}
.mhs-item.mi{background:rgba(255,180,0,.14);color:#ffcc44;border:1px solid rgba(255,180,0,.28)}
.mhs-item.hi{background:rgba(0,200,100,.14);color:#00ee88;border:1px solid rgba(0,200,100,.28)}
.mhs-item.moon{background:rgba(130,60,255,.18);color:#cc88ff;border:1px solid rgba(130,60,255,.35)}

/* ── WINNER TOAST ── */
.winner-toast{position:fixed;bottom:70px;right:16px;z-index:60;background:linear-gradient(135deg,#1a0d00,#2a1500);border:1px solid var(--gold);border-radius:10px;padding:10px 15px;font-size:.74rem;color:var(--txt);box-shadow:0 4px 20px rgba(0,0,0,.6),0 0 15px rgba(255,200,0,.12);max-width:250px;pointer-events:none;opacity:0;transform:translateX(100%);transition:all .4s ease}
.winner-toast.show{opacity:1;transform:translateX(0)}
.wt-name{color:var(--gold);font-weight:700}
.wt-amt{color:var(--green);font-weight:700}

/* ── LAST WINNERS STRIP ── */
.lw-strip{width:100%;max-width:820px;margin-bottom:11px;background:rgba(0,0,0,.3);border:1px solid #1a1000;border-radius:8px;padding:7px 13px;display:flex;align-items:center;gap:10px;overflow:hidden}
.lw-title{font-size:.6rem;color:var(--tdim);letter-spacing:2px;white-space:nowrap;flex-shrink:0}
.lw-items{display:flex;gap:8px;overflow:hidden;flex:1}
.lw-item{display:flex;align-items:center;gap:5px;flex-shrink:0;background:rgba(255,200,0,.06);border:1px solid rgba(255,200,0,.14);border-radius:20px;padding:3px 9px;font-size:.67rem;white-space:nowrap}
.lw-item .lwn{color:var(--gold)}.lw-item .lwv{color:var(--green)}.lw-item .lwg{color:var(--tdim);font-size:.6rem}

/* ── FLOATING COINS ON HOME ── */
.home-page{position:relative;overflow:hidden}