:root{--bg:#0b0b0f;--panel:#16161d;--panel2:#1c1c24;--border:#2a2a35;--text:#e7e7ea;--dim:#9a9aa3;--accent:#5b5bd6;--velvet:#7c1424;--gold:#f6d28a}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:system-ui,-apple-system,sans-serif}.app{flex-direction:column;height:100vh;display:flex}.header{border-bottom:1px solid var(--border);background:var(--panel);align-items:center;gap:12px;padding:10px 16px;display:flex}.brand{color:var(--gold);align-items:center;gap:8px;font-size:16px;font-weight:500;display:flex}.header .spacer{flex:1}.donate{background:var(--gold);color:#4a3410;cursor:pointer;border:0;border-radius:8px;align-items:center;gap:6px;padding:7px 12px;font-size:13px;font-weight:500;text-decoration:none;display:inline-flex}.aboutbtn{color:var(--dim);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:8px;padding:6px 12px;font-size:13px}.aboutbtn:hover{color:var(--text);border-color:var(--accent)}.about-overlay{z-index:900;background:#000000a6;justify-content:center;align-items:center;padding:24px;animation:.25s forwards doorFade;display:flex;position:fixed;inset:0}.about-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;width:min(560px,92vw);max-height:85vh;padding:26px 30px;position:relative;overflow-y:auto;box-shadow:0 18px 60px #0000008c}.about-card h2{color:var(--gold);margin:0 0 14px;font-size:20px;font-weight:600}.about-card p{color:var(--text);margin:0 0 12px;font-size:14px;line-height:1.6}.about-sig{color:var(--gold);margin-top:16px;font-style:italic}.about-close{color:var(--dim);cursor:pointer;background:0 0;border:0;padding:4px;line-height:0;position:absolute;top:12px;right:12px}.about-close:hover{color:var(--text)}.whale{cursor:pointer;background:0 0;border:0;font-size:22px;line-height:1}.whale.appear{animation:.55s whalePop}@keyframes whalePop{0%{opacity:0;transform:scale(.4)translateY(-6px)}60%{transform:scale(1.15)}to{opacity:1;transform:scale(1)}}.door-overlay{z-index:1000;background:#000;justify-content:center;align-items:center;animation:.8s forwards doorFade;display:flex;position:fixed;inset:0}@keyframes doorFade{0%{opacity:0}to{opacity:1}}.door-slit{background:linear-gradient(90deg,#0000,#f6d28a,#0000);border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;width:min(420px,80vw);height:3px;transition:height .7s cubic-bezier(.6,.02,.2,1),background .7s,box-shadow .7s,border-color .7s;display:flex;overflow:hidden;box-shadow:0 0 24px 5px #f6d28a8c}.door-slit.open{background:#0b0b0f;border-color:#2a2a35;height:66px;box-shadow:0 0 44px 6px #f6d28a38}.door-input{color:#e7e7ea;text-align:center;letter-spacing:2px;opacity:0;background:0 0;border:0;outline:none;width:100%;height:100%;font-size:17px;transition:opacity .45s .45s}.door-slit.open .door-input{opacity:1}.door-input::placeholder{color:#6b6b76;letter-spacing:1px}.door-slit.shake{animation:.45s shake}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}.speakeasy{z-index:1000;background:#0b0b0f;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:fixed;inset:0}.se-whale{font-size:46px}.speakeasy h1{color:#f6d28a;margin:0;font-size:28px;font-weight:500}.speakeasy p{color:#9a9aa3;margin:0}.editor{flex:1;grid-template-columns:60px 1fr 300px;min-height:0;display:grid}.toolbar{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;align-items:center;gap:6px;padding:10px 8px;display:flex}.tbtn{width:42px;height:42px;color:var(--dim);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:9px;justify-content:center;align-items:center;display:flex}.tbtn:hover{background:var(--panel2);color:var(--text)}.tbtn.active{background:var(--velvet);color:var(--gold)}.tbtn.danger:hover{color:#f87171}.tsep{background:var(--border);width:26px;height:1px;margin:4px 0}.stage{background:#0e0e12;justify-content:center;align-items:center;padding:28px;display:flex;overflow:auto}.canvas-wrap{line-height:0;box-shadow:0 10px 50px #0000008c}.side{background:var(--panel);border-left:1px solid var(--border);flex-direction:column;gap:18px;padding:14px;display:flex;overflow-y:auto}.panel h3{text-transform:uppercase;letter-spacing:.6px;color:var(--dim);margin:0 0 10px;font-size:11px}.row{color:var(--dim);justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;font-size:13px;display:flex}.row .val{color:var(--text)}input[type=color]{border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;width:34px;height:26px;padding:0}input[type=range]{accent-color:var(--accent);flex:1}select{background:var(--panel2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:6px 8px;font-size:13px}.check{color:var(--text);cursor:pointer;align-items:center;gap:6px;display:flex}.layer{background:var(--panel2);border-radius:8px;align-items:center;gap:6px;margin-bottom:6px;padding:7px 8px;font-size:13px;display:flex}.layer.sel{outline:1px solid var(--gold)}.layer .name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.iconbtn{color:var(--dim);cursor:pointer;background:0 0;border:0;padding:3px;display:flex}.iconbtn:hover{color:var(--text)}.empty{color:var(--dim);font-size:13px}.export-btns{grid-template-columns:1fr 1fr;gap:8px;display:grid}.ebtn{background:var(--panel2);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:6px;padding:8px;font-size:12px;display:flex}.ebtn:hover{border-color:var(--accent)}.ebtn.full{background:var(--accent);border-color:var(--accent);color:#fff;grid-column:1/-1}.hint{color:var(--dim);margin-top:6px;font-size:11px}.center{flex-direction:column;min-height:0;display:flex}.tabsbar{border-bottom:1px solid var(--border);background:var(--panel);align-items:center;gap:8px;padding:8px 10px;display:flex}.tabs{flex:1;align-items:center;gap:6px;display:flex;overflow-x:auto}.tab{background:var(--panel2);color:var(--dim);border:1px solid var(--border);cursor:pointer;white-space:nowrap;border-radius:8px;align-items:center;gap:8px;padding:6px 10px;font-size:12px;display:flex}.tab.active{background:var(--velvet);color:var(--gold);border-color:var(--velvet)}.tab .x{opacity:.55;display:flex}.tab .x:hover{opacity:1}.addtab{border:1px dashed var(--border);color:var(--dim);cursor:pointer;background:0 0;border-radius:8px;align-items:center;gap:4px;padding:6px 9px;font-size:12px;display:flex}.addtab:hover{color:var(--text);border-color:var(--accent)}.fmt-menu{flex:none;position:relative}.fmt-list{z-index:50;background:var(--panel2);border:1px solid var(--border);border-radius:10px;min-width:170px;padding:6px;position:absolute;top:34px;right:0;box-shadow:0 10px 34px #0000008c}.fmt-list button{text-align:left;width:100%;color:var(--text);cursor:pointer;background:0 0;border:0;border-radius:6px;padding:7px 8px;font-size:13px;display:block}.fmt-list button:hover{background:var(--panel)}.fx-toggles{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.fx-toggles button{background:var(--panel2);border:1px solid var(--border);color:var(--dim);cursor:pointer;border-radius:999px;padding:5px 10px;font-size:12px}.fx-toggles button.on{background:var(--velvet);color:var(--gold);border-color:var(--velvet)}
