:root{--bg:#0d141b;--panel:#141d26;--panel-2:#0f1820;--border:#223040;--text:#e8edf2;--muted:#8fa1b2;--accent:#0e7c8c;--accent-bright:#17a2b5;--pass:#2e7d5b;--warn:#b07a1e;--fail:#b3402f;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace}*{box-sizing:border-box;margin:0}html,body,#app{height:100%}body{background:var(--bg);color:var(--text);font:14px/1.45 var(--font)}#app{grid-template:"topbar topbar topbar"48px"nav viewer side"1fr/300px 1fr 380px;min-height:0;display:grid}.mono{font-family:var(--mono)}.muted{color:var(--muted)}.topbar{background:var(--panel);border-bottom:1px solid var(--border);grid-area:topbar;align-items:center;gap:12px;padding:0 16px;display:flex}.brand{color:var(--text);letter-spacing:.04em;font-weight:650;text-decoration:none}.topbar-spacer{flex:1}.topbar a{color:var(--muted);text-decoration:none}.topbar a:hover{color:var(--text)}.ws-dot{background:var(--fail);border-radius:50%;flex:none;width:9px;height:9px}.ws-dot.connected{background:var(--pass)}.token-field{background:var(--panel-2);width:170px;color:var(--text);border:1px solid var(--border);border-radius:4px;padding:4px 8px;font-size:12px}.pane{min-height:0;overflow-y:auto}.nav{background:var(--panel);border-right:1px solid var(--border);grid-area:nav}.viewer{grid-area:viewer;justify-content:center;align-items:center;display:flex}.side{background:var(--panel);border-left:1px solid var(--border);grid-area:side}.pane-head{justify-content:space-between;align-items:center;padding:12px 14px 8px;display:flex}.pane-title{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:13px;font-weight:650}.viewer-placeholder{text-align:center}.viewer-placeholder-title{margin-bottom:6px;font-size:18px}.empty,.error{color:var(--muted);padding:16px 14px;font-size:13px}.error{color:var(--fail)}.btn{background:var(--panel-2);color:var(--text);border:1px solid var(--border);font:600 12px/1.3 var(--font);cursor:pointer;border-radius:4px;padding:5px 10px}.btn:hover{border-color:var(--accent)}.btn:disabled{opacity:.5;cursor:default}.btn-accent{background:var(--accent);border-color:var(--accent)}.btn-accent:hover{background:var(--accent-bright)}.btn-warn{background:var(--warn);border-color:var(--warn)}.btn-fail{background:var(--fail);border-color:var(--fail)}.chip{letter-spacing:.02em;white-space:nowrap;border-radius:999px;padding:1px 8px;font-size:11px;font-weight:650;display:inline-block}.chip-pass{background:color-mix(in srgb, var(--pass) 22%, transparent);color:#6fcfa4}.chip-warn{background:color-mix(in srgb, var(--warn) 22%, transparent);color:#e7b45c}.chip-fail{background:color-mix(in srgb, var(--fail) 22%, transparent);color:#ef8a76}.chip-queued{background:color-mix(in srgb, var(--accent) 16%, transparent);color:#6fc4d0}.chip-running{background:color-mix(in srgb, var(--accent) 30%, transparent);color:#7fd6e2}.chip-muted{background:color-mix(in srgb, var(--muted) 18%, transparent);color:var(--muted)}.badge{text-transform:uppercase;letter-spacing:.06em;border-radius:3px;padding:0 6px;font-size:10px;font-weight:700;display:inline-block}.badge-pre{color:#8fc7e8;background:#24455a}.badge-post{color:#c5a6e8;background:#46345a}.job-list{padding:4px 8px 16px}.job-row{cursor:pointer;border:1px solid #0000;border-radius:6px;padding:8px 8px 7px}.job-row:hover{background:var(--panel-2)}.job-row.selected{background:var(--panel-2);border-color:var(--accent)}.job-row-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.job-id{color:var(--text);font-size:12px}.job-row-sub{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;margin-top:3px;font-size:12px;display:flex;overflow:hidden}.job-row-sub span:first-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.job-row-meta{color:var(--muted);gap:8px;margin-top:2px;font-size:11px;display:flex}.fail-class{color:var(--fail);font-family:var(--mono);font-size:10px}.new-job[hidden]{display:none}.new-job{background:var(--panel-2);border:1px solid var(--border);border-radius:6px;flex-direction:column;gap:8px;margin:0 8px 10px;padding:10px;display:flex}.field-row{gap:6px;display:flex}.field-row>*{flex:1;min-width:0}.new-job input[type=text],.new-job select{background:var(--bg);color:var(--text);border:1px solid var(--border);font:13px var(--font);border-radius:4px;padding:6px 8px}.new-job input:focus,.new-job select:focus,.token-field:focus{border-color:var(--accent);outline:none}.drop-zone{border:1px dashed var(--border);text-align:center;color:var(--muted);cursor:pointer;border-radius:6px;padding:18px 10px;font-size:12px}.drop-zone.drag{border-color:var(--accent-bright);background:color-mix(in srgb, var(--accent) 10%, transparent)}.drop-zone.has-file{border-style:solid;border-color:var(--accent);color:var(--text)}.settings-accordion{border:1px solid var(--border);border-radius:4px;padding:6px 8px;font-size:12px}.settings-accordion summary{cursor:pointer;color:var(--muted);font-weight:600}.settings-accordion[open] summary{margin-bottom:6px}.progress{background:var(--border);border-radius:2px;height:4px;overflow:hidden}.progress-fill{background:var(--accent-bright);width:0;height:100%;transition:width .15s}.form-status{min-height:1em;color:var(--muted);font-size:12px}.tab-bar{border-bottom:1px solid var(--border);background:var(--panel);z-index:1;display:flex;position:sticky;top:0}.tab{color:var(--muted);font:600 12px/1.3 var(--font);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:10px 4px 8px}.tab:hover{color:var(--text)}.tab.active{color:var(--text);border-bottom-color:var(--accent-bright)}.tab-body{padding:12px 14px 20px}.tab-section{flex-direction:column;gap:6px;display:flex}.section-title{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);align-items:center;gap:8px;margin:12px 0 4px;font-size:12px;font-weight:650;display:flex}.small{font-size:11px}.prog-header{align-items:center;gap:10px;display:flex}.prog-header .btn-cancel{margin-left:auto}.banner{border-radius:6px;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;font-size:12px;display:flex}.banner-warn{background:color-mix(in srgb, var(--warn) 15%, transparent);border:1px solid color-mix(in srgb, var(--warn) 55%, transparent)}.banner-fail{background:color-mix(in srgb, var(--fail) 13%, transparent);border:1px solid color-mix(in srgb, var(--fail) 55%, transparent)}.banner .btn{flex:none}.stage-list{flex-direction:column;display:flex}.stage-item{color:var(--muted);align-items:center;gap:8px;padding:3px 0;font-size:12px;display:flex}.stage-dot{background:var(--border);border-radius:50%;flex:none;width:8px;height:8px}.stage-done{color:var(--text)}.stage-done .stage-dot{background:var(--pass)}.stage-active{color:var(--text)}.stage-active .stage-dot{background:var(--accent-bright);animation:1.2s ease-in-out infinite pulse}.stage-warn{color:#e7b45c}.stage-warn .stage-dot{background:var(--warn)}.stage-mins{color:var(--muted);margin-left:auto;font-size:11px}@keyframes pulse{50%{opacity:.35}}.gauges{flex-direction:column;gap:6px;display:flex}.gauge{grid-template-columns:60px 1fr 66px;align-items:center;gap:8px;font-size:11px;display:grid}.gauge-label{color:var(--muted)}.gauge-bar{background:var(--panel-2);border:1px solid var(--border);border-radius:3px;height:6px;overflow:hidden}.gauge-fill{background:var(--accent);height:100%;transition:width .4s}.gauge-value{text-align:right;color:var(--text)}.log{background:var(--bg);border:1px solid var(--border);white-space:pre-wrap;overflow-wrap:anywhere;color:#b7c5d1;border-radius:6px;height:220px;padding:8px 10px;font-size:11px;line-height:1.5;overflow:auto}.kv,.gate-table{border-collapse:collapse;width:100%;font-size:12px}.kv td,.gate-table td,.gate-table th{border-bottom:1px solid var(--border);text-align:left;vertical-align:top;padding:4px 8px}.gate-table th{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:650}.kv-key{color:var(--muted);white-space:nowrap}.kv-val,.num,.gate-table .num{text-align:right}.gate-block{margin-bottom:10px}.stat-row{gap:8px;display:flex}.stat{background:var(--panel-2);border:1px solid var(--border);text-align:center;border-radius:6px;flex:1;padding:10px 8px}.stat-value{font-size:16px;font-weight:650}.stat-label{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin-top:2px;font-size:10px}.runs-link{color:var(--accent-bright);margin-top:8px;font-size:12px;text-decoration:none}.viewer.view-runs{padding:16px 20px;display:block;overflow-y:auto}.runs-view{max-width:1100px;margin:0 auto}.runs-table-wrap{overflow-x:auto}.runs-table a,.compare-table a{color:var(--accent-bright);text-decoration:none}th.sortable{cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none}th.sortable:hover,th.sortable.sorted{color:var(--text)}.compare-panel{margin-top:16px}td.best{color:#6fcfa4;font-weight:700}.settings-form{flex-direction:column;gap:4px;display:flex}.sf-row{grid-template-columns:1fr 110px;align-items:center;gap:8px;font-size:12px;display:grid}.sf-label{color:var(--muted);font-family:var(--mono);font-size:11px}.settings-form input[type=number],.settings-form select{background:var(--bg);color:var(--text);border:1px solid var(--border);font:12px var(--mono);text-align:right;border-radius:4px;padding:4px 6px}.settings-form input:focus,.settings-form select:focus{border-color:var(--accent);outline:none}.sf-check input{accent-color:var(--accent);justify-self:end}.viewer.view-3d{flex-direction:column;justify-content:flex-start;align-items:stretch;display:flex;overflow:hidden}.viewer-toolbar{background:var(--panel);border-bottom:1px solid var(--border);flex:none;align-items:center;gap:6px;min-height:40px;padding:6px 10px;display:flex}.viewer-btn.active{border-color:var(--accent-bright);color:var(--accent-bright)}.viewer-toolbar-spacer{flex:1}.viewer-host{background:#060a0e;flex:1;min-width:0;min-height:0;position:relative}.viewer-host canvas{display:block;width:100%!important;height:100%!important}.viewer-status{background:color-mix(in srgb, var(--panel) 88%, transparent);border:1px solid var(--border);color:var(--muted);z-index:3;pointer-events:none;white-space:nowrap;border-radius:6px;padding:5px 12px;font-size:12px;position:absolute;top:10px;left:50%;transform:translate(-50%)}.viewer-modes,.viewer-tools{align-items:center;gap:6px;display:flex}.viewer-strip{background:var(--panel);flex:none}.viewer-strip:empty{display:none}.training-bar{border-top:1px solid var(--border);align-items:center;gap:10px;padding:8px 12px;display:flex}.iter-slider{accent-color:var(--accent);flex:1}.iter-label{text-align:right;min-width:90px;color:var(--text);font-size:12px}.debug-timeline{border-top:1px solid var(--border);cursor:pointer;width:100%;height:26px;display:block}.debug-legend{color:var(--muted);padding:4px 12px 6px}.legend-reg{color:var(--pass)}.legend-drop{color:var(--fail)}.viewer-body{flex:1;min-height:0;display:flex}.viewer-dock{background:var(--panel);border-left:1px solid var(--border);flex-direction:column;flex:none;width:clamp(220px,34%,460px);min-height:0;display:flex}.viewer-dock:empty,.viewer-dock[hidden]{display:none}.dock-video{flex-direction:column;flex:1;min-height:0;display:flex}.debug-video{object-fit:contain;background:#060a0e;flex:1;width:100%;min-height:0;display:block}.dock-caption{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;padding:4px 10px 6px;overflow:hidden}.wipe-divider{cursor:ew-resize;z-index:3;width:10px;margin-left:-5px;position:absolute;top:0;bottom:0;left:50%}.wipe-divider:after{content:"";background:var(--accent-bright);width:2px;position:absolute;top:0;bottom:0;left:4px;box-shadow:0 0 6px #0009}.compare-showing{color:var(--muted);font-size:11px}.pins-panel{background:color-mix(in srgb, var(--panel) 90%, transparent);border:1px solid var(--border);z-index:3;border-radius:6px;width:180px;max-height:45%;padding:8px 10px;font-size:12px;position:absolute;top:10px;right:10px;overflow-y:auto}.pins-title{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin-bottom:4px;font-size:11px;font-weight:650}.pins-item{cursor:pointer;text-overflow:ellipsis;white-space:nowrap;border-radius:4px;align-items:center;gap:6px;padding:3px 2px;display:flex;overflow:hidden}.pins-item:hover{background:var(--panel-2)}.pins-dot{background:var(--accent-bright);border:1px solid var(--text);border-radius:50%;flex:none;width:8px;height:8px}.pin-dialog{z-index:4;background:var(--panel);border:1px solid var(--accent);border-radius:6px;flex-direction:column;gap:6px;width:220px;padding:10px;display:flex;position:absolute;box-shadow:0 6px 24px #00000080}.pin-dialog-title{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-size:11px;font-weight:650}.pin-dialog input{background:var(--bg);color:var(--text);border:1px solid var(--border);font:12px var(--font);border-radius:4px;padding:5px 8px}.pin-dialog input:focus{border-color:var(--accent);outline:none}.pin-dialog-row{justify-content:flex-end;gap:6px;display:flex}table,.num,.gauge-value,.job-id{font-variant-numeric:tabular-nums}.debug-stepper{border-top:1px solid var(--border);align-items:center;gap:8px;padding:6px 12px;display:flex}.debug-stepper input[type=range]{min-width:80px;accent-color:var(--accent);flex:1}.debug-frame-label{color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums;min-width:250px;font-size:12px}.debug-frame-label .is-dropped{color:var(--fail)}.debug-frame-label .is-reg{color:var(--pass)}
