.container{width:95vw;max-width:95vw;height:100vh;margin:0 auto;padding:clamp(15px,5vw,40px);background:#fff;border-radius:20px;box-shadow:0 20px 60px #0000004d;text-align:center;display:flex;flex-direction:column;justify-content:flex-start}h1{color:#333;margin-bottom:clamp(15px,3vh,30px);font-size:clamp(1.8em,5vw,2.5em)}.stats-section{display:flex;gap:clamp(10px,3vw,20px);margin-bottom:clamp(15px,3vh,30px);justify-content:center;flex-wrap:wrap}.stat{background:#f5f5f5;padding:clamp(10px,2vw,25px) clamp(12px,3vw,25px);border-radius:8px;text-align:center;min-width:100px}.stat label{display:block;margin:0 0 8px;color:#666;font-size:clamp(10px,2vw,12px);font-weight:600;text-transform:uppercase;letter-spacing:1px}.stat-value{font-size:clamp(20px,4vw,28px);font-weight:700;color:#667eea;margin:0}.stat select{padding:clamp(6px,1.5vw,12px);border:2px solid #ddd;border-radius:6px;font-size:clamp(14px,2.5vw,16px);cursor:pointer;background:#fff;margin:0;transition:border-color .3s}.stat select:hover{border-color:#667eea}.stat select:focus{outline:none;border-color:#667eea}.stat select:disabled{opacity:.6;cursor:not-allowed}.slot-machine{margin:clamp(15px,3vh,30px) 0 0 0;padding:clamp(10px,2vw,20px);background:linear-gradient(135deg,#667eea,#764ba2);border-radius:15px;transition:transform .3s;display:flex;align-items:center;justify-content:center;flex-direction:column}.slot-machine.portrait-mode{flex-direction:row}.slot-machine.portrait-mode .grid-container{display:grid;grid-template-columns:repeat(3,auto);gap:clamp(8px,2vw,12px);width:fit-content;margin:0 auto}.slot-machine.portrait-mode .grid-row{display:contents}.slot-machine.winner{animation:pulse .5s ease-in-out 3 forwards}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.reel-container{display:flex;flex-direction:column;gap:12px}.grid-container{display:flex;flex-direction:column;gap:clamp(8px,2vw,12px)}.grid-row{display:flex;gap:clamp(8px,2vw,12px);justify-content:center}.grid-cell{width:clamp(40px,12vw,220px);height:clamp(40px,12vw,220px);background:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 15px #0003;border:2px solid #ddd;transition:all .3s ease;aspect-ratio:1}.grid-cell.winning{background:linear-gradient(135deg,gold,#ffed4e);border:2px solid #ffc700;box-shadow:0 0 20px #ffd700cc,inset 0 0 10px #fff6;animation:winningGlow .6s ease-in-out infinite;transition:box-shadow .15s ease}@keyframes winningGlow{0%,to{transform:scale(1);box-shadow:0 0 20px #ffd700cc,inset 0 0 10px #fff6}50%{transform:scale(1.08);box-shadow:0 0 30px gold,inset 0 0 15px #fff9}}.reel-display,.cell-display{font-size:clamp(32px,9vw,190px);font-weight:700;animation:spin .8s ease-in-out}@keyframes spin{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.btn-spin{padding:clamp(10px,2vh,20px) clamp(25px,5vw,50px);font-size:clamp(14px,3vw,18px);font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:10px;cursor:pointer;transition:transform .2s,box-shadow .2s;margin:clamp(10px,2vh,20px) 0}.btn-spin:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 10px 25px #667eea66}.btn-spin:disabled{opacity:.6;cursor:not-allowed}.btn-spin.spinning{animation:buttonPulse .6s ease-in-out infinite}@keyframes buttonPulse{0%,to{transform:scale(1)}50%{transform:scale(.95)}}.winner-message{font-size:clamp(16px,4vw,24px);color:#ffc107;font-weight:700;margin:0;animation:bounce .6s ease-in-out infinite;display:flex;flex-direction:column;align-items:center;justify-content:center}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.error-message{color:#e74c3c;font-weight:600;font-size:clamp(12px,2vw,14px);margin:10px 0 0}.pattern-counter{display:block;font-size:14px;color:orange;margin-top:8px;font-weight:600}.bonus-stat{background:linear-gradient(135deg,gold,#ffed4e);border:2px solid #ffc700;transition:transform .3s ease,visibility .3s ease}.bonus-stat label{color:#b8860b}.bonus-stat .stat-value{color:#ff6b00}.spinner-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.spinner-container{background:#fff;border-radius:20px;padding:clamp(25px,5vw,40px);width:90vw;max-width:500px;box-shadow:0 20px 60px #0006;text-align:center}.spinner-container h2{font-size:clamp(24px,5vw,32px);color:#ff6b00;margin-bottom:clamp(15px,3vw,20px);text-transform:uppercase;letter-spacing:2px}.tiles-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(10px,2vw,15px);margin:clamp(20px,4vw,30px) auto;max-width:300px;width:90%}.bonus-tile{background:linear-gradient(135deg,#667eea,#764ba2);border:3px solid #ddd;border-radius:12px;padding:16px;text-align:center;cursor:default;transform:scale(1);min-height:90px;display:flex;flex-direction:column;justify-content:center}.bonus-tile.selected{background:linear-gradient(135deg,gold,#ffed4e);border:3px solid #ffc700;box-shadow:0 0 20px #ffd700cc,0 0 40px #ffd70066;animation:tilePulse .3s ease-out}@keyframes tilePulse{0%{box-shadow:0 0 20px #ffd700cc,0 0 40px #ffd70066}50%{box-shadow:0 0 30px gold,0 0 60px #ffd70099}to{box-shadow:0 0 20px #ffd700cc,0 0 40px #ffd70066}}.tile-text{font-weight:700;font-size:clamp(12px,2.5vw,16px);color:#fff;margin-bottom:8px;text-transform:uppercase;letter-spacing:1px}.bonus-tile.selected .tile-text{color:#333}.tile-multiplier{font-size:clamp(16px,3vw,20px);font-weight:700;color:#ffc700}.bonus-tile.selected .tile-multiplier{color:#ff6b00}.spinner-result{margin-top:clamp(15px,2vw,20px);padding-top:clamp(15px,2vw,20px);border-top:2px solid #eee}.notification-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:999;padding:20px}.notification-modal{background:#fff;border-radius:20px;padding:clamp(25px,5vw,40px);width:90vw;max-width:500px;box-shadow:0 20px 60px #0006;text-align:center}.btn-continue{padding:clamp(10px,1.5vh,15px) clamp(20px,5vw,40px);font-size:clamp(14px,2.5vw,16px);font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;cursor:pointer;transition:transform .2s,box-shadow .2s;margin-top:clamp(10px,2vw,15px)}.btn-continue:hover{transform:translateY(-3px);box-shadow:0 10px 25px #667eea66}.bonus-spins-notification{margin:0;padding:clamp(15px,2vw,25px);background:linear-gradient(135deg,#ffc107,#ff9800);border-radius:12px;box-shadow:0 5px 20px #ffc10766;animation:slideInDown .5s ease-out;display:flex;align-items:center;justify-content:center}.notification-text{margin:0;font-size:clamp(18px,4vw,24px);font-weight:700;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.2)}@keyframes slideInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.spin-history{background:#f5f5f5;padding:clamp(10px,2vw,20px);border-radius:8px;min-width:150px}.history-table{width:100%;border-collapse:collapse;font-size:clamp(11px,1.5vw,13px)}.history-table thead{background:#e0e0e0}.history-table th{padding:6px 4px;text-align:center;font-weight:600;text-transform:uppercase;font-size:clamp(9px,1vw,11px);letter-spacing:.5px}.history-table th:first-child{padding:6px 2px}.history-table td{padding:6px 4px;text-align:center;border-bottom:1px solid #ddd}.history-table td:first-child{padding:6px 2px;max-width:60px;overflow:hidden;text-overflow:ellipsis}.history-table tbody tr:hover{background:#efefef}.sidebar{position:fixed;top:0;left:0;height:100vh;width:350px;background:#fff;box-shadow:2px 0 15px #0003;padding:30px 20px;overflow-y:auto;transform:translate(-100%);transition:transform .3s ease;z-index:999}.sidebar.open{transform:translate(0)}.spin-history-sidebar{margin-bottom:20px;max-height:400px;overflow-y:auto}.welcome-screen{width:100vw;height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;padding:20px;box-sizing:border-box}.welcome-container{background:#fff;border-radius:20px;padding:clamp(30px,5vw,60px);box-shadow:0 20px 60px #0000004d;max-width:500px;width:100%;animation:slideIn .5s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.welcome-title{color:#333;font-size:clamp(1.8em,5vw,2.5em);margin:0 0 15px;text-align:center}.welcome-subtitle{color:#666;font-size:clamp(14px,3vw,16px);margin:0 0 40px;text-align:center;line-height:1.6}.balance-input-section{margin-bottom:40px}.balance-label{display:block;color:#333;font-size:clamp(12px,2.5vw,14px);font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.currency-input-wrapper{position:relative;display:flex;align-items:center;margin-bottom:12px}.currency-symbol{position:absolute;left:16px;color:#667eea;font-weight:700;font-size:clamp(18px,4vw,24px);pointer-events:none}.balance-input{width:100%;padding:12px 16px 12px 40px;font-size:clamp(14px,3vw,16px);border:2px solid #e0e0e0;border-radius:8px;transition:border-color .3s ease;box-sizing:border-box}.balance-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 8px #667eea33}.balance-input::placeholder{color:#999}.balance-info{margin:8px 0 0;color:#999;font-size:clamp(12px,2.5vw,13px);text-align:center}.error-message{color:#e74c3c;font-size:clamp(12px,2.5vw,13px);margin:8px 0;text-align:center}.start-button{width:100%;padding:clamp(12px,2.5vw,16px);background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:clamp(14px,3vw,18px);font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 4px 15px #667eea4d}.start-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.start-button:active{transform:translateY(0)}@media (max-height: 600px){.welcome-container{padding:20px}.welcome-subtitle,.balance-input-section{margin-bottom:25px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;display:flex;justify-content:center;align-items:center}#root{width:100%}
