*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#1e1e2e;--surface:#2a2a3e;--surface-hover:#33334a;--border:#3a3a52;--text:#cdd6f4;--text-dim:#7f849c;--accent:#89b4fa;--accent-hover:#74c7ec;--danger:#f38ba8;--mocha-peach:#fab387;--mocha-teal:#94e2d5;--mocha-lavender:#b4befe;--mocha-rosewater:#f5e0dc;--mocha-sky:#89dceb;--radius:4px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:13px;font-family:var(--font);color:var(--text)}body{background:var(--bg);overflow:hidden}.editor-layout{flex-direction:column;width:100vw;height:100vh;display:flex}.editor-main{flex:1;min-height:0;display:flex}.editor-sidebar{background:var(--surface);border-right:1px solid var(--border);flex-shrink:0;width:220px;min-width:180px;overflow-y:auto}.editor-canvas{background:#181825;flex:1;position:relative;overflow:hidden}.editor-canvas canvas{width:100%;height:100%;display:block}.editor-right{background:var(--surface);border-left:1px solid var(--border);flex-shrink:0;width:240px;min-width:200px;overflow-y:auto}.toolbar{background:var(--surface);border-bottom:1px solid var(--border);align-items:center;gap:4px;min-height:52px;padding:10px 14px;display:flex}.toolbar-brand{color:var(--mocha-teal);letter-spacing:0;margin-left:auto;margin-right:16px;font-family:Permanent Marker,cursive;font-size:2.4rem;font-weight:400;line-height:1;transform:translateY(0)}.toolbar-section{align-items:center;gap:2px;display:flex}.toolbar-divider{background:var(--border);width:1px;height:20px;margin:0 6px}.toolbar-btn{border-radius:var(--radius);color:var(--text);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;padding:6px 12px}.toolbar-btn:hover:not(:disabled){background:var(--surface-hover)}.toolbar-btn.active{background:var(--accent);color:#1e1e2e;font-weight:600}.toolbar-btn.active .toolbar-badge{color:#1e1e2eb3;background:#0000001f;border-color:#00000040}.toolbar-btn:disabled{opacity:.4;cursor:default}.toolbar-badge{color:#ffffffb3;text-transform:uppercase;letter-spacing:.3px;vertical-align:middle;background:#ffffff1f;border:1px solid #ffffff4d;border-radius:3px;margin-left:4px;padding:1px 5px;font-size:9.5px;font-weight:500}.zoom-display{text-align:center;cursor:pointer;border-radius:var(--radius);-webkit-user-select:none;user-select:none;min-width:52px;padding:4px 8px}.zoom-display:hover{background:var(--surface-hover)}.panel-header{text-transform:uppercase;letter-spacing:.5px;color:var(--text-dim);border-bottom:1px solid var(--border);padding:8px 10px;font-size:12px;font-weight:600}.panel-empty{color:var(--text-dim);text-align:center;padding:20px 10px;font-style:italic}.panel-section{border-bottom:1px solid var(--border);padding:8px 10px}.panel-section-title{text-transform:uppercase;color:var(--text-dim);margin-bottom:6px;font-size:11px;font-weight:600}.panel-row{align-items:center;gap:6px;margin-bottom:4px;display:flex}.number-input,.color-input{flex:1;align-items:center;gap:4px;display:flex}.input-label{color:var(--text-dim);flex-shrink:0;min-width:18px;font-size:11px}.panel-number-input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);width:100%;color:var(--text);font:inherit;padding:3px 6px;font-size:12px}.panel-number-input:focus{border-color:var(--accent);outline:none}.panel-text-input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);width:100%;color:var(--text);font:inherit;padding:3px 6px;font-size:12px}.panel-text-input:focus{border-color:var(--accent);outline:none}.panel-select{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font:inherit;padding:3px 4px;font-size:12px}.panel-color-input{border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;background:0 0;width:28px;height:22px;padding:0}.color-clear{color:var(--text-dim);cursor:pointer;background:0 0;border:none;padding:0 2px;font-size:14px}.color-clear:hover{color:var(--danger)}.layer-tree{padding:4px 0}.layer-item{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:4px;padding:3px 8px;font-size:12px;display:flex}.layer-item:hover{background:var(--surface-hover)}.layer-item.selected{background:#89b4fa26}.layer-item.hidden-layer .layer-name{opacity:.4}.layer-expand{width:14px;height:14px;color:var(--text-dim);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;font-size:8px;display:flex}.layer-expand-spacer{flex-shrink:0;width:14px}.layer-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.layer-type{color:var(--text-dim);flex-shrink:0;font-size:10px}.layer-toggle{cursor:pointer;opacity:.6;background:0 0;border:none;flex-shrink:0;padding:0 2px;font-size:11px}.layer-toggle:hover{opacity:1}.layer-toggle.off{opacity:.3}.layer-rename-input{border:1px solid var(--accent);background:var(--bg);color:var(--text);font:inherit;border-radius:2px;flex:1;padding:1px 4px;font-size:12px}.context-backdrop{z-index:100;position:fixed;inset:0}.context-menu{z-index:101;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);min-width:160px;padding:4px 0;position:fixed;box-shadow:0 4px 12px #0006}.context-item{width:100%;color:var(--text);font:inherit;cursor:pointer;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;padding:6px 12px;display:flex}.context-item:hover:not(:disabled){background:var(--surface-hover)}.context-item:disabled{opacity:.4;cursor:default}.context-shortcut{color:var(--text-dim);margin-left:16px;font-size:11px}