:root{--bg: #0f172a;--panel: #1e293b;--panel-2: #273549;--text: #e2e8f0;--muted: #94a3b8;--line: #334155;--accent: #38bdf8;--within: #22c55e;--edge: #f59e0b;--outside: #ef4444;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text);font-size:15px;line-height:1.5}a{color:var(--accent)}.app{max-width:760px;margin:0 auto;padding:12px 14px 64px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0 12px;border-bottom:1px solid var(--line);margin-bottom:14px}.topbar h1{font-size:18px;margin:0}.topbar nav a{margin-left:12px;text-decoration:none;font-size:14px}.topbar nav a.active{color:var(--text);border-bottom:2px solid var(--accent);padding-bottom:2px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:14px}.muted{color:var(--muted)}.small{font-size:13px}.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.col{display:flex;flex-direction:column;gap:6px}.spread{justify-content:space-between}button{font:inherit;padding:10px 14px;border-radius:10px;border:1px solid var(--line);background:var(--panel-2);color:var(--text);cursor:pointer}button.primary{background:var(--accent);color:#04293a;border-color:transparent;font-weight:600}button:disabled{opacity:.5;cursor:not-allowed}button.danger{color:#fecaca;border-color:#7f1d1d}.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.seg button{border:none;border-radius:0;background:transparent}.seg button.on{background:var(--accent);color:#04293a;font-weight:600}label.field{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}select,input[type=number],input[type=file]{font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:8px}.stage{position:relative;width:100%;background:#000;border-radius:10px;overflow:hidden}.stage video,.stage canvas{display:block;width:100%;height:auto}.stage canvas.overlay{position:absolute;top:0;right:0;bottom:0;left:0}.guide-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.guide-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.guide-box{fill:none;stroke:#38bdf8cc;stroke-width:.6;stroke-dasharray:2 2}.guide-line{stroke:#38bdf880;stroke-width:.4}.guide-line-faint{stroke:#ffffff40;stroke-width:.3}.guide-hints{position:absolute;left:8px;bottom:8px;right:8px;font-size:12px;background:#0f172a8c;border-radius:8px;padding:6px 8px}.guide-hints p{margin:2px 0}.guide-hint-dynamic{color:var(--edge);font-weight:600}.cards{display:grid;grid-template-columns:1fr;gap:12px}@media(min-width:560px){.cards{grid-template-columns:1fr 1fr}}.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;border-left:4px solid var(--line)}.card.within{border-left-color:var(--within)}.card.edge{border-left-color:var(--edge)}.card.outside{border-left-color:var(--outside)}.card .label{font-size:13px;color:var(--muted)}.card .value{font-size:26px;font-weight:700}.card .value .unit{font-size:15px;color:var(--muted);font-weight:400}.card .headline{font-size:13.5px;margin:6px 0 2px}.card .detail{font-size:12.5px;color:var(--muted)}.status-chip{font-size:11px;padding:1px 7px;border-radius:999px;vertical-align:middle}.status-chip.within{background:#22c55e2e;color:#86efac}.status-chip.edge{background:#f59e0b2e;color:#fcd34d}.status-chip.outside{background:#ef44442e;color:#fca5a5}.rangebar{position:relative;height:12px;background:var(--panel-2);border-radius:999px;margin:10px 0 4px}.rangebar .band{position:absolute;top:0;bottom:0;background:#22c55e59}.rangebar .band.edge{background:#f59e0b40}.rangebar .marker{position:absolute;top:-3px;width:3px;height:18px;background:var(--text);border-radius:2px}.rangebar-scale{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.disclaimer{font-size:12.5px;color:var(--muted);background:var(--panel-2);border-radius:10px;padding:10px 12px}.retake{border-left:4px solid var(--edge)}.retake ul{margin:8px 0 0;padding-left:18px}.retake li{margin:4px 0}.session-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px}.session-item .meta{font-size:12px;color:var(--muted)}.progress{height:8px;background:var(--panel-2);border-radius:999px;overflow:hidden}.progress>div{height:100%;background:var(--accent)}.kv{display:flex;gap:6px;font-size:13px}.kv .k{color:var(--muted);min-width:92px}.center{text-align:center}.spinner{font-size:14px;color:var(--muted)}.checkbox{display:flex;gap:8px;align-items:center}
