:root{--bg: #14161a;--panel: #1c2027;--panel-2: #232833;--line: #313846;--text: #e6e9ef;--muted: #939cad;--accent: #58a6ff;--ok: #3fb950;--warn: #d29922;--bad: #f85149;--gap: 12px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);line-height:1.45}#app{display:flex;flex-direction:column;gap:var(--gap);padding:var(--gap);max-width:1600px;margin:0 auto}h1{font-size:15px;margin:0;letter-spacing:.5px}h2{font-size:12px;margin:0 0 8px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:600}.panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:10px 12px}.row{display:flex;gap:var(--gap);align-items:flex-start;flex-wrap:wrap}.row>.panel{flex:1 1 320px;min-width:0}button,select,input[type=text],input[type=password],input[type=number]{font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:4px;padding:4px 8px}button{cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);color:#06121f;border-color:var(--accent);font-weight:700}label{color:var(--muted)}dialog.settings{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:12px 16px;min-width:min(480px,90vw)}dialog.settings::backdrop{background:#0000008c}.settings-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.settings .field{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}.settings .field>label{min-width:90px}header.panel{display:flex;flex-direction:column;gap:8px}.header-line{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.spacer{flex:1}.dropzone{border:1px dashed var(--line);border-radius:4px;padding:4px 10px;color:var(--muted)}.dropzone.over{border-color:var(--accent);color:var(--accent)}.progress.busy>div{animation:pulse 1.1s ease-in-out infinite;transition:none}@keyframes pulse{0%,to{opacity:.25}50%{opacity:.7}}.stepper{display:flex;flex-direction:column;gap:6px}.stepper .header-line>button:first-child,.stepper .header-line>button:nth-child(2){min-width:42px;font-size:14px;line-height:1}.modes{display:inline-flex;gap:4px}.modes button.on{border-color:var(--accent);color:var(--accent)}.inspector canvas{max-width:100%}.inspector .legend strong{color:var(--accent);font-size:14px}.inspector .panel{position:relative}.paneloading{display:none}.inspector.loading .paneloading{display:grid;position:absolute;inset:30px 12px 12px;place-items:center;border-radius:4px;background:var(--panel-2);color:var(--muted);font-size:12px;min-height:120px}.gallery .legend{margin:10px 0 4px}.secondstrip{display:flex;gap:2px;outline:none}.secondstrip:focus-visible{box-shadow:0 0 0 2px var(--accent)}.secondcell{position:relative;flex:1 1 0;min-width:0;padding:6px 2px;font-size:11px;color:var(--text);border:1px solid var(--line);border-radius:3px;overflow:hidden;white-space:nowrap;text-overflow:clip}.secondcell.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.secondcell i.mark{position:absolute;top:2px;right:2px;width:5px;height:5px;border-radius:50%;background:var(--bad)}.cells{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px}.cells .cell{display:block;padding:3px;text-align:left;border:1px solid var(--line);border-radius:3px;line-height:1.2}.cells .cell.dup{border-color:var(--warn)}.cells .cell.inspecting{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.cells .cell.inspecting .caption:after{color:var(--accent);font-weight:700}.cells .cell.inspecting-a .caption:after{content:" — A"}.cells .cell.inspecting-b .caption:after{content:" — B"}.cells .cell canvas,.cells .cell .na{display:block;width:100%;aspect-ratio:16 / 9;background:var(--panel-2);border-radius:2px;image-rendering:pixelated}.cells .cell .na{display:grid;place-items:center;color:var(--muted);font-size:11px}.cells .cell .caption{display:block;font-size:10px;color:var(--muted);margin-top:2px}.cells .cell .badge{font-size:10px;background:var(--warn);color:#1b1400}.rangepicker{display:flex;flex-direction:column;gap:6px}.rangetrack{width:100%;border:1px solid var(--line);border-radius:4px;overflow:hidden;touch-action:none}.progress{height:6px;background:var(--panel-2);border-radius:3px;overflow:hidden}.progress>div{height:100%;background:var(--accent);transition:width .15s linear}dl.facts{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;margin:0}dl.facts dt{color:var(--muted)}dl.facts dd{margin:0}ul.anomalies{list-style:none;margin:0;padding:0;max-height:260px;overflow-y:auto}ul.anomalies li{display:flex;gap:8px;align-items:baseline;padding:3px 4px;border-radius:3px;cursor:pointer}ul.anomalies li:hover{background:var(--panel-2)}ul.anomalies li.selected{background:var(--panel-2);outline:1px solid var(--accent)}.tag{font-size:11px;padding:0 6px;border-radius:10px;border:1px solid currentColor;white-space:nowrap}.tag.freeze,.tag.partial_freeze{color:var(--bad)}.tag.micro_stutter,.tag.uneven_cadence{color:var(--warn)}.tag.missing_frames,.tag.non_monotonic_pts,.tag.irregular_timing{color:var(--accent)}.time{color:var(--muted);font-variant-numeric:tabular-nums}.empty{color:var(--muted);font-style:italic}.chart{position:relative}.chart canvas{display:block;width:100%;cursor:crosshair}.chart .legend{color:var(--muted);font-size:11px;margin-bottom:4px}.badge{display:inline-block;padding:0 6px;border-radius:3px;background:var(--panel-2);border:1px solid var(--accent);color:var(--accent);font-size:11px}.fpsmap canvas{cursor:pointer;border:1px solid var(--line);border-radius:4px}.swatches{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px;font-size:11px;color:var(--muted)}.swatch{display:flex;align-items:center;gap:4px}.swatch i{width:10px;height:10px;border-radius:2px;display:inline-block}.error{color:var(--bad);white-space:pre-wrap}.note{color:var(--muted);font-size:11px}
