:root{color:#eef4ff;font-synthesis:none;text-rendering:optimizelegibility;--panel:#0e1c2be6;--panel-border:#90b1ce30;--muted:#9fb2c6;--quiet:#70879c;--cyan:#75e6da;--blue:#76a9ff;--orange:#ffb56b;--danger:#ff8a9a;background:#071019;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}button,input,select{font:inherit}button,select,input[type=range],input[type=color]{accent-color:var(--cyan)}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}h1,h2,p{margin-top:0}h1{letter-spacing:-.045em;margin-bottom:.4rem;font-size:clamp(1.75rem,4vw,3.1rem);line-height:1}h2{letter-spacing:-.015em;margin-bottom:.75rem;font-size:1.05rem}.demo-header{justify-content:space-between;align-items:flex-end;gap:2rem;max-width:1540px;margin:0 auto;padding:2rem clamp(1rem,3vw,3rem) 1.25rem;display:flex}.eyebrow,.chooser-kicker{color:var(--cyan);letter-spacing:.13em;text-transform:uppercase;margin-bottom:.45rem;font-size:.7rem;font-weight:750}.subtitle{max-width:54rem;color:var(--muted);margin-bottom:0;line-height:1.5}.trust-badges{flex-wrap:wrap;justify-content:flex-end;gap:.5rem;display:flex}.trust-badges span,.state-badge{color:#baf5ee;letter-spacing:.025em;white-space:nowrap;background:#75e6da14;border:1px solid #75e6da40;border-radius:999px;padding:.38rem .65rem;font-size:.7rem;font-weight:650}.app-shell{grid-template-columns:minmax(0,1fr) minmax(20rem,28rem);gap:1rem;max-width:1540px;margin:0 auto;padding:0 clamp(1rem,3vw,3rem) 3rem;display:grid}.stage-card,.panel{border:1px solid var(--panel-border);background:var(--panel);border-radius:1.1rem;overflow:hidden;box-shadow:0 22px 60px #00000040}.stage-card{align-self:start}.stage{background:#02060a;min-height:min(72vh,920px);position:relative;overflow:hidden}.stage canvas{cursor:crosshair;object-fit:contain;touch-action:none;width:100%;height:100%;min-height:min(72vh,920px);display:block}.stage video{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;top:0;left:0}.stage-hint{border-top:1px solid var(--panel-border);color:var(--muted);margin:0;padding:.75rem 1rem;font-size:.78rem;line-height:1.45}.status,.chooser,.unsupported{z-index:4;position:absolute;inset:0}.status{pointer-events:none;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#030a10b8;place-content:center;justify-items:center;gap:.7rem;display:grid}.status[hidden],.chooser[hidden],.unsupported[hidden]{display:none}.status-message{color:#d4e1ee;text-align:center;max-width:32rem;margin:0;padding:0 1rem}.status[data-tone=error] .spinner{display:none}.status[data-tone=error] .status-message{color:var(--danger)}.spinner{border:2px solid #75e6da33;border-top-color:var(--cyan);border-radius:999px;width:1.8rem;height:1.8rem;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(1turn)}}.chooser{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#030a10db;place-items:center;padding:1rem;display:grid}.chooser-panel{background:#0d1b29f7;border:1px solid #90b1ce38;border-radius:1rem;width:min(100%,34rem);padding:clamp(1.1rem,3vw,2rem);box-shadow:0 24px 80px #0000006b}.chooser-copy{color:var(--muted);font-size:.86rem;line-height:1.55}.chooser-heading{color:var(--quiet);letter-spacing:.1em;text-transform:uppercase;margin:1rem 0 .5rem;font-size:.68rem;font-weight:700}.chooser-row{flex-wrap:wrap;gap:.55rem;display:flex}.chooser-row button,.quiet-button{color:#dce9f5;cursor:pointer;background:#ffffff0b;border:1px solid #90b1ce47;border-radius:.65rem;padding:.55rem .75rem;font-size:.8rem}.chooser-row button:hover,.quiet-button:hover{background:#75e6da14;border-color:#75e6da8c}.chooser-row button.selected{border-color:var(--cyan);background:#75e6da1f;box-shadow:inset 0 0 0 1px #75e6da40}.chooser-row button.recommended:after{content:"recommended";color:var(--cyan);letter-spacing:.055em;text-transform:uppercase;margin-top:.25rem;font-size:.58rem;display:block}.cached-badge{color:var(--orange);margin-left:.35rem;font-size:.62rem}.start-button{color:#031019;cursor:pointer;background:linear-gradient(110deg,#3b8bea,#42cfbd);border:0;border-radius:.7rem;width:100%;margin-top:1.25rem;padding:.75rem 1rem;font-weight:750}.start-button:hover{filter:brightness(1.08)}.chooser-error{color:var(--danger);margin:.85rem 0 0;font-size:.82rem}.chooser-footer{color:var(--quiet);justify-content:space-between;gap:1rem;margin-top:1rem;font-size:.7rem;display:flex}.cache-toggle{align-items:center;gap:.4rem;display:inline-flex}.clear-cache{color:var(--muted);cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.clear-cache:disabled{visibility:hidden}.unsupported{background:#071019;grid-template-columns:minmax(12rem,.8fr) minmax(18rem,1fr);align-items:center;gap:2rem;padding:clamp(1.25rem,4vw,3.5rem);display:grid}.unsupported img{object-fit:cover;border-radius:.8rem;width:100%;max-height:62vh}.unsupported p{color:var(--muted);line-height:1.55}.sidebar{align-content:start;gap:1rem;display:grid}.panel{padding:1rem}.panel-heading{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.panel-heading h2,.panel-heading .eyebrow{margin-bottom:.25rem}.control-field{color:var(--muted);gap:.35rem;margin-top:.85rem;font-size:.76rem;display:grid}.control-field span{justify-content:space-between;display:flex}.control-field output{color:#dce9f5;font-variant-numeric:tabular-nums}.control-field select{color:#e8f1fa;background:#0b1824;border:1px solid #90b1ce40;border-radius:.55rem;width:100%;padding:.55rem .65rem}.control-note{color:var(--quiet);font-size:.67rem;line-height:1.4}.control-field select:disabled{cursor:not-allowed;opacity:.55}.fairy-toggle{color:#dce9f5;cursor:pointer;background:radial-gradient(circle at 12% 22%,#ffd37d24,#0000 38%),#75e6da0b;border:1px solid #75e6da33;border-radius:.7rem;grid-template-columns:auto 1fr;align-items:start;gap:.65rem;margin-top:.9rem;padding:.75rem;display:grid}.fairy-toggle input{margin-top:.2rem}.fairy-toggle span{gap:.18rem;display:grid}.fairy-toggle strong{color:#f4fbff;font-size:.78rem}.fairy-toggle small{color:var(--quiet);font-size:.67rem;line-height:1.4}.range-field input{width:100%}.color-field{grid-template-columns:1fr auto;align-items:center}.color-field input{background:0 0;border:1px solid #90b1ce40;border-radius:.45rem;width:3rem;height:1.8rem;padding:0}.state-badge[data-state=pending]{color:#ffd2a5;background:#ffb56b17;border-color:#ffb56b4d}.state-badge[data-state=failed]{color:#ffb5bf;background:#ff8a9a17;border-color:#ff8a9a4d}.diagnostics-grid{grid-template-columns:minmax(7.5rem,.7fr) minmax(0,1.3fr);gap:.5rem .8rem;margin:.9rem 0 0;font-size:.72rem;line-height:1.35;display:grid}.diagnostics-grid dt{color:var(--quiet)}.diagnostics-grid dd{color:#e2edf7;overflow-wrap:anywhere;min-width:0;margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.diagnostics-note{border-top:1px solid var(--panel-border);color:var(--quiet);margin:1rem 0 0;padding-top:.85rem;font-size:.68rem;line-height:1.5}.boundary-panel{background:#3322126b;border-color:#ffb56b3d}.boundary-panel .eyebrow{color:var(--orange)}.boundary-panel p:last-child{color:#d8c3ad;margin-bottom:0;font-size:.78rem;line-height:1.55}@media (max-width:980px){.demo-header{flex-direction:column;align-items:flex-start;gap:1rem}.trust-badges{justify-content:flex-start}.app-shell{grid-template-columns:1fr}.stage,.stage canvas{min-height:min(68vh,760px)}}@media (max-width:620px){.demo-header{padding-top:1.25rem}.unsupported{grid-template-columns:1fr;overflow:auto}.unsupported img{max-height:30vh}.chooser-footer,.panel-heading{flex-direction:column;align-items:flex-start}.diagnostics-grid{grid-template-columns:1fr;gap:.15rem}.diagnostics-grid dd{margin-bottom:.55rem}}:root{color:#e9eee4;--panel:#11241ed1;--panel-border:#e9eee42b;--muted:#b2c2ba;--quiet:#9baea4;--cyan:#72ead5;font-family:var(--site-sans,Manrope, Arial, sans-serif)}body{background:radial-gradient(at 90% 0,#183128 0,#0000 50%),#06100f}.demo-header{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:3rem;padding-top:2.5rem;padding-bottom:2rem;display:grid}.demo-header h1{margin-bottom:1rem;font-size:clamp(2.2rem,4.4vw,4.7rem);font-weight:300;line-height:1.05}.demo-header h1 em{color:#b6a7ff;font-family:var(--site-serif,Georgia, serif);font-weight:300}.demo-header .subtitle{max-width:39rem;font-size:1rem}.input-guide{gap:1rem;display:grid}.input-guide>div{border-left:1px solid var(--panel-border);padding-left:1rem}.input-guide h2{color:var(--cyan);margin:0 0 .35rem;font:400 .73rem/1.4 var(--site-mono,monospace)!important;letter-spacing:.02em!important}.input-guide p{color:var(--muted);margin:0;font-size:.86rem;line-height:1.6}.app-shell{grid-template-columns:minmax(0,1fr) minmax(18rem,22rem)}.chooser{background:#06100fe8;overflow-y:auto}.chooser-panel{background:#0b1d17}.start-button{color:#06100f;background:#c8ff68;min-height:46px}.chooser-row button,.quiet-button{min-height:42px}.source-actions{flex-wrap:wrap;gap:.5rem;display:flex}[hidden]{display:none!important}.diagnostics-panel>summary{cursor:pointer;color:var(--muted);padding:.25rem 0;font-size:.9rem}.diagnostics-panel[open]>summary{margin-bottom:1rem}.demo-footer{max-width:1540px;color:var(--muted);flex-wrap:wrap;gap:.8rem 2rem;margin:0 auto;padding:0 clamp(1rem,3vw,3rem) 2rem;font-size:.8rem;line-height:1.6;display:flex}.demo-footer p{width:100%;margin:0}.demo-footer a{color:var(--cyan);text-underline-offset:4px}@media (max-width:980px){.demo-header{grid-template-columns:1fr;gap:1.3rem}.input-guide{grid-template-columns:1fr 1fr}.app-shell{grid-template-columns:1fr}}@media (max-width:620px){.input-guide{grid-template-columns:1fr}.demo-header{padding-top:1.5rem}.stage,.stage canvas{min-height:600px}.chooser{padding:.65rem}.chooser-panel{padding:1rem}}