*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #050810;--panel: rgba(12, 18, 32, .94);--border: rgba(120, 160, 255, .25);--text: #e8eefc;--muted: #8b9bb8;--accent: #5eb3ff;--ok: #6fcf97;--warn: #ffb347;--err: #ff7b7b;--controls-h: 48px;--footer-h: 36px}html,body,#app{position:relative;width:100%;height:100%;height:100dvh;min-height:100dvh;overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}#canvas{display:block;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;touch-action:none;z-index:0}.hud{position:absolute;z-index:10;pointer-events:none}.hud>*{pointer-events:auto}.hud.top{top:0;left:0;right:0;padding:10px 14px;background:linear-gradient(to bottom,rgba(5,8,16,.88),transparent);pointer-events:none}.hud.top h1{font-size:1rem;font-weight:600}.hud.top .sub{font-size:.7rem;color:var(--muted)}.hud.controls{left:12px;right:12px;bottom:var(--footer-h);display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;padding:8px 10px;background:var(--panel);border:1px solid var(--border);border-radius:10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hud.controls button{font-size:.78rem;padding:5px 10px;border-radius:6px;border:1px solid var(--border);background:#1e2d5099;color:var(--text);cursor:pointer}.hud.controls button.ghost{background:transparent}.hud.controls button.active{border-color:var(--accent);color:var(--accent)}.chip{margin-left:auto;font-size:.68rem;color:var(--muted);padding:4px 8px;border-radius:999px;background:#1e2d5073;border:1px solid var(--border)}.chip[data-kind=ok]{color:var(--ok);border-color:#6fcf9759}.chip[data-kind=warn]{color:var(--warn)}.chip[data-kind=err]{color:var(--err)}.hud.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;overflow:hidden}.panel-toggle{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;border:none;background:#1e2d5080;color:var(--text);font-size:.78rem;text-align:left;cursor:pointer}.toggle-title{font-weight:600;color:var(--accent);white-space:nowrap}.toggle-summary{flex:1;font-size:.68rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chevron{font-size:.65rem;color:var(--muted);transition:transform .2s}.hud.panel:not(.collapsed) .chevron{transform:rotate(180deg)}.panel-body{overflow-y:auto;padding:0 12px 12px;max-height:min(42vh,300px)}.hud.panel.collapsed .panel-body{display:none}.hud.panel.telemetry{left:12px;bottom:calc(var(--footer-h) + var(--controls-h) + 14px);width:min(400px,calc(100% - 24px))}.stats-compact{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;font-size:.72rem}.stats-compact dt{color:var(--muted)}.note{margin-top:8px;font-size:.65rem;color:var(--muted);line-height:1.4}.hud.bottom{bottom:0;left:0;right:0;padding:6px 10px;font-size:.62rem;color:var(--muted);text-align:center;background:linear-gradient(to top,rgba(5,8,16,.92),transparent);pointer-events:none}.hud.bottom a{color:var(--accent);pointer-events:auto}@media(min-width:701px){.hud.controls{top:52px;left:12px;right:auto;bottom:auto;max-width:420px}.hud.panel.telemetry{left:12px;bottom:calc(var(--footer-h) + 12px);width:min(340px,32vw)}}@media(max-width:700px){:root{--controls-h: 88px}}