:root{--bg:#07070a;--p:#111117;--p2:#18181f;--line:#2a2a33;--g:#d9b56a;--g2:#f5dc9a;--t:#ece9e2;--m:#8d8a84;--red:#c8323c;--grn:#1f8a52;--r:16px}
*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(1200px 600px at 70% -10%,#2a2112 0,transparent 60%),var(--bg);color:var(--t);font:15px/1.45 Inter,system-ui,Segoe UI,Roboto,sans-serif;min-height:100vh}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:12px 22px;background:rgba(7,7,10,.78);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.logo{font-weight:300;letter-spacing:.25em;font-size:15px}.logo b{color:var(--g);font-weight:700}.lg{color:var(--g)}
.bal{margin-left:auto;text-align:right;line-height:1.1}.bal small{display:block;font-size:10px;color:var(--m);text-transform:uppercase;letter-spacing:.15em}.bal span{font-size:20px;font-weight:700;color:var(--g2);font-variant-numeric:tabular-nums}
.bonus{border:1px solid var(--line);background:var(--p);border-radius:99px;padding:8px 14px;display:flex;gap:6px;align-items:center;font-variant-numeric:tabular-nums;transition:.3s}
.bonus.ready{background:linear-gradient(135deg,#f5dc9a,#b8873a);color:#1a1205;font-weight:700;border-color:transparent;box-shadow:0 0 24px #d9b56a66;animation:pulse 1.6s infinite}
@keyframes pulse{50%{box-shadow:0 0 40px #d9b56aaa}}
nav{display:flex;gap:14px;align-items:center;color:var(--m)}nav a:hover{color:var(--g2)}nav button{background:none;border:0;font-size:18px}
main{max-width:1180px;margin:0 auto;padding:28px 20px 40px}
.hero{padding:30px 0 26px}.hero h1{font-size:clamp(34px,6vw,72px);line-height:.95;font-weight:200;margin:0;letter-spacing:-.02em}.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--g2),var(--g),#a8762c);-webkit-background-clip:text;color:transparent;font-weight:700}
.hero p{color:var(--m);max-width:560px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.card{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--p2),var(--p));border:1px solid var(--line);border-radius:var(--r);padding:20px;min-height:170px;display:flex;flex-direction:column;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s}
.card:hover{transform:translateY(-4px);border-color:#d9b56a77;box-shadow:0 18px 40px #0008,0 0 0 1px #d9b56a22}
.card .ic{font-size:42px;filter:drop-shadow(0 6px 14px #000)}.card h3{margin:auto 0 2px;font-size:18px}.card p{margin:0;color:var(--m);font-size:13px}
.card:after{content:"";position:absolute;inset:-40% -40% auto auto;width:160px;height:160px;background:radial-gradient(#d9b56a33,transparent 70%);transition:.4s}.card:hover:after{transform:scale(1.6)}
.gh{display:flex;align-items:center;gap:12px;margin-bottom:18px}.gh h2{margin:0;font-weight:300;font-size:30px}.gh a{color:var(--m)}
.panel{background:linear-gradient(160deg,var(--p2),var(--p));border:1px solid var(--line);border-radius:var(--r);padding:20px}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.col{display:flex;flex-direction:column;gap:10px}
.btn{border:1px solid var(--line);background:var(--p2);border-radius:12px;padding:10px 16px;transition:.2s}.btn:hover{border-color:var(--g)}
.btn.gold{background:linear-gradient(135deg,#f5dc9a,#b8873a);color:#1a1205;font-weight:700;border:0;box-shadow:0 6px 20px #d9b56a33}.btn.gold:hover{filter:brightness(1.1)}
.btn:disabled{opacity:.4;cursor:not-allowed}.btn.on{border-color:var(--g);color:var(--g2);background:#d9b56a18}
.betbox{display:flex;gap:6px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:4px}
.betbox input{width:110px;background:none;border:0;color:var(--g2);font-size:17px;font-weight:700;padding:6px 8px;outline:0}
.betbox button{background:var(--p2);border:0;border-radius:8px;padding:6px 9px;font-size:12px;color:var(--m)}.betbox button:hover{color:var(--g2)}
.msg{min-height:28px;font-size:18px;font-weight:600}.win{color:#7be3a6}.lose{color:#e57b7b}
.lay{display:grid;grid-template-columns:1fr 330px;gap:18px}@media(max-width:900px){.lay{grid-template-columns:1fr}}
.hist{display:flex;gap:4px;flex-wrap:wrap}.hb{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700}
.red{background:var(--red)}.black{background:#1d1d24;border:1px solid #333}.green{background:var(--grn)}
/* roulette */
.wheelwrap{position:relative;width:min(420px,88vw);aspect-ratio:1;margin:0 auto;filter:drop-shadow(0 30px 40px #000)}
.wheelwrap canvas{width:100%;height:100%}
.rtable{display:grid;grid-template-columns:44px repeat(12,1fr) 44px;gap:3px;margin-top:16px;user-select:none;overflow-x:auto}
.rc{position:relative;border-radius:6px;display:grid;place-items:center;padding:10px 0;font-weight:700;font-size:14px;cursor:pointer;border:1px solid #ffffff10;transition:.15s}.rc:hover{outline:2px solid var(--g)}
.rc.z{grid-row:span 3;background:var(--grn)}.rc.o{background:#14141a;font-size:12px;font-weight:600}.rc.hit{animation:hit 1s 3}
@keyframes hit{50%{box-shadow:0 0 0 3px var(--g2),0 0 30px var(--g)}}
.chip{position:absolute;right:-4px;top:-6px;min-width:22px;height:22px;padding:0 4px;border-radius:11px;background:radial-gradient(circle,#f5dc9a 40%,#b8873a 42%,#f5dc9a 60%,#8a6020);color:#1a1205;font-size:10px;display:grid;place-items:center;box-shadow:0 2px 6px #000;z-index:2}
@media(max-width:640px){.rtable{grid-template-columns:34px repeat(12,minmax(26px,1fr)) 34px}.rc{font-size:11px;padding:8px 0}}
/* cards */
.hand{display:flex;gap:8px;min-height:112px;flex-wrap:wrap}
.pc{width:74px;height:106px;border-radius:9px;background:linear-gradient(160deg,#fbf7ee,#e3dccb);color:#15151a;position:relative;font-weight:800;box-shadow:0 8px 18px #0009;animation:deal .45s cubic-bezier(.2,.8,.2,1) both}
.pc .a{position:absolute;left:7px;top:5px;font-size:17px;line-height:1}.pc .b{position:absolute;inset:0;display:grid;place-items:center;font-size:34px}
.pc.r{color:#b5212c}.pc.back{background:repeating-linear-gradient(45deg,#2a2112 0 6px,#1a140b 6px 12px);border:2px solid var(--g)}
.pc.held{transform:translateY(-10px);outline:3px solid var(--g)}
@keyframes deal{from{opacity:0;transform:translate(40px,-30px) rotate(8deg)}}
/* slots */
.reels{display:flex;gap:8px;justify-content:center;background:#000;border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:inset 0 0 40px #000}
.reel{width:min(90px,17vw);height:min(90px,17vw);overflow:hidden;border-radius:10px;background:linear-gradient(#1b1b22,#0d0d12 50%,#1b1b22);display:grid;place-items:center;font-size:min(48px,9vw)}
.reels.r5 .reel{height:auto;display:flex;flex-direction:column}.reels.r5 .cell{height:min(76px,15vw);display:grid;place-items:center;font-size:min(40px,8vw);transition:.2s}
.cell.w{background:#d9b56a33;box-shadow:inset 0 0 0 2px var(--g)}
.spin{animation:blur .1s linear infinite}@keyframes blur{50%{transform:translateY(6px);filter:blur(2px)}}
/* board games */
.tiles{display:grid;gap:8px}.tile{aspect-ratio:1;border-radius:10px;background:var(--p2);border:1px solid var(--line);display:grid;place-items:center;font-size:24px;transition:.2s;cursor:pointer}
.tile:hover{border-color:var(--g)}.tile.sel{background:#d9b56a26;border-color:var(--g);color:var(--g2)}.tile.hit{background:linear-gradient(135deg,#f5dc9a,#b8873a);color:#1a1205}.tile.drawn{box-shadow:inset 0 0 0 2px #7be3a6}
.tile.gem{background:#1f8a5233;border-color:#7be3a6}.tile.bomb{background:#c8323c44;border-color:var(--red)}
.big{font-size:clamp(48px,10vw,96px);font-weight:200;text-align:center;font-variant-numeric:tabular-nums;color:var(--g2)}
.pay{width:100%;border-collapse:collapse;font-size:13px}.pay td{padding:5px 6px;border-bottom:1px solid var(--line)}.pay td:last-child{text-align:right;color:var(--g2)}.pay tr.on{background:#d9b56a22}
canvas.full{width:100%;display:block;border-radius:14px;background:#000}
input[type=range]{width:100%;accent-color:var(--g)}
.coin{width:150px;height:150px;margin:20px auto;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3c8,#d9b56a 40%,#7a5418);display:grid;place-items:center;font-size:20px;font-weight:800;color:#3a2808;box-shadow:0 20px 40px #000,inset 0 0 0 6px #f5dc9a55}
.coin.flip{animation:flip 1.2s cubic-bezier(.3,.7,.3,1)}@keyframes flip{to{transform:rotateY(1800deg)}}
.scr{position:relative;aspect-ratio:1;border-radius:12px;background:var(--p2);display:grid;place-items:center;font-size:38px;overflow:hidden}.scr canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair}
.stat{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.stat div{background:var(--p);border:1px solid var(--line);border-radius:14px;padding:16px}.stat b{display:block;font-size:24px;color:var(--g2)}.stat small{color:var(--m)}
.foot{border-top:1px solid var(--line);text-align:center;padding:22px;color:var(--m);font-size:12px}.foot b{color:var(--g)}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(120px);background:var(--p2);border:1px solid var(--g);padding:12px 20px;border-radius:12px;transition:.4s cubic-bezier(.2,.8,.2,1);z-index:50}#toast.on{transform:translateX(-50%)}
.fade{animation:fade .5s both}@keyframes fade{from{opacity:0;transform:translateY(12px)}}
@media(max-width:640px){.top{flex-wrap:wrap;padding:10px 12px;gap:8px}nav{width:100%;justify-content:center}.bal span{font-size:17px}main{padding:18px 12px}}
/* ===================== LUXE LAYER ===================== */
html,body{background:#050407}
body{background:
 radial-gradient(900px 500px at 75% -5%,rgba(217,181,106,.22),transparent 60%),
 radial-gradient(800px 600px at 0% 30%,rgba(120,10,30,.35),transparent 60%),
 radial-gradient(700px 500px at 100% 90%,rgba(90,8,24,.3),transparent 60%),
 repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 2px,transparent 2px 9px),
 linear-gradient(180deg,#0b0609,#050407 60%);background-attachment:fixed}
#bgfx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
#fxov{position:fixed;inset:0;pointer-events:none;z-index:60}
main,footer,.top{position:relative;z-index:1}.top{z-index:20}
.top{background:linear-gradient(180deg,rgba(10,6,8,.92),rgba(10,6,8,.7));border-bottom:1px solid transparent;border-image:linear-gradient(90deg,transparent,#d9b56a88,transparent) 1}
.logo{font-family:"Didot","Bodoni MT","Playfair Display",Georgia,serif;letter-spacing:.3em}
.lg{display:inline-block;animation:spinlg 6s linear infinite}@keyframes spinlg{to{transform:rotateY(360deg)}}
.bal span{transition:color .3s;text-shadow:0 0 18px #d9b56a55}.bal span.up{color:#9ff0c0}.bal span.down{color:#f0a0a0}
h1,h2,.gh h2{font-family:"Didot","Bodoni MT","Playfair Display",Georgia,serif}
/* hero */
.hero{position:relative;padding:46px 0 34px;display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}
@media(max-width:860px){.hero{grid-template-columns:1fr}}
.hero h1{font-weight:400;font-size:clamp(40px,6.4vw,84px);letter-spacing:-.01em}
.hero h1 em{background:linear-gradient(100deg,#8a6020,#f5dc9a 30%,#fff6d8 45%,#d9b56a 60%,#8a6020);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;animation:sheen 5s ease-in-out infinite}
@keyframes sheen{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.neon{font-family:"Brush Script MT","Segoe Script",cursive;font-size:clamp(28px,4vw,46px);color:#ffe9b0;text-shadow:0 0 4px #fff,0 0 12px #f5dc9a,0 0 28px #d9b56a,0 0 52px #c8323c;animation:neon 4s infinite;display:inline-block;transform:rotate(-4deg);margin-bottom:10px}
@keyframes neon{0%,18%,22%,25%,53%,57%,100%{opacity:1}20%,24%,55%{opacity:.35}}
.tag{font-size:clamp(18px,2.2vw,24px);color:var(--g2);margin:14px 0 6px;font-weight:300}
.hero .stage{position:relative;aspect-ratio:1;max-width:380px;justify-self:center;width:100%}
.hero .stage .disc{position:absolute;inset:6%;border-radius:50%;background:conic-gradient(from 0deg,#1f8a52 0 2.7%,#b3242e 0 5.4%,#141418 0 8.1%,#b3242e 0 10.8%,#141418 0 13.5%,#b3242e 0 16.2%,#141418 0 18.9%,#b3242e 0 21.6%,#141418 0 24.3%,#b3242e 0 27%,#141418 0 29.7%,#b3242e 0 32.4%,#141418 0 35.1%,#b3242e 0 37.8%,#141418 0 40.5%,#b3242e 0 43.2%,#141418 0 45.9%,#b3242e 0 48.6%,#141418 0 51.3%,#b3242e 0 54%,#141418 0 56.7%,#b3242e 0 59.4%,#141418 0 62.1%,#b3242e 0 64.8%,#141418 0 67.5%,#b3242e 0 70.2%,#141418 0 72.9%,#b3242e 0 75.6%,#141418 0 78.3%,#b3242e 0 81%,#141418 0 83.7%,#b3242e 0 86.4%,#141418 0 89.1%,#b3242e 0 91.8%,#141418 0 94.5%,#b3242e 0 97.2%,#141418 0);box-shadow:0 0 0 10px #2a1a0a,0 0 0 13px #d9b56a,0 40px 80px #000,inset 0 0 0 60px rgba(0,0,0,.15);animation:spinw 14s linear infinite;transform:perspective(900px) rotateX(55deg)}
.hero .stage .disc:after{content:"";position:absolute;inset:28%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#6b5028,#1a1208);box-shadow:0 0 0 4px #d9b56a}
@keyframes spinw{to{transform:perspective(900px) rotateX(55deg) rotate(360deg)}}
.hero .stage .chips{position:absolute;bottom:4%;left:8%;display:flex;gap:16px}
.stack{display:flex;flex-direction:column-reverse;animation:float 4s ease-in-out infinite}.stack:nth-child(2){animation-delay:-1.3s}.stack:nth-child(3){animation-delay:-2.6s}
.stack i{display:block;width:54px;height:10px;margin-top:-4px;border-radius:50%;background:var(--c,#c8323c);box-shadow:inset 0 -3px 0 rgba(0,0,0,.35),inset 0 0 0 2px rgba(255,255,255,.25),0 3px 5px #0008;background-image:repeating-linear-gradient(90deg,transparent 0 7px,rgba(255,255,255,.8) 7px 10px)}
@keyframes float{50%{transform:translateY(-10px)}}
.why{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:36px 0 10px}
.why div{background:linear-gradient(160deg,rgba(40,20,24,.6),rgba(15,10,12,.8));border:1px solid #d9b56a33;border-radius:16px;padding:18px}.why b{color:var(--g2);display:block;margin-bottom:4px;font-family:Georgia,serif;font-size:17px}.why p{margin:0;color:var(--m);font-size:13.5px}
.help{margin-top:16px;color:var(--m);font-size:13px}.help a{color:var(--g2);text-decoration:underline}
.sect{display:flex;align-items:center;gap:14px;margin:34px 0 16px;font-family:Georgia,serif;font-size:22px;color:var(--g2)}.sect:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,#d9b56a66,transparent)}
/* cards 3D */
.grid{perspective:1200px}
.card{background:linear-gradient(160deg,rgba(38,26,24,.9),rgba(14,10,12,.95));border:1px solid #d9b56a2a;transform-style:preserve-3d;will-change:transform;transition:transform .25s ease-out,border-color .3s,box-shadow .3s;animation:cardin .7s both;animation-delay:calc(var(--i)*50ms)}
@keyframes cardin{from{opacity:0;transform:translateY(30px) rotateX(-12deg)}}
.card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(400px circle at var(--mx,50%) var(--my,0%),rgba(245,220,154,.16),transparent 40%);opacity:0;transition:.3s;pointer-events:none}.card.tilt:before,.card:focus-visible:before{opacity:1}
.card .ic{font-size:50px;display:inline-block;transform:translateZ(40px);transition:transform .4s}
.card:hover .ic{transform:translateZ(60px) scale(1.12)}
.card[data-a="spin"]:hover .ic{animation:spinic 1.6s linear infinite}@keyframes spinic{to{transform:translateZ(60px) rotate(360deg)}}
.card[data-a="bounce"]:hover .ic{animation:bounceic .6s ease-in-out infinite alternate}@keyframes bounceic{to{transform:translateZ(60px) translateY(-10px) scale(1.1)}}
.card[data-a="flip"]:hover .ic{animation:flipic 1.4s ease-in-out infinite}@keyframes flipic{50%{transform:translateZ(60px) rotateY(180deg)}}
.card[data-a="fly"]:hover .ic{animation:flyic 1s ease-in-out infinite}@keyframes flyic{50%{transform:translateZ(60px) translate(8px,-12px) rotate(-8deg)}}
.card[data-a="shake"]:hover .ic{animation:shakeic .4s infinite}@keyframes shakeic{25%{transform:translateZ(60px) rotate(-10deg)}75%{transform:translateZ(60px) rotate(10deg)}}
.card h3{font-family:Georgia,serif;font-weight:400;font-size:19px;transform:translateZ(25px)}.card p{transform:translateZ(15px)}
.card .badge{position:absolute;top:14px;right:14px;font-size:10px;letter-spacing:.15em;padding:3px 8px;border-radius:99px;border:1px solid #d9b56a66;color:var(--g2)}
.card.hot{grid-column:span 2;min-height:220px;background:radial-gradient(500px 200px at 80% 20%,rgba(200,50,60,.35),transparent),linear-gradient(160deg,#2a1414,#120a0c)}
@media(max-width:520px){.card.hot{grid-column:span 1}.grid{grid-template-columns:1fr 1fr;gap:10px}.card{min-height:150px;padding:14px}.card .ic{font-size:38px}.card h3{font-size:16px}}
/* felt tables */
.felt{background:radial-gradient(ellipse at 50% 30%,#1d6b45 0,#0f4a2f 45%,#07291a 100%);border:10px solid transparent;border-radius:28px;background-clip:padding-box;box-shadow:0 0 0 2px #d9b56a99,0 0 0 12px #2a160c,0 0 0 14px #d9b56a55,inset 0 0 80px rgba(0,0,0,.6),0 30px 60px #000a;position:relative}
.felt:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse 60% 40% at 50% 0%,rgba(255,240,200,.18),transparent 70%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");pointer-events:none}
.felt>*{position:relative}
.felt.red{background:radial-gradient(ellipse at 50% 30%,#7a1a24 0,#4a0e16 50%,#22060a 100%)}
.felt.navy{background:radial-gradient(ellipse at 50% 30%,#1a2a5a 0,#0e1838 50%,#060a1a 100%)}
.panel:not(.felt){background:linear-gradient(160deg,rgba(34,24,24,.88),rgba(12,9,11,.92));border-color:#d9b56a26;box-shadow:0 20px 50px #0008}
.rtable .rc{box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);border-radius:4px}.rtable .rc.o{background:transparent;border:1px solid rgba(245,220,154,.5);color:#f5dc9a}.rtable .rc.black{background:#121216}
/* chips */
.chip{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle,#f5dc9a 0 36%,transparent 37%),repeating-conic-gradient(#c8323c 0 30deg,#fff 30deg 45deg);color:#3a0a0e;font-weight:800;box-shadow:0 3px 0 #6b1a20,0 5px 8px #000a;animation:chipdrop .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes chipdrop{from{transform:translateY(-14px) scale(1.4);opacity:0}}
.flychip{position:fixed;left:-17px;top:-17px;width:34px;height:34px;border-radius:50%;z-index:70;pointer-events:none;display:grid;place-items:center;font:800 10px Inter;color:#3a0a0e;background:radial-gradient(circle,#f5dc9a 0 36%,transparent 37%),repeating-conic-gradient(#c8323c 0 30deg,#fff 30deg 45deg);box-shadow:0 10px 20px #000a}
/* cards */
.pc{box-shadow:0 2px 0 #c9bfa8,0 14px 24px rgba(0,0,0,.6);animation:deal .55s cubic-bezier(.2,.8,.2,1) both;transform-style:preserve-3d}
.hand .pc:nth-child(2){animation-delay:.08s}.hand .pc:nth-child(3){animation-delay:.16s}.hand .pc:nth-child(4){animation-delay:.24s}.hand .pc:nth-child(5){animation-delay:.32s}
@keyframes deal{from{opacity:0;transform:translate(160px,-120px) rotate(25deg) rotateY(180deg) scale(.8)}60%{opacity:1}}
.pc.flipin{animation:flipin .6s ease both}@keyframes flipin{from{transform:rotateY(180deg)}}
.pc.back{background:radial-gradient(circle at 50% 50%,#d9b56a 0 10%,transparent 11%),repeating-linear-gradient(45deg,#6b1a20 0 5px,#4a0e16 5px 10px);border:3px solid #f3ead6}
/* reels */
.reels{background:linear-gradient(#1a0c0e,#050304);border:3px solid #d9b56a;box-shadow:0 0 0 6px #2a160c,0 0 40px #d9b56a44,inset 0 0 50px #000;border-radius:20px}
.reel{background:linear-gradient(#0a0a0e,#26262e 30%,#f3efe6 50%,#26262e 70%,#0a0a0e);background:linear-gradient(180deg,#121218,#2d2d36 45%,#2d2d36 55%,#121218);box-shadow:inset 0 12px 16px #000,inset 0 -12px 16px #000}
.spin{animation:blur .08s linear infinite}@keyframes blur{0%{transform:translateY(-14px);filter:blur(3px)}100%{transform:translateY(14px);filter:blur(3px)}}
.reel.antic{box-shadow:inset 0 0 0 3px #f5dc9a,0 0 30px #f5dc9a;animation:antic .5s infinite alternate}@keyframes antic{to{box-shadow:inset 0 0 0 3px #fff,0 0 50px #f5dc9a}}
.reel.land{animation:land .35s cubic-bezier(.3,1.8,.5,1)}@keyframes land{from{transform:translateY(-18px)}}
/* wheels */
.wheelwrap{transition:transform 1.2s cubic-bezier(.3,.7,.2,1)}.wheelwrap.zoom{transform:scale(1.12) perspective(900px) rotateX(18deg)}
.btn{position:relative;overflow:hidden}.btn.gold{background:linear-gradient(135deg,#fff1c2,#d9b56a 45%,#9a6c26);box-shadow:0 8px 24px #d9b56a44,inset 0 1px 0 #fff8}
.btn.gold:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.6) 50%,transparent 70%);transform:translateX(-120%);animation:btnsheen 3.5s infinite}@keyframes btnsheen{60%,100%{transform:translateX(120%)}}
.btn:active{transform:scale(.97)}
.btn:focus-visible,.card:focus-visible,.tile:focus-visible,.rc:focus-visible{outline:2px solid #f5dc9a;outline-offset:2px}
.msg.win{color:#9ff0c0;text-shadow:0 0 18px #1f8a52;animation:pop .5s cubic-bezier(.3,1.8,.5,1)}@keyframes pop{from{transform:scale(.6);opacity:0}}
.bigwin{position:fixed;inset:0;z-index:65;display:grid;place-items:center;pointer-events:none;background:radial-gradient(circle,rgba(0,0,0,.5),transparent 60%);animation:fade .3s both}
.bigwin div{text-align:center;animation:bw .7s cubic-bezier(.3,1.6,.5,1) both}.bigwin small{display:block;letter-spacing:.4em;color:#fff;font-weight:700;font-size:clamp(14px,2vw,20px);text-shadow:0 0 20px #c8323c}
.bigwin b{font-family:Georgia,serif;font-size:clamp(54px,11vw,130px);background:linear-gradient(180deg,#fff6d8,#f5dc9a 40%,#b8873a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 0 #5a3a10) drop-shadow(0 0 30px #d9b56a)}
.bigwin.out{opacity:0;transition:.6s}@keyframes bw{from{transform:scale(.3) rotate(-6deg);opacity:0}}
/* page transition */
main>section{animation:pagein .6s cubic-bezier(.2,.8,.2,1) both}@keyframes pagein{from{opacity:0;transform:translateY(18px) scale(.985);filter:blur(6px)}}
.curtain{position:fixed;inset:0;z-index:55;pointer-events:none;background:linear-gradient(90deg,#3a0a12,#6b1a20 50%,#3a0a12);transform:scaleX(0);transform-origin:left}
.curtain.go{animation:curtain .7s cubic-bezier(.7,0,.3,1)}@keyframes curtain{45%{transform:scaleX(1);transform-origin:left}55%{transform:scaleX(1);transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
.tile{background:linear-gradient(160deg,#2a2026,#141016);border-color:#d9b56a26;box-shadow:0 4px 0 #0a0608,0 6px 10px #0006;transition:transform .15s,background .2s}.tile:hover{transform:translateY(-2px)}.tile.gem,.tile.bomb,.tile.hit{animation:pop .4s cubic-bezier(.3,1.8,.5,1)}
.foot{background:linear-gradient(0deg,rgba(30,8,12,.6),transparent)}
@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}#bgfx{display:none}}
main{min-height:calc(100vh - 150px)}
.feltprint{position:absolute!important;left:0;right:0;top:42%;text-align:center;font-family:Georgia,serif;font-size:clamp(18px,3vw,30px);letter-spacing:.25em;color:rgba(245,220,154,.22);pointer-events:none}
.feltprint small{display:block;font-size:.45em;letter-spacing:.3em;margin-top:6px;text-transform:uppercase}
.mw{display:inline-block;width:1em;height:1em;border-radius:50%;vertical-align:-.12em;background:radial-gradient(circle,#d9b56a 0 14%,#3a2a12 15% 42%,transparent 43%),repeating-conic-gradient(#b3242e 0 10deg,#141418 10deg 20deg);box-shadow:0 0 0 .06em #d9b56a,0 .1em .2em #000}
.hero .stage .chips{bottom:14%;left:14%}
/* ===================== ICONS & UX ===================== */
.ico{width:1.25em;height:1.25em;display:inline-block;vertical-align:-.28em;flex:none;overflow:visible}
.ico.tiny{width:1em;height:1em;vertical-align:-.15em;margin-right:4px}
.btn .ico,.bk .ico,nav .ico{margin-right:6px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:2px}
.lg.ico{width:16px;height:16px;vertical-align:-2px}.bonus .ico{width:20px;height:20px}.bonus.ready .ico{animation:gift 1s ease-in-out infinite}@keyframes gift{25%{transform:rotate(-12deg) scale(1.1)}75%{transform:rotate(12deg) scale(1.1)}}
nav a{display:inline-flex;align-items:center;padding:6px 8px;border-radius:10px;transition:.2s}nav a:hover{background:#d9b56a14}nav a:hover .ico{transform:translateY(-2px)}nav .ico{transition:.3s}
#mute{width:40px;height:40px;border-radius:50%;border:1px solid var(--line)!important;display:grid;place-items:center}#mute .ico{margin:0;width:22px;height:22px}
.gh{flex-wrap:wrap}.gh .bk{display:inline-flex;align-items:center;color:var(--m);transition:.2s}.gh .bk:hover{color:var(--g2);transform:translateX(-3px)}
.gh h2{display:flex;align-items:center;gap:10px}.ico.gi{width:42px;height:42px;filter:drop-shadow(0 4px 10px #000)}
.howto{margin-left:auto;border-color:#d9b56a66;color:var(--g2)}.howto:hover .ico{animation:spinic2 .8s}@keyframes spinic2{to{transform:rotate(360deg)}}
.hint{display:flex;align-items:center;gap:8px;margin:-6px 0 14px;color:var(--g2);font-size:14px;opacity:.9}.hint .ico{animation:spinlg 4s linear infinite}
.card .ic .ico{width:64px;height:64px;filter:drop-shadow(0 10px 16px rgba(0,0,0,.7))}
.card.hot .ic .ico{width:84px;height:84px}
.lvl{position:absolute;left:20px;top:16px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:99px;font-weight:700;transform:translateZ(30px)}
.lvl.l1{background:#1f8a5233;color:#8ff0be;border:1px solid #1f8a5288}.lvl.l2{background:#d9b56a22;color:var(--g2);border:1px solid #d9b56a66}.lvl.l3{background:#c8323c22;color:#ff9aa2;border:1px solid #c8323c77}
.card .ic{margin-top:22px}
.card[data-a="spin"]:hover .ic{animation:spinic 2.4s linear infinite}
.ico.sym{width:100%;height:100%;max-width:64px;max-height:64px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6))}
.reel .ico.sym{width:70%;height:70%}.reels.r5 .cell .ico.sym{width:62%;height:62%}.cell.w .ico.sym{animation:symwin .6s ease-in-out infinite alternate}@keyframes symwin{to{transform:scale(1.15);filter:drop-shadow(0 0 12px #f5dc9a)}}
.pay td .ico.sym{width:22px;height:22px;margin-right:2px;vertical-align:-6px}
.scr .ico.sym{width:62%;height:62%}.tile .ico{width:64%;height:64%}
/* playing cards with svg suits */
.pc{color:#15151a}.pc.r{color:#b5121f}.pc .a{display:flex;flex-direction:column;align-items:center;font-size:16px;font-family:Georgia,serif}.pc .a .su{width:13px;height:13px;margin-top:2px}
.pc .a.z{left:auto;top:auto;right:7px;bottom:5px;transform:rotate(180deg)}.pc .b{display:grid}.pc .b .sb{width:36px;height:36px;filter:drop-shadow(0 1px 0 rgba(255,255,255,.6))}
/* modal / guide */
.modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px;background:rgba(5,3,6,.72);backdrop-filter:blur(6px);animation:fade .25s both}.modal.out{opacity:0;transition:.3s}
.mbox{position:relative;width:min(560px,100%);max-height:88vh;overflow:auto;background:linear-gradient(160deg,#241a1a,#0f0b0d);border:1px solid #d9b56a55;border-radius:22px;padding:24px;box-shadow:0 30px 80px #000,0 0 0 1px #000;animation:bw .45s cubic-bezier(.3,1.5,.5,1) both}
.mx{position:absolute;right:12px;top:10px;background:none;border:0;font-size:28px;color:var(--m);line-height:1}.mx:hover{color:var(--g2)}
.mh{display:flex;gap:14px;align-items:center;margin-bottom:12px}.mh .ico.big{width:60px;height:60px}.mh small{color:#8ff0be;text-transform:uppercase;font-size:11px;letter-spacing:.1em}.mh h3{margin:2px 0 0;font-family:Georgia,serif;font-weight:400;font-size:24px}
.mg{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px;animation:fade .5s both}.mg:nth-child(3){animation-delay:.08s}.mg:nth-child(4){animation-delay:.16s}.mg:nth-child(5){animation-delay:.24s}
.mg b{color:var(--g2);display:flex;align-items:center}.mg p,.mg ol{margin:6px 0 0;color:#d8d2c6}.mg ol{padding-left:20px}.mg li{margin:3px 0}.mg.ex{border-color:#1f8a5266;background:#1f8a5214}
.mbox>.btn.gold{width:100%;margin-top:6px;padding:13px}
/* tour */
.tour{position:fixed;inset:0;z-index:90}.tour.out{opacity:0;transition:.3s}
.spot{position:fixed;box-shadow:0 0 0 9999px rgba(4,2,5,.78),0 0 0 2px #f5dc9a,0 0 30px #d9b56a;transition:all .45s cubic-bezier(.3,.8,.3,1);pointer-events:none}
.tbox{position:fixed;background:linear-gradient(160deg,#2a1d1d,#100b0d);border:1px solid #d9b56a77;border-radius:18px;padding:18px;box-shadow:0 20px 60px #000;transition:left .4s,top .4s}.tbox.in{animation:bw .45s cubic-bezier(.3,1.5,.5,1) both}
.tbox h3{margin:6px 0;font-family:Georgia,serif;font-weight:400;color:var(--g2)}.tbox p{margin:0 0 12px;color:#ddd6ca}.tbox .row{justify-content:flex-end}
.tdots{display:flex;gap:5px}.tdots i{width:7px;height:7px;border-radius:50%;background:#ffffff22}.tdots i.on{background:var(--g);width:20px;border-radius:4px;transition:.3s}
.tip{position:fixed;z-index:95;pointer-events:none;background:#1a1214;border:1px solid #d9b56a88;color:var(--g2);font-size:13px;padding:6px 10px;border-radius:8px;box-shadow:0 8px 20px #000;animation:fade .15s both;white-space:nowrap}
.btn.ghost{background:transparent;border-color:#d9b56a44}
.linkbtn{background:none;border:0;color:var(--g2);text-decoration:underline;font-size:12px;padding:0}
#spin.ready{animation:pulse 1.6s infinite}
.ih{display:flex;align-items:center;gap:6px}
/* mobile header & hero fixes */
@media(max-width:640px){
 .top{flex-wrap:nowrap;gap:6px;padding:8px 10px}.logo{font-size:0;letter-spacing:0}.logo .lg{width:26px;height:26px}
 .bal{margin-left:auto}.bal small{font-size:8px}.bal span{font-size:16px}
 .bonus{padding:7px 10px;font-size:13px}.bonus.ready #bonusTxt{font-size:12px}
 nav{width:auto;gap:2px}nav a span{display:none}nav a{padding:6px}nav .ico{margin:0;width:22px;height:22px}#mute{width:34px;height:34px}
 .hero{padding:20px 0 10px;gap:8px}.hero .stage{max-width:240px;order:-1;margin:0 auto -20px}.hero .stage .chips{transform:scale(.7);transform-origin:left bottom}
 .gh h2{font-size:24px}.ico.gi{width:32px;height:32px}.howto{margin-left:0}
 .card .ic .ico{width:46px;height:46px}.card.hot .ic .ico{width:56px;height:56px}.lvl{left:12px;top:10px;font-size:9px}
}
.reel .ico.sym{width:min(60px,12vw);height:min(60px,12vw)}.reels.r5 .cell .ico.sym{width:min(52px,10vw);height:min(52px,10vw)}.scr .ico.sym{width:60%;height:60%;max-width:90px;max-height:90px}
#ann{position:relative;z-index:19;text-align:center;padding:9px 16px;background:linear-gradient(90deg,#3a0a12,#6b1a20,#3a0a12);color:#ffe9b0;font-size:14px;border-bottom:1px solid #d9b56a55}
@media(max-width:640px){.logo{display:flex;align-items:center}.logo .lg.ico{width:26px!important;height:26px!important}}
/* online room modes */
.mtabs{margin:8px 0 0}.mtabs .btn{font-size:13px;padding:8px 12px}
.mpanel .pc{animation:none}.fmini{border-radius:20px;padding:16px;border-width:6px}.fmini .hand .pc,.seats .pc{width:52px;height:74px}.fmini .pc .b .sb{width:24px;height:24px}.fmini .pc .a{font-size:13px}
.seats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:12px}
.seat{background:rgba(0,0,0,.28);border:1px solid rgba(245,220,154,.18);border-radius:14px;padding:10px;display:flex;flex-direction:column;gap:4px;transition:.3s}
.seat.turn{border-color:var(--g2);box-shadow:0 0 0 2px #f5dc9a66,0 0 24px #d9b56a55;animation:pulse 1.6s infinite}.seat.me b{color:var(--g2)}
.seat .av{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#3a2a12,#120c06);border:1px solid #d9b56a88;display:grid;place-items:center}.seat .av .ico{width:22px;height:22px;margin:0}
.seat small{color:#e8dfcc;opacity:.85}.hand.sm{min-height:0;gap:4px}
.tbar{height:6px;background:#ffffff14;border-radius:3px;overflow:hidden}.tbar i{display:block;height:100%;background:linear-gradient(90deg,#c8323c,#f5dc9a);transition:width .5s linear}
.board{display:flex;gap:8px;justify-content:center;min-height:80px}.pc.ghost{background:rgba(255,255,255,.05);border:1px dashed rgba(245,220,154,.3);box-shadow:none;width:52px;height:74px}
.rin{width:100px;background:var(--bg);color:var(--g2);border:1px solid var(--line);border-radius:10px;padding:9px;font-weight:700}
.hlog{font-size:12px;color:var(--m);max-height:110px;overflow:auto}.hintline{color:var(--g2);opacity:.85}
.duel{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:8px 12px}.duel span{flex:1}.duel .ico{width:28px;height:28px}
.kt .tile{font-size:13px;font-weight:700;aspect-ratio:auto;padding:8px 0}
.bal.tour span{color:#bfe3ff;text-shadow:0 0 18px #5aa8ff}
#vol{width:80px;accent-color:var(--g);cursor:pointer}@media(max-width:640px){#vol{width:56px}}