:root{--bg: #0b0f14;--panel: #141a21;--border: #232c36;--fg: #d8e1e8;--dim: #7a8794;--accent: #2dd4bf;--warn: #f59e0b;--err: #ef4444}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:-apple-system,Segoe UI,Roboto,Noto Sans JP,sans-serif;font-size:14px}.app{display:grid;grid-template-columns:280px 1fr 320px;height:100vh}.panel{background:var(--panel);border-right:1px solid var(--border);overflow-y:auto;padding:16px}.panel.right{border-right:none;border-left:1px solid var(--border)}.panel h2{font-size:13px;text-transform:uppercase;color:var(--dim);margin:0 0 12px;letter-spacing:.08em}.field{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--border)}.field label{color:var(--dim)}.field .value{font-variant-numeric:tabular-nums}button{background:var(--panel);color:var(--fg);border:1px solid var(--border);padding:8px 12px;border-radius:4px;cursor:pointer;font-size:13px}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);color:#0b0f14;border-color:var(--accent);font-weight:600}input[type=range]{width:100%}input[type=number],input[type=text]{background:var(--bg);color:var(--fg);border:1px solid var(--border);padding:6px 8px;border-radius:4px;width:100%}.row{display:flex;gap:8px;margin:8px 0}.row>*{flex:1}.badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px}.badge.ok{background:#2dd4bf26;color:var(--accent)}.badge.warn{background:#f59e0b26;color:var(--warn)}.badge.err{background:#ef444426;color:var(--err)}.scene{position:relative}.scene .overlay{position:absolute;top:12px;left:12px;background:#0b0f14b3;border:1px solid var(--border);padding:8px 12px;border-radius:4px;font-size:12px;pointer-events:none}.cam-pip{position:absolute;right:16px;bottom:16px;width:320px;height:220px;background:#000;border:1px solid var(--border);border-radius:6px;overflow:hidden;box-shadow:0 4px 16px #00000080;display:flex;flex-direction:column}.cam-pip canvas{flex:1;display:block}.cam-pip-label{background:#0009;color:var(--fg);font-size:11px;padding:4px 8px;display:flex;align-items:center;gap:6px;letter-spacing:.05em}.cam-pip-foot{background:#0009;color:var(--dim);font-size:11px;padding:3px 8px;font-variant-numeric:tabular-nums}.cam-rec{color:var(--err);animation:blink 1.4s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}
