:root{--ink:#f3f0e8;--navy:#1e3a5f;--navy-soft:#2c4a6b;--panel:#141c26cc;--chip:#ffffffb8;--chip-border:#1e3a5f2e;--accent:#f2b134;--ok:#2f9e5f;--out:#e0642e;--na:#b8c2cc;--font:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--gutter:max(16px, env(safe-area-inset-left));--bottom:max(14px, env(safe-area-inset-bottom));--bar-h:60px}html,body{height:100%;font-family:var(--font);-webkit-text-size-adjust:100%;background:#cfe3f5;margin:0;overflow:hidden}#app{position:fixed;inset:0}canvas{touch-action:none;display:block}#controls{pointer-events:none;color:var(--ink);font-size:15px;position:fixed;inset:0}#controls *{box-sizing:border-box}#controls .top{left:var(--gutter);right:max(16px, env(safe-area-inset-right));top:max(12px, env(safe-area-inset-top));pointer-events:none;flex-wrap:wrap;align-items:center;gap:8px;display:flex;position:absolute}#controls .title{color:var(--navy);font-size:17px;font-weight:600}#controls .picker,#controls .aircraft{pointer-events:auto;appearance:none;font:inherit;color:var(--navy);background:var(--chip) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 8l4 4 4-4' fill='none' stroke='%231e3a5f' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 8px center / 16px;border:1px solid var(--chip-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;text-overflow:ellipsis;white-space:nowrap;border-radius:10px;max-width:100%;height:40px;padding:0 32px 0 12px;overflow:hidden;box-shadow:0 2px 10px #00000014}#controls .picker{font-size:16px;font-weight:600}#controls .aircraft{font-size:14px}#controls .picker[hidden],#controls .title[hidden],#controls .aircraft[hidden]{display:none}#controls .dash{left:var(--gutter);top:calc(max(12px, env(safe-area-inset-top)) + 52px);pointer-events:none;max-width:calc(100vw - 2 * var(--gutter));flex-wrap:wrap;gap:6px;display:flex;position:absolute}#controls .dash[hidden]{display:none}#controls .tile{background:var(--chip);min-width:92px;color:var(--navy);border:1px solid var(--chip-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-variant-numeric:tabular-nums;border-radius:10px;padding:6px 10px 7px;position:relative;overflow:hidden;box-shadow:0 2px 10px #00000014}#controls .tile:after{content:"";background:var(--na);height:3px;position:absolute;bottom:0;left:0;right:0}#controls .tile[data-state=ok]:after{background:var(--ok)}#controls .tile[data-state=out]:after{background:var(--out)}#controls .tile .lbl{letter-spacing:.04em;text-transform:uppercase;opacity:.7;font-size:11px}#controls .tile .val{font-size:18px;font-weight:700;line-height:1.2}#controls .tile .tol{opacity:.7;min-height:13px;font-size:11px}#controls .tile[data-state=out] .val{color:#b84a1c}#controls .credit{right:max(12px, env(safe-area-inset-right));bottom:max(6px, env(safe-area-inset-bottom));color:var(--navy-soft);opacity:.7;pointer-events:none;font-size:11px;position:absolute}#controls .lesson{left:50%;bottom:calc(var(--bottom) + var(--bar-h) + 8px);width:min(720px, calc(100vw - 2 * var(--gutter)));color:#1a2a3a;pointer-events:none;background:#ffffffed;border-radius:14px;padding:10px 16px 11px;position:absolute;transform:translate(-50%);box-shadow:0 6px 20px #0000002e}#controls .lesson[hidden]{display:none}#controls .lesson-head{align-items:baseline;gap:10px;display:flex}#controls .lesson .step{letter-spacing:.06em;text-transform:uppercase;color:var(--navy-soft);white-space:nowrap;font-size:11px}#controls .lesson .segment{color:var(--navy);font-size:15px;font-weight:600}#controls .lesson .callout{margin-top:4px;font-size:15px;line-height:1.4}#controls .lesson .callout[hidden]{display:none}#controls .bar{left:50%;bottom:var(--bottom);height:var(--bar-h);width:min(720px, calc(100vw - 2 * var(--gutter)));background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto;z-index:3;border-radius:16px;align-items:center;gap:6px;padding:8px 10px;display:flex;position:absolute;transform:translate(-50%);box-shadow:0 6px 24px #00000040}#controls button,#controls summary{min-width:44px;height:44px;color:var(--ink);font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:#ffffff14;border:0;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:0 10px;font-size:15px;list-style:none;display:inline-flex}#controls button:hover,#controls summary:hover{background:#ffffff29}#controls button:active{transform:scale(.96)}#controls button svg,#controls summary svg{width:22px;height:22px;display:block}#controls .play{color:var(--accent);background:#f2b13424}#controls .play svg{width:24px;height:24px}#controls .prev,#controls .next{opacity:.9;min-width:40px;padding:0 6px}#controls .scrubwrap{flex:1;min-width:70px;height:44px;position:relative}#controls .scrub{width:100%;height:100%;accent-color:var(--accent);cursor:pointer;background:0 0;margin:0;position:absolute;inset:0}#controls .ticks{pointer-events:none;height:0;position:absolute;top:50%;left:0;right:0}#controls .ticks i{background:#ffffff8c;border-radius:1px;width:2px;height:14px;position:absolute;top:-7px;transform:translate(-50%)}#controls .time{font-variant-numeric:tabular-nums;white-space:nowrap;opacity:.85;font-size:13px}#controls .layers{position:relative}#controls .layers summary::-webkit-details-marker{display:none}#controls .layers .menu{background:#131b25;border-radius:14px;flex-direction:column;gap:2px;width:max-content;padding:8px 14px 12px;display:flex;position:absolute;bottom:54px;right:0;box-shadow:0 6px 24px #00000073}#controls .menu-title{letter-spacing:.06em;text-transform:uppercase;opacity:.6;margin:10px 0 2px;font-size:11px}#controls .menu-title:first-child{margin-top:4px}#controls .menu-title[hidden]{display:none}#controls .layers label{cursor:pointer;align-items:center;gap:10px;min-height:36px;font-size:15px;display:flex}#controls .layers label[hidden]{display:none}#controls .layers input{width:18px;height:18px;accent-color:var(--accent);margin:0}#controls .menu-button{justify-content:flex-start;height:38px;margin-top:4px;font-size:15px}#controls .menu-button[hidden]{display:none}#controls .ar{color:var(--accent);font-weight:600}.ask{left:50%;bottom:calc(var(--bottom) + var(--bar-h) + 8px);width:min(720px, calc(100vw - 2 * var(--gutter)));box-sizing:border-box;z-index:2;background:var(--panel);color:var(--ink);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font:15px/1.4 var(--font);border-radius:14px;flex-direction:column;gap:12px;padding:14px 16px;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 8px 28px #00000059}.ask .ask-text{flex-direction:column;gap:4px;display:flex}.ask .ask-text span{opacity:.8;font-size:13px}.ask .ask-actions{gap:8px;display:flex}.ask button{height:44px;font:inherit;cursor:pointer;border:0;border-radius:10px;flex:1;font-weight:600}.ask .yes{background:var(--accent);color:#1a2a3a}.ask .no{color:var(--ink);background:#ffffff1a}#controls .tip{left:50%;bottom:calc(var(--bottom) + var(--bar-h) + 108px);background:var(--panel);color:var(--ink);white-space:nowrap;pointer-events:none;border-radius:12px;padding:10px 16px;font-size:14px;transition:opacity .8s;position:absolute;transform:translate(-50%);box-shadow:0 6px 20px #00000040}#controls .tip.fade{opacity:0}@media (width<=560px){#controls{font-size:14px}#controls .top{gap:6px}#controls .picker{flex:100%;height:38px;font-size:15px}#controls .aircraft{height:32px;font-size:13px}#controls .dash{top:calc(max(12px, env(safe-area-inset-top)) + 88px);gap:5px}#controls .tile{min-width:74px;padding:4px 8px 6px}#controls .tile .val{font-size:15px}#controls .tile .tol{font-size:10px}#controls .lesson{padding:8px 12px 9px}#controls .lesson .callout{font-size:14px;line-height:1.35}#controls .time{display:none}#controls .bar{gap:4px;padding:6px 8px}#controls .layers summary span{display:none}#controls button,#controls summary{min-width:40px;padding:0 8px}#controls .prev,#controls .next{min-width:34px;padding:0 2px}#controls .speed{min-width:38px;font-size:13px}#controls .credit{font-size:10px;bottom:1px;left:50%;right:auto;transform:translate(-50%)}#controls .tip{white-space:normal;text-align:center;width:calc(100vw - 64px)}}.lil-gui.root{--width:300px}