:root{--n-bg-base:#fff;--n-bg-default:var(--n-bg-base);--n-bg-elevated:#fff;--n-bg-subtle:#fbfbfa;--n-bg-hover:#f1f1f0;--n-bg-sidebar:#f7f6f3;--n-bg-canvas:#f7f6f3;--n-bg-inverse:#2f3437;--notion-bg:var(--n-bg-base);--notion-sidebar:var(--n-bg-sidebar);--notion-canvas:var(--n-bg-canvas);--notion-surface:var(--n-bg-elevated);--notion-text:var(--n-fg-default);--notion-text-secondary:var(--n-fg-secondary);--notion-text-tertiary:var(--n-fg-tertiary);--notion-text-disabled:var(--n-fg-disabled);--notion-border:var(--n-border-default);--notion-border-strong:var(--n-border-strong);--notion-hover:var(--n-bg-hover);--notion-active:#37352f1f;--notion-selected:#2383e229;--notion-blue:var(--n-brand);--notion-red:var(--n-danger);--notion-green:var(--n-success);--n-fg-default:#37352f;--n-fg-secondary:#787774;--n-fg-tertiary:#9b9a97;--n-fg-disabled:#c4c4c2;--n-fg-link:#2383e2;--n-fg-onbrand:#fff;--n-brand:#2383e2;--n-brand-hover:#1a72cf;--n-brand-active:#1761b3;--n-brand-disabled:#2383e266;--n-success:#0f7b6c;--n-warning:#cb912f;--n-danger:#e03e3e;--n-border-default:#e9e9e7;--n-border-strong:#d3d3d0;--n-border-focus:#2383e266;--n-radius-sm:4px;--n-radius-md:5px;--n-radius-lg:6px;--n-radius-xl:8px;--n-shadow-card:0 1px 3px #0f0f0f0a, 0 0 0 1px #0f0f0f0a;--n-shadow-pop:0 4px 12px #0f0f0f0d, 0 0 0 1px #0f0f0f0a;--n-shadow-overlay:0 12px 32px #0f0f0f24, 0 3px 8px #0f0f0f14;--n-ring-focus:0 0 0 2px var(--n-bg-base), 0 0 0 4px var(--n-border-focus);--n-font-sans:ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;--n-font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--n-ease:cubic-bezier(.165, .84, .44, 1);--n-ease-out:var(--n-ease);--n-duration-fast:.12s;--n-duration-base:.18s;--n-duration-slow:.24s;--bg-base-default:var(--n-bg-elevated);--bg-base-secondary:var(--n-bg-subtle);--bg-base-tertiary:var(--n-bg-sidebar);--canvas-bg:var(--n-bg-canvas);--bg-overlay-l1:#73737314;--bg-overlay-l2:#7373731f;--bg-overlay-l3:#73737329;--bg-overlay-l4:#73737333;--bg-menu:var(--n-bg-elevated);--bg-tooltip:var(--n-bg-elevated);--bg-invert:#262626;--bg-invert-hover:#404040;--bg-invert-active:#171717;--bg-brand:var(--n-brand);--bg-brand-hover:var(--n-brand-hover);--bg-brand-active:var(--n-brand-active);--bg-brand-disabled:#2383e238;--bg-brand-popup:#2383e224;--text-default:var(--n-fg-default);--text-default-hover:#262626;--text-secondary:var(--n-fg-secondary);--text-tertiary:var(--n-fg-tertiary);--text-disabled:var(--n-fg-disabled);--text-onbrand:var(--n-fg-onbrand);--text-brand:var(--n-brand);--icon-default:var(--n-fg-default);--icon-secondary:var(--n-fg-secondary);--icon-tertiary:var(--n-fg-tertiary);--icon-disabled:var(--n-fg-disabled);--icon-onbrand:var(--n-fg-onbrand);--icon-brand:var(--n-brand);--border-neutral-l1:#e9e9e7;--border-neutral-l2:#d3d3d0;--border-neutral-l3:#b8b8b5;--border-contrast:#000;--border-brand:var(--n-brand);--accent-teal:#00b983;--accent-coral:#ff6b45;--accent-amber:#f2a90c;--accent-lime:#5fc000;--accent-cyan:#00b6f5;--accent-blue:var(--n-brand);--status-success-default:var(--n-success);--status-warning-default:var(--n-warning);--status-error-default:var(--n-danger);--font-family-default:var(--n-font-sans);--font-family-heading:var(--n-font-sans);--font-family-metric:var(--n-font-sans);--font-family-mono:var(--n-font-mono);--font-weight-default:400;--font-weight-code:450;--font-weight-medium:500;--font-weight-strong:600;--topbar-height:45px;--statusbar-height:24px;--source-col:260px;--inspector-col:320px;--text-xs:11px;--text-sm:12px;--text-base:14px;--text-lg:16px;--text-xl:18px;--text-2xl:22px;--text-3xl:28px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-12:48px;--spacer-2:2px;--spacer-4:4px;--spacer-6:6px;--spacer-8:8px;--spacer-10:10px;--spacer-12:12px;--spacer-14:14px;--spacer-16:16px;--spacer-18:18px;--spacer-20:20px;--spacer-24:24px;--spacer-32:32px;--spacer-40:40px;--spacer-48:48px;--radius-0:0px;--radius-2:2px;--radius-4:4px;--radius-6:6px;--radius-sm:var(--n-radius-sm);--radius-md:var(--n-radius-md);--radius-lg:var(--n-radius-lg);--radius-pill:999px;--radius-8:8px;--radius-12:12px;--radius-16:16px;--radius-full:999px;--motion-fast:.12s;--motion-base:.18s;--motion-exit:.14s;--motion-spring:.24s;--ease-standard:var(--n-ease);--ease-emphasized:cubic-bezier(.22, 1, .36, 1);--ease-soft-end:cubic-bezier(.16, 1, .3, 1);--ease-exit:cubic-bezier(.4, 0, 1, 1);--ease-quint:cubic-bezier(.22, 1, .36, 1);--status-primary-default:var(--n-brand);--status-primary-surface-l1:#2383e21a;--status-success-surface-l1:#0f7b0f1a;--status-warning-surface-l1:#cb912f1f;--status-error-surface-l1:#e03e3e1a;--text-muted:var(--n-fg-tertiary);--border-width-default:1px;--shadow-popover:var(--n-shadow-overlay);--resizer-width:6px;--canvas-toolbar-height:44px;--leading-body:1.5;--leading-tight:1.2;--elev-flat:none;--elev-ring:0 0 0 1px var(--n-border-default);--elev-raised:0 1px 2px #0f0f0f0a;--elev-floating:0 2px 8px #0f0f0f14;--elev-window:0 4px 16px #0f0f0f1f;--surface-glass:var(--n-bg-elevated);--surface-glass-strong:var(--n-bg-elevated);--surface-glass-pressed:var(--n-bg-hover);--surface-vibrancy:none;--surface-vibrancy-strong:none;--surface-vibrancy-soft:none;--press-scale-icon:1;--press-scale-button:1;--press-scale-card:1;--motion-pane-enter:var(--n-duration-slow);--motion-pane-exit:var(--n-duration-base);--press-scale-numeric:1;--press-scale-swatch:1;--topbar-blur:none;--focus-ring:0 0 0 3px #2383e238;--focus-halo:0 0 0 2px var(--n-bg-base), 0 0 0 4px var(--n-border-focus);--hover-lift-y:0}.dark{--n-bg-base:#191919;--n-bg-default:var(--n-bg-base);--n-bg-elevated:#202020;--n-bg-subtle:#252525;--n-bg-hover:#2a2a2a;--n-bg-sidebar:#202020;--n-bg-canvas:#2c2c2c;--n-bg-inverse:#e8e8e8;--n-fg-default:#ffffffe6;--n-fg-secondary:#ffffffa8;--n-fg-tertiary:#ffffff73;--n-fg-disabled:#ffffff40;--n-fg-link:#4dabf7;--n-fg-onbrand:#191919;--n-brand:#4dabf7;--n-brand-hover:#5bb8ff;--n-brand-active:#3d9be6;--n-brand-disabled:#4dabf759;--n-success:#4caf50;--n-warning:#f5c542;--n-danger:#f44336;--n-border-default:#ffffff1a;--n-border-strong:#ffffff29;--n-border-focus:#4dabf773;--n-shadow-card:0 1px 3px #0006;--n-shadow-pop:0 6px 16px #00000080;--n-shadow-overlay:0 12px 32px #0009;--n-ring-focus:0 0 0 2px #191919, 0 0 0 4px #4dabf773;--n-font-sans:ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;--n-font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--n-ease:cubic-bezier(.165, .84, .44, 1);--n-duration-fast:.12s;--n-duration-base:.18s;--n-duration-slow:.24s;--bg-base-default:var(--n-bg-elevated);--bg-base-secondary:var(--n-bg-subtle);--bg-base-tertiary:var(--n-bg-sidebar);--canvas-bg:var(--n-bg-canvas);--text-default:var(--n-fg-default);--text-secondary:var(--n-fg-secondary);--text-tertiary:var(--n-fg-tertiary);--text-disabled:var(--n-fg-disabled);--bg-brand:var(--n-brand);--bg-brand-hover:var(--n-brand-hover);--bg-brand-active:var(--n-brand-active);--border-neutral-l1:var(--n-border-default);--border-neutral-l2:var(--n-border-strong);--border-neutral-l3:#ffffff3d;--bg-invert:#e8e8e8;--bg-invert-hover:#d4d4d4;--bg-invert-active:#ccc;--surface-glass:var(--n-bg-elevated);--surface-glass-strong:var(--n-bg-elevated);--surface-glass-pressed:var(--n-bg-hover);--surface-vibrancy:none;--surface-vibrancy-strong:none;--surface-vibrancy-soft:none;--elev-raised:0 1px 3px #0000004d;--elev-floating:0 2px 8px #00000059;--elev-window:0 4px 16px #0006;--focus-halo:0 0 0 2px var(--n-bg-elevated), 0 0 0 4px var(--n-border-focus);--focus-ring:0 0 0 3px #4dabf740}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;height:100%}body{background:var(--n-bg-base);min-height:100%;color:var(--n-fg-default);font-family:var(--n-font-sans);font-size:var(--text-base,14px);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;line-height:1.5;overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}button:disabled{cursor:not-allowed}svg{width:18px;height:18px;display:block}h1,h2,h3,h4{font-family:var(--n-font-sans);letter-spacing:-.01em;text-wrap:balance;margin:0}p{text-wrap:pretty;margin:0}ul,ol{margin:0;padding:0;list-style:none}input,select,textarea{font-family:inherit}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}.nw-app.app-shell{flex-direction:column;width:100vw;height:100dvh;display:flex;overflow:hidden}.app-topbar{height:var(--topbar-height,45px);min-height:var(--topbar-height,45px);border-bottom:1px solid var(--n-border-default);background:var(--n-bg-base);z-index:2;flex-shrink:0;align-items:center;gap:0;min-width:0;padding:0 12px;display:flex;position:relative}.app-topbar-brand{width:var(--source-col,260px);flex-shrink:0;align-items:center;gap:8px;display:flex}.app-topbar-title{color:var(--n-fg-default);font-size:13px;font-weight:600;line-height:1}.app-topbar-path{min-width:0;color:var(--n-fg-tertiary);white-space:nowrap;align-items:center;gap:7px;font-size:12px;line-height:1;display:inline-flex}.app-topbar-path>span:last-child{text-overflow:ellipsis;max-width:148px;overflow:hidden}.app-topbar-path__separator{color:var(--n-fg-disabled)}.app-topbar-center{flex:1;justify-content:center;align-items:center;gap:4px;min-width:0;display:flex}.topbar-separator{background:var(--n-border-default);width:1px;height:16px;margin:0 4px}.app-topbar-actions{flex-shrink:0;justify-content:flex-end;align-items:center;gap:3px;width:420px;display:flex}.topbar-history-actions{align-items:center;gap:2px;display:inline-flex}.topbar-file-actions{border:1px solid var(--n-border-default);border-radius:var(--n-radius-lg);background:var(--n-bg-subtle);align-items:center;gap:2px;height:30px;padding:2px;display:inline-flex}.topbar-file-actions .topbar-file-action{border-radius:var(--n-radius-sm);border:0;gap:5px;min-width:0;height:26px;padding:0 8px;font-size:12px;line-height:1}.topbar-file-actions .topbar-file-action svg{flex:0 0 14px;width:14px;height:14px}.topbar-file-actions .topbar-export-action{min-width:68px;margin-left:2px;padding-inline:10px;font-weight:600}.statusbar{height:var(--statusbar-height,24px);min-height:var(--statusbar-height,24px);border-top:1px solid var(--n-border-default);background:var(--n-bg-base);color:var(--n-fg-tertiary);flex-shrink:0;align-items:center;gap:12px;padding:0 12px;font-size:11px;display:flex}.statusbar-zone{align-items:center;gap:8px;display:flex}.statusbar-zone--left{flex:1;justify-content:flex-start}.statusbar-zone--center{flex:0;justify-content:center}.statusbar-zone--right{flex:1;justify-content:flex-end}.statusbar-pill{align-items:center;gap:5px;display:inline-flex}.statusbar-pill .dot{background:var(--n-fg-tertiary);border-radius:50%;flex-shrink:0;width:6px;height:6px}.statusbar-pill--busy .dot{background:var(--n-brand)}.statusbar-pill--warning .dot{background:var(--n-warning)}.statusbar-pill--error .dot{background:var(--n-danger)}.statusbar-pill--live{white-space:nowrap;text-overflow:ellipsis;background:0 0;border-radius:0;max-width:320px;padding:0;font-size:11px;overflow:hidden}.statusbar-live-text{text-overflow:ellipsis;overflow:hidden}.statusbar-sep{background:var(--n-border-default);flex-shrink:0;width:1px;height:12px}.statusbar-metric{white-space:nowrap;font-variant-numeric:tabular-nums}.empty-workspace{background:var(--n-bg-canvas);text-align:center;transition:background var(--n-duration-fast) var(--n-ease);flex-direction:column;flex:1;justify-content:center;align-items:center;padding:24px;display:flex;overflow:auto}.empty-workspace--drag-over{background:var(--n-bg-subtle)}.empty-workspace__illustration{justify-content:center;align-items:center;width:200px;height:160px;display:flex}.empty-workspace__title{color:var(--n-fg-default);margin:0;font-size:20px;font-weight:600;line-height:1.4}.empty-workspace__description{color:var(--n-fg-secondary);max-width:420px;margin:12px 0 0;font-size:13px;line-height:1.6}.empty-workspace__cta{background:var(--n-brand);height:36px;color:var(--n-fg-onbrand);border-radius:var(--n-radius-md);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);border:none;margin-top:28px;padding:0 20px;font-size:14px;font-weight:500;line-height:36px}.empty-workspace__cta:hover{background:var(--n-brand-hover)}.empty-workspace__cta:active{background:var(--n-brand-active)}.empty-workspace__cta:focus-visible{outline:2px solid var(--n-border-focus);outline-offset:2px}.empty-workspace__link{color:var(--n-fg-link);cursor:pointer;font-size:13px;font-family:var(--n-font-sans);transition:text-decoration var(--n-duration-fast) var(--n-ease);background:0 0;border:none;margin-top:14px;padding:0;text-decoration:none}.empty-workspace__link:hover{text-decoration:underline}.nw-body.workspace{flex:1;display:flex;position:relative;overflow:hidden}.nw-left-panel,.nw-right-panel{flex-direction:column;flex-shrink:0;display:flex;position:relative;overflow:hidden}.nw-left-panel{width:var(--source-col,260px)}.nw-right-panel{width:var(--inspector-col,320px)}.nw-left-panel>.panel-resizer,.nw-right-panel>.panel-resizer{z-index:8;width:10px;height:auto;position:absolute;top:0;bottom:0}.nw-left-panel>.panel-resizer{right:0}.nw-right-panel>.panel-resizer{left:0}.nw-canvas{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.panel.is-collapsed{border:0;margin:0;padding:0;overflow:hidden;width:0!important}.ds-tooltip{z-index:9999;border-radius:var(--n-radius-md);background:var(--n-bg-elevated);max-width:280px;color:var(--n-fg-default);font-family:var(--n-font-sans);font-size:var(--text-sm,12px);font-weight:var(--font-weight-default,400);text-align:center;white-space:nowrap;word-wrap:break-word;pointer-events:none;-webkit-user-select:none;user-select:none;opacity:0;transition:opacity var(--n-duration-fast) var(--n-ease), transform var(--n-duration-base) var(--n-ease);border:1px solid var(--n-border-default);box-shadow:var(--elev-floating,0 2px 8px #0f0f0f14);padding:5px 9px;line-height:1.45;position:fixed;transform:translateY(4px)}.ds-tooltip kbd{border-radius:var(--n-radius-sm);background:var(--n-bg-hover);min-width:18px;height:18px;color:var(--n-fg-secondary);font-family:var(--n-font-mono);font-size:11px;font-weight:var(--font-weight-medium,500);white-space:nowrap;justify-content:center;align-items:center;margin:0 2px;padding:0 5px;line-height:1;display:inline-flex}.custom-select{display:inline-flex;position:relative}.custom-select-trigger{border:1px solid var(--n-border-default);border-radius:var(--n-radius-md);background:var(--n-bg-elevated);color:var(--n-fg-default);font-size:var(--text-sm,12px);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);align-items:center;gap:6px;padding:3px 8px;display:inline-flex}.custom-select-trigger:hover{background:var(--n-bg-hover)}.custom-select-value{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.custom-select-chevron{color:var(--n-fg-tertiary);transition:transform var(--n-duration-fast) var(--n-ease);flex-shrink:0}.custom-select-chevron-open{transform:rotate(180deg)}.custom-select-dropdown{z-index:500;border:1px solid var(--n-border-default);border-radius:var(--n-radius-md);background:var(--n-bg-elevated);min-width:100%;box-shadow:var(--elev-floating,0 2px 8px #0f0f0f14);max-height:240px;margin-top:4px;padding:4px;position:absolute;top:100%;left:0;overflow-y:auto}.custom-select-option{border-radius:var(--n-radius-sm);width:100%;color:var(--n-fg-default);font-size:var(--text-sm,12px);text-align:left;cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);background:0 0;border:none;align-items:center;padding:4px 8px;display:flex}.custom-select-option:hover,.custom-select-option-active{background:var(--n-bg-hover)}.custom-select-option-selected{color:var(--n-brand);font-weight:var(--font-weight-medium,500)}.menu{z-index:500;border:1px solid var(--n-border-default);border-radius:var(--n-radius-md);background:var(--n-bg-elevated);min-width:180px;box-shadow:var(--elev-floating,0 2px 8px #0f0f0f14);opacity:0;transition:opacity var(--n-duration-base) var(--n-ease), transform var(--n-duration-base) var(--n-ease);transform-origin:top;padding:4px;position:fixed;transform:translateY(-4px)}.menu.is-open{opacity:1;transform:translateY(0)}.menu-item{border-radius:var(--n-radius-sm);width:100%;color:var(--n-fg-default);font-size:var(--text-sm,12px);text-align:left;cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);background:0 0;border:none;align-items:center;gap:8px;padding:5px 8px;display:flex}.menu-item:hover,.menu-item-active{background:var(--n-bg-hover)}.menu-item:disabled,.menu-item-disabled{color:var(--n-fg-disabled);cursor:not-allowed}.menu-item:disabled:hover,.menu-item-disabled:hover{background:0 0}.menu-item-icon{width:16px;height:16px;color:var(--n-fg-tertiary);flex-shrink:0;justify-content:center;align-items:center;display:flex}.menu-item-label{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.menu-item-shortcut{color:var(--n-fg-tertiary);font-family:var(--n-font-mono);letter-spacing:.02em;flex-shrink:0;font-size:10px}.menu-divider{background:var(--n-border-default);height:1px;margin:4px 8px}.toast-region{z-index:1000;pointer-events:none;flex-direction:column-reverse;align-items:center;gap:8px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.toast-item{border-radius:var(--n-radius-md);background:var(--n-bg-elevated);color:var(--n-fg-default);font-size:var(--text-sm,12px);white-space:nowrap;pointer-events:auto;border:1px solid var(--n-border-default);box-shadow:var(--elev-floating,0 2px 8px #0f0f0f14);opacity:0;transition:opacity var(--n-duration-base) var(--n-ease), transform var(--n-duration-base) var(--n-ease);align-items:center;gap:8px;padding:8px 14px;line-height:1.4;display:flex;transform:translateY(12px)}.toast-item.is-visible{opacity:1;transform:translateY(0)}.toast-item.toast-success{border-color:var(--n-success)}.toast-item.toast-error{border-color:var(--n-danger)}.toast-item.toast-info{border-color:var(--n-brand)}.toast-item.toast-loading{border-color:var(--n-fg-tertiary)}.toast-item-icon{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}.toast-success .toast-item-icon{color:var(--n-success)}.toast-error .toast-item-icon{color:var(--n-danger)}.toast-info .toast-item-icon{color:var(--n-brand)}.toast-loading .toast-item-icon{color:var(--n-fg-tertiary)}.toast-item-message{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.toast-item-close{border-radius:var(--n-radius-sm);width:18px;height:18px;color:var(--n-fg-tertiary);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.toast-item-close:hover{background:var(--n-bg-hover);color:var(--n-fg-default)}@keyframes tr-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.toast-loading .toast-item-icon svg{animation:.8s linear infinite tr-spin}.source-code-view{flex-direction:column;height:100%;display:flex;overflow:hidden}.source-code-editor{--source-code-font-size:11px;--source-code-line-height:18px;background:var(--n-bg-base);flex:1;grid-template-columns:42px minmax(0,1fr);min-height:0;display:grid;overflow:hidden}.source-code-gutter{height:100%;padding:var(--space-2) 8px;border-right:1px solid var(--n-border-default);background:var(--n-bg-subtle);color:var(--n-fg-disabled);font-family:var(--n-font-mono);font-size:var(--source-code-font-size);line-height:var(--source-code-line-height);text-align:right;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums;margin:0;overflow:hidden}.source-code-textarea{width:100%;height:100%;min-height:0;padding:var(--space-2);color:var(--n-fg-default);font-family:var(--n-font-mono);font-size:var(--source-code-font-size);line-height:var(--source-code-line-height);resize:none;tab-size:2;white-space:pre;overflow-wrap:normal;background:0 0;border:none;border-radius:0;outline:none;grid-column:2;overflow:auto}.source-code-textarea::placeholder{color:var(--n-fg-disabled)}.source-search-bar{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-elevated);align-items:center;gap:6px;padding:6px 8px;display:flex}.source-search-field{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-elevated);transition:border-color var(--n-duration-fast) var(--n-ease);flex:1;align-items:center;gap:4px;padding:3px 6px;display:flex}.source-search-field .source-search-icon{color:var(--n-fg-tertiary);flex-shrink:0}.source-search-field input{min-width:0;color:var(--n-fg-default);font-size:var(--text-sm);font-family:var(--n-font-sans);background:0 0;border:none;outline:none;flex:1}.source-search-field input::placeholder{color:var(--n-fg-disabled)}.source-search-clear{background:var(--n-bg-hover);width:16px;height:16px;color:var(--n-fg-tertiary);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.source-search-clear:hover{background:var(--n-border-strong);color:var(--n-fg-secondary)}.source-search-count{font-size:var(--text-xs);color:var(--n-fg-tertiary);font-family:var(--n-font-sans);white-space:nowrap;flex-shrink:0}.source-search-empty{padding:var(--space-4);text-align:center;color:var(--n-fg-tertiary);font-size:var(--text-sm);font-family:var(--n-font-sans)}.source-editor-status{border-radius:var(--n-radius-sm);font-size:var(--text-xs);font-family:var(--n-font-mono);white-space:nowrap;align-items:center;gap:5px;padding:2px 8px;display:inline-flex}.source-editor-status[data-state=synced]{color:var(--n-success)}.source-editor-status[data-state=dirty]{color:var(--n-warning)}.source-editor-line-count{font-size:var(--text-xs);color:var(--n-fg-tertiary);font-family:var(--n-font-mono);flex-shrink:0;padding:2px 8px}.source-editor-actions{border-top:1px solid var(--n-border-default);background:var(--n-bg-elevated);align-items:center;gap:4px;padding:4px 8px;display:flex}.source-editor-actions .source-editor-draft-group{align-items:center;gap:4px;margin-left:auto;display:flex}.source-editor-actions button{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-elevated);color:var(--n-fg-default);font-size:var(--text-xs);font-family:var(--n-font-sans);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);align-items:center;gap:4px;padding:3px 8px;display:inline-flex}.source-editor-actions button:hover{background:var(--n-bg-hover)}.source-editor-actions button.source-editor-btn-primary{background:var(--n-brand);border-color:var(--n-brand);color:var(--n-fg-onbrand)}.source-editor-actions button.source-editor-btn-primary:hover{background:var(--n-brand-hover)}.source-editor-actions button.source-editor-btn-copy{color:var(--n-fg-secondary)}.dom-tree-view{flex-direction:column;height:100%;display:flex;overflow:hidden}.dom-tree-view .dom-tree-search{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-elevated);align-items:center;gap:6px;padding:6px 8px;display:flex}.dom-tree-view .dom-tree-search .tree-search-field{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-elevated);transition:border-color var(--n-duration-fast) var(--n-ease);flex:1;align-items:center;gap:4px;padding:3px 6px;display:flex}.dom-tree-view .dom-tree-search .tree-search-field:focus-within{border-color:var(--n-border-focus);box-shadow:var(--n-ring-focus)}.dom-tree-view .dom-tree-search .tree-search-field .search-icon{color:var(--n-fg-tertiary);flex-shrink:0}.dom-tree-view .dom-tree-search .tree-search-field input{min-width:0;color:var(--n-fg-default);font-size:var(--text-sm);font-family:var(--n-font-sans);background:0 0;border:none;outline:none;flex:1}.dom-tree-view .dom-tree-search .tree-search-field input::placeholder{color:var(--n-fg-disabled)}.dom-tree-view .tree-node-list{flex:1;padding:4px 0;overflow-y:auto}.dom-tree-view .tree-node-list .tree-node-empty{padding:var(--space-4);text-align:center;color:var(--n-fg-tertiary);font-size:var(--text-sm);font-family:var(--n-font-sans)}.dom-tree-toolbar-row{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-elevated);justify-content:space-between;align-items:center;padding:4px 8px;display:flex}.dom-tree-toolbar-row .dom-tree-ai-scan-btn{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-elevated);color:var(--n-fg-secondary);font-size:var(--text-xs);font-family:var(--n-font-sans);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);justify-content:center;align-items:center;gap:4px;padding:3px 7px;display:inline-flex}.dom-tree-toolbar-row .dom-tree-ai-scan-btn:hover{background:var(--n-bg-hover);color:var(--n-fg-default)}.dom-tree-toolbar-row .dom-tree-diagnostics-badge{border-radius:var(--radius-pill);background:var(--n-danger);color:#fff;font-size:var(--text-xs);font-family:var(--n-font-sans);font-weight:var(--font-weight-medium);align-items:center;gap:3px;padding:1px 6px;line-height:1.4;display:inline-flex}.ai-scan-popover{z-index:5000;min-width:200px;max-width:280px;padding:var(--space-3);border:1px solid var(--n-border-default);border-radius:var(--n-radius-lg);background:var(--n-bg-elevated);box-shadow:var(--elev-floating);color:var(--n-fg-default);font-family:var(--n-font-sans);position:fixed}.ai-scan-popover:focus{outline:none}.ai-scan-popover .ai-scan-popover-header{margin-bottom:var(--space-2);font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--n-fg-default);justify-content:space-between;align-items:center;display:flex}.ai-scan-popover .ai-scan-popover-body{font-size:var(--text-sm);color:var(--n-fg-secondary);line-height:1.5}.ai-scan-start-btn{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-elevated);color:var(--n-fg-default);font:inherit;font-size:var(--text-sm);cursor:pointer;align-items:center;gap:6px;padding:4px 10px;display:inline-flex}.ai-scan-start-btn:hover{background:var(--n-bg-hover)}.ai-scan-settings-link{color:var(--n-fg-link);font:inherit;font-size:var(--text-xs);cursor:pointer;background:0 0;border:0;margin-top:8px;padding:0;display:block}.ai-scan-settings-link:hover{text-decoration:underline}.ai-scan-popover .ai-scan-popover-body .ai-scan-result-count{font-weight:var(--font-weight-medium);color:var(--n-fg-default)}.ai-scan-popover .ai-scan-popover-body .ai-scan-error{color:var(--n-danger)}.ai-scan-popover .ai-scan-popover-close{width:20px;height:20px;color:var(--n-fg-tertiary);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;display:flex}.ai-scan-popover .ai-scan-popover-close:hover{background:var(--n-bg-hover);color:var(--n-fg-secondary)}.source-status-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px;display:inline-block}.source-status-dot[data-state=synced]{background:var(--n-success)}.source-status-dot[data-state=dirty]{background:var(--n-warning)}.dom-tree-view .tree-node{transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease), box-shadow .18s var(--ease-emphasized);animation:none}.dom-tree-view .tree-node:hover,.dom-tree-view .tree-node:active{transform:none}.dom-tree-view .tree-node.is-selected{box-shadow:inset 3px 0 0 var(--n-brand);background:color-mix(in srgb, var(--n-brand) 12%, transparent)}.dom-tree-view .tree-node__chev{transition:transform .22s var(--ease-emphasized), color var(--n-duration-fast) var(--n-ease), background var(--n-duration-fast) var(--n-ease)}.dom-tree-view .tree-node:not(.is-collapsed) .tree-node__chev{transform:rotate(90deg)}.dom-tree-view .tree-node__diag{transition:transform .16s var(--ease-emphasized), background .16s var(--n-ease)}.dom-tree-view .tree-node:hover .tree-node__diag{transform:none}.dom-tree-toolbar-row--status{justify-content:flex-end;min-height:24px}@media (prefers-reduced-motion:reduce){.dom-tree-view .tree-node,.dom-tree-view .tree-node__chev,.dom-tree-view .tree-node__diag{transition-duration:.001ms!important;animation:none!important}}.viewport-bar{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-base);flex-shrink:0;align-items:center;gap:12px;height:56px;padding:0 16px;display:flex;overflow:hidden}.segmented-viewport-control{background:var(--n-bg-hover);border-radius:var(--n-radius-md);flex-shrink:0;align-items:center;gap:1px;padding:2px;display:flex}.segmented-button{height:28px;color:var(--n-fg-secondary);font-size:var(--text-sm,12px);font-family:var(--n-font-sans);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease);white-space:nowrap;background:0 0;border:none;border-radius:4px;flex-shrink:0;align-items:center;gap:5px;padding:0 10px;display:inline-flex}.segmented-button[aria-pressed=true]{background:var(--n-bg-elevated);color:var(--n-fg-default);box-shadow:var(--elev-raised,0 1px 2px #0f0f0f0a)}.segmented-button svg{flex-shrink:0;width:14px;height:14px}.viewport-bar__dim{flex-shrink:0;align-items:center;gap:4px;display:flex}.viewport-bar__dim input{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-subtle);width:52px;height:26px;color:var(--n-fg-default);font-size:var(--text-sm,12px);font-family:var(--n-font-mono);text-align:center;-moz-appearance:textfield;transition:border-color var(--n-duration-fast) var(--n-ease);outline:none;padding:0 6px}.viewport-bar__dim input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.viewport-bar__dim input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.viewport-bar__dim input:focus{border-color:var(--n-brand);box-shadow:var(--n-ring-focus)}.viewport-bar__dim-sep{color:var(--n-fg-tertiary);font-size:var(--text-sm,12px);-webkit-user-select:none;user-select:none}.viewport-bar__group{flex-shrink:0;align-items:center;gap:4px;margin-left:auto;display:flex}.viewport-bar__btn{border-radius:var(--n-radius-sm);width:28px;height:28px;color:var(--n-fg-secondary);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease);background:0 0;border:1px solid #0000;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.viewport-bar__btn:hover{background:var(--n-bg-hover);color:var(--n-fg-default)}.viewport-bar__btn:active{background:var(--n-bg-subtle)}.viewport-bar__btn svg{width:14px;height:14px}.viewport-bar__zoom{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-subtle);min-width:36px;height:26px;color:var(--n-fg-default);font-size:var(--text-sm,12px);font-family:var(--n-font-mono);cursor:default;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;padding:0 6px;display:inline-flex}.viewport-bar__btn--label{width:auto;font-size:var(--text-sm,12px);font-family:var(--n-font-sans);gap:5px;padding:0 10px}.viewport-bar__btn--label svg{width:13px;height:13px}.viewport-bar__btn[aria-pressed=true]{background:var(--n-brand);color:var(--n-fg-onbrand)}.viewport-bar__btn[aria-pressed=true]:hover{background:var(--n-brand-hover)}.stage{background:var(--n-bg-canvas);overscroll-behavior:contain;scrollbar-gutter:stable;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:auto}.stage.is-space-ready{cursor:grab}.stage.is-space-ready iframe{pointer-events:none}.stage.is-panning{cursor:grabbing;-webkit-user-select:none;user-select:none;touch-action:none}.stage.is-panning iframe{pointer-events:none}.stage-panel.nw-canvas{justify-content:stretch;align-items:stretch;padding:0;overflow:hidden}.stage-panel>.viewport-bar{justify-content:flex-start;gap:10px;height:44px;min-height:44px;padding:0 12px;overflow:hidden}.stage-panel>.viewport-bar .segmented-viewport-control{flex:0 0 92px;width:92px;min-width:92px;height:30px;overflow:hidden}.stage-panel>.viewport-bar .segmented-button{flex:0 0 28px;gap:0;width:28px;min-width:28px;height:24px;padding:0}.stage-panel>.viewport-bar .segmented-button>span{display:none}.stage-panel>.viewport-bar .viewport-bar__dim{padding:0}.stage-panel>.viewport-bar .viewport-bar__group{min-width:0;margin-left:auto}.stage>.nw-canvas{flex:auto;min-width:0;padding:16px;overflow:visible}.stage>.nw-canvas .nw-preview-card{flex:0 0 max-content;align-self:flex-start;width:max-content;min-width:100%}.nw-preview-card{background:var(--n-bg-elevated);border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);flex-direction:column;display:flex;overflow:hidden;box-shadow:0 1px 2px #0f0f0f0a}.nw-preview-card__url-bar{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-subtle);align-items:center;gap:6px;height:32px;padding:0 12px;display:flex}.nw-preview-card__url-dot{background:var(--n-fg-disabled);border-radius:50%;flex-shrink:0;width:8px;height:8px}.nw-preview-card__url-field{background:var(--n-bg-base);height:20px;color:var(--n-fg-tertiary);text-overflow:ellipsis;white-space:nowrap;border-radius:10px;flex:1;padding:0 8px;font-size:10px;line-height:20px;overflow:hidden}.live-preview-frame{background:var(--n-bg-base);border:none;width:100%;height:100%;display:block}.device-frame{background:var(--n-bg-base);transition:transform var(--n-duration-slow) var(--n-ease-expand), opacity var(--n-duration-base) var(--n-ease-expand);position:relative;overflow:hidden;box-shadow:0 1px 2px #0f0f0f0d}.page-preview{transform-origin:50%;transition:transform var(--n-duration-base) var(--n-ease-expand)}.device-handset{border:1px solid var(--n-border-strong)}.device-handset--mobile{border-radius:36px}.device-handset--tablet{border-radius:24px}.device-status-bar{z-index:1;pointer-events:none;justify-content:space-between;align-items:center;height:28px;padding:0 20px;display:flex;position:absolute;top:0;left:0;right:0}.device-status-bar__time{color:var(--n-fg-default);font-size:10px;font-weight:600;font-family:var(--n-font-sans)}.device-status-bar__icons{align-items:center;gap:4px;display:flex}.device-status-bar__icon{fill:none;width:12px;height:12px;stroke:var(--n-fg-default);stroke-width:1.5px}.device-notch{z-index:2;background:var(--n-bg-inverse);border-radius:0 0 14px 14px;width:120px;height:22px;position:absolute;top:0;left:50%;transform:translate(-50%)}.device-home{z-index:2;background:var(--n-fg-disabled);border-radius:2px;width:100px;height:4px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.device-home--light{background:#ffffff80}.canvas-scan-overlay{z-index:10;background:#fff9;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.canvas-scan-overlay__spinner{border:2px solid var(--n-border-default);border-top-color:var(--n-brand);border-radius:50%;width:20px;height:20px;animation:.6s linear infinite canvas-scan-spin}@keyframes canvas-scan-spin{to{transform:rotate(360deg)}}@media (width<=760px){.stage-panel>.viewport-bar{flex-wrap:wrap;justify-content:center;gap:8px;height:auto;min-height:48px;padding:6px 8px;overflow:visible}.stage-panel>.viewport-bar .viewport-bar__group{margin-left:0}.stage-panel>.viewport-bar .viewport-bar__dim{order:3;justify-content:center;width:100%}.stage>.nw-canvas{padding:12px}.app-topbar-brand,.app-topbar-actions{flex-shrink:1;width:auto}.app-topbar-center,.topbar-history-actions,.topbar-separator,.app-topbar-path{display:none}.nw-left-panel{z-index:100;background:var(--n-bg-elevated);border-right:1px solid var(--n-border-default);width:min(320px,100vw - 48px);height:100dvh;transition:transform var(--n-duration-slow) var(--n-ease);position:fixed;top:0;left:0;overflow-y:auto;transform:translate(-100%)}.nw-left-panel.is-open{transform:translate(0)}.nw-right-panel{z-index:100;background:var(--n-bg-elevated);border-left:1px solid var(--n-border-default);width:min(320px,100vw - 48px);height:100dvh;transition:transform var(--n-duration-slow) var(--n-ease);position:fixed;top:0;right:0;overflow-y:auto;transform:translate(100%)}.nw-right-panel.is-open{transform:translate(0)}.mobile-panel-backdrop{z-index:99;opacity:0;pointer-events:none;transition:opacity var(--n-duration-slow) var(--n-ease);background:#0003;position:fixed;inset:0}.mobile-panel-backdrop.is-visible{opacity:1;pointer-events:auto}.nw-canvas{flex:1;min-width:0}.viewport-bar{gap:8px;padding:0 10px}.segmented-viewport-control{gap:0}.segmented-button{padding:0 8px;font-size:11px}.viewport-bar__dim input{width:40px;font-size:11px}}@media (width<=1080px) and (width>=761px){.topbar-file-action>span{display:none}.topbar-file-actions .topbar-file-action{justify-content:center;width:28px;padding-inline:4px}.app-topbar-actions{width:auto}}.nw-right-panel{width:var(--inspector-col,320px);border-left:1px solid var(--n-border-default);background:var(--n-bg-base);font-size:var(--text-sm,13px);flex-direction:column;display:flex;overflow:hidden}.nw-inspector-title{font-size:var(--text-sm);font-weight:var(--font-weight-strong);color:var(--n-fg-default);letter-spacing:.02em;padding:0 var(--space-2,8px);background:0 0;border-bottom:0}.inspector-tabs-wrap{border-bottom:1px solid var(--n-border-default);padding:0 var(--space-2,8px);flex-shrink:0;align-items:center;gap:0;min-height:40px;display:flex}.inspector-tabs-wrap>.nw-inspector-title{flex:1}.inspector-tabs-wrap>.panel-collapse-btn{flex:0 0 28px;width:28px;min-width:28px;height:28px;padding:0}.inspector-selection{padding:var(--space-3,12px);border-bottom:1px solid var(--n-border-default);background:var(--n-bg-subtle);flex-direction:column;flex-shrink:0;gap:6px;display:flex}.inspector-selection__row1{align-items:center;gap:var(--space-2,8px);flex-wrap:wrap;row-gap:6px;display:flex}.inspector-selection__metrics{gap:var(--space-2,8px) var(--space-3,12px);font-size:var(--text-xs,12px);color:var(--n-fg-tertiary);font-variant-numeric:tabular-nums;padding-top:var(--space-1,4px);border-top:1px dashed var(--n-border-default);flex-wrap:wrap;line-height:1.7;display:flex}.inspector-command-bar{min-height:40px;padding:5px var(--space-3,12px);border-bottom:1px solid var(--n-border-default);background:var(--n-bg-base);flex-shrink:0;align-items:center;gap:4px;display:flex}.inspector-command-bar button{border-radius:var(--n-radius-sm,4px);width:28px;height:28px;color:var(--n-fg-secondary);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease), border-color var(--n-duration-fast) var(--n-ease);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:0;display:inline-flex}.inspector-command-bar button:hover:not(:disabled){background:var(--n-bg-hover);border-color:var(--n-border-default);color:var(--n-fg-default)}.inspector-command-bar button.is-danger:hover:not(:disabled){background:color-mix(in srgb, var(--n-danger) 8%, transparent);border-color:color-mix(in srgb, var(--n-danger) 24%, var(--n-border-default));color:var(--n-danger)}.inspector-command-bar button:disabled{opacity:.34;cursor:not-allowed}.inspector-command-bar svg{width:14px;height:14px}.inspector-command-bar__sep{background:var(--n-border-default);flex-shrink:0;width:1px;height:18px;margin:0 2px}.inspector-selection__tag{padding:2px var(--space-2,8px);font-size:var(--text-xs,12px);font-weight:var(--font-weight-strong,600);font-family:var(--n-font-mono);color:var(--n-brand);background:var(--bg-overlay-l1);border-radius:var(--radius-sm,4px);line-height:1.5;display:inline-block}.inspector-selection__label{font-size:var(--text-sm,13px);font-weight:var(--font-weight-strong,600);color:var(--n-fg-default);white-space:nowrap;text-overflow:ellipsis;max-width:200px;overflow:hidden}.inspector-selection__path{font-size:var(--text-xs,12px);color:var(--n-fg-tertiary);font-family:var(--n-font-mono);white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;line-height:1.6;overflow:hidden}.inspector-selection__className{font-size:var(--text-xs,12px);color:var(--n-fg-secondary);font-family:var(--n-font-mono);white-space:nowrap;text-overflow:ellipsis;max-width:100%;display:inline-block;overflow:hidden}.inspector-body{padding:var(--space-3,12px);padding-bottom:var(--space-4,16px);scrollbar-gutter:stable;flex-direction:column;flex:1;gap:10px;display:flex;overflow:hidden auto}.inspector-body>*{flex-shrink:0}.inspector-empty{text-align:center;padding:var(--space-12,48px) var(--space-4,16px);justify-content:center;align-items:center;gap:var(--space-3,12px);margin:var(--space-8,32px);border:1px dashed var(--n-border-default);border-radius:var(--n-radius-md,5px);flex-direction:column;flex:1;display:flex}.inspector-empty strong{font-size:var(--text-base,14px);color:var(--n-fg-default);font-weight:var(--font-weight-strong,600)}.inspector-empty .meta{font-size:var(--text-sm,13px);color:var(--n-fg-tertiary);line-height:var(--leading-body,1.55);max-width:280px;margin:0}.inspector-empty kbd{font-size:var(--text-xs,12px);font-family:var(--n-font-mono);background:var(--n-bg-subtle);border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm,4px);color:var(--n-fg-secondary);padding:1px 6px;display:inline-block}.inspector-card{border:0;border-bottom:1px solid var(--n-border-default);box-shadow:none;background:0 0;border-radius:0;overflow:hidden}.inspector-card+.inspector-card,.inspector-card+.property-card,.property-card+.inspector-card,.property-card+.property-card{margin-top:0}.inspector-card.is-active{border-color:var(--n-border-default);box-shadow:none}.inspector-card__head{align-items:center;gap:var(--space-2,8px);cursor:pointer;width:100%;min-height:34px;font-family:var(--n-font-sans);font-size:var(--text-sm,13px);font-weight:var(--font-weight-medium,500);color:var(--n-fg-default);text-align:left;transition:background var(--n-duration-fast) var(--n-ease);background:0 0;border:none;padding:7px 0;display:flex}.inspector-card__head:hover{background:var(--n-bg-hover)}.inspector-card__head-icon{color:var(--n-fg-secondary);flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}.inspector-card__head-icon svg{width:14px;height:14px}.inspector-card__head-title{font-weight:var(--font-weight-strong,600);color:var(--n-fg-default);font-size:var(--text-sm,13px);flex:1}.inspector-card__head-arrow{transition:transform var(--n-duration-fast) var(--n-ease);color:var(--n-fg-tertiary);align-items:center;display:flex}.inspector-card__head-arrow svg{width:14px;height:14px}.inspector-card__head-arrow.is-open{transform:rotate(0)}.inspector-card__head-arrow:not(.is-open){transform:rotate(-90deg)}.inspector-card__body{gap:var(--space-3,12px);background:0 0;border-top:0;flex-direction:column;padding:4px 0 12px;display:flex}.property-card{border:0;border-bottom:1px solid var(--n-border-default);gap:var(--space-3,12px);box-shadow:none;background:0 0;border-radius:0;flex-direction:column;padding:4px 0 12px;display:flex}.property-card.inspector-card{gap:0;padding:0}.property-card.inspector-card .alignment-bar{padding:2px 0 10px}.ai-selected-note{align-items:center;gap:var(--space-2,8px);padding:var(--space-3,10px) var(--space-3,12px);font-size:var(--text-xs,12px);color:var(--n-fg-secondary);background:var(--bg-brand-popup);border:1px solid var(--n-border-focus);border-radius:var(--n-radius-sm,4px);margin:0;line-height:1.5;display:flex}.field{gap:var(--space-1,6px);font-size:var(--text-xs,12px);color:var(--n-fg-secondary);flex-direction:column;min-width:0;display:flex}.field>span{white-space:nowrap;text-overflow:ellipsis;font-weight:var(--font-weight-medium,500);letter-spacing:.01em;overflow:hidden}.field input,.field textarea{width:100%;padding:6px var(--space-2,8px);font-size:var(--text-sm,13px);font-family:var(--n-font-sans);color:var(--n-fg-default);background:var(--n-bg-base);border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm,4px);transition:border-color var(--n-duration-fast) var(--n-ease), box-shadow var(--n-duration-fast) var(--n-ease);outline:none;min-height:30px;line-height:1.4}.field textarea{resize:vertical;min-height:64px;padding:var(--space-2,8px);line-height:var(--leading-body,1.55)}.field input:hover,.field textarea:hover{border-color:var(--n-border-strong)}.field input:focus,.field textarea:focus{border-color:var(--n-brand);box-shadow:var(--n-ring-focus)}.field input::placeholder,.field textarea::placeholder{color:var(--n-fg-disabled)}.field-full{grid-column:1/-1}.field-grid{gap:var(--space-3,12px);display:grid}.field-grid.two-col{grid-template-columns:1fr 1fr}.field-grid.three-col{grid-template-columns:1fr 1fr 1fr}.field-grid.one-col{grid-template-columns:1fr}.alignment-bar{align-items:center;gap:var(--space-1,6px);flex-wrap:wrap;display:flex}.alignment-bar button{border:1px solid var(--n-border-default);background:var(--n-bg-base);width:32px;height:30px;color:var(--n-fg-secondary);cursor:pointer;border-radius:var(--n-radius-sm,4px);transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease), border-color var(--n-duration-fast) var(--n-ease);justify-content:center;align-items:center;padding:0;display:flex}.alignment-bar button:hover{background:var(--n-bg-hover);color:var(--n-fg-default);border-color:var(--n-border-strong)}.alignment-bar button.is-on{background:var(--n-brand);color:var(--n-fg-onbrand);border-color:var(--n-brand)}.alignment-bar button.is-on:hover{background:var(--n-brand-hover);border-color:var(--n-brand-hover)}.alignment-bar button svg{width:14px;height:14px}.alignment-bar__divider,.alignment-bar__sep{background:var(--n-border-default);width:1px;height:18px;margin:0 var(--space-1,4px);flex-shrink:0}.quick-actions{gap:var(--space-1,4px);flex-wrap:wrap;align-items:center;display:flex}.quick-actions button{background:var(--n-bg-subtle);width:28px;height:28px;color:var(--n-fg-secondary);cursor:pointer;border-radius:var(--n-radius-sm,4px);transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease);border:none;justify-content:center;align-items:center;padding:0;display:flex}.quick-actions button:hover{background:var(--n-bg-hover);color:var(--n-fg-default)}.quick-actions button svg{width:14px;height:14px}.quick-actions__divider{background:var(--n-border-default);width:1px;height:16px;margin:0 var(--space-1,4px)}.quick-actions-grid{gap:var(--space-2,8px);grid-template-columns:repeat(2,1fr);display:grid}.inspector-quick-actions{gap:var(--space-2,8px);padding:var(--space-3,12px);background:var(--n-bg-subtle);border:1px solid var(--n-border-default);border-radius:var(--n-radius-md,5px);flex-direction:column;display:flex}.inspector-quick-actions__title{font-size:var(--text-xs,12px);font-weight:var(--font-weight-medium,500);color:var(--n-fg-tertiary);letter-spacing:.04em;text-transform:uppercase}.quick-actions-grid .btn{padding:var(--space-2,8px) var(--space-3,12px);font-size:var(--text-sm,13px);font-family:var(--n-font-sans);font-weight:var(--font-weight-medium,500);color:var(--n-fg-default);background:var(--n-bg-base);border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm,4px);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease), border-color var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease);text-align:center;white-space:nowrap;text-overflow:ellipsis;justify-content:center;align-items:center;min-height:32px;display:flex;overflow:hidden}.quick-actions-grid .btn:hover:not(:disabled){background:var(--n-bg-hover);border-color:var(--n-border-strong);color:var(--n-fg-default)}.quick-actions-grid .btn:active:not(:disabled){background:var(--n-bg-subtle)}.quick-actions-grid .btn:disabled{opacity:.4;cursor:not-allowed}.color-row{align-items:center;gap:var(--space-2,8px);width:100%;display:flex}.color-swatch-button{border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm,4px);cursor:pointer;background:0 0;flex-shrink:0;width:28px;height:28px;padding:0;overflow:hidden}.token-row{align-items:center;gap:var(--space-2,8px);padding:var(--space-1,4px) 0;font-size:var(--text-xs,12px);display:flex}.token-swatch{border-radius:var(--n-radius-sm,4px);border:1px solid var(--n-border-default);flex-shrink:0;width:18px;height:18px}.inspector-apply-btn{padding:var(--space-2,8px) var(--space-4,16px);font-size:var(--text-sm,13px);font-family:var(--n-font-sans);font-weight:var(--font-weight-medium,500);color:var(--n-fg-onbrand);background:var(--n-brand);border-radius:var(--n-radius-sm,4px);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);border:none;align-self:flex-start;min-height:32px}.inspector-apply-btn:hover{background:var(--n-brand-hover)}.inspector-apply-btn:active{background:var(--n-brand-active)}.inspector-apply-btn--secondary{color:var(--n-fg-default);background:var(--n-bg-base);border:1px solid var(--n-border-default)}.inspector-apply-btn--secondary:hover{background:var(--n-bg-hover);border-color:var(--n-border-strong)}.inspector-apply-btn--secondary:active{background:var(--n-bg-subtle)}.inspector-apply-btn--full{width:100%;padding:var(--space-3,12px) var(--space-4,16px);font-size:var(--text-sm,13px);font-weight:var(--font-weight-strong,600);align-self:stretch}.inspector-footer{padding:10px var(--space-3,12px);border-top:1px solid var(--n-border-default);background:var(--n-bg-base);flex-shrink:0}.inspector-diagnostics-section{gap:var(--space-2,8px);flex-direction:column;display:flex}.diagnostic-annotations{gap:var(--space-1,4px);flex-direction:column;display:flex}.diagnostic-annotation{width:100%;padding:var(--space-2,8px) var(--space-3,12px);border-radius:var(--n-radius-sm,4px);background:var(--n-bg-subtle);cursor:pointer;text-align:left;font-family:var(--n-font-sans);transition:background var(--n-duration-fast) var(--n-ease);border:none;border-left:2px solid var(--n-border-default);flex-direction:column;gap:2px;display:flex}.diagnostic-annotation:hover{background:var(--n-bg-hover)}.diagnostic-annotation--info{border-left-color:var(--n-brand)}.diagnostic-annotation--warning{border-left-color:var(--n-warning)}.diagnostic-annotation--error{border-left-color:var(--n-danger)}.diagnostic-annotation__field{font-size:var(--text-sm,13px);font-weight:var(--font-weight-medium,500);color:var(--n-fg-default)}.diagnostic-annotation__suggestion{font-size:var(--text-xs,12px);color:var(--n-fg-tertiary);line-height:1.5}p.meta{font-size:var(--text-sm,13px);color:var(--n-fg-tertiary);line-height:var(--leading-body,1.55);margin:0}.compact-textarea{resize:vertical;min-height:64px;line-height:var(--leading-body,1.55);font-size:var(--text-sm,13px)}.inspector-body::-webkit-scrollbar{width:8px}.inspector-body::-webkit-scrollbar-track{background:0 0}.inspector-body::-webkit-scrollbar-thumb{background:var(--n-border-strong);border:2px solid var(--n-bg-base);border-radius:4px}.inspector-body::-webkit-scrollbar-thumb:hover{background:var(--n-fg-tertiary)}.property-card .pretext-measure-badge,.property-card [class*=Pretext]{margin-top:0}@supports not (color:color-mix(in srgb, red, blue)){.export-dialog,.history-drawer,.cheatsheet,.color-popover,.toast,.ds-tooltip{background:var(--bg-base-default)}:root{--border-neutral-l1:#7373732e;--border-neutral-l2:#73737347}}@supports not selector(:has(*)){.segmented-viewport-control .segmented-active-slide-bg{display:none}}:focus-visible{box-shadow:var(--focus-halo);border-radius:inherit;outline:none}.export-dialog :focus-visible,.history-drawer :focus-visible,.cheatsheet :focus-visible,.color-popover :focus-visible,.toast :focus-visible,.ds-tooltip :focus-visible{outline:2px solid var(--bg-brand);outline-offset:2px}@media (hover:hover) and (prefers-reduced-motion:no-preference){button:not(:disabled):hover,[role=button]:not([aria-disabled=true]):hover{filter:saturate(108%)}}.app-shell{grid-template-rows:var(--topbar-height) minmax(0, 1fr) var(--statusbar-height);background:var(--bg-base-default);height:100vh;display:grid}.topbar{height:var(--topbar-height);padding:0 var(--spacer-16);background:var(--bg-base-default);border-bottom:1px solid var(--border-neutral-l1);justify-content:space-between;align-items:center;gap:var(--spacer-12);min-height:0;display:flex}.app-header{height:var(--topbar-height);padding:0 var(--spacer-16);background:var(--n-bg-elevated);border-bottom:1px solid var(--n-border-default);justify-content:space-between;align-items:center;gap:var(--spacer-12);min-height:0;display:flex;position:relative}.brand-mark{border-radius:var(--radius-8);width:32px;height:32px;box-shadow:none;transition:box-shadow .32s var(--ease-emphasized), transform .32s var(--ease-emphasized);background:0 0;flex-shrink:0;place-items:center;display:grid;overflow:visible}.brand-mark img{object-fit:cover;transform-origin:50%;width:34px;height:34px;transition:transform .32s var(--ease-emphasized), filter .32s var(--ease-emphasized);border-radius:9px;display:block;transform:rotate(45deg);box-shadow:0 1px 4px #4b3fe338}.brand-mark:hover img{filter:saturate(115%);transform:rotate(45deg)scale(1.04)}.brand-mark:active{transform:translateY(-1px) scale(var(--press-scale-card));transition-duration:var(--motion-fast)}.brand-mark-text{letter-spacing:.02em;text-shadow:0 1px #00000024;font-size:12px;font-weight:600;line-height:1;display:inline-block}.brand-copy{flex-direction:column;justify-content:center;min-width:0;display:flex}.brand-copy h1{color:var(--text-default);letter-spacing:.01em;white-space:nowrap;align-items:center;gap:var(--spacer-8);background:linear-gradient(135deg,#121826 0%,#2383e2 52%,#0f766e 100%);-webkit-text-fill-color:transparent;text-shadow:0 1px #ffffffb3;-webkit-background-clip:text;background-clip:text;font-family:Georgia,Times New Roman,Playfair Display,serif;font-size:17px;font-style:italic;font-weight:700;line-height:20px;display:inline-flex}.brand-copy h1:first-letter{font-size:1.08em}.brand-copy .brand-version{height:auto;color:inherit;-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#1a72cf 0%,#1761b3 100%);font-variant-numeric:tabular-nums;letter-spacing:.02em;vertical-align:middle;-webkit-background-clip:text;background-clip:text;border-radius:0;align-items:center;padding:0;font-family:inherit;font-size:12px;font-style:italic;font-weight:700;line-height:1;display:inline-flex;transform:translateY(1px)skew(-7deg)}.brand-divider{background:var(--border-neutral-l1);width:1px;height:18px;margin:0 var(--spacer-4);flex-shrink:0}.brand-breadcrumb:empty{display:none}.brand-breadcrumb-divider{color:var(--text-tertiary)}.brand-breadcrumb-current{color:var(--text-secondary);font-weight:500}.brand-breadcrumb-folder,.brand-breadcrumb-current{white-space:nowrap;text-overflow:ellipsis;max-width:220px;font-family:var(--font-family-mono);font-size:11px;line-height:16px;overflow:hidden}.brand-subtitle{display:none}.toolbar{align-items:center;gap:var(--spacer-4);flex-wrap:nowrap;min-width:0;margin-left:auto;display:flex}.toolbar>.dropdown+.icon-btn,.toolbar>.btn+.dropdown,.toolbar>.icon-btn+.dropdown,.toolbar>.dropdown+.dropdown,.toolbar>.dropdown+.btn{margin-left:var(--spacer-2)}.toolbar-group{align-items:center;gap:var(--spacer-2);display:inline-flex}.toolbar-group-middle,.toolbar-group-tail{gap:var(--spacer-4)}.toolbar-separator{background:var(--border-neutral-l1);width:1px;margin:var(--spacer-2) var(--spacer-2);flex-shrink:0;align-self:stretch}.toolbar-button{align-items:center;gap:var(--spacer-6);height:28px;padding:0 var(--spacer-12);border-radius:var(--radius-8);white-space:nowrap;color:var(--text-default);border:1px solid #0000;font-size:12px;font-weight:500;line-height:16px;transition:background .12s,color .12s,border-color .12s;display:inline-flex}.toolbar-button svg{width:14px;height:14px}.button-label{display:inline-block}.compact-toolbar-button{gap:var(--spacer-6)}.ghost-button{color:var(--text-default);background:0 0;border-color:#0000}.ghost-button:hover:not(:disabled){background:var(--bg-overlay-l2)}.ghost-button:active:not(:disabled){background:var(--bg-overlay-l3)}.primary-button,.toolbar-button.toolbar-modal-button-active{background:var(--bg-brand);color:var(--text-onbrand);border-color:var(--bg-brand)}.primary-button:hover:not(:disabled){background:var(--bg-brand-hover);border-color:var(--bg-brand-hover)}.primary-button:active:not(:disabled){background:var(--bg-brand-active);border-color:var(--bg-brand-active)}.export-toolbar-button{gap:var(--spacer-4)}.export-format-button{height:28px;padding:0 var(--spacer-8);gap:var(--spacer-6)}.toolbar-modal-button-active{background:var(--bg-overlay-l3);color:var(--text-default);border-color:var(--border-neutral-l2)}.icon-button{border-radius:var(--radius-8);justify-content:center;align-items:center;width:28px;height:28px;padding:0;display:inline-flex}.icon-button svg{width:14px;height:14px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (width<=980px){.button-label{display:none}.toolbar-button{justify-content:center;width:28px;padding:0}.export-toolbar-button .button-label,.toolbar-group-middle .button-label{display:none}.export-toolbar-button,.toolbar-group-middle .toolbar-button{justify-content:center;width:28px;padding:0}}.workspace-resizer{width:var(--resizer-width);cursor:col-resize;background:0 0;border:0;align-self:stretch;margin:0;padding:0;position:relative}.workspace-resizer:before{content:"";background:0 0;transition:background .12s;position:absolute;inset:0}.workspace-resizer:hover:before,.workspace-resizer:focus-visible:before{background:var(--bg-brand)}.workspace-resizer-source{border-right:1px solid var(--border-neutral-l1)}.workspace-resizer-inspector{border-left:1px solid var(--border-neutral-l1)}body.is-resizing-panels{cursor:col-resize;-webkit-user-select:none;user-select:none}.panel{background:var(--n-bg-elevated);flex-direction:column;min-height:0;display:flex;position:relative;overflow:hidden}.panel+.panel{border-left:1px solid var(--n-border-default)}.panel-head{height:var(--panel-tab-height);min-height:var(--panel-tab-height);justify-content:space-between;align-items:center;gap:var(--spacer-12);padding:0 var(--spacer-12);border-bottom:1px solid var(--n-border-default);background:var(--n-bg-elevated);display:flex}.panel-title{align-items:center;gap:var(--spacer-8);color:var(--text-default);min-width:0;font-size:13px;font-weight:600;display:flex}.panel-title svg{width:14px;height:14px;color:var(--icon-tertiary)}.panel-head-actions{align-items:center;gap:var(--spacer-8);display:inline-flex}.ds-btn--icon.ds-btn--sm{border-radius:var(--radius-8);width:24px;height:24px;color:var(--icon-secondary);cursor:pointer;transition:background var(--motion-fast) var(--ease-standard), color var(--motion-fast) var(--ease-standard), transform var(--motion-fast) var(--ease-standard);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:0;display:inline-flex}.ds-btn--icon.ds-btn--sm:hover{background:var(--bg-overlay-l2);color:var(--icon-default)}.ds-btn--icon.ds-btn--sm:active{transform:scale(var(--press-scale-icon));background:var(--bg-overlay-l3);transition-duration:var(--motion-fast)}.ds-btn--icon.ds-btn--sm svg{width:14px;height:14px;transition:transform var(--motion-fast) var(--ease-standard)}.inspector-tabs,.panel-tabs{height:var(--panel-tab-height);border-bottom:1px solid var(--border-neutral-l1);align-items:stretch;margin-bottom:-1px;display:flex}.inspector-tabs button,.panel-tabs button{padding:0 var(--spacer-12);height:100%;color:var(--text-tertiary);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;align-items:center;margin-bottom:-1px;font-size:13px;font-weight:500;line-height:18px;display:inline-flex;position:relative}.inspector-tabs button:hover,.panel-tabs button:hover{color:var(--text-default)}.inspector-tabs button.inspector-tab-active,.panel-tabs button.is-active{color:var(--text-default);border-bottom-color:var(--text-default)}.tabs,.segmented{align-items:center;gap:var(--spacer-2);padding:var(--spacer-2);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-secondary);display:inline-flex}.tab,.seg-btn{border-radius:var(--radius-4);color:var(--text-secondary);padding:var(--spacer-4) var(--spacer-12);cursor:pointer;background:0 0;border:0;font-size:12px;font-weight:500;line-height:16px}.tab:hover,.seg-btn:hover{color:var(--text-default);background:var(--bg-overlay-l2)}.tab.is-active,.seg-btn.is-active{background:var(--bg-base-default);color:var(--text-default);box-shadow:var(--elev-ring)}.left-tools{background:var(--bg-base-secondary);flex-direction:column;min-height:0;display:flex}.left-tools>*{flex-shrink:0}.left-tools>.tree-scroll,.left-tools>.source-editor{flex:1;min-height:0}.upload-card{margin:var(--spacer-12);border:1px dashed var(--border-neutral-l2);border-radius:var(--radius-8);padding:var(--spacer-12);background:var(--bg-base-default);align-items:center;gap:var(--spacer-12);cursor:pointer;display:flex;position:relative}.upload-card.is-imported{border-style:solid;border-color:var(--border-neutral-l2);background:var(--bg-base-default)}.upload-card input[type=file]{opacity:0;cursor:pointer;position:absolute;inset:0}.upload-card strong{font-family:var(--font-family-heading);color:var(--text-default);font-size:12px;font-weight:500}.upload-card p{color:var(--text-tertiary);margin:0;font-size:11px;line-height:14px}.search{border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-default);width:100%;height:28px;color:var(--text-default);padding:0 var(--spacer-8);outline:none;font-size:12px}.search::placeholder{color:var(--text-tertiary)}.search:focus{border-color:var(--border-contrast)}.tree-scroll{padding:var(--spacer-4) var(--spacer-8) var(--spacer-8);font-size:12px;overflow-y:auto}.tree-group{gap:var(--spacer-2);display:grid}.tree-label{color:var(--text-tertiary);font-family:var(--font-family-mono);letter-spacing:.08em;text-transform:uppercase;padding:var(--spacer-4) var(--spacer-4) 0;font-size:10px}.tree-toolbar-actions{justify-content:flex-end;align-items:center;gap:var(--spacer-4);padding:0 var(--spacer-4) var(--spacer-4);display:flex}.tree-action{border:1px solid var(--border-neutral-l1);border-radius:var(--radius-full);background:var(--bg-base-default);color:var(--text-secondary);padding:var(--spacer-2) var(--spacer-8);cursor:pointer;font-size:11px;line-height:16px}.tree-action:hover:not(:disabled){background:var(--bg-overlay-l2);color:var(--text-default)}.tree-action:disabled{opacity:.5;cursor:not-allowed}.tree-item-row{border-radius:var(--radius-4);align-items:stretch;display:flex}.tree-toggle,.tree-toggle-placeholder{flex:0 0 18px;justify-content:center;align-items:center;width:18px;display:inline-flex}.tree-toggle{color:var(--icon-tertiary);cursor:pointer;border-radius:var(--radius-4);background:0 0;border:0}.tree-toggle:hover{color:var(--icon-default);background:var(--bg-overlay-l2)}.tree-toggle svg{width:12px;height:12px}.tree-toggle-placeholder{pointer-events:none}.tree-item{align-items:center;gap:var(--spacer-6);min-width:0;padding:var(--spacer-4) var(--spacer-8);border-radius:var(--radius-4);cursor:pointer;color:var(--text-secondary);text-align:left;background:0 0;border:0;flex:1;font-size:12px;display:flex}.tree-item:hover{background:var(--bg-overlay-l2);color:var(--text-default)}.tree-item.is-selected{background:var(--bg-overlay-l3);color:var(--text-default)}.tree-item.is-ai-annotated{box-shadow:inset 2px 0 0 var(--status-warning-default)}.node-icon{min-width:22px;height:18px;padding:0 var(--spacer-4);border-radius:var(--radius-4);background:var(--bg-overlay-l2);color:var(--text-secondary);font-family:var(--font-family-mono);letter-spacing:.02em;flex-shrink:0;justify-content:center;align-items:center;font-size:10px;font-weight:500;display:inline-flex}.node-icon--brand{background:var(--bg-brand-popup);color:var(--text-brand)}.node-icon--success{background:var(--status-success-surface-l1);color:var(--status-success-default)}.node-icon--warning{background:var(--status-warning-surface-l1);color:var(--status-warning-default)}.node-icon--primary{background:var(--status-primary-surface-l1);color:var(--status-primary-default)}.node-icon--cyan{background:var(--status-primary-surface-l1);color:var(--accent-cyan)}.node-icon--tertiary{background:var(--bg-overlay-l2);color:var(--text-tertiary)}.node-copy{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.node-copy strong{color:var(--text-default);font-weight:500}.node-copy span{color:var(--text-tertiary);margin-left:var(--spacer-4);flex-shrink:0;font-size:10px}.node-ai-badge{align-items:center;gap:var(--spacer-4);padding:0 var(--spacer-4);border-radius:var(--radius-full);background:var(--status-warning-surface-l1);height:16px;color:var(--status-warning-default);flex-shrink:0;font-size:10px;font-weight:500;display:inline-flex}.ai-panel{margin:0 var(--spacer-12) var(--spacer-4);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-default);overflow:hidden}.ai-panel-head{align-items:center;gap:var(--spacer-8);height:32px;padding:0 var(--spacer-12);cursor:pointer;text-align:left;width:100%;color:var(--text-default);background:0 0;border:0;font-size:12px;font-weight:500;display:flex}.ai-panel-head svg{width:12px;height:12px;color:var(--icon-tertiary)}.ai-panel-head svg.sparkles{color:var(--icon-brand);width:13px;height:13px}.ai-panel-count{align-items:center;gap:var(--spacer-4);color:var(--status-success-default);margin-left:auto;font-size:10px;font-weight:500;display:inline-flex}.ai-panel-count-dot{border-radius:var(--radius-full);background:var(--status-success-default);width:6px;height:6px;display:inline-block}.ai-panel-body{gap:var(--spacer-8);padding:var(--spacer-12);border-top:1px solid var(--border-neutral-l1);flex-direction:column;display:flex}.ai-panel-row{align-items:center;gap:var(--spacer-8);display:flex}.ai-panel-row label{color:var(--text-tertiary);flex-shrink:0;min-width:36px;font-size:11px}.ai-panel-row .ds-input{height:24px;padding:0 var(--spacer-8);flex:1;font-size:11px}.ai-action-row{justify-content:flex-end;align-items:center;gap:var(--spacer-6);padding-top:var(--spacer-2);display:flex}.ai-action-row .ds-btn{height:22px;padding:0 var(--spacer-8);border-radius:var(--radius-6);font-size:11px}.ai-risk-summary{gap:var(--spacer-4);padding:var(--spacer-8);border-radius:var(--radius-6);background:var(--bg-base-default);border:1px solid var(--border-neutral-l1);font-size:11px;display:grid}.ai-risk-summary.has-risk{border-color:color-mix(in oklab, var(--status-warning-default) 32%, var(--border-neutral-l1));background:var(--status-warning-surface-l1)}.ai-risk-list button{width:100%;padding:var(--spacer-6);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-6);background:var(--bg-base-default);color:var(--text-default);text-align:left;gap:2px;font-size:11px;display:grid}.ai-risk-list button:hover{background:var(--bg-overlay-l1)}.ai-risk-list small{color:var(--text-tertiary);font-size:10px}.ai-error{text-overflow:ellipsis;white-space:nowrap;max-height:48px;color:var(--status-error-default);background:color-mix(in srgb, var(--status-error-default) 8%, transparent);border:1px solid color-mix(in srgb, var(--status-error-default) 22%, transparent);border-radius:var(--radius-6);cursor:help;transition:max-height .18s var(--ease-standard), white-space .18s var(--ease-standard), background .16s var(--ease-standard);padding:4px 8px;font-size:11px;line-height:16px;position:relative;overflow:hidden}.ai-error:after{content:"";background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--status-error-default) 8%, transparent));pointer-events:none;width:16px;position:absolute;top:0;bottom:0;right:0}.ai-error:hover,.ai-error:focus-within{white-space:pre-wrap;word-break:break-all;background:color-mix(in srgb, var(--status-error-default) 12%, transparent);max-height:180px;overflow:auto}.ai-error::-webkit-scrollbar{width:6px}.ai-error::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--status-error-default) 35%, transparent);border-radius:var(--radius-full)}.ai-result-list{gap:var(--spacer-4);margin-top:var(--spacer-8);display:grid}.ai-result-item{border:1px solid var(--border-neutral-l1);border-radius:var(--radius-6);background:var(--bg-base-default);color:var(--text-default);padding:var(--spacer-8);gap:var(--spacer-2);text-align:left;font-size:12px;display:grid}.ai-result-item:hover{border-color:var(--bg-brand)}.ai-result-item span,.ai-result-item small,.ai-node-hint,.ai-selected-note{color:var(--text-tertiary);font-size:11px}.ai-node-hint{color:var(--text-brand)}.remember-key-row{align-items:center;gap:var(--spacer-4);color:var(--text-tertiary);font-size:11px;display:flex}.remember-key-row input{width:12px;height:12px;accent-color:var(--bg-brand)}.stage-panel{background:var(--n-bg-canvas);border-left:1px solid var(--border-neutral-l1);border-right:1px solid var(--border-neutral-l1);min-width:0;min-height:0;transition:box-shadow .22s var(--ease-standard);flex-direction:column;display:flex;position:relative}.stage-panel:focus-within{box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--bg-brand) 32%, transparent)}.canvas-panel{flex-direction:column;min-height:0;display:flex}.stage-head{height:var(--canvas-toolbar-height);min-height:var(--canvas-toolbar-height);padding:0 var(--spacer-16);background:var(--bg-base-default);border-bottom:1px solid var(--border-neutral-l1);justify-content:space-between;align-items:center;gap:var(--spacer-12);display:flex}.canvas-tools{align-items:center;gap:var(--spacer-2);display:inline-flex}.size-pill{align-items:center;gap:var(--spacer-4);font-family:var(--font-family-metric);color:var(--text-tertiary);font-variant-numeric:tabular-nums;padding:0 var(--spacer-8);border-radius:var(--radius-6);background:0 0;height:24px;font-size:12px;display:inline-flex}.viewport-controls{align-items:center;gap:var(--spacer-2);display:inline-flex}.viewport-select{border-radius:var(--radius-6);border:1px solid var(--border-neutral-l1);background:var(--bg-base-default);height:24px;padding:0 var(--spacer-8);font-size:12px}.viewport-size-input{border-radius:var(--radius-6);border:1px solid var(--border-neutral-l1);background:var(--bg-base-default);width:60px;height:24px;padding:0 var(--spacer-4);font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;text-align:center;font-size:12px}.viewport-times{color:var(--text-tertiary);padding:0 2px}.page-preview{background:var(--n-bg-elevated);box-shadow:0 1px 3px #0f0f0f0f, 0 0 0 1px var(--n-border-default);border-radius:var(--n-radius-md);transform-origin:top;transition:box-shadow var(--n-duration-slow) var(--n-ease), transform var(--n-duration-slow) var(--n-ease), width var(--n-duration-slow) var(--n-ease), height var(--n-duration-slow) var(--n-ease);flex:none;margin:auto;position:relative;overflow:hidden}.page-preview-shell{flex:none;margin:auto;position:relative}.page-preview-shell .page-preview{transform-origin:0 0;margin:0;position:absolute;top:0;left:0}.page-preview--content-fit .live-preview-frame{transform-origin:0 0;max-width:none;position:absolute;top:0;left:0}.page-preview:hover{box-shadow:0 6px 36px color-mix(in srgb, var(--text-default) 8%, transparent), 0 2px 4px color-mix(in srgb, var(--text-default) 5%, transparent), 0 0 0 1px var(--border-neutral-l2)}.editable{outline:1px dashed color-mix(in srgb, var(--bg-brand) 60%, transparent);outline-offset:-1px;transition:outline-color .12s}.editable.is-active{outline:2px solid var(--bg-brand);outline-offset:-2px}.editable.is-active:after{content:attr(data-hft-id);background:var(--bg-brand);color:var(--text-onbrand);font-size:10px;font-family:var(--font-family-mono);pointer-events:none;white-space:nowrap;z-index:5;border-radius:4px 4px 4px 0;padding:1px 6px;position:absolute;top:-18px;left:-1px}.meta{color:var(--text-tertiary);font-size:11px;font-weight:400}p.meta{margin:0}span.meta{display:inline-block}.token-row>span.meta,.token-row .meta{margin-left:auto}.field,.field-grid,.field-row{min-width:0}.field-row{align-items:center;gap:var(--spacer-8);display:flex}.field-row label{color:var(--text-tertiary);flex-shrink:0;min-width:40px;font-size:11px}.field-row .ds-input,.field-row .input,.field-row input{flex:1}.input,.textarea{height:26px;padding:0 var(--spacer-8);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-6);background:var(--bg-base-default);color:var(--text-default);font-size:12px;font-family:var(--font-family-default);width:100%;transition:border-color .14s var(--ease-standard), background .14s var(--ease-standard), box-shadow .14s var(--ease-standard);outline:none}.textarea{height:auto;min-height:64px;padding:var(--spacer-6) var(--spacer-8);resize:vertical}.input:hover,.textarea:hover{border-color:var(--border-neutral-l2)}.input:focus,.textarea:focus{border-color:var(--bg-brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--bg-brand) 14%, transparent)}.input::placeholder,.textarea::placeholder{color:var(--text-tertiary)}.textarea.code-editor{min-height:360px;font-family:var(--font-family-mono);font-size:12px;line-height:1.55}.pretext-badge{align-items:center;gap:var(--spacer-4);padding:var(--spacer-4) var(--spacer-8);background:var(--status-primary-surface-l1);color:var(--status-primary-default);border-radius:var(--radius-4);font-size:10px;font-family:var(--font-family-metric);display:inline-flex}.pretext-badge-warn{background:var(--status-warning-surface-l1);color:var(--status-warning-default)}.color-field{align-items:center;gap:var(--spacer-8);flex-direction:row;min-height:26px;padding:2px 0;display:flex}.color-field.full,.field-full{width:100%}.color-field>span{color:var(--text-tertiary);min-width:40px;font-size:11px}.color-row{align-items:center;gap:var(--spacer-6);flex:1;display:flex}.color-row input,.color-channel input{height:26px;padding:0 var(--spacer-8);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-6);background:var(--bg-base-default);font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;outline:none;flex:1;font-size:12px}.color-row input:focus,.color-channel input:focus{border-color:var(--border-contrast)}.color-swatch-button{border-radius:var(--radius-4);border:1px solid var(--border-neutral-l2);cursor:pointer;width:24px;height:24px;padding:0;overflow:hidden}.color-swatch-button:hover{border-color:var(--border-neutral-l3)}.color-swatch-button span{border-radius:inherit;width:100%;height:100%;display:block}.color-popover{z-index:60;background:var(--n-bg-elevated);border:1px solid var(--n-border-default);border-radius:var(--n-radius-lg);box-shadow:var(--n-shadow-overlay);width:260px;color:var(--n-fg-default);animation:color-popover-in var(--n-duration-base) var(--n-ease) both;transform-origin:0 0;will-change:transform, opacity;padding:16px;position:fixed}.color-map{cursor:crosshair;background-color:var(--picker-hue,red);background-image:linear-gradient(#0000,#000),linear-gradient(90deg,#fff,#0000);border-radius:12px;width:100%;height:180px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff1a}.color-map:after{content:"";pointer-events:none;background-image:radial-gradient(#ffffff26 1px,#0000 1px);background-position:50%;background-size:20px 20px;position:absolute;inset:0}.color-map-thumb{pointer-events:none;background:#fff;border-radius:50%;width:14px;height:14px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 2px 8px #00000080,0 0 0 4px #ffffff40}.color-controls{margin-top:var(--spacer-8);gap:var(--spacer-12);flex-direction:column;display:flex}.color-hue-slider{border-radius:var(--radius-full);appearance:none;background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);width:100%;height:8px}.color-hue-slider::-webkit-slider-thumb{appearance:none;border-radius:var(--radius-full);cursor:pointer;background:#fff;border:1px solid #0003;width:14px;height:14px;box-shadow:0 1px 3px #0000004d}.color-rgb-grid{gap:var(--spacer-8);grid-template-columns:repeat(3,1fr);display:grid}.color-channel{align-items:center;gap:var(--spacer-4);display:flex}.color-channel input{width:100%;height:24px;padding:0 var(--spacer-4);color:#ffffffe6;background:#00000040;border:1px solid #0000;border-radius:6px;outline:none;font-size:11px;box-shadow:inset 0 1px #ffffff1a,0 1px #0003}.color-channel input:focus{border-color:#fff6}.color-channel span{font-family:var(--font-family-metric);color:#ffffff80;font-size:10px}.color-preset-row{margin-top:var(--spacer-8);flex-wrap:wrap;gap:6px;display:flex}.color-preset-row button{cursor:pointer;border:1px solid #ffffff26;border-radius:6px;width:18px;height:18px;transition:transform .15s;box-shadow:0 1px 2px #0003}.color-preset-row button:hover{transform:scale(1.15)}.color-swatch-grid{gap:var(--spacer-4);margin-top:var(--spacer-8);flex-wrap:wrap;display:flex}.color-swatch-grid button{border-radius:var(--radius-4);border:1px solid var(--border-neutral-l2);cursor:pointer;width:16px;height:16px}.color-swatch-grid button:focus-visible,.color-preset-row button:focus-visible{outline:2px solid var(--bg-brand);outline-offset:2px;box-shadow:var(--focus-halo)}.color-history-label{margin-top:var(--spacer-8);color:var(--text-tertiary);font-size:11px}.token-swatch{border-radius:var(--radius-4);border:1px solid var(--border-neutral-l2);width:14px;height:14px}.inspector-diagnostics{gap:var(--spacer-8);flex-direction:column;display:flex}.diagnostic-card{border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-default);padding:var(--spacer-12);gap:var(--spacer-8);flex-direction:column;display:flex}.diagnostic-head{justify-content:space-between;align-items:center;gap:var(--spacer-8);font-size:12px;display:flex}.diagnostic-head strong{color:var(--text-default);font-weight:500}.diagnostic-card h4{margin:0;font-size:12px;font-weight:500}.diagnostic-list{column-gap:var(--spacer-8);row-gap:var(--spacer-4);grid-template-columns:max-content 1fr;margin:0;display:grid}.diagnostic-list dt{color:var(--text-tertiary);font-size:11px}.diagnostic-list dd{font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;color:var(--text-default);margin:0;font-size:11px}.empty-state{text-align:center;padding:var(--spacer-24);color:var(--text-tertiary);border:1px dashed var(--border-neutral-l2);border-radius:var(--radius-8);background:var(--bg-base-default);place-items:center;font-size:12px;display:grid}.empty-state-illustration{align-items:center;gap:var(--spacer-16);margin-bottom:var(--spacer-16);display:flex}.empty-state h2{color:var(--text-default);margin:0;font-size:14px;font-weight:500}.empty-state ol{text-align:left;gap:var(--spacer-4);margin:var(--spacer-8) auto 0;max-width:240px;color:var(--text-secondary);font-size:11px;list-style:inside decimal;display:grid}.source-editor{flex-direction:column;flex:1;min-height:0;display:flex}.source-import-dropzone{align-items:center;gap:var(--spacer-8);margin:var(--spacer-12);padding:var(--spacer-12);border:1px dashed var(--border-neutral-l2);border-radius:var(--radius-8);background:color-mix(in srgb, var(--bg-brand) 4%, var(--bg-base-default));color:var(--text-secondary);display:flex}.source-import-dropzone>div{gap:var(--spacer-2);min-width:0;display:grid}.source-import-dropzone strong{color:var(--text-default);font-size:12px;font-weight:600}.source-import-dropzone span{color:var(--text-tertiary);font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.source-import-dropzone>.ds-btn{flex-shrink:0;margin-left:auto}.source-import-dropzone>span,.source-import-dropzone>.source-dirty{display:none}.source-editor-status{align-items:center;gap:var(--spacer-6);min-height:30px;margin:0 var(--spacer-12) var(--spacer-10);padding:var(--spacer-6) var(--spacer-10);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-default);color:var(--text-secondary);grid-template-columns:auto auto minmax(0,1fr);font-size:11px;line-height:1.35;display:grid}.source-editor-status__dot{border-radius:var(--radius-full);background:var(--status-success-default);width:7px;height:7px;box-shadow:0 0 0 3px color-mix(in srgb, var(--status-success-default) 14%, transparent)}.source-editor-status strong{color:var(--text-default);white-space:nowrap;font-size:11px;font-weight:650}.source-editor-status>span:last-child{min-width:0;color:var(--text-tertiary);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.source-editor-status[data-state=dirty]{border-color:color-mix(in srgb, var(--status-warning-default) 22%, var(--border-neutral-l1));background:color-mix(in srgb, var(--status-warning-default) 6%, var(--bg-base-default))}.source-editor-status[data-state=dirty] .source-editor-status__dot{background:var(--status-warning-default);box-shadow:0 0 0 3px color-mix(in srgb, var(--status-warning-default) 16%, transparent)}.source-editor-status[data-state=warning]{border-color:color-mix(in srgb, var(--status-error-default) 24%, var(--border-neutral-l1));background:color-mix(in srgb, var(--status-error-default) 5%, var(--bg-base-default))}.source-editor-status[data-state=warning] .source-editor-status__dot{background:var(--status-error-default);box-shadow:0 0 0 3px color-mix(in srgb, var(--status-error-default) 14%, transparent)}.source-editor-tools{align-items:center;gap:var(--spacer-8);padding:0 var(--spacer-12) var(--spacer-10);flex-wrap:wrap;display:flex}.source-search-field{align-items:center;gap:var(--spacer-6);min-width:0;height:28px;padding:0 var(--spacer-8);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-default);flex:160px;display:inline-flex}.source-search-field[data-state=found]{border-color:color-mix(in srgb, var(--status-success-default) 26%, var(--border-neutral-l1));background:color-mix(in srgb, var(--status-success-default) 4%, var(--bg-base-default))}.source-search-field[data-state=empty]{border-color:color-mix(in srgb, var(--status-warning-default) 30%, var(--border-neutral-l1));background:color-mix(in srgb, var(--status-warning-default) 5%, var(--bg-base-default))}.source-search-field:focus-within{border-color:color-mix(in srgb, var(--accent-blue) 38%, var(--border-neutral-l1));box-shadow:0 0 0 3px color-mix(in srgb, var(--accent-blue) 13%, transparent)}.source-search-field svg{width:14px;height:14px;color:var(--icon-tertiary);flex-shrink:0}.source-search-field input{background:0 0;border:0;outline:0;flex:1;min-width:0;font-size:12px}.source-search-count{min-width:48px;color:var(--text-tertiary);font-family:var(--font-family-metric);text-align:right;font-variant-numeric:tabular-nums;font-size:11px}.source-search-count[data-state=found]{color:var(--status-success-default);font-weight:650}.source-search-count[data-state=empty]{color:var(--status-warning-default);font-weight:650}.source-editor-meta{align-items:center;gap:var(--spacer-8);padding:var(--spacer-8) var(--spacer-12);color:var(--text-tertiary);font-family:var(--font-family-mono);border-bottom:1px solid var(--border-neutral-l1);background:var(--bg-base-secondary);flex-wrap:wrap;font-size:11px;display:flex}.source-editor-meta span{padding:0 var(--spacer-8);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-full);background:var(--bg-base-default);align-items:center;height:20px;display:inline-flex}.source-editor-language,.source-dirty{color:var(--text-brand);font-weight:500}.source-dirty{border-color:color-mix(in srgb, var(--status-warning-default) 36%, var(--border-neutral-l1))!important;background:var(--status-warning-surface-l1)!important;color:var(--status-warning-default)!important}.source-editor-actions{gap:var(--spacer-8);padding:var(--spacer-10) var(--spacer-12);border-top:1px solid var(--border-neutral-l1);background:var(--bg-base-default);flex-wrap:wrap;justify-content:flex-end;margin-left:0;display:flex}.source-editor>.field{min-height:0;padding:0 var(--spacer-12);flex:1}.source-editor>.field label{flex-shrink:0}.source-code-shell{border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-default);flex:1;grid-template-columns:44px minmax(0,1fr);min-height:0;display:grid;overflow:hidden}.source-code-shell:focus-within{border-color:color-mix(in srgb, var(--accent-blue) 34%, var(--border-neutral-l1));box-shadow:0 0 0 3px color-mix(in srgb, var(--accent-blue) 12%, transparent), 0 10px 24px #0f172a0d}.source-line-gutter{padding:var(--spacer-12) var(--spacer-8);border-right:1px solid var(--border-neutral-l1);background:var(--bg-base-secondary);color:var(--text-tertiary);font-family:var(--font-family-mono);text-align:right;-webkit-user-select:none;user-select:none;margin:0;font-size:11px;line-height:22px;overflow:hidden}.source-editor textarea.code-editor{min-height:0;font-family:var(--font-family-mono);padding:var(--spacer-12);resize:none;background:var(--bg-base-default);border:0;border-radius:0;flex:1;font-size:12px;line-height:22px}.source-editor textarea.code-editor::selection{background:color-mix(in srgb, var(--accent-teal) 32%, transparent)}.source-textarea--nowrap{white-space:pre;overflow:auto}.source-textarea--wrap{white-space:pre-wrap;overflow:auto}@media (width<=760px){.dialog-backdrop .export-dialog[data-state]{background:linear-gradient(180deg, var(--bg-base-default), var(--bg-base-secondary))}.source-editor-status{grid-template-columns:auto minmax(0,1fr)}.source-editor-status>span:last-child{white-space:normal;grid-column:2}.source-editor-tools{grid-template-columns:minmax(0,1fr) auto;align-items:center;display:grid}.source-search-field{grid-column:1/-1;width:100%}.source-search-count{text-align:left}.source-editor-tools .ds-btn{min-width:0}.source-editor-actions{grid-template-columns:1fr 1fr;display:grid}.source-editor-actions .source-validator-warning{grid-column:1/-1;margin-left:0}}:root{--n-ease-press:cubic-bezier(.22, 1, .36, 1);--n-ease-expand:cubic-bezier(.16, 1, .3, 1);--n-ease-modal:cubic-bezier(.4, 0, 1, 1);--press-scale-button:.97;--press-scale-icon:.94;--press-scale-card:.985}.dark{--n-fg-tertiary:#ffffff94;--n-border-default:#ffffff29;--n-border-strong:#ffffff3d}@media (hover:hover) and (prefers-reduced-motion:no-preference){.ds-btn:not(:disabled):active,.icon-button:not(:disabled):active,.icon-btn:not(:disabled):active,.panel-collapse-btn:not(:disabled):active,.panel-expand-btn:not(:disabled):active,.segmented-button:not(:disabled):active,.topbar-file-action:not(:disabled):active,.inspector-command-bar button:not(:disabled):active,.tree-node:not(:disabled):active{transform:scale(var(--press-scale-button));transition:transform 80ms var(--n-ease-press)}}.statusbar-pill--live{border:1px solid color-mix(in srgb, var(--n-brand) 26%, var(--n-border-default));border-radius:var(--radius-pill,999px);background:color-mix(in srgb, var(--n-brand) 9%, var(--n-bg-elevated));max-width:min(42vw,360px);padding:3px 9px}.statusbar-pill--ready{border-color:color-mix(in srgb, var(--n-success) 30%, var(--n-border-default));background:color-mix(in srgb, var(--n-success) 9%, var(--n-bg-elevated))}.statusbar-pill--warning{border-color:color-mix(in srgb, var(--n-warning) 34%, var(--n-border-default));background:color-mix(in srgb, var(--n-warning) 10%, var(--n-bg-elevated))}.statusbar-pill--error{border-color:color-mix(in srgb, var(--n-danger) 34%, var(--n-border-default));background:color-mix(in srgb, var(--n-danger) 10%, var(--n-bg-elevated))}.statusbar{min-height:max(var(--statusbar-height,24px), 28px);scrollbar-gutter:stable;overflow-x:auto}.toast{top:calc(var(--topbar-height,45px) + 14px);border:1px solid var(--n-border-strong);border-radius:var(--n-radius-md);background:var(--n-bg-elevated);color:var(--n-fg-default);box-shadow:var(--n-shadow-overlay);bottom:auto;left:auto;right:18px;transform:translateY(-8px)}@keyframes toast-pop-in{0%{opacity:0;transform:translate(-50%,12px)scale(.92)}60%{opacity:1;transform:translate(-50%,-2px)scale(1.02)}to{opacity:1;transform:translate(-50%)scale(1)}}.nw-left-panel,.nw-right-panel{scrollbar-gutter:stable}.app-shell,.app-topbar,.statusbar,.nw-left-panel,.nw-right-panel,.nw-canvas,.stage{transition:background-color var(--n-duration-base) var(--n-ease-expand), border-color var(--n-duration-base) var(--n-ease-expand), color var(--n-duration-base) var(--n-ease-expand)}.nw-app.app-shell{height:100dvh;min-height:100dvh}.topbar-file-actions .topbar-export-action{justify-content:center;gap:6px;min-width:74px;padding-inline:12px}.topbar-file-actions .topbar-export-action:disabled{opacity:.78}.topbar-export-action[data-exporting=true]>span{font-size:0}.topbar-export-action[data-exporting=true]>span:after{content:"导出…";font-size:12px}.preview-build-error{z-index:5;border:1px solid color-mix(in srgb, var(--n-danger) 28%, var(--n-border-default));border-radius:var(--n-radius-md);background:color-mix(in srgb, var(--n-bg-elevated) 94%, var(--n-danger));width:min(520px,100% - 32px);color:var(--n-fg-default);box-shadow:var(--n-shadow-overlay);gap:5px;padding:14px 16px;display:grid;position:absolute;top:16px;left:50%;transform:translate(-50%)}.preview-build-error span,.preview-build-error small{color:var(--n-fg-secondary);line-height:1.45}.inspector-apply-btn--full[data-dirty-count]{font-size:0}.inspector-apply-btn--full[data-dirty-count]:before{font-size:12px}.inspector-apply-btn--full[data-dirty-count="0"]:before{content:"✓ 已自动应用"}.inspector-apply-btn--full[data-dirty-count]:not([data-dirty-count="0"]):before{content:"✓ 全部应用 · " attr(data-dirty-count) " 项待提交"}.ai-scan-security-note{border:1px solid color-mix(in srgb, var(--n-warning) 34%, var(--n-border-default));border-radius:var(--n-radius-sm);background:color-mix(in srgb, var(--n-warning) 8%, var(--n-bg-subtle));color:var(--n-fg-secondary);font-size:var(--text-xs,12px);margin:0 0 10px;padding:8px 10px;line-height:1.45}.global-drag-overlay{inset:var(--topbar-height,45px) 0 var(--statusbar-height,24px);z-index:70;pointer-events:none;border:2px dashed var(--n-brand);background:color-mix(in srgb, var(--n-brand) 10%, transparent);color:var(--n-brand);letter-spacing:.01em;place-items:center;font-size:14px;font-weight:600;display:grid;position:fixed}.export-dialog.is-exporting{position:relative}.export-dialog-busy{z-index:5;background:color-mix(in srgb, var(--n-bg-elevated) 82%, transparent);color:var(--n-fg-default);font-size:var(--text-sm,13px);pointer-events:auto;align-content:center;place-items:center;gap:8px;font-weight:600;display:grid;position:absolute;inset:0}.export-dialog-busy svg{color:var(--n-brand)}.tree-node.is-selected{animation:tree-selection-in .18s var(--n-ease-press)}.tree-node__diag{animation:annotation-fade-in .22s var(--n-ease-expand) both}@keyframes tree-selection-in{0%{box-shadow:inset 0 0 0 0 var(--n-brand)}to{box-shadow:inset 3px 0 0 var(--n-brand)}}@keyframes annotation-fade-in{0%{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}@media (width<=760px){.toast{top:calc(var(--topbar-height,45px) + 10px);text-align:center;max-width:none;left:10px;right:10px}.statusbar-zone--center{min-width:0}.statusbar-pill--live{max-width:46vw}}@media (prefers-reduced-motion:reduce){.tree-node.is-selected,.tree-node__diag{animation:none!important}}.history-drawer-backdrop{inset:var(--topbar-height) 0 var(--statusbar-height);z-index:84;cursor:default;-webkit-backdrop-filter:none;backdrop-filter:none;animation:history-backdrop-in .18s var(--ease-quint) both;background:#0f0f0f40;border:0;padding:0;display:block;position:fixed}@keyframes history-backdrop-in{0%{opacity:0}to{opacity:1}}.history-drawer{right:var(--spacer-16);top:calc(var(--topbar-height) + var(--spacer-20));z-index:90;width:340px;max-height:calc(100vh - var(--topbar-height) - var(--statusbar-height) - var(--spacer-32));border:1px solid var(--n-border-default);border-radius:var(--n-radius-xl);background:var(--n-bg-elevated);box-shadow:var(--n-shadow-overlay);animation:history-drawer-in var(--n-duration-slow) var(--n-ease) both;will-change:transform, opacity;flex-direction:column;display:flex;position:fixed;overflow:hidden}@keyframes history-drawer-in{0%{opacity:0;transform:translate(8px)}to{opacity:1;transform:translate(0,0)}}.history-drawer-head{border-bottom:1px solid var(--n-border-default);flex-shrink:0;padding:0 16px}.history-drawer-head>div{padding:10px 0 6px}.history-drawer-head__top{justify-content:space-between;align-items:center;display:flex}.history-drawer-head__top span{color:var(--n-fg-default);font-size:14px;font-weight:600;font-family:var(--n-font-sans);line-height:1.3}.history-drawer-head__sub{color:var(--n-fg-tertiary);font-size:10px;font-family:var(--n-font-sans);letter-spacing:2px;margin-top:1px;line-height:1.4;display:block}.history-drawer-close{width:24px;height:24px;color:var(--n-fg-tertiary);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;display:inline-flex}.history-drawer-close:hover{background:var(--n-bg-hover)}.history-drawer-body{flex:1;overflow-y:auto}.history-drawer-body::-webkit-scrollbar{width:4px}.history-drawer-body::-webkit-scrollbar-track{background:0 0}.history-drawer-body::-webkit-scrollbar-thumb{background:var(--n-border-default);border-radius:2px}.history-drawer-body::-webkit-scrollbar-thumb:hover{background:var(--n-border-strong)}.history-drawer-empty{height:80px;color:var(--n-fg-tertiary);font-size:12px;font-family:var(--n-font-sans);justify-content:center;align-items:center;display:flex}.history-drawer-row{border:0;border-bottom:1px solid var(--n-border-default);background:var(--n-bg-elevated);width:100%;height:56px;color:var(--n-fg-default);text-align:left;font:inherit;cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease);align-items:center;padding:0;display:flex}.history-drawer-row:nth-child(2n){background:var(--n-bg-sidebar)}.history-drawer-row:hover{background:var(--n-bg-hover)}.history-drawer-row:focus-visible{outline:2px solid var(--n-brand);outline-offset:-2px}.history-drawer-row__indicator{background:var(--n-border-default);width:3px;height:56px;transition:background var(--n-duration-base) var(--n-ease);flex-shrink:0}.history-drawer-row.is-current .history-drawer-row__indicator{background:var(--n-brand)}.history-drawer-row__time{flex-direction:column;flex-shrink:0;align-items:flex-start;width:60px;padding:0 12px;display:flex}.history-drawer-row__time-value{color:var(--n-fg-secondary);font-size:11px;font-family:var(--n-font-mono);line-height:1.3}.history-drawer-row__date{color:var(--n-fg-disabled);font-size:10px;font-family:var(--n-font-sans);line-height:1.3}.history-drawer-row__desc{min-width:0;color:var(--n-fg-default);font-size:13px;font-weight:400;font-family:var(--n-font-sans);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.history-drawer-row__badge{white-space:nowrap;height:28px;font-size:10px;font-weight:500;font-family:var(--n-font-sans);border-radius:14px;flex-shrink:0;align-items:center;margin-right:12px;padding:0 8px;display:inline-flex}.history-drawer-footer{border-top:1px solid var(--n-border-default);flex-shrink:0;justify-content:center;align-items:center;height:40px;display:flex}.history-drawer-clear-btn{color:var(--n-fg-tertiary);font-size:11px;font-weight:400;font-family:var(--n-font-sans);cursor:pointer;transition:color var(--n-duration-fast) var(--n-ease);background:0 0;border:none;align-items:center;gap:6px;display:inline-flex}.history-drawer-clear-btn:hover{color:var(--n-fg-secondary)}.dialog-backdrop,.cheatsheet-backdrop{background:radial-gradient(circle at 50% 24%, color-mix(in srgb, var(--bg-base-default) 30%, transparent), transparent 42%), #0f172a61;z-index:1000;padding:var(--spacer-20);-webkit-backdrop-filter:var(--surface-vibrancy-soft);backdrop-filter:var(--surface-vibrancy-soft);animation:backdrop-fade-in var(--motion-base) var(--ease-soft-end) both;place-items:center;display:grid;position:fixed;inset:0}@keyframes backdrop-fade-in{0%{opacity:0}to{opacity:1}}.export-dialog{background:var(--n-bg-elevated);border:1px solid var(--n-border-default);border-radius:var(--n-radius-xl);width:min(92vw,820px);max-width:820px;max-height:88vh;box-shadow:var(--n-shadow-overlay);transform-origin:50%;animation:export-dialog-in var(--n-duration-slow) var(--n-ease) both;will-change:transform, opacity;flex-direction:column;padding:0;display:flex;overflow:hidden}.export-dialog-header{justify-content:space-between;align-items:flex-start;gap:var(--spacer-12);padding:var(--spacer-20) var(--spacer-24) var(--spacer-18,18px);border-bottom:1px solid color-mix(in srgb, var(--text-default) 8%, transparent);background:linear-gradient(90deg, color-mix(in srgb, var(--accent-teal) 8%, transparent), transparent 38%), color-mix(in srgb, var(--bg-base-default) 72%, transparent);display:flex}.export-dialog-header__title{align-items:flex-start;gap:var(--spacer-12);min-width:0;display:flex}.export-dialog-header__icon{background:linear-gradient(180deg, color-mix(in srgb, var(--accent-teal) 84%, #fff), #10a696);width:36px;height:36px;color:var(--text-onbrand);box-shadow:0 8px 18px color-mix(in srgb, var(--accent-teal) 24%, transparent), 0 1px 0 #ffffff70 inset;border-radius:10px;flex-shrink:0;place-items:center;display:grid}.export-dialog[data-state=blocked] .export-dialog-header__icon{background:linear-gradient(180deg, color-mix(in srgb, var(--status-warning-default) 88%, #fff), #d98607);box-shadow:0 8px 18px color-mix(in srgb, var(--status-warning-default) 22%, transparent), 0 1px 0 #ffffff6b inset}.export-dialog-header__eyebrow{color:var(--text-tertiary);letter-spacing:0;text-transform:uppercase;margin-bottom:2px;font-size:10px;font-weight:700;display:block}.export-dialog-header h2{letter-spacing:0;margin:0 0 2px;font-size:17px;font-weight:650}.export-dialog-header p{color:var(--text-tertiary);margin:0;font-size:12px;line-height:1.5}.export-dialog-stats{justify-content:space-between;align-items:center;gap:var(--spacer-12);padding:var(--spacer-12) var(--spacer-24);background:color-mix(in srgb, var(--bg-base-secondary) 64%, transparent);border-bottom:1px solid color-mix(in srgb, var(--text-default) 7%, transparent);display:flex}.export-status-pill{align-items:center;gap:var(--spacer-6);min-height:28px;padding:4px var(--spacer-10);border-radius:var(--radius-full);letter-spacing:0;min-width:0;transition:background var(--motion-base) var(--ease-emphasized), box-shadow var(--motion-base) var(--ease-emphasized), transform var(--motion-base) var(--ease-emphasized);font-size:11px;font-weight:600;display:inline-flex}.export-status-pill small{color:currentColor;opacity:.72;font-size:10px;font-weight:500}.export-status-pill.is-ready,.export-status-pill.is-ok{color:var(--status-success-default);background:color-mix(in srgb, var(--status-success-default) 10%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--status-success-default) 22%, transparent)}.export-status-pill.is-warning,.export-status-pill.is-blocked{color:var(--status-warning-default);background:color-mix(in srgb, var(--status-warning-default) 11%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--status-warning-default) 22%, transparent)}.export-stat-group{align-items:center;gap:var(--spacer-6);display:inline-flex}.export-stat{border-radius:var(--radius-8);background:color-mix(in srgb, var(--bg-base-default) 82%, transparent);border:1px solid color-mix(in srgb, var(--text-default) 8%, transparent);justify-content:center;align-items:baseline;gap:4px;min-width:72px;padding:4px 10px;display:inline-flex;box-shadow:inset 0 1px #ffffffa3}.export-stat__num{font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;color:var(--text-default);font-size:12px;font-weight:600}.export-stat__label{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:0;font-size:10px}.export-warning-list{padding:var(--spacer-12) var(--spacer-24);color:var(--text-secondary);border-bottom:1px solid color-mix(in srgb, var(--status-warning-default) 16%, transparent);background:linear-gradient(90deg, color-mix(in srgb, var(--status-warning-default) 9%, transparent), transparent 45%), color-mix(in srgb, var(--bg-base-default) 78%, transparent);font-size:12px}.export-warning-list strong{color:var(--status-warning-default);justify-content:space-between;align-items:center;gap:var(--spacer-8);margin-bottom:var(--spacer-8);font-weight:600;display:flex}.export-warning-list strong span{color:color-mix(in srgb, var(--status-warning-default) 76%, var(--text-default));font-size:10px;font-weight:600}.export-warning-list ul{gap:var(--spacer-6);margin:0;padding:0;list-style:none;display:grid}.export-warning-list li{align-items:start;gap:var(--spacer-6);border-radius:var(--radius-8);background:color-mix(in srgb, var(--bg-base-default) 72%, transparent);grid-template-columns:18px minmax(0,1fr);padding:6px 8px;display:grid}.export-warning-list li[data-severity=blocking]{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--status-warning-default) 20%, transparent)}.export-warning-list__icon{width:18px;height:18px;color:var(--status-warning-default);place-items:center;display:grid}.export-dialog-code{border-top:1px solid color-mix(in srgb, var(--text-default) 8%, transparent);border-bottom:1px solid color-mix(in srgb, var(--text-default) 8%, transparent);background:radial-gradient(circle at 18% 0,#2dd4bf1a,#0000 32%),linear-gradient(#101827 0%,#0b1220 100%);flex-direction:column;flex:1;min-height:280px;margin:0;display:flex}.export-dialog-code__chrome{background:#00000040;border-bottom:1px solid #ffffff0f;flex-shrink:0;align-items:center;gap:6px;padding:8px 14px;display:flex}.export-dialog-code__dot{border-radius:var(--radius-full);background:#ffffff2e;width:10px;height:10px}.export-dialog-code__dot:first-child{background:#ff5f57}.export-dialog-code__dot:nth-child(2){background:#febc2e}.export-dialog-code__dot:nth-child(3){background:#28c840}.export-dialog-code__file{font-family:var(--font-family-mono);color:#ffffff8c;font-variant-numeric:tabular-nums;margin-left:12px;font-size:11px}.export-dialog-code__meta{color:#ffffff6b;font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;margin-left:auto;font-size:10px}.export-preview-code{resize:none;color:#cbd5e1;min-height:0;caret-color:var(--bg-brand);font-family:var(--font-family-mono);padding:var(--spacer-16) var(--spacer-20);tab-size:2;background:0 0;border:0;outline:none;flex:1;font-size:12px;line-height:1.62;box-shadow:inset 0 1px #ffffff08}.export-preview-code:focus{box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--accent-teal) 42%, transparent), inset 0 1px 0 #ffffff08;outline:none}.export-dialog-actions{align-items:center;gap:var(--spacer-8);padding:var(--spacer-14,14px) var(--spacer-24);background:color-mix(in srgb, var(--bg-base-secondary) 72%, transparent);border-top:1px solid color-mix(in srgb, var(--text-default) 7%, transparent);flex-shrink:0;grid-template-columns:minmax(0,1fr) auto auto;display:grid}.export-dialog-actions__hint{min-width:0;color:var(--text-tertiary);margin:0;font-size:11px;line-height:1.45}.export-action{justify-content:center;align-items:center;gap:var(--spacer-6);height:36px;padding:0 var(--spacer-16);white-space:nowrap;transition:transform .17s var(--ease-emphasized), box-shadow .16s var(--hft-press), background .16s var(--hft-press), border-color .16s var(--hft-press);font-weight:600;display:inline-flex}.export-action:disabled{cursor:not-allowed;opacity:.48;box-shadow:none}.export-check{color:var(--text-secondary);padding:var(--spacer-12) var(--spacer-20);font-size:12px}.export-check-warning{color:var(--status-warning-default);background:var(--status-warning-surface-l1);padding:var(--spacer-8) var(--spacer-12);border-radius:var(--radius-6);margin:var(--spacer-12) var(--spacer-20);font-size:12px}@keyframes export-dialog-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.export-dialog.is-closing{animation:export-dialog-out var(--motion-exit) var(--ease-exit) both}@keyframes export-dialog-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(4px)}}@media (width<=760px){.dialog-backdrop{padding:var(--spacer-8)}.export-dialog{width:min(100%,100vw - 16px);max-height:calc(100vh - 16px)}.export-dialog-header,.export-dialog-stats,.export-warning-list,.export-dialog-actions{padding-left:var(--spacer-16);padding-right:var(--spacer-16)}.export-dialog-stats{flex-direction:column;align-items:stretch}.export-status-pill{justify-content:flex-start;width:100%}.export-stat-group{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;display:grid}.export-stat{flex-direction:column;align-items:center;gap:0;min-width:0}.export-dialog-code{min-height:220px}.export-dialog-actions{grid-template-columns:1fr}.export-action{width:100%}}@media (width<=420px){.export-dialog-code__meta{display:none}.export-dialog-header__icon{width:32px;height:32px}}.cheatsheet{background:var(--surface-glass-strong);border:1px solid color-mix(in srgb, var(--text-default) 10%, transparent);width:92vw;max-width:580px;max-height:86vh;-webkit-backdrop-filter:var(--surface-vibrancy);backdrop-filter:var(--surface-vibrancy);box-shadow:var(--elev-floating);animation:cheatsheet-pop-in .28s var(--ease-emphasized);will-change:transform, opacity;border-radius:16px;flex-direction:column;padding:0;display:flex;overflow:hidden}.cheatsheet-head{justify-content:space-between;align-items:center;gap:var(--spacer-12);padding:var(--spacer-20) var(--spacer-24) var(--spacer-16);border-bottom:1px solid var(--border-neutral-l1);display:flex}.cheatsheet-head h2{letter-spacing:-.01em;margin:0 0 2px;font-size:17px;font-weight:650}.cheatsheet-head p{color:var(--text-tertiary);margin:0;font-size:12px;line-height:1.4}.cheatsheet-body{padding:var(--spacer-16) var(--spacer-24) var(--spacer-20);gap:var(--spacer-20) var(--spacer-24);flex:1;grid-template-columns:1fr 1fr;display:grid;overflow-y:auto}.cheatsheet-section{gap:var(--spacer-6);flex-direction:column;min-width:0;display:flex}.cheatsheet-section__title{margin:0 0 var(--spacer-2);padding:0 0 var(--spacer-4);letter-spacing:.08em;text-transform:uppercase;color:var(--text-tertiary);border-bottom:1px solid var(--border-neutral-l1);font-size:10px;font-weight:600}.cheatsheet-list{flex-direction:column;gap:2px;margin:0;display:flex}.cheatsheet-row{justify-content:space-between;align-items:center;gap:var(--spacer-12);padding:6px var(--spacer-8);margin:0 calc(-1 * var(--spacer-8));transition:background var(--motion-fast) var(--ease-standard), transform var(--motion-base) var(--ease-emphasized);border-radius:6px;display:flex}.cheatsheet-row:hover{background:var(--bg-overlay-l1);transform:translate(1px)}.cheatsheet-row dt,.cheatsheet-row dd{margin:0;font-size:12px}.cheatsheet-row dt{font-family:var(--font-family-mono);font-variant-numeric:tabular-nums;flex-shrink:0;align-items:center;gap:4px;display:inline-flex}.cheatsheet-row dt>span{color:var(--text-muted);font-family:var(--font-family-default);margin:0 1px;font-size:11px;font-weight:500}.cheatsheet-row dd{color:var(--text-secondary);text-align:right;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.cheatsheet kbd{font-family:var(--font-family-mono);border:1px solid var(--border-neutral-l2);background:linear-gradient(180deg, var(--bg-base-default) 0%, var(--bg-base-secondary) 100%);color:var(--text-default);text-align:center;min-width:20px;box-shadow:0 1px 0 var(--border-neutral-l1), inset 0 1px 0 var(--bg-base-default);transition:transform var(--motion-base) var(--ease-emphasized), box-shadow var(--motion-base) var(--ease-emphasized);border-radius:5px;padding:3px 6px;font-size:10.5px;font-weight:500;line-height:1;display:inline-block}.cheatsheet-row:hover kbd{box-shadow:0 2px 0 var(--border-neutral-l1), inset 0 1px 0 var(--bg-base-default);transform:translateY(-2px)scale(1.04)}.toast{bottom:calc(var(--statusbar-height) + var(--spacer-16));padding:var(--spacer-8) var(--spacer-16);background:var(--bg-invert);color:var(--text-onbrand);border-radius:var(--radius-full);letter-spacing:-.005em;-webkit-backdrop-filter:var(--surface-vibrancy-soft);backdrop-filter:var(--surface-vibrancy-soft);opacity:0;transition:opacity var(--motion-base) var(--ease-standard), transform var(--motion-base) var(--ease-standard);z-index:80;pointer-events:none;font-size:12px;font-weight:500;position:fixed;left:50%;overflow:hidden;transform:translate(-50%,12px);box-shadow:inset 0 1px #ffffff1a,0 6px 16px #0f172a2e,0 16px 40px #0f172a38}.toast.is-visible{opacity:1;animation:toast-pop-in .38s var(--ease-emphasized);will-change:transform, opacity;transform:translate(-50%)}.toast:after{content:"";border-radius:var(--radius-full);background:color-mix(in srgb, currentColor 42%, transparent);transform-origin:0;opacity:0;height:2px;position:absolute;bottom:4px;left:10px;right:10px;transform:scaleX(0)}.toast.is-visible:after{opacity:.72;animation:1.6s linear both toast-progress}@keyframes toast-progress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.status-bar{height:var(--statusbar-height);min-height:var(--statusbar-height);padding:0 var(--spacer-16);background:var(--bg-base-secondary);border-top:1px solid var(--border-neutral-l1);color:var(--text-tertiary);justify-content:space-between;align-items:center;gap:var(--spacer-16);font-size:11px;display:flex}.statusbar{height:var(--statusbar-height);padding:0 var(--spacer-16);background:var(--bg-base-secondary);border-top:1px solid var(--border-neutral-l1);color:var(--text-tertiary);justify-content:space-between;align-items:center;font-size:11px;display:flex}.status-bar-primary,.status-left,.status-right{align-items:center;gap:var(--spacer-12);min-width:0;display:inline-flex}.status-bar-secondary{display:none}.status-bar-secondary.status-bar-secondary-open{padding-left:var(--spacer-16);color:var(--text-tertiary);align-items:center;display:inline-flex}.status-bar-toggle{border-radius:var(--radius-4);width:20px;height:20px;color:var(--text-tertiary);justify-content:center;align-items:center;display:inline-flex}.status-bar-toggle:hover{background:var(--bg-overlay-l2);color:var(--text-default)}.status-item,.statusbar-section{align-items:center;gap:var(--spacer-6);color:var(--text-tertiary);white-space:nowrap;font-size:11px;display:inline-flex}.status-item svg,.statusbar-section svg{width:12px;height:12px}.status-item strong,.statusbar-section strong{color:var(--text-default);font-weight:500}.status-item small,.statusbar-section small{color:var(--text-tertiary);font-size:11px}.status-dot{border-radius:var(--radius-full);background:var(--text-tertiary);width:6px;height:6px;transition:transform var(--motion-base) var(--ease-emphasized), box-shadow var(--motion-base) var(--ease-emphasized);display:inline-block}.status-dot-muted{background:var(--text-tertiary)}.status-item-active .status-dot{background:var(--bg-brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--bg-brand) 18%, transparent)}.status-preview-ready .status-dot{background:var(--status-success-default);box-shadow:0 0 0 3px color-mix(in srgb, var(--status-success-default) 18%, transparent)}.status-preview-syncing .status-dot{background:var(--status-warning-default);animation:pulse-dot 1.4s var(--ease-emphasized) infinite;box-shadow:0 0 0 3px color-mix(in srgb, var(--status-warning-default) 18%, transparent)}.status-preview-error .status-dot{background:var(--status-error-default);box-shadow:0 0 0 3px color-mix(in srgb, var(--status-error-default) 18%, transparent)}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.78)}}.status-divider{background:var(--border-neutral-l1);width:1px;margin:0 var(--spacer-2);align-self:stretch}.status-tech-pill,.status-metric{font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;color:var(--text-tertiary);font-size:11px}.status-bar-tech-label{color:var(--text-tertiary);font-size:11px}.ds-btn{justify-content:center;align-items:center;gap:var(--spacer-6);height:28px;padding:0 var(--spacer-12);border-radius:var(--n-radius-md);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;font-family:var(--n-font-sans);letter-spacing:-.01em;color:var(--n-fg-default);background:var(--n-bg-elevated);transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease), border-color var(--n-duration-fast) var(--n-ease), opacity var(--n-duration-fast) var(--n-ease);border:1px solid #0000;font-size:13px;font-weight:500;line-height:18px;display:inline-flex}@media (hover:hover) and (pointer:fine){.ds-btn:hover:not([disabled]){background:var(--n-bg-hover);border-color:var(--n-border-default)}}.ds-btn:active:not([disabled]),.ds-btn:focus-visible{background:var(--n-bg-hover)}.ds-btn svg{width:14px;height:14px;color:var(--n-fg-secondary);flex:none}.ds-btn:hover:not([disabled]) svg{color:var(--n-fg-default)}.ds-btn:active:not([disabled]){background:#0000000a}.ds-btn--sm{height:24px;padding:0 var(--spacer-8);border-radius:var(--n-radius-sm);font-size:12px}.ds-btn--lg{height:32px;padding:0 var(--spacer-16);border-radius:var(--n-radius-md);font-size:14px}.ds-btn--icon{width:28px;padding:0}.ds-btn--icon.ds-btn--sm{width:24px}.ds-btn--icon.ds-btn--lg{width:32px}.ds-btn.is-on{background:var(--n-bg-hover);border-color:var(--n-border-default);color:var(--n-fg-default)}.ds-btn.is-on:hover{background:var(--n-bg-subtle);border-color:var(--n-border-strong)}.ds-btn:focus-visible{box-shadow:var(--n-ring-focus);outline:none}.ds-btn--ghost{color:var(--n-fg-default);background:0 0;border-color:#0000}.ds-btn--ghost:hover{background:var(--n-bg-hover);color:var(--n-fg-default)}.ds-btn--ghost:active{background:var(--n-bg-subtle)}.ds-btn--ghost[disabled]{color:var(--n-fg-disabled);cursor:not-allowed}.ds-btn--secondary{background:var(--n-bg-elevated);color:var(--n-fg-default);border-color:var(--n-border-default)}.ds-btn--secondary:hover{background:var(--n-bg-hover);border-color:var(--n-border-strong)}.ds-btn--secondary:active{background:var(--n-bg-subtle);border-color:var(--n-border-strong)}.ds-btn--secondary[disabled]{color:var(--n-fg-disabled);cursor:not-allowed;opacity:.7}.ds-btn--brand{background:var(--n-brand);color:var(--n-fg-onbrand);border-color:#0000;font-weight:500}.ds-btn--brand:hover{background:var(--n-brand-hover)}.ds-btn--brand:active{background:var(--n-brand-active)}.ds-btn--brand[disabled]{background:var(--n-brand-disabled);color:var(--n-fg-onbrand);cursor:not-allowed;border-color:#0000}.ds-btn--danger{background:var(--n-danger);color:var(--n-fg-onbrand);border-color:#0000}.ds-btn--danger:hover{background:#c0392b}.ds-btn-group{display:inline-flex}.ds-btn-group>.ds-btn{border-radius:var(--radius-0);margin-left:calc(-1 * var(--border-width-default));transition:background var(--n-duration-fast) var(--n-ease)}.ds-btn-group>.ds-btn.is-on{z-index:1;transform:scale(1.04)}.ds-btn-group>.ds-btn:first-child{border-top-left-radius:var(--radius-8);border-bottom-left-radius:var(--radius-8);margin-left:0}.ds-btn-group>.ds-btn:last-child{border-top-right-radius:var(--radius-8);border-bottom-right-radius:var(--radius-8)}.ds-input{align-items:center;gap:var(--spacer-8);min-height:32px;padding:0 var(--spacer-12);background:var(--n-bg-elevated);border:1px solid var(--n-border-default);border-radius:var(--n-radius-sm);color:var(--n-fg-default);width:100%;font-family:var(--n-font-sans);transition:border-color var(--n-duration-fast) var(--n-ease), background var(--n-duration-fast) var(--n-ease), box-shadow var(--n-duration-fast) var(--n-ease);font-size:14px;line-height:20px;display:flex}.ds-input:hover{border-color:var(--n-border-strong)}.ds-input:focus-within{border-color:var(--n-brand);background:var(--n-bg-elevated);box-shadow:var(--n-ring-focus);transition:border-color var(--n-duration-fast) var(--n-ease), box-shadow var(--n-duration-fast) var(--n-ease), background var(--n-duration-fast) var(--n-ease)}.ds-input input,.ds-input select{color:var(--text-default);font:inherit;background:0 0;border:none;outline:none;flex:1;min-width:0}.ds-input input::placeholder{color:var(--text-tertiary)}.ds-input.is-error{border-color:var(--status-error-default)}.ds-input.is-disabled{background:var(--bg-base-secondary);color:var(--text-disabled);cursor:not-allowed}.ds-input__icon{color:var(--icon-secondary);align-items:center;display:inline-flex}.ds-input svg{width:14px;height:14px}.ds-tab{padding:0 var(--spacer-12);height:32px;color:var(--text-tertiary);cursor:pointer;transition:color var(--motion-fast) var(--ease-standard);background:0 0;border:0;justify-content:center;align-items:center;margin-bottom:-1px;font-size:13px;font-weight:500;line-height:18px;display:inline-flex;position:relative}.ds-tab:after{content:"";background:linear-gradient(90deg, color-mix(in srgb, var(--bg-brand) 80%, transparent) 0%, var(--bg-brand) 100%);transform-origin:50%;height:2px;transition:transform var(--motion-spring-snap,.38s) var(--ease-emphasized), box-shadow var(--motion-base) var(--ease-emphasized);border-radius:2px 2px 0 0;position:absolute;bottom:-1px;left:12px;right:12px;transform:scaleX(0)}.ds-tab:hover{color:var(--text-default)}.ds-tab:hover:after{opacity:.5;transform:scaleX(.6)}.ds-tab.is-active{color:var(--text-default)}.ds-tab.is-active:after{opacity:1;box-shadow:0 1px 6px color-mix(in srgb, var(--bg-brand) 40%, transparent), 0 -1px 0 color-mix(in srgb, var(--bg-brand) 8%, transparent) inset;transform:scaleX(1)}.ds-tab:focus-visible{box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--bg-brand) 35%, transparent);border-radius:var(--radius-4);outline:none}.ds-card{background:var(--bg-base-default);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-12);overflow:hidden}.ds-card__head{align-items:center;gap:var(--spacer-8);padding:var(--spacer-12) var(--spacer-16);border-bottom:1px solid var(--border-neutral-l1);display:flex}.ds-card__head svg{width:14px;height:14px;color:var(--icon-secondary)}.ds-card__head h3{color:var(--text-default);flex:1;min-width:0;margin:0;font-size:13px;font-weight:500}.ds-card__body{padding:var(--spacer-12) var(--spacer-16);gap:var(--spacer-8);flex-direction:column;display:flex}.ds-card__footer{padding:var(--spacer-8) var(--spacer-16);border-top:1px solid var(--border-neutral-l1);justify-content:flex-end;align-items:center;gap:var(--spacer-8);display:flex}.ds-table{border-collapse:collapse;width:100%;font-size:12px}.ds-table th,.ds-table td{padding:var(--spacer-8) var(--spacer-12);text-align:left;border-bottom:1px solid var(--border-neutral-l1);vertical-align:middle}.ds-table th{color:var(--text-tertiary);font-size:11px;font-weight:500}.ds-table tr:last-child td{border-bottom:0}.ds-table tr:hover td{background:var(--bg-base-secondary)}.ds-switch{border-radius:var(--radius-full);background:var(--bg-overlay-l3);cursor:pointer;align-items:center;width:28px;height:16px;transition:background .12s;display:inline-flex;position:relative}.ds-switch:after{content:"";border-radius:var(--radius-full);background:var(--bg-base-default);width:12px;height:12px;transition:transform .12s;position:absolute;top:2px;left:2px;box-shadow:0 1px 2px #0000002e}.ds-switch.is-on{background:var(--bg-brand)}.ds-switch.is-on:after{transform:translate(12px)}.ds-pill{align-items:center;gap:var(--spacer-4);padding:0 var(--spacer-8);border-radius:var(--radius-full);background:var(--bg-overlay-l1);height:18px;color:var(--text-secondary);font-size:10px;font-weight:500;line-height:18px;display:inline-flex}.ds-pill--success{background:var(--status-success-surface-l1);color:var(--status-success-default)}.ds-pill--warning{background:var(--status-warning-surface-l1);color:var(--status-warning-default)}.ds-pill--error{background:var(--status-error-surface-l1);color:var(--status-error-default)}.ds-pill--primary{background:var(--status-primary-surface-l1);color:var(--status-primary-default)}.ds-pill--brand{background:var(--bg-brand-popup);color:var(--text-brand)}::-webkit-scrollbar-thumb{border-radius:var(--radius-full);transition:background .16s var(--ease-standard);background:#73737338 padding-box padding-box;border:0}::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb, var(--bg-brand) 28%, #73737366);background-clip:padding-box}::-webkit-scrollbar-thumb:active{background:color-mix(in srgb, var(--bg-brand) 50%, transparent)}*{scrollbar-color:#73737338 transparent;scrollbar-width:thin;scrollbar-width:thin;scrollbar-color:#73737340 transparent}.icon-btn{border-radius:var(--radius-8);width:28px;height:28px;color:var(--icon-secondary);cursor:pointer;transition:background .14s var(--ease-standard), color .14s var(--ease-standard), border-color .14s var(--ease-standard), transform .14s var(--ease-standard);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:0;display:inline-flex}.icon-btn:hover{background:var(--bg-overlay-l2);color:var(--icon-default)}.icon-btn:active{background:var(--bg-overlay-l3);transform:scale(.94)}.icon-btn:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--bg-brand) 35%, transparent);outline:none}.icon-btn[disabled]{color:var(--icon-disabled);cursor:not-allowed}.icon-btn svg{width:14px;height:14px;transition:transform .14s var(--ease-standard)}.icon-btn:hover svg{transform:scale(1.1)}.btn-muted{justify-content:center;align-items:center;gap:var(--spacer-6);height:28px;padding:0 var(--spacer-12);border-radius:var(--radius-8);color:var(--text-default);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;font-size:12px;font-weight:500;line-height:16px;transition:background .12s,color .12s;display:inline-flex}.btn-muted:hover:not(:disabled){background:var(--bg-overlay-l2);color:var(--text-default-hover)}.btn-muted:active:not(:disabled){background:var(--bg-overlay-l3)}.btn-muted:disabled{color:var(--text-disabled);cursor:not-allowed}.btn-muted svg{width:14px;height:14px}.btn-muted.is-active{background:var(--bg-overlay-l3);color:var(--text-default)}.dropdown{display:inline-flex;position:relative}.dropdown:not(.is-open) .dropdown-panel{display:none}.dropdown.is-open .dropdown-panel{display:flex}.dropdown-panel{min-width:180px;padding:var(--spacer-4);background:var(--n-bg-elevated);border:1px solid var(--n-border-default);border-radius:var(--n-radius-md);box-shadow:var(--n-shadow-pop);z-index:60;transform-origin:100% 0;animation:dropdown-pop-in var(--n-duration-base) var(--n-ease) both;flex-direction:column;gap:2px;position:absolute;top:calc(100% + 6px);right:0}@keyframes dropdown-pop-in{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}.menu-action{align-items:center;gap:var(--spacer-8);height:32px;padding:0 var(--spacer-8) 0 var(--spacer-12);color:var(--n-fg-default);border-radius:var(--n-radius-sm);cursor:pointer;text-align:left;white-space:nowrap;width:100%;transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease);background:0 0;border:0;font-size:12px;font-weight:500;line-height:16px;display:flex}.menu-action:hover{background:var(--n-bg-hover)}.menu-action:active{background:var(--n-bg-subtle)}.menu-action svg{width:14px;height:14px;color:var(--n-fg-secondary);flex-shrink:0}.menu-action strong{flex:1;font-weight:500}.menu-action .menu-action-key{font-family:var(--font-family-mono);color:var(--text-tertiary);background:var(--bg-base-secondary);border:1px solid var(--border-neutral-l1);border-radius:4px;margin-left:auto;padding:1px 6px;font-size:10px}.state-grid{gap:var(--spacer-8);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.state-card{align-items:center;gap:var(--spacer-8);height:28px;padding:0 var(--spacer-12);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-6);background:var(--bg-base-default);color:var(--text-secondary);font-variant-numeric:tabular-nums;min-width:0;font-size:11px;display:flex}.state-card strong{color:var(--text-default);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:500;overflow:hidden}.state-card small,.state-card .meta{color:var(--text-tertiary);margin-left:var(--spacer-4);flex-shrink:0;font-size:10px;font-weight:400}.state-card.is-loading{opacity:.6}.state-dot{border-radius:var(--radius-full);background:var(--text-tertiary);flex-shrink:0;width:8px;height:8px}.state-dot.is-active{background:var(--bg-brand)}.state-dot.is-success{background:var(--status-success-default)}.state-dot.is-warning{background:var(--status-warning-default)}.state-dot.is-error{background:var(--status-error-default)}.state-dot.is-muted{background:var(--text-tertiary)}.dot{border-radius:var(--radius-full);background:var(--text-tertiary);flex-shrink:0;width:6px;height:6px;display:inline-block}.dot.is-active{background:var(--bg-brand)}.dot.is-success{background:var(--status-success-default)}.dot.is-warning{background:var(--status-warning-default)}.dot.is-error{background:var(--status-error-default)}.live-preview-frame{background:var(--bg-base-default);border-radius:inherit;will-change:transform;border:0;width:100%;height:100%;display:block;overflow:hidden}.info-row{display:contents}.info-row dt,.info-row dd{display:block}.panel-resizer{width:var(--resizer-width);cursor:col-resize;transition:background var(--motion-base) var(--ease-emphasized);background:0 0;border:0;align-self:stretch;margin:0;padding:0;position:relative}.panel-resizer:before{content:"";transition:background var(--motion-base) var(--ease-emphasized), box-shadow var(--motion-base) var(--ease-emphasized);background:0 0;border-radius:1px;position:absolute;inset:0}.panel-resizer:hover:before{background:var(--bg-brand);box-shadow:0 0 8px color-mix(in srgb, var(--bg-brand) 40%, transparent)}.panel-resizer:focus-visible:before{background:var(--bg-brand);box-shadow:var(--focus-halo)}.panel-resizer:active:before{opacity:1;background:var(--bg-brand)!important;box-shadow:0 0 16px var(--bg-brand), 0 0 4px var(--bg-brand)!important}.panel-resizer:focus-visible{outline:none}.panel-resizer-source{border-right:1px solid var(--border-neutral-l1)}.panel-resizer-inspector{border-left:1px solid var(--border-neutral-l1)}.tree-item-row{border-radius:var(--radius-4);padding-left:calc(var(--tree-depth,0) * 14px);align-items:stretch;display:flex}:focus{outline:none}:focus-visible{outline:2px solid var(--bg-brand);outline-offset:2px;border-radius:var(--radius-4)}::selection{background:color-mix(in srgb, var(--bg-brand) 28%, transparent);color:var(--text-default)}@media (width<=1280px){:root{--source-col:240px;--inspector-col:320px}}@media (width<=1080px){:root{--source-col:220px;--inspector-col:320px}.brand-breadcrumb-prefix,.brand-breadcrumb-current{max-width:140px}}@media (width<=900px){.workspace{grid-template-columns:36px minmax(0, 1fr) var(--inspector-col)}.workspace:not(.workspace-source-collapsed):not(.workspace-inspector-collapsed)>.workspace-resizer-source,.left-tools>.upload-card>p,.left-tools>.ai-panel-row label,.left-tools>.ai-panel,.brand-breadcrumb{display:none}}@media (width<=760px){.workspace{grid-template-columns:36px minmax(0,1fr) 36px}.workspace:not(.workspace-inspector-collapsed)>.workspace-resizer-inspector,.status-bar-primary,.statusbar-section:not(.status-essential){display:none}.status-bar,.topbar,.app-header{padding:0 var(--spacer-12)}.export-dialog,.history-drawer,.cheatsheet,.color-popover,.toast,.ds-tooltip,.dialog-backdrop,.cheatsheet-backdrop,.history-drawer-backdrop,.ds-btn--secondary{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.color-popover{background:var(--bg-base-default)}.dialog-backdrop,.cheatsheet-backdrop{background:#0f172a61}.history-drawer-backdrop{background:#0f172a24}}@media (width<=640px){.app-shell.is-mobile-focus{grid-template-rows:var(--topbar-height) minmax(0, 1fr)}.app-shell.is-mobile-focus .status-bar,.inspector-tabs .button-label,.inspector-tabs .ds-input,.panel-tabs .button-label{display:none}}@media (width<=480px){:root{--topbar-height:48px;--panel-tab-height:36px}.topbar .toolbar-group-tail .button-label{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}[data-theme=dark]{--bg-base-default:#171717;--bg-base-secondary:#1f1f1f;--bg-base-tertiary:#262626;--bg-overlay-l1:#ffffff0a;--bg-overlay-l2:#ffffff14;--bg-overlay-l3:#ffffff1f;--bg-overlay-l4:#ffffff29;--text-default:#f5f5f5;--text-default-hover:#fff;--text-secondary:#d4d4d4;--text-tertiary:#a3a3a3;--text-disabled:#525252;--icon-default:#f5f5f5;--icon-secondary:#d4d4d4;--icon-tertiary:#a3a3a3;--icon-disabled:#525252;--border-neutral-l1:#ffffff14;--border-neutral-l2:#ffffff24;--border-neutral-l3:#ffffff3d;--border-contrast:#fff;--bg-brand:#6a6fff;--stage-checkerboard:#ffffff0f}[data-theme=dark] .stage{background-color:var(--bg-base-tertiary);background-image:radial-gradient(#ffffff0f 1px,#0000 1px)}@media (forced-colors:active){.ds-btn,.toolbar-button,.input,.textarea,.ds-input{border:1px solid buttontext}}.btn{justify-content:center;align-items:center;gap:var(--spacer-6);height:28px;padding:0 var(--spacer-12);border-radius:var(--radius-8);cursor:pointer;white-space:nowrap;font-family:var(--font-family-default);color:var(--text-default);transition:background .14s var(--ease-standard), color .14s var(--ease-standard), border-color .14s var(--ease-standard), transform .14s var(--ease-standard), box-shadow .14s var(--ease-standard);border:1px solid #0000;font-size:13px;font-weight:500;line-height:18px;display:inline-flex}.btn svg{flex-shrink:0;width:14px;height:14px}.btn-primary{background:linear-gradient(135deg, var(--bg-brand) 0%, color-mix(in srgb, var(--bg-brand-hover) 60%, var(--bg-brand)) 100%);color:var(--text-onbrand);border-color:var(--bg-brand);box-shadow:0 1px 2px color-mix(in srgb, var(--bg-brand) 16%, transparent), inset 0 1px 0 #ffffff2e;transition:background .16s var(--ease-standard), color .16s var(--ease-standard), border-color .16s var(--ease-standard), box-shadow .16s var(--ease-standard), transform .16s var(--ease-standard)}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg, var(--bg-brand-hover) 0%, var(--bg-brand) 100%);border-color:var(--bg-brand-hover);box-shadow:0 4px 14px color-mix(in srgb, var(--bg-brand) 36%, transparent), inset 0 1px 0 #ffffff3d;transform:translateY(-.5px)}.btn-primary:active:not(:disabled){background:var(--bg-brand-active);border-color:var(--bg-brand-active);box-shadow:0 1px 2px color-mix(in srgb, var(--bg-brand) 22%, transparent), inset 0 1px 0 #ffffff1f;transform:translateY(.5px)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--bg-overlay-l1);color:var(--text-default);border-color:var(--border-neutral-l1)}.btn-secondary:hover:not(:disabled){background:var(--bg-overlay-l2);border-color:var(--border-neutral-l2);box-shadow:0 1px 2px color-mix(in srgb, var(--text-default) 4%, transparent)}.btn-secondary:active:not(:disabled){background:var(--bg-overlay-l3);border-color:var(--border-neutral-l3);transform:scale(var(--press-scale-button));transition-duration:80ms}.btn-ghost{color:var(--text-secondary);transition:background .14s var(--ease-standard), color .14s var(--ease-standard), transform .14s var(--ease-standard);background:0 0;border-color:#0000}.btn-ghost:hover:not(:disabled){background:var(--bg-overlay-l2);color:var(--text-default)}.btn-ghost:active:not(:disabled){background:var(--bg-overlay-l3);transform:scale(var(--press-scale-button));transition-duration:80ms}.btn:hover:not(:disabled){transform:translateY(-.5px)}.btn:active:not(:disabled){transform:scale(var(--press-scale-button));transition-duration:80ms}.btn-danger{background:var(--status-error-default);color:var(--text-onbrand);border-color:var(--status-error-default)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--sm{height:24px;padding:0 var(--spacer-8);font-size:11px}.btn--lg{height:32px;padding:0 var(--spacer-16);font-size:13px}.btn--block{width:100%}.btn-row{gap:var(--spacer-8);flex-wrap:wrap;display:flex}.app-title{color:var(--text-default);font-size:14px;font-weight:600}.app-tagline{color:var(--text-tertiary);margin-left:var(--spacer-8);font-size:11px}.canvas-meta{align-items:center;gap:var(--spacer-8);color:var(--text-tertiary);font-size:11px;display:inline-flex}.canvas-meta-pill{height:24px;padding:0 var(--spacer-8);border-radius:var(--radius-6);background:var(--bg-overlay-l1);font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;color:var(--text-secondary);align-items:center;font-size:11px;display:inline-flex}.icon-sm{width:12px;height:12px}.icon-md{width:14px;height:14px}.icon-lg{width:18px;height:18px}.icon-xl{width:22px;height:22px}.modal-close{border-radius:var(--radius-8);width:28px;height:28px;color:var(--text-secondary);background:0 0;justify-content:center;align-items:center;display:inline-flex}.modal-close:hover{background:var(--bg-overlay-l2);color:var(--text-default)}.modal-close svg{width:14px;height:14px}.surface-card{border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-base-default);padding:var(--spacer-12);gap:var(--spacer-8);flex-direction:column;display:flex}.surface-card-head{align-items:center;gap:var(--spacer-8);color:var(--text-default);font-size:12px;font-weight:500;display:flex}.surface-card-head svg{width:14px;height:14px;color:var(--icon-secondary)}.viewport-segmented{border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);display:inline-flex;overflow:hidden}.viewport-segmented button{background:var(--bg-base-default);color:var(--text-secondary);height:24px;padding:0 var(--spacer-8);cursor:pointer;border:0;border-right:1px solid var(--border-neutral-l1);font-size:11px;font-weight:500;line-height:16px}.viewport-segmented button:last-child{border-right:0}.viewport-segmented button.is-active{background:var(--bg-overlay-l3);color:var(--text-default)}.color-tokens{gap:var(--spacer-4);flex-direction:column;display:flex}.color-token-row{gap:var(--spacer-8);padding:var(--spacer-4) 0;grid-template-columns:1fr auto;align-items:center;font-size:11px;display:grid}.color-token-row+.color-token-row{border-top:1px dashed var(--border-neutral-l1)}.stage-empty{text-align:center;max-width:420px;padding:var(--spacer-32);margin:auto}.stage-empty h2{color:var(--text-default);margin:var(--spacer-12) 0 var(--spacer-4);font-size:18px;font-weight:500}.stage-empty p{color:var(--text-tertiary);font-size:12px}[data-tooltip]{position:relative}[data-tooltip]:hover:after{content:attr(data-tooltip);background:var(--bg-invert);color:var(--text-onbrand);border-radius:var(--radius-4);white-space:nowrap;z-index:100;pointer-events:none;padding:4px 8px;font-size:11px;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}.drawer-shadow{box-shadow:0 12px 32px #0f172a1f}.inspector-section{gap:var(--spacer-8);flex-direction:column;display:flex}.inspector-section-title{align-items:center;gap:var(--spacer-6);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.06em;padding:var(--spacer-4) var(--spacer-4) 0;font-size:11px;font-weight:500;display:flex}.inspector-section-title svg{width:12px;height:12px;color:var(--icon-tertiary)}.badge{align-items:center;gap:var(--spacer-4);padding:0 var(--spacer-8);border-radius:var(--radius-full);height:18px;font-size:10px;font-weight:500;line-height:18px;display:inline-flex}.badge-success{background:var(--status-success-surface-l1);color:var(--status-success-default)}.badge-warning{background:var(--status-warning-surface-l1);color:var(--status-warning-default)}.badge-error{background:var(--status-error-surface-l1);color:var(--status-error-default)}.badge-info{background:var(--status-primary-surface-l1);color:var(--status-primary-default)}.badge-neutral{background:var(--bg-overlay-l1);color:var(--text-secondary)}.spinner{border-radius:var(--radius-full);border:2px solid var(--bg-overlay-l3);border-top-color:var(--bg-brand);width:14px;height:14px;animation:.8s linear infinite spin}.app-shell{background:var(--n-bg-base);width:100vw;height:100vh;color:var(--text-default);flex-direction:column;display:flex;overflow:hidden}.app-topbar{height:var(--topbar-height);border-bottom:1px solid var(--n-border-default);background:var(--n-bg-base);z-index:2;flex-shrink:0;align-items:center;gap:0;min-width:0;padding:0 16px;display:flex;position:relative}.app-topbar:after{content:"";background:var(--n-border-default);pointer-events:none;height:1px;position:absolute;bottom:-1px;left:0;right:0}@keyframes topbar-fade-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.app-topbar__left{align-items:center;gap:var(--spacer-16);justify-self:start;min-width:0;display:flex}.app-topbar__center{justify-self:center;align-items:center;min-width:0;display:flex}.app-topbar__right{justify-self:end;align-items:center;gap:var(--spacer-4);min-width:0;display:flex}.mobile-actions-wrap{display:none;position:relative}.mobile-actions-popover{top:calc(100% + var(--spacer-8));z-index:120;min-width:176px;padding:var(--spacer-6);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);background:var(--bg-menu);box-shadow:var(--elev-raised);position:absolute;right:0}.mobile-actions-popover button{width:100%;min-height:36px;padding:0 var(--spacer-10);border-radius:var(--radius-6);color:var(--text-default);text-align:left;justify-content:flex-start;align-items:center;font-size:13px;display:flex}.mobile-actions-popover button:hover:not(:disabled),.mobile-actions-popover button:focus-visible{background:var(--bg-overlay-l1);outline:none}.mobile-actions-popover button:disabled{color:var(--text-disabled)}.brand-block{align-items:center;gap:var(--spacer-12);min-width:0;display:flex}.brand-mark{border-radius:var(--radius-8);cursor:default;width:32px;height:32px;transition:transform .2s var(--ease-standard), box-shadow .2s var(--ease-standard);box-shadow:none;animation:brand-pop-in .48s var(--ease-emphasized) both;background:0 0;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;overflow:visible}.brand-mark img{object-fit:cover;transform-origin:50%;border-radius:9px;width:34px;height:34px;display:block;transform:rotate(45deg);box-shadow:0 1px 4px #4b3fe338}@keyframes brand-pop-in{0%{opacity:0;transform:scale(.6)rotate(-12deg)}60%{opacity:1;transform:scale(1.06)rotate(2deg)}to{opacity:1;transform:scale(1)rotate(0)}}.brand-mark:hover{box-shadow:none;transform:translateY(-1px)}.brand-copy h1{align-items:center;gap:var(--spacer-8);color:var(--text-default);white-space:nowrap;letter-spacing:0;background:linear-gradient(135deg,#121826 0%,#2383e2 52%,#0f766e 100%);-webkit-text-fill-color:transparent;text-shadow:none;animation:brand-copy-fade-in .36s var(--ease-standard) 60ms both;-webkit-background-clip:text;background-clip:text;margin:0;font-family:Iowan Old Style,Palatino Linotype,Palatino,Book Antiqua,Georgia,serif;font-size:18px;font-style:italic;font-weight:700;line-height:20px;display:flex}@keyframes brand-copy-fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}.brand-version{height:auto;color:inherit;letter-spacing:.02em;background:linear-gradient(135deg,#1a72cf 0%,#1761b3 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;border-radius:0;align-items:center;padding:0;font-family:inherit;font-size:12px;font-style:italic;font-weight:700;line-height:1;display:inline-flex;transform:translateY(1px)skew(-7deg)}.brand-divider{background:linear-gradient(180deg, transparent, var(--border-neutral-l2), transparent);width:1px;height:18px;margin:0 var(--spacer-4)}.brand-breadcrumb{align-items:center;gap:var(--spacer-8);min-width:0;color:var(--text-tertiary);font-size:12px;line-height:18px;display:flex}.brand-breadcrumb-folder{color:var(--text-tertiary);white-space:nowrap;cursor:default;transition:color .14s var(--ease-standard)}.brand-breadcrumb-folder:hover{color:var(--text-default)}.brand-breadcrumb-divider{color:var(--text-tertiary);-webkit-user-select:none;user-select:none}.brand-breadcrumb-current{color:var(--text-secondary);white-space:nowrap;transition:color .14s var(--ease-standard);font-weight:500}.brand-breadcrumb-current:hover{color:var(--text-default)}.app-toolbar{align-items:center;gap:var(--spacer-4);flex-shrink:0;display:inline-flex}.app-toolbar-sep{background:var(--border-neutral-l1);width:1px;height:16px;margin:0 var(--spacer-2);transition:background .2s var(--ease-standard)}.app-toolbar:hover .app-toolbar-sep{background:var(--border-neutral-l2)}.app-workspace{flex:1;min-width:0;min-height:0;display:flex}.app-side-panel{background:var(--n-bg-sidebar);border-color:var(--n-border-default);transition:width var(--n-duration-slow) var(--n-ease), border-color var(--n-duration-base) var(--n-ease);flex-direction:column;flex-shrink:0;display:flex;position:relative;overflow:hidden}.app-side-panel--left{width:var(--source-col);border-right:1px solid var(--n-border-default)}.app-side-panel--right{width:var(--inspector-col);border-left:1px solid var(--n-border-default)}.app-side-panel--collapsed{border-left-color:#0000;border-right-color:#0000;width:0!important}.app-side-panel--left:not(.app-side-panel--collapsed)>*{animation:panel-content-return-left var(--motion-spring) var(--ease-emphasized) both}.app-side-panel--right:not(.app-side-panel--collapsed)>*{animation:panel-content-return-right var(--motion-spring) var(--ease-emphasized) both}.app-side-panel--left.app-side-panel--collapsing-out>*{animation:panel-content-exit-left var(--motion-exit) var(--ease-exit) both}.app-side-panel--right.app-side-panel--collapsing-out>*{animation:panel-content-exit-right var(--motion-exit) var(--ease-exit) both}@keyframes panel-content-return-left{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:translate(0)}}@keyframes panel-content-return-right{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}@keyframes panel-content-exit-left{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-12px)}}@keyframes panel-content-exit-right{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(12px)}}.app-resizer{width:var(--resizer-width);cursor:col-resize;background:var(--bg-overlay-l2);transition:background .16s var(--ease-standard);flex-shrink:0;position:relative}.app-resizer:before{content:"";background:var(--bg-brand);transform-origin:50%;width:1px;transition:transform .2s var(--ease-standard);position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)scaleY(0)}.app-resizer:hover,.app-resizer.is-active{background:var(--bg-brand)}.app-resizer:hover:before,.app-resizer.is-active:before{transform:translate(-50%)scaleY(.4)}.app-canvas{background:var(--bg-base-tertiary);flex-direction:column;flex:1;min-width:0;display:flex}.panel-header{height:var(--panel-tab-height);padding:0 var(--spacer-12);border-bottom:1px solid var(--border-neutral-l1);background:var(--bg-base-secondary);flex-shrink:0;justify-content:space-between;align-items:center;display:flex;position:relative}.panel-header:after{content:none}.panel-header__title{color:var(--text-default);font-size:13px;font-weight:600;line-height:18px}.panel-header__tabs{border-bottom:1px solid var(--border-neutral-l1);align-items:center;height:100%;margin-bottom:-1px;display:flex}.ai-tab-panel{min-height:0;padding-bottom:var(--spacer-12);overflow:auto}.ai-scan-card{z-index:20;background:var(--bg-base-default);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-8);margin:var(--spacer-12);transition:border-color .16s var(--ease-standard), box-shadow .16s var(--ease-standard);animation:ai-card-fade-in .28s var(--ease-standard) both;flex-direction:column;flex-shrink:0;display:flex;position:relative}@keyframes ai-card-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.ai-scan-card:hover{border-color:color-mix(in srgb, var(--bg-brand) 30%, var(--border-neutral-l1));box-shadow:0 2px 8px color-mix(in srgb, var(--bg-brand) 6%, transparent)}.ai-scan-card__head{align-items:center;gap:var(--spacer-6);padding:0 var(--spacer-12);cursor:pointer;width:100%;height:32px;color:var(--text-default);text-align:left;border-radius:var(--radius-8);transition:background .14s var(--ease-standard);background:0 0;border:0;display:flex}.ai-scan-card__head:hover{background:var(--bg-overlay-l1)}.ai-scan-card__head:active{background:var(--bg-overlay-l2)}.ai-scan-card__head .chev{transition:transform .2s var(--ease-standard);color:var(--icon-tertiary);flex-shrink:0;display:inline-flex}.ai-scan-card__head.is-collapsed .chev{transform:rotate(-90deg)}.ai-scan-card__head .sparkle{color:var(--icon-brand);transition:transform .28s var(--ease-standard);flex-shrink:0}.ai-scan-card__head:hover .sparkle{transform:rotate(20deg)scale(1.1)}.ai-scan-card__title{letter-spacing:-.005em;font-size:12px;font-weight:500}.ai-scan-card__count{align-items:center;gap:var(--spacer-4);color:var(--status-success-default);font-size:10px;font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;transition:transform .2s var(--ease-standard);margin-left:auto;font-weight:500;display:inline-flex}.ai-scan-card:hover .ai-scan-card__count{transform:scale(1.05)}.ai-scan-card__count .dot{border-radius:var(--radius-full);background:var(--status-success-default);width:6px;height:6px;box-shadow:0 0 0 0 var(--status-success-default);animation:1.6s ease-out infinite ai-pulse}@keyframes ai-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--status-success-default) 60%, transparent)}70%{box-shadow:0 0 0 6px color-mix(in srgb, var(--status-success-default) 0%, transparent)}to{box-shadow:0 0 0 0 color-mix(in srgb, var(--status-success-default) 0%, transparent)}}.ai-scan-card__body{gap:var(--spacer-8);padding:var(--spacer-8) var(--spacer-12) var(--spacer-8);border-top:1px solid var(--border-neutral-l1);flex-direction:column;display:flex}.ai-scan-card__body.is-hidden{display:none}.ai-scan-row{align-items:center;gap:var(--spacer-8);display:flex}.ai-scan-row>label{color:var(--text-tertiary);flex-shrink:0;min-width:36px;font-size:11px}.ai-scan-row .ds-input{height:24px;padding:0 var(--spacer-8);flex:1;font-size:11px}.ai-scan-row .ds-input input,.ai-scan-row .ds-input select{font-size:11px}.ai-scan-remember{color:var(--text-tertiary);cursor:pointer;align-items:center;gap:6px;margin:-2px 0 0 44px;font-size:10px;display:inline-flex}.ai-scan-remember input{width:13px;height:13px;accent-color:var(--bg-brand);margin:0}.ai-model-input{position:relative}.ai-model-input input{min-width:0;padding-right:22px}.ai-scan-model-footer{color:var(--text-tertiary);justify-content:space-between;align-items:center;gap:8px;margin-left:44px;font-size:10px;line-height:1.3;display:flex}.ai-scan-model-footer span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.ai-scan-model-footer button{color:var(--text-brand);font:inherit;cursor:pointer;background:0 0;border:0;flex:none;padding:0}.ai-scan-model-footer button:disabled{color:var(--text-disabled);cursor:wait}.ai-scan-success{color:var(--status-success-default);margin:0;font-size:10px}.ai-scan-row .ai-provider-picker{flex:1;min-width:0;position:relative}.ai-provider-trigger{align-items:center;gap:var(--spacer-6);width:100%;min-width:0;height:28px;padding:0 var(--spacer-8);border:1px solid var(--border-neutral-l2);border-radius:var(--radius-8);background:var(--bg-base-default);color:var(--text-default);font:inherit;text-align:left;cursor:pointer;transition:border-color .14s var(--ease-standard), box-shadow .14s var(--ease-standard), background .14s var(--ease-standard);font-size:12px;display:flex}.ai-provider-trigger:hover{background:var(--bg-overlay-l1);border-color:color-mix(in srgb, var(--border-neutral-l2) 70%, var(--bg-brand))}.ai-provider-trigger:focus-visible,.ai-provider-trigger[aria-expanded=true]{border-color:var(--bg-brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--bg-brand) 14%, transparent);outline:none}.ai-provider-trigger>span:not(.ai-logo-mark){text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.ai-provider-trigger svg:last-child{width:14px;height:14px;color:var(--icon-tertiary);flex-shrink:0}.ai-provider-menu{z-index:70;top:calc(100% + var(--spacer-4));width:228px;max-height:328px;padding:var(--spacer-4);border:1px solid var(--border-neutral-l2);border-radius:var(--radius-8);background:var(--bg-base-default);box-shadow:var(--shadow-popover);position:absolute;left:0;right:auto;overflow-y:auto}.ai-provider-option{align-items:center;gap:var(--spacer-8);width:100%;min-height:36px;padding:var(--spacer-6) var(--spacer-8);border-radius:var(--radius-6);color:var(--text-default);font:inherit;cursor:pointer;text-align:left;transition:background .14s var(--ease-standard), color .14s var(--ease-standard);background:0 0;border:0;display:flex}.ai-provider-option:hover,.ai-provider-option-active{background:color-mix(in srgb, var(--bg-brand) 9%, var(--bg-base-default))}.ai-provider-group+.ai-provider-group{border-top:1px solid var(--n-border-default)}.ai-provider-group-label{color:var(--n-fg-tertiary);letter-spacing:.04em;text-transform:uppercase;padding:7px 10px 4px;font-size:10px;font-weight:600}.ai-provider-option:focus-visible{box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--bg-brand) 35%, transparent);outline:none}.ai-logo-mark{border-radius:var(--radius-6);flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;display:inline-flex}.ai-logo-mark-light{border:1px solid var(--border-neutral-l1);background:#fff}.ai-logo-mark svg{width:18px;height:18px;display:block}.ai-provider-option-text{flex:1;gap:1px;min-width:0;display:grid}.ai-provider-option-name{color:var(--text-default);font-size:12px;font-weight:500;line-height:16px}.ai-provider-option-detail{color:var(--text-tertiary);text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:13px;overflow:hidden}.ai-provider-check{color:var(--text-brand);flex-shrink:0;font-size:12px;font-weight:700}.ai-scan-actions{justify-content:flex-end;gap:var(--spacer-6);padding-top:var(--spacer-2);display:flex}.ai-scan-loading{flex-shrink:0;justify-content:center;align-items:center;width:12px;height:12px;display:inline-flex}.ai-scan-loading .spinner{width:10px;height:10px}.ai-scan-ok{width:14px;height:14px;color:var(--status-success-default);flex-shrink:0;justify-content:center;align-items:center;font-size:10px;font-weight:600;display:inline-flex}.ai-scan-model-status{color:var(--text-tertiary);font-size:10px}.search-bar{padding:var(--spacer-8) var(--spacer-12);flex-shrink:0}.search-bar .ds-input{height:28px;padding:0 var(--spacer-8)}.search-bar .ds-input input{font-size:12px}.search-bar .ds-input:focus-within{box-shadow:0 0 0 3px color-mix(in srgb, var(--bg-brand) 12%, transparent)}.search-bar svg{color:var(--icon-tertiary);width:14px;height:14px;transition:color .14s var(--ease-standard);flex-shrink:0}.search-bar .ds-input:focus-within svg{color:var(--icon-brand)}.structure-tree{padding:var(--spacer-4) var(--spacer-8) var(--spacer-8);scrollbar-gutter:stable;scroll-behavior:smooth;flex:1;font-size:12px;line-height:18px;overflow-y:auto}.tree-node{align-items:center;gap:var(--spacer-6);padding:var(--spacer-4) var(--spacer-8);border-radius:var(--radius-4);cursor:pointer;color:var(--text-secondary);-webkit-user-select:none;user-select:none;text-align:left;width:100%;font:inherit;transition:background var(--motion-fast) var(--ease-standard), color var(--motion-fast) var(--ease-standard), padding-left var(--motion-base) var(--ease-emphasized), transform var(--motion-base) var(--ease-emphasized);animation:tree-node-fade-in .24s var(--ease-emphasized) both;background:0 0;border:0;margin-bottom:2px;display:flex;position:relative}@keyframes tree-node-fade-in{0%{opacity:0;transform:translate(-6px)}to{opacity:1;transform:translate(0)}}.tree-node:after{content:"";background:linear-gradient(180deg, var(--bg-brand) 0%, color-mix(in srgb, var(--bg-brand) 80%, transparent) 100%);transform-origin:50%;width:3px;transition:transform var(--motion-base) var(--ease-emphasized);box-shadow:0 0 6px color-mix(in srgb, var(--bg-brand) 32%, transparent);border-radius:2px;position:absolute;top:4px;bottom:4px;left:0;transform:scaleY(0)}.tree-node:hover{background:var(--bg-overlay-l1);color:var(--text-default);transform:translate(2px)}.tree-node:active{background:var(--bg-overlay-l2);transform:translateX(3px) scale(var(--press-scale-card));transition-duration:var(--motion-fast)}.tree-node:hover .tree-tag{transform:scale(1.06)}.tree-node.is-selected{background:color-mix(in srgb, var(--bg-brand) 8%, var(--bg-base-default));color:var(--text-default);box-shadow:inset 3px 0 0 var(--bg-brand);padding-left:calc(var(--spacer-8) + 2px)}.tree-node.is-selected:after{background:var(--bg-brand);transform:scaleY(1)}.tree-node:not(.is-selected):after{transform:scaleY(0)}.tree-node:focus-visible{box-shadow:var(--focus-halo);outline:none}.tree-node__chev{color:var(--icon-tertiary);cursor:pointer;border-radius:var(--radius-2);width:12px;height:12px;transition:transform var(--motion-base) var(--ease-emphasized), color var(--motion-fast) var(--ease-standard), background var(--motion-fast) var(--ease-standard);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.tree-node__chev:hover{color:var(--text-default);background:color-mix(in srgb, var(--bg-overlay-l3) 50%, transparent)}.tree-node__chev:active{transition-duration:var(--motion-fast);transform:scale(.85)rotate(0)}.tree-node__label{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--text-default);flex:1;align-items:baseline;gap:4px;min-width:0;font-size:13px;font-weight:400;line-height:18px;display:inline-flex;overflow:hidden}.tree-node__class{color:var(--text-tertiary);font-size:11px;font-family:var(--font-family-mono);opacity:.7;flex-shrink:0;font-weight:400}.tree-node.is-selected .tree-node__class{opacity:.95}.tree-node__meta{color:var(--text-tertiary);font-size:10px;font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;flex-shrink:0}.tree-tag{min-width:22px;height:16px;padding:0 var(--spacer-4);border-radius:var(--radius-4);font-family:var(--font-family-mono);letter-spacing:.02em;transition:transform var(--motion-base) var(--ease-emphasized), background var(--motion-fast) var(--ease-standard), color var(--motion-fast) var(--ease-standard), opacity var(--motion-fast) var(--ease-standard);opacity:.65;flex-shrink:0;justify-content:center;align-items:center;font-size:9px;font-weight:500;display:inline-flex}.tree-node:hover .tree-tag{opacity:.95}.tree-node.is-selected .tree-tag{opacity:1}.tree-tag:hover{transform:scale(1.1)}.tree-tag--h1,.tree-tag--h2,.tree-tag--h3,.tree-tag--section,.tree-tag--img,.tree-tag--div,.tree-tag--nav{background:var(--bg-overlay-l2);color:var(--text-secondary)}.tree-tag--btn,.tree-tag--p,.tree-tag--span,.tree-tag--footer{background:var(--bg-overlay-l2);color:var(--text-tertiary)}.tree-children{padding-left:var(--spacer-16)}.viewport-bar{height:var(--canvas-toolbar-height);padding:0 var(--spacer-20);background:var(--bg-base-default);border-bottom:1px solid var(--border-neutral-l1);justify-content:space-between;align-items:center;gap:var(--spacer-16);animation:viewport-bar-fade .36s var(--ease-emphasized) both;flex-shrink:0;display:flex;position:relative}.viewport-bar:after{content:none}@keyframes viewport-bar-fade{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.viewport-bar__group{align-items:center;gap:var(--spacer-4);animation:viewport-group-fade .36s var(--ease-emphasized) both;display:inline-flex}.viewport-bar__group+.viewport-bar__group{animation-delay:80ms}@keyframes viewport-group-fade{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.viewport-bar .is-on{background:var(--bg-overlay-l2);color:var(--text-default)}.viewport-bar .ds-btn:hover:not(.is-on){background:var(--bg-overlay-l1);color:var(--text-default)}.viewport-bar__dim{align-items:center;gap:var(--spacer-4);font-family:var(--font-family-metric);color:var(--text-tertiary);font-variant-numeric:tabular-nums;padding:0 var(--spacer-6);font-size:12px;display:inline-flex}.viewport-bar__zoom{font-family:var(--font-family-metric);color:var(--text-tertiary);font-variant-numeric:tabular-nums;text-align:center;min-width:40px;transition:color .16s var(--ease-standard);font-size:12px}.viewport-bar__zoom:hover{color:var(--text-default)}.canvas-area{min-width:0;padding:var(--spacer-32) var(--spacer-40) var(--spacer-40);background-color:var(--canvas-bg,#f3f4f6);background-image:radial-gradient(color-mix(in srgb, var(--text-default) 6%, transparent) 1px, transparent 1.4px);transition:background-color .2s var(--ease-standard);animation:canvas-fade-in .36s var(--ease-standard) both;background-position:0 0;background-size:22px 22px;flex:1;justify-content:center;align-items:flex-start;display:flex;overflow:auto}@keyframes canvas-fade-in{0%{opacity:0}to{opacity:1}}.canvas-preview-frame{background:var(--bg-base-default);border-radius:var(--radius-8);box-shadow:0 2px 24px color-mix(in srgb, var(--text-default) 5%, transparent), 0 1px 2px color-mix(in srgb, var(--text-default) 4%, transparent);transform-origin:top;transition:box-shadow .2s var(--ease-standard);overflow:hidden}.canvas-preview-frame:hover{box-shadow:0 4px 32px color-mix(in srgb, var(--text-default) 8%, transparent), 0 2px 4px color-mix(in srgb, var(--text-default) 5%, transparent)}.canvas-empty-state{text-align:center;color:var(--text-tertiary);padding:var(--spacer-48)}.app-statusbar{height:var(--statusbar-height);padding:0 var(--spacer-16);background:var(--bg-base-secondary);border-top:1px solid var(--border-neutral-l1);color:var(--text-tertiary);animation:statusbar-fade-in .32s var(--ease-standard) both;flex-shrink:0;justify-content:space-between;align-items:center;font-size:11px;display:flex;position:relative}@keyframes statusbar-fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.app-statusbar:before{content:"";background:linear-gradient(180deg, color-mix(in srgb, var(--bg-base-secondary) 60%, transparent) 0%, var(--bg-base-secondary) 100%);pointer-events:none;opacity:.6;position:absolute;inset:0}.statusbar-zone{align-items:center;gap:var(--spacer-12);z-index:1;display:inline-flex;position:relative}.statusbar-zone svg{width:12px;height:12px}.statusbar-zone--center{gap:var(--spacer-6);justify-content:center}.statusbar-zone--left .statusbar-pill,.statusbar-zone--center .statusbar-pill,.statusbar-zone--right .statusbar-metric{transition:background var(--motion-fast) var(--ease-standard), color var(--motion-fast) var(--ease-standard)}.statusbar-zone--right{gap:var(--spacer-12)}.statusbar-pill{align-items:center;gap:var(--spacer-4);padding:0 var(--spacer-4);border-radius:var(--radius-full);cursor:default;height:16px;transition:background .16s var(--ease-standard);display:inline-flex}.statusbar-pill:hover{background:color-mix(in srgb, var(--bg-overlay-l2) 70%, transparent)}.statusbar-pill:hover .dot{animation-duration:.9s}.statusbar-metric{font-family:var(--font-family-metric);font-variant-numeric:tabular-nums;letter-spacing:-.005em;padding:0 var(--spacer-4);border-radius:var(--radius-4);transition:color .16s var(--ease-standard), background .16s var(--ease-standard)}.statusbar-metric:hover{color:var(--text-default);background:color-mix(in srgb, var(--bg-overlay-l2) 60%, transparent)}.statusbar-pill .dot{border-radius:var(--radius-full);background:var(--status-success-default);width:6px;height:6px;box-shadow:0 0 0 0 color-mix(in srgb, var(--status-success-default) 60%, transparent), 0 0 8px color-mix(in srgb, var(--status-success-default) 50%, transparent);animation:1.4s ease-in-out infinite status-pulse}@keyframes status-pulse{0%,to{opacity:.7;box-shadow:0 0 0 0 color-mix(in srgb, var(--status-success-default) 60%, transparent), 0 0 6px color-mix(in srgb, var(--status-success-default) 30%, transparent);transform:scale(.85)}50%{opacity:1;box-shadow:0 0 0 4px color-mix(in srgb, var(--status-success-default) 0%, transparent), 0 0 12px color-mix(in srgb, var(--status-success-default) 60%, transparent);transform:scale(1.05)}}.statusbar-pill--live{max-width:min(46vw,520px);padding:0 var(--spacer-8);color:var(--text-secondary);background:color-mix(in srgb, var(--bg-base-default) 58%, transparent);box-shadow:0 0 0 1px color-mix(in srgb, var(--text-default) 7%, transparent), 0 1px 0 #ffffff9e inset}.statusbar-live-text{text-overflow:ellipsis;white-space:nowrap;min-width:0;animation:status-live-text-in .22s var(--ease-quint) both;display:inline-block;overflow:hidden}@keyframes status-live-text-in{0%{opacity:0;filter:blur(2px);transform:translateY(3px)}to{opacity:1;filter:blur();transform:translateY(0)}}.statusbar-pill--ready .dot{background:var(--status-success-default)}.statusbar-pill--busy .dot{background:var(--accent-blue);animation:.9s cubic-bezier(.4,0,.2,1) infinite status-busy-orbit}.statusbar-pill--warning{color:color-mix(in srgb, var(--status-warning-default) 74%, var(--text-default));background:color-mix(in srgb, var(--status-warning-default) 10%, transparent)}.statusbar-pill--warning .dot{background:var(--status-warning-default);box-shadow:0 0 0 3px color-mix(in srgb, var(--status-warning-default) 15%, transparent)}.statusbar-pill--error{color:color-mix(in srgb, var(--status-error-default) 78%, var(--text-default));background:color-mix(in srgb, var(--status-error-default) 10%, transparent)}.statusbar-pill--error .dot{background:var(--status-error-default);box-shadow:0 0 0 3px color-mix(in srgb, var(--status-error-default) 16%, transparent)}@keyframes status-busy-orbit{0%{opacity:.65;transform:scale(.82)}45%{opacity:1;transform:scale(1.18)}to{opacity:.65;transform:scale(.82)}}.statusbar-sep{background:var(--border-neutral-l1);width:1px;height:12px}.color-field{align-items:center;gap:var(--spacer-6);flex:1;min-width:0;display:inline-flex}.color-field__swatch{border-radius:var(--radius-4);border:1px solid var(--border-neutral-l2);cursor:pointer;width:24px;height:24px;transition:transform .16s var(--ease-standard), box-shadow .16s var(--ease-standard), border-color .16s;background-clip:padding-box;flex-shrink:0;position:relative;overflow:hidden}.color-field__swatch:hover{box-shadow:0 2px 6px color-mix(in srgb, var(--text-default) 12%, transparent);border-color:var(--bg-brand);transform:scale(1.08)}.color-field__swatch:after{content:"";background-image:linear-gradient(45deg, var(--border-neutral-l2) 25%, transparent 25%), linear-gradient(-45deg, var(--border-neutral-l2) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--border-neutral-l2) 75%), linear-gradient(-45deg, transparent 75%, var(--border-neutral-l2) 75%);opacity:0;pointer-events:none;background-position:0 0,0 3px,3px -3px,-3px 0;background-size:6px 6px;position:absolute;inset:0}.color-field__swatch.is-transparent:after{opacity:1}.color-field__input{flex:1;min-width:0}.cheatsheet-overlay{background:color-mix(in srgb, var(--text-default) 36%, transparent);z-index:80;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.cheatsheet-overlay__panel{background:var(--bg-base-default);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-12);box-shadow:0 24px 64px color-mix(in srgb, var(--text-default) 18%, transparent), 0 4px 16px color-mix(in srgb, var(--text-default) 8%, transparent);flex-direction:column;width:min(560px,90vw);max-height:80vh;display:flex;overflow:hidden}.cheatsheet-overlay__head{padding:var(--spacer-16) var(--spacer-20);border-bottom:1px solid var(--border-neutral-l1);justify-content:space-between;align-items:center;display:flex}.cheatsheet-overlay__title{color:var(--text-default);font-size:14px;font-weight:600}.cheatsheet-overlay__body{padding:var(--spacer-16) var(--spacer-20);gap:var(--spacer-8);display:grid;overflow-y:auto}.cheatsheet-row{padding:var(--spacer-8) 0;border-bottom:1px solid var(--border-neutral-l1);justify-content:space-between;align-items:center;font-size:12px;display:flex}.cheatsheet-row:last-child{border-bottom:0}.cheatsheet-row__keys{align-items:center;gap:var(--spacer-4);font-family:var(--font-family-mono);font-size:11px;display:inline-flex}.cheatsheet-row__key{min-width:22px;height:22px;padding:0 var(--spacer-6);border-radius:var(--radius-4);border:1px solid var(--border-neutral-l2);background:var(--bg-base-secondary);color:var(--text-secondary);justify-content:center;align-items:center;display:inline-flex}.ds-tooltip{z-index:9999;border-radius:var(--radius-8);color:#f8fafc;max-width:280px;font-family:var(--font-family-default);font-size:var(--text-sm);font-weight:var(--font-weight-default);letter-spacing:.01em;text-align:center;white-space:nowrap;word-wrap:break-word;pointer-events:none;-webkit-user-select:none;user-select:none;opacity:0;transition:opacity var(--motion-fast) var(--ease-emphasized), transform var(--motion-base) var(--ease-emphasized);-webkit-backdrop-filter:var(--surface-vibrancy-soft);backdrop-filter:var(--surface-vibrancy-soft);will-change:transform, opacity;background:#111827c7;padding:6px 10px;line-height:1.45;position:fixed;transform:translateY(4px);box-shadow:inset 0 1px #ffffff1a,0 2px 6px #0f172a2e,0 12px 28px #0f172a24}.ds-tooltip.is-visible{opacity:1;transform:translateY(0)}.ds-tooltip[data-placement=top]{transform:translateY(4px)}.ds-tooltip[data-placement=top].is-visible{transform:translateY(0)}.ds-tooltip[data-placement=bottom]{transform:translateY(-4px)}.ds-tooltip[data-placement=bottom].is-visible{transform:translateY(0)}.ds-tooltip[data-placement=left]{transform:translate(4px)}.ds-tooltip[data-placement=left].is-visible{transform:translate(0)}.ds-tooltip[data-placement=right]{transform:translate(-4px)}.ds-tooltip[data-placement=right].is-visible{transform:translate(0)}.ds-tooltip[data-multiline=true]{white-space:normal;text-align:start;max-width:320px}.ds-tooltip kbd{border-radius:var(--radius-4);color:#f8fafcf2;min-width:18px;height:18px;font-family:var(--font-family-mono);font-size:11px;font-weight:var(--font-weight-medium);white-space:nowrap;background:#ffffff29;justify-content:center;align-items:center;margin:0 2px;padding:0 5px;line-height:1;display:inline-flex}#html-finetune-tip{-webkit-backdrop-filter:var(--surface-vibrancy-soft);backdrop-filter:var(--surface-vibrancy-soft);z-index:2147483647!important;color:#f8fafc!important;letter-spacing:.01em!important;text-align:center!important;white-space:nowrap!important;pointer-events:none!important;-webkit-user-select:none!important;user-select:none!important;opacity:0!important;max-width:240px!important;transition:opacity .13s var(--ease-standard), transform .13s var(--ease-standard)!important;background:#111827f0!important;border-radius:6px!important;padding:5px 9px!important;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,Arial,sans-serif!important;font-size:11.5px!important;line-height:1.4!important;position:fixed!important;transform:translateY(4px)!important;box-shadow:0 2px 6px #0f172a33,0 10px 24px #0f172a24!important}#html-finetune-tip.is-visible{opacity:1!important;transform:translateY(0)!important}#html-finetune-tip[data-placement=top]{transform:translateY(4px)!important}#html-finetune-tip[data-placement=top].is-visible{transform:translateY(0)!important}#html-finetune-tip[data-placement=bottom]{transform:translateY(-4px)!important}#html-finetune-tip[data-placement=bottom].is-visible{transform:translateY(0)!important}.panel.is-collapsed{opacity:0!important;pointer-events:none!important;border-left:0!important;border-right:0!important;width:0!important;min-width:0!important;max-width:0!important;margin:0!important;padding:0!important;overflow:hidden!important}.panel-collapse-btn{border-radius:var(--radius-4);width:24px;height:24px;color:var(--text-tertiary);cursor:pointer;background:0 0;border:1px solid #0000;flex-shrink:0;justify-content:center;align-items:center;margin-left:auto;padding:0;transition:background .18s,color .18s,border-color .18s;display:flex}.panel-collapse-btn:hover{background:var(--bg-overlay-l1);color:var(--text-secondary);border-color:var(--border-neutral-l1)}.panel-collapse-btn svg{color:currentColor;width:14px;height:14px}.panel-expand-btn{background:var(--bg-base-default);border:1px solid var(--border-neutral-l1);width:20px;height:60px;box-shadow:0 2px 8px color-mix(in srgb, var(--text-default) 4%, transparent), 0 8px 24px color-mix(in srgb, var(--text-default) 6%, transparent);cursor:pointer;z-index:99;color:var(--text-tertiary);-webkit-backdrop-filter:blur(12px);justify-content:center;align-items:center;padding:0;transition:background .18s,border-color .18s,color .18s,box-shadow .18s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.panel-expand-btn:hover{background:var(--bg-base-hover);color:var(--text-secondary);border-color:var(--border-neutral-l2);box-shadow:0 4px 12px color-mix(in srgb, var(--text-default) 6%, transparent), 0 12px 32px color-mix(in srgb, var(--text-default) 8%, transparent)}.panel-expand-btn svg{color:currentColor;width:14px;height:14px}.panel-expand-btn--left{border-radius:0 var(--radius-8) var(--radius-8) 0;border-left:0;left:0}.panel-expand-btn--right{border-radius:var(--radius-8) 0 0 var(--radius-8);border-right:0;right:0}.tree-node__chev{justify-content:center;align-items:center;display:inline-flex;transition:transform .22s var(--ease-emphasized)!important}.tree-node:not(.is-collapsed) .tree-node__chev{transform:rotate(90deg)!important}@keyframes cheatsheet-pop-in{0%{opacity:0;transform:scale(.94)translateY(12px)}to{opacity:1;transform:scale(1)translateY(0)}}.draggable-label{-webkit-user-select:none;user-select:none;border-bottom:1px dashed #ffffff40;transition:border-bottom-color .2s,color .2s;cursor:ew-resize!important}.draggable-label:hover{color:#10b8a8!important;border-bottom-color:#10b8a8cc!important}:root{--font-family-default:ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;--theme-transition:background-color .3s var(--ease-emphasized), color .3s var(--ease-emphasized), border-color .3s var(--ease-emphasized), box-shadow .3s var(--ease-emphasized)}.theme-light{--bg-base-default:#fff;--bg-base-secondary:#f8fafc;--bg-base-hover:#f1f5f9;--text-default:#0f172a;--text-secondary:#475569;--text-tertiary:#94a3b8;--border-neutral-l1:#e2e8f0;--border-neutral-l2:#cbd5e1;--border-neutral-l3:#94a3b8;--bg-overlay-l1:#0f172a0a;--bg-overlay-l2:#0f172a0f;--bg-overlay-l3:#0f172a17;--bg-overlay-l4:#0f172a1f;--bg-brand:#10b8a8;--text-onbrand:#fff;--bg-brand-hover:#0d9488;--bg-brand-active:#0f766e;--bg-brand-disabled:#99f6e4;--icon-default:#475569;--icon-secondary:#64748b;--icon-tertiary:#94a3b8;--elev-raised:0 1px 0 #fff9 inset, 0 1px 2px #0f172a0f, 0 8px 24px #0f172a1a;--elev-floating:0 1px 0 #fff9 inset, 0 4px 12px #0f172a14, 0 22px 44px #0f172a24;--elev-window:0 1px 0 #ffffffb3 inset, 0 10px 28px #0f172a1a, 0 34px 90px #0f172a38;--surface-vibrancy:saturate(180%) blur(20px);--surface-vibrancy-strong:saturate(180%) blur(30px);--surface-vibrancy-soft:saturate(140%) blur(14px)}body,.app,.app-topbar,.app-toolbar,.header,.panel,.panel-head,.panel-resizer,.stage,.stage-panel,.viewport-bar,.statusbar,.structure-tree,.cheatsheet,.cheatsheet-body,.cheatsheet-section,.cheatsheet-row,.history-drawer,.ai-scan-card,.ai-risk-list,.ai-tab-panel,.source-import-dropzone,.source-code-shell,.source-editor,.empty-state-card,.info-row-item,.color-field,.color-popover,.color-history-label,.alignment-bar,.segmented-viewport-control,.segmented-button,.tree-node,input,textarea,select,button{transition:var(--theme-transition)!important}.segmented-viewport-control{background:var(--bg-overlay-l1);border-radius:var(--radius-8);border:1px solid var(--border-neutral-l1);isolation:isolate;box-sizing:border-box;width:88px;height:28px;padding:2px;display:inline-flex;position:relative}.segmented-active-slide-bg{background:var(--bg-base-default);border-radius:calc(var(--radius-8) - 2px);z-index:1;pointer-events:none;will-change:transform;width:28px;position:absolute;top:2px;bottom:2px;left:2px;box-shadow:inset 0 1px #ffffffb3,0 1px 2.5px #0f172a1f,0 .5px 1px #0f172a14;transition:transform .32s var(--ease-emphasized)!important}.segmented-button{z-index:2;border-radius:calc(var(--radius-8) - 2px);width:28px;height:24px;color:var(--text-secondary);cursor:pointer;outline:none;justify-content:center;align-items:center;display:inline-flex;position:relative;transition:color var(--motion-fast) var(--ease-standard), transform var(--motion-base) var(--ease-emphasized)!important;background:0 0!important;border:0!important}.segmented-button:hover{color:var(--text-default)}.segmented-button:active{transform:scale(var(--press-scale-button));transition-duration:var(--motion-fast)}.segmented-button.is-on{transform:scale(1.06);color:var(--bg-brand)!important}.segmented-viewport-control:has(button:nth-child(2).is-on) .segmented-active-slide-bg{transform:translate(0,0)}.segmented-viewport-control:has(button:nth-child(3).is-on) .segmented-active-slide-bg{transform:translate(28px)}.segmented-viewport-control:has(button:nth-child(4).is-on) .segmented-active-slide-bg{transform:translate(56px)}.canvas-scan-overlay{pointer-events:none;z-index:200;border-radius:var(--radius-8);contain:paint;background:#10b8a805;position:absolute;inset:0;overflow:hidden}.canvas-scan-line{background:linear-gradient(90deg, transparent 5%, var(--bg-brand) 50%, transparent 95%);width:100%;height:3px;box-shadow:0 0 10px var(--bg-brand), 0 0 3px var(--bg-brand);will-change:transform;animation:2s cubic-bezier(.4,0,.2,1) infinite laser-bounce;position:absolute;top:0;left:0}@keyframes laser-bounce{0%{transform:translateY(-10px)}50%{transform:translateY(780px)}to{transform:translateY(-10px)}}.unit-input{position:relative}.unit-input:after{content:"px";right:var(--spacer-8);color:var(--text-tertiary);pointer-events:none;font-size:11px;position:absolute;top:50%;transform:translateY(-50%);transition:opacity .16s,transform .16s!important}.unit-input:hover:after{opacity:0;transform:translateY(-50%)translate(4px)}.unit-input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.unit-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.unit-input input[type=number]{-moz-appearance:textfield}.panel{overflow:hidden;transition:width .2s var(--ease-emphasized), var(--theme-transition)!important}.panel.is-collapsed>*{opacity:0;filter:blur(4px);pointer-events:none;transform:scale(.96)}.info-row-item{border-radius:var(--radius-4);padding:2px 4px;position:relative;transition:background-color .16s!important}.info-row-item:hover{background:var(--bg-overlay-l1)}.info-row-item.is-copied-flash{animation:spec-copied-flash .7s var(--ease-emphasized) both}@keyframes spec-copied-flash{0%{background:color-mix(in srgb, var(--bg-brand) 30%, transparent)}to{background:0 0}}.info-row-item__copied-tag{background:var(--bg-brand);color:var(--text-onbrand);border-radius:var(--radius-4);animation:tag-float-up .8s var(--ease-emphasized) forwards;pointer-events:none;padding:1px 4px;font-size:9px;font-weight:700;position:absolute;top:-16px;right:4px;box-shadow:0 2px 5px #00000026}@keyframes tag-float-up{0%{opacity:0;transform:translateY(4px)}30%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-8px)}}.collapsible-group{transition:max-height .3s var(--ease-emphasized)!important}.collapsible-group legend{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:var(--spacer-4);width:100%;display:flex}.collapsible-group__arrow{font-family:monospace;font-size:14px;display:inline-block;transform:rotate(90deg);transition:transform .2s var(--ease-emphasized)!important}.collapsible-group.is-collapsed .collapsible-group__arrow{transform:rotate(0)}.collapsible-group.is-collapsed .collapsible-group__content{display:none}.tree-node__label{white-space:nowrap;text-overflow:ellipsis;align-items:center;max-width:175px;display:inline-flex;overflow:hidden}.tree-node__class{opacity:.7;text-overflow:ellipsis;margin-left:2px;font-size:11px;overflow:hidden}.empty-state-card{text-align:center;padding:var(--spacer-32) var(--spacer-16);background:var(--bg-overlay-l1);border:1px dashed var(--border-neutral-l2);border-radius:var(--radius-12);margin:var(--spacer-24) var(--spacer-12);flex-direction:column;justify-content:center;align-items:center;display:flex}.empty-state-card__icon{background:var(--bg-base-default);border:1px solid var(--border-neutral-l1);border-radius:var(--radius-12);width:44px;height:44px;color:var(--text-tertiary);margin-bottom:var(--spacer-16);justify-content:center;align-items:center;animation:3s ease-in-out infinite floating-bounce;display:flex;box-shadow:0 2px 6px #0000000a}@keyframes floating-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.empty-state-card h3{color:var(--text-default);margin:0 0 6px;font-size:14px;font-weight:600}.empty-state-card p{color:var(--text-secondary);max-width:220px;margin:0;font-size:12px;line-height:1.4}.ds-ripple{pointer-events:none;background:#10b8a859;border-radius:999px;width:8px;height:8px;animation:.4s cubic-bezier(.1,.8,.3,1) forwards ds-ripple-wave;position:absolute;transform:translate(-50%,-50%)scale(1)}@keyframes ds-ripple-wave{to{opacity:0;transform:translate(-50%,-50%)scale(12)}}.dirty-breath-dot{background-color:#ef4444;border-radius:999px;flex-shrink:0;width:6px;height:6px;margin-right:4px;animation:1.2s cubic-bezier(.4,0,.2,1) infinite dirty-pulse;display:inline-block;box-shadow:0 0 0 3px #ef444429}@keyframes dirty-pulse{0%{box-shadow:0 0 0 1px #ef444429}50%{box-shadow:0 0 0 5px #ef444473}to{box-shadow:0 0 0 1px #ef444429}}.source-textarea{background-image:linear-gradient(var(--bg-overlay-l1) 95%, var(--border-neutral-l1) 5%)!important;line-height:22px!important;font-family:var(--font-family-mono)!important;background-size:100% 22px!important;background-attachment:local!important}.source-validator-warning{color:#ef4444;align-items:center;gap:3px;margin-left:auto;font-size:11px;font-weight:550;animation:1.5s infinite warning-pulse;display:inline-flex}@keyframes warning-pulse{0%,to{opacity:.85}50%{opacity:.55}}@media (width<=760px){.app-topbar{gap:var(--spacer-8);padding:0 var(--spacer-8) 0 var(--spacer-10);grid-template-columns:minmax(0,1fr) auto}.app-topbar .ds-btn--sm>span{display:none}.app-topbar>div:first-child span{font-size:13px!important}.app-topbar>div:last-child{width:auto!important}.mobile-actions-wrap{display:inline-flex}.app-topbar .ds-btn--sm{height:36px;padding-inline:var(--spacer-10)}.app-topbar .ds-btn--icon.ds-btn--sm{width:36px}.workspace.workspace-mobile-shell{position:relative;grid-template-columns:minmax(0,1fr)!important}.workspace.workspace-mobile-shell>.stage-panel{border-left:0;border-right:0;grid-column:1;min-width:0}.workspace.workspace-mobile-shell>aside.panel,.workspace.workspace-mobile-shell>.inspector{top:var(--topbar-height);bottom:var(--statusbar-height);z-index:90;position:fixed;box-shadow:0 18px 48px #0f172a38;width:min(360px,100vw - 48px)!important;max-width:calc(100vw - 48px)!important}.workspace.workspace-mobile-shell>aside.panel:not(.inspector){border-right:1px solid var(--border-neutral-l2);left:0}.workspace.workspace-mobile-shell>.inspector{border-left:1px solid var(--border-neutral-l2);left:auto;right:0}.workspace.workspace-mobile-shell>aside.panel.is-collapsed,.workspace.workspace-mobile-shell>.inspector.is-collapsed{opacity:0!important;pointer-events:none!important;width:0!important;min-width:0!important;max-width:0!important}.workspace.workspace-mobile-shell .panel-resizer{display:none!important}.workspace.workspace-mobile-shell .panel-expand-btn{z-index:95;width:40px;height:64px}.viewport-bar{justify-content:center;gap:var(--spacer-8);height:auto;min-height:48px;padding:var(--spacer-6) var(--spacer-8);flex-wrap:wrap}.viewport-bar>.app-toolbar-sep{display:none}.viewport-bar__dim{order:3;justify-content:center;width:100%;padding:0}.viewport-bar__group{gap:var(--spacer-6)}.stage{padding:var(--spacer-24) var(--spacer-12)}.app-statusbar{padding:0 var(--spacer-8)}.statusbar-zone--right{display:none}}@media (width<=360px){.app-topbar{padding-inline:var(--spacer-8)}.app-topbar>div:first-child span{display:none}.app-topbar>div:last-child{max-width:calc(100vw - 64px)}.app-topbar .mobile-primary-action{justify-content:center;width:36px;padding-inline:0}.app-topbar .mobile-primary-action span{display:none}}@media (width<=760px),(pointer:coarse){.panel-collapse-btn,.panel-expand-btn{min-width:36px;min-height:36px}.viewport-bar .ds-btn--sm{height:36px}.viewport-bar .ds-btn--icon.ds-btn--sm{width:36px}.segmented-viewport-control{width:124px;height:40px}.segmented-active-slide-bg{width:40px}.segmented-button{width:40px;height:36px}.segmented-viewport-control:has(button:nth-child(3).is-on) .segmented-active-slide-bg{transform:translate(40px)}.segmented-viewport-control:has(button:nth-child(4).is-on) .segmented-active-slide-bg{transform:translate(80px)}.workspace-mobile-shell>aside.panel:not(.is-collapsed) .panel-header__tabs button,.workspace-mobile-shell>aside.panel:not(.is-collapsed) .panel-collapse-btn,.workspace-mobile-shell>.inspector:not(.is-collapsed) .panel-collapse-btn{min-width:40px;min-height:40px}.workspace-mobile-shell>aside.panel:not(.is-collapsed) .tree-node{min-height:38px;padding-block:var(--spacer-8)}.workspace-mobile-shell>aside.panel:not(.is-collapsed) .tree-node__chev{width:22px;height:22px}.workspace-mobile-shell>aside.panel:not(.is-collapsed) .ds-input,.workspace-mobile-shell>aside.panel:not(.is-collapsed) .ds-input input,.workspace-mobile-shell>.inspector:not(.is-collapsed) button,.workspace-mobile-shell>.inspector:not(.is-collapsed) .ds-btn--sm,.workspace-mobile-shell>.inspector:not(.is-collapsed) .btn,.workspace-mobile-shell>.inspector:not(.is-collapsed) input,.workspace-mobile-shell>.inspector:not(.is-collapsed) select,.workspace-mobile-shell>.inspector:not(.is-collapsed) .color-swatch-button{min-height:36px}.workspace-mobile-shell>.inspector:not(.is-collapsed) .ds-btn--icon,.workspace-mobile-shell>.inspector:not(.is-collapsed) .color-swatch-button{min-width:36px}}:root{--hft-material-bg:color-mix(in srgb, var(--bg-base-default) 82%, transparent);--hft-material-strong:color-mix(in srgb, var(--bg-base-default) 94%, transparent);--hft-material-soft:color-mix(in srgb, var(--bg-base-secondary) 78%, transparent);--hft-material-border:color-mix(in srgb, var(--text-default) 10%, transparent);--hft-hairline:color-mix(in srgb, var(--text-default) 7%, transparent);--hft-focus:color-mix(in srgb, var(--accent-blue) 38%, transparent);--hft-press:var(--ease-standard);--hft-shadow-panel:0 18px 48px #0f172a1a, 0 1px 0 #ffffffc2 inset;--hft-shadow-floating:0 28px 70px #0f172a2e, 0 7px 22px #0f172a14, 0 0 0 1px var(--hft-material-border)}.theme-dark{--hft-material-bg:color-mix(in srgb, var(--bg-base-default) 74%, transparent);--hft-material-strong:color-mix(in srgb, var(--bg-base-secondary) 88%, transparent);--hft-material-soft:color-mix(in srgb, var(--bg-base-secondary) 72%, transparent);--hft-material-border:#ffffff1c;--hft-hairline:#ffffff17;--hft-focus:color-mix(in srgb, var(--accent-cyan) 36%, transparent);--hft-shadow-panel:0 20px 52px #0000004d, 0 1px 0 #ffffff0f inset;--hft-shadow-floating:0 32px 76px #0000006b, 0 9px 24px #00000042, 0 0 0 1px var(--hft-material-border)}html{background:var(--n-bg-subtle)}body,.app-shell{letter-spacing:0}.app-shell{background:var(--n-bg-subtle)}.app-topbar{border-bottom-color:var(--n-border-default);background:var(--n-bg-elevated)}.app-topbar:after{background:linear-gradient(90deg, transparent, var(--hft-hairline), transparent)}.brand-copy h1,.brand-version{letter-spacing:0}.brand-copy h1{font-family:var(--font-family-heading);color:var(--text-default);-webkit-text-fill-color:currentColor;text-shadow:0 1px #ffffff94;background:0 0;font-style:normal;font-weight:650}.brand-version{background:color-mix(in srgb, var(--accent-blue) 9%, transparent);height:17px;color:color-mix(in srgb, var(--accent-blue) 72%, var(--text-default));-webkit-text-fill-color:currentColor;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent-blue) 16%, transparent);border-radius:6px;padding:0 5px;transform:none}.app-topbar>div:nth-child(2){border:1px solid var(--hft-material-border);border-radius:var(--radius-8);background:var(--hft-material-soft);min-height:34px;-webkit-backdrop-filter:var(--surface-vibrancy-soft);padding:4px;box-shadow:inset 0 1px #ffffffad,0 8px 24px #0f172a0a}.app-toolbar-sep{background:linear-gradient(180deg, transparent, var(--hft-material-border), transparent);height:18px}.workspace{background:var(--bg-base-secondary)}.panel,.app-side-panel,.panel-header,.panel-head,.viewport-bar,.app-statusbar{background:var(--hft-material-bg);border-color:var(--hft-hairline);-webkit-backdrop-filter:var(--surface-vibrancy-soft)}.panel-header__tabs button,.panel-tabs button,.inspector-tabs button{letter-spacing:0;transition:background .18s var(--hft-press), color .18s var(--hft-press), box-shadow .18s var(--hft-press), transform .18s var(--hft-press)}.panel-header__tabs button:hover,.panel-tabs button:hover,.inspector-tabs button:hover{background:color-mix(in srgb, var(--bg-overlay-l2) 72%, transparent)}.panel-header__tabs button.is-active,.panel-tabs button.is-active,.inspector-tabs button.inspector-tab-active{color:var(--text-default);background:var(--bg-base-default);box-shadow:0 1px 2px #0f172a17, 0 0 0 1px var(--hft-material-border);border-bottom-color:#0000}.stage,.canvas-area{background-color:color-mix(in srgb, var(--canvas-bg,#f3f4f6) 88%, #fff);background-image:linear-gradient(180deg, #ffffff70, transparent 34%), radial-gradient(color-mix(in srgb, var(--text-default) 7%, transparent) 1px, transparent 1.4px);background-position:0 0,11px 10px;background-size:auto,22px 22px}.stage:before,.canvas-area:before{content:"";pointer-events:none;width:0;height:0;box-shadow:0 0 90px 42px color-mix(in srgb, var(--accent-blue) 5%, transparent);display:block;position:sticky;top:0}.page-preview,.canvas-preview-frame{border-radius:var(--radius-8);box-shadow:var(--hft-shadow-floating)}.page-preview:after,.canvas-preview-frame:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 1px #ffffffc7,inset 0 -1px #0f172a0d}.ds-btn,.toolbar-button,.icon-btn,.panel-collapse-btn,.panel-expand-btn,.mobile-actions-popover button{letter-spacing:0;transition:background .16s var(--hft-press), border-color .16s var(--hft-press), color .16s var(--hft-press), box-shadow .18s var(--hft-press), transform .18s var(--ease-emphasized), opacity .16s var(--hft-press);transform:translateZ(0)}.ds-btn:hover:not([disabled]),.toolbar-button:hover:not(:disabled),.icon-btn:hover:not(:disabled),.panel-collapse-btn:hover,.panel-expand-btn:hover,.mobile-actions-popover button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 13px #0f172a14,inset 0 1px #ffffffb8}.ds-btn:active:not([disabled]),.toolbar-button:active:not(:disabled),.icon-btn:active:not(:disabled),.panel-collapse-btn:active,.panel-expand-btn:active,.mobile-actions-popover button:active:not(:disabled){transform:translateY(0)scale(.97);box-shadow:inset 0 1px 2px #0f172a14}.ds-btn--ghost,.ghost-button{background:0 0}.ds-btn--ghost:hover:not([disabled]),.ghost-button:hover:not(:disabled){background:color-mix(in srgb, var(--bg-base-default) 72%, var(--bg-overlay-l2))}.ds-btn--secondary,.toolbar-button{background:color-mix(in srgb, var(--bg-base-default) 72%, transparent);border-color:var(--hft-material-border)}.ds-btn--brand,.primary-button,.btn-primary{border-color:color-mix(in srgb, var(--accent-teal) 72%, #087f72);background:linear-gradient(180deg, color-mix(in srgb, var(--accent-teal) 86%, #fff) 0%, #16a99a 100%);color:#fff;box-shadow:0 9px 20px color-mix(in srgb, var(--accent-teal) 27%, transparent), 0 1px 0 #fff6 inset}.ds-btn--brand:hover:not([disabled]),.primary-button:hover:not(:disabled),.btn-primary:hover:not(:disabled){background:linear-gradient(180deg, color-mix(in srgb, var(--accent-teal) 76%, #fff) 0%, #129888 100%)}.ds-btn:focus-visible,.toolbar-button:focus-visible,.icon-btn:focus-visible,.input:focus,.textarea:focus,.ds-input:focus-within,.panel-collapse-btn:focus-visible,.panel-expand-btn:focus-visible{box-shadow:var(--focus-halo);outline:none}.input,.textarea,.ds-input,.viewport-select,.viewport-size-input,.color-field,.source-code-shell{border-color:var(--hft-material-border);background:color-mix(in srgb, var(--bg-base-default) 78%, transparent);box-shadow:inset 0 1px #ffffffb8,0 1px 2px #0f172a08}.source-import-dropzone,.source-editor-status,.source-search-field{border-color:var(--hft-material-border);background:color-mix(in srgb, var(--bg-base-default) 76%, transparent);-webkit-backdrop-filter:saturate(160%)blur(14px);box-shadow:inset 0 1px #ffffffb3,0 6px 18px #0f172a0a}.source-import-dropzone:hover,.source-editor-status:hover{border-color:color-mix(in srgb, var(--accent-blue) 18%, var(--hft-material-border));transform:translateY(-1px);box-shadow:inset 0 1px #ffffffc7,0 10px 24px #0f172a0f}.source-editor-status{transition:border-color .16s var(--hft-press), background .16s var(--hft-press), box-shadow .18s var(--hft-press), transform .18s var(--ease-emphasized)}.source-search-field{transition:border-color .15s var(--hft-press), background .15s var(--hft-press), box-shadow .17s var(--hft-press)}.source-search-field[data-state=found] svg,.source-search-count[data-state=found]{color:var(--status-success-default)}.source-search-field[data-state=empty] svg,.source-search-count[data-state=empty]{color:var(--status-warning-default)}.source-code-shell{transition:border-color .16s var(--hft-press), box-shadow .18s var(--hft-press), background .16s var(--hft-press)}.field label,.inspector-field__label,.panel-header__title,.inspector-card__title{letter-spacing:0}.tree-node{border-radius:var(--radius-8);transition:background .15s var(--hft-press), box-shadow .15s var(--hft-press), transform .17s var(--ease-emphasized), color .15s var(--hft-press);margin:1px 6px}.tree-node:hover{background:color-mix(in srgb, var(--bg-base-default) 74%, var(--bg-overlay-l1));transform:translate(2px);box-shadow:inset 0 1px #ffffffa3}.tree-node.is-selected{background:linear-gradient(90deg, color-mix(in srgb, var(--accent-teal) 14%, transparent), color-mix(in srgb, var(--accent-blue) 7%, transparent));box-shadow:0 0 0 1px color-mix(in srgb, var(--accent-teal) 18%, transparent), 0 8px 18px color-mix(in srgb, var(--accent-teal) 7%, transparent)}.inspector-scroll{background:linear-gradient(180deg, color-mix(in srgb, var(--bg-base-secondary) 60%, transparent), transparent 120px)}.ai-scan-card,.empty-state-card{border-color:var(--hft-material-border);background:color-mix(in srgb, var(--bg-base-default) 86%, transparent);box-shadow:inset 0 1px #ffffffb8,0 8px 24px #0f172a0a}.ai-scan-card:hover{transform:translateY(-1px);box-shadow:inset 0 1px #ffffffd1,0 13px 30px #0f172a12}.toast,.mobile-actions-popover,.cheatsheet,.export-dialog,.color-popover,.tooltip{border-color:var(--hft-material-border);background:var(--hft-material-bg);box-shadow:var(--hft-shadow-floating);-webkit-backdrop-filter:var(--surface-vibrancy);backdrop-filter:var(--surface-vibrancy)}.color-row{min-width:0}.color-row input,.color-channel input{transition:border-color .15s var(--hft-press), background .15s var(--hft-press), box-shadow .17s var(--hft-press)}.color-row input:focus,.color-channel input:focus{border-color:color-mix(in srgb, var(--accent-blue) 38%, var(--hft-material-border));box-shadow:0 0 0 3px var(--hft-focus), 0 1px 0 #fff9 inset}.color-row[data-invalid=true] input{border-color:color-mix(in srgb, var(--status-error-default) 48%, var(--hft-material-border));background:color-mix(in srgb, var(--status-error-default) 5%, var(--bg-base-default));box-shadow:0 0 0 3px color-mix(in srgb, var(--status-error-default) 12%, transparent)}.color-swatch-button{isolation:isolate;background:linear-gradient(135deg, #ffffffeb, #ffffff26), conic-gradient(from 45deg, #f8fafc 0 25%, #d1d5db 0 50%, #f8fafc 0 75%, #d1d5db 0);transition:border-color .15s var(--hft-press), box-shadow .17s var(--hft-press), transform .18s var(--ease-emphasized);background-size:100% 100%,8px 8px;position:relative;box-shadow:inset 0 1px #ffffffd1,0 1px 2px #0f172a14}.color-swatch-button:hover{border-color:color-mix(in srgb, var(--accent-blue) 28%, var(--hft-material-border));transform:translateY(-1px);box-shadow:inset 0 1px #ffffffdb,0 8px 18px #0f172a17}.color-swatch-button:active{transform:translateY(0)scale(.96)}.color-swatch-button:focus-visible,.color-swatch-button[aria-expanded=true]{border-color:color-mix(in srgb, var(--accent-blue) 48%, var(--hft-material-border));box-shadow:0 0 0 3px var(--hft-focus), 0 1px 0 #ffffffc2 inset, 0 8px 18px #0f172a1a;outline:none}.color-swatch-button span{border-radius:calc(var(--radius-4) - 1px);box-shadow:inset 0 0 0 1px #0000001f,0 1px 3px #00000029}.color-popover{width:280px;max-height:min(420px,100vh - 20px);padding:var(--spacer-12);border-radius:var(--radius-16);color:var(--text-default);animation:color-popover-in var(--motion-spring) var(--ease-emphasized) both;transform-origin:0 0;will-change:transform, opacity;overflow-y:auto}.color-popover-header{justify-content:space-between;align-items:center;gap:var(--spacer-12);padding-bottom:var(--spacer-10);display:flex}.color-popover-header>div{gap:2px;min-width:0;display:grid}.color-popover-eyebrow{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:0;font-size:10px;font-weight:600}.color-popover-header strong{color:var(--text-default);font-family:var(--font-family-metric);letter-spacing:0;font-size:13px;font-weight:650}.color-current{border-radius:var(--radius-8);border:1px solid color-mix(in srgb, #fff 48%, var(--hft-material-border));flex:none;width:32px;height:32px;box-shadow:inset 0 0 0 1px #0000001f,0 8px 18px #0f172a21}.color-map{border-radius:var(--radius-12);touch-action:none;height:164px;box-shadow:inset 0 0 0 1px #ffffff26,0 12px 24px #0f172a1a}.color-map:focus-visible{box-shadow:0 0 0 3px var(--hft-focus), 0 0 0 1px #ffffff2e inset, 0 12px 24px #0f172a1a;outline:none}.color-map:after{opacity:.35;background-image:linear-gradient(90deg,#ffffff1f 1px,#0000 1px),linear-gradient(#ffffff1f 1px,#0000 1px);background-size:28px 28px}.color-map-thumb{width:16px;height:16px;transition:transform var(--motion-base) var(--ease-emphasized), box-shadow var(--motion-fast) var(--ease-emphasized);background:0 0;border:2px solid #fff;box-shadow:0 0 0 1px #0006,0 3px 9px #0000006b}.color-map-thumb:hover,.color-map-thumb:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--bg-brand) 30%, transparent), 0 0 0 1px var(--bg-base-default), 0 4px 12px #0000006b;transform:scale(1.18)}.color-controls{margin-top:var(--spacer-12);gap:var(--spacer-10)}.color-hue-slider{cursor:pointer;height:10px;box-shadow:inset 0 0 0 1px #00000021,0 1px #ffffff52}.color-hue-slider:focus-visible{box-shadow:0 0 0 3px var(--hft-focus), 0 0 0 1px #00000021 inset;outline:none}.color-hue-slider::-webkit-slider-thumb{width:18px;height:18px;transition:transform var(--motion-base) var(--ease-emphasized), box-shadow var(--motion-fast) var(--ease-emphasized);border:2px solid #fff;box-shadow:0 0 0 1px #0003,0 4px 10px #00000042}.color-hue-slider:hover::-webkit-slider-thumb{box-shadow:0 0 0 2px color-mix(in srgb, var(--bg-brand) 30%, transparent), 0 0 0 1px var(--bg-base-default), 0 5px 12px #00000052;transform:scale(1.18)}.color-hue-slider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px color-mix(in srgb, var(--bg-brand) 22%, transparent), 0 0 0 1px var(--bg-base-default), 0 5px 12px #00000052;transform:scale(1.18)}.color-rgb-grid{margin-top:var(--spacer-10)}.color-channel{position:relative}.color-channel input{background:color-mix(in srgb, var(--bg-base-default) 70%, transparent);height:28px;color:var(--text-default);border-color:var(--hft-material-border);padding-right:18px}.color-channel span{color:var(--text-tertiary);pointer-events:none;position:absolute;right:6px}.color-preset-row,.color-swatch-grid{gap:var(--spacer-6)}.color-preset-row button,.color-swatch-grid button{border-color:color-mix(in srgb, #fff 30%, var(--hft-material-border));transition:border-color .15s var(--hft-press), box-shadow .17s var(--hft-press), transform .18s var(--ease-emphasized);position:relative;box-shadow:inset 0 0 0 1px #0000001a,0 1px 3px #0f172a1a}.color-preset-row button:hover,.color-swatch-grid button:hover{transform:translateY(-1px)scale(1.08);box-shadow:inset 0 0 0 1px #0000001a,0 7px 14px #0f172a21}.color-preset-row button:active,.color-swatch-grid button:active{transform:scale(.95)}.color-preset-row button:focus-visible,.color-swatch-grid button:focus-visible,.color-preset-row button.is-active,.color-swatch-grid button.is-active{border-color:color-mix(in srgb, var(--accent-blue) 62%, #fff);box-shadow:0 0 0 3px var(--hft-focus), 0 0 0 1px #0000001f inset, 0 7px 14px #0f172a21;outline:none}.color-swatch-grid-history{padding-top:var(--spacer-8);border-top:1px solid var(--hft-hairline);align-items:center}.color-history-label{margin:0 var(--spacer-4) 0 0;color:var(--text-tertiary);letter-spacing:0;font-size:10px;font-weight:600}@keyframes color-popover-in{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes color-popover-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-2px)}}@keyframes numeric-pop{0%{transform:scale(1)}40%{transform:scale(var(--press-scale-numeric))}to{transform:scale(1)}}.mobile-panel-backdrop{display:none}.app-statusbar,.statusbar{box-shadow:0 -1px 0 var(--hft-hairline);background:var(--hft-material-bg);border-top-color:var(--hft-hairline);-webkit-backdrop-filter:var(--surface-vibrancy-soft)}.statusbar-pill,.statusbar-metric{letter-spacing:0}*{scrollbar-color:color-mix(in srgb, var(--text-default) 20%, transparent) transparent;scrollbar-width:thin}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{border-radius:var(--radius-full);background-clip:padding-box;background-color:color-mix(in srgb, var(--text-default) 18%, transparent);border:3px solid #0000}::-webkit-scrollbar-thumb:hover{background-color:color-mix(in srgb, var(--text-default) 30%, transparent)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}@media (width<=760px){.mobile-panel-backdrop{top:var(--topbar-height);right:0;bottom:var(--statusbar-height);z-index:82;background:linear-gradient(90deg, color-mix(in srgb, var(--bg-base-default) 28%, transparent), transparent 46%, color-mix(in srgb, var(--bg-base-default) 24%, transparent)), #0f172a2e;cursor:default;-webkit-backdrop-filter:var(--surface-vibrancy-soft);animation:mobile-panel-backdrop-in .22s var(--ease-quint) both;border:0;padding:0;display:block;position:fixed;left:0}@keyframes mobile-panel-backdrop-in{0%{opacity:0}to{opacity:1}}.workspace.workspace-mobile-shell.workspace-mobile-panel-open>.panel-expand-btn{opacity:0;pointer-events:none}.workspace.workspace-mobile-shell>aside.panel:not(.is-collapsed):not(.inspector){animation:mobile-source-sheet-in .26s var(--ease-quint) both;box-shadow:18px 0 52px #0f172a33, 1px 0 0 var(--hft-hairline)}.workspace.workspace-mobile-shell>.inspector:not(.is-collapsed){animation:mobile-inspector-sheet-in .26s var(--ease-quint) both;box-shadow:-18px 0 52px #0f172a33, -1px 0 0 var(--hft-hairline)}@keyframes mobile-source-sheet-in{0%{opacity:0;transform:translate(-18px)scale(.985)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes mobile-inspector-sheet-in{0%{opacity:0;transform:translate(18px)scale(.985)}to{opacity:1;transform:translate(0)scale(1)}}.statusbar{padding-inline:var(--spacer-8);gap:var(--spacer-6)}.statusbar-zone{gap:var(--spacer-6);min-width:0}.statusbar-zone--left{flex:auto;overflow:hidden}.statusbar-zone--center{flex:0 auto;min-width:0}.statusbar-pill--live{max-width:44vw}.history-drawer-backdrop{inset:var(--topbar-height) 0 var(--statusbar-height);-webkit-backdrop-filter:var(--surface-vibrancy-soft);background:#0f172a33}.history-drawer{top:calc(var(--topbar-height) + var(--spacer-8));right:var(--spacer-8);left:var(--spacer-8);width:auto;max-height:min(68vh, calc(100vh - var(--topbar-height) - var(--statusbar-height) - var(--spacer-24)));border-radius:var(--radius-16);animation-name:history-mobile-sheet-in}@keyframes history-mobile-sheet-in{0%{opacity:0;transform:translateY(-10px)scale(.985)}to{opacity:1;transform:translateY(0)scale(1)}}.statusbar-pill>span:last-child,.statusbar-metric{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}}.nw-app{background:var(--n-bg-base);height:100vh;font-family:var(--n-font-sans);color:var(--n-fg-default);flex-direction:column;display:flex;overflow:hidden}.nw-topbar{background:var(--n-bg-base);border-bottom:1px solid var(--n-border-default);flex-shrink:0;align-items:center;height:56px;padding:0 16px;display:flex}.nw-topbar-left{flex-shrink:0;align-items:center;gap:8px;width:280px;display:flex}.nw-topbar-center{flex:1;justify-content:center;align-items:center;gap:4px;display:flex}.nw-topbar-right{flex-shrink:0;justify-content:flex-end;align-items:center;gap:4px;width:320px;display:flex}.nw-body{flex:1;display:flex;overflow:hidden}.nw-left-panel{width:var(--source-col);background:var(--n-bg-sidebar);border-right:1px solid var(--n-border-default);flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.nw-canvas{background:var(--n-bg-canvas);flex:1;justify-content:center;align-items:center;padding:24px;display:flex;overflow:auto}.nw-tabs{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-sidebar);flex-shrink:0;height:36px;display:flex}.nw-tab{cursor:pointer;height:36px;color:var(--n-fg-secondary);background:0 0;background:var(--n-bg-subtle);font-size:13px;font-weight:500;font-family:var(--n-font-sans);transition:background var(--n-duration-fast) var(--n-ease);border:none;flex:1;padding:0;position:relative}.nw-tab:hover{background:var(--n-bg-hover)}.nw-tab-active{color:var(--n-fg-default);border-bottom:2px solid var(--n-brand)}.nw-tab-active:hover{background:var(--n-bg-hover)}.nw-statusbar{border-top:1px solid var(--n-border-default);height:28px;color:var(--n-fg-tertiary);font-size:11px;font-family:var(--n-font-sans);background:var(--n-bg-sidebar);flex-shrink:0;justify-content:space-between;align-items:center;padding:0 12px;display:flex}.nw-statusbar-left,.nw-statusbar-center,.nw-statusbar-right{align-items:center;gap:6px;display:flex}.nw-status-dot{background:var(--n-success);border-radius:50%;flex-shrink:0;width:6px;height:6px;display:inline-block}.nw-tool-btn{border-radius:var(--n-radius-md);height:28px;color:var(--n-fg-secondary);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease);font-size:12px;font-weight:500;font-family:var(--n-font-sans);white-space:nowrap;background:0 0;border:none;align-items:center;gap:6px;padding:0 8px;display:inline-flex}.nw-tool-btn:hover{background:var(--n-bg-hover);color:var(--n-fg-default)}.nw-tool-btn:focus{outline:2px solid var(--n-border-focus);outline-offset:-1px}.nw-tool-btn:disabled{color:var(--n-fg-disabled);cursor:not-allowed}.nw-tool-btn-icon{justify-content:center;width:28px;height:28px;padding:0}.nw-tool-btn-brand{background:var(--n-brand);color:var(--n-fg-onbrand)}.nw-tool-btn-brand:hover{background:var(--n-brand-hover);color:var(--n-fg-onbrand)}.nw-tool-btn-brand:focus{outline:2px solid var(--n-border-focus);outline-offset:-1px}.nw-tool-divider{background:var(--n-border-default);width:1px;height:16px;margin:0 4px;display:inline-block}.nw-tool-zoom-label{color:var(--n-fg-secondary);text-align:center;-webkit-user-select:none;user-select:none;min-width:44px;font-size:12px;font-weight:500}.nw-preview-card{background:var(--n-bg-elevated);border:1px solid var(--n-border-default);border-radius:var(--n-radius-md);width:800px;max-width:none;box-shadow:var(--n-shadow-card);flex-direction:column;display:flex;overflow:hidden}.nw-preview-urlbar{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-subtle);flex-shrink:0;align-items:center;gap:8px;height:32px;padding:0 12px;display:flex}.nw-preview-urlbar-dot{background:var(--n-border-strong);border-radius:50%;flex-shrink:0;width:8px;height:8px;display:inline-block}.nw-preview-urlbar-input{border-radius:var(--n-radius-sm);background:var(--n-bg-base);border:1px solid var(--n-border-default);height:20px;color:var(--n-fg-tertiary);font-size:11px;font-family:var(--n-font-sans);white-space:nowrap;text-overflow:ellipsis;flex:1;align-items:center;margin-left:8px;padding:0 8px;display:flex;overflow:hidden}.nw-inspector-header{border-bottom:1px solid var(--n-border-default);flex-shrink:0;padding:12px 16px}.nw-inspector-title{color:var(--n-fg-secondary);font-size:12px;font-weight:600;font-family:var(--n-font-sans);text-transform:uppercase;letter-spacing:.04em}.nw-inspector-body{flex-direction:column;gap:8px;padding:8px;display:flex}.nw-card{background:var(--n-bg-elevated);border:1px solid var(--n-border-default);border-radius:var(--n-radius-md);overflow:hidden}.nw-card-brand{border-left:3px solid var(--n-brand)}.nw-card-title{color:var(--n-fg-default);font-size:12px;font-weight:600;font-family:var(--n-font-sans);padding:8px 12px 6px}.nw-card-rows{flex-direction:column;padding:0 12px 8px;display:flex}.nw-card-row{font-family:var(--n-font-sans);justify-content:space-between;align-items:center;padding:5px 0;display:flex}.nw-card-row-label{color:var(--n-fg-secondary);font-size:11px}.nw-card-row-value{color:var(--n-fg-default);align-items:center;gap:6px;font-size:13px;display:inline-flex}.nw-card-divider{background:var(--n-border-default);height:1px;margin:0}.nw-swatch{border:1px solid var(--n-border-default);border-radius:3px;flex-shrink:0;width:14px;height:14px;display:inline-block}html,body,.nw-app,.app-shell{background:var(--n-bg-base);color:var(--n-fg-default);font-family:var(--n-font-sans)}.app-topbar{background:var(--n-bg-base);border-bottom:1px solid var(--n-border-default);height:45px;min-height:45px;box-shadow:none;-webkit-backdrop-filter:none;padding:0 12px}.toast{color:var(--n-fg-default);border-radius:var(--n-radius-md);box-shadow:var(--n-shadow-overlay);-webkit-backdrop-filter:none;backdrop-filter:none}.toast.is-visible{animation:none}.toast:after,.app-topbar:after{display:none}.app-topbar>div:nth-child(2){min-height:0;box-shadow:none;-webkit-backdrop-filter:none;background:0 0;border:0;border-radius:0;padding:0}.workspace,.nw-body{background:var(--n-bg-canvas)}.panel,.app-side-panel,.inspector-panel,.nw-left-panel,.nw-right-panel{background:var(--n-bg-sidebar);border-color:var(--n-border-default);box-shadow:none;-webkit-backdrop-filter:none}.panel-header,.panel-head,.viewport-bar,.app-statusbar,.statusbar,.nw-panel-tabs-row{background:var(--n-bg-elevated);border-color:var(--n-border-default);box-shadow:none;-webkit-backdrop-filter:none}.stage,.canvas-area{background-color:var(--n-bg-canvas);background-image:none}.stage:before,.canvas-area:before{display:none}.stage-panel,.nw-canvas{background:var(--n-bg-canvas)}.nw-preview-card,.page-preview,.canvas-preview-frame{border-color:var(--n-border-default);border-radius:var(--n-radius-md);box-shadow:var(--n-shadow-card)}.page-preview:after,.canvas-preview-frame:after{display:none}.page-preview:hover,.canvas-preview-frame:hover{box-shadow:var(--n-shadow-card);transform:none}.nw-preview-urlbar{background:var(--n-bg-subtle);border-color:var(--n-border-default)}.nw-preview-urlbar-dot{background:var(--n-border-strong)}.nw-preview-urlbar-input{background:var(--n-bg-base);border-color:var(--n-border-default)}.ds-btn,.toolbar-button,.icon-btn,.panel-collapse-btn,.panel-expand-btn,.mobile-actions-popover button{border-radius:var(--n-radius-sm);box-shadow:none;transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease), border-color var(--n-duration-fast) var(--n-ease);transform:none}.ds-btn:hover:not([disabled]),.toolbar-button:hover:not(:disabled),.icon-btn:hover:not(:disabled),.panel-collapse-btn:hover,.panel-expand-btn:hover,.mobile-actions-popover button:hover:not(:disabled),.ds-btn:active:not([disabled]),.toolbar-button:active:not(:disabled),.icon-btn:active:not(:disabled),.panel-collapse-btn:active,.panel-expand-btn:active,.mobile-actions-popover button:active:not(:disabled){box-shadow:none;transform:none}.ds-btn--ghost:hover:not([disabled]),.ghost-button:hover:not(:disabled),.nw-tool-btn:hover{background:var(--n-bg-hover)}.ds-btn--secondary,.toolbar-button{background:var(--n-bg-elevated);border-color:var(--n-border-default);box-shadow:none}.ds-btn--brand,.primary-button,.btn-primary,.nw-tool-btn-brand{background:var(--n-brand);border-color:var(--n-brand);color:var(--n-fg-onbrand);box-shadow:none}.ds-btn--brand:hover:not([disabled]),.primary-button:hover:not(:disabled),.btn-primary:hover:not(:disabled),.nw-tool-btn-brand:hover{background:var(--n-brand-hover);border-color:var(--n-brand-hover);box-shadow:none}.input,.textarea,.ds-input,.viewport-select,.viewport-size-input,.color-field,.source-code-shell{border-color:var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-elevated);box-shadow:none}.input:hover,.textarea:hover,.ds-input:hover,.viewport-select:hover,.viewport-size-input:hover{border-color:var(--n-border-strong);background:var(--n-bg-elevated)}.input:focus,.textarea:focus,.ds-input:focus-within,.ds-btn:focus-visible,.panel-collapse-btn:focus-visible,.panel-expand-btn:focus-visible{box-shadow:var(--n-ring-focus)}.source-import-dropzone,.source-editor-status,.source-search-field{border-color:var(--n-border-default);background:var(--n-bg-elevated);box-shadow:none;-webkit-backdrop-filter:none}.source-import-dropzone:hover,.source-editor-status:hover{border-color:var(--n-border-strong);box-shadow:none;transform:none}.tree-node{border-radius:var(--n-radius-sm);box-shadow:none;transition:background var(--n-duration-fast) var(--n-ease), color var(--n-duration-fast) var(--n-ease);margin:1px 4px;transform:none}.tree-node:hover{background:var(--n-bg-hover);box-shadow:none;transform:none}.tree-node.is-selected{box-shadow:none;background:#e8f1fb}.tree-node.is-selected:after{background:var(--n-brand)}.theme-dark .tree-node.is-selected{background:#4dabf72e}.tree-tag,.tree-node:hover .tree-tag,.tree-tag:hover{box-shadow:none;transform:none}.ai-scan-card,.empty-state-card,.diagnostic-card{border-color:var(--n-border-default);background:var(--n-bg-elevated);box-shadow:none;transition:border-color var(--n-duration-fast) var(--n-ease), background var(--n-duration-fast) var(--n-ease);transform:none}.ai-scan-card:hover{border-color:var(--n-border-strong);box-shadow:none;transform:none}.toast,.mobile-actions-popover,.cheatsheet,.export-dialog,.color-popover,.tooltip,.history-drawer{background:var(--n-bg-elevated);border-color:var(--n-border-default);box-shadow:var(--n-shadow-overlay);-webkit-backdrop-filter:none}.color-swatch-button,.color-swatch-button:hover,.color-swatch-button:active,.color-preset-row button,.color-swatch-grid button,.color-preset-row button:hover,.color-swatch-grid button:hover,.color-preset-row button:active,.color-swatch-grid button:active{box-shadow:none;transform:none}.color-popover{border-radius:var(--n-radius-lg);animation:color-popover-in var(--n-duration-base) var(--n-ease) both}.color-popover.is-closing{animation:color-popover-out var(--n-duration-fast) ease-in both}.ds-input--numeric.is-changed{animation:none}.app-statusbar,.statusbar{border-top-color:var(--n-border-default);box-shadow:none;background:var(--n-bg-elevated);-webkit-backdrop-filter:none}*{scrollbar-color:var(--n-border-strong) transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background-color:var(--n-border-strong);border:2px solid #0000;border-radius:4px}@media (width<=760px){.workspace.workspace-mobile-shell .stage{justify-content:center;align-items:flex-start;padding:12px}.workspace.workspace-mobile-shell .stage-panel{align-items:stretch}.workspace.workspace-mobile-shell .stage>.nw-canvas{flex:auto;align-items:center;width:100%;min-width:0;padding:0}.workspace.workspace-mobile-shell .stage .nw-preview-card{width:100%;min-width:0;max-width:100%}.workspace.workspace-mobile-shell .page-preview-shell{margin:0 auto}.mobile-panel-backdrop,.history-drawer-backdrop{-webkit-backdrop-filter:none;background:#0f0f0f38}.workspace.workspace-mobile-shell>aside.panel:not(.is-collapsed):not(.inspector),.workspace.workspace-mobile-shell>.inspector:not(.is-collapsed){box-shadow:var(--n-shadow-overlay)}}.dialog-backdrop{-webkit-backdrop-filter:none;background:#0f0f0f4d}.export-dialog{border-color:var(--n-border-default);border-radius:var(--n-radius-lg);background:var(--n-bg-elevated);width:min(680px,100vw - 32px);max-height:min(680px,100vh - 32px);box-shadow:var(--n-shadow-overlay)}.export-dialog-header{border-bottom-color:var(--n-border-default);background:0 0;align-items:center;min-height:56px;padding:10px 24px}.export-dialog-header__title{gap:0}.export-dialog-header__icon,.export-dialog-header__eyebrow{display:none}.export-dialog-header h2{color:var(--n-fg-default);font-family:var(--n-font-sans);margin:0;font-size:16px;font-weight:600}.export-dialog-header p{color:var(--n-fg-tertiary);margin-top:2px;font-size:11px;line-height:1.4}.export-dialog-header .icon-button{border-radius:var(--n-radius-sm);box-shadow:none}.export-dialog-header .icon-button:hover{background:var(--n-bg-hover);box-shadow:none}.export-format-tabs{border-bottom:1px solid var(--n-border-default);background:var(--n-bg-subtle);gap:0;padding:8px 24px;display:flex}.export-format-tab{border:1px solid var(--n-border-default);height:32px;color:var(--n-fg-tertiary);font-family:var(--n-font-sans);cursor:pointer;transition:background var(--n-duration-fast) var(--n-ease-out), color var(--n-duration-fast) var(--n-ease-out);background:0 0;border-radius:0;flex:1;justify-content:center;align-items:center;margin-left:-1px;padding:0 12px;font-size:12px;font-weight:500;display:flex}.export-format-tab:first-child{border-radius:var(--n-radius-sm) 0 0 var(--n-radius-sm);margin-left:0}.export-format-tab:last-child{border-radius:0 var(--n-radius-sm) var(--n-radius-sm) 0}.export-format-tab:hover{background:var(--n-bg-hover);color:var(--n-fg-default)}.export-format-tab.is-active{background:var(--n-bg-default);color:var(--n-fg-default);border-color:var(--n-border-strong);z-index:1;position:relative}.export-format-prompt{text-align:center;color:var(--n-fg-secondary);padding:20px 24px 16px;font-size:13px;line-height:1.5}.spin-icon{animation:1s linear infinite spin}.export-dialog-stats{background:0 0;border-bottom:0;min-height:40px;padding:8px 24px}.export-status-pill{border-radius:var(--n-radius-sm);min-height:24px;box-shadow:none}.export-status-pill.is-ready,.export-status-pill.is-ok{background:#0f7b0f14;box-shadow:inset 0 0 0 1px #0f7b0f29}.export-stat{border-color:var(--n-border-default);border-radius:var(--n-radius-sm);background:var(--n-bg-subtle);min-width:0;box-shadow:none}.export-dialog-code{border:1px solid var(--n-border-default);border-radius:var(--n-radius-md);background:var(--n-bg-subtle);height:min(360px,42vh);min-height:180px;margin:0 24px 16px}.export-dialog-code__chrome{display:none}.export-preview-code{background:var(--n-bg-subtle);color:var(--n-fg-default);caret-color:var(--n-brand);font-family:var(--n-font-mono);box-shadow:none;padding:12px 16px;font-size:11px;line-height:1.7}.export-preview-code:focus{box-shadow:inset 0 0 0 2px var(--n-border-focus)}.export-dialog-actions{border-top-color:var(--n-border-default);background:0 0;min-height:56px;padding:10px 24px}.export-action,.export-action:hover,.export-action:active{box-shadow:none;transform:none}.toast{top:calc(var(--topbar-height,45px) + 14px);bottom:auto;left:auto;right:18px;transform:translateY(-8px)}.toast.is-visible{transform:translateY(0)}.statusbar-save-pill,.statusbar-device-pill{border:1px solid var(--n-border-default);border-radius:var(--n-radius-pill,999px);background:var(--n-bg-subtle);min-height:20px;color:var(--n-fg-secondary);white-space:nowrap;align-items:center;gap:5px;padding:2px 7px;display:inline-flex}.statusbar-save-pill--saving{color:var(--n-brand)}.statusbar-save-pill--saved{color:var(--n-success)}.statusbar-save-pill--unavailable{color:var(--n-warning)}.statusbar-save-dot{background:currentColor;border-radius:50%;width:6px;height:6px}.statusbar-device-pill{color:var(--n-fg-tertiary);background:var(--n-bg-elevated)}.nw-panel-tabs-row{border-bottom:1px solid var(--n-border-default);align-items:center;display:flex}.app-shell,.app-topbar,.statusbar,.nw-left-panel,.nw-right-panel,.nw-canvas,.stage,.panel{transition:background-color var(--n-duration-base) var(--n-ease-expand), border-color var(--n-duration-base) var(--n-ease-expand), color var(--n-duration-base) var(--n-ease-expand), box-shadow var(--n-duration-base) var(--n-ease-expand), width var(--n-duration-slow) var(--n-ease-expand), opacity var(--n-duration-base) var(--n-ease-expand)!important}.panel.is-collapsed{transition:width var(--n-duration-slow) var(--n-ease-expand), opacity var(--n-duration-base) var(--n-ease-expand), transform var(--n-duration-slow) var(--n-ease-expand)!important}@media (width<=760px){.export-dialog{width:min(100%,100vw - 16px)}.export-dialog-header,.export-dialog-stats,.export-dialog-actions{padding-left:16px;padding-right:16px}.export-dialog-code{height:min(320px,38vh);margin:0 16px 12px}}
