*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#05070d;--panel:#080c16b8;--border:#8caaff24;--text:#e8eefc;--muted:#7a8aab;--accent:#6eb6ff;--accent-dim:#6eb6ff26;--glow:0 0 24px #6eb6ff40;--mono:"JetBrains Mono", ui-monospace, monospace;--sans:"DM Sans", system-ui, sans-serif}html,body,#app{background:var(--bg);width:100%;height:100%;color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;font-size:13px;overflow:hidden}#c{width:100%;height:100%;display:block;position:absolute;inset:0}#hud{pointer-events:none;z-index:10;position:absolute;inset:0}#hud button,#hud input,#hud label,#hud .body-btn{pointer-events:auto}.hud-top{justify-content:space-between;align-items:flex-start;padding:20px 24px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand-mark{background:radial-gradient(circle at 35% 35%, #fff 0%, var(--accent) 40%, #1a4a8a 100%);width:10px;height:10px;box-shadow:var(--glow);border-radius:50%}.brand strong{letter-spacing:.22em;font-size:12px;font-weight:600;display:block}.brand .sub{color:var(--muted);font-family:var(--mono);letter-spacing:.04em;font-size:10px}.stats{background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:10px;gap:18px;padding:10px 16px;display:flex}.stat{flex-direction:column;gap:2px;min-width:64px;display:flex}.stat .label{font-family:var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-size:9px}.stat span:last-child{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:12px}.hud-side{width:168px;position:absolute;top:88px;left:24px}.panel{background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:12px;padding:12px}.panel-title{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;padding-left:4px;font-size:9px}.body-list{flex-direction:column;gap:2px;display:flex}.body-btn{width:100%;color:var(--text);font-family:var(--sans);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:7px;align-items:center;gap:8px;padding:7px 8px;font-size:12px;transition:background .15s,color .15s;display:flex}.body-btn:hover{background:var(--accent-dim)}.body-btn.active{background:var(--accent-dim);color:var(--accent);box-shadow:inset 0 0 0 1px #6eb6ff40}.body-btn .dot{border-radius:50%;flex-shrink:0;width:7px;height:7px}.body-btn.moon{color:var(--muted);padding-left:22px;font-size:11px}.body-btn.moon.active{color:var(--accent)}.body-btn.free-cam{border-bottom:1px solid var(--border);color:var(--muted);border-radius:7px 7px 0 0;margin-bottom:6px;padding-bottom:10px}.hud-bottom{flex-direction:column;align-items:center;gap:10px;width:min(640px,100% - 48px);display:flex;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.time-control{background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:14px;grid-template-columns:40px 1fr;align-items:center;gap:12px;width:100%;padding:12px 16px 8px;display:grid}#btn-pause{border:1px solid var(--border);background:var(--accent-dim);width:36px;height:36px;color:var(--accent);cursor:pointer;border-radius:9px;font-size:11px;line-height:1;transition:background .15s}#btn-pause:hover{background:#6eb6ff47}#time-slider{appearance:none;background:linear-gradient(90deg, #2a3a5c, var(--accent));cursor:pointer;border-radius:2px;outline:none;width:100%;height:4px}#time-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;box-shadow:0 0 0 3px #6eb6ff59, var(--glow);cursor:grab;background:#fff;border-radius:50%}#time-slider::-moz-range-thumb{cursor:grab;background:#fff;border:none;border-radius:50%;width:14px;height:14px;box-shadow:0 0 0 3px #6eb6ff59}.time-marks{font-family:var(--mono);color:var(--muted);grid-column:2;justify-content:space-between;padding:0 2px 2px;font-size:9px;display:flex}.toggles{background:var(--panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:999px;gap:16px;padding:8px 14px;display:flex}.toggles label{cursor:pointer;color:var(--muted);-webkit-user-select:none;user-select:none;align-items:center;gap:6px;font-size:11px;display:flex}.toggles input{accent-color:var(--accent)}.hint{color:var(--muted);letter-spacing:.04em;opacity:.75;font-size:10px}@media (width<=720px){.hud-side{display:none}.stats{gap:10px;padding:8px 10px}.brand .sub{display:none}}
