body{background-size:100%;margin:0;height:100vh}#app{height:100%;box-sizing:border-box}.reel-shadow-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:8;border-radius:12px;background:linear-gradient(to bottom,#000000e6,#00000040 10%,#0000 25%,#0000 75%,#00000040 90%,#000000e6);margin:66px 40px 60px;mix-blend-mode:multiply;filter:blur(1px)}.reel-container{position:relative;display:inline-block;box-sizing:content-box;padding:66px 40px 60px}.slot-canvas{display:block;border:6px solid #38070F;border-radius:12px;box-shadow:inset 0 0 10px #0a0202b3;-webkit-user-select:none;user-select:none;z-index:2;position:relative}.reel-frame-img{position:absolute;top:0;z-index:12;left:0;width:100%;z-index:10;height:100%;object-fit:contain;pointer-events:none;transform-origin:center center}.slot-wrapper{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:1rem;justify-content:center;width:100%;min-height:100vh;box-sizing:border-box;background-color:#3a2a1a;background-size:cover;background-image:url(/images/bg.webp);font-family:Roboto Slab,serif}.loading-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#000000b3;padding:20px 30px;border-radius:10px;z-index:20}.loading-text{color:#fff;font-size:1.2rem;font-weight:700}.hud{position:absolute;bottom:2.5%;z-index:100;display:flex;gap:1rem;color:#4a2d14;padding:.5rem 1rem;border-radius:12px;flex-wrap:wrap;justify-content:center;width:100%;max-width:500px;padding-left:10%;padding-right:10%;left:50%;transform:translate(-50%)}.hud .hud-item:nth-child(1){margin-right:auto}.hud-item{text-align:center;display:flex;gap:10px;align-items:center;justify-content:center}.label{font-family:Oswald,sans-serif;font-size:.85rem;font-weight:600;color:#e6d7b9;text-transform:uppercase;letter-spacing:1px;text-shadow:0 1px 2px rgba(0,0,0,.7)}.value{font-family:Roboto Slab,serif;font-size:1.3rem;font-weight:700;color:gold;text-shadow:0 1px 2px rgba(0,0,0,.8),0 0 4px rgba(255,215,0,.6)}.value.highlight{color:#c0392b}.controls{position:relative;display:flex;z-index:2;width:100%;max-width:560px}.auto-spin-btn{position:absolute;border:1px solid black;width:14.7%;height:29%;left:12.6%;bottom:33%;background:#000;border-radius:11px;opacity:0;cursor:pointer}.auto-spin-btn:hover{opacity:.5;transition:.1s ease-in-out}.bet-btn{position:absolute;border:1px solid black;width:10.5%;height:29%;left:29.4%;bottom:33%;background:#000;border-radius:11px;opacity:0;cursor:pointer}.bet-btn:hover{opacity:.5;transition:.1s ease-in-out}.maxbet-btn{position:absolute;border:1px solid black;width:26.3%;height:29%;left:60.7%;bottom:33%;background:#000;border-radius:11px;opacity:0;cursor:pointer}.maxbet-btn:hover{opacity:.5;transition:.1s ease-in-out}.spin-btn{position:absolute;border:none;width:18.3%;height:85%;left:50%;transform:translate(-50%);border-radius:50%;bottom:10%;cursor:pointer;box-shadow:0 0 10px #f00c,0 0 20px #f009,0 0 40px #f006;transition:box-shadow .3s ease-in-out,transform .2s}.spin-btn:hover{box-shadow:0 0 15px red,0 0 30px #ff0000e6,0 0 60px #ff0000b3,0 0 90px #ff000080,inset 0 0 40px #ffc0cb1c,inset 0 0 80px #ffc0cb14,inset 0 0 140px #ffc0cb14}.spin-btn:active{box-shadow:none}.btn{font-family:Oswald,sans-serif;background:linear-gradient(145deg,#2c3e50,#233140);color:#ecf0f1;border:2px solid #1a252f;border-bottom-width:4px;border-radius:10px;white-space:nowrap;padding:.6rem 1rem;min-width:80px;min-height:44px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all .1s ease-out;flex-grow:1;max-width:150px}.btn:hover:not(:disabled){background:linear-gradient(145deg,#34495e,#2c3e50);transform:translateY(-1px);box-shadow:0 6px 18px #00000080}.btn:active:not(:disabled){transform:translateY(1px);border-bottom-width:2px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:linear-gradient(145deg,#e74c3c,#c0392b);border-color:#a83228}.btn--primary:hover:not(:disabled){background:linear-gradient(145deg,#c0392b,#9e2c22)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background-color:#fdf5e6;background-image:url(https://www.transparenttextures.com/patterns/old-paper.png);color:#3d291a;padding:1.5rem;border-radius:16px;max-width:90vw;width:100%;text-align:center;border:8px solid #c69d00;box-shadow:0 10px 40px #000000b3;box-sizing:border-box}.modal h2{font-family:Playfair Display,serif;font-size:1.8rem;color:#c0392b;margin-bottom:1rem}.modal p{margin-bottom:.5rem}.modal .btn{margin-top:1.5rem}.symbol-grid{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.symbol-item{text-align:center}.symbol-icon{width:40px;height:40px}@media (min-width: 500px) and (max-width: 565px){.reel-container{transform:scale(.9)}}@media (min-width: 450px) and (max-width: 500px){.reel-container{transform:scale(.8)}}@media (min-width: 400px) and (max-width: 450px){.reel-container{transform:scale(.7)}}@media (min-width: 350px) and (max-width: 400px){.reel-container{transform:scale(.6)}}@media (min-width: 300px) and (max-width: 350px){.reel-container{transform:scale(.5)}}