[hidden]{display:none!important}
:root{--ground:#0C0B08;--r1:#212822;--r2:#38493F;--r3:#577566;--verdigris:#7FAE98;--ink:#A9BDB2;--dim:#6E7F75;
  --mono:"Ratio Mono",monospace;--display:"Ratio Headline",serif;--sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html,body{margin:0;background:var(--ground);color:var(--ink);font:14px/1.45 var(--mono)}
a{color:var(--verdigris)}
code{font-family:var(--mono);font-size:.92em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.vz{display:grid;grid-template-columns:minmax(0,1fr) 360px;grid-template-rows:auto minmax(0,1fr) auto auto;
  grid-template-areas:"head head" "stage panel" "ctrl ctrl" "foot foot";height:100vh;height:100dvh;gap:0 20px;padding:18px 22px 10px}
.vz-head{grid-area:head;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;border-bottom:1px solid var(--r1);padding-bottom:10px}
.vz-head h1{margin:0;font:400 24px/1.15 var(--display);font-optical-sizing:auto;color:var(--verdigris);letter-spacing:0}
.vz-head h1 span{color:var(--dim);font-weight:400;font-style:italic;font-size:.72em}
.vz-home{flex-basis:100%;margin:0;font:11px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.vz-home a{color:var(--dim);text-decoration:none}.vz-home a:hover,.vz-home a:focus-visible{color:var(--verdigris)}.vz-home b{color:var(--verdigris);font-weight:400}
.vz-sub{margin:0;font:12.5px/1.4 var(--mono);color:var(--dim);overflow-wrap:anywhere}
.vz-stage{grid-area:stage;position:relative;min-height:0}
#vz-canvas{display:block;width:100%;height:100%;outline:none}
.vz-legend{position:absolute;left:4px;bottom:4px;margin:0;font:11px var(--mono);color:var(--dim);display:flex;gap:6px 10px;flex-wrap:wrap;align-items:center}
.lg{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:-4px;vertical-align:-1px}
.lg-un{background:var(--r1)}.lg-vis{background:var(--r3)}.lg-dis{border:1.5px solid var(--r3);background:transparent}
.lg-com{background:var(--verdigris);box-shadow:0 0 6px rgba(127,174,152,.55)}
.vz-panel{grid-area:panel;min-height:0;overflow:auto;font:12.5px/1.45 var(--mono);padding:12px 0 0;scrollbar-color:var(--r2) transparent}
.vz-now{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin-bottom:12px}
.vz-now .k,.vz-counts dt{color:var(--dim);font-size:11px;display:block}
.vz-now b{font-weight:500;color:var(--ink);overflow-wrap:anywhere}
.vz-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0 0 12px}
.vz-counts div{border:1px solid var(--r1);border-radius:3px;padding:5px 7px}
.vz-counts dd{margin:0;font-size:16px;color:var(--verdigris);font-variant-numeric:tabular-nums}
.vz-focus{min-height:3.2em;border-left:2px solid var(--r2);padding:2px 0 2px 9px;margin-bottom:12px;color:var(--ink)}
.vz-focus .bar{height:3px;background:var(--r1);margin-top:5px;border-radius:2px;overflow:hidden}
.vz-focus .bar i{display:block;height:100%;background:var(--r3);transition:width .6s ease}
.vz-ticker{list-style:none;margin:0;padding:0;color:var(--dim)}
.vz-ticker li{padding:2px 0;border-top:1px solid #15181400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vz-ticker li:first-child{color:var(--ink)}
.vz-controls{grid-area:ctrl;display:flex;align-items:center;gap:8px;padding:10px 0 6px;border-top:1px solid var(--r1);flex-wrap:wrap}
.vz-controls button,.vz-controls select,.vz-file span{min-width:36px;min-height:34px;background:#11130F;color:var(--ink);border:1px solid var(--r2);border-radius:3px;font:13px var(--mono);padding:0 9px;cursor:pointer}
.vz-controls button:focus-visible,.vz-controls select:focus-visible,input:focus-visible+span,#scrub:focus-visible{outline:1px solid var(--verdigris);outline-offset:2px}
.vz-scrub{flex:1 1 220px;display:flex}
#scrub{width:100%;accent-color:var(--r3);min-height:30px}
.vz-pos{font:12px var(--mono);color:var(--dim);min-width:84px;text-align:right;font-variant-numeric:tabular-nums}
.vz-controls select{max-width:100%}
#trace-sel{max-width:min(440px,100%)}
.vz-file{position:relative;display:inline-flex}
.vz-file input{position:absolute;inset:0;opacity:0;cursor:pointer}
.vz-file span{display:inline-flex;align-items:center}
.vz-live{font:12px var(--mono);display:inline-flex;align-items:center;gap:5px;min-height:34px}
.vz-foot{grid-area:foot;font-size:11.5px;color:var(--dim)}
.vz-foot p{margin:4px 0}
.vz-foot .powered{letter-spacing:.04em}.vz-foot .powered b{font-family:var(--display);font-weight:600;color:var(--ink,inherit)}
@media (max-width:820px){
  .vz{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 52vh auto auto auto;grid-template-areas:"head" "stage" "ctrl" "panel" "foot";height:auto;padding:12px 12px 8px}
  .vz-panel{overflow:visible}
  .vz-scrub{flex:1 1 100%;order:-1}
  .vz-controls label:has(#trace-sel){flex:1 1 100%}
  #trace-sel{width:100%;max-width:100%}
  .vz-counts dd{font-size:15px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}