@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600&display=swap";:root{font-family:Orbitron,Share Tech Mono,monospace;line-height:1.2;font-weight:400;color:#e6f6ff;background-color:#04060c;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{height:100%;overflow:hidden}body{margin:0;background:#04060c;position:fixed;width:100%;height:100vh;overscroll-behavior:none;touch-action:pan-x pan-y}button,select{font-family:inherit}select{appearance:none}:root{--bg-deep: #04060c;--glow-blue: #2dd4ff;--glow-amber: #ffb347;--text: #e6f6ff;--panel: rgba(4, 8, 16, .72);--panel-border: rgba(45, 212, 255, .25)}.app{position:relative;width:100vw;height:100vh;overflow:hidden;background:radial-gradient(circle at 50% 35%,#101c2f,#04060c 60%);padding:var(--desktop-edge);box-sizing:border-box}.game-canvas{position:absolute;top:var(--game-top);left:50%;width:var(--game-width);height:var(--game-height);aspect-ratio:auto;transform:translate(-50%);display:block;object-fit:contain}.hud{position:absolute;top:var(--hud-top);left:var(--hud-side);right:var(--hud-side);display:flex;justify-content:space-between;align-items:center;z-index:2;pointer-events:none;text-transform:uppercase;letter-spacing:.12em;font-size:1rem}.score{padding:6px 12px;border:1px solid rgba(255,255,255,.1);background:#05081080;box-shadow:0 0 16px #00000073;white-space:nowrap}.score-player{text-align:left}.score-ai{text-align:right}.score-player{color:var(--glow-blue);text-shadow:0 0 12px rgba(45,212,255,.6)}.score-ai{color:var(--glow-amber);text-shadow:0 0 12px rgba(255,179,71,.6)}.audio-toggle{z-index:3;pointer-events:auto;background:#060c16b3;border:1px solid rgba(45,212,255,.4);border-radius:10px;width:36px;height:36px;color:var(--text);font-size:1.1rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 0 14px #2dd4ff40;cursor:pointer}.audio-toggle:hover{box-shadow:0 0 18px #2dd4ff66}.hud-controls{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:inline-flex;gap:10px;align-items:center;z-index:3;pointer-events:auto}.panel{position:absolute;bottom:calc(var(--panel-bottom) + var(--panel-gap));left:50%;transform:translate(-50%);display:flex;gap:16px;align-items:flex-end;padding:12px 16px;width:var(--panel-width);min-width:var(--panel-min-width);background:linear-gradient(135deg,#08101ed1,#060a14b3);border:1px solid rgba(45,212,255,.4);border-radius:12px;box-shadow:0 0 22px #2dd4ff47,0 0 44px #2dd4ff29,0 0 26px #ffb3471f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2}.settings{display:flex;gap:12px;flex-wrap:nowrap}.reset-button{z-index:3;pointer-events:auto;background:#060c16b3;border:1px solid rgba(255,179,71,.45);border-radius:10px;width:36px;height:36px;color:var(--text);font-size:2.2rem;line-height:1;box-shadow:0 0 12px #ffb34733;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}.reset-button__icon{display:block;transform:translate(1.5px,-4px)}.reset-button:hover{box-shadow:0 0 18px #ffb34759}.reset-button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}.settings label{display:flex;flex-direction:column;gap:6px;white-space:nowrap;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:#e6f6ffb3}.custom-select{position:relative;display:inline-flex;min-width:150px}.custom-select__button{width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:18px;font-family:inherit;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:linear-gradient(135deg,#081220f2,#050c16eb);color:var(--text);border:1px solid rgba(45,212,255,.55);padding:8px 14px;border-radius:10px;box-shadow:inset 0 0 12px #2dd4ff1f,0 0 14px #2dd4ff3d;outline:none;cursor:pointer}.custom-select__button:focus-visible{border-color:#ffb347bf;box-shadow:0 0 16px #ffb34759,0 0 24px #2dd4ff59}.custom-select__caret{width:8px;height:8px;border-right:2px solid rgba(45,212,255,.9);border-bottom:2px solid rgba(45,212,255,.9);transform:rotate(45deg);filter:drop-shadow(0 0 6px rgba(45,212,255,.7))}.custom-select__menu{position:absolute;bottom:calc(100% + 8px);left:0;right:0;display:grid;gap:6px;padding:10px;background:#050c16f2;border:1px solid rgba(45,212,255,.5);border-radius:12px;box-shadow:0 0 18px #2dd4ff59,0 0 32px #2dd4ff33;z-index:5}.custom-select__option{font-family:inherit;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;padding:8px 10px;color:#e6f6ffd1;background:#081220e6;border:1px solid transparent;border-radius:8px;cursor:pointer;text-align:left}.custom-select__option:hover{border-color:#2dd4ff8c;color:var(--text)}.custom-select__option.is-selected{border-color:#ffb347a6;color:var(--text);box-shadow:0 0 12px #ffb34759}.custom-select--disabled .custom-select__button{opacity:.55;cursor:not-allowed;border-color:#2dd4ff40;box-shadow:none}.controls{font-size:.7rem;color:#e6f6ffa6;letter-spacing:.08em;text-transform:uppercase;display:flex;flex-wrap:wrap;justify-content:center;column-gap:6px;row-gap:4px;text-align:center;line-height:1.4;max-width:100%;overflow-wrap:normal}.controls__divider{opacity:.6}.overlay{position:absolute;top:var(--overlay-top);left:0;right:0;display:flex;align-items:flex-start;justify-content:center;pointer-events:none;z-index:3}.overlay-card{text-align:center;padding:14px 26px;background:#060c16c7;border:1px solid rgba(45,212,255,.5);box-shadow:0 0 20px #2dd4ff59,0 0 40px #2dd4ff40;pointer-events:auto}.overlay-action{margin-top:12px;padding:6px 14px;border-radius:999px;border:1px solid rgba(45,212,255,.6);background:linear-gradient(135deg,#081220f2,#050c16eb);color:var(--text);font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;box-shadow:0 0 12px #2dd4ff40,inset 0 0 10px #2dd4ff1f}.overlay-action:hover{border-color:#ffb347b3;box-shadow:0 0 16px #ffb34759,inset 0 0 12px #2dd4ff2e}.overlay-title{font-size:1.3rem;text-transform:uppercase;letter-spacing:.12em;color:var(--text);text-shadow:0 0 10px rgba(45,212,255,.55)}.overlay-subtitle{margin-top:4px;font-size:.9rem;letter-spacing:.08em;color:#e6f6ffb3}.overlay-card--win{padding:28px 40px;margin-top:18vh;background:#060c16e6;border:1px solid rgba(255,215,120,.7);box-shadow:0 0 24px #ffc87873,0 0 60px #ff787859,0 0 90px #2dd4ff40}.overlay-card--win .overlay-title{font-size:2.4rem;color:#fff2c4;text-shadow:0 0 14px rgba(255,220,150,.8),0 0 30px rgba(255,120,120,.5)}.overlay-card--win .overlay-subtitle{font-size:1.05rem;color:#ffebc8d9}.overlay-card--win{animation:win-pop .48s ease-out}@keyframes win-pop{0%{transform:scale(.86);opacity:0}to{transform:scale(1);opacity:1}}.orientation-lock,.mobile-controller{display:none}@media(min-width:821px){:root{--hud-top: clamp(16px, 3vh, 36px);--hud-side: clamp(16px, 3vw, 40px);--hud-height: clamp(34px, 6vh, 60px);--hud-gap: clamp(8px, 1.5vh, 16px);--overlay-top: calc(var(--game-top) + clamp(8px, 1.5vh, 16px));--panel-bottom: clamp(16px, 3vh, 40px);--panel-gap: clamp(10px, 2vh, 22px);--desktop-edge: clamp(16px, 2.5vw, 36px);--game-aspect: 1.6;--game-top: calc(var(--hud-top) + var(--hud-height) + var(--hud-gap));--game-bottom: var(--panel-bottom);--game-area-height: calc(100vh - var(--game-top) - var(--game-bottom));--game-max-width: calc(100vw - (var(--desktop-edge) * 2));--game-max-height: var(--game-area-height);--game-width: var(--game-max-width);--game-height: var(--game-max-height);--panel-max-width: calc(var(--game-width) - clamp(16px, 4vw, 40px));--panel-width: min(88vw, var(--panel-max-width));--panel-min-width: clamp(220px, 50vw, 360px)}}@media(max-width:820px),(pointer:coarse){:root{--mobile-top-offset: calc(6dvh + env(safe-area-inset-top, 0px)) ;--dpad-size: clamp(46px, 10.5vw, 72px);--dpad-gap: clamp(6px, 1.4vw, 12px);--mobile-controls-height: calc((var(--dpad-size) * 3) + (var(--dpad-gap) * 2));--mobile-bottom-gap: calc(24px + env(safe-area-inset-bottom, 0px)) ;--mobile-grid-padding: clamp(12px, 2.4dvh, 22px);--mobile-controls-clearance: clamp(12px, 2.4dvh, 22px);--desktop-edge: clamp(16px, 2.5vw, 36px);--hud-top: calc(10px + env(safe-area-inset-top, 0px)) ;--hud-side: clamp(10px, 4vw, 18px);--overlay-top: calc( var(--mobile-top-offset) + var(--mobile-grid-padding) + var(--mobile-controls-clearance) );--panel-bottom: calc( var(--mobile-controls-height) + var(--mobile-bottom-gap) + var(--mobile-grid-padding) + var(--mobile-controls-clearance) );--panel-gap: 0px;--game-aspect: .8;--game-top: calc(var(--mobile-top-offset) + var(--mobile-grid-padding));--game-bottom: calc( var(--mobile-controls-height) + var(--mobile-bottom-gap) + var(--mobile-grid-padding) );--game-area-height: calc(100dvh - var(--game-top) - var(--game-bottom));--game-max-width: calc(100vw - (var(--desktop-edge) * 2));--game-height: var(--game-area-height);--game-width: var(--game-max-width);--panel-max-width: calc(var(--game-width) - clamp(12px, 4vw, 24px));--panel-width: min(88vw, var(--panel-max-width));--panel-min-width: 0px}.app{height:100dvh}.game-canvas{top:var(--game-top);width:var(--game-width);height:var(--game-height);aspect-ratio:auto}.hud{left:50%;right:auto;width:min(100vw,var(--game-width));transform:translate(-50%);display:grid;grid-template-columns:1fr auto 1fr;column-gap:clamp(10px,3vw,24px);justify-items:center;align-items:center}.score{padding:4px 8px}.hud-controls{position:static;transform:none;gap:14px}.audio-toggle{right:auto;font-size:.9rem;padding:4px 8px}}@media(max-width:820px)and (orientation:landscape){.game-canvas,.hud,.panel,.overlay,.mobile-controller,.audio-toggle{visibility:hidden}.orientation-lock{display:flex;position:fixed;inset:0;z-index:20;align-items:center;justify-content:center;text-align:center;padding:24px;background:#02060eeb;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--text)}.orientation-lock__card{padding:18px 24px;border-radius:14px;border:1px solid rgba(45,212,255,.45);background:linear-gradient(135deg,#08101eeb,#060a14d9);box-shadow:0 0 18px #2dd4ff59,0 0 36px #2dd4ff33}.orientation-lock__title{font-size:1.2rem;letter-spacing:.12em;text-transform:uppercase}.orientation-lock__subtitle{margin-top:6px;font-size:.9rem;letter-spacing:.08em;color:#e6f6ffbf}}@media(max-width:820px),(pointer:coarse){.mobile-controller{display:flex;position:fixed;bottom:0;left:0;right:0;height:calc(var(--mobile-controls-height) + var(--mobile-bottom-gap) + var(--mobile-grid-padding));justify-content:flex-start;align-items:center;padding:0 4vw;z-index:10;pointer-events:none}.mobile-controller__pad{display:grid;grid-template-columns:repeat(3,auto);grid-template-rows:repeat(3,auto);gap:var(--dpad-gap);place-items:center;pointer-events:auto}.mobile-controller__button{width:var(--dpad-size);height:var(--dpad-size);background:linear-gradient(135deg,#081220f2,#050c16eb);border:2px solid rgba(45,212,255,.6);border-radius:12px;color:var(--glow-blue);font-size:1.8rem;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;letter-spacing:0;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;box-shadow:0 0 18px #2dd4ff4d,inset 0 0 12px #2dd4ff1a;transition:all .15s ease}.mobile-controller__center{width:var(--dpad-size);height:var(--dpad-size);pointer-events:none;grid-column:2;grid-row:2;border-radius:14px;background:radial-gradient(circle,rgba(45,212,255,.15),transparent 60%);box-shadow:inset 0 0 18px #2dd4ff26}.mobile-controller__button--up{grid-column:2;grid-row:1}.mobile-controller__button--left{grid-column:1;grid-row:2}.mobile-controller__button--right{grid-column:3;grid-row:2}.mobile-controller__button--down{grid-column:2;grid-row:3}.mobile-controller__button:active{background:linear-gradient(135deg,#2dd4ff40,#050c16eb);border-color:var(--glow-blue);box-shadow:0 0 28px #2dd4ff99,inset 0 0 20px #2dd4ff4d;transform:scale(.95)}.mobile-controller__button:disabled{opacity:.4;cursor:not-allowed}}@media(max-width:720px){.hud{font-size:.8rem}.panel{left:50%;right:auto;width:min(88vw,var(--panel-max-width));min-width:0;max-width:var(--panel-max-width);transform:translate(-50%);flex-direction:column;align-items:flex-start;padding:10px 14px}.settings{flex-direction:column;width:100%}.settings label,.custom-select{width:100%}.controls{display:none}}