:root{--bg-0: #05060a;--bg-1: #0a0c14;--bg-2: #11141e;--fg-0: #e6e8ee;--fg-1: #9aa0b0;--accent: #7c5cff;--accent-2: #29e8d6;--danger: #ff4e6a;--ok: #29e8a6;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;background:var(--bg-0);color:var(--fg-0);overflow:hidden}.app{display:grid;grid-template-columns:1fr 340px;height:100%}.stage{position:relative;background:radial-gradient(ellipse at 50% 100%,rgba(124,92,255,.12),transparent 60%),radial-gradient(ellipse at 30% 0%,rgba(41,232,214,.06),transparent 60%),var(--bg-0)}.stage canvas{display:block;width:100%;height:100%}.ghost{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;font-size:clamp(120px,22vmin,280px);filter:drop-shadow(0 0 30px rgba(124,92,255,.6));transition:opacity .6s ease,transform .4s ease,filter .4s;-webkit-user-select:none;user-select:none}.ghost.idle{opacity:.18;transform:translateY(8px) scale(.95)}.ghost.motion{opacity:.95;transform:translateY(-4px) scale(1.05);filter:drop-shadow(0 0 50px var(--danger))}.ghost.armed-idle{opacity:.35}.hud-topleft{position:absolute;top:20px;left:24px;display:flex;flex-direction:column;gap:4px;font-variant-numeric:tabular-nums}.hud-topleft .title{font-size:13px;letter-spacing:.18em;color:var(--fg-1);text-transform:uppercase}.hud-topleft .state{font-size:28px;font-weight:700;text-shadow:0 0 14px currentColor}.state.idle{color:var(--fg-1)}.state.motion{color:var(--danger)}.state.offline{color:#666}.hud-bottom{position:absolute;bottom:18px;left:24px;right:24px;display:flex;gap:24px;font-size:13px;color:var(--fg-1)}.hud-bottom .metric b{color:var(--fg-0);font-weight:600}.sidebar{background:var(--bg-1);border-left:1px solid #1c2030;padding:20px;display:flex;flex-direction:column;gap:18px;overflow-y:auto}.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.06em}.brand .dot{width:8px;height:8px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 12px var(--accent-2)}.arm-toggle{display:flex;align-items:center;justify-content:space-between;background:var(--bg-2);border:1px solid #1c2030;border-radius:12px;padding:14px 16px}.arm-toggle .label{font-size:12px;color:var(--fg-1);text-transform:uppercase;letter-spacing:.16em}.arm-toggle .value{font-size:18px;font-weight:700}.arm-toggle.armed .value{color:var(--ok)}.arm-toggle button{background:transparent;border:1px solid #2a2f44;color:var(--fg-0);padding:8px 14px;border-radius:8px;cursor:pointer;font-weight:600;transition:.15s}.arm-toggle button:hover{border-color:var(--accent);color:var(--accent)}.arm-toggle.armed button{border-color:var(--ok);color:var(--ok)}.section-title{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-1);margin-bottom:4px}.metrics-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.metric-card{background:var(--bg-2);border-radius:10px;padding:12px;border:1px solid #1c2030}.metric-card .k{font-size:11px;color:var(--fg-1);text-transform:uppercase;letter-spacing:.1em}.metric-card .v{font-size:20px;font-weight:700;margin-top:4px;font-variant-numeric:tabular-nums}.log{background:var(--bg-2);border:1px solid #1c2030;border-radius:10px;padding:6px;max-height:280px;overflow-y:auto}.log .row{display:flex;justify-content:space-between;font-size:12px;padding:6px 8px;border-bottom:1px solid #161a25}.log .row:last-child{border-bottom:none}.log .row.intrusion{color:var(--danger)}.log .empty{padding:16px;text-align:center;color:var(--fg-1);font-size:12px}.connection-pill{position:absolute;top:20px;right:24px;display:flex;align-items:center;gap:8px;background:var(--bg-2);border:1px solid #1c2030;padding:6px 12px;border-radius:999px;font-size:11px;text-transform:uppercase;letter-spacing:.12em}.connection-pill .pulse{width:8px;height:8px;border-radius:50%;background:#555}.connection-pill.ok .pulse{background:var(--ok);box-shadow:0 0 10px var(--ok)}.connection-pill.bad .pulse{background:var(--danger)}
