*{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;--controls-h: 52px;--footer-h: 28px}html,body,#app{width:100%;height:100%;overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}#canvas{display:block;width:100%;height:100%;touch-action:none}.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);max-height:42vh;overflow-y:auto}.hud.controls label{font-size:.68rem;color:var(--muted)}.hud.controls select,.hud.controls button{font-size:.78rem;padding:5px 8px;border-radius:6px;border:1px solid var(--border);background:#1e2d5099;color:var(--text)}.hud.controls button.ghost{background:transparent}.hud.controls button.active{border-color:var(--accent);color:var(--accent)}.hud.controls button:disabled{opacity:.45}.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;pointer-events:auto}.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,320px)}.hud.panel.collapsed .panel-body{display:none}.hud.panel.collapsed .toggle-summary{display:inline}.hud.panel.mission{left:12px;bottom:calc(var(--footer-h) + var(--controls-h) + 14px);width:min(420px,calc(100% - 24px));max-width:100%}.hud.panel.mission:not(.collapsed){max-height:min(50vh,380px)}.hud.panel.compare{right:12px;bottom:calc(var(--footer-h) + var(--controls-h) + 14px);width:min(360px,calc(100% - 24px))}.hud.panel.compare.hidden{display:none}.hud.panel.stage{right:12px;top:56px;width:min(300px,calc(100% - 24px));max-height:min(40vh,300px);overflow-y:auto;padding:12px 14px}.hud.panel.stage.hidden{opacity:0;pointer-events:none;transform:translate(8px)}.assessment{font-size:.76rem;line-height:1.4;margin:8px 0;padding:8px;border-radius:6px;background:#1e2d5059}.assessment.status-ok{border-left:3px solid var(--ok)}.assessment.status-warn{border-left:3px solid var(--warn)}.assessment.status-na{border-left:3px solid var(--muted)}.env-note{font-size:.68rem;color:var(--muted);margin-bottom:8px}.stats-compact,#panel-stats{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;font-size:.72rem}.stats-compact dt,#panel-stats dt{color:var(--muted)}.staging-details{margin-top:10px;font-size:.72rem}.staging-details summary{cursor:pointer;color:var(--accent);padding:6px 0}.event-list{color:var(--muted);padding:6px 0 0 18px;line-height:1.45}.compare-table{width:100%;font-size:.72rem;border-collapse:collapse}.compare-table th,.compare-table td{padding:4px 6px;border-bottom:1px solid var(--border)}.compare-table th{color:var(--accent)}#panel-close{position:absolute;top:6px;right:8px;border:none;background:none;color:var(--muted);font-size:1.3rem;cursor:pointer}#panel-title{font-size:.9rem;margin-bottom:8px;padding-right:22px;color:var(--accent)}.note{margin-top:8px;font-size:.65rem;color:var(--muted)}.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}.compare-only.hidden{display:none}@media(min-width:701px){.hud.controls{top:52px;left:12px;right:12px;bottom:auto;max-width:none;max-height:none}.hud.panel.mission{left:12px;right:auto;bottom:calc(var(--footer-h) + 12px);width:min(340px,32vw)}.hud.panel.mission:not(.collapsed) .panel-body{max-height:min(45vh,360px)}.hud.panel.compare{right:12px;left:auto;bottom:calc(var(--footer-h) + 12px);width:min(320px,30vw)}}@media(max-width:700px){:root{--controls-h: 88px}.hud.panel.stage{top:auto;bottom:calc(var(--footer-h) + var(--controls-h) + 52px);left:12px;right:12px;width:auto}}