:root{color-scheme:light dark;--bg: #f6f7f9;--panel: #ffffff;--panel-2: #f0f2f5;--ink: #10131a;--ink-2: #4a5261;--ink-3: #767f8f;--line: #d9dee6;--accent: #0b57d0;--accent-ink: #ffffff;--ok: #0f7b3f;--warn: #9a5b00;--bad: #b3261e;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--radius: 10px}@media (prefers-color-scheme: dark){:root{--bg: #0c0e12;--panel: #151920;--panel-2: #1d222b;--ink: #eef1f6;--ink-2: #b3bcca;--ink-3: #7e8899;--line: #2a313d;--accent: #6ea8fe;--accent-ink: #06101f;--ok: #56d68a;--warn: #f0b429;--bad: #ff6b60}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}.app{max-width:1180px;margin:0 auto;padding:24px 20px 72px}header.top{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:4px}header.top h1{font-size:22px;margin:0;letter-spacing:-.02em}header.top .sub{color:var(--ink-3);font-size:13px}.impl-badge{font:600 11px/1 var(--mono);padding:5px 8px;border-radius:999px;border:1px solid var(--line);background:var(--panel-2);color:var(--ink-2);text-transform:uppercase;letter-spacing:.06em}.impl-badge.mock{border-color:var(--warn);color:var(--warn)}.tabs{display:flex;gap:6px;margin:18px 0 20px;border-bottom:1px solid var(--line)}.tabs button{appearance:none;background:none;border:0;border-bottom:2px solid transparent;padding:10px 14px;font:inherit;font-weight:600;color:var(--ink-3);cursor:pointer}.tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--accent)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-bottom:16px}.panel h2{margin:0 0 4px;font-size:15px;letter-spacing:-.01em}.panel p.hint{margin:0 0 14px;color:var(--ink-3);font-size:13px}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}button.btn{appearance:none;font:inherit;font-weight:600;border-radius:8px;border:1px solid var(--line);background:var(--panel-2);color:var(--ink);padding:9px 16px;cursor:pointer}button.btn:hover:not(:disabled){border-color:var(--ink-3)}button.btn:disabled{opacity:.45;cursor:not-allowed}button.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}button.btn.stop{background:var(--bad);border-color:var(--bad);color:#fff;font-size:17px;padding:14px 34px;letter-spacing:.08em}label.file{display:inline-flex;align-items:center;gap:10px;padding:14px 18px;border:1px dashed var(--line);border-radius:var(--radius);cursor:pointer;background:var(--panel-2)}label.file input{display:none}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}.stat{background:var(--panel);padding:10px 12px}.stat .k{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}.stat .v{font:600 17px/1.3 var(--mono);margin-top:2px}.stat .v.small{font-size:13px;font-weight:500}.code{font:700 30px/1 var(--mono);letter-spacing:.16em;padding:12px 16px;background:var(--panel-2);border:1px solid var(--line);border-radius:8px;display:inline-block}.code.big{font-size:44px}.bar{height:8px;border-radius:999px;background:var(--panel-2);overflow:hidden;border:1px solid var(--line)}.bar>i{display:block;height:100%;background:var(--accent);transition:width .2s linear}.bar.ok>i{background:var(--ok)}.chunkmap{display:flex;flex-wrap:wrap;gap:2px;margin-top:10px}.chunkmap i{width:9px;height:9px;border-radius:2px;background:var(--panel-2);border:1px solid var(--line)}.chunkmap i.done{background:var(--ok);border-color:var(--ok)}.notice{border-radius:8px;padding:12px 14px;font-size:14px;border:1px solid var(--line);background:var(--panel-2)}.notice.bad{border-color:var(--bad);color:var(--bad)}.notice.warn{border-color:var(--warn);color:var(--warn)}.notice.ok{border-color:var(--ok);color:var(--ok)}.notice strong{display:block;margin-bottom:3px}.stage{display:flex;flex-direction:column;background:#000;border-radius:var(--radius);overflow:hidden}.stage .canvas-wrap{display:flex;align-items:center;justify-content:center;min-height:0;background:#000}.stage canvas{display:block;width:100%;height:auto;background:#fff}.stage .controls{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;background:var(--panel);border-top:1px solid var(--line);flex-wrap:wrap}html.immersive-open,body.immersive-open{overflow:hidden;height:100%;overscroll-behavior:none}.stage.immersive{position:fixed;inset:0;z-index:100;width:100vw;height:100vh;height:100dvh;border-radius:0;overflow:hidden;padding:0;padding-bottom:env(safe-area-inset-bottom,0);padding-top:env(safe-area-inset-top,0)}.stage.immersive .canvas-wrap{flex:1 1 auto;min-height:0;min-width:0;padding:6px}.stage.immersive canvas{width:100%;height:100%;object-fit:contain}.stage .strip{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;background:#000;color:#fff}.stage .strip-top{min-height:58px}.stage .strip-bottom{min-height:74px}.stage .strip-code{font:700 clamp(24px,7vw,44px) / 1 var(--mono);letter-spacing:.16em;color:#fff;white-space:nowrap}.stage .strip-facts{display:flex;gap:14px;flex-wrap:wrap;justify-content:flex-end;font:500 12px/1.3 system-ui,sans-serif;color:#b9c1cd;text-align:right}.stage .strip-facts b{color:#fff;font-family:var(--mono)}.stage .strip-hint{font:500 12px/1.35 system-ui,sans-serif;color:#b9c1cd;flex:1;min-width:0}.stage .strip .btn.stop{font-size:16px;padding:14px 26px;flex:0 0 auto}.stage .btn.ghost{background:transparent;border-color:#444c59;color:#fff;font-size:18px;line-height:1;padding:10px 14px}@media (orientation: landscape) and (max-height: 560px){.stage.immersive{flex-direction:row}.stage.immersive .strip{flex-direction:column;justify-content:center;align-items:flex-start;width:clamp(120px,20vw,210px);min-height:0;padding:10px}.stage.immersive .strip-code{font-size:clamp(20px,3.4vw,34px)}.stage.immersive .strip-facts{justify-content:flex-start;text-align:left;flex-direction:column;gap:4px}.stage.immersive .strip-bottom{align-items:stretch}}.preview{display:block;width:100%;max-width:480px;border-radius:8px;border:1px solid var(--line);background:#000}.kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;font-size:13px}.kv dt{color:var(--ink-3)}.kv dd{margin:0;font-family:var(--mono)}.mono{font-family:var(--mono)}.muted{color:var(--ink-3)}.small{font-size:13px}.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}select,input[type=range]{font:inherit}select{padding:7px 10px;border-radius:8px;border:1px solid var(--line);background:var(--panel-2);color:var(--ink)}footer.foot{color:var(--ink-3);font-size:12px;margin-top:26px;line-height:1.7}.panel.dropping{border-color:var(--accent);background:var(--panel-2)}textarea.note-input{width:100%;font:14px/1.55 var(--mono);padding:12px 14px;border-radius:8px;border:1px solid var(--line);background:var(--panel-2);color:var(--ink);resize:vertical}.rendered{border:1px solid var(--line);border-radius:8px;padding:4px 18px 14px;background:var(--panel-2);max-height:460px;overflow:auto}.rendered h1{font-size:20px}.rendered h2{font-size:17px}.rendered h3{font-size:15px}.rendered pre{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:10px 12px;overflow-x:auto}.rendered code{font-family:var(--mono);font-size:13px}.rendered blockquote{margin:0;padding-left:12px;border-left:3px solid var(--line);color:var(--ink-2)}.rendered a{color:var(--accent)}.rendered img{max-width:100%}pre.raw{font:13px/1.55 var(--mono);white-space:pre-wrap;word-break:break-word;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);padding:12px 14px;max-height:460px;overflow:auto;user-select:text}img.shot{max-width:100%;border-radius:8px;border:1px solid var(--line);background:var(--panel-2)}.panel.inner{background:var(--panel-2);margin-bottom:0}.panel.inner h2{font-size:14px}input[type=range]{vertical-align:middle;margin-left:8px;width:140px}.tag{font:600 10px/1 var(--mono);padding:3px 5px;border-radius:4px;border:1px solid var(--line);color:var(--ink-3);vertical-align:1px}label.small input[type=checkbox]{vertical-align:-1px;margin-right:2px}.stage canvas{image-rendering:pixelated;image-rendering:crisp-edges}.preview-wrap{display:block;margin-top:14px}.preview-wrap .capture-video{display:block;width:100%;max-width:480px;border-radius:8px;border:1px solid var(--line);background:#000}.capture{position:fixed;inset:0;z-index:120;width:100vw;height:100vh;height:100dvh;overflow:hidden;background:#000}.capture .capture-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}.capture .hud{position:absolute;inset:0;display:flex;flex-direction:column;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}.capture .hud-view{flex:1 1 auto;min-height:0;position:relative;display:flex;align-items:flex-start;padding:10px 12px}.capture .need{display:flex;align-items:baseline;gap:9px;background:#0000008c;backdrop-filter:blur(6px);border-radius:12px;padding:4px 12px}.capture .need-value{font:700 clamp(34px,11vw,68px) / 1 var(--mono);color:#fff;letter-spacing:-.02em}.capture .need-label{font:600 11px/1.2 system-ui,sans-serif;color:#cfd6e0;text-transform:uppercase;letter-spacing:.07em}.capture .hud-status{flex:0 0 auto;background:#080a0ee6;backdrop-filter:blur(10px);border-top:1px solid rgba(255,255,255,.12);padding:8px 12px 10px;display:flex;flex-direction:column;gap:7px}.capture .hud-problem{font:600 14px/1.25 system-ui,sans-serif;color:#e7ebf2}.capture .hud-problem .bad-text{color:#ff8b80}.capture .aim{height:5px;border-radius:999px;background:#fff3;overflow:hidden}.capture .aim>i{display:block;height:100%;background:#ffd23f;transition:width .15s linear}.capture .aim.ok>i{background:#4ade80}.capture .hud-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px 10px}.capture .hg{display:flex;flex-direction:column;min-width:0}.capture .hg span{font:500 9.5px/1.2 system-ui,sans-serif;color:#8b95a5;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.capture .hg b{font:600 13px/1.25 var(--mono);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.capture .hud-bottom{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));background:#080a0ef2;position:relative;z-index:2}.capture .hud-bottom .btn.stop{font-size:16px;padding:14px 28px;flex:1 1 auto}.capture .hud-bottom .btn.ghost{background:#ffffff14;border-color:#ffffff47;color:#fff;padding:14px 16px;flex:0 0 auto}.capture .hud-sheet{z-index:1;position:absolute;left:0;right:0;bottom:0;max-height:60dvh;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:#080a0ef5;backdrop-filter:blur(10px);color:#e7ebf2;padding:16px 16px calc(env(safe-area-inset-bottom,0px) + 92px);border-top:1px solid rgba(255,255,255,.14)}@media (orientation: landscape) and (max-height: 560px){.capture .hud{flex-direction:row}.capture .hud-view{flex:1 1 auto}.capture .hud-status{width:clamp(210px,42vw,340px);border-top:0;border-left:1px solid rgba(255,255,255,.12);justify-content:center}.capture .hud-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.capture .hud-bottom{flex-direction:column;width:auto;padding:10px}.capture .hud-bottom .btn.stop{flex:0 0 auto;height:100%}}.details-card{margin-top:14px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);padding:8px 12px}.details-card>summary{cursor:pointer;font-weight:600;font-size:13px;color:var(--ink-2)}.detail-body{display:flex;flex-direction:column;gap:12px;margin-top:10px;font-size:13px;line-height:1.5}.detail-block b{display:block;margin-bottom:2px}.detail-block .muted{color:var(--ink-3)}.capture .detail-block .muted{color:#98a2b3}.notice.compact{display:flex;align-items:baseline;gap:10px;padding:9px 12px}.notice.compact strong{margin:0}button.linkish{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer;opacity:.8}.capture .hud-status.doctor{gap:6px;max-height:62dvh;overflow:auto;overscroll-behavior:contain}.doc-verdict{font:600 14px/1.3 system-ui,sans-serif;color:#e7ebf2}.doc-verdict.good{color:#4ade80}.doc-verdict.workable{color:#ffd23f}.doc-verdict.bad{color:#ff8b80}.doc-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.doc-checks li{display:grid;grid-template-columns:12px minmax(0,auto) minmax(0,1fr);align-items:baseline;gap:4px 8px;font:500 12px/1.35 system-ui,sans-serif;color:#dfe4ec}.doc-checks b{font-weight:600;white-space:nowrap}.doc-checks i{font-style:normal;color:#8b95a5;font-family:var(--mono);font-size:11px;min-width:0;overflow:hidden;text-overflow:ellipsis}.doc-checks em{grid-column:2 / -1;font-style:normal;color:#ff8b80;font-size:11.5px}.doc-checks .dot{width:8px;height:8px;border-radius:999px;background:#6b7280;align-self:center}.doc-checks .dot.ok{background:#4ade80}.doc-checks .dot.bad{background:#ff8b80}.doc-checks .dot.wait{background:#6b7280}.doc-rec{font:500 12px/1.3 system-ui,sans-serif;color:#cfd6e0}.doc-rec b{font-family:var(--mono);color:#fff}
