:root{color-scheme:dark;font-family:Inter,"Noto Sans JP",system-ui,sans-serif;color:#e5eced;background:#0e1216;font-synthesis:none;--muted:#8c9aab;--line:#2b3540;--green:#a6f4ca}*{box-sizing:border-box}body{margin:0}main{max-width:1450px;margin:auto;padding:42px 44px 20px}header{display:flex;justify-content:space-between;align-items:center;gap:20px}.eyebrow{font-size:10px;letter-spacing:.18em;color:#aab6c4;display:flex;align-items:center;gap:12px}.rgb{display:flex;gap:3px}.rgb i{width:7px;height:7px;background:#f58b7d;border-radius:50%}.rgb i:nth-child(2){background:#a6f4ca}.rgb i:nth-child(3){background:#86baff}h1{font-size:40px;margin:8px 0;letter-spacing:-.035em;font-weight:650}h1 span{font-weight:350;color:#c3cbd4;margin-left:10px}.badge{border:1px solid #3b464f;border-radius:30px;padding:8px 13px;color:#b1bfcb;font-size:10px;letter-spacing:.05em}.intro{font-size:13px;color:var(--muted);margin:14px 0 28px;line-height:1.8}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}.metrics article{border:1px solid var(--line);border-radius:12px;padding:17px 22px;background:#151c23;display:grid;grid-template-columns:1fr auto;align-items:end}.metrics article>span{font-size:12px;grid-column:1/-1;color:#bcc8d4}.metrics strong{font-size:46px;line-height:1.35;font-weight:500;font-variant-numeric:tabular-nums}.metrics small{font-size:10px;color:var(--muted);padding-bottom:10px}.metrics .accent{background:#182925;border-color:#365447}.accent strong{color:var(--green)}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}.viewer{min-width:0}.viewer-bar{padding:13px 16px;display:flex;align-items:center;justify-content:space-between;font-size:11px;border:1px solid var(--line);border-bottom:0;border-radius:10px 10px 0 0;background:#171e25;color:#a5b2c0}#state b{display:inline-block;width:6px;height:6px;border-radius:50%;background:#788594;margin-right:6px}.stage{position:relative;background:#090d11;aspect-ratio:4/3;border:1px solid var(--line);overflow:hidden}.stage video,.stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.stage video.mirror,.stage #demo-canvas.mirror{transform:scaleX(-1)}#overlay{pointer-events:none}#empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(ellipse at center,#1c2a30 0%,#10171d 70%)}#empty[hidden]{display:none}.viewfinder{color:#9cd8bb;font-size:30px;width:66px;height:66px;border:1px solid #476b5c;border-radius:18px;display:grid;place-items:center;margin-bottom:12px}#empty h2{font-weight:450;font-size:17px}#empty p{font-size:12px;line-height:1.9;color:var(--muted)}#source-badge{position:absolute;left:12px;bottom:12px;background:#0e151de8;color:#a8c1d8;padding:7px 10px;font-size:10px;border-radius:5px}.telemetry{display:flex;flex-wrap:wrap;gap:10px 24px;font-size:10px;color:var(--muted);padding:15px 16px;border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px}.telemetry b{color:#dce4eb;font-variant-numeric:tabular-nums;font-weight:500;margin-left:5px}#status,#error{font-size:12px;line-height:1.8;margin:13px 2px;color:var(--muted)}#error{color:#ffd2c5;background:#382323;padding:12px;border-radius:8px}.controls{border:1px solid var(--line);border-radius:12px;background:#151c23;padding:0 20px}.controls section{padding:20px 0}.controls section+section{border-top:1px solid var(--line)}h2{font-size:12px;margin:0 0 16px;letter-spacing:.025em}.controls h2 span{color:#758392;margin-right:10px;font-size:10px}label{font-size:12px;display:block;color:#cbd5df;margin-bottom:10px}.camera-row{display:flex;gap:7px}.camera-row select{min-width:0;flex:1}button,select{border:1px solid #3d4a57;border-radius:7px;padding:10px 12px;font:inherit;font-size:12px;color:#d6e0e8;background:#202a34}button{cursor:pointer;transition:background .15s}button:hover{background:#334352}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--green);outline-offset:3px}button:disabled{opacity:.4;cursor:default}.buttons{display:flex;gap:8px;margin-top:10px}.buttons .primary{flex:1;background:var(--green);border-color:var(--green);color:#14362a;font-weight:650}.primary:hover{background:#c6ffdf}.text-button{border:0;background:none;padding:12px 0 0;font-size:11px;color:#a6c9b7}.icon-button{padding:7px 12px;font-size:20px}.toggles label,.caution-toggle{display:flex;align-items:center;gap:8px;font-size:11px;margin:12px 0}input[type=checkbox]{accent-color:var(--green);width:14px;height:14px;margin:0}input[type=range]{width:100%;accent-color:var(--green);margin:5px 0 8px}.range-label{display:flex;justify-content:space-between;margin-top:19px;font-size:11px}.range-label output{color:var(--green)}.hint{font-size:10px;color:var(--muted);line-height:1.8;margin:6px 0 10px}#calibrate{width:100%;font-size:11px}#calibration{color:#b4cbbb}.notes{display:grid;grid-template-columns:1fr 1fr;gap:40px;border-top:1px solid var(--line);margin-top:28px;padding-top:25px}.notes h2{color:#c5d1dc}.notes p{font-size:11px;line-height:1.9;color:var(--muted)}a{color:#acd7c1}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px;margin-left:8px}.dot:first-child{margin-left:0}.green{background:#a6f4ca}.orange{background:#f7b783}.gray{background:#99aabd}footer{display:flex;justify-content:space-between;padding-top:27px;margin-top:12px;color:#667585;font-size:9px;letter-spacing:.1em}footer span{color:#536271}@media(min-width:1500px){.stage{aspect-ratio:16/10}}@media(max-width:1000px){main{padding:25px}.workspace{grid-template-columns:minmax(0,1fr) 270px;gap:16px}.metrics article{padding:14px}.metrics small{grid-column:1/-1;padding:0}.metrics strong{font-size:38px}}@media(max-width:740px){main{padding:22px 16px 18px}header{align-items:flex-start}.badge{font-size:8px;padding:6px 8px}h1{font-size:27px}h1 span{display:block;font-size:21px;margin:4px 0 0}.intro{font-size:11px;margin-bottom:20px}.metrics{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}.metrics article{padding:11px 14px}.metrics strong{font-size:34px}.metrics article>span{font-size:10px}.metrics small{font-size:9px}.workspace{display:block}.controls{margin-top:22px}.stage{aspect-ratio:4/3}#empty h2{font-size:13px}#empty p{font-size:10px}.telemetry{gap:10px 15px;font-size:9px}.notes{grid-template-columns:1fr;gap:16px;margin-top:25px}.notes h2{margin-bottom:8px}footer{gap:15px;font-size:8px}#source-badge{font-size:8px;left:7px;bottom:7px}.controls section{padding:18px 0}}

/* Two primary capabilities; auxiliary counts stay beside telemetry. */
.metrics:not(.analysis-metrics) { grid-template-columns: repeat(2,minmax(0,1fr)); }
.telemetry { flex-wrap: wrap; row-gap: 8px; }