.slot-page{max-width:580px}
.slot-page>.top{margin:10px 0 16px}
.slot-cover{display:flex;justify-content:center;align-items:center;gap:1%;background:#49303a}
.slot-art{display:block;stroke:none;fill:currentColor}
.slot-cover .slot-art{width:23%;height:69%;max-width:85px;transform:rotate(-8deg)}
.slot-cover .slot-art:nth-child(2){width:27%;transform:translateY(-3%)}
.slot-cover .slot-art:nth-child(3){transform:rotate(8deg)}
.slot-machine{padding:clamp(8px,2.2vw,14px);background:#4c2b38;border-radius:23px;box-shadow:0 6px 0 #302129}
.slot-board{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;aspect-ratio:4 / 3;overflow:hidden;background:#28222a;border-radius:14px}
.slot-reel{position:relative;min-width:0;overflow:hidden}
.slot-strip{position:absolute;inset:0;display:grid;grid-auto-rows:calc(100% / 3);will-change:transform}
.slot-cell{position:relative;min-height:0;padding:clamp(2px,.5vw,4px)}
.slot-cell>span{height:100%;display:grid;place-items:center;position:relative;background:#343039;border-radius:11px}
.slot-reel:nth-child(even) .slot-cell>span{background:#393039}
.slot-cell .slot-art{width:80%;height:80%;max-width:100%}
.slot-tag{position:absolute;bottom:5%;left:50%;transform:translateX(-50%);padding:2px 5px;border-radius:4px;font-size:14px;line-height:1;font-weight:800;letter-spacing:.02em}
.slot-tag.wild{background:#78374d;color:#fff1df}
.slot-tag.scatter{background:#695037;color:#ffe2a2}
.slot-cell.hit>span{background:#604351!important}
.slot-lines{position:absolute;inset:0;z-index:2;width:100%;height:100%;overflow:visible;pointer-events:none;fill:none;stroke:none}
.slot-result,.slot-controls,.slot-short{display:flex;align-items:center;justify-content:space-between;gap:10px}
.slot-result{min-height:47px;padding:6px 8px;color:#e8c6d0;line-height:1.2}
.slot-result>span:last-child{display:flex;align-items:center;gap:7px;flex-shrink:0}
.slot-result strong{color:#fff0cc}
.slot-controls{background:#252127;border-radius:15px;padding:10px clamp(12px,3.5vw,22px)}
.slot-bet{display:flex;align-items:center;gap:10px}
.slot-bet>div{display:grid;gap:3px;justify-items:center;min-width:54px;line-height:1.15}
.slot-bet>div>span{color:#cbbec6}
.slot-step{display:grid;place-items:center;width:44px;height:44px;background:#40353e;border-radius:50%;font-size:24px;color:#f6e6ec}
.slot-spin{display:grid;place-items:center;width:64px;height:64px;background:#f3d7aa;color:#31232b;border-radius:50%;box-shadow:0 3px 0 #98725a}
.slot-spin svg{width:38px;height:38px;stroke:none;fill:currentColor}
.slot-short{margin-top:18px;flex-wrap:wrap}
.slot-patterns{display:flex;gap:6px}
.slot-patterns svg{width:44px;height:34px;padding:3px;background:#3f333c;border-radius:4px;fill:#e79cb0;stroke:none}
.slot-table{width:100%;border-collapse:collapse;color:var(--ink);font-variant-numeric:tabular-nums}
.slot-table th,.slot-table td{padding:3px 5px;text-align:center;font-weight:550}
.slot-table th:first-child{text-align:left}
.slot-table th .slot-art{width:28px;height:28px;vertical-align:middle;margin-right:5px;display:inline-block}
@media(min-width:760px){.grid.modes:has([data-page="slots"]){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:759px){.mode:has(.slot-cover){grid-column:1/-1}.slot-cover .slot-art{max-width:68px}}
@media(max-width:360px){.slot-result{flex-wrap:wrap}.slot-controls{padding-inline:10px}.slot-bet{gap:5px}}

.slot-loader{min-height:min(64dvh,540px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}
.slot-provider{display:flex;align-items:center;gap:12px}
.slot-provider strong{font-size:24px;letter-spacing:-1px}.slot-provider strong>span{color:var(--rose)}
.slot-loader>p{color:var(--muted)}
.slot-loader-bar{width:min(240px,75%);height:5px;border-radius:4px;background:#3b2b34;overflow:hidden}
.slot-loader-bar i{display:block;width:100%;height:100%;background:var(--rose);transform-origin:left;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.slot-bonus-status{display:flex;justify-content:space-between;gap:10px;padding:5px 6px 12px;color:#f5d8a5;font-size:14px;font-weight:700}
.slot-line-message{display:flex;align-items:center;justify-content:center;gap:8px;min-height:43px;padding:8px 4px;text-align:center;color:#f5d7a1;line-height:1.25}
.slot-result{min-height:37px;padding:0 8px 10px}
.slot-result>span{color:var(--muted)}.slot-result>strong{color:#fff0cc}
.slot-controls .slot-spin:active{transform:scale(.96)}
.slot-bonus-offer{display:grid;gap:12px;padding:14px;margin-bottom:16px;border-radius:16px;background:#35252f}
.slot-bonus-meta{color:#e2c1cf;line-height:1.35}
.slot-buy{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;padding:12px 16px;border-radius:12px;background:#f3d7aa;color:#30232a}
.slot-buy-intro{display:grid;justify-items:center;text-align:center;gap:10px}
.slot-buy-intro .slot-art{width:88px;height:88px}
.slot-buy-intro>span{color:var(--muted)}
.slot-cell.hit>span{background:#634250!important;animation:slot-hit 1.05s ease-in-out infinite}
.slot-cell.hit .slot-art{animation:slot-symbol-win 1.05s ease-in-out infinite}
.slot-win-line{animation:slot-line-appear .24s ease-out both}
.slot-line-shadow{fill:none;stroke:#251c27;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
.slot-line-stroke{fill:none;stroke:#ffe0a2;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.slot-celebration{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;pointer-events:none;text-align:center;text-shadow:0 2px 1px #20121e,0 -2px 1px #20121e,2px 0 1px #20121e,-2px 0 1px #20121e,0 4px 14px #160e19;animation:slot-win-enter .4s cubic-bezier(.2,.8,.2,1)}
.slot-celebration[hidden]{display:none}
.slot-celebration>span{font-size:24px;font-weight:900;letter-spacing:1.5px;color:#ffdeb0}
.slot-celebration>strong{display:flex;align-items:center;justify-content:center;gap:8px;font-size:24px;font-weight:900;font-variant-numeric:tabular-nums;color:#fff0de}
@keyframes slot-hit{0%,100%{box-shadow:inset 0 0 0 2px #e6b87844}50%{box-shadow:inset 0 0 0 2px #ffe4ac}}
@keyframes slot-symbol-win{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes slot-line-appear{from{opacity:0}to{opacity:1}}
@keyframes slot-win-enter{0%{opacity:0;transform:translateY(8px) scale(.78)}65%{opacity:1;transform:translateY(-2px) scale(1.06)}100%{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.slot-cell.hit>span,.slot-cell.hit .slot-art,.slot-celebration{animation:none}.slot-win-line{animation:none}.slot-loader-bar i{transition:none}}
.slot-dropping>.slot-reel .slot-cell{opacity:0;transform:translateY(-300%);will-change:transform}
.slot-previous{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));pointer-events:none}
.slot-previous .slot-cell{opacity:1;transform:none}