:root{--bg: #0f1115;--surface: #171a21;--surface-2: #1f232c;--border: #2a2f3a;--text: #eef1f6;--muted: #9aa3b2;--accent: #5cc8ff;--accent-ink: #04121b;--danger: #ff6b6b;--success: #4ade80;--warn: #fbbf24;--radius: 14px;--gutter: 16px;color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.45;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text)}h1,h2,p{margin:0}h1{font-size:1.375rem;line-height:1.25;font-weight:650;letter-spacing:-.01em}h2{font-size:1.0625rem;font-weight:600}.app{min-height:100dvh;padding-bottom:env(safe-area-inset-bottom)}.content,.welcome{max-width:560px;margin:0 auto;padding:0 var(--gutter) 32px}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;max-width:560px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 12px) var(--gutter) 12px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.stack{display:flex;flex-direction:column;gap:16px}.row{display:flex;align-items:center;gap:12px}.grow{flex:1;min-width:0}.heading{display:flex;flex-direction:column;gap:6px}.center{text-align:center}.muted{color:var(--muted)}.small{font-size:.875rem}.pre{white-space:pre-wrap}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.card.highlight{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}.logo{display:flex;align-items:center;gap:10px;font-weight:650;letter-spacing:-.01em}.conn{width:8px;height:8px;border-radius:50%;background:var(--warn)}.conn.ok{background:var(--success)}.welcome{display:flex;flex-direction:column;gap:16px;padding-top:calc(env(safe-area-inset-top) + 48px)}.welcome .logo{margin-bottom:8px}button{font:inherit;font-weight:600;min-height:48px;padding:0 18px;border-radius:12px;border:1px solid transparent;cursor:pointer;color:var(--text);background:var(--surface-2);transition:opacity .12s,transform .12s}button:active:not(:disabled){transform:scale(.98)}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);color:var(--accent-ink)}button.danger{background:var(--danger);color:#1b0606}button.ghost{background:transparent;border-color:var(--border)}button.link{min-height:auto;padding:0;background:none;color:var(--accent)}input:not([type=range]),select{font:inherit;font-size:16px;width:100%;min-height:48px;padding:0 14px;border-radius:12px;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.label{font-size:.875rem;font-weight:600;color:var(--muted)}.field{display:flex;flex-direction:column;gap:8px}.value{font-variant-numeric:tabular-nums;font-weight:600}input[type=range]{width:100%;height:32px;margin:0;background:transparent;accent-color:var(--accent);-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:var(--surface-2);border:1px solid var(--border)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-11px;border-radius:50%;background:var(--accent);border:3px solid var(--bg);box-shadow:0 1px 4px #0006}input[type=range]::-moz-range-track{height:6px;border-radius:3px;background:var(--surface-2)}input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--accent);border:3px solid var(--bg)}input[type=range]:disabled{opacity:.5}.stream{position:relative;width:100%;overflow:hidden;border-radius:var(--radius);background:#000;border:1px solid var(--border)}.stream img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain}.stream-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--muted);font-size:.875rem}.stream-badges{position:absolute;top:10px;left:10px;right:10px;display:flex;flex-wrap:wrap;gap:6px}.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:.75rem;font-weight:600;background:#0009;color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.badge.live .dot{width:7px;height:7px;border-radius:50%;background:#ff4d4d;animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}.queue-pos{display:grid;place-items:center;min-width:52px;height:52px;padding:0 8px;border-radius:12px;background:var(--surface-2);font-size:1.25rem;font-weight:700;font-variant-numeric:tabular-nums}.timer{font-size:.875rem;font-weight:600;font-variant-numeric:tabular-nums;color:var(--muted)}.timer.warn{color:var(--warn)}.run-status{display:flex;flex-direction:column;gap:8px}.progress{height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden}.progress>div{height:100%;background:var(--accent);transition:width .25s linear}.run-result{font-weight:600}.run-result.succeeded{color:var(--success)}.run-result.failed{color:var(--danger)}.run-result.cancelled{color:var(--muted)}.notes{display:flex;flex-direction:column;gap:8px;padding-top:8px}.toast{position:fixed;left:var(--gutter);right:var(--gutter);bottom:calc(env(safe-area-inset-bottom) + 16px);max-width:528px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:12px;background:#3a1d1d;border:1px solid color-mix(in srgb,var(--danger) 50%,transparent);font-size:.875rem;z-index:20}
