.gpu-experience-shell{--gpu-bg:#0c1116;--gpu-panel:#141b22;--gpu-panel-bright:#1a232d;--gpu-line:#35414b;--gpu-line-soft:#96b2c02e;--gpu-text:#edf5f4;--gpu-muted:#8d9ba3;--gpu-lime:#d9ff6a;--gpu-coral:#ff6f70;--gpu-cyan:#71e2e2;min-height:100vh;color:var(--gpu-text);background:linear-gradient(#ffffff06 1px, transparent 1px) 0 0 / 100% 48px, radial-gradient(circle at 82% 8%, #71e2e21a, transparent 28rem), radial-gradient(circle at 12% 76%, #d9ff6a14, transparent 24rem), var(--gpu-bg);padding:24px clamp(16px,4vw,64px) 34px;overflow:hidden}.gpu-source-video{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed}.gpu-header,.gpu-workspace,.gpu-surface-panel,.gpu-footer{width:min(1480px,100%);margin-inline:auto}.gpu-header{border-bottom:1px solid var(--gpu-line);padding:8px 0 28px;position:relative}.gpu-header:after{content:"";background:var(--gpu-lime);width:18%;height:3px;position:absolute;bottom:-2px;right:8%}.gpu-header-topline,.gpu-header-actions,.gpu-panel-heading,.gpu-stage-footer,.gpu-footer,.gpu-control-bottom{justify-content:space-between;align-items:center;gap:16px;display:flex}.gpu-index,.gpu-eyebrow,.gpu-panel-heading span,.gpu-stage-footer span,.gpu-footer,.gpu-engine-card span,.gpu-control-group>span,.gpu-band-picker>span,.gpu-surface-intro>span{font-family:var(--font-geist-mono), ui-monospace, monospace;letter-spacing:.14em;text-transform:uppercase}.gpu-index,.gpu-eyebrow{color:var(--gpu-lime);font-size:.68rem;font-weight:700}.gpu-status{color:var(--gpu-muted);font:.7rem var(--font-geist-mono), monospace;align-items:center;gap:8px;display:inline-flex}.gpu-status i,.gpu-live-dot{background:#64717a;border-radius:50%;width:8px;height:8px;display:inline-block}.gpu-status--loading i{background:#f0bc5c;animation:.9s ease-in-out infinite alternate gpu-pulse}.gpu-status--running i,.gpu-live-dot{background:var(--gpu-lime);box-shadow:0 0 0 4px #d9ff6a1f,0 0 18px #d9ff6a8c}.gpu-status--error i{background:var(--gpu-coral)}.gpu-header-grid{grid-template-columns:minmax(0,1fr) minmax(260px,360px);align-items:end;gap:48px;margin-top:30px;display:grid}.gpu-eyebrow{color:var(--gpu-cyan);margin:0 0 12px}.gpu-header h1{letter-spacing:-.075em;max-width:760px;margin:0;font-size:clamp(2.9rem,7vw,7.3rem);font-weight:650;line-height:.88}.gpu-header h1 em{color:var(--gpu-lime);font-style:normal}.gpu-intro{max-width:540px;color:var(--gpu-muted);margin:22px 0 0;font-size:clamp(.94rem,1.35vw,1.08rem);line-height:1.7}.gpu-engine-card{border:1px solid var(--gpu-line);border-left:4px solid var(--gpu-cyan);background:#141b22c7;align-self:end;gap:8px;padding:18px;display:grid}.gpu-engine-card span,.gpu-control-group>span,.gpu-band-picker>span,.gpu-surface-intro>span{color:var(--gpu-muted);font-size:.62rem}.gpu-engine-card strong{font-size:1.04rem}.gpu-engine-card small{color:var(--gpu-muted);font-size:.72rem}.gpu-header-actions{justify-content:flex-start;margin-top:28px}.gpu-button,.gpu-choice-row button,.gpu-band-picker button,.gpu-inline-action,.gpu-debug-toggle{border:1px solid var(--gpu-line);min-height:44px;color:var(--gpu-text);font:inherit;cursor:pointer;background:0 0;border-radius:4px;padding:0 16px;transition:transform .15s,border-color .15s,background .15s,color .15s}.gpu-button:hover:not(:disabled),.gpu-choice-row button:hover,.gpu-band-picker button:hover,.gpu-inline-action:hover,.gpu-debug-toggle:hover{border-color:var(--gpu-lime);transform:translateY(-2px)}.gpu-button:active:not(:disabled),.gpu-choice-row button:active,.gpu-band-picker button:active,.gpu-inline-action:active,.gpu-debug-toggle:active{transform:translateY(0)}.gpu-button:focus-visible,.gpu-choice-row button:focus-visible,.gpu-band-picker button:focus-visible,.gpu-inline-action:focus-visible,.gpu-debug-toggle:focus-visible,.gpu-band-card:focus-visible{outline:3px solid var(--gpu-cyan);outline-offset:3px}.gpu-button:disabled{cursor:wait;opacity:.42}.gpu-button--primary{border-color:var(--gpu-lime);color:#0c1116;background:var(--gpu-lime);font-weight:750}.gpu-button--quiet{background:#ffffff09}.gpu-workspace{grid-template-columns:minmax(0,8fr) minmax(290px,4fr);gap:16px;margin-top:22px;display:grid}.gpu-stage-panel,.gpu-panel,.gpu-surface-panel{border:1px solid var(--gpu-line);background:#141b22db}.gpu-stage-panel{min-width:0;padding:12px}.gpu-panel-heading{border-bottom:1px solid var(--gpu-line-soft);min-height:42px;padding:0 6px 10px}.gpu-panel-heading>div{gap:5px;display:grid}.gpu-panel-heading span,.gpu-stage-footer span{color:var(--gpu-muted);font-size:.6rem}.gpu-panel-heading strong{font-size:.94rem}.gpu-panel-counter{font:.64rem var(--font-geist-mono), monospace;color:var(--gpu-cyan)!important}.gpu-canvas-frame{background:linear-gradient(135deg,#d9ff6a09 25%,#0000 25%) 0 0/28px 28px,#070b0e;border:1px solid #29343c;min-height:min(60vh,620px);margin-top:12px;position:relative;overflow:hidden}.gpu-canvas-frame canvas{width:100%;height:100%;min-height:inherit;object-fit:contain;display:block}.gpu-canvas-label{color:var(--gpu-lime);font:.6rem var(--font-geist-mono), monospace;letter-spacing:.12em;background:#070b0ed1;padding:6px 8px;position:absolute;bottom:12px;right:14px}.gpu-recording-bar{border-top:1px solid var(--gpu-line-soft);border-bottom:1px solid var(--gpu-line-soft);justify-content:space-between;align-items:center;gap:14px;margin-top:10px;padding:10px 6px;display:flex}.gpu-recording-bar>div:first-child{gap:5px;display:grid}.gpu-recording-bar span{color:var(--gpu-muted);font:.6rem var(--font-geist-mono), monospace;letter-spacing:.14em}.gpu-recording-bar strong{color:var(--gpu-text);font-size:.78rem}.gpu-recording-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}.gpu-record-button{border:1px solid var(--gpu-line);min-height:34px;color:var(--gpu-text);cursor:pointer;background:#ffffff09;border-radius:3px;padding:0 11px;font-size:.72rem;transition:border-color .15s,transform .15s,background .15s}.gpu-record-button:hover:not(:disabled){border-color:var(--gpu-cyan);transform:translateY(-2px)}.gpu-record-button:active:not(:disabled){transform:translateY(0)}.gpu-record-button:focus-visible{outline:3px solid var(--gpu-cyan);outline-offset:3px}.gpu-record-button:disabled{cursor:not-allowed;opacity:.38}.gpu-record-button.is-recording{border-color:var(--gpu-coral);color:#fff;background:#ff6f7029}.gpu-record-button--export:not(:disabled){border-color:var(--gpu-lime);color:var(--gpu-lime)}.gpu-stage-empty{background:linear-gradient(130deg,#0c1116f5,#0c1116b8);place-content:center;justify-items:start;padding:28px;display:grid;position:absolute;inset:0}.gpu-stage-mark{border:1px solid var(--gpu-lime);width:52px;height:52px;color:var(--gpu-lime);font:.75rem var(--font-geist-mono), monospace;place-items:center;margin-bottom:22px;display:grid}.gpu-stage-empty strong{letter-spacing:-.05em;max-width:420px;font-size:clamp(1.7rem,4vw,3.2rem)}.gpu-stage-empty p{max-width:410px;color:var(--gpu-muted);margin:12px 0 18px;line-height:1.65}.gpu-inline-action{min-height:38px;color:var(--gpu-bg);border-color:var(--gpu-lime);background:var(--gpu-lime);font-size:.82rem;font-weight:700}.gpu-stage-footer{border-top:1px solid var(--gpu-line-soft);align-items:stretch;margin-top:12px}.gpu-stage-footer>div{flex:1;gap:6px;padding:12px 6px 2px;display:grid}.gpu-stage-footer>div+div{border-left:1px solid var(--gpu-line-soft);padding-left:18px}.gpu-stage-footer strong{font-size:.82rem}.gpu-side-panel{align-content:start;gap:16px;display:grid}.gpu-panel{padding:14px}.gpu-metric-grid{grid-template-columns:repeat(2,1fr);gap:8px;margin-top:14px;display:grid}.gpu-metric-grid>div{border:1px solid var(--gpu-line-soft);background:#ffffff06;gap:5px;min-height:74px;padding:10px;display:grid}.gpu-metric-grid span,.gpu-metric-grid small,.gpu-track-line span,.gpu-track-line strong{color:var(--gpu-muted);font:.62rem var(--font-geist-mono), monospace}.gpu-metric-grid strong{color:var(--gpu-text);font:1.2rem var(--font-geist-mono), monospace}.gpu-track-line{border-top:1px solid var(--gpu-line-soft);justify-content:space-between;align-items:center;margin-top:10px;padding-top:12px;display:flex}.gpu-track-line strong{color:var(--gpu-lime)}.gpu-control-panel{gap:18px;display:grid}.gpu-control-group{gap:9px;display:grid}.gpu-choice-row{flex-wrap:wrap;gap:6px;display:flex}.gpu-choice-row button,.gpu-band-picker button{min-height:36px;color:var(--gpu-muted);padding-inline:11px;font-size:.73rem}.gpu-choice-row button.is-active,.gpu-band-picker button.is-active{border-color:var(--gpu-lime);color:var(--gpu-bg);background:var(--gpu-lime)}.gpu-control-bottom{border-top:1px solid var(--gpu-line-soft);padding-top:14px}.gpu-debug-toggle{min-height:34px;color:var(--gpu-muted);align-items:center;gap:8px;padding-inline:10px;font-size:.73rem;display:inline-flex}.gpu-debug-toggle.is-active{border-color:var(--gpu-cyan);color:var(--gpu-cyan)}.gpu-control-bottom>span{color:var(--gpu-muted);font:.7rem var(--font-geist-mono), monospace}.gpu-surface-panel{grid-template-columns:minmax(180px,.7fr) minmax(0,1.4fr) minmax(270px,1fr);gap:18px;margin-top:16px;padding:18px;display:grid}.gpu-surface-intro{border-right:1px solid var(--gpu-line-soft);align-content:start;gap:9px;padding-right:12px;display:grid}.gpu-surface-intro>span{color:var(--gpu-cyan)}.gpu-surface-intro h2{letter-spacing:-.04em;margin:0;font-size:clamp(1.15rem,2vw,1.55rem)}.gpu-surface-intro p{color:var(--gpu-muted);margin:0;font-size:.75rem;line-height:1.6}.gpu-default-note{color:var(--gpu-lime);margin-top:8px;font-size:.66rem;line-height:1.5;display:inline-block}.gpu-surface-editor{align-content:start;gap:12px;display:grid}.gpu-band-grid{grid-template-columns:repeat(var(--band-count), minmax(74px, 1fr));gap:7px;display:grid}.gpu-band-card{border:1px solid var(--gpu-line);min-height:110px;color:var(--gpu-text);background:var(--gpu-bg);text-align:left;cursor:pointer;border-radius:3px;padding:0;position:relative;overflow:hidden}.gpu-band-card:hover,.gpu-band-card.is-selected{border-color:var(--gpu-lime)}.gpu-band-card.is-selected{box-shadow:inset 0 0 0 2px #d9ff6a47}.gpu-band-card>strong,.gpu-band-card>small{z-index:2;text-shadow:0 1px 6px #000;position:absolute;bottom:10px;left:9px}.gpu-band-card>strong{font-size:.74rem;bottom:25px}.gpu-band-card>small{color:#d6e0df;font-size:.63rem}.gpu-band-picker{border-top:1px solid var(--gpu-line-soft);gap:8px;padding-top:10px;display:grid}.gpu-band-picker>div{flex-wrap:wrap;gap:6px;display:flex}.gpu-effect-atlas{grid-template-columns:repeat(2,1fr);gap:7px;display:grid}.gpu-effect-tile{border:1px solid var(--gpu-line-soft);min-height:92px;position:relative;overflow:hidden}.gpu-effect-tile strong{z-index:2;color:#fff;font:.66rem var(--font-geist-mono), monospace;text-shadow:0 1px 6px #000;position:absolute;bottom:8px;left:9px}.gpu-swatch{background:radial-gradient(circle at 72% 24%,#ffe7b0 0 8%,#0000 9%),linear-gradient(135deg,#ff8da1 0 22%,#ffd76a 23% 44%,#2454ff 45% 67%,#17121f 68%);display:block;position:absolute;inset:0;overflow:hidden}.gpu-swatch:before,.gpu-swatch:after,.gpu-swatch i{content:"";pointer-events:none;display:block;position:absolute}.gpu-swatch:before{border:2px solid #ffffffd1;width:58%;height:34%;top:18%;left:8%;transform:skew(-22deg)rotate(-6deg)}.gpu-swatch:after{background:repeating-linear-gradient(90deg,#ffffffeb 0 5px,#0000 5px 12px);width:52%;height:12%;bottom:18%;right:-5%;transform:rotate(-8deg)}.gpu-swatch i{aspect-ratio:1;mix-blend-mode:screen;background:radial-gradient(circle at 38% 38%,#fff 0 8%,#0000 9%),linear-gradient(145deg,#111,#f5f1ea);border-radius:50%;width:32%;top:25%;left:38%}.gpu-swatch--negative{filter:invert()contrast(1.5)saturate(2.3)hue-rotate(155deg)}.gpu-swatch--solarize{filter:invert(.72)contrast(1.75)saturate(3.2)hue-rotate(72deg)}.gpu-swatch--chromatic{filter:contrast(1.3)saturate(1.8)}.gpu-swatch--chromatic:before{border-color:#00eeffe6;box-shadow:7px 0 #ff005d94}.gpu-face-preview{background:#ece9e1;display:block;position:absolute;inset:0;overflow:hidden}.gpu-face-preview__back,.gpu-face-preview__front{clip-path:polygon(5% 16%,91% 5%,97% 82%,13% 95%);display:block;position:absolute;overflow:hidden}.gpu-face-preview__back{background:#fbfaf7;inset:12% 6%;transform:translate(4%,5%)rotate(2deg);box-shadow:0 6px 14px #0b0e123d}.gpu-face-preview__front{isolation:isolate;border:1px solid #fffc;inset:7% 5%;transform:rotate(-1deg);box-shadow:0 7px 16px #0a0b0f5c}.gpu-face-preview__front:before,.gpu-face-preview__front:after,.gpu-face-preview__grid,.gpu-face-preview__signal{content:"";pointer-events:none;display:block;position:absolute}.gpu-face-preview__front:before{z-index:-1;mix-blend-mode:overlay;background:repeating-linear-gradient(105deg,#ffffff42 0 2px,#0000 2px 11px);inset:0}.gpu-face-preview__front:after{border:1px solid #ffffffb3;width:42%;height:22%;top:12%;right:8%;transform:skew(-20deg)rotate(-8deg)}.gpu-face-preview__grid{mix-blend-mode:screen;background:repeating-linear-gradient(90deg,#ffffffe0 0 3px,#0000 3px 10px);width:56%;height:16%;bottom:17%;left:12%;transform:rotate(-7deg)}.gpu-face-preview__signal{aspect-ratio:1;mix-blend-mode:screen;background:radial-gradient(circle at 36% 34%,#fff 0 8%,#0000 9%),#11151d;border-radius:50%;width:24%;top:32%;left:42%;box-shadow:0 0 0 2px #ffffff7a}.gpu-face-preview__front--material{background:linear-gradient(124deg,#ff6685 0 24%,#ffc958 25% 47%,#667cff 48% 71%,#191825 72%)}.gpu-face-preview__front--negative{background:linear-gradient(124deg,#102d63 0 25%,#ccff82 26% 47%,#ffdc43 48% 69%,#e83d77 70%)}.gpu-face-preview__front--solarize{background:repeating-linear-gradient(112deg,#fff6c7 0 16%,#94ef58 16% 31%,#5136d8 31% 47%,#ff5798 47% 64%,#f99d3a 64% 82%)}.gpu-face-preview__front--chromatic{background:linear-gradient(90deg,#00efffeb 0 34%,#0000 35% 64%,#ff006fe6 65%),linear-gradient(125deg,#f8f8f4 0 46%,#121722 47% 100%)}.gpu-face-preview__front--chromatic:after{border-color:#00eeffeb;box-shadow:7px 0 #ff006f9e}.gpu-face-preview.is-compact .gpu-face-preview__back{inset:14% 5%}.gpu-face-preview.is-compact .gpu-face-preview__front{inset:8% 4%}.gpu-footer{color:var(--gpu-muted);padding-top:18px;font-size:.62rem}@keyframes gpu-pulse{0%{opacity:.35}to{opacity:1}}@media (width<=1060px){.gpu-header-grid,.gpu-workspace,.gpu-surface-panel{grid-template-columns:1fr}.gpu-engine-card{max-width:420px}.gpu-surface-intro{border-right:0;border-bottom:1px solid var(--gpu-line-soft);padding:0 0 14px}}@media (width<=640px){.gpu-experience-shell{padding:16px 12px 24px}.gpu-header-grid{gap:28px;margin-top:24px}.gpu-header h1{font-size:clamp(2.65rem,15vw,5rem)}.gpu-header-actions{flex-direction:column;align-items:stretch}.gpu-button{width:100%}.gpu-canvas-frame{min-height:58vh}.gpu-recording-bar{flex-direction:column;align-items:flex-start}.gpu-recording-actions{justify-content:stretch;width:100%}.gpu-record-button{flex:1}.gpu-stage-footer{gap:6px}.gpu-stage-footer>div+div{padding-left:9px}.gpu-band-grid{grid-template-columns:repeat(var(--band-count), minmax(92px, 1fr));overflow-x:auto}.gpu-footer{flex-direction:column;align-items:flex-start;gap:8px}}@media (prefers-reduced-motion:reduce){.gpu-experience-shell *,.gpu-experience-shell :before,.gpu-experience-shell :after{transition-duration:1ms!important;animation-duration:1ms!important}}