:root{--bg:#0c1016;--bg2:#121a24;--ink:#e8edf2;--dim:#8294a6;--faint:#3a4858;--accent:#7fd4d4;--accent2:#f4b454;--maxw:820px;--serif:"Fraunces",Georgia,"Times New Roman",serif;--mono:"Spline Sans Mono",ui-monospace,Menlo,Consolas,monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:radial-gradient(1200px 700px at 50% -10%,#16202c 0%,transparent 60%),radial-gradient(900px 600px at 100% 110%,#101820 0%,transparent 55%),var(--bg);color:var(--ink);font-family:var(--mono);overflow:hidden;-webkit-font-smoothing:antialiased}#app{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center}.topbar,.controls-top,.stage,.under,.bottombar{width:100%;max-width:var(--maxw)}.topbar{padding:22px 22px 20px;text-align:center}.title{font-family:var(--serif);font-weight:500;line-height:1.05}.title .big{font-size:38px;letter-spacing:.5px}.title .sub{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--dim);margin-top:10px;font-family:var(--mono)}.controls-top{display:flex;flex-direction:column;gap:8px;padding:18px 22px 0;z-index:3}.ctrl label{display:flex;justify-content:space-between;gap:10px;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:7px}.ctrl label .val{color:var(--ink);letter-spacing:0;text-transform:none;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row{display:flex;gap:10px;align-items:center}.locbar{display:flex;flex-direction:column;gap:12px;align-items:stretch;max-width:820px}.ctrl.loc{position:relative;width:100%}.search-pill{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;width:100%;background:#141c2699;border:1px solid var(--faint);border-radius:999px;padding:12px 16px 12px 20px;transition:.2s}.search-pill:focus-within{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}.search{flex:1 1 200px;min-width:140px;font-family:var(--mono);font-size:17px;color:var(--ink);background:none;border:none;outline:none;padding:2px 0}.search::placeholder{color:var(--ink);opacity:1}.search.prompting::placeholder{color:var(--faint)}.search::-webkit-search-cancel-button{display:none;-webkit-appearance:none}.loc .hint{margin-left:21px}.wline{font-size:12px;color:var(--dim);flex:0 1 auto;min-width:0;display:flex;align-items:center;flex-wrap:wrap;gap:3px 14px}.wline .wgrp{white-space:nowrap}.wline b{color:var(--ink);font-weight:500}.wline .wsep{width:1px;height:14px;background:#3a485899}.wline .unit{cursor:pointer;border-bottom:1px dashed rgba(130,148,166,.45);transition:.15s}.wline .unit:hover{color:var(--ink);border-bottom-color:var(--accent)}.wline .unit:focus-visible{outline:1px solid var(--accent);outline-offset:2px}.loc-clear{flex:0 0 auto;width:19px;height:19px;line-height:1;padding:0;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:13px;font-weight:600;color:var(--bg);background:#8294a68c;border:none;border-radius:50%;cursor:pointer;transition:.15s}.loc-clear:hover{background:#a0b4c8cc}.loc-clear[hidden]{display:none}.loc-gap{height:14px}.hint{display:block;margin-top:7px;font-size:11px;color:#5d7085;letter-spacing:1px;line-height:1.5}.hint.warn{color:var(--accent2)}.toggles{display:grid;grid-template-columns:minmax(0,1fr) clamp(150px,30%,300px);justify-items:center;align-items:center;gap:12px;padding:2px 0 4px}.phys-slot{width:100%;max-width:var(--maxw);height:64px;padding:10px 22px 0}.phys{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 28px;align-items:center}.phys .presets,.phys[hidden]{display:none}.phys .slim{display:flex;flex-direction:column;gap:7px;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);min-width:0}.phys .slim .lbl{display:flex;justify-content:space-between;gap:8px;white-space:nowrap}.phys .slim .lbl b{color:var(--accent);font-weight:600;letter-spacing:.5px}.phys .slim input[type=range]{width:100%}.phys .presets button{font:inherit;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);background:transparent;border:1px solid rgba(120,140,160,.28);border-radius:999px;padding:3px 12px;cursor:pointer;transition:color .15s,border-color .15s}.phys .presets button:hover{color:var(--ink);border-color:#788ca080}.phys .presets button.on{color:var(--accent);border-color:var(--accent)}.stage{flex:1;position:relative;min-height:180px}canvas{display:block;width:100%;height:100%}.under{display:grid;grid-template-columns:auto auto auto;justify-content:center;gap:16px 48px;align-items:end;padding:14px 22px 0;z-index:4}.pitch-ctl{display:flex;flex-direction:column;align-items:center;justify-content:space-between;height:52px}.pitch-ctl button{width:24px;height:24px;border-radius:50%;font-family:var(--mono);font-size:13px;line-height:1;padding:0;color:var(--dim);background:transparent;border:1px solid var(--faint);cursor:pointer;transition:.15s}.pitch-ctl button:hover:enabled{border-color:var(--accent);color:var(--ink)}.pitch-ctl button:disabled{opacity:.3;cursor:default}.pitchblock .ctrl label,.bigdd label{margin-bottom:9px}.bigdd .dd-trigger{font-family:var(--serif);font-size:24px;letter-spacing:.3px;padding:0 18px;height:52px;line-height:1}.bigdd .dd-caret{font-size:13px;margin-left:6px}.keyblock .dd{width:104px}.modeblock .dd{width:236px}.bigdd .dd-label{text-align:center;flex:1}.modeblock .dd-label{color:var(--accent)}.bottombar{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px 22px max(18px,env(safe-area-inset-bottom));z-index:3}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;outline:none;touch-action:none}input[type=range]::-webkit-slider-runnable-track{height:3px;background:var(--faint);border-radius:3px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5.5px;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 12px var(--accent)}input[type=range]::-moz-range-track{height:3px;background:var(--faint);border-radius:3px}input[type=range]::-moz-range-thumb{width:14px;height:14px;border:none;border-radius:50%;background:var(--accent);cursor:pointer;box-shadow:0 0 12px var(--accent)}button.toggle{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);background:transparent;border:1px solid var(--faint);border-radius:999px;padding:8px 14px;cursor:pointer;transition:.2s;white-space:nowrap}button.toggle.on{color:var(--bg);background:var(--accent);border-color:var(--accent);box-shadow:0 0 18px -2px var(--accent)}button.toggle:hover{border-color:var(--accent);color:var(--ink)}button.toggle.on:hover{color:var(--bg)}.select{font-family:var(--mono);font-size:12px;color:var(--ink);width:100%;background:#141c2699;border:1px solid var(--faint);border-radius:999px;padding:8px 14px;outline:none;cursor:pointer;transition:.2s}.select:focus{border-color:var(--accent)}.results,.dd-panel{position:absolute;left:0;right:0;z-index:6;display:flex;background:#0a0e14f7;border:1px solid var(--faint);border-radius:14px;overflow-y:auto;max-height:min(304px,44vh);overscroll-behavior:contain;box-shadow:0 18px 50px -12px #000000b3;backdrop-filter:blur(6px)}.dd-panel{flex-direction:column}.results[hidden],.dd-panel[hidden]{display:none}.results.up{bottom:calc(100% + 8px);flex-direction:column-reverse}.results.down{top:calc(100% + 8px);flex-direction:column}.dd-panel.up{bottom:calc(100% + 8px)}.dd-panel.down{top:calc(100% + 8px)}.results .item,.dd-panel .item{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 16px;cursor:pointer;transition:.12s;line-height:1.4}.results.up .item{border-top:1px solid rgba(58,72,88,.4)}.results.up .item:last-child{border-top:none}.results.down .item,.dd-panel .item{border-bottom:1px solid rgba(58,72,88,.4)}.results.down .item:last-child,.dd-panel .item:last-child{border-bottom:none}.results .item:hover,.results .item.active,.dd-panel .item:hover,.dd-panel .item.active{background:#7fd4d41f}.results .item.active,.dd-panel .item.active{box-shadow:inset 2px 0 0 var(--accent)}.results .place,.dd-panel .place{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}.results .where,.dd-panel .where{color:var(--ink);font-size:13px}.results .region,.dd-panel .region{color:#9db0c2;font-size:11px;letter-spacing:.3px}.dd-panel .item.selected .where{color:var(--accent)}.results .dist{color:var(--dim);font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums}.results .empty{padding:12px 16px;font-size:11px;color:var(--dim)}.dd{position:relative}.dd-trigger{display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:left}.dd-trigger:hover{border-color:var(--accent)}.dd-label{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dd-caret{color:var(--dim);font-size:11px;line-height:1;transition:.2s}.dd.open .dd-caret{transform:rotate(180deg)}@media (max-width: 720px){#app{overflow-y:auto;overscroll-behavior:contain}.stage{flex:none;height:min(44vh,420px);min-height:230px}.topbar{padding:16px 16px 10px}.title .big{font-size:24px}.controls-top{padding:4px 16px 0}.wline{flex-basis:100%;order:3;padding-left:2px;font-size:11px;gap:3px 12px}.wline .wsep{display:none}.loc-gap{height:6px}.toggles{padding:0 0 2px}.phys-slot{height:auto;min-height:22px;padding:0 16px 26px}.phys{grid-template-columns:1fr 1fr 1fr;gap:4px 30px;position:relative;z-index:5}.toggles{grid-template-columns:1fr auto;justify-items:start}.toggles .toggle:first-child{margin-left:16px}.toggles #b-physics{justify-self:end;margin-right:16px}button.toggle{font-size:10px;padding:7px 12px}.under{grid-template-columns:auto auto 1fr;justify-content:stretch;gap:10px 18px;padding:14px 16px 0}.bigdd .dd-trigger{font-size:21px;padding:0 15px;height:46px}.keyblock .dd{width:104px}.modeblock .dd{width:100%}.pitch-ctl{flex-direction:row;justify-content:center;gap:10px;height:46px}.pitch-ctl button{width:34px;height:34px;font-size:15px}input[type=range]{height:32px}input[type=range]::-webkit-slider-thumb{width:20px;height:20px;margin-top:-8.5px}input[type=range]::-moz-range-thumb{width:20px;height:20px}}@media (orientation: landscape) and (max-height: 480px){#app{overflow-y:auto;overscroll-behavior:contain}.stage{flex:none;height:72vh;min-height:240px}.topbar{padding:12px 16px 6px}.title .big{font-size:22px}.controls-top{padding:0 16px}}.overlay{position:fixed;inset:0;z-index:9;background:#080b0fed;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:38px;text-align:center;padding:30px;backdrop-filter:blur(3px);perspective:900px}.overlay h1{font-family:var(--serif);font-weight:400;font-size:clamp(38px,7vw,68px);letter-spacing:1px}.intro-copy{display:flex;flex-direction:column;gap:12px;max-width:560px;margin:0}.intro-copy .s1,.intro-copy .s2{display:block;color:var(--dim);font-size:16px;line-height:1.7}.start{font-family:var(--mono);font-size:14px;letter-spacing:3px;text-transform:uppercase;color:var(--bg);background:var(--accent);border:none;border-radius:999px;padding:17px 44px;cursor:pointer;box-shadow:0 0 40px -6px var(--accent);transition:.2s}.start:hover{transform:translateY(-2px)}.note{position:absolute;bottom:24px;color:var(--faint);font-size:12px;letter-spacing:2px}#introTitle,.intro-copy .s1,.intro-copy .s2,.start,#introNote{will-change:transform,opacity}.overlay.flythrough{pointer-events:none;animation:overlayOut .45s ease .75s forwards}.overlay.flythrough #introTitle{animation:flyTitle 1.15s cubic-bezier(.55,0,.85,.36) forwards}.overlay.flythrough .intro-copy .s1{animation:flyLine1 1.15s cubic-bezier(.55,0,.85,.36) forwards}.overlay.flythrough .intro-copy .s2{animation:flyLine2 1.15s cubic-bezier(.55,0,.85,.36) forwards}.overlay.flythrough .start,.overlay.flythrough #introNote{animation:fadeOut .35s ease forwards}@keyframes flyTitle{to{transform:translateY(-120vh) scale(6);opacity:0}}@keyframes flyLine1{to{transform:translateY(-70vh) scale(4.5);opacity:0}}@keyframes flyLine2{to{transform:translateY(38vh) scale(4.5);opacity:0}}@keyframes fadeOut{to{opacity:0}}@keyframes overlayOut{to{opacity:0;visibility:hidden}}.reveal-item{opacity:0;transform:translateY(10px);transition:opacity .8s ease,transform .8s ease;transition-delay:var(--reveal-delay, 0ms)}.reveal-item.in{opacity:1;transform:none}@media (prefers-reduced-motion: reduce){.overlay.flythrough #introTitle,.overlay.flythrough .intro-copy .s1,.overlay.flythrough .intro-copy .s2{animation:none;opacity:0}.overlay.flythrough{animation:overlayOut .3s ease forwards}.reveal-item{transition-duration:.3s;transform:none}}