.sprite-engine{background:var(--canvas-atmosphere-bg,var(--canvas-stage-bg));border-radius:var(--radius,12px);contain:layout paint;outline:none;width:100%;height:100%;min-height:360px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #00000040,inset 0 12px 32px #0000002e}.sprite-engine:after{content:"";pointer-events:none;background:radial-gradient(ellipse at center, transparent 38%, rgba(0, 0, 0, calc(var(--vignette-strength,.35) * .55)) 78%, rgba(0, 0, 0, var(--vignette-strength,.35)) 100%);z-index:2;position:absolute;inset:0}.sprite-engine[data-walk-mode=false]:after,.sprite-engine[data-engine-state=dormant]:after{display:none}.sprite-engine[data-engine-state=dormant]{background-color:var(--canvas-stage-bg);background-image:repeating-linear-gradient(0deg, transparent 0, transparent calc(var(--space-5) - 1px), #ffffff0a calc(var(--space-5) - 1px), #ffffff0a var(--space-5)), repeating-linear-gradient(90deg, transparent 0, transparent calc(var(--space-5) - 1px), #ffffff0a calc(var(--space-5) - 1px), #ffffff0a var(--space-5))}.sprite-engine[data-engine-state=dormant]:before{content:"";width:var(--space-5);height:var(--space-6);margin-left:calc(var(--space-5) / -2);margin-top:calc(-1 * (var(--space-6) + var(--space-3)));background:var(--canvas-stage-bg);border-radius:var(--radius-sm,6px);opacity:.65;pointer-events:none;border:1px solid #ffffff1f;animation:2.4s ease-in-out infinite alternate sprite-engine-loading-pulse;position:absolute;top:50%;left:50%}.sprite-engine[data-engine-state=dormant]:after{content:"Setting up the scene…";padding-top:var(--space-7);color:var(--ink-3,#9aa0aa);font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-12);letter-spacing:.04em;pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}@keyframes sprite-engine-loading-pulse{0%{opacity:.5}to{opacity:.8}}.sprite-engine[data-engine-state=loading]{opacity:0}.sprite-engine[data-engine-state=loading-fade]{opacity:1;transition:opacity .32s cubic-bezier(.2,.7,.2,1)}@media (prefers-reduced-motion:reduce){.sprite-engine[data-engine-state=loading],.sprite-engine[data-engine-state=loading-fade]{opacity:1;transition:none}}.sprite-engine__stage{transform-origin:50%;will-change:transform;transition:transform 80ms cubic-bezier(.2,.8,.2,1);position:absolute;inset:0}.sprite-engine__canvas{width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;cursor:default;background:0 0;outline:none;display:block}.sprite-engine__canvas:focus-visible{outline:2px solid var(--accent,#cfa66d);outline-offset:-4px}.sprite-engine__prompt{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);color:#fff;border:1px solid var(--accent,#cfa66d);font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-12);letter-spacing:.02em;white-space:nowrap;pointer-events:auto;cursor:pointer;opacity:0;z-index:4;background:#14151aeb;border-radius:999px;transition:opacity .18s cubic-bezier(.2,.8,.2,1),transform .18s cubic-bezier(.2,.8,.2,1);display:inline-flex;position:absolute;transform:translate(-50%,calc(6px - 100%));box-shadow:0 4px 16px #0006}.sprite-engine__prompt[data-state=visible]{opacity:1;transform:translate(-50%,-100%)}.sprite-engine__prompt[data-state=hidden]{opacity:0;pointer-events:none;transform:translate(-50%,calc(6px - 100%))}.sprite-engine__prompt-key{min-width:18px;height:18px;padding:0 var(--space-1);background:var(--accent,#cfa66d);color:var(--canvas-stage-bg);font-family:var(--mono,"JetBrains Mono", monospace);font-weight:700;font-size:var(--fs-12);letter-spacing:0;border-radius:4px;justify-content:center;align-items:center;display:inline-flex}.sprite-engine__hint{left:var(--space-3);bottom:var(--space-2);padding:var(--space-1) var(--space-3);color:#ffffff8c;font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-12);letter-spacing:.04em;pointer-events:none;z-index:3;background:#14151a99;border-radius:999px;margin:0;position:absolute}[data-theme=cobalt] .sprite-engine__hint,[data-theme=midnight] .sprite-engine__hint,[data-theme=aurora] .sprite-engine__hint,[data-theme=plum] .sprite-engine__hint{text-shadow:-.5px 0 #ff00aa4d,.5px 0 #00ffff4d}@media (prefers-reduced-motion:reduce){[data-theme=cobalt] .sprite-engine__hint,[data-theme=midnight] .sprite-engine__hint,[data-theme=aurora] .sprite-engine__hint,[data-theme=plum] .sprite-engine__hint{text-shadow:none}}@keyframes scan-glitch{0%,93%{transform:translate(0)}94%{transform:translate(-1.5px)}96%{transform:translate(2px)}98%{transform:translate(-1px)}to{transform:translate(0)}}.sprite-engine[data-theme-group=cool] .sprite-engine__hint{animation:2.7s cubic-bezier(.2,.8,.2,1) -1.4s infinite scan-glitch}@media (prefers-reduced-motion:reduce){.sprite-engine[data-theme-group=cool] .sprite-engine__hint{animation:none;transform:none}}.sprite-engine[data-theme-group=cool] .sprite-engine__prompt{box-shadow:0 4px 16px #0006,-1px 0 #ff00aa4d,1px 0 #00ffff4d}.sprite-engine[data-theme-group=cool]{transition:filter .22s cubic-bezier(.2,.8,.2,1)}.sprite-engine[data-theme-group=cool][data-chromatic-flash=active]{filter:drop-shadow(2px 0 #ff00aa73)drop-shadow(-2px 0 #00ffff73);transition:filter .1s cubic-bezier(.2,.8,.2,1)}@media (prefers-reduced-motion:reduce){.sprite-engine[data-theme-group=cool],.sprite-engine[data-theme-group=cool][data-chromatic-flash=active]{filter:none;transition:none}.sprite-engine__stage{transition:none;transform:none!important}.sprite-engine__prompt{transition:none;transform:translate(-50%,-100%)}.sprite-engine__prompt[data-state=hidden]{transform:translate(-50%,-100%)}.sprite-engine--reduced-motion .sprite-engine__prompt,.sprite-engine[data-reduced-motion=true] .sprite-engine__prompt{transition:none;transform:translate(-50%,-100%)}.sprite-engine[data-engine-state=dormant]:before{opacity:.65;animation:none}}.sprite-engine[data-walk-mode=false] .sprite-engine__prompt,.sprite-engine[data-walk-mode=false] .sprite-engine__hint{display:none}.sprite-engine__canvas[data-component-highlighted]{outline:1px solid var(--accent,#cfa66d);outline-offset:-2px}.studio-walk-toggle{appearance:none;align-items:center;gap:var(--space-2,8px);background:var(--bg-raised,#1c1d22);color:var(--ink,#e8eaee);border:1px solid var(--rule,#ffffff14);padding:var(--space-2) var(--space-4);font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-14);cursor:pointer;border-radius:999px;font-weight:500;transition:background .18s,border-color .18s,color .18s;display:inline-flex}.studio-walk-toggle__label{line-height:1}.studio-walk-toggle__state{background:0 0;border:1.5px solid;border-radius:50%;width:10px;height:10px;transition:background .18s,border-color .18s}.studio-walk-toggle:hover{border-color:var(--accent,#cfa66d);color:var(--accent,#cfa66d)}.studio-walk-toggle:focus-visible{outline:2px solid var(--accent,#cfa66d);outline-offset:2px}.studio-walk-toggle[aria-pressed=true],.studio-walk-toggle[aria-checked=true]{background:var(--accent,#cfa66d);color:#fff;border-color:var(--accent,#cfa66d)}.studio-walk-toggle[aria-pressed=true] .studio-walk-toggle__state,.studio-walk-toggle[aria-checked=true] .studio-walk-toggle__state{background:#fff;border-color:#fff}.studio-stage__walk-layer{opacity:0;visibility:hidden;pointer-events:none;z-index:5;transition:opacity .4s ease-out,visibility 0s linear .4s;position:absolute;inset:0}.studio-stage[data-mode=walk] .studio-stage__walk-layer{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .4s ease-out,visibility linear}.studio-stage[data-mode=walk]>.studio-comp,.studio-stage[data-mode=walk]>.studio-empty,.studio-stage[data-mode=walk]:after{display:none}@media (prefers-reduced-motion:reduce){.studio-stage__walk-layer{transition:none}}.canvas-empty-state{z-index:2;justify-content:center;align-items:center;gap:var(--space-3,12px);text-align:center;pointer-events:none;color:var(--ink,#e8eaee);background:linear-gradient(#14151a52 0%,#14151ac7 100%);flex-direction:column;padding:clamp(24px,4vw,48px);animation:.32s ease-out both canvas-empty-state-in;display:flex;position:absolute;inset:0}.canvas-empty-state[hidden]{display:none!important}.canvas-empty-state__illus{aspect-ratio:1;isolation:isolate;width:clamp(140px,24vw,220px);margin-bottom:var(--space-3,12px);place-items:center;display:grid;position:relative}.canvas-empty-state__grid{border-radius:var(--radius,12px);z-index:1;background-image:radial-gradient(circle,#cfa66d1f 0,#cfa66d0a 40%,#0000 70%),repeating-linear-gradient(0deg,#0000 0 11px,#ffffff0f 11px 12px),repeating-linear-gradient(90deg,#0000 0 11px,#ffffff0f 11px 12px);border:1px dashed #ffffff1a;position:absolute;inset:0}.canvas-empty-state__mark{z-index:2;font-family:var(--mono,"JetBrains Mono", monospace);color:var(--accent,#cfa66d);text-shadow:0 2px 12px #cfa66d52;font-size:clamp(40px,6vw,56px);font-weight:700;line-height:1;animation:4.4s ease-in-out infinite alternate canvas-empty-state-float;position:relative}.canvas-empty-state__title{font-family:var(--serif,"Iowan Old Style", "Charter", Georgia, serif);letter-spacing:.005em;color:var(--ink,#e8eaee);margin:0;font-size:clamp(20px,2.4vw,28px);font-style:italic}.canvas-empty-state__sub{max-width:36ch;font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-14,14px);color:var(--ink-3,#9aa0aa);margin:0;line-height:1.5}@keyframes canvas-empty-state-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes canvas-empty-state-float{0%{transform:translateY(-3px)}to{transform:translateY(3px)}}@media (prefers-reduced-motion:reduce){.canvas-empty-state,.canvas-empty-state__mark{animation:none}}.sprite-engine[data-canvas-empty=true] .sprite-engine__canvas{filter:brightness(.65)}.sprite-engine[data-canvas-empty=true] .sprite-engine__hint{opacity:.45}.walk-tutorial{z-index:30;padding:var(--space-4,16px);pointer-events:auto;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.walk-tutorial[hidden]{display:none!important}.walk-tutorial[data-tutorial-state=hidden]{display:none}.walk-tutorial__overlay{-webkit-backdrop-filter:blur(2px);cursor:pointer;background:#0a0b0ea8;position:absolute;inset:0}.walk-tutorial__card{z-index:1;gap:var(--space-2,8px);width:min(420px,100% - 32px);padding:var(--space-5,24px) var(--space-5,24px) var(--space-4,16px);background:var(--bg-raised,#1c1d22);border:1px solid var(--rule,#ffffff14);border-radius:var(--radius,12px);color:var(--ink,#e8eaee);flex-direction:column;animation:.28s ease-out both walk-tutorial-card-in;display:flex;position:relative;box-shadow:0 18px 48px #0000008c}.walk-tutorial__close{top:var(--space-2,8px);right:var(--space-3,12px);appearance:none;color:var(--ink-3,#9aa0aa);font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-22,22px);cursor:pointer;padding:var(--space-1,4px) var(--space-2,8px);border-radius:var(--radius-sm,6px);background:0 0;border:0;line-height:1;transition:background .16s,color .16s;position:absolute}.walk-tutorial__close:hover{color:var(--ink,#e8eaee);background:#ffffff0f}.walk-tutorial__close:focus-visible{outline:2px solid var(--accent,#cfa66d);outline-offset:2px}.walk-tutorial__step-count{font-family:var(--mono,"JetBrains Mono", monospace);font-size:var(--fs-12,12px);color:var(--ink-3,#9aa0aa);letter-spacing:.08em;text-transform:uppercase;margin:0}.walk-tutorial__title{font-family:var(--serif,"Iowan Old Style", "Charter", Georgia, serif);color:var(--ink,#e8eaee);margin:0;font-size:clamp(18px,2vw,22px);font-style:italic;line-height:1.3}.walk-tutorial__title>span[hidden]{display:none}.walk-tutorial__body{font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-14,14px);color:var(--ink-2,#c8ccd5);margin:0;line-height:1.55}.walk-tutorial__body>span[hidden]{display:none}.walk-tutorial__actions{margin-top:var(--space-3,12px);justify-content:flex-end;display:flex}.walk-tutorial__next{appearance:none;background:var(--accent,#cfa66d);color:var(--canvas-stage-bg,#14151a);padding:var(--space-2,8px) var(--space-5,24px);font-family:var(--sans,system-ui, sans-serif);font-size:var(--fs-14,14px);cursor:pointer;border:0;border-radius:999px;font-weight:600;transition:filter .16s,transform .16s}.walk-tutorial__next:hover{filter:brightness(1.05);transform:translateY(-1px)}.walk-tutorial__next:focus-visible{outline:2px solid var(--ink,#e8eaee);outline-offset:2px}@keyframes walk-tutorial-card-in{0%{opacity:0;transform:translateY(8px)scale(.985)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.walk-tutorial__card{animation:none}}.sprite-engine__parallax-far,.sprite-engine__parallax-mid,.sprite-engine__parallax-near{will-change:transform;pointer-events:none;background-position:50%;background-size:cover;position:absolute;inset:0}.sprite-engine__parallax-far{z-index:-3}.sprite-engine__parallax-mid{z-index:-2}.sprite-engine__parallax-near{z-index:-1}@media (prefers-reduced-motion:reduce){.sprite-engine__parallax-far,.sprite-engine__parallax-mid,.sprite-engine__parallax-near{will-change:auto;transform:none!important}}