.ol-machine{position:relative;width:100%;max-width:460px;padding:14px;border-radius:28px;background:radial-gradient(130% 70% at 50% 0%,rgba(96,165,250,.4),transparent 62%),linear-gradient(170deg,#1e3a8a 0%,#0c1e4a 100%);border:2px solid #3b82f6;box-shadow:0 0 42px -10px #3b82f6,0 0 90px -30px rgba(96,165,250,.5),inset 0 1px 0 rgba(255,255,255,.22),inset 0 -3px 8px rgba(0,0,0,.7),inset 0 0 26px rgba(0,0,0,.55),0 16px 32px rgba(0,0,0,.55);display:flex;flex-direction:column;align-items:center}
.ol-machine::before{content:"";position:absolute;inset:0;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 25%,transparent 75%,rgba(0,0,0,.15));pointer-events:none}
.ol-machine.fs{border-color:#fbbf24;box-shadow:0 0 50px -6px #fbbf24,0 0 100px -20px rgba(251,191,36,.6),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -3px 8px rgba(0,0,0,.7),inset 0 0 30px rgba(251,191,36,.15),0 16px 32px rgba(0,0,0,.55)}
.ol-top{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px;margin-bottom:8px;position:relative;z-index:2}
.ol-name{font-size:12px;font-weight:800;color:#fef3c7;text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 12px rgba(251,191,36,.5)}
.ol-tag{font-size:9px;font-weight:700;color:rgba(255,255,255,.65)}
.ol-multtrack{display:flex;align-items:center;justify-content:center;width:100%;padding:7px 14px;margin-bottom:8px;min-height:32px;background:linear-gradient(180deg,rgba(0,0,0,.7),rgba(0,0,0,.45));border-radius:999px;border:1px solid rgba(251,191,36,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 -1px 2px rgba(0,0,0,.8),0 2px 6px rgba(0,0,0,.4);position:relative;z-index:2;transition:opacity .2s ease}
.ol-multtrack.idle{opacity:.35}
.ol-multtrack .lbl{font-size:9px;color:rgba(255,255,255,.6);font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-right:8px}
.ol-multtrack .val{font-size:17px;font-weight:900;color:#fbbf24;text-shadow:0 0 12px rgba(251,191,36,.9),0 0 22px rgba(251,191,36,.5),0 1px 2px rgba(0,0,0,.9);font-variant-numeric:tabular-nums}
.ol-window{position:relative;width:100%;padding:12px;border-radius:16px;background:linear-gradient(180deg,#04070f 0%,#0a1428 50%,#04070f 100%);box-shadow:inset 0 3px 6px rgba(0,0,0,.95),inset 0 -3px 8px rgba(0,0,0,.7),0 2px 0 rgba(255,255,255,.1),0 8px 20px rgba(0,0,0,.6);overflow:visible}
.ol-window::before{content:"";position:absolute;inset:0;border-radius:16px;background:linear-gradient(180deg,rgba(96,165,250,.08),transparent 30%,transparent 70%,rgba(0,0,0,.3));pointer-events:none;z-index:1}
.ol-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;position:relative;z-index:2}
.ol-cell{aspect-ratio:1;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1;background:linear-gradient(180deg,#16233f 0%,#0d1730 55%,#050a18 100%);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -3px 5px rgba(0,0,0,.85),inset 0 0 12px rgba(0,0,0,.7),0 3px 0 rgba(0,0,0,.7),0 6px 10px rgba(0,0,0,.5);position:relative;overflow:hidden;text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 8px currentColor;color:#f4f0fb}
.ol-cell::after{content:"";position:absolute;top:1px;left:5px;right:5px;height:38%;border-radius:8px 8px 60% 60% / 8px 8px 100% 100%;background:linear-gradient(180deg,rgba(255,255,255,.25),rgba(255,255,255,.05) 60%,transparent);pointer-events:none}
@media(min-width:400px){.ol-cell{font-size:28px}}
@media(min-width:440px){.ol-cell{font-size:30px}}
.ol-cell.landed{animation:olCellLand .42s cubic-bezier(.25,1.6,.5,1)}
@keyframes olCellLand{0%{opacity:0;filter:brightness(2.4) blur(1px)}60%{opacity:1;filter:brightness(1.4)}100%{opacity:1;filter:brightness(1)}}
.ol-cell.scatter{background:radial-gradient(circle at 50% 35%,#ef4444 0%,#dc2626 30%,#7f1d1d 70%,#1a0505 100%);box-shadow:0 0 18px rgba(220,38,38,.9),0 0 42px rgba(220,38,38,.55),inset 0 0 14px rgba(255,100,100,.55),inset 0 1px 0 rgba(255,255,255,.4),inset 0 -3px 5px rgba(0,0,0,.7),0 3px 0 rgba(0,0,0,.7);animation:olScatterPulse 1.3s ease-in-out infinite}
@keyframes olScatterPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.3) drop-shadow(0 0 10px rgba(220,38,38,.9))}}
.ol-cell.mult{background:linear-gradient(180deg,#7a4408 0%,#422006 55%,#1a0a02 100%);border-color:#fbbf24;font-weight:900;color:#fbbf24;font-size:13px;box-shadow:0 0 18px rgba(251,191,36,.9),0 0 42px rgba(251,191,36,.5),inset 0 0 14px rgba(251,191,36,.55),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -3px 5px rgba(0,0,0,.7),0 3px 0 rgba(0,0,0,.7);animation:olMultPulse 1.4s ease-in-out infinite}
@keyframes olMultPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35) drop-shadow(0 0 10px rgba(251,191,36,.9))}}
.ol-cell.win{animation:olWin3D .6s ease 2;border-color:#FFD54F;box-shadow:0 0 22px #FFD54F,0 0 44px rgba(255,213,79,.7),inset 0 0 16px rgba(255,213,79,.5),inset 0 1px 0 rgba(255,255,255,.4),0 3px 0 rgba(0,0,0,.7)}
@keyframes olWin3D{0%,100%{filter:brightness(1)}50%{filter:brightness(1.7) drop-shadow(0 0 14px #FFD54F)}}
.ol-cell.gone{animation:olGone3D .5s cubic-bezier(.5,0,.75,0) forwards}
@keyframes olGone3D{0%{opacity:1;filter:brightness(1)}30%{opacity:1;filter:brightness(4)}100%{opacity:0;filter:brightness(0)}}
.ol-cell.scatter-landed{animation:fsScatterLand 1.15s cubic-bezier(.3,1.5,.5,1);z-index:8}
@keyframes fsScatterLand{0%{transform:scale(.35) rotate(-180deg);filter:brightness(3.2) saturate(1.6)}30%{transform:scale(1.42) rotate(16deg);filter:brightness(2.6) saturate(1.4);box-shadow:0 0 44px #fbbf24,0 0 90px rgba(251,191,36,.85),inset 0 0 22px #fff}55%{transform:scale(1.18) rotate(-10deg);filter:brightness(1.9)}80%{transform:scale(1.05) rotate(4deg);filter:brightness(1.35)}100%{transform:scale(1) rotate(0);filter:brightness(1)}}
.ol-cell.scatter-landed::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid #fbbf24;animation:fsScatterRing 1.15s ease-out;pointer-events:none}
@keyframes fsScatterRing{0%{transform:scale(.3);opacity:1}100%{transform:scale(2.6);opacity:0}}
.ol-res{min-height:20px;font-weight:700;font-size:12.5px;margin-top:10px;color:var(--text-dim);text-align:center;padding:0 6px;position:relative;z-index:2}
.ol-res.win{color:var(--gold)}.ol-res.fs{color:#fbbf24}
.ol-bottomrow{display:grid;grid-template-columns:1.2fr 1fr 1.5fr;gap:8px;width:100%;margin-top:10px;position:relative;z-index:2}
.ol-col{display:flex;flex-direction:column;align-items:center;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.3));border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:8px 6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -2px 4px rgba(0,0,0,.4)}
.ol-col-title{font-size:8.5px;font-weight:800;color:rgba(255,255,255,.6);letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px}
.ol-buy-col{display:flex;align-items:center;justify-content:center;padding:6px 4px}
.ol-buy-btn{width:100%;padding:10px 6px;border-radius:10px;border:1px solid #22d3ee;background:linear-gradient(180deg,#22d3ee,#0ea5e9);color:#04253a;font:800 11px 'Outfit',sans-serif;letter-spacing:.02em;cursor:pointer;box-shadow:0 3px 0 #075985,0 6px 12px rgba(34,211,238,.35);text-align:center;line-height:1.2;margin-top:0}
.ol-buy-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #075985}
.ol-buy-btn small{display:block;font-size:8.5px;font-weight:700;opacity:.85;margin-top:2px}
.ol-bets-col{display:flex;flex-direction:column;align-items:center}
.ol-bets{display:flex;gap:4px;justify-content:center;width:100%;align-items:center;flex-wrap:nowrap}
.ol-betline{font-size:9px;color:rgba(255,255,255,.6);text-align:center;margin-top:6px;position:relative;z-index:2}
.ol-winbox{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.7);padding:10px 22px;border-radius:14px;background:linear-gradient(180deg,rgba(0,0,0,.88),rgba(0,0,0,.72));border:2px solid #FFD54F;box-shadow:0 0 24px rgba(251,191,36,.8),inset 0 0 12px rgba(251,191,36,.3);display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:none;opacity:0;transition:opacity .28s ease,transform .28s cubic-bezier(.2,1.4,.5,1);z-index:6;white-space:nowrap}
.ol-winbox.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ol-winbox-label{font-size:9px;font-weight:800;color:rgba(255,213,79,.8);letter-spacing:.12em}
.ol-winbox-val{font-size:26px;font-weight:900;color:#FFD54F;text-shadow:0 0 12px rgba(251,191,36,.9),0 2px 6px rgba(0,0,0,.9);font-variant-numeric:tabular-nums;line-height:1.1}
.ol-winbox-inline{position:relative !important;top:auto !important;left:auto !important;transform:none !important;width:100% !important;padding:6px 8px !important;white-space:normal !important;opacity:0;transition:opacity .3s ease}
.ol-winbox-inline.show{opacity:1 !important}
.ol-winbox-live{position:absolute;top:-10px;right:-10px;display:flex;align-items:center;gap:3px;padding:2px 7px;border-radius:999px;background:linear-gradient(180deg,#ef4444,#b91c1c);border:1px solid rgba(255,255,255,.5);color:#fff;font-size:8.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 0 12px rgba(239,68,68,.9),0 0 4px rgba(255,255,255,.6);opacity:0;transform:scale(.5);transition:opacity .18s ease,transform .25s cubic-bezier(.2,1.6,.4,1);pointer-events:none}
.ol-winbox-live.show{opacity:1;transform:scale(1);animation:olLiveBadge .9s ease-in-out infinite}
.ol-winbox-live::before{content:"";width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff,0 0 12px #fff;animation:olLiveDotBlink .7s ease-in-out infinite}
@keyframes olLiveBadge{0%,100%{filter:brightness(1)}50%{filter:brightness(1.4)}}
@keyframes olLiveDotBlink{0%,100%{opacity:1}50%{opacity:.25}}