:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--surface-1:#fcfcfb;--page:#f9f9f7;--text-primary:#0b0b0b;--text-secondary:#52514e;--text-muted:#6e6c67;--gridline:#e1e0d9;--baseline:#c3c2b7;--border:#0b0b0b1a;--series-1:#2a78d6;--series-2:#008300;--series-3:#e87ba4;--series-4:#eda100;--series-6:#eb6834;--series-7:#4a3aa7;--series-8:#e34948;--seq-100:#cde2fb;--seq-250:#86b6ef;--seq-400:#3987e5;--seq-550:#1c5cab;--seq-700:#0d366b;--div-mid:#f0efec;--status-good:#0ca30c;--status-warning:#fab219;--status-serious:#ec835a;--status-critical:#d03b3b;--delta-good-text:#006300;--accent:var(--series-1)}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--surface-1:#1a1a19;--page:#0d0d0d;--text-primary:#fff;--text-secondary:#c3c2b7;--text-muted:#898781;--gridline:#2c2c2a;--baseline:#383835;--border:#ffffff1a;--series-1:#3987e5;--series-2:#008300;--series-3:#d55181;--series-4:#c98500;--series-6:#d95926;--series-7:#9085e9;--series-8:#e66767;--div-mid:#383835;--delta-good-text:#0ca30c;--accent:var(--series-1)}@media (prefers-color-scheme:dark){:root:where(:not([data-theme=light])){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--surface-1:#1a1a19;--page:#0d0d0d;--text-primary:#fff;--text-secondary:#c3c2b7;--text-muted:#898781;--gridline:#2c2c2a;--baseline:#383835;--border:#ffffff1a;--series-1:#3987e5;--series-2:#008300;--series-3:#d55181;--series-4:#c98500;--series-6:#d95926;--series-7:#9085e9;--series-8:#e66767;--div-mid:#383835;--delta-good-text:#0ca30c;--accent:var(--series-1)}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--page);color:var(--text-primary);font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px;line-height:1.45}.app{flex-direction:column;height:100%;display:flex}.topbar{border-bottom:1px solid var(--gridline);background:var(--surface-1);align-items:center;gap:16px;padding:10px 20px;display:flex}.topbar h1{margin:0;font-size:16px;font-weight:650}.topbar .sub{color:var(--text-muted);font-size:12px}.tabs{gap:4px;margin-left:auto;display:flex}.tab{color:var(--text-secondary);font:inherit;cursor:pointer;background:0 0;border:none;border-radius:8px;padding:6px 14px}.tab:hover{background:color-mix(in oklab, var(--text-primary) 6%, transparent)}.tab.active{background:color-mix(in oklab, var(--accent) 14%, transparent);color:var(--text-primary);font-weight:600}.theme-toggle{border:1px solid var(--border);color:var(--text-secondary);font:inherit;cursor:pointer;background:0 0;border-radius:8px;padding:5px 10px}.main{flex:1;padding:16px 20px 40px;overflow:auto}.layout{grid-template-columns:310px minmax(0,1fr);align-items:start;gap:16px;display:grid}.column{flex-direction:column;gap:16px;min-width:0;display:flex}.card{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;padding:14px 16px}.card h2{color:var(--text-secondary);margin:0 0 10px;font-size:13px;font-weight:650}.card h2 .hint{color:var(--text-muted);font-weight:400}.control-row{align-items:center;gap:8px;margin:6px 0;display:flex}.control-row label{width:96px;color:var(--text-secondary);flex:none;font-size:12.5px}.control-row input[type=range]{min-width:0;accent-color:var(--accent);flex:1}.control-row .value{text-align:right;font-variant-numeric:tabular-nums;width:64px;color:var(--text-primary);flex:none;font-size:12.5px}.control-row input[type=number],.control-row select{width:84px;font:inherit;border:1px solid var(--border);background:var(--page);color:var(--text-primary);border-radius:6px;padding:3px 6px}button.btn{font:inherit;border:1px solid var(--border);background:var(--surface-1);color:var(--text-primary);cursor:pointer;border-radius:8px;padding:6px 12px}button.btn:hover{background:color-mix(in oklab, var(--text-primary) 5%, var(--surface-1))}button.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.btn.small{padding:3px 9px;font-size:12.5px}button.btn:disabled{opacity:.5;cursor:default}.seg{border:1px solid var(--border);border-radius:8px;display:inline-flex;overflow:hidden}.seg button{font:inherit;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:5px 10px;font-size:12.5px}.seg button.active{background:color-mix(in oklab, var(--accent) 16%, transparent);color:var(--text-primary);font-weight:600}.tiles{grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:10px;display:grid}.tile{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;padding:10px 14px}.tile .label{color:var(--text-secondary);font-size:12px}.tile .value{margin-top:2px;font-size:21px;font-weight:600}.tile .delta{margin-top:2px;font-size:12px}.tile .delta.bad{color:var(--status-critical);font-weight:600}.tile .delta.good{color:var(--delta-good-text)}.tile .delta.neutral{color:var(--text-muted)}.sandbox{flex-direction:column;gap:14px;display:flex}.toolbar{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 10px;display:flex}.tool-btn{width:36px;height:36px;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:9px;place-items:center;transition:background .12s;display:grid}.tool-btn:hover:not(:disabled){background:color-mix(in oklab, var(--text-primary) 7%, transparent);color:var(--text-primary)}.tool-btn.active{background:color-mix(in oklab, var(--accent) 18%, transparent);color:var(--accent)}.tool-btn:disabled{opacity:.35;cursor:default}.tool-sep{background:var(--gridline);flex:none;width:1px;height:24px;margin:0 6px}.canvas-row{align-items:stretch;gap:10px;min-width:0;display:flex}.tool-rail{background:var(--surface-1);border:1px solid var(--border);border-radius:12px;flex-direction:column;flex:none;align-self:flex-start;gap:6px;padding:8px 7px;display:flex}.tool-btn.large{border-radius:10px;width:48px;height:48px}.canvas-row .card.canvas-card{flex:1;min-width:0;position:relative}.canvas-empty{text-align:center;pointer-events:none;color:var(--text-secondary);flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:0 60px;font-size:13px;display:flex;position:absolute;inset:0}.canvas-empty b{color:var(--text-primary);font-size:15px}.toolbar-hint{color:var(--text-muted);margin-left:auto;padding-right:4px;font-size:12px}.card.canvas-card{padding:6px}.canvas-frame{background:var(--surface-1);border-radius:9px;position:relative;overflow:hidden}.canvas-frame svg{cursor:grab}.canvas-frame svg:active{cursor:grabbing}.zoom-controls{flex-direction:column;gap:4px;display:flex;position:absolute;bottom:10px;right:10px}.zoom-controls button{border:1px solid var(--border);background:var(--surface-1);width:30px;height:30px;color:var(--text-secondary);cursor:pointer;border-radius:8px;font-size:15px;line-height:1;box-shadow:0 1px 4px #00000014}.zoom-controls button:hover{color:var(--text-primary);background:color-mix(in oklab, var(--text-primary) 5%, var(--surface-1))}.modal-backdrop{z-index:60;background:#00000061;place-items:center;display:grid;position:fixed;inset:0}.modal{background:var(--surface-1);border:1px solid var(--border);border-radius:14px;width:340px;max-width:calc(100vw - 40px);padding:18px 20px;box-shadow:0 18px 50px #00000047}.modal h3{margin:0 0 6px;font-size:14.5px}.modal .control-row input[type=number]{flex:1;width:auto}.latency-preview{background:var(--page);border:1px solid var(--gridline);text-align:center;border-radius:8px;margin:10px 0;padding:8px 10px;font-size:15px}.modal-actions{justify-content:flex-end;gap:8px;margin-top:14px;display:flex}.chart-box{position:relative}.chart-tooltip{pointer-events:none;background:var(--surface-1);border:1px solid var(--border);z-index:10;border-radius:8px;min-width:132px;padding:7px 10px;font-size:12px;position:absolute;box-shadow:0 4px 16px #00000024}.chart-tooltip .tt-x{color:var(--text-muted);margin-bottom:4px}.chart-tooltip .tt-row{align-items:center;gap:6px;margin:2px 0;display:flex}.chart-tooltip .tt-key{border-top:2.5px solid;flex:none;width:12px;height:0}.chart-tooltip .tt-val{font-variant-numeric:tabular-nums;margin-left:auto;font-weight:600}.chart-tooltip .tt-name{color:var(--text-secondary)}.legend{color:var(--text-secondary);flex-wrap:wrap;gap:14px;margin-top:6px;font-size:12px;display:flex}.legend .key{vertical-align:middle;border-top:2.5px solid;width:14px;margin-right:5px;display:inline-block}.gallery{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;display:grid}.preset-card{background:var(--surface-1);border:1px solid var(--border);cursor:pointer;text-align:left;font:inherit;color:inherit;border-radius:12px;padding:16px;transition:border-color .15s}.preset-card:hover{border-color:var(--accent)}.preset-card h3{margin:0 0 6px;font-size:14px}.preset-card p{color:var(--text-secondary);margin:0;font-size:12.5px}.preset-card .ref{color:var(--text-muted);margin-top:10px;font-size:11.5px;display:inline-block}table.results{border-collapse:collapse;width:100%;font-size:12.5px}table.results th{text-align:right;color:var(--text-secondary);border-bottom:1px solid var(--baseline);padding:6px 8px;font-weight:600}table.results th:first-child,table.results td:first-child{text-align:left}table.results td{text-align:right;border-bottom:1px solid var(--gridline);font-variant-numeric:tabular-nums;padding:5px 8px}table.results tr.best td{font-weight:650}table.results tr:hover td{background:color-mix(in oklab, var(--accent) 7%, transparent)}.table-scroll{overflow-x:auto}.progress-track{background:color-mix(in oklab, var(--accent) 18%, var(--surface-1));border-radius:4px;height:8px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:4px;height:100%;transition:width .2s}.note{color:var(--text-muted);font-size:12px}.mono{font-variant-numeric:tabular-nums}.chip{border:1px solid var(--border);color:var(--text-secondary);border-radius:999px;margin-right:6px;padding:1px 9px;font-size:11.5px;display:inline-block}.chip.bad{border-color:var(--status-critical);color:var(--status-critical);font-weight:600}.chip.good{border-color:var(--status-good);color:var(--delta-good-text)}.scan-list{border-top:1px solid var(--border);flex-direction:column;margin-top:10px;display:flex}.scan-row{border:none;border-bottom:1px solid var(--border);font:inherit;color:var(--text-primary);text-align:left;cursor:pointer;background:0 0;align-items:center;gap:10px;padding:5px 4px;font-size:12.5px;display:flex}.scan-row:hover,.scan-row.selected{background:color-mix(in oklab, var(--text-primary) 5%, var(--surface-1))}.scan-row .scan-br{color:var(--text-secondary);margin-left:auto}@media (width<=940px){.layout{grid-template-columns:1fr}}.tile-info{color:var(--text-muted);cursor:help;font-size:.85em}.app-footer{border-top:1px solid var(--border);max-width:1200px;color:var(--text-muted);margin:32px auto 24px;padding:16px 20px 0;font-size:12.5px;line-height:1.55}.app-footer p{margin:6px 0}.app-footer b,.app-footer a{color:var(--text-secondary)}