html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:#02040a;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#ccc}canvas{display:block}.hud{position:absolute;top:12px;color:#9aa;font:13px system-ui,sans-serif;z-index:10;pointer-events:none}.hud-left{left:12px}.hud-right{right:12px;text-align:right;max-width:50vw}.hud-notice{position:absolute;top:42px;left:50%;transform:translate(-50%);padding:7px 12px;border:1px solid rgba(255,152,0,.35);border-radius:6px;background:#0c0c10bd;color:#ffcc80;font:13px system-ui,sans-serif;z-index:10;pointer-events:none}.time-bar{position:absolute;left:50%;bottom:18px;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:8px 12px;background:#000000b8;border-radius:8px;font:13px/1.2 system-ui,sans-serif;color:#ccc;z-index:10;-webkit-user-select:none;user-select:none}.time-bar button{padding:6px 12px;border:1px solid #444;border-radius:4px;background:#1a1a1a;color:#eee;cursor:pointer}.time-bar button.active{background:#ff9800;color:#111}.time-current{margin-left:6px}.info-panel{position:absolute;top:56px;right:16px;width:260px;background:#10121cf0;border:1px solid #333;border-radius:8px;padding:14px 16px;color:#ddd;font:12px/1.45 system-ui,sans-serif;z-index:10}.info-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.info-title{display:flex;gap:8px;align-items:center}.info-title strong{font-size:14px}.swatch{width:12px;height:12px;border-radius:50%;display:inline-block}.info-close{background:transparent;border:none;color:#888;cursor:pointer;font-size:16px}.info-grid{display:grid;grid-template-columns:88px 1fr;gap:6px 10px}.info-grid .muted{color:#888}.info-grid .accent{color:#ff9800}.fade-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;z-index:40;opacity:0;transition:none}.pov-btn{position:absolute;right:16px;bottom:22px;z-index:12;padding:10px 14px;border-radius:8px;border:1px solid rgba(255,180,80,.45);background:#120e0ad1;color:#ffcc80;font:13px system-ui,sans-serif;cursor:pointer;letter-spacing:.02em}.pov-btn:hover{background:#281c0ce6}.pov-btn.active{border-color:#78b4ff8c;color:#b8d8ff}.narrative-beat{position:fixed;left:50%;top:42%;transform:translate(-50%,-50%);z-index:25;max-width:min(90vw,520px);text-align:center;color:#f2e6d0;font:600 22px/1.4 system-ui,sans-serif;letter-spacing:.04em;text-shadow:0 0 24px rgba(0,0,0,.85),0 2px 8px rgba(0,0,0,.7);pointer-events:none;animation:beat-in .35s ease-out}@keyframes beat-in{0%{opacity:0;transform:translate(-50%,-46%)}to{opacity:1;transform:translate(-50%,-50%)}}.narrative-quote{position:fixed;left:50%;bottom:72px;transform:translate(-50%);z-index:11;max-width:min(86vw,420px);text-align:center;color:#b4bed28c;font:12px/1.5 system-ui,sans-serif;pointer-events:none;letter-spacing:.03em}.history-wrap{position:absolute;left:12px;bottom:18px;z-index:12}.history-toggle{padding:7px 10px;border-radius:6px;border:1px solid #333;background:#000000b8;color:#aaa;font:12px system-ui,sans-serif;cursor:pointer}.history-toggle.active{color:#ffcc80;border-color:#ff980066}.history-panel{margin-top:6px;width:min(260px,70vw);max-height:180px;overflow:auto;padding:8px 10px;border-radius:6px;border:1px solid #2a2a32;background:#0a0c12e6;font:12px/1.45 system-ui,sans-serif;color:#bbb}.history-item{padding:3px 0;border-bottom:1px solid rgba(255,255,255,.04)}.history-item:last-child{border-bottom:none}.history-destroy{color:#ffab80}.history-rebirth{color:#9ed0ff}.history-reset{color:#888}.history-panel .muted{color:#666}body.mode-pov .narrative-quote{bottom:28px;opacity:.4}body.mode-pov .hud{opacity:.55}body.mode-pov .history-wrap{opacity:.45}@media (max-width: 520px){.time-bar{gap:6px;max-width:calc(100vw - 18px);padding:7px 8px}.time-bar .time-label,.time-bar .time-current{display:none}.time-bar button{min-width:38px;padding:7px 9px}.pov-btn{right:10px;bottom:72px;padding:8px 10px;font-size:12px}}