:root{color-scheme:light dark}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font-family:system-ui,sans-serif}#app{min-height:100vh;display:grid;place-items:center}.stage{position:fixed;top:0;right:0;bottom:0;left:0}.stage canvas{display:block;width:100%;height:100%}.loader{position:absolute;top:50%;left:50%;margin:-20px 0 0 -20px;width:40px;height:40px;border:3px solid color-mix(in srgb,var(--ship-color) 30%,transparent);border-top-color:var(--ship-color);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.overlay{position:fixed;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:1.5rem;text-align:center;pointer-events:none}.overlay .badge{width:48px;height:48px;color:var(--ship-color)}.overlay .badge svg{width:100%;height:100%}.overlay .ship-name{margin:0;font-size:clamp(1.4rem,4vw,2.4rem);letter-spacing:.02em}.overlay .callsign{margin:0;opacity:.7;font-variant:small-caps}.fallback{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:2rem;text-align:center}.fallback .badge{width:72px;height:72px;color:var(--ship-color)}.fallback .badge svg{width:100%;height:100%}.fallback .ship-name{margin:0;font-size:clamp(1.6rem,5vw,2.6rem)}.fallback .callsign{margin:0;opacity:.7;font-variant:small-caps}.fallback .swatch{width:96px;height:8px;border-radius:4px;background:var(--ship-color)}.fallback .note{margin:0;opacity:.55;font-size:.85rem}