:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#effaff;background:#071625;font-synthesis:none;--panel: rgba(7, 22, 37, .88);--panel-border: rgba(139, 226, 221, .24);--accent: #4fdbc9;--accent-strong: #82f4e5;--muted: #a7bac4;--danger: #ff6578}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{user-select:none}button,select,input{font:inherit}button,select{min-height:46px;border:1px solid rgba(144,223,219,.24);border-radius:13px;color:#effaff;background:#16303fe0;padding:.72rem 1.1rem;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,opacity .16s ease}button:hover:not(:disabled),button:focus-visible{transform:translateY(-2px);border-color:var(--accent);background:#234a58f5;outline:none}button:focus-visible,select:focus-visible,input:focus-visible{box-shadow:0 0 0 3px #4fdbc940}button:disabled{cursor:not-allowed;opacity:.48}button.primary{color:#062126;background:linear-gradient(135deg,var(--accent-strong),var(--accent));border-color:transparent;font-weight:800}button.danger{border-color:#ff657880;color:#ffdbe0;background:#6f1b2b8c}h1,h2,p{margin-top:0}h1{letter-spacing:-.035em}p{color:var(--muted);line-height:1.55}#game-canvas{touch-action:none;position:fixed;inset:0;width:100%;height:100%;display:block}#screen-root{position:fixed;inset:0;pointer-events:none;z-index:10}.screen{touch-action:pan-y;position:fixed;inset:0;display:grid;place-items:center;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));pointer-events:auto}.hidden{display:none!important}.menu-screen{place-items:center start;background:radial-gradient(circle at 72% 42%,transparent 0 20%,rgba(3,12,23,.18) 54%,rgba(3,12,23,.76) 100%)}.hero-card{width:min(560px,90vw);margin-left:clamp(0rem,8vw,8rem);padding:clamp(1.4rem,4vw,3.4rem);border:1px solid var(--panel-border);border-radius:30px;background:linear-gradient(145deg,#071625eb,#092431bf);box-shadow:0 28px 80px #00000061;backdrop-filter:blur(16px)}.hero-card h1{font-size:clamp(2.4rem,6vw,5.2rem);line-height:.94;margin-bottom:1.2rem}.hero-card p{font-size:clamp(1rem,2vw,1.25rem);max-width:36ch}.eyebrow{color:var(--accent-strong);font-weight:800;letter-spacing:.22em;font-size:.78rem;margin-bottom:1rem}.menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:2rem}.menu-actions .primary{grid-column:1 / -1;min-height:58px;font-size:1.1rem}.panel-screen{align-items:center;overflow:auto;background:#020b138a;backdrop-filter:blur(8px)}.panel{width:min(760px,96vw);max-height:min(900px,94vh);overflow:auto;padding:clamp(1.1rem,3vw,2.2rem);border:1px solid var(--panel-border);border-radius:25px;background:var(--panel);box-shadow:0 30px 90px #0000006b}.panel.wide{width:min(1180px,97vw)}.panel.compact{width:min(420px,92vw);display:grid;gap:.75rem;text-align:center}.panel header{display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem}.panel header h1{margin:0 auto 0 0;font-size:clamp(1.8rem,4vw,2.8rem)}.icon-button{width:48px;padding:0;font-size:1.5rem}.level-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.level-card,.upgrade-card{position:relative;overflow:hidden;display:grid;gap:.75rem;padding:1.35rem;border:1px solid rgba(142,220,217,.18);border-radius:20px;background:linear-gradient(145deg,#1c3a48b8,#0c1e2bc2)}.level-card h2,.upgrade-card h2{margin:0;font-size:1.35rem}.level-card p,.upgrade-card p{margin:0}.level-card.locked{filter:saturate(.4)}.level-number{position:absolute;right:1rem;top:.3rem;color:#7eebde1f;font-size:5rem;font-weight:900;line-height:1}.level-meta{display:flex;flex-wrap:wrap;gap:.5rem 1rem;color:#bcd1d8;font-size:.85rem}.upgrade-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}.upgrade-card{grid-template-rows:1fr auto auto}.upgrade-level{font-size:.85rem;color:#cfe2e7}.level-pips{display:flex;gap:.3rem;margin-top:.45rem}.level-pips i{width:100%;height:6px;border-radius:4px;background:#ffffff1f}.level-pips i.active{background:var(--accent);box-shadow:0 0 12px #4fdbc980}.credit-chip{border-radius:999px;color:#ffe492;background:#76591757;padding:.55rem .85rem;white-space:nowrap}.settings-panel{display:grid;gap:1rem;width:min(620px,94vw)}.settings-panel label{display:grid;gap:.55rem;color:#d7e9ee}.settings-panel select{width:100%}.range-row{display:grid;grid-template-columns:1fr 54px;align-items:center;gap:.9rem}input[type=range]{width:100%;accent-color:var(--accent)}output{text-align:right;color:var(--accent-strong)}.controls-columns{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.controls-columns>div{padding:1.25rem;border-radius:18px;background:#1f3e4c73}.pause-screen,.results-screen{background:#020910b8;backdrop-filter:blur(10px)}.results-panel{text-align:center;width:min(680px,94vw)}.stars{color:#ffd65e;font-size:clamp(2.4rem,7vw,4.5rem);letter-spacing:.12em;text-shadow:0 0 24px rgba(255,214,94,.35)}.result-banner{display:inline-block;margin:0 .25rem .7rem;border:1px solid rgba(79,219,201,.3);border-radius:999px;padding:.45rem .8rem;color:var(--accent-strong);background:#1f696440}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin:1.3rem 0}.result-grid span{display:grid;gap:.35rem;padding:.9rem;border-radius:14px;color:var(--muted);background:#1b38468c}.result-grid strong{color:#fff;font-size:1.25rem}.result-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}#hud{position:fixed;inset:0;z-index:5;pointer-events:none;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}.hud-panel{position:absolute;top:max(1rem,env(safe-area-inset-top));display:grid;gap:.25rem;padding:.72rem .9rem;border:1px solid rgba(169,232,228,.17);border-radius:14px;color:#eefcff;background:#06131f9e;box-shadow:0 8px 24px #00000029;backdrop-filter:blur(8px);font-size:.86rem}.hud-left{left:max(1rem,env(safe-area-inset-left))}.hud-center{left:50%;transform:translate(-50%);min-width:170px;text-align:center;font-size:1.28rem;font-weight:800}.hud-right{right:max(1rem,env(safe-area-inset-right));text-align:right}.boost-track{width:100%;height:5px;border-radius:4px;overflow:hidden;background:#ffffff1f}#boost-fill{width:100%;height:100%;background:linear-gradient(90deg,#43c9ba,#b3fff0);transition:width .08s linear}#status-message{position:absolute;left:50%;top:25%;transform:translate(-50%,-12px);max-width:min(560px,90vw);opacity:0;padding:.75rem 1.1rem;border-radius:14px;color:#fff;background:#051621d1;border:1px solid rgba(98,230,215,.3);text-align:center;font-weight:700;transition:opacity .2s,transform .2s}#status-message.visible{opacity:1;transform:translate(-50%)}#checkpoint-arrow{position:absolute;left:50%;top:50%;opacity:0;color:var(--accent-strong);font-size:2rem;text-shadow:0 0 14px #21ad9b;transition:opacity .16s}#checkpoint-arrow.visible{opacity:.9}#mobile-controls{position:fixed;inset:0;z-index:7;pointer-events:none}.joystick{position:absolute;bottom:max(1.1rem,env(safe-area-inset-bottom));width:clamp(110px,18vw,155px);aspect-ratio:1;border:2px solid rgba(213,255,250,.24);border-radius:50%;background:#071a2761;box-shadow:inset 0 0 30px #4ee0cf14;pointer-events:auto;touch-action:none}#left-stick{left:max(1rem,env(safe-area-inset-left))}#right-stick{right:max(1rem,env(safe-area-inset-right))}.stick-knob{position:absolute;width:42%;aspect-ratio:1;left:29%;top:29%;border-radius:50%;background:#71efe1ad;box-shadow:0 0 22px #4fdbc957;pointer-events:none}.mobile-buttons{position:absolute;right:calc(max(1rem,env(safe-area-inset-right)) + clamp(120px,20vw,170px));bottom:max(1rem,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(2,48px);gap:.5rem;pointer-events:auto}.mobile-buttons button{width:48px;min-height:48px;padding:0;border-radius:50%;background:#081f2cb8}#orientation-message{position:fixed;z-index:30;left:50%;bottom:max(1rem,env(safe-area-inset-bottom));transform:translate(-50%);width:min(92vw,440px);padding:.7rem 1rem;border-radius:12px;color:#fff;background:#05141fe6;text-align:center;font-size:.86rem;pointer-events:none}#loading{z-index:100;background:#071625;text-align:center}.loader{width:64px;height:64px;margin:0 auto 1.4rem;border:4px solid rgba(89,227,210,.18);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#fatal{z-index:110;background:#071625}#fatal .card{width:min(520px,92vw);padding:2rem;border-radius:20px;background:#152b38}@media(max-width:850px){.upgrade-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-card{margin:0 auto}.menu-screen{place-items:center}}@media(max-width:640px){.level-grid,.upgrade-grid,.controls-columns{grid-template-columns:1fr}.panel{border-radius:18px}.result-grid{grid-template-columns:repeat(2,1fr)}.result-actions{grid-template-columns:1fr}.hud-panel{font-size:.72rem;padding:.48rem .58rem}.hud-left{max-width:38vw}.hud-right{top:5.2rem}.hud-center{min-width:120px;font-size:1rem}.mobile-buttons{right:50%;transform:translate(50%);grid-template-columns:repeat(4,44px)}.mobile-buttons button{width:44px;min-height:44px}}@media(max-height:560px)and (orientation:landscape){.joystick{width:105px}.mobile-buttons{right:calc(max(1rem,env(safe-area-inset-right)) + 118px);grid-template-columns:repeat(2,42px)}.mobile-buttons button{width:42px;min-height:42px}.hud-right{top:.8rem}#status-message{top:20%}}html,body{overscroll-behavior:none;touch-action:none}.menu-screen:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(68,224,205,.07),transparent 34%,transparent 72%,rgba(116,179,255,.06))}.hero-card,.panel{box-shadow:0 32px 100px #00000070,inset 0 1px #ffffff0b}.hero-card{position:relative;overflow:hidden}.hero-card:before{content:"";position:absolute;width:180px;height:180px;right:-78px;top:-85px;border-radius:50%;background:radial-gradient(circle,rgba(83,230,212,.24),transparent 68%)}.level-card,.upgrade-card{transition:transform .2s ease,border-color .2s ease,background .2s ease}.level-card:hover:not(.locked),.upgrade-card:hover{transform:translateY(-3px);border-color:#6fefe16b;background:linear-gradient(145deg,#224857d1,#0d2230d6)}.hud-panel{box-shadow:0 12px 34px #00000038,inset 0 1px #ffffff0d}#mobile-controls{--stick-size: clamp(112px, 18vw, 156px)}.joystick{width:var(--stick-size);overflow:visible;border-color:#bcfff652;background:radial-gradient(circle at 50% 48%,#245f6c6b,#0617237a 72%);box-shadow:inset 0 0 34px #4ee0cf1a,0 12px 34px #0000003d;backdrop-filter:blur(5px);transition:border-color .14s ease,background .14s ease,transform .14s ease}.joystick.active{border-color:#77ffebb3;background:#0c303d9e;transform:scale(1.025)}.stick-knob{background:radial-gradient(circle at 36% 30%,#d7fffaf2,#5ce2d2c7 42%,#29918eb8);border:1px solid rgba(238,255,253,.42);box-shadow:0 8px 20px #0000004d,0 0 24px #4fdbc959;will-change:transform}.stick-axis{position:absolute;z-index:2;color:#e1fffb7a;font-size:clamp(.66rem,1.5vw,.86rem);font-weight:900;line-height:1;pointer-events:none;text-shadow:0 1px 4px rgba(0,0,0,.55)}.stick-up{left:50%;top:7%;transform:translate(-50%)}.stick-right{right:7%;top:50%;transform:translateY(-50%)}.stick-down{left:50%;bottom:7%;transform:translate(-50%)}.stick-left{left:7%;top:50%;transform:translateY(-50%)}.stick-label{position:absolute;left:50%;bottom:-1.55rem;transform:translate(-50%);width:max-content;max-width:150%;color:#e0f9f8d1;font-size:clamp(.58rem,1.4vw,.72rem);font-weight:900;letter-spacing:.08em;text-align:center;text-shadow:0 2px 7px rgba(0,0,0,.75);pointer-events:none}.mobile-buttons{left:50%;right:auto;transform:translate(-50%);grid-template-columns:repeat(4,48px);gap:.55rem}.mobile-buttons button{border-color:#b1f4ee4d;background:linear-gradient(145deg,#123a47e6,#051926e0);box-shadow:0 8px 22px #00000045,inset 0 1px #ffffff14;backdrop-filter:blur(5px)}.mobile-buttons button.pressed{transform:scale(.9);border-color:var(--accent-strong);background:#297577eb}#orientation-message{bottom:auto;top:calc(max(1rem,env(safe-area-inset-top)) + 8.8rem);opacity:.88}@media(pointer:coarse)and (orientation:portrait){#mobile-controls{--stick-size: clamp(108px, 31vw, 142px)}.joystick{bottom:calc(max(1rem,env(safe-area-inset-bottom)) + .25rem)}#left-stick{left:max(.65rem,env(safe-area-inset-left))}#right-stick{right:max(.65rem,env(safe-area-inset-right))}.mobile-buttons{bottom:calc(max(1rem,env(safe-area-inset-bottom)) + var(--stick-size) + 2.15rem);grid-template-columns:repeat(4,44px);gap:.45rem}.mobile-buttons button{width:44px;min-height:44px}.hud-center{top:max(.7rem,env(safe-area-inset-top));min-width:126px;font-size:1rem}.hud-left,.hud-right{top:calc(max(.7rem,env(safe-area-inset-top)) + 4.45rem);font-size:.68rem;padding:.48rem .55rem}.hud-left{max-width:49vw}.hud-right{max-width:46vw}#orientation-message{top:calc(max(.7rem,env(safe-area-inset-top)) + 9rem);width:min(88vw,360px);padding:.48rem .7rem;font-size:.72rem}#status-message{top:31%;max-width:86vw;font-size:.86rem}#checkpoint-arrow{top:44%}}@media(pointer:coarse)and (orientation:landscape)and (max-height:560px){#mobile-controls{--stick-size: clamp(96px, 18vh, 112px)}.joystick{bottom:max(.7rem,env(safe-area-inset-bottom))}.stick-label{bottom:-1.2rem;font-size:.56rem}.mobile-buttons{bottom:max(.65rem,env(safe-area-inset-bottom));grid-template-columns:repeat(4,40px)}.mobile-buttons button{width:40px;min-height:40px}.hud-panel{top:max(.55rem,env(safe-area-inset-top))}#orientation-message{display:none!important}}@media(max-width:390px)and (orientation:portrait){#mobile-controls{--stick-size: 108px}.mobile-buttons{grid-template-columns:repeat(4,40px)}.mobile-buttons button{width:40px;min-height:40px}.stick-label{font-size:.54rem}#hud-collisions,#hud-wind{display:none}}
