:root{color-scheme:dark;--ink: #fff8d8;--muted: #9fb4c2;--panel: rgba(5, 12, 18, .78);--panel-strong: rgba(5, 10, 16, .92);--line: rgba(255, 218, 128, .46);--accent: #ffcb66;--danger: #ff6648;--shadow: 0 18px 60px rgba(0, 0, 0, .45);--font-command: "Stencil", "Copperplate", Impact, "Arial Black", sans-serif;--font-readout: "Courier New", "Lucida Console", monospace;font-family:var(--font-command);background:#06131d}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#06131d;overscroll-behavior:none;touch-action:none;-webkit-text-size-adjust:100%}body{display:grid;place-items:center;touch-action:none;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none}button,input{font:inherit}[hidden]{display:none!important}.app-shell{position:relative;width:100vw;height:100vh;height:100dvh;overflow:hidden;background:#06131d;box-shadow:var(--shadow)}#game-canvas{display:block;width:100%;height:100%;background:#06131d;touch-action:none}.build-stamp{position:absolute;z-index:20;right:max(5px,env(safe-area-inset-right));bottom:max(4px,env(safe-area-inset-bottom));color:#fff8d85c;font-family:var(--font-readout);font-size:9px;font-weight:700;line-height:1;pointer-events:none;text-shadow:0 1px 2px rgba(0,0,0,.72)}.hud{position:absolute;z-index:5;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));display:flex;align-items:center;gap:14px;pointer-events:none}.hud__button{border:1px solid var(--line);background:#040a10b3;color:var(--ink);box-shadow:0 4px #00000059}.hud__group{display:grid;min-width:104px;padding:4px 2px 5px;color:var(--ink);text-shadow:0 2px 4px rgba(0,0,0,.8)}.hud__label{color:var(--muted);font-size:10px;font-weight:800;letter-spacing:0;text-transform:uppercase}.hud__value{font-family:var(--font-readout);font-size:20px;font-weight:900;line-height:1}.hud__button{margin-left:auto;min-width:86px;padding:11px 12px;cursor:pointer;pointer-events:auto}.dev-panel{position:absolute;z-index:6;top:max(58px,calc(env(safe-area-inset-top) + 58px));left:max(12px,env(safe-area-inset-left));display:none;align-items:center;gap:9px;color:#ffef99;font-family:var(--font-readout);font-size:12px;font-weight:900;text-shadow:0 2px 5px rgba(0,0,0,.9);text-transform:uppercase;pointer-events:none}.dev-panel.is-visible{display:flex}.dev-panel strong{color:#ff744f}.dev-panel em{color:#ffb8a6;font-style:normal}.mobile-pause-button{position:absolute;z-index:8;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));display:none;min-width:48px;min-height:36px;border:1px solid rgba(255,245,203,.5);background:#040a108f;color:var(--ink);box-shadow:0 4px #00000052;cursor:pointer;pointer-events:auto;touch-action:manipulation;font-size:11px;font-weight:1000;line-height:1;text-transform:uppercase}.controls-help{position:absolute;z-index:9;inset:auto max(16px,env(safe-area-inset-right)) max(82px,calc(env(safe-area-inset-bottom) + 82px)) max(16px,env(safe-area-inset-left));display:none;justify-content:center;pointer-events:none}.controls-help.is-visible{display:flex}.controls-help__panel{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;width:min(720px,100%);border:1px solid rgba(255,245,203,.48);background:#050c12db;box-shadow:var(--shadow);padding:16px 18px;color:var(--ink)}.controls-help__panel--mobile,.controls-help--mobile .controls-help__panel--desktop{display:none}.controls-help--mobile .controls-help__panel--mobile{display:grid}.controls-help--mobile.controls-help--buttons .controls-help__panel--tilt,.controls-help--mobile.controls-help--tilt .controls-help__panel--buttons{display:none}.controls-help--pause-menu{position:static;inset:auto;justify-content:stretch;width:100%;pointer-events:none}.controls-help--pause-menu .controls-help__panel{width:100%;border:0;border-top:1px solid rgba(255,245,203,.28);border-bottom:1px solid rgba(255,245,203,.18);background:#fff5cb0d;box-shadow:none;padding:13px 0}.controls-help__keys{display:grid;grid-template-columns:repeat(3,minmax(42px,auto));gap:7px;align-items:center}.keycap,.mouse-icon,.touch-diagram__fire{display:grid;min-width:42px;min-height:34px;place-items:center;border:1px solid rgba(255,245,203,.62);background:#fff5cb1a;color:#ffe58a;font-family:var(--font-readout);font-size:13px;font-weight:900;line-height:1;text-transform:uppercase}.keycap--wide,.mouse-icon{min-width:86px}.mouse-icon{border-radius:18px 18px 22px 22px;font-size:11px}.controls-help__copy{display:grid;gap:5px;min-width:0;text-shadow:0 2px 4px rgba(0,0,0,.82)}.controls-help__copy strong{color:#ffe58a;font-size:20px;line-height:1;text-transform:uppercase}.controls-help__copy span{color:#f7f1dc;font-family:var(--font-readout);font-size:13px;font-weight:800;line-height:1.35}.touch-diagram{position:relative;display:grid;grid-template-columns:64px 76px;gap:22px;align-items:center}.touch-diagram--buttons{grid-template-columns:42px 42px 76px;gap:10px}.touch-diagram--tilt{grid-template-columns:70px 24px 76px;gap:12px}.touch-diagram__stick{position:relative;width:48px;height:86px;border:1px solid rgba(255,245,203,.52);border-radius:999px;background:#fff5cb14}.touch-diagram__stick:before{position:absolute;top:50%;left:50%;width:28px;height:28px;border:1px solid rgba(255,245,203,.72);border-radius:50%;background:#fff5cb29;content:"";transform:translate(-50%,-50%)}.touch-diagram__triangle{width:42px;height:42px;background:#fff5cb29;filter:drop-shadow(0 1px 0 rgba(255,245,203,.36))}.touch-diagram__triangle--up{clip-path:polygon(50% 8%,92% 88%,8% 88%)}.touch-diagram__triangle--down{clip-path:polygon(8% 12%,92% 12%,50% 92%)}.touch-diagram__phone{position:relative;width:64px;height:38px;border:1px solid rgba(255,245,203,.62);border-radius:9px;background:#fff5cb1a;transform:rotate(-12deg)}.touch-diagram__phone:before,.touch-diagram__phone:after{position:absolute;top:50%;width:13px;height:2px;background:#ffe58ae6;content:""}.touch-diagram__phone:before{left:-11px;transform:translateY(-50%) rotate(-24deg)}.touch-diagram__phone:after{right:-11px;transform:translateY(-50%) rotate(24deg)}.touch-diagram__dead-zone{width:12px;height:36px;border:1px dashed rgba(255,245,203,.5);border-radius:999px;background:#fff5cb0f}.screen{position:absolute;inset:0;z-index:10;display:none}.screen.is-visible{display:grid}.screen--splash{place-items:center start;background:#050b12}.screen__art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.screen--splash:after{position:absolute;inset:0;content:"";background:linear-gradient(90deg,#03060cc7,#03060c47 47%,#03060c1f),linear-gradient(0deg,rgba(3,6,12,.78) 0%,transparent 38%)}.splash-copy{position:relative;z-index:1;width:min(650px,72%);padding-left:clamp(32px,7vw,74px);color:var(--ink);text-shadow:0 5px 0 rgba(0,0,0,.55)}.splash-copy h1{margin:0;color:#ffe58a;font-size:clamp(54px,9vw,118px);font-weight:1000;line-height:.86;text-transform:uppercase}.splash-copy p{margin:18px 0 28px;color:#f7f1dc;font-size:clamp(18px,2.6vw,28px);font-weight:800}.splash-copy .splash-meta{display:flex;flex-wrap:wrap;gap:7px 12px;align-items:center;max-width:min(520px,100%);margin:20px 0 0;color:#f7f1dcb3;font-family:var(--font-readout);font-size:11px;font-weight:700;line-height:1.45;text-shadow:0 2px 4px rgba(0,0,0,.84)}.splash-copy .splash-meta a{color:#ffe58ad1;text-decoration:underline;text-underline-offset:3px}.splash-copy .splash-meta a:focus-visible{outline:2px solid rgba(255,229,138,.9);outline-offset:3px}.primary-action,.secondary-action{border:1px solid rgba(255,245,203,.75);color:#1b160b;background:linear-gradient(180deg,#ffe58a,#ff9c42);box-shadow:inset 0 2px #ffffff6b,0 6px #6a2c1c,0 12px 24px #00000059;min-width:190px;min-height:48px;padding:13px 20px;cursor:pointer;font-size:17px;font-weight:1000;line-height:1;text-transform:uppercase}.primary-action:disabled,.secondary-action:disabled{cursor:not-allowed;filter:grayscale(.65);opacity:.48;transform:none}.primary-action:active,.secondary-action:active{transform:translateY(3px);box-shadow:inset 0 2px #ffffff6b,0 3px #6a2c1c}.primary-action--small{min-width:92px;min-height:42px;padding:10px 14px;font-size:14px}.secondary-action{color:var(--ink);background:linear-gradient(180deg,#263845,#101922);box-shadow:inset 0 2px #ffffff29,0 6px #02070c,0 12px 24px #00000059}.screen--panel{place-items:center;background:#02060a73}.modal-panel{width:min(450px,calc(100% - 40px));border:1px solid var(--line);background:var(--panel-strong);padding:28px;color:var(--ink);box-shadow:var(--shadow)}.modal-panel--pause{display:grid;width:min(620px,calc(100% - 40px));max-height:calc(100% - 40px);gap:14px;overflow:auto}.modal-panel--scores{display:grid;width:min(560px,calc(100% - 40px));max-height:calc(100% - 40px);gap:14px;overflow:auto}.modal-panel h2{margin:0 0 8px;color:#ffe58a;font-size:34px;line-height:1;text-transform:uppercase}.modal-panel p{margin:0 0 22px;color:var(--muted);font-size:16px}.modal-panel--pause p,.modal-panel--scores p{margin:0}.pause-controls-slot{display:grid}.mobile-pause-options{display:none}.mobile-pause-options .secondary-action{width:100%}.modal-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}.modal-actions--pause{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.modal-actions--pause button{width:100%;min-width:0}.modal-actions--game-over{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.modal-actions--game-over button{width:100%;min-width:0}.score-notice{margin:-10px 0 2px;color:#d6e7a1;font-family:var(--font-readout);font-size:13px;font-weight:800;text-transform:uppercase}.score-notice--locked{color:#ffe58a}.score-form{display:grid;gap:8px;margin:0}.score-form label{color:var(--muted);font-size:12px;font-weight:900;letter-spacing:0;text-transform:uppercase}.score-form__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}.score-form input{min-width:0;flex:1;border:1px solid var(--line);outline:none;background:#ffffff14;color:var(--ink);font-family:var(--font-readout);padding:11px 12px;font-size:18px;font-weight:900;text-transform:uppercase}.score-form input:invalid{border-color:var(--danger)}.score-list{display:grid;gap:6px;max-height:190px;margin:0;padding:0;list-style-position:inside}.score-list li{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:baseline;border-bottom:1px solid rgba(255,255,255,.11);padding:6px 0}.score-list span{font-weight:900}.score-list strong{color:#ffe58a;font-family:var(--font-readout)}.score-list em{color:var(--muted);font-size:12px;font-style:normal}.portrait-warning{position:absolute;inset:0;z-index:20;display:none;place-items:center;gap:10px;background:#06131d;color:var(--ink);text-align:center}.portrait-warning strong{display:block;color:#ffe58a;font-size:32px;text-transform:uppercase}.portrait-warning span{display:block;color:var(--muted)}.mobile-controls{--touch-edge-x: max(18px, calc(env(safe-area-inset-left) + clamp(14px, 2.4vmin, 28px)) );--touch-edge-right: max(22px, calc(env(safe-area-inset-right) + clamp(16px, 2.6vmin, 32px)) );--touch-edge-bottom: max(18px, calc(env(safe-area-inset-bottom) + clamp(12px, 2.2vmin, 26px)) );--turn-button-width: clamp(74px, 11vmin, 92px);--turn-button-height: clamp(64px, 9vmin, 78px);--turn-button-gap: clamp(10px, 1.4vmin, 16px);--fire-pad-size: clamp(76px, 11vmin, 92px);position:absolute;z-index:8;inset:0;display:none;pointer-events:none;touch-action:none}.turn-buttons{position:absolute;bottom:var(--touch-edge-bottom);left:var(--touch-edge-x);display:none;grid-template-rows:repeat(2,var(--turn-button-height));gap:var(--turn-button-gap);pointer-events:none}.turn-button{position:relative;display:grid;width:var(--turn-button-width);height:var(--turn-button-height);place-items:center;border:0;background:transparent;cursor:pointer;opacity:.72;pointer-events:auto;touch-action:none}.turn-button:before{width:100%;height:100%;background:#fff5cb24;content:"";filter:drop-shadow(0 0 1px rgba(255,245,203,.96)) drop-shadow(0 0 16px rgba(255,229,138,.14))}.turn-button:active:before{background:#ffe58a47}.turn-button--up{grid-row:1}.turn-button--up:before{clip-path:polygon(50% 5%,96% 92%,4% 92%)}.turn-button--down{grid-row:2}.turn-button--down:before{clip-path:polygon(4% 8%,96% 8%,50% 95%)}.app-shell[data-mobile-control-mode=buttons] .turn-buttons{display:grid}.app-shell[data-mobile-control-mode=buttons] .pitch-zone,.app-shell[data-mobile-control-mode=buttons] .pitch-stick,.app-shell[data-mobile-control-mode=tilt] .turn-buttons,.app-shell[data-mobile-control-mode=tilt] .pitch-zone,.app-shell[data-mobile-control-mode=tilt] .pitch-stick,.app-shell.is-menu-open .mobile-pause-button,.app-shell.is-menu-open .mobile-controls{display:none}.pitch-zone{position:absolute;top:0;bottom:0;left:0;width:min(68vw,calc(100vw - 178px - env(safe-area-inset-right)));pointer-events:auto;touch-action:none}.pitch-stick,.fire-pad{border:1px solid rgba(255,245,203,.5);color:var(--ink);touch-action:none;font-size:13px;font-weight:1000}.pitch-stick{--stick-y: 0px;position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:max(18px,env(safe-area-inset-left));width:92px;height:144px;border-radius:999px;background:#03080d5c;box-shadow:inset 0 0 20px #ffe58a21,0 0 18px #00000042;pointer-events:none}.pitch-stick:before{position:absolute;top:17px;bottom:17px;left:50%;width:2px;background:#fff5cb47;content:"";transform:translate(-50%)}.pitch-stick__thumb{position:absolute;top:50%;left:50%;display:grid;width:54px;height:54px;place-items:center;border:1px solid rgba(255,245,203,.58);border-radius:50%;background:#fff5cb29;box-shadow:inset 0 0 18px #ffe58a38;transform:translate(-50%,calc(-50% + var(--stick-y)))}.pitch-stick__thumb:before,.pitch-stick__thumb:after{position:absolute;width:0;height:0;content:"";filter:drop-shadow(0 2px 0 rgba(0,0,0,.45))}.pitch-stick__thumb:before{top:12px;border-right:10px solid transparent;border-bottom:13px solid rgba(255,245,203,.92);border-left:10px solid transparent}.pitch-stick__thumb:after{bottom:12px;border-top:13px solid rgba(255,245,203,.92);border-right:10px solid transparent;border-left:10px solid transparent}.fire-pad{position:absolute;right:var(--touch-edge-right);bottom:var(--touch-edge-bottom);display:grid;width:var(--fire-pad-size);height:var(--fire-pad-size);place-items:center;border-radius:50%;background:#03080d33;box-shadow:inset 0 0 22px #ffe58a29,0 0 22px #ff84352e;pointer-events:auto;text-transform:uppercase}@media(orientation:landscape){.app-shell.uses-touch-controls .screen--splash{--splash-art-width: min(100vw, 150dvh );grid-template-columns:minmax(0,var(--splash-art-width));justify-content:center;place-items:center start}.app-shell.uses-touch-controls .splash-copy{width:min(650px,74%);padding-left:clamp(20px,4vw,32px)}.app-shell.uses-touch-controls .hud{left:max(72px,calc(env(safe-area-inset-left) + 72px));gap:8px}.app-shell.uses-touch-controls .hud__group{min-width:76px;padding:5px 8px}.app-shell.uses-touch-controls .hud__value{font-size:17px}.app-shell.uses-touch-controls .hud__button{flex:0 0 72px;min-width:0;padding:9px 6px;font-size:12px}.app-shell.uses-touch-controls .mobile-pause-button,.app-shell.uses-touch-controls .mobile-controls{display:block}.app-shell.uses-touch-controls .mobile-pause-options{display:grid}.app-shell.uses-touch-controls .modal-panel--pause{width:min(640px,calc(100% - 28px));max-height:calc(100% - 28px);gap:10px;padding:18px}.app-shell.uses-touch-controls .modal-panel--pause h2{font-size:28px}.app-shell.uses-touch-controls .modal-panel--pause p{font-size:14px}.app-shell.uses-touch-controls .controls-help{inset:auto max(12px,env(safe-area-inset-right)) max(126px,calc(env(safe-area-inset-bottom) + 112px)) max(12px,env(safe-area-inset-left))}.app-shell.uses-touch-controls .controls-help__panel{grid-template-columns:auto minmax(0,1fr);gap:12px;padding:12px 14px}.app-shell.uses-touch-controls .controls-help__copy strong{font-size:17px}.app-shell.uses-touch-controls .controls-help__copy span{font-size:12px}.app-shell.uses-touch-controls .controls-help--pause-menu .controls-help__panel{padding:10px 0}.app-shell.uses-touch-controls .splash-copy h1{font-size:clamp(42px,11vw,74px)}.app-shell.uses-touch-controls .splash-copy .splash-meta{max-width:420px;margin-top:16px;font-size:10px}}@media(orientation:landscape)and (max-height:430px){.app-shell.uses-touch-controls .mobile-controls{--turn-button-width: clamp(68px, 12vmin, 78px);--turn-button-height: clamp(58px, 10vmin, 68px);--turn-button-gap: 8px;--fire-pad-size: clamp(72px, 12vmin, 82px)}}@media(max-width:620px){.modal-actions--game-over,.score-form__row{grid-template-columns:1fr}.primary-action--small{width:100%}}@media(orientation:portrait){.app-shell.uses-touch-controls .portrait-warning{display:grid}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}
