:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-canvas:#fff;--bg-surface:#fff;--bg-surface-hover:#eef0f2;--text-primary:#1c2229;--text-muted:#68727d;--border:#dce0e5;--accent:#0f766e;--accent-strong:#0b5d57;--on-accent:#fff;--status-saved:#2f9e44;--status-unsaved:#e03131;--code-key:#c2185b;--code-string:#166534;--code-number:#1d4ed8;--code-boolean:#7c3aed;--selection-color:#0f766e;--element-stroke:#26292c;--grid-dot:#1c222912;--grid-line:#1c22290d;--grid-line-master:#1c222912;--shadow-sm:none;--shadow-md:none;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--radius-sm:3px;--radius-md:4px;--radius-lg:4px;--radius-full:999px;--font-ui:"Segoe UI", system-ui, -apple-system, sans-serif;--font-mono-ui:ui-monospace, "SF Mono", Menlo, monospace;--font-size-xs:11px;--font-size-sm:12px;--font-size-md:13px;--font-size-lg:16px;--transition-fast:.12s ease;--transition-med:.18s ease;--focus-ring:0 0 0 2px var(--bg-canvas), 0 0 0 4px var(--accent)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#090a0c;--bg-surface:#1a1e23;--bg-surface-hover:#22272d;--text-primary:#dde3e9;--text-muted:#8a949f;--border:#31373e;--accent:#2aa79b;--accent-strong:#3fc4b6;--on-accent:#04211e;--status-saved:#40c057;--status-unsaved:#ff6b6b;--code-key:#f9a8d4;--code-string:#86efac;--code-number:#93c5fd;--code-boolean:#d8b4fe;--selection-color:#2aa79b;--element-stroke:#dfe0e2;--grid-dot:#ffffff12;--grid-line:#ffffff0d;--grid-line-master:#ffffff12}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#090a0c;--bg-surface:#1a1e23;--bg-surface-hover:#22272d;--text-primary:#dde3e9;--text-muted:#8a949f;--border:#31373e;--accent:#2aa79b;--accent-strong:#3fc4b6;--on-accent:#04211e;--status-saved:#40c057;--status-unsaved:#ff6b6b;--code-key:#f9a8d4;--code-string:#86efac;--code-number:#93c5fd;--code-boolean:#d8b4fe;--selection-color:#2aa79b;--element-stroke:#dfe0e2;--grid-dot:#ffffff12;--grid-line:#ffffff0d;--grid-line-master:#ffffff12}:root[data-skin=warm]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--font-ui:"Avenir Next", "Segoe UI", system-ui, sans-serif;--radius-sm:9px;--radius-md:12px;--radius-lg:12px;--bg-canvas:#f7f2ea;--bg-surface:#fffdf8;--bg-surface-hover:#f1e9dc;--text-primary:#332e28;--text-muted:#8b8072;--border:#e6dccc;--accent:#c2571b;--accent-strong:#a34714;--on-accent:#fff;--selection-color:#c2571b;--element-stroke:#26292c;--grid-dot:#785a2812;--grid-line:#785a280d;--grid-line-master:#785a2812;--shadow-sm:0 2px 6px #5a462814;--shadow-md:0 2px 6px #5a462814, 0 8px 24px #5a462814}@media (prefers-color-scheme:dark){:root[data-skin=warm]:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#0c0a07;--bg-surface:#1d1712;--bg-surface-hover:#251f19;--text-primary:#f0e8db;--text-muted:#a3937f;--border:#463c30;--accent:#d96a2e;--accent-strong:#e8834d;--on-accent:#fff;--selection-color:#d96a2e;--element-stroke:#dfe0e2;--grid-dot:#f0dcb412;--grid-line:#f0dcb40d;--grid-line-master:#f0dcb412;--shadow-sm:0 2px 8px #00000059;--shadow-md:0 2px 8px #00000059, 0 8px 24px #00000059}}:root[data-skin=warm][data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#0c0a07;--bg-surface:#1d1712;--bg-surface-hover:#251f19;--text-primary:#f0e8db;--text-muted:#a3937f;--border:#463c30;--accent:#d96a2e;--accent-strong:#e8834d;--on-accent:#fff;--selection-color:#d96a2e;--element-stroke:#dfe0e2;--grid-dot:#f0dcb412;--grid-line:#f0dcb40d;--grid-line-master:#f0dcb412;--shadow-sm:0 2px 8px #00000059;--shadow-md:0 2px 8px #00000059, 0 8px 24px #00000059}:root[data-skin=swiss]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--font-ui:"Helvetica Neue", Arial, sans-serif;--radius-sm:0px;--radius-md:0px;--radius-lg:0px;--bg-canvas:#f0f0ee;--bg-surface:#fff;--bg-surface-hover:#e8e8e6;--text-primary:#111;--text-muted:#757575;--border:#111;--accent:#e5322d;--accent-strong:#c22420;--on-accent:#fff;--selection-color:#e5322d;--element-stroke:#26292c;--grid-dot:#11111112;--grid-line:#1111110d;--grid-line-master:#11111112;--shadow-sm:2px 2px 0 var(--text-primary);--shadow-md:3px 3px 0 var(--text-primary)}@media (prefers-color-scheme:dark){:root[data-skin=swiss]:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#0e0e0b;--bg-surface:#1b1a16;--bg-surface-hover:#24231e;--text-primary:#f2f2f0;--text-muted:#9a9a9a;--border:#f2f2f0;--accent:#ff4640;--accent-strong:#ff6b66;--on-accent:#111;--selection-color:#ff4640;--element-stroke:#dfe0e2;--grid-dot:#ffffff12;--grid-line:#ffffff0d;--grid-line-master:#ffffff12}}:root[data-skin=swiss][data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#0e0e0b;--bg-surface:#1b1a16;--bg-surface-hover:#24231e;--text-primary:#f2f2f0;--text-muted:#9a9a9a;--border:#f2f2f0;--accent:#ff4640;--accent-strong:#ff6b66;--on-accent:#111;--selection-color:#ff4640;--element-stroke:#dfe0e2;--grid-dot:#ffffff12;--grid-line:#ffffff0d;--grid-line-master:#ffffff12}:root[data-skin=midnight]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#0b0d11;--bg-surface:#14171d;--bg-surface-hover:#1d222b;--text-primary:#e2e7ee;--text-muted:#7c8794;--border:#272e39;--accent:#34d399;--accent-strong:#2bb984;--on-accent:#06251a;--selection-color:#34d399;--element-stroke:#dfe0e2;--grid-dot:#ffffff12;--grid-line:#ffffff0d;--grid-line-master:#ffffff12;--shadow-sm:0 2px 8px #00000080;--shadow-md:0 4px 18px #0000008c}@media (prefers-color-scheme:light){:root[data-skin=midnight]:not([data-theme=dark]){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-canvas:#f4f6f8;--bg-surface:#fff;--bg-surface-hover:#ebf0f4;--text-primary:#1a2028;--text-muted:#5f6b78;--border:#d7dde4;--accent:#0d9271;--accent-strong:#0a7a5e;--on-accent:#fff;--selection-color:#0d9271;--element-stroke:#26292c;--grid-dot:#1a202812;--grid-line:#1a20280d;--grid-line-master:#1a202812;--shadow-sm:0 1px 3px #141e2814;--shadow-md:0 2px 10px #141e281a}}:root[data-skin=midnight][data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-canvas:#f4f6f8;--bg-surface:#fff;--bg-surface-hover:#ebf0f4;--text-primary:#1a2028;--text-muted:#5f6b78;--border:#d7dde4;--accent:#0d9271;--accent-strong:#0a7a5e;--on-accent:#fff;--selection-color:#0d9271;--element-stroke:#26292c;--grid-dot:#1a202812;--grid-line:#1a20280d;--grid-line-master:#1a202812;--shadow-sm:0 1px 3px #141e2814;--shadow-md:0 2px 10px #141e281a}:root[data-skin=blueprint]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--font-ui:"Helvetica Neue", Arial, sans-serif;--radius-sm:5px;--radius-md:8px;--radius-lg:8px;--bg-canvas:#fff;--bg-surface:#fff;--bg-surface-hover:#e4eaf3;--text-primary:#17334f;--text-muted:#5e7590;--border:#c9d4e2;--accent:#1e5aa8;--accent-strong:#17478a;--on-accent:#fff;--selection-color:#1e5aa8;--element-stroke:#26292c;--grid-dot:#1e5aa812;--grid-line:#1e5aa80d;--grid-line-master:#1e5aa812;--shadow-sm:2px 2px 0 #1e5aa81a;--shadow-md:3px 3px 0 #1e5aa81f}@media (prefers-color-scheme:dark){:root[data-skin=blueprint]:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#090a0c;--bg-surface:#142237;--bg-surface-hover:#1a2e49;--text-primary:#dbe7f5;--text-muted:#8aa2bd;--border:#2b4463;--accent:#5ba3e8;--accent-strong:#7cb7ef;--on-accent:#0b1929;--selection-color:#5ba3e8;--element-stroke:#dfe0e2;--grid-dot:#5ba3e812;--grid-line:#5ba3e80d;--grid-line-master:#5ba3e812;--shadow-sm:2px 2px 0 #5ba3e824;--shadow-md:3px 3px 0 #5ba3e82e}}:root[data-skin=blueprint][data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-canvas:#090a0c;--bg-surface:#142237;--bg-surface-hover:#1a2e49;--text-primary:#dbe7f5;--text-muted:#8aa2bd;--border:#2b4463;--accent:#5ba3e8;--accent-strong:#7cb7ef;--on-accent:#0b1929;--selection-color:#5ba3e8;--element-stroke:#dfe0e2;--grid-dot:#5ba3e812;--grid-line:#5ba3e80d;--grid-line-master:#5ba3e812;--shadow-sm:2px 2px 0 #5ba3e824;--shadow-md:3px 3px 0 #5ba3e82e}*{box-sizing:border-box}html,body,#root{height:100%;font-family:var(--font-ui);margin:0;overflow:hidden}button{transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);font-family:inherit}:focus-visible{box-shadow:var(--focus-ring);border-radius:var(--radius-sm);outline:none}.app{background:var(--bg-canvas);width:100%;height:100%;position:relative}.canvas-host{position:absolute;inset:0}.canvas{cursor:crosshair;width:100%;height:100%;display:block}.canvas[data-tool=selection]{cursor:default}.canvas.cursor-grab,.canvas[data-tool=hand]{cursor:grab}:root{--panel-w:272px}.corner-toggle{top:var(--space-3);left:var(--space-4);z-index:40;align-items:center;gap:var(--space-1);width:auto;height:34px;padding:0 var(--space-2);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);color:var(--text-primary);cursor:pointer;transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);display:flex;position:absolute}.corner-toggle:hover{background:var(--bg-surface-hover)}.corner-toggle.open{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.corner-kbd{font-size:var(--font-size-xs);font-family:var(--font-mono-ui);color:var(--text-muted);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface-hover);padding:0 4px}.corner-toggle.open .corner-kbd,.menu-btn.active .corner-kbd{background:var(--on-accent);border-color:var(--on-accent);color:var(--accent);opacity:1}.workspace-panel{z-index:39;width:var(--panel-w);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);height:50%;box-shadow:var(--shadow-md);contain:layout style;visibility:hidden;transition:transform var(--transition-med), visibility var(--transition-med);flex-direction:column;display:flex;position:absolute;top:50%;left:0;transform:translate(-104%,-50%)}.workspace-panel[data-open=true]{visibility:visible;transform:translateY(-50%)}.wp-head{align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-2) var(--space-2) var(--space-2);border-bottom:1px solid var(--border);display:flex}.wp-title{font-size:var(--font-size-xs);color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;-webkit-user-select:none;user-select:none;flex:1;font-weight:600}.wp-scroll{padding:var(--space-1) var(--space-1) var(--space-5);overscroll-behavior:contain;contain:content;flex:1;overflow-y:auto}.icon-btn{border-radius:var(--radius-sm);width:22px;height:22px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.icon-btn.visible{opacity:.7}.icon-btn:hover,.tree-row.active .icon-btn.visible,.tree-row:hover .icon-btn{opacity:1}.tree-row.active .icon-btn.visible,.tree-row:hover .icon-btn{color:var(--text-primary)}.icon-btn:hover{background:var(--bg-surface-hover)}.tree-group{flex-direction:column;display:flex}.tree-row{height:28px;padding-right:var(--space-1);border-radius:var(--radius-sm);color:var(--text-muted);font-size:var(--font-size-md);cursor:pointer;-webkit-user-select:none;user-select:none;min-width:0;transition:background-color var(--transition-fast), color var(--transition-fast);align-items:center;gap:2px;display:flex;position:relative}.tree-row:hover{background:var(--bg-surface-hover);color:var(--text-primary)}.tree-row:focus-visible{box-shadow:inset 0 0 0 2px var(--accent);outline:none}.tree-row.dragging{opacity:.45;cursor:grabbing}.tree-row.active:before{content:"";border-radius:var(--radius-full);background:color-mix(in srgb, var(--accent) 65%, transparent);width:3px;position:absolute;top:5px;bottom:5px;left:0}.tree-row.canvas-row{padding-left:var(--space-2)}.tree-row.canvas-row.active{background:var(--accent);color:var(--on-accent)}.tree-row.canvas-row.active:hover{background:var(--accent-strong)}.tree-row.canvas-row.active:before{content:none}.tree-caret{border-radius:var(--radius-sm);width:18px;height:28px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.tree-caret:hover{background:var(--bg-surface-hover);color:var(--text-primary)}.tree-caret svg{transition:transform var(--transition-fast)}.tree-caret-open{transform:rotate(90deg)}.tree-icon{color:var(--text-muted);flex-shrink:0;justify-content:center;align-items:center;display:flex}.tree-row.canvas-row.active .icon-btn{color:var(--on-accent)}.tree-indent{flex-shrink:0;width:14px}.tree-name{min-width:40px;font-size:inherit;color:inherit;white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.tree-row.active .tree-name{color:var(--text-primary);font-weight:600}.tree-row.canvas-row.active .tree-name{color:var(--on-accent)}.tree-name::selection{background:0 0}.tree-count{font-size:var(--font-size-xs);color:var(--text-muted);background:var(--bg-surface-hover);border-radius:var(--radius-full);flex-shrink:0;padding:0 6px;line-height:16px}.tree-file-badge{max-width:92px;font-size:var(--font-size-xs);color:var(--text-muted);cursor:default;background:0 0;border:none;flex-shrink:1;align-items:center;gap:3px;min-width:0;padding:0;display:flex;overflow:hidden}.tree-file-badge:disabled{cursor:default}.tree-file-badge:not(:disabled):hover{color:var(--text-primary)}.tree-file-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:48px;overflow:hidden}.tree-file-status{border-radius:var(--radius-full);background:var(--bg-surface-hover);flex-shrink:0;padding:0 5px;line-height:16px}.tree-file-badge[data-status=conflict] .tree-file-status,.tree-file-badge[data-status=missing] .tree-file-status,.tree-file-badge[data-status=invalid] .tree-file-status,.tree-file-badge[data-status=error] .tree-file-status{color:#e03131;background:#e0313138}.tree-file-badge[data-status=permission] .tree-file-status{color:#b26b00;background:#f59f0038}.tree-children{flex-direction:column;margin-left:18px;display:flex}.tree-empty{align-items:center;gap:var(--space-2);padding:0 var(--space-2);border-radius:var(--radius-sm);border:1px dashed var(--border);height:28px;color:var(--text-muted);font-size:var(--font-size-sm);cursor:pointer;transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);background:0 0;display:flex}.tree-empty:hover{color:var(--text-primary);border-color:var(--text-muted)}.tree-rename{min-width:0;font-size:var(--font-size-md);color:var(--text-primary);border:none;border-bottom:1.5px solid var(--accent);background:0 0;outline:none;flex:1;padding:0;font-family:inherit}.tree-row.canvas-row.active .tree-rename{color:var(--on-accent);border-bottom-color:var(--on-accent)}.tab-confirm-backdrop{z-index:90}.tab-confirm{width:min(380px,100vw - 48px);padding:var(--space-4);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md)}.tab-confirm-title{margin:0 0 var(--space-3) 0;font-size:var(--font-size-md);color:var(--text-primary);font-weight:600;line-height:1.4}.tab-confirm-body{gap:var(--space-2);flex-direction:column;display:flex}.tab-confirm-text{font-size:var(--font-size-sm);color:var(--text-primary);margin:0;line-height:1.5}.tab-confirm-warning{color:var(--status-unsaved,#e03131)}.tab-confirm-details{color:var(--text-muted);font-size:var(--font-size-xs)}.tab-confirm-actions{justify-content:flex-end;align-items:center;gap:var(--space-2);margin-top:var(--space-4);flex-wrap:wrap;display:flex}.tab-confirm-btn{padding:var(--space-1) var(--space-3);color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;font-weight:600}.tab-confirm-btn.primary{background:var(--accent);color:var(--on-accent)}.tab-confirm-btn.primary:hover{background:var(--accent-strong)}.tab-confirm-btn.danger{color:#fff;background:#e03131}.tab-confirm-btn.danger:hover{background:#c92a2a}.sync-conflict{width:min(440px,100vw - 48px)}.sync-conflict-actions{flex-wrap:wrap}.status-file{text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;cursor:default;max-width:260px;color:var(--text-muted);-webkit-user-select:none;user-select:none;align-items:center;gap:6px;display:inline-flex;overflow:hidden}.status-file:hover{color:var(--text-primary)}.status-file-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}button.status-file{cursor:pointer;font:inherit;text-align:left;pointer-events:auto;background:0 0;border:none;padding:0}.status-dot{border-radius:var(--radius-full);background-color:var(--text-muted);pointer-events:auto;flex-shrink:0;width:7px;height:7px;display:inline-block}.status-dot[data-status=saved]{background-color:var(--status-saved)}.status-dot[data-status=modified]{background-color:var(--status-unsaved)}.status-dot[data-status=saving]{background-color:#f59f00;animation:1s ease-in-out infinite alternate status-pulse}.status-dot[data-status=conflict],.status-dot[data-status=missing],.status-dot[data-status=invalid],.status-dot[data-status=error],.status-dot[data-status=permission]{background-color:var(--status-unsaved)}@keyframes status-pulse{0%{opacity:.4}to{opacity:1}}.top-right{top:var(--space-3);right:var(--space-4);align-items:center;gap:var(--space-2);display:flex;position:absolute}.app-menu{position:relative}.tool-btn.menu-btn{align-items:center;gap:var(--space-1);width:auto;height:34px;padding:0 var(--space-2);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-sm);display:flex}.menu-btn.active{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.menu-backdrop{z-index:40;position:fixed;inset:0}.menu-dropdown{top:calc(100% + var(--space-1));min-width:190px;padding:var(--space-1);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:50;transform-origin:100% 0;flex-direction:column;animation:.14s cubic-bezier(.2,.8,.3,1) menu-in;display:flex;position:absolute;right:0}@keyframes menu-in{0%{opacity:0;transform:scale(.97)translateY(-3px)}to{opacity:1;transform:scale(1)translateY(0)}}.menu-section{padding-bottom:var(--space-1);margin-bottom:var(--space-1);border-bottom:1px solid var(--border);flex-direction:column;display:flex}.menu-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.menu-section-title{font-size:var(--font-size-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;padding:var(--space-2) var(--space-3) var(--space-1);font-weight:600}.menu-item{color:var(--text-primary);font-size:var(--font-size-md);text-align:left;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);cursor:pointer;align-items:center;gap:var(--space-2);background:0 0;border:none;display:flex}.menu-item:hover{background:var(--bg-surface-hover)}.menu-item-icon{width:14px;height:14px;color:var(--text-muted);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.menu-item-label{flex:1}.menu-item-shortcut{color:var(--text-muted);font-size:var(--font-size-xs);flex-shrink:0}.menu-item-check{width:14px;height:14px;color:var(--accent);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.menu-mode-wrap{padding:var(--space-1) var(--space-3) var(--space-2)}.menu-mode-label{font-size:var(--font-size-sm);color:var(--text-muted);margin-bottom:var(--space-1)}.menu-mode-row{align-items:center;gap:var(--space-2);display:flex}.menu-mode-icons{gap:4px;display:flex}.menu-mode-icon{border:1px solid var(--border);width:20px;height:20px;color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;justify-content:center;align-items:center;padding:0;display:inline-flex}.menu-mode-icon:hover{background:var(--bg-surface-hover);color:var(--text-primary)}.menu-mode-icon.active{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.menu-mode-shortcut{color:var(--text-muted);font-size:var(--font-size-xs);margin-left:auto}.menu-submenu{position:relative}.menu-item--submenu{box-sizing:border-box;width:100%}.menu-submenu-panel{min-width:150px;padding:var(--space-1);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:60;flex-direction:column;animation:.12s cubic-bezier(.2,.8,.3,1) menu-in;display:flex;position:absolute;top:-2px;right:calc(100% + 2px)}.menu-item-arrow{width:14px;height:14px;color:var(--text-muted);flex-shrink:0;order:-1;justify-content:center;align-items:center;display:inline-flex}.menu-bg-palette{padding:var(--space-1) var(--space-3) var(--space-2)}.menu-bg-label{font-size:var(--font-size-sm);color:var(--text-muted);margin-bottom:var(--space-1)}.menu-bg-grid{flex-wrap:wrap;gap:4px;display:flex}.menu-bg-swatch{border-radius:var(--radius-sm);border:1px solid var(--border);cursor:pointer;width:20px;height:20px;transition:transform var(--transition-fast);padding:0}.menu-bg-swatch:hover{transform:scale(1.15)}.menu-bg-swatch.active{outline:2px solid var(--accent);outline-offset:1px}.toolbar{top:var(--space-3);padding:var(--space-1);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);align-items:center;gap:2px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.tool-btn{border-radius:var(--radius-sm);width:36px;height:36px;color:var(--text-primary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;display:flex;position:relative}.tool-key{color:var(--text-muted);pointer-events:none;font-size:8px;font-weight:500;line-height:1;position:absolute;bottom:1px;right:2px}.tool-btn:hover{background:var(--bg-surface-hover)}.tool-btn:active{transform:scale(.94)}.tool-btn{transition:background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast)}.tool-btn.active{background:var(--accent);color:var(--on-accent)}.tool-btn.active .tool-key{color:var(--on-accent);opacity:.7}.toolbar-sep{background:var(--border);width:1px;height:22px;margin:0 var(--space-1)}.properties-panel-container{top:50%;left:var(--space-4);align-items:flex-start;gap:var(--space-2);pointer-events:none;z-index:20;max-height:calc(100% - 100px);display:flex;position:absolute;transform:translateY(-50%)}.properties-panel{pointer-events:auto;gap:var(--space-2);padding:var(--space-3) var(--space-2);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);scrollbar-width:none;flex-direction:column;min-width:180px;max-height:100%;display:flex;overflow-y:auto}.properties-panel::-webkit-scrollbar{display:none}.panel-tabs{gap:2px;display:flex}.panel-divider{background:var(--border);flex-shrink:0;height:1px}.panel-tab{padding:var(--space-1) var(--space-2);color:var(--text-muted);font-size:var(--font-size-sm);cursor:pointer;border-radius:var(--radius-sm);transition:background-color var(--transition-fast), color var(--transition-fast);background:0 0;border:none;flex:1;font-weight:500}.panel-tab:hover{background:var(--bg-surface-hover);color:var(--text-primary)}.panel-tab.active{background:color-mix(in srgb, var(--accent) 16%, transparent);color:var(--text-primary);font-weight:600}.panel-tab-content.hidden{visibility:hidden;pointer-events:none;position:absolute}.text-style-row,.layer-btns{align-items:center;gap:var(--space-1);display:flex}.panel-group{align-items:stretch;gap:var(--space-1);padding:var(--space-1) 0;flex-direction:column;display:flex}.panel-section{align-items:stretch;gap:var(--space-1);padding:var(--space-1) var(--space-1) var(--space-3) var(--space-3);border-left:2px solid color-mix(in srgb, var(--accent) 60%, transparent);flex-direction:column;display:flex}.panel-section+*{margin-top:var(--space-1)}.panel-section-heading{letter-spacing:.06em;text-transform:uppercase;color:var(--text-primary);font-size:12px;font-weight:700;line-height:1.2}.panel-section-body{align-items:stretch;gap:var(--space-2);flex-direction:column;margin-left:2px;display:flex}.panel-section .panel-group{padding:0}.panel-section .panel-group-body{min-height:24px}.panel-group-body{justify-content:flex-start;align-items:center;gap:var(--space-1);min-height:26px;display:flex}.panel-group-body.vertical{flex-direction:column;align-items:stretch}.panel-subtitle{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:9px;font-weight:500}.color-ramp-picker{gap:var(--space-1);flex-direction:column;width:100%;display:flex}.current-color{border:1px solid var(--border);border-radius:var(--radius-md);font:inherit;cursor:pointer;width:100%;transition:background var(--transition-fast), border-color var(--transition-fast);background:0 0;align-items:center;gap:8px;padding:3px 6px 3px 3px;display:flex}.current-color:hover{background:var(--bg-surface-hover)}.current-color.active{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent)}.chip-swatch{border-radius:var(--radius-sm);border:2px solid var(--border);flex:none;width:24px;height:24px;box-shadow:inset 0 0 0 1px #8080802e}.chip-name{font-size:var(--font-size-sm);color:var(--text-primary)}.transparent-checker{background-color:#fff;background-image:linear-gradient(45deg,#ccc 25%,#0000 25% 75%,#ccc 75%),linear-gradient(45deg,#ccc 25%,#0000 25% 75%,#ccc 75%);background-position:0 0,4px 4px;background-size:8px 8px}.matrix-3x5{grid-template-columns:repeat(5,28px);gap:6px;width:100%;display:grid}.matrix-cell,.matrix-cell.base-dot{aspect-ratio:1;border-radius:var(--radius-sm);border:1px solid var(--border);cursor:pointer;width:28px;height:28px;transition:box-shadow var(--transition-fast), transform var(--transition-fast);padding:0}.matrix-cell:hover,.matrix-cell.base-dot:hover{box-shadow:inset 0 0 0 1px #8080802e, 0 0 0 2px var(--accent);transform:scale(1.08)}.matrix-cell.active,.matrix-cell.base-dot.active{box-shadow:0 0 0 2px var(--bg-surface), 0 0 0 3.5px var(--accent)}.base-dots{grid-template-columns:repeat(8,1fr);gap:3px;width:100%;display:grid}.base-dot{aspect-ratio:1;border-radius:var(--radius-full);border:1.5px solid var(--border);cursor:pointer;width:100%;transition:box-shadow var(--transition-fast), transform var(--transition-fast);padding:0}.base-dot:hover{box-shadow:inset 0 0 0 1px #8080802e, 0 0 0 2px var(--accent)}.base-dot.active{box-shadow:0 0 0 2px var(--bg-surface), 0 0 0 3.5px var(--accent)}.color-submenu{width:190px;padding:var(--space-3);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);pointer-events:auto;flex-direction:column;gap:10px;animation:.14s cubic-bezier(.2,.8,.3,1) menu-in;display:flex}.properties-panel-container .color-popover{border-radius:var(--radius-lg);width:190px;box-shadow:var(--shadow-md);pointer-events:auto;position:static}.submenu-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.submenu-title-group{align-items:center;gap:8px;display:flex}.submenu-close{border-radius:var(--radius-sm);width:20px;height:20px;color:var(--text-muted);cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:16px;line-height:1;display:inline-flex}.submenu-close:hover{background:var(--bg-surface-hover);color:var(--text-primary)}.submenu-auto-btn{border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--font-size-xs);cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast);background:0 0;align-items:center;gap:8px;padding:4px 6px;display:flex}.submenu-auto-btn:hover{background:var(--bg-surface-hover)}.submenu-auto-btn.active{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent)}.submenu-intensity{flex-direction:column;gap:4px;display:flex}.color-popover{width:190px;padding:var(--space-3);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:200;flex-direction:column;gap:10px;animation:.14s cubic-bezier(.2,.8,.3,1) menu-in;display:flex;position:fixed}.pop-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.pop-title{font-family:var(--font-ui);font-size:var(--font-size-sm);text-transform:uppercase;color:var(--text-primary);font-weight:700}.pop-hex{font-family:var(--font-mono-ui);font-size:var(--font-size-xs);color:var(--text-muted)}.pop-preview{border:1px solid var(--border);border-radius:var(--radius-sm);background-image:linear-gradient(45deg,#80808024 25%,#0000 25% 75%,#80808024 75%),linear-gradient(45deg,#80808024 25%,#0000 25% 75%,#80808024 75%);background-position:0 0,6px 6px;background-size:12px 12px;place-items:center;height:64px;display:grid;overflow:hidden}.pop-preview svg{display:block}.ramp{grid-template-columns:repeat(5,28px);gap:6px;width:100%;display:grid}.ramp-cell{border-radius:var(--radius-sm);cursor:pointer;width:28px;height:28px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);border:1px solid #80808040;padding:0;position:relative}.ramp-cell:hover,.ramp-cell.hovered{box-shadow:0 0 0 2px var(--accent);z-index:2;transform:translateY(-2px)}.ramp-cell.selected{box-shadow:0 0 0 1.5px var(--bg-surface), 0 0 0 3px var(--accent);z-index:1}.ramp-cell.selected:hover,.ramp-cell.selected.hovered{box-shadow:0 0 0 1.5px var(--bg-surface), 0 0 0 3px var(--accent);z-index:2;transform:translateY(-2px)}.ramp-cell.selected:after{content:"✓";place-items:center;font-size:12px;font-weight:700;display:grid;position:absolute;inset:0}.ramp-cell.ink-dark:after{color:#ffffffeb}.ramp-cell.ink-light:after{color:#000000b8}.pop-hex-section{flex-direction:column;gap:4px;display:flex}.pop-hex-row{align-items:center;gap:6px;width:100%;display:flex}.pop-hex-swatch-wrap{cursor:pointer;border-radius:var(--radius-sm);border:1px solid #80808040;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;display:flex;position:relative;overflow:hidden}.pop-hex-swatch-wrap:hover{box-shadow:0 0 0 2px var(--accent)}.pop-hex-native{opacity:0;cursor:pointer;border:none;width:50px;height:50px;padding:0;position:absolute;top:-10px;left:-10px}.pop-hex-swatch{border-radius:inherit;pointer-events:none;width:100%;height:100%}.pop-hex-input-wrap{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface);height:28px;transition:border-color var(--transition-fast);flex:1;align-items:center;gap:2px;padding:0 6px;display:flex}.pop-hex-input-wrap:focus-within{border-color:var(--accent)}.pop-hex-prefix{font-family:var(--font-mono-ui);font-size:var(--font-size-sm);color:var(--text-muted);-webkit-user-select:none;user-select:none;line-height:1}.pop-hex-input{width:100%;height:100%;color:var(--text-primary);font-family:var(--font-mono-ui);font-size:var(--font-size-sm);text-transform:uppercase;background:0 0;border:none;outline:none;padding:0}.pop-hex-input::placeholder{color:var(--text-muted);opacity:.5}.pop-opacity{flex-direction:column;gap:4px;display:flex}.opacity-slider-wrap{z-index:1;align-items:center;height:16px;margin-bottom:22px;display:flex;position:relative}.opacity-range{appearance:none;background:var(--border);cursor:pointer;border-radius:999px;outline:none;width:100%;height:4px}.opacity-range::-webkit-slider-thumb{appearance:none;background:var(--bg-surface);border:2px solid var(--accent);cursor:pointer;border-radius:50%;width:14px;height:14px}.opacity-bubble{color:var(--text-primary);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);white-space:nowrap;pointer-events:none;padding:0 4px;font-size:9px;line-height:1.5;position:absolute;top:calc(50% + 11px);transform:translate(-50%)}.pop-hint{color:var(--text-muted);text-align:center;letter-spacing:.04em;font-size:9px}.pop-hint kbd{border:1px solid var(--border);border-radius:3px;padding:0 3px;font-family:inherit;font-size:9px}.size-btn{border:1px solid var(--border);border-radius:var(--radius-sm);width:28px;height:28px;color:var(--text-primary);cursor:pointer;background:0 0;flex:none;justify-content:center;align-items:center;gap:2px;padding:0;display:flex}.size-btn:hover{background:var(--bg-surface-hover)}.size-btn.active{border-color:var(--accent);background:var(--bg-surface-hover);box-shadow:inset 0 0 0 1px var(--accent)}.size-btn:disabled{opacity:.35;cursor:default}.size-btn:disabled:hover{background:0 0}.thickness-preview{background:currentColor;border-radius:2px;width:16px;display:block}.text-btn{font-size:var(--font-size-sm);font-weight:600}.line-style-btn svg{display:block}.arrowhead-grid{flex-direction:column;gap:2px;width:100%;display:flex}.arrowhead-row{justify-content:flex-start;align-items:center;gap:2px;display:flex}.arrowhead-btn{width:26px;height:26px}.spacing-row{align-items:center;gap:4px;width:100%;display:flex}.spacing-label{font-size:var(--font-size-sm);color:var(--text-secondary);white-space:nowrap;flex:1}.spacing-btn{border:1px solid var(--border);border-radius:var(--radius-sm);width:20px;height:20px;color:var(--text-primary);cursor:pointer;background:0 0;flex:none;justify-content:center;align-items:center;padding:0;font-size:12px;line-height:1;display:flex}.spacing-btn:hover{background:var(--bg-surface-hover)}.spacing-input{text-align:center;border:1px solid var(--border);border-radius:var(--radius-sm);width:36px;height:20px;color:var(--text-primary);font-size:var(--font-size-sm);-moz-appearance:textfield;background:0 0;padding:0}.spacing-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.spacing-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.spacing-input:focus{border-color:var(--accent);outline:none}.border-presets{gap:var(--space-1);display:flex}.v-stack{align-items:flex-start;gap:var(--space-2);flex-direction:column;display:flex}.corner-preview{background:0 0;border:2px solid;width:14px;height:14px;display:block}.corner-preview.square{border-radius:1px}.corner-preview.round{border-radius:50%}.corner-preview.custom{border-radius:45% 4% 4%}.radius-slider-wrap{z-index:1;align-items:center;margin-bottom:18px;display:flex;position:relative}.radius-slider{width:136px;accent-color:var(--accent)}.radius-bubble{color:var(--text-primary);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);white-space:nowrap;pointer-events:none;padding:0 4px;font-size:9px;line-height:1.5;position:absolute;top:calc(100% + 2px);transform:translate(-50%)}[data-tip]{position:relative}.panel-tooltip{z-index:1000;width:max-content;max-width:min(420px,100vw - 32px);padding:var(--space-1) var(--space-2);background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border);box-shadow:var(--shadow-md);font-size:var(--font-size-xs);border-radius:var(--radius-sm);pointer-events:none;position:fixed;transform:translateY(calc(-100% - 8px))}.bottom-right{bottom:var(--space-4);right:var(--space-4);align-items:center;gap:var(--space-2);display:flex;position:absolute}.zoom-widget,.focus-widget{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);align-items:center;padding:2px;display:flex}.zoom-btn{width:28px;height:28px;color:var(--text-primary);cursor:pointer;background:0 0;border:none;border-radius:5px;justify-content:center;align-items:center;display:flex}.zoom-btn:hover{background:var(--bg-surface-hover)}.zoom-btn:disabled{opacity:.35;cursor:default}.zoom-btn:disabled:hover{background:0 0}.zoom-level{min-width:52px;height:28px;color:var(--text-muted);font-size:var(--font-size-sm);font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:flex}.text-overlay{resize:none;white-space:pre;color:#0000;caret-color:#0000;pointer-events:none;min-width:1px;min-height:1em;font-family:var(--font-ui);box-shadow:none;appearance:none;background:0 0;border:none;outline:none;margin:0;padding:0;position:absolute;overflow:hidden}.text-overlay:focus{outline:none}.text-overlay::selection{color:#0000;background:0 0}.fake-selection{pointer-events:none;position:absolute;inset:0}.fake-selection-rect{background:var(--selection-color);opacity:.35;position:absolute}.fake-caret{pointer-events:none;background:currentColor;width:1px;animation:1s step-end infinite caret-blink;position:absolute}@keyframes caret-blink{0%,to{opacity:1}50%{opacity:0}}.label-overlay{text-align:center;white-space:pre-wrap;color:#0000;caret-color:#0000;pointer-events:auto;outline:none;transform:translate(-50%,-50%)}.status-bar{bottom:var(--space-4);left:var(--space-4);align-items:center;gap:var(--space-3);font-size:var(--font-size-xs);color:var(--text-muted);pointer-events:none;display:flex;position:absolute}.status-link{pointer-events:auto;color:var(--text-muted);font-size:inherit;cursor:pointer;background:0 0;border:none;padding:0;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.status-link:hover{color:var(--text-primary)}.status-version{color:var(--text-muted);-webkit-user-select:none;user-select:none}.status-stats{align-items:center;gap:var(--space-3);display:flex}.status-saved{color:var(--accent)}.toast-stack{align-items:center;gap:var(--space-2);z-index:60;pointer-events:none;flex-direction:column;display:flex;position:absolute;top:60px;left:50%;transform:translate(-50%)}.toast{padding:var(--space-2) var(--space-4);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-full);box-shadow:var(--shadow-md);color:var(--text-primary);font-size:var(--font-size-md);animation:toast-in var(--transition-med)}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.modal-backdrop{z-index:80;background:#00000059;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.shortcuts-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);width:min(480px,100vw - 48px);max-height:calc(100vh - 32px);box-shadow:var(--shadow-md);flex-direction:column;display:flex;overflow:hidden}.shortcuts-header{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border);color:var(--text-primary);justify-content:space-between;align-items:center;font-weight:600;display:flex}.shortcuts-body{gap:0 var(--space-4);padding:var(--space-2) var(--space-3);grid-template-columns:1fr 1fr;display:grid;overflow-y:auto}.shortcuts-column{flex-direction:column;display:flex}.shortcuts-column+.shortcuts-column{border-left:1px solid var(--border);padding-left:var(--space-4)}.shortcuts-section{flex-direction:column;display:flex}.shortcuts-section+.shortcuts-section{padding-top:var(--space-2);margin-top:var(--space-2);border-top:1px solid var(--border)}.shortcuts-section-title{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:var(--space-2);font-weight:600}.shortcut-row{justify-content:space-between;align-items:center;gap:var(--space-3);font-size:var(--font-size-sm);color:var(--text-primary);padding:2px 0;display:flex}.shortcut-desc{color:var(--text-secondary)}.shortcut-row kbd{background:var(--bg-surface-hover);border:1px solid var(--border);border-radius:var(--radius-sm);white-space:nowrap;color:var(--text-primary);border-bottom-width:2px;padding:1px 6px;font-family:inherit;font-size:11px}.empty-state{text-align:center;color:var(--text-muted);opacity:.38;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;max-width:780px;padding:var(--space-5);box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;animation:.4s empty-in;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.empty-brand{justify-content:center;align-items:center;gap:var(--space-4);display:flex}.empty-brand-text{flex-direction:column;align-items:flex-start;width:max-content;display:flex}.empty-logo{width:115px;height:110px;color:var(--text-muted);flex-shrink:0}.empty-brand-name{letter-spacing:.05em;color:var(--text-muted);white-space:nowrap;font-family:Architects Daughter,cursive,sans-serif;font-size:86px;font-weight:600;line-height:.95}.empty-state .empty-title{box-sizing:border-box;text-align:justify;text-align-last:justify;white-space:nowrap;width:98%;color:var(--text-muted);opacity:.85;margin-top:5px;font-family:Caveat,Architects Daughter,cursive;font-size:32px;font-weight:400;line-height:1.15}@keyframes empty-in{0%{opacity:0}to{opacity:.38}}.hint{bottom:var(--space-2);left:var(--space-4);font-size:var(--font-size-xs);color:var(--text-muted);opacity:.7;pointer-events:none;position:absolute}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.library-panel{top:calc(var(--space-3) + 48px);right:var(--space-4);gap:var(--space-2);width:228px;padding:var(--space-3) var(--space-2) var(--space-2);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);flex-direction:column;max-height:calc(100% - 120px);display:flex;position:absolute;overflow:hidden}.library-header{padding:0 var(--space-1);justify-content:space-between;align-items:center;display:flex}.library-close{width:24px;height:24px;font-size:16px}.library-header-actions{align-items:center;gap:2px;display:flex}.library-import{justify-content:center;align-items:center;width:24px;height:24px;padding:0;display:flex}.library-import-input{display:none}.library-section-row{align-items:center;gap:2px;display:flex}.library-section-row .library-section-header{flex:1;min-width:0}.library-group-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.library-group-remove{width:20px;height:20px;color:var(--text-muted);font-size:14px}.library-group-export{width:20px;height:20px;color:var(--text-muted)}.library-error{font-size:var(--font-size-xs);color:var(--color-danger,#d64545);padding:2px var(--space-1)}.library-search{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font:inherit;font-size:var(--font-size-sm);background:0 0;outline:none;padding:6px 8px}.library-search:focus{box-shadow:var(--focus-ring)}.library-body{scrollbar-width:thin;gap:var(--space-3);min-height:0;padding:0 2px var(--space-1);flex-direction:column;flex:auto;display:flex;overflow:hidden auto}.library-subgroup,.library-section{gap:var(--space-1);flex-direction:column;display:flex}.library-grid{justify-content:space-between;row-gap:var(--space-1);grid-template-columns:repeat(5,36px);display:grid}.library-tile{border-radius:var(--radius-sm);cursor:grab;background:0 0;border:none;justify-content:center;align-items:center;width:36px;min-width:0;height:36px;padding:0;display:flex}.library-tile:active{cursor:grabbing}.library-tile:hover{background:var(--bg-surface-hover)}.library-section-header{align-items:center;gap:var(--space-1);color:var(--text-primary);font-size:var(--font-size-xs);letter-spacing:.04em;padding:2px var(--space-1);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;font-weight:600;display:flex}.library-section-header:hover{background:var(--bg-surface-hover)}.library-chevron{transition:transform var(--transition-fast);color:var(--text-muted)}.library-chevron.open{transform:rotate(90deg)}.library-empty{font-size:var(--font-size-sm);color:var(--text-muted);padding:var(--space-3) var(--space-1);text-align:center}.library-card-img{pointer-events:none;display:block}.library-tile-wrap{width:36px;height:36px;position:relative}.library-tile-remove{background:var(--bg-surface-hover);width:16px;height:16px;color:var(--text-muted);opacity:0;transition:opacity var(--transition-fast);border-radius:50%;padding:0;font-size:12px;line-height:1;position:absolute;top:-7px;right:-7px}.library-tile-wrap:hover .library-tile-remove{opacity:1}.library-tile-remove:hover{color:var(--color-danger,#d64545)}.context-menu{min-width:190px;padding:var(--space-1);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:90;transform-origin:0 0;flex-direction:column;animation:.14s cubic-bezier(.2,.8,.3,1) menu-in;display:flex;position:fixed}.context-menu-item{color:var(--text-primary);font-size:var(--font-size-md);text-align:left;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);cursor:pointer;align-items:center;gap:var(--space-2);background:0 0;border:none;display:flex}.context-menu-item:hover{background:var(--bg-surface-hover)}.context-menu-header{padding:var(--space-2) var(--space-3) var(--space-1);font-size:var(--font-size-xs);letter-spacing:.08em;color:var(--text-muted);font-weight:700}.context-menu-divider{height:1px;margin:var(--space-1) var(--space-2);background:var(--border)}.context-menu-item-shortcut{color:var(--text-muted);font-size:var(--font-size-xs);flex-shrink:0;margin-left:auto}.context-menu-empty{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);color:var(--text-muted)}.context-menu-parent{position:relative}.context-menu-submenu{min-width:160px;padding:var(--space-1);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);flex-direction:column;display:flex;position:absolute;top:-1px;left:100%}.details-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);width:min(480px,100vw - 48px);box-shadow:var(--shadow-md);flex-direction:column;display:flex}.details-modal-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);color:var(--text-primary);justify-content:space-between;align-items:center;font-weight:600;display:flex}.details-modal-body{padding:var(--space-3) var(--space-4)}.details-modal-textarea{resize:vertical;background:var(--bg-canvas);width:100%;min-height:160px;color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);font-size:var(--font-size-md);font-family:inherit;line-height:1.5}.details-modal-textarea:focus{border-color:var(--accent);outline:none}.details-modal-footer{justify-content:flex-end;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);display:flex}.tool-btn.primary{background:var(--accent);color:var(--on-accent);border-radius:var(--radius-sm);padding:0 var(--space-3);width:auto;height:36px}.tool-btn.primary:hover{filter:brightness(1.08)}.hover-info-box{width:max-content;max-width:min(420px,100vw - 32px);max-height:min(60vh,460px);padding:var(--space-2) var(--space-3);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:200;pointer-events:auto;flex-direction:column;display:flex;position:fixed}.hover-info-box--resized{max-width:calc(100vw - 16px);max-height:calc(100vh - 16px)}.hover-info-title{font-size:var(--font-size-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;flex:none;font-weight:600}.hover-info-sep{margin:var(--space-2) 0;border-top:1px solid var(--border);flex:none}.hover-info-body{overscroll-behavior:contain;min-height:0;font-size:var(--font-size-md);color:var(--text-primary);word-break:break-word;flex:auto;line-height:1.45;overflow-y:auto}.hover-info-resize{cursor:nwse-resize;touch-action:none;border-bottom-right-radius:var(--radius-md);background-image:linear-gradient(135deg, transparent 0 25%, var(--text-muted) 25% 35%, transparent 35% 55%, var(--text-muted) 55% 65%, transparent 65% 85%, var(--text-muted) 85% 95%, transparent 95%);opacity:.5;background-position:100% 100%;background-repeat:no-repeat;background-size:14px 14px;width:18px;height:18px;transition:opacity .15s,background-color .15s;position:absolute;bottom:0;right:0}.hover-info-resize:hover,.hover-info-resize:focus-visible{opacity:1;background-color:#0000000f}[data-theme=dark] .hover-info-resize:hover,[data-theme=dark] .hover-info-resize:focus-visible{background-color:#ffffff1a}.hover-info-resize:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.md-root>:first-child{margin-top:0}.md-root>:last-child{margin-bottom:0}.md-p{margin:0 0 var(--space-2)}.md-h{margin:var(--space-3) 0 var(--space-1);color:var(--text-primary);font-weight:600;line-height:1.3}.md-h1{font-size:var(--font-size-lg)}.md-h2{font-size:15px}.md-h3,.md-h4,.md-h5,.md-h6{font-size:var(--font-size-md);color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}.md-ul,.md-ol{margin:0 0 var(--space-2);padding-left:1.15em}.md-li{margin:0 0 2px}.md-li::marker{color:var(--text-muted)}.md-quote{margin:0 0 var(--space-2);padding:var(--space-1) 0 var(--space-1) var(--space-3);border-left:2px solid var(--border);color:var(--text-muted)}.md-hr{margin:var(--space-3) 0;border:none;border-top:1px solid var(--border)}.md-code-inline{border-radius:var(--radius-sm);background:var(--bg-surface-hover);font-family:var(--font-mono-ui);font-size:var(--font-size-sm);padding:1px 4px}.md-pre{margin:0 0 var(--space-2);padding:var(--space-2);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface-hover);font-family:var(--font-mono-ui);font-size:var(--font-size-sm);line-height:1.4;overflow-x:auto}.md-pre code{font:inherit}.md-tok{color:var(--text-primary)}.md-tok-key{color:var(--code-key);font-weight:600}.md-tok-string{color:var(--code-string)}.md-tok-number{color:var(--code-number)}.md-tok-boolean{color:var(--code-boolean)}.md-tok-punct{color:var(--text-muted)}.md-tok-comment{color:var(--text-muted);font-style:italic}.md-table{width:100%;margin:0 0 var(--space-2);border-collapse:collapse;font-size:var(--font-size-sm)}.md-table th,.md-table td{padding:3px var(--space-2);border:1px solid var(--border);text-align:left}.md-table th{background:var(--bg-surface-hover);font-weight:600}.md-link{color:var(--accent);text-underline-offset:2px;text-decoration:underline}.md-image{border:1px dashed var(--border);border-radius:var(--radius-sm);color:var(--text-muted);padding:0 4px;font-style:italic}:root[data-skin=blueprint] .toolbar,:root[data-skin=blueprint] .workspace-panel,:root[data-skin=blueprint] .properties-panel,:root[data-skin=blueprint] .menu-btn,:root[data-skin=blueprint] .corner-toggle,:root[data-skin=blueprint] .menu-dropdown,:root[data-skin=blueprint] .zoom-widget,:root[data-skin=blueprint] .focus-widget,:root[data-skin=blueprint] .color-popover,:root[data-skin=blueprint] .context-menu,:root[data-skin=blueprint] .hover-info-box,:root[data-skin=blueprint] .panel-tooltip,:root[data-skin=blueprint] .toast,:root[data-skin=blueprint] .shortcuts-modal,:root[data-skin=blueprint] .tab-confirm,:root[data-skin=blueprint] .details-modal,:root[data-skin=blueprint] .export-image-modal,:root[data-skin=blueprint] .save-modal,:root[data-skin=blueprint] .library-panel{border:1.5px solid var(--text-primary);border-radius:var(--radius-md);box-shadow:var(--shadow-md)}:root[data-skin=blueprint] .menu-btn.active,:root[data-skin=blueprint] .corner-toggle.open{border-color:var(--accent)}:root[data-skin=blueprint] .toolbar-sep{width:1.5px}:root[data-skin=blueprint] .chip-swatch,:root[data-skin=blueprint] .base-dot,:root[data-skin=blueprint] .ramp-cell{border:1.5px solid var(--text-primary)}:root[data-skin=blueprint] .size-btn{border:1.5px solid var(--border)}:root[data-skin=blueprint] .panel-tab.active{background:var(--bg-surface-hover);border:1px dashed var(--accent)}:root[data-skin=blueprint] .panel-subtitle,:root[data-skin=blueprint] .menu-section-title,:root[data-skin=blueprint] .hover-info-title{font-weight:700}:root[data-skin=blueprint] .tree-row,:root[data-skin=blueprint] .zoom-level,:root[data-skin=blueprint] .status-bar{letter-spacing:.03em;font-weight:600}:root[data-skin=midnight] .panel-subtitle,:root[data-skin=midnight] .menu-section-title,:root[data-skin=midnight] .hover-info-title,:root[data-skin=midnight] .status-bar,:root[data-skin=midnight] .tree-row,:root[data-skin=midnight] .zoom-level{font-family:var(--font-mono-ui)}:root[data-skin=warm] .panel-tab.active{background:var(--bg-surface-hover)}:root[data-skin=swiss] .toolbar,:root[data-skin=swiss] .workspace-panel,:root[data-skin=swiss] .properties-panel,:root[data-skin=swiss] .menu-btn,:root[data-skin=swiss] .corner-toggle,:root[data-skin=swiss] .menu-dropdown,:root[data-skin=swiss] .zoom-widget,:root[data-skin=swiss] .focus-widget,:root[data-skin=swiss] .color-popover,:root[data-skin=swiss] .context-menu,:root[data-skin=swiss] .hover-info-box,:root[data-skin=swiss] .panel-tooltip,:root[data-skin=swiss] .toast,:root[data-skin=swiss] .shortcuts-modal,:root[data-skin=swiss] .tab-confirm,:root[data-skin=swiss] .details-modal,:root[data-skin=swiss] .export-image-modal,:root[data-skin=swiss] .save-modal,:root[data-skin=swiss] .library-panel{border:2px solid var(--text-primary);box-shadow:var(--shadow-md);border-radius:0}:root[data-skin=swiss] .menu-btn.active,:root[data-skin=swiss] .corner-toggle.open{border-color:var(--text-primary);background:var(--text-primary);color:var(--bg-surface)}:root[data-skin=swiss] .zoom-btn,:root[data-skin=swiss] .tool-btn,:root[data-skin=swiss] .corner-toggle{border-radius:0}:root[data-skin=swiss] .tool-btn.active,:root[data-skin=swiss] .tree-row.active{background:var(--text-primary);color:var(--bg-surface)}:root[data-skin=swiss] .tree-row.ws-row.active{color:var(--text-primary);background:0 0}:root[data-skin=swiss] .tree-row.canvas-row.active .tree-name,:root[data-skin=swiss] .tree-row.canvas-row.active .icon-btn{color:var(--bg-surface)}:root[data-skin=swiss] .toolbar-sep{background:var(--text-primary);width:2px;height:26px}:root[data-skin=swiss] .chip-swatch,:root[data-skin=swiss] .base-dot,:root[data-skin=swiss] .ramp-cell,:root[data-skin=swiss] .size-btn{border:1.5px solid var(--text-primary);border-radius:0}:root[data-skin=swiss] .size-btn.active{background:var(--text-primary);color:var(--bg-surface);border-color:var(--text-primary);box-shadow:none}:root[data-skin=swiss] .panel-tab.active{box-shadow:inset 0 -3px 0 var(--accent);background:0 0}:root[data-skin=swiss] .panel-tab,:root[data-skin=swiss] .tree-row,:root[data-skin=swiss] .menu-section-title,:root[data-skin=swiss] .panel-subtitle,:root[data-skin=swiss] .hover-info-title,:root[data-skin=swiss] .status-bar{text-transform:uppercase;letter-spacing:.06em;font-weight:700}:root[data-skin=swiss] .zoom-level{color:var(--text-primary);font-weight:700}:root[data-skin=swiss] .export-image-option{border:1.5px solid var(--text-primary);border-radius:0}:root[data-skin=swiss] .btn-secondary,:root[data-skin=swiss] .btn-primary{border-radius:0}.export-image-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);width:min(380px,100vw - 48px);max-height:min(400px,100vh - 48px);box-shadow:var(--shadow-md);overflow-y:auto}.export-image-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);color:var(--text-primary);justify-content:space-between;align-items:center;font-weight:600;display:flex}.export-image-body{padding:var(--space-4)}.export-image-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3);font-size:12px;font-weight:600}.export-image-options{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.export-image-option{align-items:center;gap:var(--space-2);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-secondary);cursor:pointer;flex-direction:column;transition:all .15s;display:flex}.export-image-option:hover{border-color:var(--accent);color:var(--text-primary)}.export-image-option.active{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 16%, transparent);color:var(--accent)}.export-image-option-title{font-size:14px;font-weight:600}.export-image-option-desc{opacity:.7;font-size:11px}.export-image-footer{justify-content:flex-end;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);display:flex}.btn-secondary{padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-secondary);cursor:pointer;font-size:13px;font-weight:500;transition:all .15s}.btn-secondary:hover{border-color:var(--text-secondary);color:var(--text-primary)}.btn-primary{padding:var(--space-2) var(--space-3);border:1px solid var(--accent);border-radius:var(--radius-sm);background:var(--accent);color:#fff;cursor:pointer;font-size:13px;font-weight:500;transition:all .15s}.btn-primary:hover{opacity:.9}.save-modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-md);width:min(380px,100vw - 48px);max-height:min(400px,100vh - 48px);box-shadow:var(--shadow-md);overflow-y:auto}.save-modal-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);color:var(--text-primary);justify-content:space-between;align-items:center;font-weight:600;display:flex}.save-modal-body{padding:var(--space-4)}.save-modal-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-3);font-size:12px;font-weight:600}.save-modal-options{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.save-modal-option{align-items:center;gap:var(--space-2);padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-secondary);cursor:pointer;flex-direction:column;transition:all .15s;display:flex}.save-modal-option:hover{border-color:var(--accent);color:var(--text-primary)}.save-modal-option.active{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 16%, transparent);color:var(--accent)}.save-modal-option-title{font-size:14px;font-weight:600}.save-modal-option-desc{opacity:.7;text-align:center;font-size:11px}.save-modal-footer{justify-content:flex-end;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--border);display:flex}