@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700;800&display=swap";:root{--g-0:#fbfbfc;--g-50:#f4f5f7;--g-100:#e9ebef;--g-200:#d8dbe2;--g-300:#b9bec9;--g-400:#8b919e;--g-500:#646a76;--g-600:#474c56;--g-700:#31353d;--g-800:#21242a;--g-850:#191c21;--g-900:#13151a;--g-950:#0e1014;--bg:var(--g-950);--chrome:var(--g-900);--panel:var(--g-850);--panel-2:var(--g-800);--line:var(--g-700);--line-soft:var(--g-800);--ink:var(--g-50);--ink-dim:var(--g-400);--ink-faint:var(--g-500);--accent:#e7e9ee;--accent-ink:var(--g-900);--focus:#9aa3b2;--good:#a7f3d0;--good-ink:#064e3b;--warn:#fde68a;--bad:#fca5a5;--radius:9px;--radius-sm:6px;--mono:"JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;--ease:cubic-bezier(.2,.7,.2,1)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:13px;overflow:hidden;font-feature-settings:"ss01","cv01";-webkit-font-smoothing:antialiased}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}button{cursor:pointer;border:none;background:none}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--g-700);border-radius:6px;border:2px solid var(--panel)}::-webkit-scrollbar-thumb:hover{background:var(--g-600)}::selection{background:var(--g-200);color:var(--g-900)}#app{display:grid;grid-template-rows:46px 1fr 24px;height:100vh}header.topbar{display:flex;align-items:center;gap:14px;padding:0 14px;background:var(--chrome);border-bottom:1px solid var(--line);animation:slideDown .4s var(--ease)}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:none;opacity:1}}.brand{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:-.5px;font-size:15px}.brand .mark{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,var(--g-100),var(--g-400));display:grid;place-items:center;color:var(--g-900);font-weight:800;font-size:14px;box-shadow:0 0 0 1px var(--line)}.brand small{color:var(--ink-faint);font-weight:500;font-size:11px;letter-spacing:0}.spacer{margin-left:auto}.tb-group{display:flex;gap:6px;align-items:center}.btn{background:var(--panel-2);border:1px solid var(--line);padding:6px 11px;border-radius:var(--radius-sm);font-weight:600;font-size:12px;transition:.14s var(--ease);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}.btn:hover{background:var(--g-700);border-color:var(--g-600);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn.solid{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.btn.solid:hover{filter:brightness(.95)}.btn.play{background:var(--good);color:var(--good-ink);border-color:var(--good)}.btn.ghost{background:transparent;border-color:transparent}.btn.ghost:hover{background:var(--panel-2);border-color:var(--line)}.btn.sm{padding:4px 8px;font-size:11px}#main{display:grid;grid-template-columns:248px 1fr 300px;overflow:hidden;min-height:0}.col{background:var(--panel);overflow-y:auto;display:flex;flex-direction:column;min-height:0}.col.left{border-right:1px solid var(--line)}.col.right{border-left:1px solid var(--line)}.stage-col{display:flex;flex-direction:column;background:var(--bg);overflow:hidden;min-height:0}.section{border-bottom:1px solid var(--line-soft)}.section>.head{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;font-size:10.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink-faint);font-weight:700;user-select:none;cursor:pointer}.section>.head:hover{color:var(--ink-dim)}.section .head .chev{transition:transform .2s var(--ease);opacity:.6}.section.collapsed .head .chev{transform:rotate(-90deg)}.section.collapsed .body{display:none}.head .add{width:20px;height:20px;border-radius:5px;background:var(--panel-2);border:1px solid var(--line);display:grid;place-items:center;font-size:14px;color:var(--ink);line-height:1}.head .add:hover{background:var(--accent);color:var(--accent-ink)}.list{padding:2px 6px 8px}.row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:var(--radius-sm);cursor:pointer;transition:background .12s var(--ease)}.row:hover{background:var(--panel-2)}.row.active{background:var(--accent);color:var(--accent-ink);font-weight:600}.row .dot{width:9px;height:9px;border-radius:3px;flex:0 0 auto;box-shadow:0 0 0 1px #0003 inset}.row .label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row .meta{margin-left:auto;font-size:10px;color:var(--ink-faint)}.row.active .meta{color:var(--accent-ink);opacity:.7}.row .x{margin-left:auto;opacity:0;font-size:14px;color:var(--ink-faint);transition:.12s}.row:hover .x{opacity:1}.row .x:hover{color:var(--bad)}.row.active .x{color:var(--accent-ink)}.empty{padding:18px 14px;color:var(--ink-faint);font-size:11.5px;text-align:center;line-height:1.7}.vp-bar{display:flex;align-items:center;gap:12px;padding:8px 14px;background:var(--chrome);border-bottom:1px solid var(--line);font-size:11px;color:var(--ink-dim)}.vp-bar .pill{background:var(--panel-2);border:1px solid var(--line);padding:3px 9px;border-radius:20px;font-size:10.5px}.toggle{display:inline-flex;align-items:center;gap:5px;cursor:pointer;user-select:none}.toggle input{accent-color:var(--g-300)}.stage-wrap{flex:1;display:flex;align-items:center;justify-content:center;overflow:auto;padding:28px;min-height:0;background:linear-gradient(var(--g-900) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(90deg,var(--g-900) 1px,transparent 1px) 0 0/24px 24px,radial-gradient(circle at 50% 35%,var(--g-900),var(--g-950))}#frame{position:relative;box-shadow:0 0 0 1px var(--line),0 30px 70px #0000008c;background:#000;border-radius:4px;overflow:hidden}#editCanvas{display:block;cursor:crosshair}#playCanvas{display:none;position:absolute;inset:0}#frame.playing #editCanvas{display:none}#frame.playing #playCanvas{display:block}.field{padding:9px 12px;border-bottom:1px solid var(--line-soft)}.field>label{display:block;font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--ink-faint);margin-bottom:6px;font-weight:600}.field input,.field select,.field textarea{width:100%;background:var(--bg);border:1px solid var(--line);color:var(--ink);padding:7px 9px;border-radius:var(--radius-sm);transition:border-color .12s,box-shadow .12s}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px #9aa3b226}.g2{display:grid;grid-template-columns:1fr 1fr;gap:7px}.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.chk{display:flex;align-items:center;gap:8px;padding:4px 0;cursor:pointer}.chk input{width:auto;accent-color:var(--g-300)}.swatch{display:flex;gap:7px;align-items:center}.swatch input[type=color]{width:40px;height:34px;padding:2px;border-radius:var(--radius-sm);cursor:pointer}.beh{display:flex;flex-direction:column;gap:8px}.beh-item{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;animation:popIn .25s var(--ease)}@keyframes popIn{0%{transform:scale(.96);opacity:0}to{transform:none;opacity:1}}.beh-item .bh{display:flex;align-items:center;gap:8px;padding:7px 9px;cursor:pointer;font-weight:600;font-size:12px}.beh-item .bh .rm{margin-left:auto;color:var(--ink-faint);font-size:14px}.beh-item .bh .rm:hover{color:var(--bad)}.beh-item .bp{padding:0 9px 9px;display:none;flex-direction:column;gap:6px}.beh-item.open .bp{display:flex}.beh-item .bp label{font-size:10px;color:var(--ink-faint);display:block;margin-bottom:3px}.tree{padding:4px 6px 10px;font-size:12px}.tnode{display:flex;align-items:center;gap:7px;padding:4px 8px;border-radius:var(--radius-sm);cursor:default}.tnode.file{cursor:pointer}.tnode.file:hover{background:var(--panel-2)}.tnode .ic{opacity:.7;width:16px;text-align:center}.tnode .sz{margin-left:auto;font-size:10px;color:var(--ink-faint)}.tindent{padding-left:18px}.cat-tabs{display:flex;flex-wrap:wrap;gap:4px;padding:8px 10px 0}.cat-tab{padding:4px 9px;border-radius:14px;background:var(--panel-2);border:1px solid var(--line);font-size:10.5px;font-weight:600;color:var(--ink-dim)}.cat-tab.active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;padding:10px}.asset-card{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px;text-align:center;cursor:pointer;transition:.14s var(--ease)}.asset-card:hover{border-color:var(--focus);transform:translateY(-2px)}.asset-card img{width:100%;aspect-ratio:1;object-fit:contain;image-rendering:auto;display:block;background:repeating-conic-gradient(var(--g-900) 0% 25%,var(--g-850) 0% 50%) 50%/12px 12px;border-radius:4px}.asset-card .nm{font-size:9.5px;color:var(--ink-dim);margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scrim{position:fixed;inset:0;background:#08090ca8;backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;z-index:60;animation:fade .2s var(--ease)}.scrim.open{display:flex}@keyframes fade{0%{opacity:0}to{opacity:1}}.modal{background:var(--panel);border:1px solid var(--line);border-radius:14px;width:min(760px,94vw);max-height:88vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px #0009;animation:rise .28s var(--ease)}@keyframes rise{0%{transform:translateY(16px) scale(.98);opacity:0}to{transform:none;opacity:1}}.modal .mh{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:var(--chrome);border-bottom:1px solid var(--line);font-weight:700}.modal .mb{padding:16px;overflow-y:auto}.modal .mf{padding:12px 16px;border-top:1px solid var(--line);display:flex;gap:8px;justify-content:flex-end;background:var(--chrome)}.modal textarea{width:100%;height:300px;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;line-height:1.55;resize:vertical}.help{line-height:1.75;color:var(--ink-dim)}.help b{color:var(--ink)}.help code{background:var(--panel-2);border:1px solid var(--line);padding:1px 6px;border-radius:4px;color:var(--ink)}.help .step{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-soft)}.help .step .n{width:24px;height:24px;flex:0 0 auto;border-radius:7px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-weight:800;font-size:12px}.kbd{display:inline-block;background:var(--panel-2);border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:1px 7px;font-size:11px;font-weight:600}.snd-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}.snd-presets{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.slider-row{display:grid;grid-template-columns:90px 1fr 52px;gap:10px;align-items:center;margin:7px 0}.slider-row label{font-size:11px;color:var(--ink-dim)}.slider-row input[type=range]{accent-color:var(--g-300)}.slider-row .val{font-size:11px;color:var(--ink-faint);text-align:right}.maker-tools{display:flex;gap:6px;margin:10px 0;flex-wrap:wrap;align-items:center}.tool-btn{padding:6px 10px;border-radius:var(--radius-sm);background:var(--panel-2);border:1px solid var(--line);font-size:11px;font-weight:600}.tool-btn.active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.maker-stage{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}.palette{display:grid;grid-template-columns:repeat(8,18px);gap:4px;max-width:170px}.swatch-cell{width:18px;height:18px;border-radius:4px;cursor:pointer;border:1px solid rgba(0,0,0,.3)}.swatch-cell.active{outline:2px solid var(--accent);outline-offset:1px}footer.statusbar{display:flex;align-items:center;gap:14px;padding:0 14px;background:var(--chrome);border-top:1px solid var(--line);font-size:11px;color:var(--ink-faint)}footer .ok{color:var(--good)}footer .right{margin-left:auto;display:flex;gap:14px}.toast{position:fixed;bottom:38px;left:50%;transform:translate(-50%) translateY(18px);background:var(--panel-2);border:1px solid var(--line);padding:10px 18px;border-radius:10px;font-size:12.5px;opacity:0;pointer-events:none;z-index:99;transition:.28s var(--ease);box-shadow:0 16px 40px #00000080}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.muted{color:var(--ink-faint)}.tiny{font-size:10.5px}.hidden{display:none!important}.fade-in{animation:fade .3s var(--ease)}