*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;font-size:12px;background:#1a1d29;color:#b1b6c6;min-height:100vh;margin:0;padding:0}.container{max-width:1400px;margin:0 auto;padding:15px;height:100vh;display:flex;flex-direction:column}header{background:linear-gradient(135deg,#1a1d29,#2d3748);color:#fff;padding:20px;text-align:center;border-radius:15px 15px 0 0;position:relative}header h1{margin:0;color:#ffb017;font-size:2.5rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.3)}.logout-btn{position:absolute;top:20px;right:20px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:8px 16px;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.logout-btn:hover{background:#fff3;border-color:#fff6;transform:translateY(-1px)}.logout-btn:active{transform:translateY(0)}main{flex:1;display:flex;flex-direction:column}.game-info{margin-bottom:5px;flex-shrink:0}.info-grid{display:flex;justify-content:center;gap:10px;margin-bottom:10px}.info-item{text-align:center;background:#ffffff1a;padding:10px 20px;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);min-width:120px}.info-label{color:#fffc;margin-bottom:5px;text-transform:uppercase}.info-value{font-weight:700;color:#ffb017}.info-hint{font-size:.7rem;color:#fff9;margin-top:2px;font-style:italic}.grid-size-control{text-align:center;background:#ffffff1a;padding:10px 20px;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);min-width:330px}.control-label{color:#ffffffe6;margin-bottom:8px;font-size:.8rem;font-weight:700}.control-label #gridSizeValue{color:#ffb017;font-weight:700}.grid-size-slider{width:100%;height:6px;border-radius:3px;background:#fff3;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-size-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#ffb017;cursor:pointer;border:2px solid rgba(255,255,255,.8);box-shadow:0 2px 6px #0000004d}.grid-size-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#ffb017;cursor:pointer;border:2px solid rgba(255,255,255,.8);box-shadow:0 2px 6px #0000004d}.grid-size-slider::-webkit-slider-track{background:#fff3;border-radius:3px;height:6px}.grid-size-slider::-moz-range-track{background:#fff3;border-radius:3px;height:6px}.distance-multiplier-control{text-align:center;background:#ffffff1a;padding:10px 20px;border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);min-width:230px}.control-label #distanceMultiplierValue{color:#ffb017;font-weight:700}.distance-multiplier-input{width:100%;height:32px;border-radius:6px;background:#ffffff1a;border:1px solid rgba(255,255,255,.3);color:#ffb017;font-size:.9rem;font-weight:700;text-align:center;outline:none;transition:all .2s ease}.distance-multiplier-input:focus{border-color:#ffb017;background:#ffffff26;box-shadow:0 0 0 2px #ffb01733}.distance-multiplier-input::-webkit-inner-spin-button,.distance-multiplier-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.distance-multiplier-input[type=number]{-moz-appearance:textfield}.multiplier-info{text-align:center;background:#ffffff0d;padding:8px 15px;border-radius:8px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.1);margin:0 auto;max-width:400px}.multiplier-info .info-label{color:#ffffffe6;margin-bottom:3px;font-size:.8rem;font-weight:700}.multiplier-info .info-text{color:#ffb017;font-size:.75rem;font-weight:500}.game-layout{display:flex;gap:15px;flex:1;min-height:0}.game-area{background:#1a1d29;border-radius:15px;padding:0;flex:1;display:flex;flex-direction:column;min-width:0}.grid-container{position:relative;width:100%;flex:1;border:2px solid rgba(0,0,0,.3);border-radius:10px;overflow:hidden;background:#ffffff1a;min-height:400px}.popup-error{position:fixed;background:#ff4949;color:#fff;padding:15px 20px;border-radius:10px;font-weight:700;z-index:10000;box-shadow:0 4px 15px #0000004d;animation:slideInRight .3s ease-out}.popup-success{position:fixed;background:#72f238b3;color:#fff;padding:15px 20px;border-radius:10px;font-weight:700;z-index:10000;box-shadow:0 4px 15px #0000004d;animation:slideInRight .3s ease-out}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@media (max-width: 768px){.container{padding:10px}header h1{font-size:2rem}.info-grid{flex-direction:column;align-items:center;gap:15px}.info-item{min-width:200px}.controls{flex-direction:column;align-items:center}.btn{width:200px}}.history-panel{width:350px;background:#0000004d;border-radius:15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);overflow:hidden;display:flex;flex-direction:column;flex-shrink:0;max-height:calc(100vh - 150px)}.history-header{padding:15px 20px;background:#ffffff1a;border-bottom:1px solid rgba(255,255,255,.2);flex-shrink:0}.history-header h3{margin:0 0 15px;color:#ffb017;font-size:1.2rem;text-align:center}.history-filters{display:flex;gap:8px;justify-content:center}.filter-btn{background:#ffffff1a;color:#fffc;border:1px solid rgba(255,255,255,.2);padding:6px 12px;border-radius:6px;cursor:pointer;font-size:.8rem;font-weight:500;transition:all .3s ease}.filter-btn:hover{background:#fff3;border-color:#fff6}.filter-btn.active{background:#ffb017;color:#fff;border-color:transparent}.history-content{flex:1;overflow-y:auto;padding:0;min-height:0}.history-list{padding:0}.history-item{display:flex;flex-direction:column;padding:15px 20px;border-bottom:1px solid rgba(255,255,255,.1);transition:background-color .3s ease;position:relative}.history-item:hover{background:#ffffff0d}.history-item:last-child{border-bottom:none}.history-item:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px}.history-item.pending:before{background:#e2b61c}.history-item.hit:before{background:#72f237}.history-item.miss:before{background:#ff4949}.history-info{display:flex;flex-direction:column;gap:6px;flex:1}.history-main-content{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.history-time{font-size:.75rem;color:#fff9}.history-bet{font-weight:700;color:#ffb017;font-size:.9rem}.history-target{font-size:.8rem;color:#fffc;line-height:1.3}.history-result{text-align:right;display:flex;flex-direction:column;gap:6px;align-items:flex-end;min-width:120px}.history-amount{font-weight:700;font-size:1rem}.history-amount.win{color:#72f237}.history-amount.loss{color:#ff4949}.history-amount.pending{color:#e2b61c}.history-balance{font-size:.75rem;color:#fff9}.history-status{padding:2px 8px;border-radius:12px;font-size:.5rem;font-weight:700;text-transform:uppercase;text-align:center}.history-status.pending{background:#e2b61c33;color:#e2b61c;border:1px solid rgba(226,182,28,.4)}.history-status.hit{background:#72f23733;color:#72f237;border:1px solid rgba(114,242,55,.4)}.history-status.miss{background:#ff494933;color:#ff4949;border:1px solid rgba(255,73,73,.4)}.balance-change{animation:balancePulse .6s ease-in-out}@keyframes balancePulse{0%{transform:scale(1)}50%{transform:scale(1.2);color:gold}to{transform:scale(1)}}.history-empty{text-align:center;padding:40px 20px;color:#fff9;font-style:italic}@media (max-width: 1200px){.game-layout{flex-direction:column}.history-panel{width:100%;max-height:calc(50vh - 100px)}}@media (max-width: 768px){.container{padding:10px}header h1{font-size:2rem}.info-grid{flex-direction:column;align-items:center;gap:15px}.info-item{min-width:200px}.controls{flex-direction:column;align-items:center}.btn{width:200px}.history-header{flex-direction:column;gap:10px;text-align:center}.history-panel{max-height:calc(40vh - 80px)}.history-item{flex-direction:column;align-items:flex-start;gap:8px}.history-main-content{flex-direction:column;gap:10px}.history-result{text-align:left;width:100%;align-items:flex-start}}.password-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#1a1d29,#2d3748);display:flex;justify-content:center;align-items:center;z-index:9999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.password-container{background:#ffffff1a;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:40px;text-align:center;box-shadow:0 25px 50px #0000004d;max-width:400px;width:90%}.password-header h2{color:#ffb017;margin:0 0 10px;font-size:28px;font-weight:700}.password-header p{color:#b1b6c6;margin:0 0 30px;font-size:16px}.password-form{display:flex;flex-direction:column;gap:20px;margin-bottom:20px}.password-input{padding:15px 20px;border:2px solid rgba(255,176,23,.3);border-radius:12px;background:#ffffff1a;color:#fff;font-size:16px;outline:none;transition:all .3s ease}.password-input:focus{border-color:#ffb017;box-shadow:0 0 20px #ffb0174d}.password-input::placeholder{color:#b1b6c6b3}.password-submit{padding:15px 30px;background:linear-gradient(135deg,#ffb017,#ff8c00);border:none;border-radius:12px;color:#1a1d29;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:1px}.password-submit:hover{transform:translateY(-2px);box-shadow:0 10px 25px #ffb01766}.password-submit:active{transform:translateY(0)}.password-error{color:#ff4949;font-size:14px;min-height:20px;opacity:0;transition:opacity .3s ease}.password-error.show{opacity:1}#gameContainer{display:none}#gameContainer.authenticated{display:block}