:root{
  --bg:#050508; --panel:#0d0f17; --gold:#ffd15a; --violet:#9b5cff;
  --cyan:#38d2ff; --green:#37e889; --red:#ff5364; --cell:82px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;background:#030305;color:#fff}
body{
  padding:16px;
  background:
    radial-gradient(circle at 50% -10%,#35205b 0,transparent 32%),
    radial-gradient(circle at 100% 45%,#07334d 0,transparent 26%),
    radial-gradient(circle at 0% 70%,#3d123e 0,transparent 25%),
    linear-gradient(180deg,#050507,#09070f 55%,#020204);
}
.machine{
  width:min(1360px,100%);margin:auto;overflow:hidden;position:relative;
  border:2px solid #d4a332;border-radius:30px;
  background:linear-gradient(180deg,#17131f,#09090e 42%,#050507);
  box-shadow:0 0 0 1px #ffffff08 inset,0 0 35px #8b5cf64a,0 0 90px #0ea5e922;
}
.machine:before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:30;
  background:linear-gradient(105deg,transparent 0 40%,#fff1 50%,transparent 60%);
  transform:translateX(-120%);animation:sheen 9s linear infinite;
}
@keyframes sheen{to{transform:translateX(120%)}}
.top{
  padding:15px 20px 10px;text-align:center;border-bottom:1px solid #ffffff0e;
  background:linear-gradient(180deg,#1b1627,#0c0b12)
}
.brand{
  font-weight:1000;font-size:clamp(27px,4vw,49px);letter-spacing:.08em;color:var(--gold);
  text-shadow:0 0 18px #f59e0b55
}
.sub{font-size:10px;letter-spacing:.33em;color:#c9c9d3aa;text-transform:uppercase}
.jackpots{
  display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:8px;padding:10px 14px;
  background:#08080c;border-bottom:1px solid #ffffff0d
}
.jp{
  text-align:center;border-radius:13px;padding:9px;background:linear-gradient(180deg,#171720,#0d0d13);
  border:1px solid #ffffff12;position:relative;overflow:hidden
}
.jp b{display:block;font-size:9px;letter-spacing:.2em;color:#aeb3c5}.jp span{font-size:20px;font-weight:1000}
.jp.grand{border-color:#ff596b55}.jp.grand span{color:#ff7b88}
.jp.major span{color:#c58dff}.jp.minor span{color:#66d7ff}.jp.mini span{color:#5cf29a}

.main{display:grid;grid-template-columns:220px minmax(0,1fr) 220px;gap:12px;padding:12px}
.panel{
  background:linear-gradient(180deg,#101019,#09090e);border:1px solid #ffffff13;border-radius:18px;
  padding:13px;box-shadow:inset 0 0 22px #0007
}
.panel h3{font-size:12px;color:#ffd15a;margin:2px 0 10px;letter-spacing:.08em}
.stat{display:flex;justify-content:space-between;gap:8px;padding:7px 0;font-size:11px;border-bottom:1px dashed #ffffff12}
.badge{padding:2px 7px;border-radius:999px;background:#ffffff0b;border:1px solid #ffffff10;font-weight:900}
.bar{height:10px;background:#1d1d28;border-radius:999px;overflow:hidden;margin:7px 0 11px}
.bar i{display:block;height:100%;width:0%;transition:.25s}
#xpBar{background:linear-gradient(90deg,#8b5cf6,#38d2ff)}
#rushBar{background:linear-gradient(90deg,#ff7a4c,#ffda55,#38d2ff)}
.feature{
  margin:6px 0;padding:8px;border-radius:10px;background:#ffffff07;border:1px solid #ffffff0d;
  font-size:10px;color:#cad0df
}
.feature b{color:#fff}
.queue{display:flex;gap:6px;flex-wrap:wrap}
.qitem{font-size:9px;padding:5px 7px;border-radius:999px;background:#31214e;border:1px solid #a874ff55}
.game{
  min-width:0;position:relative;border:2px solid #a77920;border-radius:22px;padding:12px;
  background:
    radial-gradient(circle at 50% 0,#2e1652 0,transparent 30%),
    linear-gradient(180deg,#0f0d16,#07070b);
  box-shadow:inset 0 0 28px #000,0 0 24px #8b5cf62a
}
.gamehead{display:flex;align-items:end;justify-content:space-between;padding:1px 4px 7px}
.gametitle{
  font-weight:1000;font-style:italic;font-size:clamp(23px,3.6vw,41px);
  background:linear-gradient(180deg,#fff8c8,#efa827);-webkit-background-clip:text;color:transparent;
  filter:drop-shadow(0 0 10px #ffbe3d55)
}
.mode{font-size:11px;font-weight:1000;color:#77efac;letter-spacing:.09em}
.board-wrap{
  position:relative;min-height:610px;border-radius:18px;overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%,#161227 0,#08080d 60%,#030305);
  border:1px solid #ffffff12;box-shadow:inset 0 0 35px #000
}
.board{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:14px;filter:drop-shadow(0 0 18px #8b5cf622)
}
.hexgrid{position:relative;width:610px;height:590px}
.hex{
  position:absolute;width:var(--cell);height:calc(var(--cell)*.88);
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  background:linear-gradient(180deg,#1b1b26,#0d0d13);
  box-shadow:inset 0 0 14px #000;transition:transform .22s,filter .22s,opacity .22s;
  user-select:none
}
.hex:before{
  content:"";position:absolute;inset:3px;clip-path:inherit;border:1px solid #ffffff14;pointer-events:none
}
.hex .ico{font-size:31px;line-height:1;filter:drop-shadow(0 0 7px #fff1)}
.hex small{font-size:7px;margin-top:5px;font-weight:1000;letter-spacing:.11em;color:#c8cede}
.hex.wild{background:radial-gradient(circle,#6b2b12,#20100a 72%)}
.hex.scatter{background:radial-gradient(circle,#1a4677,#0d1826 72%)}
.hex.bonus{background:radial-gradient(circle,#18532e,#0a1b10 72%)}
.hex.wild .multi{
  position:absolute;right:8px;top:7px;padding:2px 5px;border-radius:999px;background:#ffcb50;color:#281800;
  font-size:10px;font-weight:1000;box-shadow:0 0 10px #ffcb50
}

.hex.spinning{
  animation:hexSpinPulse .12s linear infinite;
  filter:blur(.7px) brightness(1.3) saturate(1.25);
}
.hex.spinning .ico{
  animation:icoJitter .09s linear infinite;
}
.hex.settle{
  animation:settle .34s cubic-bezier(.15,.75,.22,1.35);
}
.hex.spinflash{
  box-shadow:0 0 26px #38d2ff99,inset 0 0 18px #8b5cf677;
}
.board-wrap.spinning-board{
  animation:boardGlow .7s ease-in-out infinite alternate;
}
.board-wrap.spinning-board:before{
  content:"";
  position:absolute;
  inset:-30%;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 35%,#38d2ff18 46%,#ffffff25 50%,#8b5cf618 54%,transparent 65%);
  animation:scanWave .85s linear infinite;
}
.spin-trail{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  opacity:0;
  background:
    radial-gradient(circle at 50% 50%,#38d2ff22,transparent 46%),
    repeating-linear-gradient(0deg,transparent 0 18px,#ffffff08 19px 21px,transparent 22px 38px);
}
.board-wrap.spinning-board .spin-trail{
  opacity:1;
  animation:trailPulse .22s linear infinite;
}
@keyframes hexSpinPulse{
  0%{transform:translateY(-3px) scale(.98) rotate(-1deg)}
  50%{transform:translateY(3px) scale(1.03) rotate(1deg)}
  100%{transform:translateY(-3px) scale(.98) rotate(-1deg)}
}
@keyframes icoJitter{
  0%{transform:translateY(-5px);opacity:.55}
  50%{transform:translateY(4px);opacity:1}
  100%{transform:translateY(-5px);opacity:.55}
}
@keyframes settle{
  0%{transform:translateY(-18px) scale(.82);filter:brightness(1.8);opacity:.4}
  60%{transform:translateY(4px) scale(1.08)}
  100%{transform:translateY(0) scale(1);filter:brightness(1);opacity:1}
}
@keyframes boardGlow{
  from{box-shadow:inset 0 0 35px #000,0 0 0 #38d2ff00}
  to{box-shadow:inset 0 0 28px #000,0 0 34px #38d2ff44}
}
@keyframes scanWave{
  from{transform:translateY(-35%) translateX(-25%)}
  to{transform:translateY(35%) translateX(25%)}
}
@keyframes trailPulse{
  0%,100%{filter:brightness(.7)}
  50%{filter:brightness(1.5)}
}


.hex.gravity-fall{
  animation:gravityFall var(--dur,520ms) cubic-bezier(.12,.72,.18,1.08) var(--delay,0ms) both;
  z-index:8;
  will-change:transform,filter,opacity;
}
.hex.gravity-fall .ico{
  animation:fallIconSpin var(--dur,520ms) cubic-bezier(.18,.72,.18,1) var(--delay,0ms) both;
}
.hex.sticky-hit{
  z-index:10;
  animation:stickyHit .45s ease-in-out 2;
  box-shadow:0 0 28px #ffb52caa,inset 0 0 22px #ff772e77;
}
.hex.land{
  animation:landKick .28s cubic-bezier(.15,.75,.25,1.3);
}
.board-wrap.tumbling{
  animation:tumbleCabinet .34s ease-in-out infinite alternate;
}
.drop-beam{
  position:absolute;
  top:-100px;
  width:56px;
  height:210px;
  z-index:3;
  pointer-events:none;
  opacity:.0;
  background:linear-gradient(180deg,transparent,#38d2ff15,#ffffff27,#8b5cf615,transparent);
  filter:blur(5px);
  animation:dropBeam .7s ease-out forwards;
}
@keyframes gravityFall{
  0%{
    transform:translate(var(--dx,0px),var(--dy,-180px)) rotate(var(--rot,-3deg)) scale(.88);
    opacity:.12;filter:blur(2px) brightness(1.55)
  }
  62%{
    opacity:1;filter:blur(.25px) brightness(1.25)
  }
  82%{
    transform:translate(0,7px) rotate(0deg) scale(1.05);
    filter:blur(0) brightness(1.3)
  }
  100%{
    transform:translate(0,0) rotate(0deg) scale(1);
    opacity:1;filter:blur(0) brightness(1)
  }
}
@keyframes fallIconSpin{
  0%{transform:translateY(-5px) rotate(-8deg) scale(.9)}
  70%{transform:translateY(3px) rotate(4deg) scale(1.05)}
  100%{transform:translateY(0) rotate(0deg) scale(1)}
}
@keyframes stickyHit{
  50%{transform:scale(1.15) rotate(3deg);filter:brightness(1.8)}
}
@keyframes landKick{
  0%{transform:scale(.94)}
  55%{transform:scale(1.08);filter:brightness(1.45)}
  100%{transform:scale(1);filter:brightness(1)}
}
@keyframes tumbleCabinet{
  from{box-shadow:inset 0 0 35px #000,0 0 10px #38d2ff10}
  to{box-shadow:inset 0 0 28px #000,0 0 32px #8b5cf644}
}
@keyframes dropBeam{
  0%{transform:translateY(-120px) scaleY(.55);opacity:0}
  18%{opacity:.8}
  100%{transform:translateY(620px) scaleY(1.25);opacity:0}
}

.hex.pop{animation:pop .34s forwards}
@keyframes pop{50%{transform:scale(1.17);filter:brightness(2)}100%{transform:scale(.1);opacity:0}}
.hex.drop{animation:drop .42s cubic-bezier(.08,.7,.22,1)}
@keyframes drop{from{transform:translateY(-120px) scale(.84);opacity:.1}to{transform:translateY(0) scale(1);opacity:1}}
.hex.win{filter:brightness(1.5);z-index:4}
.hex.win:after{
  content:"";position:absolute;inset:4px;clip-path:inherit;box-shadow:inset 0 0 0 2px #ffd15a,0 0 15px #ffd15a
}
.float{
  position:absolute;z-index:20;pointer-events:none;font-weight:1000;color:#ffd15a;font-size:18px;
  text-shadow:0 2px 8px #000,0 0 10px #ffcf55;animation:floatup .85s forwards
}
@keyframes floatup{to{transform:translateY(-55px) scale(1.25);opacity:0}}
.combo{
  position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:12;
  padding:6px 12px;border-radius:999px;background:#0b0b10cc;border:1px solid #ffffff16;
  font-size:12px;font-weight:1000;opacity:0;transition:.18s
}
.combo.show{opacity:1}
.combo strong{color:#ffd15a}
.side-meter{
  position:absolute;right:10px;top:65px;bottom:65px;width:76px;z-index:8;
  border-radius:18px;background:#09090fdd;border:1px solid #ffffff14;padding:8px
}
.side-meter h4{font-size:9px;text-align:center;margin:3px 0 8px;color:#ffd15a;letter-spacing:.09em}
.meter-track{height:calc(100% - 46px);width:18px;margin:auto;background:#1d1d28;border-radius:99px;overflow:hidden;display:flex;align-items:flex-end}
.meter-fill{width:100%;height:0%;background:linear-gradient(180deg,#38d2ff,#8b5cf6,#ffb632);transition:.3s}
.meter-num{text-align:center;margin-top:7px;font-size:10px;font-weight:900}
.controls{
  display:grid;grid-template-columns:1fr auto auto auto 1fr;gap:8px;align-items:center;margin-top:10px
}
.info{padding:8px 10px;border-radius:12px;background:#0b0b11;border:1px solid #ffffff11;text-align:center}
.info b{display:block;font-size:8px;color:#9fa5b8;letter-spacing:.14em}.info span{font-size:17px;font-weight:1000}
.betctl{display:flex;gap:5px;align-items:center}
button{
  border:0;border-radius:12px;padding:10px 13px;color:#fff;background:#252536;font-weight:900;cursor:pointer;
  transition:.14s;box-shadow:inset 0 0 0 1px #ffffff0d
}
button:hover{filter:brightness(1.12);transform:translateY(-1px)}
button:active{transform:translateY(1px)}
.spin{
  min-width:126px;font-size:18px;color:#08131b;background:linear-gradient(180deg,#82ddff,#1194d2);
  box-shadow:0 0 20px #38d2ff66,inset 0 1px 0 #fff9
}
.spin.lock{opacity:.55;pointer-events:none}
.auto.on{background:linear-gradient(180deg,#b58dff,#6a34cf)}
.sound.on{background:linear-gradient(180deg,#56e99b,#198b53)}
.message{
  margin-top:8px;min-height:52px;padding:9px 11px;border-radius:12px;background:#0a0a10;border:1px solid #ffffff0f;
  font-size:11px;line-height:1.45;color:#d2d6e1
}
.message strong{color:#ffd15a}
.over{
  position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;
  background:#000c;backdrop-filter:blur(7px);padding:18px
}
.over.show{display:flex}
.winbox{text-align:center;transform:scale(.65);animation:zoom .35s forwards}
@keyframes zoom{to{transform:scale(1)}}
.winbox .label{
  font-size:clamp(44px,8vw,96px);font-weight:1000;font-style:italic;line-height:.9;
  background:linear-gradient(180deg,#fff,#ffd15a 46%,#e17c19);-webkit-background-clip:text;color:transparent;
  filter:drop-shadow(0 0 20px #ffd15a)
}
.winbox .amount{font-size:clamp(30px,5vw,57px);font-weight:1000;margin-top:10px}
.pickbox{
  width:min(780px,100%);padding:22px;border-radius:24px;text-align:center;
  border:2px solid #ffd15a;background:radial-gradient(circle at 50% 0,#41236f,transparent 35%),linear-gradient(180deg,#17131f,#08080d)
}
.pickbox h2{font-size:34px;color:#ffd15a;margin:0 0 4px}
.crates{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:17px 0}
.crate{font-size:36px;padding:24px 8px;background:#12151e;border:1px solid #ffffff1b}
.crate.open{background:#1e293b}
.pulse{animation:pulse .65s ease-in-out 2}
@keyframes pulse{50%{filter:brightness(1.65)}}
.shake{animation:shake .22s linear 2}
@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.footer{text-align:center;font-size:10px;color:#858a9d;padding:6px 14px 15px}
@media(max-width:1050px){
  .main{grid-template-columns:1fr}.panel{display:none}.board-wrap{min-height:590px}
}
@media(max-width:720px){
  :root{--cell:62px}
  body{padding:6px}.machine{border-radius:20px}.main{padding:7px}.game{padding:7px}
  .board-wrap{min-height:480px}.hexgrid{transform:scale(.82);transform-origin:center}
  .side-meter{right:5px;width:62px}.jackpots{grid-template-columns:repeat(2,1fr)}
  .controls{grid-template-columns:1fr 1fr 1fr}.spin{grid-column:2;min-width:95px}.info span{font-size:14px}
}
/* AFTER HOURS visual system */
:root{--cell:82px;--gold:#f3c786;--cyan:#87e9e3;--violet:#aa94eb}
body{background:radial-gradient(ellipse at 50% 0,#26232b,transparent 60%),#090c10;padding:24px;color:#e8e8ee}
.machine{max-width:1440px;border:1px solid #514837;border-radius:20px;background:#101318;box-shadow:0 28px 100px #0009}
.machine:before{display:none}
.top{text-align:left;padding:22px 28px 18px;background:linear-gradient(120deg,#20232a,#12151b);position:relative}
.eyebrow{font-size:9px;font-weight:700;letter-spacing:.24em;color:#9196a1;margin-bottom:9px}.eyebrow span{float:right;color:#e3c49b}
.brand{font-size:43px;font-style:italic;letter-spacing:-.055em;line-height:1;color:#f3eadb;text-shadow:none}.brand span{color:#f3c786}.brand sup{font-style:normal;font-size:10px;letter-spacing:.2em;border:1px solid #f3c78655;border-radius:4px;padding:5px;margin-left:12px;vertical-align:middle}
.sub{font-size:8px;letter-spacing:.24em;margin-top:9px;color:#9fa5ae}
.jackpots{padding:12px 18px;background:#0c0f14;gap:10px}.jp{border-radius:8px;background:linear-gradient(110deg,#20232b,#13171e);padding:11px}.jp b{font-size:8px;letter-spacing:.23em;margin-bottom:4px}.jp span{font-size:21px;letter-spacing:.03em;font-variant-numeric:tabular-nums}.jp.grand span{color:#eebc87}.jp.grand{border-color:#ac82434f}
.main{grid-template-columns:185px minmax(0,1fr) 190px;padding:16px;gap:14px}.panel{border-radius:10px;background:#12161c;border-color:#ffffff0d;padding:14px;box-shadow:none}.panel h3{font-size:10px;letter-spacing:.12em;color:#d9c5a7}.feature{line-height:1.6;background:#1b2028;border:0;border-radius:6px;margin:8px 0;padding:10px;color:#939eac}.feature b{color:#d6dae2}.stat{font-size:11px;padding:10px 0}.badge{border:0;color:#dfc69f;background:#29251f}.bar{height:4px}.game{padding:12px;border-radius:12px;border:1px solid #b5975b55;background:#0d1117;box-shadow:none}
.gamehead{padding:3px 3px 12px;align-items:center}.gametitle{font-size:15px;font-style:normal;letter-spacing:.12em;background:none;color:#e0d5c2;filter:none}.gametitle span{font-size:8px;color:#6f7b88;letter-spacing:.06em}.mode{font-size:8px;color:#88d9be;background:#123029;padding:6px 8px;border-radius:3px}
.board-wrap{min-height:530px;background:linear-gradient(#080c16a8,#090c15dc),url('assets/district.svg') center/cover;border-radius:8px;border-color:#d8bd7e22}.board{padding:0;right:56px;filter:drop-shadow(0 0 24px #000)}.hexgrid{width:538px;height:480px;flex-shrink:0;transform-origin:center}.hex{background:linear-gradient(155deg,#303740,#141b25);border:0;transition:filter .2s,opacity .15s;will-change:auto}.hex:before{inset:2px;border:0;background:linear-gradient(130deg,#ffffff12,transparent 60%);z-index:-1}.hex .ico{font-size:29px;filter:drop-shadow(0 4px 4px #0008)}.hex small{font-size:7px;color:#a3aebb;letter-spacing:.15em}.hex.cash{background:linear-gradient(150deg,#253c36,#131f23)}.hex.diamond{background:linear-gradient(150deg,#294459,#141c2e)}.hex.crown,.hex.panther{background:linear-gradient(150deg,#514030,#251e23)}.hex.seven{background:linear-gradient(150deg,#493147,#231a2c)}.hex.wild{background:radial-gradient(ellipse at 40% 25%,#855735,#2b1f24 80%)}.hex.scatter{background:linear-gradient(140deg,#346471,#192836)}.hex.bonus{background:linear-gradient(140deg,#365943,#172a26)}
.side-meter{top:56px;bottom:25px;width:45px;right:9px;border-radius:6px;background:#080d16a8;padding:6px}.side-meter h4{font-size:7px;letter-spacing:.05em;line-height:1.5}.meter-track{width:7px}.meter-num{font-size:8px}.meter-fill{background:linear-gradient(#ffe7a0,#e59a52,#9760ce)}
.controls{gap:6px;margin-top:12px}.info{border-radius:6px;background:#151b23}.info span{font-size:16px;font-variant-numeric:tabular-nums}.info b{font-size:7px;letter-spacing:.18em;margin-bottom:4px}button{border-radius:6px;background:#262e39;font-size:11px;padding:11px 12px}button:focus-visible{outline:2px solid #f3c786;outline-offset:3px}button:disabled{cursor:default;opacity:.5}.spin{min-width:104px;background:linear-gradient(145deg,#f2d39b,#bd9157);color:#231a10;font-size:16px;letter-spacing:.1em;box-shadow:0 3px 20px #bc955e25}.auto.on{background:#725899}.message{border-radius:5px;font-size:10px;color:#8e9aab;background:#0d1219;min-height:46px}.message strong{color:#e6c694}.footer{font-size:9px;color:#747e8c;padding:3px 12px 17px}
#effects{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:15}.feature-title{position:absolute;inset:42% 0 auto;text-align:center;pointer-events:none;z-index:22;opacity:0;transform:scale(.85);transition:.3s;font-size:clamp(22px,3vw,38px);font-style:italic;font-weight:1000;letter-spacing:.06em;color:#ffe3aa;text-shadow:0 3px 30px #000,0 0 30px #edb352}.feature-title.visible{opacity:1;transform:scale(1)}.anticipating{box-shadow:inset 0 0 70px #65c8ed44!important}.combo{top:10px;font-size:10px;border-color:#ebbd6444;background:#171b22e8}.float{font-size:14px;color:#ffe0a7}.winbox .label{background:linear-gradient(#fff6dd,#f0bc6e);background-clip:text;filter:drop-shadow(0 0 30px #de9f5855)}.over{background:#070a12b8}.pickbox{border:1px solid #d3ae70;background:linear-gradient(145deg,#272631,#10151e)}.mobile-sound{display:none}
@media(min-width:1500px){.board-wrap{min-height:570px}}
@media(max-width:1150px){.main{grid-template-columns:150px minmax(0,1fr)}.main>aside:last-child{display:none}.panel{display:block}.mobile-sound{display:block;position:absolute;right:20px;top:43px;z-index:25;padding:6px;font-size:8px}.board-wrap{min-height:530px}}
@media(max-width:860px){body{padding:10px}.main{grid-template-columns:1fr;padding:10px}.main>.panel{display:none}.top{padding:20px}.brand{font-size:35px}.board-wrap{min-height:510px}.jackpots{padding:10px}.gamehead{padding-right:0}}
@media(max-width:540px){:root{--cell:82px}body{padding:0}.machine{border-radius:0;border:0;min-height:100vh}.top{padding:17px}.brand{font-size:32px}.main{padding:8px}.game{padding:8px}.jackpots{grid-template-columns:repeat(4,1fr);gap:5px;padding:8px}.jp{padding:8px 3px}.jp b{font-size:6px}.jp span{font-size:12px}.gametitle{font-size:11px}.gametitle span{display:none}.board-wrap{min-height:380px}.board{right:44px}.side-meter{width:34px;right:5px;padding:4px}.controls{grid-template-columns:1fr 1.35fr 1fr}.betctl{justify-content:center;gap:3px}.betctl button{padding:10px}.spin{grid-column:1/3;grid-row:2;min-height:43px}.auto{grid-row:2;grid-column:3}.controls>.info:last-child{grid-column:3;grid-row:1}.info{padding:8px 5px}.mobile-sound{top:38px;right:15px}.crates{gap:5px}.crate{font-size:22px;padding:20px 4px}.pickbox{padding:14px}.pickbox h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.win-spark{position:absolute;left:50%;top:50%;width:6px;height:10px;border-radius:2px;background:#ffd99a;box-shadow:0 0 14px #ffc361;pointer-events:none}.winbox{position:relative;z-index:1}
/* DANDILLION 420 RUSH — green edition */
:root{--gold:#eddc87;--green:#a5f453;--cyan:#94e98d;--violet:#caa4ef}
body{background:#030b07 url('assets/dandillion-420.png') center top/cover fixed;color:#e5edda;padding:18px}
.machine{max-width:1500px;background:linear-gradient(#08120b3d,#040c08a8);border:1px solid #9daf4955;border-radius:14px;box-shadow:0 20px 100px #000b,0 0 50px #8cf7480d}
.top{min-height:170px;padding:23px 180px 20px 164px;background:linear-gradient(90deg,#07100938,#07100933 65%,#07100988);border-bottom:1px solid #b7d76040;overflow:hidden}
.brand-seal{position:absolute;left:20px;top:20px;width:124px;height:124px;filter:drop-shadow(0 0 18px #89dd3866)}.brand-seal img{width:100%;height:100%}.eyebrow{font-size:8px;letter-spacing:.24em;color:#b7c69f;margin-bottom:5px}.eyebrow span{position:absolute;right:24px;top:20px;font-size:7px;color:#bdd997}
.brand{font-family:Georgia,'Times New Roman',serif;font-size:clamp(38px,4.9vw,72px);font-style:normal;letter-spacing:-.04em;line-height:1;font-weight:900;background:linear-gradient(#fff3b6 5%,#c7a643 38%,#fff5af 51%,#a2842b 90%);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(2px 4px 0 #000);text-shadow:none}
.rush-brand{font-size:clamp(24px,3vw,43px);font-weight:1000;font-style:italic;letter-spacing:-.06em;line-height:1;color:#acfa6a;text-shadow:0 0 24px #7ae63755;transform:rotate(-3deg);transform-origin:left;margin:4px 0 8px 45px}.sub{font-size:8px;letter-spacing:.32em;color:#d3d9bd}.brand-note{position:absolute;right:26px;top:67px;font-size:15px;font-weight:900;font-style:italic;line-height:1.45;transform:rotate(-8deg);color:#c6e888;text-shadow:0 0 12px #89ff4633}
.jackpots{background:#050d09b0;border-block:1px solid #b6ce6033;padding:10px 16px;gap:9px}.jp{background:linear-gradient(120deg,#1c291aa8,#050d09e6);border:1px solid #87b24755;border-radius:7px}.jp.grand{border-color:#d8bd5d88}.jp b{color:#b6c78d;font-size:8px}.jp span{color:#c6f59d!important;font-size:24px;text-shadow:0 0 12px #a3f55922}.jp.grand span{color:#f4e29b!important}.jp.minor span{color:#a6e9ce!important}.jp.mini span{color:#d4b9f1!important}
.main{grid-template-columns:194px minmax(0,1fr) 205px;gap:11px;padding:12px}.panel{background:linear-gradient(#06150ddf,#06120ccc);border:1px solid #84b34a55;border-radius:8px;padding:12px}.panel h3{color:#e4df99;font-size:10px;letter-spacing:.14em}.stat{border-color:#badd6530;color:#bbcab2}.badge{background:#b3e35b12;color:#ccec9c;border:1px solid #9cbf4133}.feature{background:linear-gradient(100deg,#17281caa,#07130daa);border:1px solid #81a55535;border-radius:6px;color:#b4c2ac;font-size:10px;padding:9px;line-height:1.45}.feature b{color:#e5e0a2}.boost-card b{display:block;color:#d2edb2;margin-bottom:5px}.boost-card span{display:block;color:#9cec76;font-variant-numeric:tabular-nums;font-size:10px}.boost-card small{display:block;font-size:8px;color:#869c7c;margin-top:5px}.balance-note{font-size:9px;line-height:1.6;color:#93a987;padding:8px 3px}.qitem{color:#d2efac;background:#243117;border-color:#aace6555}#xpBar{background:linear-gradient(90deg,#4daf36,#c2f986)}
.game{background:#04100a70;border:1px solid #b3d85d8c;box-shadow:inset 0 0 20px #8fee3010,0 0 14px #92ec2710;border-radius:9px;padding:10px}.gamehead{padding:4px 6px 12px}.gametitle{color:#e5e4aa;font-size:14px}.gametitle span{font-size:8px;color:#adbc99}.mode{color:#c7ff8f;background:#143514;border:1px solid #81b64066;box-shadow:0 0 12px #83c92a18}
.board-wrap{background:linear-gradient(#0410093d,#0410096b),url('assets/dandillion-420.png') center/cover;border-color:#86ac3f80;min-height:530px}.board-wrap:after{content:'DANDILLION';position:absolute;left:20px;top:20px;letter-spacing:.32em;font-size:9px;color:#d2e69a55;pointer-events:none}.hex{background:linear-gradient(145deg,#325038,#0b1e13);box-shadow:inset 0 0 17px #0009;filter:drop-shadow(0 0 4px #bfff5633)}.hex:before{background:linear-gradient(145deg,#cfe98435,transparent 55%)}.hex.cash{background:linear-gradient(150deg,#34452b,#101d10)}.hex.car{background:linear-gradient(150deg,#45692b,#122810)}.hex.diamond{background:linear-gradient(150deg,#254c3d,#101f19)}.hex.crown,.hex.panther{background:linear-gradient(150deg,#6a5829,#282813)}.hex.seven{background:linear-gradient(150deg,#355d35,#0a2317)}.hex.scatter{background:linear-gradient(150deg,#68602f,#262714)}.hex.bonus{background:linear-gradient(150deg,#4b542d,#192316)}.hex.wild{background:radial-gradient(ellipse at 40% 20%,#6a963a,#153416 80%)}.hex.wild .multi{background:#e5ef80;color:#173613;box-shadow:0 0 12px #c0ff6566}.hex small{color:#d7e5b5;font-size:6px}.hex.wild .ico,.hex.car .ico{font-size:0;width:35px;height:35px;background:url('assets/kush-leaf.svg') center/contain no-repeat;filter:drop-shadow(0 0 7px #a4f53b77)}.hex.panther .ico{font-size:0;width:36px;height:36px;background:url('assets/d-coin.svg') center/contain no-repeat}.hex.win{filter:brightness(1.5) drop-shadow(0 0 8px #d9ff5f)}
.side-meter{background:#071308df;border-color:#b3d36155}.side-meter h4{color:#e6e7a0}.meter-track{background:#20301a}.meter-fill{background:linear-gradient(#f7ee87,#b3f442,#378b2c)}.meter-num{color:#d4e9aa}.combo{background:#17220deb;border-color:#d9d272;color:#e9e5b6}.combo strong{color:#c6ff78}.controls .info{background:#06120bf0;border-color:#819c4d55}.info b{color:#c2cc91}.info span{color:#edf4d7}.betctl button,.auto{background:linear-gradient(#28371b,#111d0b);border:1px solid #9eae5866;color:#e9edb1}.spin{color:#f2ffca;border:2px solid #c5e866;border-radius:999px;background:radial-gradient(ellipse at top,#669d2c,#244f17 60%,#102c11);box-shadow:0 0 20px #a9ee4140,inset 0 0 0 3px #142f0a,inset 0 0 0 4px #90bc53;text-shadow:0 2px 3px #000;font-size:20px;min-width:112px}.auto.on{background:#5d7524}.message{background:#07120ac9;border-color:#819c4d33;color:#b5c4a6}.message strong{color:#dcec9a}.mobile-sound,#sound{background:#213818;color:#d4efb0}.footer{color:#b8c48e;font-size:8px;letter-spacing:.1em;padding:6px 16px 14px}.winbox .label{background:linear-gradient(#fbffd7,#afef5f 60%,#d3b95d);background-clip:text}.pickbox{background:linear-gradient(145deg,#253b20,#07170b);border-color:#c1d778}.feature-title{color:#dcff9e;text-shadow:0 3px 30px #000,0 0 30px #86db3c}
@media(max-width:1150px){.main{grid-template-columns:170px minmax(0,1fr)}.top{padding-left:134px;padding-right:120px}.brand-seal{width:98px;height:98px;top:28px}.brand-note{font-size:11px;right:18px}.brand{font-size:52px}.eyebrow span{font-size:6px}.board-wrap{min-height:510px}}
@media(max-width:860px){body{padding:7px}.main{grid-template-columns:1fr;padding:9px}.top{min-height:156px}.brand{font-size:46px}.brand-note{display:none}.top{padding-right:15px}.eyebrow span{display:none}.board-wrap{min-height:490px}.gametitle{font-size:12px}}
@media(max-width:540px){body{padding:0}.machine{border:0}.top{padding:23px 12px 15px 84px;min-height:140px}.brand-seal{width:64px;height:64px;left:10px;top:30px}.brand{font-size:34px}.rush-brand{font-size:29px;margin-left:10px}.eyebrow{font-size:6px;letter-spacing:.17em}.sub{font-size:6px;letter-spacing:.16em}.main{padding:7px}.jackpots{padding:7px;gap:4px}.jp span{font-size:12px}.jp b{font-size:6px}.board-wrap{min-height:380px}.game{padding:8px}.gamehead{padding:3px 2px 10px}.controls{gap:5px}.spin{min-height:46px}.board-wrap:after{left:12px;font-size:7px;top:15px}.footer{font-size:7px;line-height:1.6}.mobile-sound{top:34px}}
/* Coordinated collectible symbols; special roles keep distinct silhouettes. */
.hex .symbol-art{display:block;width:49px;height:49px;object-fit:contain;filter:drop-shadow(0 3px 3px #0008);pointer-events:none}.hex small{font-size:6px;letter-spacing:.08em;margin-top:1px;line-height:1}.hex.wild{background:radial-gradient(ellipse at 40% 20%,#927536,#30200b 82%)}.hex.wild .symbol-art{filter:drop-shadow(0 0 7px #ffe99077)}.hex.wild .multi{right:4px;top:4px;background:#ffeaa1;color:#3e270b;font-size:9px}.hex.scatter{background:linear-gradient(145deg,#645177,#231b35)}.hex.bonus{background:linear-gradient(145deg,#537f74,#152c29)}.hex.car{background:linear-gradient(145deg,#425639,#102818)}.hex.crown{background:linear-gradient(145deg,#455d34,#152216)}.hex.seven{background:linear-gradient(145deg,#365d50,#10231d)}
.lounge-tools{display:grid;grid-template-columns:1fr 1.25fr;gap:6px;margin-top:8px}.lounge-tools details{border:1px solid #b1c16c33;border-radius:5px;background:#07120bdd;min-width:0}.lounge-tools summary{cursor:pointer;list-style:none;padding:11px 9px;color:#bbd19c;font-size:8px;font-weight:800;letter-spacing:.06em}.lounge-tools summary:before{content:'+';margin-right:7px;color:#e4d590}.lounge-tools details[open] summary:before{content:'−'}.lounge-tools summary:focus-visible{outline:2px solid #dbea95}.symbol-help[open]{grid-column:1/-1}.symbol-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:7px}.symbol-guide{display:grid;grid-template-columns:40px 1fr;column-gap:5px;align-items:center;padding:6px;border:1px solid #66854433;border-radius:4px;background:#13271988}.symbol-guide img{width:40px;height:40px;grid-row:1/3}.symbol-guide b{font-size:8px;color:#dfe8c9}.symbol-guide small{font-size:7px;line-height:1.4;color:#9aad8f}.symbol-guide.wild{border-color:#dabe5e88;background:#48341366}.symbol-guide.scatter{border-color:#ad85d766;background:#32244688}.symbol-guide.bonus{border-color:#74c2a777;background:#1b3a3088}.mixer-inner{padding:3px 10px 10px}.mixer-inner label{display:flex;align-items:center;gap:8px;font-size:10px;color:#cad6b6;margin:8px 0}.mixer-inner input{min-width:0;width:100%;accent-color:#b3d76d;cursor:pointer}.mixer-inner p{font-size:8px;line-height:1.5;color:#869e7c;margin:8px 0 0}
@media(max-width:540px){.symbol-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lounge-tools summary{font-size:7px;padding:10px 6px}.hex .symbol-art{width:49px;height:49px}}