:root{--bg: #0f1220;--panel: #161a2f;--text: #e8ecff;--muted: #9aa3c7;--accent: #6ea8fe;--good: #40d1a7;--warn: #ffb86b;--danger: #ff6b8b}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial}.wrap{max-width:1100px;margin:24px auto;padding:16px}.header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.header h1{font-size:20px;margin:0;letter-spacing:.3px}.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.btn{background:var(--panel);color:var(--text);border:1px solid #2a3056;padding:8px 12px;border-radius:10px;cursor:pointer}.btn:hover{background:#1c2140}.btn[aria-pressed=true]{outline:2px solid var(--accent)}.pill{padding:6px 10px;border:1px solid #2a3056;border-radius:999px;background:var(--panel);color:var(--muted)}.row{display:flex;gap:10px;align-items:center}label{color:var(--muted);font-size:14px}input[type=range]{width:160px}main{display:grid;grid-template-columns:1fr 320px;gap:16px;align-items:start}@media (max-width: 980px){main{grid-template-columns:1fr}}.stage{background:#0b0e19;border:1px solid #2a3056;border-radius:16px;padding:12px;position:relative}.canvas{display:block;width:100%;height:auto;background:radial-gradient(100% 100% at 50% 0%,#0f1532,#0d1126);border-radius:12px;touch-action:none}.aside{background:var(--panel);border:1px solid #2a3056;border-radius:16px;padding:12px}.aside h2{font-size:16px;margin:0 0 8px;color:var(--muted)}.kv{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;margin:10px 0;font-size:14px}.badge{padding:2px 8px;border-radius:999px;background:#20264a;color:var(--muted);border:1px solid #2a3056}.videoBox{position:relative;aspect-ratio:4/3;width:100%;background:#0b0e19;border:1px dashed #2a3056;border-radius:10px;overflow:hidden}.video,.debug{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.video.hidden{display:none}.hint{color:var(--muted);font-size:13px;line-height:1.35}.ok{color:var(--good)}.warn{color:var(--warn)}.err{color:var(--danger)}.footnote{color:var(--muted);margin-top:12px;font-size:12px}