*{box-sizing:border-box}:root{--topbar-h: 34px}html,body{margin:0;height:100%;overflow:hidden;background:#000;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#fff;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#app canvas{display:block}#ui{position:fixed;inset:0;pointer-events:none}#ui>*{pointer-events:auto}#ui>.hud-sticks,#ui>.toast,#ui>.touch-sticks{pointer-events:none}.crash-banner button{margin-top:8px;background:#00000080;color:#fff;border:1px solid #ffd34d;border-radius:6px;padding:6px 12px;font-size:14px;cursor:pointer}body.ui-hidden .hud,body.ui-hidden .hud-sticks,body.ui-hidden .settings,body.ui-hidden .challenges,body.ui-hidden .help{display:none!important}body.ui-hidden .topbar button:not(#btn-hide){display:none!important}.topbar{position:absolute;top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));display:flex;gap:8px;flex-wrap:wrap;max-width:calc(100vw - 20px)}.show-ui{position:absolute;top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));background:#00000073;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:6px 10px;font-size:16px}.topbar button,.settings button{background:#0000008c;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:8px 12px;font-size:14px;cursor:pointer;touch-action:manipulation}.topbar button{padding:6px 9px;font-size:16px;line-height:1;min-width:38px;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.tip-bubble{position:fixed;z-index:50;max-width:280px;background:#0a0a0ef2;color:#fff;border:1px solid rgba(255,211,77,.6);border-radius:8px;padding:8px 10px;font-size:13px;line-height:1.35;pointer-events:none}.paused-banner{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);background:#000000bf;padding:16px 32px;border-radius:12px;text-align:center;font-size:22px;pointer-events:none}.topbar button:hover,.settings button:hover{background:#000000bf}.topbar button.active{background:#be7800bf;border-color:#ffd34d}.hud{position:absolute;top:calc(10px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right));background:#00000080;border-radius:8px;padding:8px 12px;font-size:13px;min-width:0;cursor:pointer}.hud .strip{white-space:nowrap;font-size:13px}.hud div{display:flex;justify-content:space-between;gap:14px;line-height:1.5}.hud span{opacity:.75}.hud-sticks{position:absolute;left:10px;bottom:10px}.toast{position:absolute;top:30%;left:50%;transform:translate(-50%);background:#0a5a1ed9;padding:12px 24px;border-radius:10px;text-align:center;font-size:15px;pointer-events:none}.crash-banner{position:absolute;top:25%;left:50%;transform:translate(-50%);background:#780000cc;padding:16px 32px;border-radius:10px;text-align:center}.crash-banner h2{margin:0 0 6px}.crash-banner p{margin:0}.hint{opacity:.7;font-size:12px}.settings{position:absolute;top:calc(var(--topbar-h) + 18px + env(safe-area-inset-top));left:10px;width:min(380px,calc(100vw - 20px));max-height:calc(100vh - 70px);overflow:auto;background:#0a0a0eeb;border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:12px 16px;font-size:14px}.help{position:absolute;top:calc(var(--topbar-h) + 18px + env(safe-area-inset-top));left:50%;transform:translate(-50%);width:min(640px,calc(100vw - 20px));max-height:calc(100vh - 70px);overflow:auto;background:#0a0a0ef0;border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:12px 18px;font-size:14px;line-height:1.45}.help h3{margin:0 0 8px;display:flex;justify-content:space-between;align-items:center}.help h4{margin:12px 0 4px}.help section{border-top:1px solid rgba(255,255,255,.1)}.help ul,.help ol{padding-left:20px;margin:4px 0}.help li{margin:3px 0}.help p{margin:4px 0}.help a,.settings a{color:#ffd34d}.version-line{font-size:12px;opacity:.85;margin:-4px 0 8px}.help button{background:#0000008c;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:6px 10px;font-size:14px;cursor:pointer}.settings h3{margin:0 0 8px;display:flex;justify-content:space-between;align-items:center}.settings h4{margin:12px 0 6px;opacity:.8;font-weight:600}.settings section{border-top:1px solid rgba(255,255,255,.1);padding-bottom:6px}.settings label{display:block;margin:6px 0}.settings select{width:100%;padding:6px;background:#1c1c22;color:#fff;border:1px solid #444;border-radius:6px}.settings input[type=range]{width:100%}.settings code{font-size:12px}.wizard{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.wizard button{padding:6px 10px;font-size:13px}.axis{display:flex;align-items:center;gap:8px;font-size:12px;margin:2px 0}.axis span{width:90px;opacity:.8}.axis .bar{position:relative;flex:1;height:8px;background:#333;border-radius:4px}.axis .bar i{position:absolute;top:-2px;width:4px;height:12px;margin-left:-2px;background:#ffd34d;border-radius:2px}.touch-sticks{position:absolute;inset:0;pointer-events:none}.gimbal{position:absolute;bottom:calc(20px + env(safe-area-inset-bottom));width:160px;height:160px;border-radius:50%;pointer-events:auto;touch-action:none;background:radial-gradient(circle,#00000059,#0000008c 70%,#0003);border:2px solid rgba(255,255,255,.35);display:flex;align-items:center;justify-content:center}.gimbal-left{left:calc(20px + env(safe-area-inset-left))}.gimbal-right{right:calc(20px + env(safe-area-inset-right))}.gimbal-knob{width:44px;height:44px;border-radius:50%;background:#ddd;box-shadow:0 2px 8px #0009}@media(pointer:fine)and (min-width:900px){.gimbal{opacity:.85}}@media(max-width:760px),(max-height:500px){.topbar{gap:5px}.topbar button{padding:5px 7px;font-size:15px;min-width:34px}.hud{padding:5px 9px;font-size:12px}.hud{top:calc(var(--topbar-h) + 16px + env(safe-area-inset-top))}.settings{font-size:13px}}@media(max-width:760px)and (orientation:portrait){.hud{right:auto;left:calc(10px + env(safe-area-inset-left))}.gimbal{width:150px;height:150px}}.challenges{position:absolute;top:calc(var(--topbar-h) + 18px + env(safe-area-inset-top));left:50%;transform:translate(-50%);width:min(620px,calc(100vw - 20px));max-height:calc(100vh - 70px);overflow:auto;background:#0a0a0ef0;border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:12px 16px;font-size:14px}.challenges h3{margin:0 0 8px;display:flex;justify-content:space-between;align-items:center}.challenges h5{margin:8px 0 4px;font-size:14px}.challenges h6{margin:6px 0 2px;font-size:12px;opacity:.7;text-transform:uppercase;letter-spacing:.04em}.challenges button,.challenges .tabs button{background:#0000008c;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:6px 10px;font-size:13px;cursor:pointer}.challenges .tabs{display:flex;gap:6px;margin-bottom:8px}.challenges .tabs button.active{background:#be7800bf;border-color:#ffd34d}.challenge-list{list-style:none;padding:0;margin:0}.challenge-list li{padding:6px 0;border-top:1px solid rgba(255,255,255,.08)}.challenge-list li.done{opacity:.75}.challenge-list .row{display:flex;justify-content:space-between}.challenge-list .desc{font-size:12px;opacity:.8;margin:2px 0 4px}.challenge-list .bar{height:6px;background:#2a2a33;border-radius:3px;overflow:hidden}.challenge-list .bar i{display:block;height:100%;background:#ffd34d;transition:width .3s}.challenge-list li.done .bar i{background:#3ddc84}.ranking-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:560px){.ranking-cols{grid-template-columns:1fr}}.ranking-cols ol{padding-left:20px;margin:2px 0}.ranking-cols li{display:flex;justify-content:space-between;gap:8px}.ranking-cols li i{color:#3ddc84;font-style:normal}.challenges label{display:block;margin:8px 0 4px}.challenges input{width:100%;padding:6px 8px;background:#1c1c22;color:#fff;border:1px solid #444;border-radius:6px;font-size:14px}.row-buttons{display:flex;gap:6px;margin:8px 0;align-items:center}.row-buttons input{width:120px}.challenges .status{color:#ffd34d}.lesson{position:absolute;inset:0;pointer-events:none}.lesson-top{position:absolute;top:calc(var(--topbar-h) + 16px + env(safe-area-inset-top));left:50%;transform:translate(-50%);width:min(720px,calc(100vw - 20px));background:#0a0a0ed9;border:1px solid rgba(255,211,77,.5);border-radius:10px;padding:10px 14px;pointer-events:auto}.lesson-title{display:flex;align-items:center;gap:8px;font-size:14px}.lesson-title span{opacity:.7}.lesson-title button{margin-left:auto;background:#be3c00cc;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:5px 10px;cursor:pointer}.lesson-intro{font-size:12px;opacity:.75;margin:4px 0}.lesson-caption{font-size:16px;font-weight:600;color:#ffd34d;margin:6px 0 2px;line-height:1.35}.lesson-progress{font-size:12px;opacity:.6}.lesson-sticks{position:absolute;bottom:calc(14px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);text-align:center}.lesson-sticks canvas{max-width:calc(100vw - 20px);height:auto}.lesson-switches{display:flex;gap:10px;justify-content:center;margin-top:4px;font-size:13px}.lesson-switches span{background:#00000080;padding:3px 8px;border-radius:6px}.lesson-switches span.on{background:#be7800bf}body:has(.lesson:not([style*="display: none"])) .touch-sticks,body:has(.lesson:not([style*="display: none"])) .hud-sticks{display:none!important}.challenge-list .teach{margin-left:8px;padding:2px 8px;font-size:12px;background:#be7800bf;border-color:#ffd34d}.pilot-card{display:flex;align-items:center;gap:12px;margin:6px 0 10px}.pilot-avatar{width:48px;height:48px;border-radius:50%;background:#be7800bf;border:2px solid #ffd34d;display:grid;place-items:center;font-size:22px}.pilot-name{font-size:18px;font-weight:700}.callout{margin-top:10px;padding:8px 10px;background:#be780040;border:1px solid rgba(255,211,77,.5);border-radius:8px;font-size:13px}.callout i{color:#3ddc84;font-style:normal}.challenges button.inline{padding:2px 8px;font-size:12px;margin-left:4px}.lesson-switches span.want{outline:2px dashed #ffd34d}table.channels{width:100%;border-collapse:collapse;font-size:13px;margin:6px 0}table.channels th{text-align:left;font-weight:600;opacity:.7;font-size:12px}table.channels td,table.channels th{padding:4px 6px;border-top:1px solid rgba(255,255,255,.08)}table.channels .bar{position:relative;width:90px;height:8px;background:#333;border-radius:4px}table.channels .bar i{position:absolute;top:-2px;width:4px;height:12px;margin-left:-2px;background:#3ddc84;border-radius:2px}table.channels button{padding:2px 8px;font-size:12px}.challenges h5.level{margin:12px 0 2px;color:#ffd34d}.warn-banner{position:absolute;top:18%;left:50%;transform:translate(-50%);background:#a02800d9;border:1px solid #ffd34d;padding:8px 16px;border-radius:8px;font-weight:600;pointer-events:none;font-size:14px;max-width:90vw;text-align:center}.lesson-coach{margin-top:6px;font-size:18px;font-weight:700;color:#fff;background:#be780099;border-radius:6px;padding:4px 10px;display:inline-block}.lesson-coach.ok{background:#147832b3}.setup summary{cursor:pointer;font-size:13px;opacity:.9;margin:6px 0}.setup h5{margin:8px 0 2px;font-size:13px;color:#ffd34d}.setup-row{display:grid;grid-template-columns:1fr 120px 52px;gap:8px;align-items:center;font-size:12px;margin:2px 0}.setup-row input[type=range]{width:100%}.setup button{margin-top:6px}.logbook{display:flex;flex-direction:column;gap:3px;margin-top:6px;max-height:40vh;overflow:auto}.log-row{display:grid;grid-template-columns:5.5em 1fr 3.5em 8em 8em;gap:6px;font-size:12px;padding:3px 6px;border-radius:4px;background:#ffffff0f;align-items:center}.log-row.crash{background:#c828282e}.log-row span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:600px){.log-row{grid-template-columns:4.5em 1fr 3.2em 6.5em}.log-row span:last-child{display:none}}.help-toc{display:flex;flex-wrap:wrap;gap:4px 8px;margin:6px 0 10px;font-size:12px}.help-toc a{color:#ffd34d;text-decoration:none;padding:2px 6px;border:1px solid rgba(255,211,77,.35);border-radius:10px;white-space:nowrap}.help-toc a:hover{background:#ffd34d26}.field-only{opacity:.7;font-size:12px}.coach{margin:6px 0 8px;padding:8px 10px;background:#286ec838;border:1px solid rgba(120,180,255,.45);border-radius:8px;font-size:13px}.hud-graph{position:absolute;right:10px;bottom:10px;border-radius:8px;pointer-events:none}@media(pointer:coarse){.hud-graph{bottom:215px;width:220px;height:88px}}.radio-qr{margin:8px 0 4px}.radio-qr svg{display:block;background:#fff;border-radius:8px;padding:4px}body.radio-page{background:#141618}.radio-pair{max-width:420px;margin:12vh auto 0;padding:20px;text-align:center}.radio-pair h2{margin:0 0 10px}.radio-pair form{display:flex;gap:8px;justify-content:center;margin:14px 0}.radio-pair input{width:130px;font-size:28px;letter-spacing:6px;text-align:center;text-transform:uppercase;background:#222;color:#fff;border:1px solid #555;border-radius:8px;padding:6px}.radio-pair button,.radio-bar button,.radio-bar select{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:8px;padding:8px 12px;font-size:15px}.radio-bar button.active{background:#be7800bf;border-color:#ffd34d}.radio-bar{position:absolute;top:calc(8px + env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:center;max-width:100vw;padding:0 8px}.radio-code{font-weight:700;letter-spacing:3px;padding:0 6px}.radio-sticks{position:absolute;inset:0}.radio-sticks .gimbal{width:min(46vmin,300px);height:min(46vmin,300px);bottom:calc(24px + env(safe-area-inset-bottom))}.radio-sticks .gimbal-knob{width:64px;height:64px}.radio-hint{position:absolute;bottom:calc(4px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;margin:0;pointer-events:none}.radio-tel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:16px;text-align:center;pointer-events:none}.radio-crash{color:#ff8a80;font-weight:700}.rescue-badge{position:absolute;top:calc(var(--topbar-h) + 60px + env(safe-area-inset-top));left:50%;transform:translate(-50%);background:#be7800d9;border:1px solid #ffd34d;padding:8px 16px;border-radius:10px;font-size:15px;pointer-events:none;white-space:nowrap}.help table.physics{border-collapse:collapse;font-size:12px;margin:6px 0 10px;width:100%}.help table.physics th,.help table.physics td{border:1px solid rgba(255,255,255,.18);padding:3px 6px;text-align:left;vertical-align:top}.help table.physics th{background:#ffffff14}.replay-bar{display:flex;align-items:center;gap:6px;margin-top:6px;pointer-events:auto}.replay-bar button{background:#ffffff1f;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:3px 8px;cursor:pointer;font-size:14px}.replay-bar input[type=range]{flex:1}svg.progress{display:block;margin:6px 0;background:#00000040;border-radius:6px}.next-drill{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;background:#be780040;border:1px solid rgba(255,211,77,.6);border-radius:8px;padding:8px 10px;margin:6px 0 10px;font-size:13px}.drill-badge{position:absolute;top:calc(var(--topbar-h) + 20px + env(safe-area-inset-top));left:50%;transform:translate(-50%);background:#0a3c78d9;border:1px solid #9ec5ff;padding:6px 14px;border-radius:10px;font-size:15px;pointer-events:none;white-space:nowrap}.challenges h5 button.small{font-size:11px;padding:2px 8px;margin-left:8px;vertical-align:middle}.crash-banner .crash-note{font-size:14px;color:#ffe08a;margin:6px 0}.minimap{position:absolute;right:calc(10px + env(safe-area-inset-right));bottom:calc(200px + env(safe-area-inset-bottom));width:150px;height:150px;pointer-events:none}@media(max-width:760px)and (orientation:portrait){.minimap{width:110px;height:110px;bottom:auto;top:45%}}@media(max-height:500px)and (orientation:landscape){.minimap{width:100px;height:100px;bottom:auto;top:50%;transform:translateY(-50%)}}.challenge-list i.score{font-style:normal;background:#7ec8ff40;border:1px solid rgba(126,200,255,.6);border-radius:6px;padding:1px 6px;font-size:11px}body:has(.challenges:not([style*="display: none"])) .minimap,body:has(.settings:not([style*="display: none"])) .minimap,body:has(.help:not([style*="display: none"])) .minimap,body:has(.challenges:not([style*="display: none"])) .drill-badge,body:has(.settings:not([style*="display: none"])) .drill-badge,body:has(.help:not([style*="display: none"])) .drill-badge,body:has(.challenges:not([style*="display: none"])) .rescue-badge,body:has(.settings:not([style*="display: none"])) .rescue-badge,body:has(.help:not([style*="display: none"])) .rescue-badge{display:none!important}@media(max-width:760px),(max-height:500px){.drill-badge{top:auto;bottom:calc(185px + env(safe-area-inset-bottom));font-size:13px;padding:5px 10px;max-width:68vw;white-space:normal;text-align:center}.rescue-badge{top:auto;bottom:calc(228px + env(safe-area-inset-bottom));font-size:13px;padding:5px 10px;max-width:68vw;white-space:normal;text-align:center}}
