:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-void:#06080c;--bg-base:#0a0d13;--bg-panel:#10141d;--bg-panel-raised:#161b26;--bg-inset:#070910;--glass:#ffffff0b;--glass-strong:#ffffff14;--scrim:#04060b9e;--sheen:linear-gradient(180deg, #ffffff13, #fff0 100%);--grid-line:#ffffff07;--grain-opacity:.03;--fg:#eef1f6;--fg-secondary:#9ba6b6;--fg-muted:#7c8798;--fg-disabled:#4e586a;--border:#ffffff16;--border-strong:#ffffff29;--border-control:#ffffff21;--accent:#e9edf4;--accent-hover:#fff;--accent-fg:#0c1017;--ring:#ffffff8c;--status-live:#35d39a;--status-warn:#f0b429;--status-error:#f6796f;--status-idle:#5f6a7c;--cmap-ice:linear-gradient(90deg, #040613 0%, #13132a 6.25%, #212041 12.5%, #2e2c5a 18.75%, #383975 25%, #3e478f 31.25%, #3f57a3 37.5%, #3e69b0 43.75%, #427bb7 50%, #4b8bbd 56.25%, #579cc3 62.5%, #67adc9 68.75%, #79bed0 75%, #92ced7 81.25%, #afdde1 87.5%, #cdecef 93.75%, #eafdfd 100%);--radius-panel:14px;--radius-control:10px;--radius-sm:7px;--radius-pill:999px;--shadow-inset-top:inset 0 1px 0 #ffffff0e;--shadow-panel:0 18px 40px -14px #000c, 0 2px 8px #0006;--shadow-control:0 1px 2px #00000059;--blur-glass:20px;--saturate-glass:140%;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--font-ui:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", system-ui, "Segoe UI", sans-serif;--font-mono:ui-monospace, "SF Mono", "JetBrains Mono", "Roboto Mono", Menlo, Consolas, monospace;--fs-micro:11px;--fs-label:12px;--fs-body:13px;--fs-value:15px;--fs-title:15px;--lh-body:1.5;--lh-dense:1.25;--tracking-label:.085em;--dur-fast:.12s;--dur-base:.2s;--dur-slow:.32s;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in:cubic-bezier(.4, 0, 1, 1);--panel-w:316px;--rail-h:48px;--control-h:32px;--touch-min:44px}@media (max-width:900px){:root{--fs-body:14px;--control-h:38px}}*,:before,:after{box-sizing:border-box;border-color:var(--border)}*{margin:0}html,body{height:100%}body{font-family:var(--font-ui);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--fg);background-color:var(--bg-base);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;overscroll-behavior:none;overflow:hidden}body:before,body:after{content:"";pointer-events:none;z-index:0;position:fixed;inset:0}body:before{background:radial-gradient(120% 90% at 50% -10%, #ffffff09, transparent 60%), repeating-linear-gradient(0deg, var(--grid-line) 0 1px, transparent 1px 32px), repeating-linear-gradient(90deg, var(--grid-line) 0 1px, transparent 1px 32px), var(--bg-void)}body:after{opacity:var(--grain-opacity);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}h1,h2,h3{font-size:inherit;letter-spacing:-.01em;font-weight:590}button,select,input{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:none;padding:0}::selection{background:var(--accent);color:var(--accent-fg)}:focus-visible{box-shadow:0 0 0 1px var(--bg-base), 0 0 0 3px var(--ring);outline:none}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{border-radius:var(--radius-pill);background:#ffffff1f padding-box content-box;border:3px solid #0000}::-webkit-scrollbar-thumb:hover{background:#fff3 padding-box content-box}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.micro{font-size:var(--fs-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-muted)}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}.app{z-index:1;grid-template-rows:var(--rail-h) 1fr;grid-template-columns:minmax(0, 1fr) var(--panel-w);grid-template-areas:"rail rail""stage controls";gap:0;height:100dvh;display:grid;position:relative}.rail{align-items:center;gap:var(--space-4);min-width:0;padding:0 var(--space-4);border-bottom:1px solid var(--border);background:linear-gradient(180deg, #ffffff08, transparent), var(--bg-panel);grid-area:rail;display:flex}.stage{min-width:0;min-height:0;padding:var(--space-4);grid-area:stage;justify-content:center;align-items:center;display:flex}.controls{border-left:1px solid var(--border);background:var(--bg-panel);min-height:0;box-shadow:var(--shadow-inset-top);padding:var(--space-4) var(--space-4) var(--space-6);gap:var(--space-5);flex-direction:column;grid-area:controls;display:flex;overflow-y:auto}.viewer{gap:var(--space-3);flex:none;grid-template-columns:1fr 1fr;min-width:0;min-height:0;display:grid;position:relative}.viewer[data-mode=stacked]{grid-template-rows:1fr 1fr;grid-template-columns:1fr}.viewer[data-mode=compare]{grid-template-columns:1fr}.viewer[data-mode=compare] .pane{grid-area:1/1}.viewer[data-mode=compare] .pane--depth{clip-path:inset(0 0 0 var(--split,50%))}.viewer[data-mode=compare] .pane--depth .pane__label{left:auto;right:var(--space-3)}.viewer[data-mode=compare] .pane__meta{display:none}.viewer[data-mode=compare] .legend{left:calc(var(--split,50%) + var(--space-3))}@media (max-width:1023px){.app{grid-template-rows:var(--rail-h) 1fr auto;grid-template-columns:minmax(0,1fr);grid-template-areas:"rail""stage""controls";height:100dvh}.controls{border-left:none;border-top:1px solid var(--border);gap:var(--space-4);max-height:46dvh;padding-bottom:max(var(--space-5), env(safe-area-inset-bottom));grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;display:grid}}@media (max-width:767px){.stage{padding:var(--space-3)}.viewer{grid-template-rows:1fr 1fr;grid-template-columns:1fr}.viewer[data-mode=compare]{grid-template-rows:1fr}.controls{grid-template-columns:1fr;max-height:42dvh}}.rail__title{font-size:var(--fs-title);letter-spacing:-.015em;white-space:nowrap;text-overflow:ellipsis;min-width:0;font-weight:600;overflow:hidden}.rail__sub{color:var(--fg-muted);font-size:var(--fs-label);white-space:nowrap}.rail__spacer{flex:1}.rail__stats{align-items:center;gap:var(--space-2);flex:none;display:flex}@media (max-width:700px){.rail__sub{display:none}}@media (max-width:520px){.rail{gap:var(--space-2);padding:0 var(--space-3)}.stat{padding:3px 7px}.stat__value{min-width:2.6ch}.badge{padding:0 8px}}.badge{align-items:center;gap:var(--space-2);border-radius:var(--radius-pill);border:1px solid var(--border);background:var(--glass);height:26px;font-size:var(--fs-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-secondary);white-space:nowrap;padding:0 10px;display:inline-flex}.badge__dot{background:var(--status-idle);border-radius:50%;flex:none;width:6px;height:6px}.badge[data-state=live] .badge__dot{background:var(--status-live);animation:2s ease-in-out infinite pulse;box-shadow:0 0 0 3px #35d39a29}.badge[data-state=warn] .badge__dot{background:var(--status-warn)}.badge[data-state=error] .badge__dot{background:var(--status-error)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}.stat{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--glass);font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--fs-label);color:var(--fg);align-items:baseline;gap:5px;padding:4px 9px;display:inline-flex}.stat__value{text-align:right;min-width:3.2ch}.stat__unit{color:var(--fg-muted);font-size:var(--fs-micro)}.pane{border-radius:var(--radius-panel);border:1px solid var(--border);background:var(--bg-inset);min-width:0;min-height:0;box-shadow:var(--shadow-inset-top), var(--shadow-panel);position:relative;overflow:hidden}.pane:after{content:"";pointer-events:none;background:var(--sheen);border-radius:var(--radius-panel) var(--radius-panel) 0 0;height:42%;position:absolute;inset:0 0 auto}.pane__media{object-fit:cover;background:var(--bg-inset);width:100%;height:100%;display:block;position:absolute;inset:0}.pane__media--mirrored{transform:scaleX(-1)}.pane__label{top:var(--space-3);left:var(--space-3);z-index:2;align-items:center;gap:var(--space-2);border-radius:var(--radius-sm);border:1px solid var(--border);height:24px;font-size:var(--fs-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-secondary);background:#080b11c7;padding:0 9px;display:inline-flex;position:absolute}.pane__meta{top:var(--space-3);right:var(--space-3);z-index:2;font-family:var(--font-mono);font-size:var(--fs-micro);color:var(--fg-muted);border-radius:var(--radius-sm);border:1px solid var(--border);background:#080b11c7;padding:4px 8px;position:absolute}.legend{left:var(--space-3);right:var(--space-3);bottom:var(--space-3);z-index:2;align-items:center;gap:var(--space-2);border-radius:var(--radius-sm);border:1px solid var(--border);background:#080b11cc;padding:7px 9px;display:flex;position:absolute}.legend__scale{border-radius:var(--radius-pill);border:1px solid var(--border);background-image:var(--cmap-ice);flex:1;height:8px}.legend__end{font-size:var(--fs-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-muted);flex:none}.compare{z-index:3;display:none;position:absolute;inset:0}.viewer[data-mode=compare] .compare{display:block}.compare__line{top:0;bottom:0;left:var(--split,50%);pointer-events:none;background:#ffffffb8;width:2px;margin-left:-1px;position:absolute;box-shadow:0 0 12px #0009}.compare__input{opacity:0;cursor:ew-resize;touch-action:none;appearance:none;background:0 0;width:100%;height:100%;margin:0;position:absolute;inset:0}.compare__input::-webkit-slider-thumb{-webkit-appearance:none;width:var(--touch-min);height:100%}.compare__input::-moz-range-thumb{width:var(--touch-min);border:none;height:100%}.compare__grip{top:50%;left:var(--split,50%);border:1px solid var(--border-strong);width:40px;height:40px;box-shadow:var(--shadow-panel);pointer-events:none;color:var(--fg);background:#161b26db;border-radius:50%;place-items:center;display:grid;position:absolute;translate:-50% -50%}.compare__input:focus-visible~.compare__grip{box-shadow:0 0 0 3px var(--ring), var(--shadow-panel)}.overlay{z-index:4;padding:var(--space-5);background:var(--scrim);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:inherit;place-items:center;display:grid;position:absolute;inset:0}.overlay[hidden]{display:none}.overlay__inner{text-align:center;align-items:center;gap:var(--space-3);flex-direction:column;max-width:420px;display:flex}.overlay__title{font-size:16px;font-weight:590}.overlay__text{color:var(--fg-secondary);font-size:var(--fs-body);text-wrap:pretty}.overlay__text code{font-family:var(--font-mono);color:var(--fg);font-size:12px}.overlay[data-tone=error] .overlay__title{color:var(--status-error)}.group{gap:var(--space-3);flex-direction:column;min-width:0;display:flex}.group__title{font-size:var(--fs-micro);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-muted);padding-bottom:var(--space-2);border-bottom:1px solid var(--border)}.field{flex-direction:column;gap:6px;min-width:0;display:flex}.field__label{justify-content:space-between;align-items:baseline;gap:var(--space-2);font-size:var(--fs-label);color:var(--fg-secondary);display:flex}.field__value{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--fs-label);color:var(--fg)}.field__hint{font-size:var(--fs-micro);color:var(--fg-muted);text-wrap:pretty}.btn{justify-content:center;align-items:center;gap:var(--space-2);height:var(--control-h);min-height:var(--control-h);border-radius:var(--radius-control);border:1px solid var(--border-control);background:var(--glass);color:var(--fg);font-size:var(--fs-body);box-shadow:var(--shadow-control);transition:background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);padding:0 14px;font-weight:500;display:inline-flex}.btn:hover{background:var(--glass-strong);border-color:var(--border-strong)}.btn:active{background:#ffffff1c}.btn:disabled{color:var(--fg-disabled);cursor:not-allowed;background:0 0}.btn--primary{background:var(--accent);color:var(--accent-fg);border-color:#0000;padding:0 18px;font-weight:590}.btn--primary:hover{background:var(--accent-hover)}.btn--block{width:100%}.select{height:var(--control-h);border-radius:var(--radius-control);border:1px solid var(--border-control);appearance:none;width:100%;font-size:var(--fs-body);text-overflow:ellipsis;transition:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);background-color:#ffffff0a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%239ba6b6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6.5 8 10.5 12 6.5'/%3E%3C/svg%3E");background-position:right 8px center;background-repeat:no-repeat;padding:0 30px 0 10px}.select:hover{border-color:var(--border-strong);background-color:#ffffff12}.select:disabled{color:var(--fg-disabled);cursor:not-allowed}.segmented{border-radius:var(--radius-control);border:1px solid var(--border);background:#00000040;grid-auto-columns:1fr;grid-auto-flow:column;gap:2px;padding:2px;display:grid}.segmented__item{height:calc(var(--control-h) - 6px);border-radius:calc(var(--radius-control) - 3px);font-size:var(--fs-label);color:var(--fg-secondary);transition:background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out)}.segmented__item:hover{color:var(--fg);background:var(--glass)}.segmented__item[aria-pressed=true]{background:var(--glass-strong);color:var(--fg);box-shadow:var(--shadow-inset-top), var(--shadow-control)}.range{appearance:none;cursor:pointer;background:0 0;width:100%;height:22px}.range::-webkit-slider-runnable-track{border-radius:var(--radius-pill);background:linear-gradient(90deg, #ffffff8c var(--fill,50%), #ffffff1a var(--fill,50%));height:4px}.range::-moz-range-track{border-radius:var(--radius-pill);background:#ffffff1a;height:4px}.range::-moz-range-progress{border-radius:var(--radius-pill);background:#ffffff8c;height:4px}.range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);width:16px;height:16px;box-shadow:var(--shadow-control);transition:box-shadow var(--dur-fast) var(--ease-out);border:1px solid #0006;border-radius:50%;margin-top:-6px}.range::-moz-range-thumb{background:var(--accent);border:1px solid #0006;border-radius:50%;width:16px;height:16px}.range:hover::-webkit-slider-thumb{box-shadow:0 0 0 5px #ffffff1f}.range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px #ffffff1f}.range:focus-visible{box-shadow:none}.progress{border-radius:var(--radius-pill);background:#ffffff1a;width:100%;max-width:280px;height:4px;overflow:hidden}.progress__bar{border-radius:inherit;background:var(--accent);width:0%;height:100%;transition:width var(--dur-base) var(--ease-out)}.switch{justify-content:space-between;align-items:center;gap:var(--space-3);min-height:26px;font-size:var(--fs-body);color:var(--fg-secondary);cursor:pointer;display:flex}.switch__track{border-radius:var(--radius-pill);border:1px solid var(--border-control);width:38px;height:22px;transition:background var(--dur-fast) var(--ease-out);background:#ffffff0f;flex:none;position:relative}.switch__track:after{content:"";background:var(--fg-secondary);width:16px;height:16px;transition:translate var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);border-radius:50%;position:absolute;top:2px;left:2px}.switch input{opacity:0;width:0;height:0;position:absolute}.switch input:checked+.switch__track{background:#ffffff47}.switch input:checked+.switch__track:after{background:var(--accent);translate:16px}.switch input:focus-visible+.switch__track{box-shadow:0 0 0 3px var(--ring)}.footnote{font-size:var(--fs-micro);color:var(--fg-muted);text-wrap:pretty;line-height:1.55}.footnote a{color:var(--fg-secondary)}.kbd{font-family:var(--font-mono);border:1px solid var(--border);color:var(--fg-secondary);background:#ffffff0d;border-radius:5px;padding:1px 5px;font-size:10px}