:root{--font-mono: ui-monospace, "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;--font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--fs-10: 10px;--fs-11: 11px;--fs-12: 12px;--fs-13: 13px;--fs-14: 14px;--fs-16: 16px;--fs-20: 20px;--fs-28: 28px;--lh-tight: 1.2;--lh-base: 1.45;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-12: 48px;--r-1: 2px;--r-2: 4px;--r-3: 6px;--r-4: 8px;--ease-out: cubic-bezier(.2, .8, .2, 1);--dur-1: 80ms;--dur-2: .14s;--dur-3: .22s;--z-toolbar: 10;--z-overlay: 50;--z-modal: 100;--z-toast: 200;--left-w: 240px;--right-w: 280px;--top-h: 44px;--bottom-h: 44px}:root[data-theme=dark],:root{--c-bg: #0a0a0a;--c-surface: #141414;--c-surface-hi: #1c1c1c;--c-border: #262626;--c-border-hi: #383838;--c-text: #ededed;--c-text-dim: #8a8a8a;--c-text-faint: #555;--c-accent: #ff5a1f;--c-accent-hi: #ff7a45;--c-accent-dim: rgba(255, 90, 31, .18);--c-ok: #4ade80;--c-warn: #fbbf24;--c-err: #ef4444;--c-select: rgba(255, 90, 31, .25);--c-checker-a: #1a1a1a;--c-checker-b: #232323;--sh-1: 0 1px 0 rgba(0, 0, 0, .4);--sh-2: 0 4px 16px rgba(0, 0, 0, .5);--sh-3: 0 12px 40px rgba(0, 0, 0, .6)}:root[data-theme=light]{--c-bg: #fafafa;--c-surface: #ffffff;--c-surface-hi: #f5f5f5;--c-border: #e5e5e5;--c-border-hi: #d4d4d4;--c-text: #0a0a0a;--c-text-dim: #666;--c-text-faint: #aaa;--c-accent: #ea580c;--c-accent-hi: #f97316;--c-accent-dim: rgba(234, 88, 12, .12);--c-ok: #16a34a;--c-warn: #d97706;--c-err: #dc2626;--c-select: rgba(234, 88, 12, .18);--c-checker-a: #f0f0f0;--c-checker-b: #e6e6e6;--sh-1: 0 1px 0 rgba(0, 0, 0, .06);--sh-2: 0 4px 16px rgba(0, 0, 0, .08);--sh-3: 0 12px 40px rgba(0, 0, 0, .12)}@media (prefers-reduced-motion: reduce){:root{--dur-1: 0ms;--dur-2: 0ms;--dur-3: 0ms}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:var(--c-bg);color:var(--c-text);font-family:var(--font-sans);font-size:var(--fs-13);line-height:var(--lh-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none;text-rendering:optimizeLegibility}body{overflow:hidden}#app{width:100vw;height:100dvh;display:grid;grid-template-rows:var(--top-h) 1fr var(--bottom-h);grid-template-columns:var(--left-w) 1fr var(--right-w);grid-template-areas:"top top top" "left center right" "left bottom right";background:var(--c-bg)}button,input,select,textarea{font:inherit;color:inherit;background:transparent;border:none;outline:none}button{cursor:pointer;user-select:none;-webkit-user-select:none}button:disabled{cursor:not-allowed;opacity:.4}::selection{background:var(--c-select)}:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px;border-radius:var(--r-1)}*{scrollbar-width:thin;scrollbar-color:var(--c-border-hi) transparent}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--c-border-hi);border-radius:var(--r-1)}*::-webkit-scrollbar-thumb:hover{background:var(--c-text-faint)}.mono{font-family:var(--font-mono)}.region-top{grid-area:top;border-bottom:1px solid var(--c-border);background:var(--c-surface)}.region-left{grid-area:left;border-right:1px solid var(--c-border);background:var(--c-surface);display:flex;flex-direction:column}.region-right{grid-area:right;border-left:1px solid var(--c-border);background:var(--c-surface);overflow-y:auto}.region-center{grid-area:center;background:var(--c-bg);position:relative;overflow:hidden}.region-bottom{grid-area:bottom;border-top:1px solid var(--c-border);background:var(--c-surface);display:flex;align-items:center;padding:0 var(--sp-3)}canvas{image-rendering:pixelated;image-rendering:crisp-edges}.tb{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--sp-3);gap:var(--sp-3);height:var(--top-h)}.tb-group{display:flex;align-items:center;gap:var(--sp-1)}.tb-center{justify-content:center}.tb-right{justify-content:flex-end}.tb-brand{display:flex;align-items:center;gap:var(--sp-2);letter-spacing:.06em}.tb-mark{font-family:var(--font-mono);color:var(--c-accent);font-size:9px;letter-spacing:-1px}.tb-name{font-family:var(--font-mono);font-weight:600;font-size:var(--fs-12)}.tb-label{font-size:var(--fs-11);color:var(--c-text-dim);letter-spacing:.04em;text-transform:uppercase;padding-right:2px}.tb-res,.sel-input{height:28px;padding:0 var(--sp-2);border:1px solid var(--c-border);border-radius:var(--r-2);background:var(--c-surface-hi);font-size:var(--fs-12);color:var(--c-text);font-family:var(--font-mono);cursor:pointer}.tb-res:hover,.sel-input:hover{border-color:var(--c-border-hi)}.tb-sep{width:1px;height:18px;background:var(--c-border);margin:0 var(--sp-2)}.tb-zoom-label{font-family:var(--font-mono);font-size:var(--fs-11);color:var(--c-text-dim);background:transparent;height:28px;padding:0 var(--sp-2);border-radius:var(--r-2);text-transform:uppercase;letter-spacing:.06em}.tb-zoom-label:hover{color:var(--c-text);background:var(--c-surface-hi)}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--r-2);color:var(--c-text-dim);transition:background var(--dur-1) var(--ease-out),color var(--dur-1) var(--ease-out)}.btn-icon:hover:not(:disabled){background:var(--c-surface-hi);color:var(--c-text)}.btn-icon.flash{background:var(--c-accent-dim);color:var(--c-accent)}.btn{height:28px;padding:0 var(--sp-3);border-radius:var(--r-2);color:var(--c-text);font-size:var(--fs-12)}.btn:hover{background:var(--c-surface-hi)}.ll-head{height:36px;padding:0 var(--sp-3);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--c-border)}.ll-head-title{font-family:var(--font-mono);font-size:var(--fs-11);color:var(--c-text-dim);letter-spacing:.08em;text-transform:uppercase}.ll-list{flex:1;overflow-y:auto;padding:var(--sp-2);display:flex;flex-direction:column;gap:2px}.ll-empty{padding:var(--sp-6) var(--sp-3);color:var(--c-text-dim);font-size:var(--fs-12);text-align:center;display:flex;flex-direction:column;gap:var(--sp-2);align-items:stretch}.ll-empty-icon{font-family:var(--font-mono);color:var(--c-accent);font-size:14px;letter-spacing:-1px;margin-bottom:var(--sp-2)}.ll-empty-title{font-size:var(--fs-13);color:var(--c-text);font-weight:500}.ll-empty-hint{font-size:var(--fs-11);color:var(--c-text-faint);margin-bottom:var(--sp-3);line-height:1.5}.ll-empty-btn{width:100%;height:30px;border:1px solid var(--c-border-hi);background:var(--c-surface-hi);border-radius:var(--r-2);font-size:var(--fs-12);text-align:center}.ll-empty-btn.primary{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}.ll-empty-btn.primary:hover{background:var(--c-accent-hi)}.ll-empty-btn:not(.primary):hover{background:var(--c-bg)}.ll-item{display:grid;grid-template-columns:14px 22px 22px 36px 1fr 22px;align-items:center;gap:var(--sp-2);padding:var(--sp-2);border-radius:var(--r-2);border:1px solid transparent;background:var(--c-surface);cursor:pointer;transition:background var(--dur-1) var(--ease-out),border-color var(--dur-1) var(--ease-out),opacity var(--dur-2) var(--ease-out)}.ll-item:hover{background:var(--c-surface-hi)}.ll-item.selected{border-color:var(--c-accent);background:var(--c-surface-hi)}.ll-item.off .ll-title,.ll-item.off .ll-thumb,.ll-item.dimmed{opacity:.4}.ll-item.soloed{border-color:var(--c-warn)}.ll-item.dragging{opacity:.5}.ll-item.drag-over{border-color:var(--c-accent)}.ll-handle{color:var(--c-text-faint);display:inline-flex;cursor:grab}.ll-handle:active{cursor:grabbing}.ll-eye,.ll-trash,.ll-solo{width:22px;height:22px;border-radius:var(--r-1);font-size:10px;font-family:var(--font-mono)}.ll-solo{border:1px solid var(--c-border);color:var(--c-text-faint);letter-spacing:0}.ll-solo:hover{color:var(--c-text);border-color:var(--c-border-hi)}.ll-solo.on{background:var(--c-warn);color:#0a0a0a;border-color:var(--c-warn)}.ll-thumb{width:36px;height:36px;border-radius:var(--r-2);background:var(--c-bg);border:1px solid var(--c-border);overflow:hidden;display:grid;place-items:center}.ll-thumb img{width:100%;height:100%;image-rendering:pixelated;display:block;object-fit:cover}.ll-trash{opacity:0;transition:opacity var(--dur-1) var(--ease-out)}.ll-item:hover .ll-trash{opacity:.6}.ll-trash:hover{opacity:1!important;color:var(--c-err)}.ll-title{display:flex;flex-direction:column;gap:1px;min-width:0}.ll-kind{font-size:var(--fs-12);color:var(--c-text);font-weight:500}.ll-meta{font-size:var(--fs-10);color:var(--c-text-dim);font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ll-add{width:28px;height:28px}.ins,.ins-empty{padding:var(--sp-3)}.ins-head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-1) 0 var(--sp-3);border-bottom:1px solid var(--c-border);margin-bottom:var(--sp-3)}.ins-head-title{display:flex;flex-direction:column;gap:2px}.ins-kind{font-size:var(--fs-13);font-weight:600}.ins-cat{font-size:var(--fs-10);color:var(--c-text-dim);font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase}.ins-empty{text-align:center;margin-top:var(--sp-12);color:var(--c-text-dim)}.ins-empty-title{font-size:var(--fs-13);margin-bottom:var(--sp-2)}.ins-empty-hint{font-size:var(--fs-11);color:var(--c-text-faint)}.ins-sec{margin-bottom:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-3)}.ins-sec-title{font-family:var(--font-mono);font-size:var(--fs-10);color:var(--c-text-dim);letter-spacing:.08em;text-transform:uppercase;padding-bottom:2px;border-bottom:1px dashed var(--c-border)}.ins-id{color:var(--c-text-faint);font-size:var(--fs-10);text-align:right}.sl,.sel,.co,.tg,.sd{display:flex;flex-direction:column;gap:4px}.sl-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2)}.sl-label{font-size:var(--fs-12);color:var(--c-text-dim)}.sl-val{font-family:var(--font-mono);font-size:var(--fs-11);color:var(--c-text)}.sl-bar{position:relative;height:4px;background:var(--c-border);border-radius:999px;cursor:ew-resize}.sl-bar:hover{background:var(--c-border-hi)}.sl-fill{position:absolute;top:0;left:0;height:100%;background:var(--c-accent);border-radius:999px;pointer-events:none}.sl:focus-visible .sl-bar{outline:2px solid var(--c-accent);outline-offset:2px}.co-row{display:flex;align-items:center;gap:var(--sp-2);position:relative}.co-swatch{width:100%;height:24px;border-radius:var(--r-2);border:1px solid var(--c-border);pointer-events:none}.co-input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.tg{flex-direction:row;align-items:center;justify-content:space-between}.tg-track{width:28px;height:16px;background:var(--c-border);border-radius:999px;position:relative;transition:background var(--dur-2) var(--ease-out);cursor:pointer}.tg-track.on{background:var(--c-accent)}.tg-dot{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--c-text);transition:transform var(--dur-2) var(--ease-out)}.tg-track.on .tg-dot{transform:translate(12px)}.sd-row{display:flex;align-items:center;gap:var(--sp-2)}.sd-input{flex:1;height:28px;padding:0 var(--sp-2);border:1px solid var(--c-border);border-radius:var(--r-2);background:var(--c-surface-hi);font-size:var(--fs-12);color:var(--c-text)}.sd-input:focus{border-color:var(--c-accent)}.vp-stage{position:absolute;inset:0;display:grid;place-items:center;background-image:linear-gradient(45deg,var(--c-checker-a) 25%,transparent 25%),linear-gradient(-45deg,var(--c-checker-a) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--c-checker-a) 75%),linear-gradient(-45deg,transparent 75%,var(--c-checker-a) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;background-color:var(--c-checker-b);cursor:default;overflow:hidden}.vp-stage.panning{cursor:grab}.vp-canvas{box-shadow:var(--sh-2);border:1px solid var(--c-border);background:transparent;transition:transform 0s}body.drop-target #viewport-stage:after{content:"Drop image to import";position:absolute;inset:8px;border:2px dashed var(--c-accent);border-radius:var(--r-3);display:grid;place-items:center;color:var(--c-accent);font-family:var(--font-mono);font-size:var(--fs-12);letter-spacing:.06em;text-transform:uppercase;pointer-events:none;background:var(--c-accent-dim);z-index:var(--z-overlay)}.region-bottom{display:flex;align-items:center;gap:var(--sp-3);padding:0 var(--sp-3)}.bs-play{width:26px;height:26px}.bs-frame{font-size:var(--fs-10);color:var(--c-text-dim);min-width:36px}.bs-cursor{font-size:var(--fs-10);color:var(--c-text);flex:1;text-align:center;letter-spacing:.04em}.bs-stats{font-size:var(--fs-10);color:var(--c-text-dim);letter-spacing:.02em;margin-left:auto;text-align:right}.modal-backdrop{position:fixed;inset:0;background:#0009;z-index:var(--z-modal);display:grid;place-items:center;padding:var(--sp-4)}.modal{background:var(--c-surface);border:1px solid var(--c-border-hi);border-radius:var(--r-4);box-shadow:var(--sh-3);display:flex;flex-direction:column;max-width:90vw;max-height:90vh;overflow:hidden}.modal-presets{width:760px}.modal-dsl{width:640px;height:70vh}.modal-export{width:460px}.modal-cheats{width:480px}.cheats-grid{display:grid;grid-template-columns:120px 1fr;gap:var(--sp-2) var(--sp-3);padding:var(--sp-4);font-size:var(--fs-12)}.cheat-key{color:var(--c-accent);text-align:right;font-size:var(--fs-11)}.cheat-desc{color:var(--c-text)}.modal-btn-primary{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}.modal-btn-primary:hover{background:var(--c-accent-hi)}.modal-head{padding:var(--sp-4) var(--sp-4) var(--sp-3);border-bottom:1px solid var(--c-border)}.modal-title{font-size:var(--fs-16);font-weight:600;margin-bottom:var(--sp-1)}.modal-subtitle{font-size:var(--fs-11);color:var(--c-text-dim)}.modal-actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--c-border)}.modal-btn{height:32px;padding:0 var(--sp-4);border:1px solid var(--c-border-hi);border-radius:var(--r-2);background:var(--c-surface-hi)}.modal-btn:hover{background:var(--c-bg)}.modal-flash{font-size:var(--fs-11);color:var(--c-accent);padding:0 var(--sp-2)}.preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--sp-3);padding:var(--sp-4);overflow-y:auto}.preset-card{display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-2);border-radius:var(--r-3);border:1px solid var(--c-border);background:var(--c-surface);cursor:pointer;text-align:left;transition:transform var(--dur-2) var(--ease-out),border-color var(--dur-1) var(--ease-out)}.preset-card:hover{border-color:var(--c-accent);transform:translateY(-2px)}.preset-thumb{width:100%;height:auto;aspect-ratio:1 / 1;border-radius:var(--r-2);background:var(--c-bg);image-rendering:pixelated}.preset-meta{display:flex;flex-direction:column;gap:2px;padding:0 var(--sp-1)}.preset-name{font-size:var(--fs-12);color:var(--c-text);font-weight:500}.preset-tags{font-size:var(--fs-10);color:var(--c-text-dim);text-transform:uppercase;letter-spacing:.04em}.dsl-text{flex:1;width:100%;border:none;background:var(--c-bg);padding:var(--sp-3) var(--sp-4);resize:none;font-size:var(--fs-12);line-height:1.5;color:var(--c-text);outline:none;white-space:pre;overflow:auto}.dsl-text:focus{background:var(--c-bg)}.dsl-error{font-size:var(--fs-11);color:var(--c-err);padding:var(--sp-2) var(--sp-4);border-top:1px solid var(--c-border);display:none}.dsl-error.show{display:block}.export-tabs{display:flex;gap:var(--sp-1);padding:var(--sp-3) var(--sp-4) 0}.export-tab{padding:var(--sp-2) var(--sp-3);border-radius:var(--r-2) var(--r-2) 0 0;font-size:var(--fs-12);color:var(--c-text-dim);border-bottom:2px solid transparent}.export-tab:hover:not(:disabled){color:var(--c-text);background:var(--c-surface-hi)}.export-tab.active{color:var(--c-text);border-bottom-color:var(--c-accent)}.export-anim{padding:var(--sp-3) var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-3);border-top:1px solid var(--c-border);margin-top:var(--sp-2)}.export-field{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}.export-field .sd-input{width:100px}.export-status{flex:1;font-size:var(--fs-11);color:var(--c-text-dim);text-align:left}.export-summary{font-size:var(--fs-11);color:var(--c-text-faint);text-align:right;letter-spacing:.02em}.menu{position:fixed;z-index:var(--z-overlay);background:var(--c-surface-hi);border:1px solid var(--c-border-hi);border-radius:var(--r-3);box-shadow:var(--sh-3);padding:var(--sp-1);min-width:180px;display:flex;flex-direction:column;gap:1px}.menu-section{padding:var(--sp-2) var(--sp-3) var(--sp-1);font-family:var(--font-mono);font-size:var(--fs-10);color:var(--c-text-dim);letter-spacing:.08em;text-transform:uppercase}.menu-item{text-align:left;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-2);font-size:var(--fs-12);color:var(--c-text)}.menu-item:hover{background:var(--c-accent-dim);color:var(--c-accent)}.menu-item{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3)}.menu-item-label{color:inherit}.menu-item-hint{font-size:var(--fs-10);color:var(--c-text-faint);letter-spacing:.04em;text-transform:uppercase}.menu-item-combo .menu-item-label{font-weight:500}.menu-item-combo .menu-item-hint{color:var(--c-text-dim)}body.studio .region-top,body.studio .region-left,body.studio .region-right,body.studio .region-bottom{display:none}body.studio #app{grid-template-rows:1fr;grid-template-columns:1fr;grid-template-areas:"center"}body.studio .region-center{background:#000}body.studio .vp-stage{background:#000;background-image:none;display:block}body.studio .vp-canvas{position:absolute!important;top:0!important;left:0!important;width:100%!important;height:100%!important;border:none!important;box-shadow:none!important;transform:none!important;image-rendering:pixelated}.st-panel{position:fixed;inset:0;pointer-events:none;z-index:var(--z-modal);color:#ededed;font-family:var(--font-sans)}.st-sidebar-host>*{pointer-events:auto}.st-side{position:fixed;top:12px;right:12px;bottom:12px;width:320px;background:#121214f0;-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);border:1px solid rgba(255,255,255,.08);border-radius:12px;box-shadow:0 16px 48px #00000080;display:flex;flex-direction:column;overflow:hidden}.st-side-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.06)}.st-side-brand{display:flex;align-items:center;gap:8px}.st-side-dot{width:8px;height:8px;border-radius:2px;background:var(--c-accent)}.st-side-title{font-size:var(--fs-12);letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:#fff}.st-side-actions{display:flex;gap:4px}.st-side-iconbtn{width:28px;height:28px;border-radius:6px;background:#ffffff0f;border:1px solid rgba(255,255,255,.08);color:#edededcc;font-size:14px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.st-side-iconbtn:hover{background:#ffffff1f;color:#fff}.st-side-close:hover{background:#ef444480;border-color:#ef4444b3;color:#fff}.st-side-scroll{flex:1;overflow-y:auto;padding:4px 0}.st-sec{padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.04)}.st-sec:last-child{border-bottom:none}.st-sec-head{font-size:var(--fs-10);letter-spacing:.1em;text-transform:uppercase;color:#ededed73;margin-bottom:10px;font-family:var(--font-mono)}.st-sec-body{display:flex;flex-direction:column;gap:10px}.st-shape-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.st-shape-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px 0;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:#ffffff08;color:#edededa6;cursor:pointer;transition:background var(--dur-1) var(--ease-out),color var(--dur-1) var(--ease-out),border-color var(--dur-1) var(--ease-out)}.st-shape-btn:hover{background:#ffffff12;color:#fff}.st-shape-btn.active{background:#ff5a1f2e;border-color:var(--c-accent);color:#fff}.st-shape-glyph{display:block;line-height:0}.st-shape-name{font-size:10px;letter-spacing:.04em}.st-swatch-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;max-height:220px;overflow-y:auto;padding-right:4px}.st-side-swatch{height:28px;border:1px solid rgba(255,255,255,.1);border-radius:6px;cursor:pointer;transition:transform var(--dur-1) var(--ease-out),border-color var(--dur-1) var(--ease-out),box-shadow var(--dur-1) var(--ease-out)}.st-side-swatch:hover{transform:translateY(-2px);border-color:#fff6}.st-side-swatch.active{border-color:var(--c-accent);box-shadow:0 0 0 2px #ff5a1f66}.st-mini-label{font-size:10px;color:#ededed73;margin-top:6px;letter-spacing:.02em}.st-stops-host{padding:4px 0 2px}.st-adjust-host,.st-style-host{display:flex;flex-direction:column;gap:12px}.st-toggle-row{display:flex;flex-direction:column;gap:8px;margin-top:4px;padding-top:10px;border-top:1px dashed rgba(255,255,255,.06)}.st-side .sl-label,.st-side .sl-val{color:#edededd9;font-size:var(--fs-11)}.st-side .sl-bar{background:#ffffff1f}.st-side .sl-fill{background:var(--c-accent)}.st-side .tg .sl-label{color:#edededd9}.st-side .tg-track{background:#ffffff2e}.st-side .tg-track.on{background:var(--c-accent)}.st-side .tg-dot{background:#fff}.st-side .co-swatch{border-color:#ffffff1f}.st-motion-host{display:flex;flex-direction:column;gap:8px}.st-motion-play{margin-top:4px;height:30px;padding:0 12px;background:#ff5a1f26;border:1px solid rgba(255,90,31,.35);border-radius:6px;color:var(--c-accent);font-size:var(--fs-12);font-weight:600;letter-spacing:.04em;cursor:pointer;transition:background var(--dur-1) var(--ease-out)}.st-motion-play:hover{background:#ff5a1f47}.st-side-foot{display:flex;align-items:stretch;height:36px;border-top:1px solid rgba(255,255,255,.08);flex-shrink:0}.st-dsl{flex:1;min-width:0;background:transparent;border:none;color:#ededed99;font-size:10px;padding:0 12px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:copy;letter-spacing:.02em}.st-dsl:hover{color:#fff}.st-dsl:before{content:"DSL";color:var(--c-accent);margin-right:8px;font-weight:600;letter-spacing:.08em}.st-dsl.flash{color:var(--c-accent)}.st-foot-btn{padding:0 14px;background:transparent;border:none;border-left:1px solid rgba(255,255,255,.08);color:#ededed;font-size:var(--fs-11);cursor:pointer}.st-foot-btn:hover{background:#ff5a1f2e;color:var(--c-accent)}.st-drag-tag{position:fixed;background:#ff5a1ff2;color:#fff;font-size:10px;padding:4px 8px;border-radius:4px;pointer-events:none;opacity:0;transition:opacity .1s var(--ease-out);z-index:var(--z-toast);box-shadow:0 4px 16px #0006;letter-spacing:.04em;white-space:nowrap}.st-drag-tag.show{opacity:1}.st-canvas-grab{cursor:grab}.st-canvas-grab:active{cursor:grabbing}.st-hint{position:fixed;bottom:24px;left:50%;transform:translate(-50%) translateY(8px);background:#141414d9;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#ededed;padding:8px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.1);font-size:var(--fs-11);letter-spacing:.06em;text-transform:uppercase;pointer-events:none;opacity:0;transition:opacity .2s var(--ease-out),transform .2s var(--ease-out);z-index:var(--z-toast)}.st-hint.show{opacity:1;transform:translate(-50%) translateY(0)}.btn-icon.on{background:var(--c-accent);color:#fff}.btn-icon.on:hover{background:var(--c-accent-hi);color:#fff}.stops-bar{position:relative;height:36px;margin-top:8px}.stops-ramp{position:absolute;inset:0;border-radius:6px;border:1px solid rgba(255,255,255,.1);cursor:copy}.stops-handles{position:absolute;inset:0;pointer-events:none}.stop-handle{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0006,0 2px 8px #00000080;transform:translate(-50%,-50%);cursor:grab;pointer-events:auto;z-index:1}.stop-handle:active{cursor:grabbing}.stop-color{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}body.zen .region-top,body.zen .region-left,body.zen .region-right,body.zen .region-bottom{display:none}body.zen #app{grid-template-rows:1fr;grid-template-columns:1fr;grid-template-areas:"center"}.zen-hint{position:fixed;top:16px;left:50%;transform:translate(-50%) translateY(-12px);background:var(--c-surface-hi);color:var(--c-text);padding:6px 12px;border-radius:999px;border:1px solid var(--c-border-hi);font-size:var(--fs-11);letter-spacing:.06em;text-transform:uppercase;pointer-events:none;opacity:0;transition:opacity .2s var(--ease-out),transform .2s var(--ease-out);z-index:var(--z-toast);box-shadow:var(--sh-2)}.zen-hint.show{opacity:1;transform:translate(-50%) translateY(0)}.modal-effects{width:720px;display:grid;grid-template-rows:auto 1fr auto}.eff-stage{display:grid;place-items:center;padding:var(--sp-4);background:linear-gradient(45deg,var(--c-checker-a) 25%,transparent 25%),linear-gradient(-45deg,var(--c-checker-a) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--c-checker-a) 75%),linear-gradient(-45deg,transparent 75%,var(--c-checker-a) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;background-color:var(--c-checker-b);min-height:320px}.eff-canvas{border:1px solid var(--c-border-hi);box-shadow:var(--sh-2);image-rendering:pixelated}.eff-meta{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--c-border);font-family:var(--font-mono);font-size:var(--fs-12)}.eff-name{color:var(--c-text);font-weight:500}.eff-tags{color:var(--c-text-dim)}.eff-counter{color:var(--c-text-dim);font-size:var(--fs-11);letter-spacing:.04em}.eff-actions{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--c-border);gap:var(--sp-2)}.eff-actions .btn{height:32px;padding:0 var(--sp-3);border:1px solid var(--c-border-hi);border-radius:var(--r-2);background:var(--c-surface-hi)}.eff-actions .btn:hover{background:var(--c-bg)}.eff-actions .btn.primary{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}.eff-actions .btn.primary:hover{background:var(--c-accent-hi)}