.stream-workbench{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.4fr);gap:28px;align-items:start}.stream-workbench>*{min-width:0}.stream-controls{display:grid;gap:18px}.stream-controls h2,.stream-preview h2{margin:0 0 14px;font-size:1.05rem;font-weight:700;color:var(--color-text)}.stream-controls label{display:grid;gap:7px;font-size:.875rem;font-weight:500;color:var(--color-text)}.stream-controls :is(input:not([type=checkbox]),select,textarea){width:100%;min-width:0;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface-alt);padding:10px 12px;color:var(--color-text);font:inherit}.stream-controls input[type=color]{height:42px;padding:4px}.stream-controls input[type=range]{padding:8px 0;accent-color:var(--color-brand)}.stream-controls .stream-check{display:flex;align-items:center;gap:9px}.stream-check input{accent-color:var(--color-brand);width:17px;height:17px}.stream-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.stream-preview{padding:22px;border:1px solid var(--color-border);border-radius:12px;background:var(--color-surface)}.stream-canvas-stage{min-height:235px;display:flex;align-items:center;justify-content:center;padding:28px 16px;background:#111827;border-radius:8px;overflow:hidden}.stream-canvas-stage.checkered{background-color:#e2e8f0;background-image:linear-gradient(45deg,#cbd5e1 25%,transparent 25%),linear-gradient(-45deg,#cbd5e1 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#cbd5e1 75%),linear-gradient(-45deg,transparent 75%,#cbd5e1 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.stream-canvas-stage canvas{max-width:100%;height:auto;display:block}.stream-canvas-stage[data-kind=icon] canvas{width:144px}.stream-canvas-stage[data-kind=panel] canvas{width:320px}.stream-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.stream-workbench :is(.btn-primary,.btn-secondary){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 16px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface-alt);color:var(--color-text);font:600 .875rem/1.4 Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer}.stream-workbench .btn-primary{background:var(--color-brand);border-color:var(--color-brand);color:#fff}[data-theme=ttdark] .stream-workbench .btn-primary{color:#052e22}.stream-workbench :is(.btn-primary,.btn-secondary):hover:not(:disabled){filter:brightness(.93)}.stream-icon-previews{display:flex;justify-content:center;flex-wrap:wrap;gap:24px}.stream-icon-previews figure{margin:0;text-align:center}.stream-icon-previews figcaption{margin-top:10px;color:#17251c;font-size:.8125rem}.stream-note{font-size:.8125rem;line-height:1.6;color:var(--color-text-muted);margin-top:12px;overflow-wrap:anywhere}.stream-note a{color:var(--color-brand);text-decoration:underline;text-underline-offset:3px}.stream-error{color:#b91c1c;font-size:.875rem;line-height:1.5;min-height:1.4em;margin-top:12px}[data-theme=ttdark] .stream-error{color:#fca5a5}.stream-results{margin:0}.stream-results>div{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--color-border)}.stream-results dt{color:var(--color-text-muted);font-size:.875rem}.stream-results dd{margin:0;font-weight:650;text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.stream-result-output{width:100%;margin-top:18px;min-height:145px;padding:12px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface-alt);color:var(--color-text);font:.8125rem/1.6 ui-monospace,monospace;resize:vertical}.stream-emotes{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-around;gap:22px;padding:32px 12px}.stream-emotes figure{display:grid;justify-items:center;gap:12px;margin:0}.stream-emotes canvas{display:block;background-color:#dbe3eb;background-image:conic-gradient(#c3cedb 25%,transparent 0 50%,#c3cedb 0 75%,transparent 0);background-size:12px 12px}.stream-emotes figcaption{font-size:.75rem;color:var(--color-text-muted);text-align:center}.stream-file{border:1px dashed var(--color-brand);padding:18px;border-radius:10px;background:var(--color-brand-light)}.stream-workbench :is(input,select,textarea,button,a):focus-visible{outline:2px solid var(--color-brand);outline-offset:3px}.stream-workbench [hidden]{display:none!important}.stream-workbench button:disabled{opacity:.5;cursor:not-allowed}.stream-overlay-stage{position:relative;aspect-ratio:16/9;background:#111827;border-radius:8px;overflow:hidden}.stream-overlay-stage iframe{position:absolute;width:1920px;height:1080px;border:0;transform-origin:top left;color-scheme:light}@media(max-width:760px){.stream-workbench{grid-template-columns:minmax(0,1fr);gap:24px}.stream-preview{padding:16px}.stream-canvas-stage{min-height:190px}}@media(prefers-reduced-motion:reduce){.stream-workbench *{scroll-behavior:auto;transition:none!important}}