:root{font-family:Inter,Segoe UI,system-ui,sans-serif;line-height:1.4;font-weight:500;color:#dfe9ff;background-color:#0f1828;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--crosshair-color: rgba(209, 234, 255, .9);--crosshair-glow: rgba(135, 210, 255, .8);--crosshair-size: 10;--crosshair-thickness: 2;--crosshair-gap: 4;--crosshair-opacity: .9;--crosshair-border-thickness: 1;--crosshair-dot-size: 4}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:rgba(80,110,150,.4) transparent}*::-webkit-scrollbar{width:4px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:#506e9666;border-radius:2px}*::-webkit-scrollbar-thumb:hover{background:#648cbe8c}*::-webkit-scrollbar-button{height:0!important;width:0!important;background:transparent!important;border:none!important;color:transparent!important}body{margin:0;width:100vw;height:100vh;overflow:hidden;background:#0f1828}body.pointer-locked{cursor:none}#app,#game-root{width:100%;height:100%}#game-root{position:relative}.game-canvas{position:absolute;inset:0;display:block}#hud{position:absolute;inset:0;pointer-events:none}#hud-left{position:absolute;top:16px;left:16px}.hud-bar{width:190px;height:16px;border-radius:10px;background:#141e2ebf;border:1px solid rgba(120,150,190,.4);overflow:hidden;padding:2px}.hud-bar-fill{height:100%;width:100%;background:linear-gradient(90deg,#48f0ff,#31c0ff);border-radius:8px;box-shadow:0 0 10px #56d7ffcc}#hud-top{position:absolute;top:16px;left:50%;transform:translate(-50%);display:flex;gap:12px}.hud-card{min-width:140px;padding:10px 16px;background:#1e2b42bf;border:1px solid rgba(120,150,190,.35);border-radius:8px;box-shadow:0 12px 24px #0a101c59}.hud-label{font-size:11px;letter-spacing:.2em;color:#d2e1ffbf;text-transform:uppercase}.hud-value{font-size:22px;margin-top:2px;color:#f4f7ff}#crosshair{position:absolute;inset:0;pointer-events:none;opacity:var(--crosshair-opacity)}.crosshair-line{position:absolute;background:var(--crosshair-color);box-shadow:none}#crosshair.crosshair-bordered .crosshair-line{outline:calc(var(--crosshair-border-thickness) * 1px) solid rgba(0,0,0,.8)}.crosshair-left,.crosshair-right{width:calc(var(--crosshair-size) * 1px);height:calc(var(--crosshair-thickness) * 1px);top:50%;transform:translateY(-50%)}.crosshair-left{right:50%;margin-right:calc(var(--crosshair-gap) * 1px)}.crosshair-right{left:50%;margin-left:calc(var(--crosshair-gap) * 1px)}.crosshair-top,.crosshair-bottom{width:calc(var(--crosshair-thickness) * 1px);height:calc(var(--crosshair-size) * 1px);left:50%;transform:translate(-50%)}.crosshair-top{bottom:50%;margin-bottom:calc(var(--crosshair-gap) * 1px)}.crosshair-bottom{top:50%;margin-top:calc(var(--crosshair-gap) * 1px)}.crosshair-dot{position:absolute;width:calc(var(--crosshair-dot-size) * 1px);height:calc(var(--crosshair-dot-size) * 1px);border-radius:50%;background:var(--crosshair-color);box-shadow:none;top:50%;left:50%;transform:translate(-50%,-50%)}#crosshair.crosshair-bordered .crosshair-dot{outline:calc(var(--crosshair-border-thickness) * 1px) solid rgba(0,0,0,.8)}#crosshair .crosshair-dot.crosshair-dot-hidden{display:none}#overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0a101c59;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}#overlay[data-state=none]{display:none}.overlay-card{display:none;background:#182234e6;border:1px solid rgba(110,150,190,.4);border-radius:16px;padding:32px 36px;min-width:400px;max-height:85vh;overflow-y:auto;text-align:center;box-shadow:0 20px 40px #0a101c99}#start-screen.overlay-card{width:720px;max-width:90vw;height:85vh;padding:16px 32px 14px;flex-direction:column;align-items:center;overflow:hidden;transition:opacity .2s ease}#start-screen.loading{opacity:0;pointer-events:none}#start-screen #start-btn{width:240px;margin-top:auto;margin-bottom:0;padding:14px 20px;flex-shrink:0}#overlay[data-state=start] #start-screen{display:flex}#overlay[data-state=lock] #lock-screen,#overlay[data-state=pause] #pause-screen,#overlay[data-state=end] #end-screen{display:block}#overlay[data-state=countdown]{background:#0a101c26;-webkit-backdrop-filter:none;backdrop-filter:none}#overlay[data-state=countdown] #countdown-screen{display:flex;align-items:center;justify-content:center;padding-bottom:30vh}#countdown-screen.overlay-card{background:transparent;border:none;box-shadow:none;min-width:auto;max-height:none;overflow:visible}.countdown-text{font-size:48px;font-weight:700;color:#fff;text-shadow:0 0 20px rgba(72,240,255,.8),0 4px 8px rgba(0,0,0,.6);animation:countdownPulse .6s ease-out}@keyframes countdownPulse{0%{transform:scale(1.3);opacity:.5}to{transform:scale(1);opacity:1}}.game-tips{background:#10182880;border:1px solid rgba(80,110,150,.25);border-radius:8px;padding:10px 12px;margin-bottom:12px;text-align:left}.tip-item{display:flex;align-items:baseline;font-size:12px;color:#c8d7f0b3;padding:3px 0}.tip-icon{width:22px;flex-shrink:0;text-align:center}.start-layout{display:flex;gap:24px;width:100%;text-align:left;overflow-y:auto;min-height:0}.start-left{width:240px;flex-shrink:0;display:flex;flex-direction:column;align-self:stretch}.start-header{display:flex;align-items:center;justify-content:center;width:100%;flex-shrink:0;position:relative;margin-bottom:20px}.start-header h1{margin:0}.start-header .lang-toggle{position:absolute;right:0;margin-bottom:0}.start-right{flex:1;min-width:0;display:flex;flex-direction:column}.settings-tabs{display:flex;gap:4px;margin-bottom:12px}.settings-tab{flex:1;padding:8px 6px;font-size:12px;font-weight:600;background:#32415a80;border:1px solid rgba(100,130,170,.25);color:#c8d7f0b3;box-shadow:none;border-radius:8px 8px 0 0;cursor:pointer}.settings-tab:hover{background:#3c506e99;color:#dceaffe6}.settings-tab.active{background:#4fb4ff33;border-color:#4fb4ff80;border-bottom-color:transparent;color:#fff}.tab-content{display:none;flex:1;overflow-y:auto}.tab-content.active{display:block}.target-preview{height:80px;background:#0a101cb3;border-radius:8px;margin-bottom:12px;display:flex;align-items:center;justify-content:center}.target-preview-ball{width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#35d9e4cc,#35d9e4);box-shadow:0 0 20px #35d9e480,0 0 40px #35d9e440}.target-color-btn{width:24px;height:24px;min-width:24px;padding:0;border-radius:50%;border:2px solid rgba(100,130,170,.4);cursor:pointer;transition:all .15s ease}.target-color-btn[data-color="#35d9e4"]{background:linear-gradient(135deg,#5ee8f0,#35d9e4)}.target-color-btn[data-color="#4eff4e"]{background:linear-gradient(135deg,#4eff4e,#32c832)}.target-color-btn[data-color="#ff8c42"]{background:linear-gradient(135deg,#ffb366,#ff8c42)}.target-color-btn[data-color="#ffd700"]{background:linear-gradient(135deg,#ffed80,gold)}.target-color-btn:hover{transform:scale(1.1);border-color:#96b4dc99}.target-color-btn.active{border-color:#79e7ff;box-shadow:0 0 12px #4fb4ff80;transform:scale(1.1)}@media(max-width:600px){#start-screen.overlay-card{width:auto;max-width:95vw}.start-layout{flex-direction:column;gap:16px}.start-left{width:100%}}.overlay-card h1{margin:0 0 12px;font-size:26px}.overlay-card p{margin:0 0 16px;color:#dceaffbf}.settings-group.collapsible{display:grid;grid-template-rows:0fr;opacity:0;margin-bottom:0;transition:grid-template-rows .25s ease,opacity .2s ease,margin-bottom .25s ease}.settings-group.collapsible>*{overflow:hidden}.settings-group.collapsible.expanded{grid-template-rows:1fr;opacity:1;margin-bottom:16px}.settings-group{margin-bottom:16px;text-align:left}.setting-label{display:block;font-size:12px;letter-spacing:.15em;color:#d2e1ffb3;text-transform:uppercase;margin-bottom:8px}.setting-row{display:flex;align-items:center;gap:12px}.setting-row input[type=range]{flex:1;height:6px;-webkit-appearance:none;appearance:none;background:#3c506e99;border-radius:3px;outline:none}.setting-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#79e7ff,#40a8ff);cursor:pointer;box-shadow:0 2px 8px #3296dc66}.setting-value{min-width:24px;font-size:16px;font-weight:600;color:#79e7ff}.setting-value-input{width:52px;min-width:52px;font-size:16px;font-weight:600;color:#79e7ff;background:#1e2a3c99;border:1px solid rgba(100,130,170,.3);border-radius:6px;padding:2px 6px;text-align:right;font-family:inherit;-moz-appearance:textfield}.setting-value-input::-webkit-outer-spin-button,.setting-value-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.setting-value-input:focus{outline:none;border-color:#79e7ff}.difficulty-buttons{display:flex;gap:8px}.diff-btn{flex:1;padding:8px 6px;font-size:12px;background:#32415a99;border:1px solid rgba(100,130,170,.3);color:#c8d7f0cc;box-shadow:none}.diff-btn:hover{background:#3c506eb3;border-color:#7896be80}.diff-btn.active{background:linear-gradient(135deg,#4fb4ff4d,#40a8ff33);border-color:#79e7ff;color:#fff;box-shadow:0 0 12px #4fb4ff4d}.category-buttons{display:flex;gap:8px}.category-btn{flex:1;padding:8px 6px;font-size:12px;background:#32415a99;border:1px solid rgba(100,130,170,.3);color:#c8d7f0cc;box-shadow:none}.category-btn:hover{background:#3c506eb3;border-color:#7896be80}.category-btn.active{background:linear-gradient(135deg,#4fb4ff4d,#40a8ff33);border-color:#79e7ff;color:#fff;box-shadow:0 0 12px #4fb4ff4d}.mode-buttons{display:flex;gap:8px;transition:opacity .15s ease}.mode-buttons.switching{opacity:0}.mode-btn{flex:1;padding:8px 6px;font-size:12px;background:#32415a99;border:1px solid rgba(100,130,170,.3);color:#c8d7f0cc;box-shadow:none}.mode-btn:hover{background:#3c506eb3;border-color:#7896be80}.mode-btn.active{background:linear-gradient(135deg,#4fb4ff4d,#40a8ff33);border-color:#79e7ff;color:#fff;box-shadow:0 0 12px #4fb4ff4d}.crosshair-colors{display:flex;gap:10px}.color-btn{width:24px;height:24px;min-width:24px;padding:0;border-radius:4px;border:2px solid rgba(100,130,170,.4);cursor:pointer;transition:all .15s ease}.color-btn[data-color="#d1eaff"]{background:linear-gradient(135deg,#fff,#d1eaff)}.color-btn[data-color="#4eff4e"]{background:linear-gradient(135deg,#4eff4e,#32c832)}.color-btn[data-color="#ff4e4e"]{background:linear-gradient(135deg,#ff4e4e,#c83232)}.color-btn[data-color="#ffff4e"]{background:linear-gradient(135deg,#ffff4e,#c8c832)}.color-btn:hover{transform:scale(1.1);border-color:#96b4dc99}.color-btn.active{border-color:#79e7ff;box-shadow:0 0 12px #4fb4ff80;transform:scale(1.1)}.history-btn{width:100%;margin-top:10px;padding:8px 12px;font-size:12px}.history-popup{display:none;position:absolute;inset:0;z-index:100;align-items:center;justify-content:center;background:#0a101c99;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.history-popup.visible{display:flex}.history-popup-card{background:#182234f2;border:1px solid rgba(110,150,190,.4);border-radius:12px;padding:20px 24px;width:360px;max-width:90vw;max-height:70vh;display:flex;flex-direction:column;box-shadow:0 20px 40px #0a101c99}.history-popup-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.history-popup-header h2{margin:0;font-size:18px;color:#f4f7ff}.history-popup-close{width:28px;height:28px;min-width:28px;padding:0;font-size:18px;line-height:1;background:#3c4b6480;color:#c8d7f0b3;border-radius:6px;box-shadow:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.history-popup-close:hover{background:#506482b3;color:#fff}.history-list{overflow-y:auto;min-height:0}.history-item{display:flex;align-items:center;padding:8px;font-size:13px;color:#c8d7f0d9;border-bottom:1px solid rgba(80,100,130,.15);gap:8px}.history-item:last-child{border-bottom:none}.history-item span:first-child{width:22px;flex-shrink:0;color:#96aac880;font-size:12px}.history-mode{font-size:11px;color:#96b4dc99;min-width:70px}.history-item strong{flex:1;color:#79e7ff;font-size:15px;text-align:right}.history-date{font-size:11px;color:#96aac866;min-width:40px}.history-acc{color:#b4c8e699;font-size:12px;min-width:36px;text-align:right}.history-empty{text-align:center;color:#96aac880;font-size:13px;padding:24px 0}.overlay-actions{display:flex;justify-content:center;gap:12px}button{border:none;border-radius:10px;padding:10px 20px;font-size:15px;font-weight:600;color:#0d1220;background:linear-gradient(135deg,#79e7ff,#40a8ff);box-shadow:0 8px 18px #3296dc59;cursor:pointer}button:hover{filter:brightness(1.05)}.results{display:grid;gap:10px;margin:16px 0 20px;text-align:left}.results div{display:flex;justify-content:space-between;color:#dceaffd9;font-size:15px}.results strong{color:#fff;font-size:17px}#hud-combo{position:absolute;right:24px;top:50%;transform:translateY(-50%);text-align:center;padding:16px 24px;background:#1e2b42cc;border:2px solid rgba(72,240,255,.5);border-radius:12px;box-shadow:0 0 20px #48f0ff4d;transition:all .15s ease}#hud-combo.hidden{display:none}.combo-count{font-size:48px;font-weight:700;color:#48f0ff;text-shadow:0 0 15px rgba(72,240,255,.8);line-height:1}.combo-label{font-size:12px;letter-spacing:.3em;color:#d2e1ffb3;margin-top:4px}.combo-multiplier{font-size:20px;font-weight:600;color:#79e7ff;margin-top:6px}#hud-combo.combo-mid{border-color:#ffc86499;box-shadow:0 0 25px #ffc86466}#hud-combo.combo-mid .combo-count{color:#ffc864;text-shadow:0 0 15px rgba(255,200,100,.8)}#hud-combo.combo-high{border-color:#ff8c42b3;box-shadow:0 0 30px #ff8c4280}#hud-combo.combo-high .combo-count{color:#ff8c42;text-shadow:0 0 15px rgba(255,140,66,.9)}#hud-combo.combo-max{border-color:#ff5050cc;box-shadow:0 0 35px #ff505099;animation:pulse .5s ease infinite alternate}#hud-combo.combo-max .combo-count{color:#ff5050;text-shadow:0 0 20px rgba(255,80,80,1)}#hud-combo.combo-max .combo-multiplier{color:#ff8080}@keyframes pulse{0%{transform:translateY(-50%) scale(1)}to{transform:translateY(-50%) scale(1.05)}}#score-popups{position:absolute;inset:0;pointer-events:none;overflow:hidden}.score-popup{position:absolute;font-size:18px;font-weight:700;color:#48f0ff;text-shadow:0 0 10px rgba(72,240,255,.8),0 2px 4px rgba(0,0,0,.5);animation:scoreFloat .8s ease-out forwards;pointer-events:none;white-space:pre-line;text-align:center;line-height:1.3}.score-popup.score-mid{font-size:20px;color:#ffc864;text-shadow:0 0 12px rgba(255,200,100,.9),0 2px 4px rgba(0,0,0,.5)}.score-popup.score-high{font-size:22px;color:#ff5050;text-shadow:0 0 15px rgba(255,80,80,1),0 2px 4px rgba(0,0,0,.5)}@keyframes scoreFloat{0%{opacity:1;transform:translate(-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-60px) scale(.8)}}.hud-value.warning{color:#ff5050!important;animation:timeWarning .5s ease infinite alternate}.hud-bar-fill.warning{background:linear-gradient(90deg,#ff5050,#ff8040)!important;box-shadow:0 0 15px #ff5050cc!important;animation:barWarning .3s ease infinite alternate}@keyframes timeWarning{0%{opacity:1;transform:scale(1)}to{opacity:.7;transform:scale(1.05)}}@keyframes barWarning{0%{box-shadow:0 0 10px #ff505099}to{box-shadow:0 0 20px #ff5050}}.crosshair-panel{background:#10182899;border:1px solid rgba(80,110,150,.3);border-radius:10px;padding:14px;margin-bottom:16px;text-align:left}.crosshair-panel .setting-label{margin-bottom:10px}.crosshair-preview{height:80px;background:#0a101cb3;border-radius:8px;margin-bottom:12px;position:relative;overflow:hidden}.crosshair-preview .preview-crosshair{position:absolute;inset:0}.crosshair-preview .preview-crosshair .crosshair-line{position:absolute;background:var(--crosshair-color);box-shadow:none}.crosshair-preview .preview-crosshair.crosshair-bordered .crosshair-line{outline:calc(var(--crosshair-border-thickness) * 1px) solid rgba(0,0,0,.8)}.crosshair-preview .preview-crosshair .crosshair-left,.crosshair-preview .preview-crosshair .crosshair-right{width:calc(var(--crosshair-size) * 1px);height:calc(var(--crosshair-thickness) * 1px);top:50%;transform:translateY(-50%)}.crosshair-preview .preview-crosshair .crosshair-left{right:50%;margin-right:calc(var(--crosshair-gap) * 1px)}.crosshair-preview .preview-crosshair .crosshair-right{left:50%;margin-left:calc(var(--crosshair-gap) * 1px)}.crosshair-preview .preview-crosshair .crosshair-top,.crosshair-preview .preview-crosshair .crosshair-bottom{width:calc(var(--crosshair-thickness) * 1px);height:calc(var(--crosshair-size) * 1px);left:50%;transform:translate(-50%)}.crosshair-preview .preview-crosshair .crosshair-top{bottom:50%;margin-bottom:calc(var(--crosshair-gap) * 1px)}.crosshair-preview .preview-crosshair .crosshair-bottom{top:50%;margin-top:calc(var(--crosshair-gap) * 1px)}.crosshair-preview .preview-crosshair .crosshair-dot{position:absolute;width:calc(var(--crosshair-dot-size) * 1px);height:calc(var(--crosshair-dot-size) * 1px);border-radius:50%;background:var(--crosshair-color);box-shadow:none;top:50%;left:50%;transform:translate(-50%,-50%)}.crosshair-preview .preview-crosshair.crosshair-bordered .crosshair-dot{outline:calc(var(--crosshair-border-thickness) * 1px) solid rgba(0,0,0,.8)}.crosshair-preview .preview-crosshair .crosshair-dot.crosshair-dot-hidden{display:none}.crosshair-panel .panel-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}.crosshair-panel .panel-row-label{font-size:12px;color:#c8d7f0bf;min-width:60px;flex-shrink:0}.crosshair-panel .panel-row input[type=range]{flex:1;height:5px;-webkit-appearance:none;appearance:none;background:#3c506e99;border-radius:3px;outline:none}.crosshair-panel .panel-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#79e7ff,#40a8ff);cursor:pointer;box-shadow:0 2px 6px #3296dc66}.crosshair-panel .panel-row .panel-row-value{min-width:28px;font-size:13px;font-weight:600;color:#79e7ff;text-align:right}.color-picker-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}.color-picker-row .color-btn{width:22px;height:22px;min-width:22px}.color-picker-row input[type=color]{width:22px;height:22px;padding:0;border:2px solid rgba(100,130,170,.4);border-radius:4px;background:none;cursor:pointer;-webkit-appearance:none;appearance:none;overflow:hidden}.color-picker-row input[type=color]::-webkit-color-swatch-wrapper{padding:0}.color-picker-row input[type=color]::-webkit-color-swatch{border:none;border-radius:2px}.toggle-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.toggle-row .toggle-label{font-size:12px;color:#c8d7f0bf}.toggle-switch{position:relative;width:36px;height:20px;background:#32415ab3;border-radius:10px;cursor:pointer;transition:background .2s ease;border:1px solid rgba(80,110,150,.3);flex-shrink:0}.toggle-switch:after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#b4c8dcb3;transition:transform .2s ease,background .2s ease}.toggle-switch.active{background:#4fb4ff66;border-color:#79e7ff}.toggle-switch.active:after{transform:translate(16px);background:#79e7ff}.panel-sub-row{display:none}.panel-sub-row.visible{display:flex}.secondary-btn{background:#3c4b64b3;color:#dceaffe6;box-shadow:0 4px 12px #0a101c4d}.secondary-btn:hover{background:#4b5c78cc}.hint-text{font-size:12px;color:#c8d7f073;margin-top:12px;margin-bottom:0}.lang-toggle{display:flex;justify-content:center;gap:4px;margin-bottom:14px}.lang-btn{padding:4px 12px;font-size:12px;font-weight:600;background:#32415a80;color:#c8d7f0a6;border:1px solid rgba(100,130,170,.25);border-radius:6px;box-shadow:none;cursor:pointer;min-width:44px}.lang-btn:hover{background:#3c506e99;color:#dceaffd9}.lang-btn.active{background:#4fb4ff40;border-color:#79e7ff;color:#fff;box-shadow:0 0 8px #4fb4ff40}