:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--surface-app:#0f0c1c;--surface-panel:#171429;--surface-raised:#211d3b;--surface-hover:#2b2650;--surface-sunken:#0f0c1c;--surface-overlay:#0a0814db;--line:#2c2749;--line-strong:#4b4378;--line-field:#7469b3;--text:#f7f3ff;--text-dim:#bdb4dc;--text-faint:#7d74a3;--text-on-accent:var(--ink);--accent:var(--pink);--accent-hi:#ffc6ee;--accent-2:var(--sky);--accent-3:var(--lilac);--accent-soft:#ff9fe024;--focus:var(--sky);--warn:var(--butter);--danger:var(--coral);--success:var(--mint);--patreon:var(--coral);--icon:var(--lilac);--line-hover:var(--lilac);--track:var(--line-field);--accent-line:color-mix(in srgb, var(--accent) 50%, transparent);--font-brand:var(--font-mono);--brand-weight:800;--brand-case:uppercase;--brand-tracking:.04em;--shadow-lift:var(--hard-lift);--shadow-focus:3px 3px 0 var(--focus);--split-text:-1.5px 0 0 var(--chroma-a), 1.5px 0 0 var(--chroma-b);--shadow-thumb:2px 2px 0 var(--shadow-c);--split-select:-3px 0 0 var(--chroma-a), 3px 0 0 var(--chroma-b);--modal-ring:8px 8px 0 var(--lilac), -3px 0 0 var(--chroma-a);--shadow-panel:6px 6px 0 var(--shadow-c);--shadow-stage:0 0 0 2px var(--ink), 0 0 0 3px var(--line-strong);--font-ui:system-ui, -apple-system, "Segoe UI", sans-serif;--font-display:var(--font-mono);--font-mono:ui-monospace, "SF Mono", Menlo, monospace;--text-2xs:11px;--text-xs:12px;--text-sm:13px;--text-md:15px;--text-lg:18px;--text-xl:24px;--text-2xl:32px;--leading:1.4;--tracking-caps:.12em;--space-1:2px;--space-2:4px;--space-3:6px;--space-4:8px;--space-5:12px;--space-6:16px;--space-7:20px;--space-8:24px;--space-9:32px;--border-w:2px;--control-h:30px;--control-h-sm:24px;--ease-out:cubic-bezier(.2, .8, .2, 1);--dur-fast:.12s;--dur-med:.2s;--z-menu:20;--z-modal:50;--z-drop:60;--pink:#ff9fe0;--sky:#9cecff;--lilac:#c7b3ff;--butter:#ffe28a;--mint:#a8f0c6;--coral:#ffa38f;--ink:#110e1f;--chroma-a:var(--sky);--chroma-b:var(--pink);--shadow-c:#6a5fb0;--hard:3px 3px 0 var(--shadow-c);--hard-lift:5px 5px 0 var(--shadow-c);--mark-ab-a:var(--chroma-a);--mark-ab-b:var(--chroma-b)}@media (prefers-reduced-motion:reduce){:root{--dur-fast:0s;--dur-med:0s}}*,:before,:after{box-sizing:border-box}:root{font:var(--text-sm) / var(--leading) var(--font-ui);color:var(--text);background:var(--surface-app);-webkit-font-smoothing:antialiased}body{margin:0;overflow:hidden}h1,h2,h3,h4{margin:0;font-weight:600}h3{font-size:var(--text-lg)}h4{font-size:var(--text-2xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--text-dim)}p{margin:0}a{color:var(--accent-hi);text-decoration:none}a:hover{text-decoration:underline}button,select,input,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}::selection{background:var(--accent-soft)}*{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}button,.btn{justify-content:center;align-items:center;gap:var(--space-3);min-height:var(--control-h);padding:0 var(--space-5);background:var(--surface-raised);color:var(--text);border:var(--border-w) solid var(--line-strong);cursor:pointer;white-space:nowrap;transition:border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);text-decoration:none;display:inline-flex}button:hover:not(:disabled),.btn:hover{border-color:var(--accent);background:var(--surface-hover);text-decoration:none}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.4;cursor:default}button.primary,.btn.primary{background:var(--accent);color:var(--text-on-accent);border-color:#0000;font-weight:700}button.primary:hover:not(:disabled),.btn.primary:hover{background:var(--accent);box-shadow:var(--shadow-lift)}button.ghost,.btn.ghost{color:var(--text-dim);background:0 0;border-color:#0000}button.ghost:hover:not(:disabled),.btn.ghost:hover{background:var(--surface-hover);color:var(--text);border-color:#0000}button.icon,.btn.icon{width:var(--control-h);padding:0}button.sm,.btn.sm{min-height:var(--control-h-sm);padding:0 var(--space-4);font-size:var(--text-xs)}button.icon.sm,.btn.icon.sm{width:var(--control-h-sm);padding:0}.btn.patreon,button.patreon{background:var(--patreon);color:var(--text-on-accent);border-color:#0000;font-weight:700}.btn.patreon:hover,button.patreon:hover:not(:disabled){background:var(--patreon);box-shadow:var(--shadow-lift)}input:not([type]),input[type=text],input[type=number],input[type=url],input[type=email],input[type=password],input[type=search],select,textarea{min-height:var(--control-h-sm);padding:var(--space-2) var(--space-3);background:var(--surface-sunken);border:var(--border-w) solid var(--line-field);min-width:0;transition:border-color var(--dur-fast) var(--ease-out)}input:not([type]):hover,input[type=number]:hover,input[type=email]:hover,input[type=password]:hover,select:hover,textarea:hover{border-color:var(--line-hover)}input:not([type]):focus,input[type=number]:focus,input[type=email]:focus,input[type=password]:focus,select:focus,textarea:focus{border-color:var(--focus);box-shadow:var(--shadow-focus);outline:none}textarea{resize:vertical;width:100%}select{cursor:pointer}input[type=checkbox]{accent-color:var(--accent);cursor:pointer;width:15px;height:15px;margin:0}input[type=color]{width:32px;height:var(--control-h-sm);cursor:pointer;background:var(--surface-sunken);border:var(--border-w) solid var(--line-field);padding:2px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none}input[type=range]{appearance:none;cursor:pointer;background:0 0;flex:1;min-width:0;height:18px;margin:0}input[type=range]::-webkit-slider-runnable-track{border:2px solid var(--ink);background:var(--track);height:6px}input[type=range]::-moz-range-track{background:var(--track);height:4px}input[type=range]::-moz-range-progress{background:var(--accent);height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);border:2px solid var(--ink);width:14px;height:18px;box-shadow:var(--shadow-thumb);margin-top:-8px}input[type=range]::-moz-range-thumb{background:var(--accent);border:2px solid var(--ink);width:10px;height:14px;box-shadow:var(--shadow-thumb);border-radius:0}input[type=range]:focus-visible{outline:none}input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:var(--shadow-focus);border-color:var(--focus)}input[type=range]:disabled{opacity:.4;cursor:default}.row{align-items:center;gap:var(--space-4);display:flex}.row-label{width:92px;color:var(--text-dim);flex:none}.row-control{align-items:center;gap:var(--space-3);flex:1;min-width:0;display:flex}.row-control select,.row-control input:not([type]),.row-control input[type=number]{flex:1;width:0}.value{text-align:right;width:44px;color:var(--text-dim);font-variant-numeric:tabular-nums}.hex{font-family:var(--font-mono);font-size:var(--text-xs);flex:none!important;width:76px!important}.tabs{gap:var(--space-1);padding:var(--space-1);background:var(--surface-sunken);border:var(--border-w) solid var(--line);display:flex}.tabs button{min-height:var(--control-h-sm);color:var(--text-dim);background:0 0;border:none}.tabs button:hover:not(:disabled){background:var(--surface-hover);color:var(--text)}.tabs button.active{background:var(--surface-raised);color:var(--text);box-shadow:inset 0 -2px 0 var(--accent)}.menu{position:relative}.menu summary{cursor:pointer;min-height:var(--control-h);padding:0 var(--space-5);background:var(--surface-raised);border:var(--border-w) solid var(--line-strong);align-items:center;list-style:none;display:flex}.menu summary::-webkit-details-marker{display:none}.menu summary:hover,.menu[open] summary{border-color:var(--accent)}.menu[open]>div{right:0;top:calc(100% + var(--space-2));z-index:var(--z-menu);gap:var(--space-1);min-width:200px;padding:var(--space-3);background:var(--surface-raised);border:var(--border-w) solid var(--line-strong);box-shadow:var(--shadow-panel);flex-direction:column;display:flex;position:absolute}.menu[open]>div button{background:0 0;border-color:#0000;justify-content:flex-start}.menu[open]>div button:hover{background:var(--surface-hover)}dialog.modal-back{width:100%;max-width:none;height:100%;max-height:none;color:inherit;background:var(--surface-overlay);border:0;margin:0;padding:0;position:fixed;inset:0}dialog.modal-back[open]{justify-content:center;align-items:center;display:flex}dialog.modal-back::backdrop{background:0 0}.modal{scrollbar-gutter:stable;gap:var(--space-5);width:480px;max-height:calc(100vh - 40px);padding:var(--space-7);background:var(--surface-panel);border:var(--border-w) solid var(--line-strong);box-shadow:var(--shadow-panel), var(--modal-ring);display:grid;overflow-y:auto}.modal h3{margin-bottom:var(--space-2)}.progress{gap:var(--space-3);display:grid}.progress .bar{background:var(--surface-sunken);border:1px solid var(--line);height:8px;overflow:hidden}.progress .bar div{background:var(--accent);height:100%;box-shadow:var(--shadow-lift);transition:width var(--dur-med) var(--ease-out)}.hint{color:var(--text-dim);font-size:var(--text-xs);margin:0}.warn{color:var(--warn)}.eyebrow{font-size:var(--text-2xs);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--accent-2)}.buttons{gap:var(--space-3);flex-wrap:wrap;display:flex}.buttons.end{margin-top:var(--space-4);justify-content:flex-end}.grid2{gap:var(--space-3) var(--space-5);grid-template-columns:1fr 1fr;display:grid}.grid2 .row-label{width:14px}.brand{align-items:center;gap:var(--space-4);color:var(--text);text-decoration:none;display:inline-flex}.brand:hover{text-decoration:none}.brand-mark{flex:none;display:block}.brand-name{font-family:var(--font-brand);font-weight:var(--brand-weight);font-size:var(--text-md);letter-spacing:var(--brand-tracking);text-transform:var(--brand-case)}.social-links{align-items:center;gap:var(--space-1);display:flex}.social-links a{width:var(--control-h);height:var(--control-h);color:var(--text-dim);transition:color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);justify-content:center;align-items:center;display:inline-flex}.social-links a:hover{color:var(--text);background:var(--surface-hover)}.social-links svg{fill:currentColor;width:16px;height:16px}.legal-links{gap:var(--space-2) var(--space-5);font-size:var(--text-xs);flex-wrap:wrap;display:flex}.icon-svg{flex:none;display:block}.unset{outline:1px dashed var(--warn);outline-offset:-1px}.form{gap:var(--space-5);display:grid}.field{gap:var(--space-2);color:var(--text-dim);font-size:var(--text-xs);display:grid}.field input,.field select{font-size:var(--text-sm);color:var(--text);min-height:var(--control-h)}.field>.hint{font-size:var(--text-xs)}.check{align-items:center;gap:var(--space-3);display:flex}button.danger,.btn.danger{color:var(--danger)}button.danger:hover:not(:disabled){border-color:var(--danger)}.toast{left:50%;bottom:var(--space-8);z-index:var(--z-drop);padding:var(--space-4) var(--space-6);cursor:pointer;background:var(--surface-raised);border:var(--border-w) solid var(--accent);box-shadow:var(--shadow-panel);position:fixed;transform:translate(-50%)}.app{grid-template:"head head head"52px"layers main inspector"minmax(0,1fr)/256px minmax(0,1fr) 304px;height:100dvh;display:grid}header{align-items:center;gap:var(--space-4);padding:0 var(--space-5);background:var(--surface-panel);border-bottom:2px solid var(--ink);grid-area:head;min-width:0;display:flex;position:relative}header .brand-button{margin-right:var(--space-2)}.project-field{align-items:center;display:flex;position:relative}.project-field .pencil{left:var(--space-4);color:var(--text-dim);pointer-events:none;position:absolute}.project-name{width:180px;min-width:0;font-weight:600;min-height:var(--control-h)!important;padding-left:26px!important}header .history{color:var(--text)}.spacer{flex:1}.divider{width:1px;margin:var(--space-5) var(--space-2);background:var(--line);align-self:stretch}aside{background:var(--surface-panel);overflow-y:auto}.layers{border-right:1px solid var(--line);padding:var(--space-5);grid-area:layers}.inspector{border-left:1px solid var(--line);padding:var(--space-5) var(--space-6);grid-area:inspector}.inspector.empty{color:var(--text-dim)}.panel-head{margin:var(--space-2) 0 var(--space-4);justify-content:space-between;align-items:center;display:flex}.add-menu{gap:var(--space-1);margin-bottom:var(--space-5);padding:var(--space-2);background:var(--surface-sunken);border:1px solid var(--line);display:grid}.add-menu button{justify-content:flex-start;gap:var(--space-4);background:0 0;border-color:#0000}.add-menu button:hover:not(:disabled){background:var(--surface-hover)}.ico{width:18px;color:var(--icon);flex:none;justify-content:center;display:inline-flex}.layer-list,.asset-list{margin:0 0 var(--space-6);padding:0;list-style:none}.layer-list li{align-items:center;gap:var(--space-2);padding:0 var(--space-2);border:1px solid #0000;display:flex}.layer-list .layer-pick{justify-content:flex-start;gap:var(--space-3);min-width:0;min-height:var(--control-h);padding:0 var(--space-2);color:inherit;text-align:left;background:0 0;border:none;flex:1;font-weight:400}.layer-list .layer-pick:hover:not(:disabled){background:0 0}.layer-list li:hover{background:var(--surface-raised)}.layer-list li.selected{background:var(--accent-soft);border-color:var(--accent-line)}.layer-list li.selected .ico{color:var(--accent-hi)}.layer-list .name,.asset-list .name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.layer-list .eye,.layer-list .actions button,.asset-list button{min-width:24px;min-height:24px;color:var(--text-dim);background:0 0;border:none;padding:0}.layer-list .actions button{min-width:20px}.layer-list .eye[aria-pressed=false]{color:var(--text-faint)}.layer-list .eye:hover,.layer-list .actions button:hover:not(:disabled),.asset-list button:hover:not(:disabled){color:var(--text);background:0 0}.layer-list .actions{display:none}.layer-list li:hover .actions,.layer-list li:focus-within .actions,.layer-list li.selected .actions{display:flex}.asset-list li{align-items:center;gap:var(--space-3);padding:var(--space-1) var(--space-2);display:flex}.asset-list img{object-fit:contain;background:var(--surface-raised);width:18px;height:18px}main{flex-direction:column;grid-area:main;min-width:0;min-height:0;display:flex}.stage-wrap{padding:var(--space-7);background:var(--surface-app);flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.stage{box-shadow:var(--shadow-stage);touch-action:none;position:relative}.stage canvas{background:#000;display:block}.selection{outline:2px solid var(--accent-2);cursor:move;position:absolute}.handle{background:var(--text);border:2px solid var(--text-on-accent);width:10px;height:10px;margin:-5px;position:absolute}.handle.nw{cursor:nwse-resize;top:0;left:0}.handle.se{cursor:nwse-resize;top:100%;left:100%}.handle.ne{cursor:nesw-resize;top:0;left:100%}.handle.sw{cursor:nesw-resize;top:100%;left:0}.handle.n{cursor:ns-resize;top:0;left:50%}.handle.s{cursor:ns-resize;top:100%;left:50%}.handle.e{cursor:ew-resize;top:50%;left:100%}.handle.w{cursor:ew-resize;top:50%;left:0}.guide{background:var(--accent);pointer-events:none;position:absolute}.guide.v{width:1px;top:0;bottom:0}.guide.h{height:1px;left:0;right:0}.transport{align-items:center;gap:var(--space-5);padding:var(--space-5) var(--space-6);background:var(--surface-panel);border-top:1px solid var(--line);display:flex}.transport .play{background:var(--text);width:40px;height:40px;color:var(--text-on-accent);border-color:var(--text-on-accent);padding:0}.transport .play:hover:not(:disabled){background:var(--text);border-color:var(--text-on-accent)}.transport .add-song-hint{flex:1;min-width:0}@media (width<=600px){.transport .add-song-hint{display:none}}.scrub{flex:1;align-items:center;min-width:0;height:32px;display:flex;position:relative}.scrub canvas{pointer-events:none;width:calc(100% - 14px);height:100%;position:absolute;top:0;left:7px}.scrub input[type=range]{width:100%;height:32px;position:relative}.scrub.has-wave input[type=range]::-webkit-slider-runnable-track{background:0 0;border-color:#0000}.scrub.has-wave input[type=range]::-moz-range-track{background:0 0}.scrub.has-wave input[type=range]::-moz-range-progress{background:0 0}.scrub.has-wave input[type=range]::-webkit-slider-thumb{background:var(--text);width:6px;height:32px;box-shadow:none;margin-top:-15px}.scrub.has-wave input[type=range]::-moz-range-thumb{background:var(--text);width:2px;height:28px;box-shadow:none}.time{min-width:36px;color:var(--text-dim);font-variant-numeric:tabular-nums;font-family:var(--font-mono);font-size:var(--text-xs)}.loop{align-items:center;gap:var(--space-2);color:var(--text-dim);display:flex}.layer-name{width:100%;margin-bottom:var(--space-4);font-size:var(--text-md);font-weight:600}.inspector section{gap:var(--space-4);padding:var(--space-5) 0;border-top:1px solid var(--line);display:grid}.preset-picker{gap:var(--space-3);display:grid}.preset-current{white-space:nowrap;text-overflow:ellipsis;color:var(--accent-hi);font-weight:600;overflow:hidden}.preset-buttons{gap:var(--space-2);grid-template-columns:repeat(3,1fr);display:grid}.preset-list{background:var(--surface-sunken);border:1px solid var(--line);max-height:180px;overflow-y:auto}.preset-list [role=option]{padding:var(--space-1) var(--space-4);cursor:pointer;white-space:nowrap;text-overflow:ellipsis;font-size:var(--text-xs);overflow:hidden}.preset-list [role=option]:hover{background:var(--surface-hover)}.preset-list [aria-selected=true]{background:var(--accent-soft);color:var(--accent-hi)}.preset-buttons button{gap:var(--space-2)}.socials{gap:var(--space-3);display:grid}.social-row{gap:var(--space-2);grid-template-columns:110px 1fr auto;display:grid}.checks{gap:var(--space-2);flex-direction:column;display:flex}.checks label{align-items:center;gap:var(--space-3);display:flex}.download{align-items:center;gap:var(--space-3);font-weight:600;display:inline-flex}.support-nudge{align-items:center;gap:var(--space-5);padding:var(--space-5);background:var(--accent-soft);border:1px solid var(--accent-line);display:flex}.support-nudge p{flex:1}.modal.gallery{width:min(980px,100vw - 40px)}.gallery-grid{gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.template-card{gap:var(--space-2);padding:var(--space-4);text-align:left;white-space:normal;place-content:start stretch;display:grid}.template-card:hover:not(:disabled){box-shadow:var(--shadow-lift)}.template-card .thumb{background:var(--surface-sunken);justify-content:center;align-items:center;height:170px;display:flex;overflow:hidden}.template-card .thumb img{max-width:100%;max-height:100%;display:block}.template-card strong{margin-top:var(--space-2);font-size:var(--text-md)}.modal.about{width:520px}.about-hero{justify-items:center;gap:var(--space-4);padding:var(--space-5) 0 var(--space-2);text-align:center;display:grid}.about-hero .brand-name{font-size:var(--text-xl);text-shadow:var(--split-text)}.about dl{gap:var(--space-2) var(--space-5);grid-template-columns:auto 1fr;margin:0;display:grid}.about dt{color:var(--text-dim)}.about dd{margin:0}.drop-hint{inset:var(--space-5);z-index:var(--z-drop);pointer-events:none;font-size:var(--text-xl);border:3px dashed var(--accent);background:var(--accent-soft);justify-content:center;align-items:center;display:flex;position:fixed}header .brand-button{padding:0 var(--space-3);margin-left:calc(-1 * var(--space-3))}header .brand-button:hover:not(:disabled){background:0 0}header .brand-button:hover .brand-name{text-shadow:var(--split-text)}@media (width<=1400px){.header-socials{display:none}}header .history:disabled{opacity:.55}.save-status{font-size:var(--text-xs);color:var(--text-dim);white-space:nowrap}.save-status.ok:before{content:"● ";color:var(--success)}.save-status.pending:before{content:"◌ "}.save-status.warn{color:var(--warn)}.save-status.bad{color:var(--danger);font-weight:600}.doc-bar{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-6);background:var(--surface-panel);border-bottom:var(--border-w) solid var(--line);font-size:var(--text-xs);flex-wrap:wrap;display:flex}.doc-bar.bad{border-bottom-color:var(--danger)}.doc-bar.warn{color:var(--warn)}.doc-bar.missing{border-bottom-color:var(--warn)}.account-placeholder{width:var(--control-h)}.avatar{background:var(--accent);width:22px;height:22px;color:var(--text-on-accent);font-weight:700;font-size:var(--text-xs);justify-content:center;align-items:center;display:inline-flex;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}header .menu summary:has(.avatar){padding:0 var(--space-3)}.menu-head{padding:var(--space-3) var(--space-4) var(--space-4);border-bottom:1px solid var(--line);margin-bottom:var(--space-2);display:grid}.modal.auth{width:400px}.auth-head{align-items:center;gap:var(--space-5);display:flex}.providers{gap:var(--space-3);display:grid}.provider{justify-content:center;gap:var(--space-4);min-height:36px}.or{align-items:center;gap:var(--space-4);color:var(--text-dim);font-size:var(--text-xs);display:flex}.or:before,.or:after{content:"";background:var(--line);flex:1;height:1px}.auth-switch{text-align:center}.modal.account{width:min(640px,100vw - 40px)}.account-tabs{flex-wrap:wrap}.account-body{min-height:280px}.connection{justify-content:space-between;align-items:center;gap:var(--space-5);padding:var(--space-4) 0;border-bottom:1px solid var(--line);display:flex}.connection>div:first-child{display:grid}.key-list{gap:var(--space-3);margin:0;padding:0;list-style:none;display:grid}.key-list li{justify-content:space-between;align-items:center;gap:var(--space-5);padding:var(--space-3) 0;border-bottom:1px solid var(--line);display:flex}.key-list li>div{display:grid}.key-created code{word-break:break-all}.palettes{gap:var(--space-3);flex-wrap:wrap;display:flex}.palette-chip{gap:var(--space-3);color:var(--text);font-size:var(--text-xs)}.palette-chip.active{border-color:var(--accent-2);box-shadow:var(--split-select)}.swatches{display:inline-flex}.swatches i{width:10px;height:14px}.palette-edit{gap:var(--space-5);margin-top:var(--space-3);display:flex}.swatch-edit{justify-items:center;gap:var(--space-1);display:grid}.modal.projects{width:min(1000px,100vw - 40px)}.projects-head{align-items:center;gap:var(--space-5);flex-wrap:wrap;display:flex}.empty-state{justify-items:center;gap:var(--space-4);padding:var(--space-9) 0;text-align:center;display:grid}.project-grid{gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));margin:0;padding:0;list-style:none;display:grid}.project-grid li{gap:var(--space-3);padding:var(--space-4);background:var(--surface-raised);border:var(--border-w) solid var(--line);display:grid}.project-grid li.open{border-color:var(--accent-2)}.project-grid li[aria-busy=true]{opacity:.6}.project-thumb{background:var(--surface-sunken);height:124px;padding:0;overflow:hidden}.project-thumb img{object-fit:cover;width:100%;height:100%;display:block}.project-meta{min-width:0;display:grid}.project-meta strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.project-actions{gap:var(--space-2);flex-wrap:wrap;display:flex}.crash{justify-items:start;gap:var(--space-5);max-width:560px;padding:var(--space-8);margin:15vh auto;display:grid}.crash pre{max-width:100%;color:var(--text-dim);overflow:auto}.export-where{align-self:start}.modal.renders{width:min(720px,100vw - 40px)}.render-list{gap:var(--space-3);margin:0;padding:0;list-style:none;display:grid}.render-row{gap:var(--space-2) var(--space-5);padding:var(--space-4);background:var(--surface-raised);border:var(--border-w) solid var(--line);grid-template-columns:1fr auto;align-items:center;display:grid}.render-meta{min-width:0;display:grid}.render-meta strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.render-state{gap:var(--space-2);grid-column:1;display:grid}.render-row>.buttons{grid-area:1/2/span 2}.render-row.done{border-color:var(--success)}.render-row.failed{border-color:var(--danger)}.panel-switch,.narrow-only,.row-break,.menu-icon{display:none}.menu[open]>div .btn{color:var(--text);box-shadow:none;background:0 0;border-color:#0000;justify-content:flex-start}.menu[open]>div .btn:hover{background:var(--surface-hover)}@media (width<=1199px){.app{grid-template-columns:224px minmax(0,1fr) 272px}.layers{padding:var(--space-4)}.inspector{padding:var(--space-4) var(--space-5)}header{gap:var(--space-3);padding:0 var(--space-4)}.project-name{width:150px}.wide-only{display:none}.menu[open]>div .narrow-only{display:flex}.stage-wrap{padding:var(--space-5)}}@media (width<=1023px){.app{grid-template-columns:200px minmax(0,1fr) 248px}header .brand-name,.save-status{display:none}}@media (width<=899px){.app{grid-template:"head""main"minmax(0,1fr)"switch""panel"minmax(0,.85fr)/minmax(0,1fr)}header{row-gap:var(--space-3);padding:var(--space-3) var(--space-4);flex-wrap:wrap}header .spacer{display:none}.project-field{flex:1;min-width:0}.project-name{width:100%}header .tabs{flex:1 0 100%;order:10}header .tabs button{flex:1}header .divider,.header-socials{display:none}.panel-switch{border-width:var(--border-w) 0 0;grid-area:switch;margin:0;display:flex}.panel-switch button{min-height:var(--control-h);flex:1}.layers,.inspector{border:0;grid-area:panel}.app[data-panel=layers] .inspector,.app[data-panel=inspector] .layers{display:none}.stage-wrap{padding:var(--space-4)}.transport{gap:var(--space-4);padding:var(--space-3) var(--space-4)}}@media (width<=899px) and (height<=560px) and (orientation:landscape){.app{grid-template:"head head""main switch""main panel"minmax(0,1fr)/minmax(0,1.25fr) minmax(0,1fr)}header{flex-wrap:nowrap}header .tabs{flex:none;order:0}.aspect-name{display:none}.panel-switch{border-width:0 0 0 var(--border-w)}.layers,.inspector{border-left:var(--border-w) solid var(--line)}.stage-wrap{padding:var(--space-3)}}@media (width<=600px){header{gap:var(--space-2)}header .brand-button{margin-right:0}.row-break{flex:1 0 100%;order:8;height:0;display:block}header .history{order:9}header .tabs{flex:1 1 0;order:10}.aspect-name{display:none}header .menu .label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}header .menu .menu-icon{display:inline-flex}}@media (pointer:coarse){:root{--control-h:44px;--control-h-sm:36px}input[type=checkbox]{width:20px;height:20px}.handle{width:18px;height:18px;margin:-9px}.handle.n,.handle.s,.handle.e,.handle.w{display:none}.layer-list li.selected .actions{display:flex}.layer-list .eye,.layer-list .actions button,.asset-list button{min-width:40px;min-height:40px}.transport .play{width:44px;height:44px}.scrub,.scrub input[type=range]{height:44px}.scrub.has-wave input[type=range]::-webkit-slider-thumb{height:44px;margin-top:-21px}}@media (pointer:coarse) and (width>=900px){.app{grid-template-rows:60px minmax(0,1fr)}}@media (width<=600px){dialog.modal-back[open]{align-items:stretch}.modal-back>.modal{width:100%;height:100%;max-height:none;padding:var(--space-6) var(--space-5);box-shadow:none;border:0;border-radius:0;align-content:start}.gallery-grid{grid-template-columns:1fr}.template-card .thumb{aspect-ratio:16/9;height:auto}.social-row{grid-template-columns:90px minmax(0,1fr) auto}}.modal.ask{width:400px}.modal.ask p{color:var(--text-dim)}:root button,:root .btn,:root .menu summary{box-shadow:var(--hard);transition:transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), background var(--dur-fast);font-weight:600}:root button:hover:not(:disabled),:root .btn:hover,:root .menu summary:hover{box-shadow:var(--hard-lift);border-color:var(--lilac);transform:translate(-1px,-1px)}:root button:active:not(:disabled),:root .btn:active{box-shadow:0 0 0 var(--shadow-c);transform:translate(3px,3px)}:root button:disabled{box-shadow:none}:root :is(.layer-list,.asset-list,.tabs,.menu>div,.add-menu,.scrub) button,:root button.ghost,:root .brand-button,:root :is(.layer-list,.asset-list,.tabs,.menu>div,.add-menu,.scrub) button:hover:not(:disabled),:root button.ghost:hover:not(:disabled),:root .brand-button:hover:not(:disabled){box-shadow:none;transform:none}:root button.primary,:root .btn.primary{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em;border-color:var(--ink);color:var(--ink);box-shadow:3px 3px 0 var(--sky);font-weight:800}:root button.primary:hover:not(:disabled),:root .btn.primary:hover{border-color:var(--ink);animation:.24s steps(2,end) infinite vz-jitter,.48s steps(3,end) infinite vz-chroma}:root .btn.patreon,:root button.patreon{border-color:var(--ink)}:root :is(input:not([type]),input[type=number],input[type=email],input[type=password],select,textarea):focus{border-color:var(--focus);box-shadow:var(--shadow-focus)}:root input[type=checkbox]{accent-color:var(--pink)}:root h4{width:fit-content;padding:1px var(--space-3);font-family:var(--font-mono);color:var(--ink);background:var(--lilac);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--shadow-c);justify-self:start;font-weight:700}:root .eyebrow{font-family:var(--font-mono)}:root h3{font-family:var(--font-mono);text-transform:uppercase;text-shadow:var(--split-text)}:root .layer-list li{border-width:2px}:root .layer-list li.selected{background:var(--sky);color:var(--ink);border:2px solid var(--ink);box-shadow:var(--split-select)}:root .layer-list li.selected :is(.layer-pick,.ico,.eye,.actions button){color:var(--ink)}:root .tabs button.active{background:var(--sky);color:var(--ink);box-shadow:none;outline:2px solid var(--ink);outline-offset:-2px}:root .preset-list [aria-selected=true]{background:var(--sky);color:var(--ink)}:root .template-card:hover:not(:disabled){box-shadow:var(--hard-lift), -3px 0 0 var(--chroma-a)}:root .support-nudge{border:2px solid var(--ink);box-shadow:var(--hard);background:#ff9fe01f}:root .progress .bar{border:2px solid var(--ink);height:12px}:root .progress .bar div{box-shadow:none}:root .modal{border-color:var(--ink)}:root .brand-name{text-shadow:-1px 0 0 var(--chroma-a), 1px 0 0 var(--chroma-b);position:relative}:root .brand-name[data-text]:before,:root .brand-name[data-text]:after{content:attr(data-text);content:attr(data-text) / "";pointer-events:none;opacity:0;text-shadow:none;position:absolute;inset:0}:root .brand-name[data-text]:before{color:var(--chroma-a);animation:4.5s step-end infinite vz-slice}:root .brand-name[data-text]:after{color:var(--chroma-b);animation:4.5s step-end .12s infinite reverse vz-slice}:root .brand-button:hover .brand-name[data-text]:before,:root .brand-button:hover .brand-name[data-text]:after{animation-duration:.6s}:root .modal{animation:.28s steps(4,end) both vz-glitch-in}@keyframes vz-slice{0%,86%{opacity:0;clip-path:inset(0 0 100%);transform:none}88%{opacity:.9;clip-path:inset(12% 0 64%);transform:translate(-3px)}90%{clip-path:inset(58% 0 18%);transform:translate(3px)}92%{clip-path:inset(34% 0 44%);transform:translate(-2px,1px)}94%{clip-path:inset(78% 0 4%);transform:translate(2px)}96%{clip-path:inset(0 0 82%);transform:translate(-1px)}98%,to{opacity:0;clip-path:inset(0 0 100%);transform:none}}@keyframes vz-jitter{0%{transform:translate(0)}25%{transform:translate(-2px,1px)}50%{transform:translate(2px,-1px)}75%{transform:translate(-1px,-1px)}to{transform:translate(1px,1px)}}@keyframes vz-chroma{0%{box-shadow:-3px 0 0 var(--chroma-a), 4px 3px 0 var(--accent-3)}33%{box-shadow:4px 1px 0 var(--chroma-a), -4px -1px 0 var(--accent-3)}66%{box-shadow:-2px -1px 0 var(--chroma-a), 5px 3px 0 var(--accent-3)}}@keyframes vz-glitch-in{0%{opacity:0;transform:translate(-10px)skew(8deg)}25%{opacity:1;transform:translate(8px)skew(-6deg)}50%{transform:translate(-4px)skew(3deg)}75%{transform:translate(2px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){:root *,:root :before,:root :after{animation:none!important}}
