:root{color-scheme:dark;--pf-bg-0: #0a0e14;--pf-bg-1: #121820;--pf-bg-2: #1a222e;--pf-border-subtle: #2a3344;--pf-border-strong: #3d4a60;--pf-text-main: #eef2f7;--pf-text-muted: #9aa6b8;--pf-text-soft: #6d7a8f;--pf-cyan: #3ee7f2;--pf-danger: #ff4f6c;--pf-font-main: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;--pf-font-display: "Space Grotesk", "IBM Plex Sans", system-ui, sans-serif;--pf-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--color-paper: var(--pf-bg-0);--color-paper-2: var(--pf-bg-1);--color-ink: var(--pf-text-main);--color-ink-2: var(--pf-text-muted);--color-accent: var(--pf-cyan);--color-focus: var(--pf-cyan);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--radius-sm: 4px;--radius-md: 8px;--duration-fast: .12s;--control-disabled-opacity: .55}.gpu-app{display:grid;grid-template-rows:auto 1fr;height:100%;background:var(--pf-bg-0);color:var(--pf-text-main);font-family:var(--pf-font-main)}.gpu-header{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--pf-border-subtle);background:var(--pf-bg-1)}.gpu-brand{letter-spacing:-.02em;font-family:var(--pf-font-display);font-weight:600}.gpu-status{color:var(--pf-text-muted);font-size:.8125rem}.gpu-header label{font-size:.8125rem;color:var(--pf-text-muted);display:flex;flex-direction:column;gap:var(--space-1)}.gpu-header select,.gpu-header input[type=number],.gpu-header input[type=range],.gpu-header button{font:inherit;color:var(--pf-text-main);background:var(--pf-bg-0);border:1px solid var(--pf-border-subtle);border-radius:var(--radius-sm);padding:.35rem .5rem;outline:2px solid transparent;outline-offset:2px;min-height:44px}.gpu-header select:hover,.gpu-header input[type=number]:hover,.gpu-header input[type=range]:hover{border-color:var(--pf-border-strong)}.gpu-header select:focus-visible,.gpu-header input[type=number]:focus-visible,.gpu-header input[type=range]:focus-visible,.gpu-header button:focus-visible,.gpu-header a:focus-visible{border-color:var(--color-focus);outline-color:var(--color-focus)}.gpu-header button{cursor:pointer}.gpu-header button:hover{border-color:var(--pf-cyan)}.gpu-header button:focus-visible{border-color:var(--color-focus);outline-color:var(--color-focus)}.gpu-header button:active{background:var(--pf-bg-2)}.gpu-header button:disabled,.gpu-header select:disabled,.gpu-header input:disabled{opacity:var(--control-disabled-opacity);cursor:not-allowed}.gpu-header a{margin-left:auto;font-size:.8125rem;color:var(--pf-cyan);text-decoration:none;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}.gpu-header a:hover{color:var(--pf-text-main)}.gpu-header a:focus-visible{color:var(--pf-text-main);outline-color:var(--color-focus)}.gpu-header a:active{opacity:.85}.gpu-controls{position:relative}.gpu-controls>summary{cursor:pointer;list-style:none;font-size:.8125rem;color:var(--pf-text-muted);border:1px solid var(--pf-border-subtle);border-radius:var(--radius-sm);padding:.4rem .65rem;min-height:44px;display:inline-flex;align-items:center;background:var(--pf-bg-0);outline:2px solid transparent;outline-offset:2px}.gpu-controls>summary:hover,.gpu-controls>summary:focus-visible{border-color:var(--pf-cyan);color:var(--pf-text-main);outline-color:var(--color-focus)}.gpu-controls>summary:active{background:var(--pf-bg-2)}.gpu-controls>summary::-webkit-details-marker{display:none}.gpu-controls[open]>summary{border-color:var(--pf-cyan);color:var(--pf-text-main)}.gpu-controls-grid{position:absolute;top:calc(100% + 6px);left:0;z-index:20;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);gap:var(--space-3);min-width:min(28rem,80vw);padding:var(--space-3);border:1px solid var(--pf-border-subtle);border-radius:var(--radius-sm);background:var(--pf-bg-1)}@media(max-width:640px){.gpu-controls-grid{grid-template-columns:minmax(0,1fr)}}.gpu-stage{position:relative;min-height:0;background:var(--pf-bg-0)}.gpu-fallback{padding:var(--space-5);color:var(--pf-text-muted);max-width:40rem;line-height:1.5}.gpu-fallback a{color:var(--pf-cyan)}.gpu-fallback a:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.gpu-seed-input{width:90px}.gpu-hud{position:absolute;left:var(--space-3);bottom:var(--space-3);padding:var(--space-2) var(--space-3);font-size:.75rem;line-height:1.45;background:color-mix(in srgb,var(--pf-bg-0) 88%,transparent);border:1px solid var(--pf-border-subtle);color:var(--pf-text-main);max-width:460px;pointer-events:none;font-family:var(--pf-font-mono)}.gpu-hud-accent{color:var(--pf-cyan)}.gpu-hud-muted{color:var(--pf-text-muted);word-break:break-word}.gpu-hud-soft{color:var(--pf-text-soft)}.gpu-hud-ok{color:var(--pf-cyan)}.gpu-hud-over{color:var(--pf-danger)}.gpu-measure-panel{position:absolute;left:12px;bottom:12px;z-index:4;max-width:min(420px,calc(100% - 24px));padding:10px 12px;display:grid;gap:6px;border:1px solid var(--pf-border-subtle);background:color-mix(in srgb,var(--pf-bg-1) 92%,transparent);font-family:var(--pf-font-mono);font-size:.72rem;color:var(--pf-text-main)}.gpu-measure-panel strong{font-family:var(--pf-font-main);font-size:.85rem;font-weight:500}.gpu-measure-panel button{justify-self:start;margin-top:2px}.gpu-measure-panel code{font-size:.68rem;color:var(--pf-cyan)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}
