/*
 * Node Buster's product-level token contract.
 *
 * Figma synchronisation may replace the semantic --ds-* aliases at runtime.
 * Components should consume semantic aliases, never palette values directly.
 * The fallback values intentionally preserve the existing light interface.
 */
:root {
  --nb-font-sans: "Krub", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --nb-font-mono: "Source Code Pro", ui-monospace, SFMono-Regular, Menlo, monospace;
  --nb-type-display-4xl-size: 36px;
  --nb-type-display-4xl-line: 40px;
  --nb-type-heading-3xl-size: 30px;
  --nb-type-heading-3xl-line: 36px;
  --nb-type-heading-2xl-size: 24px;
  --nb-type-heading-2xl-line: 32px;
  --nb-type-heading-2xl-weight: 300;
  --nb-type-heading-2xl-tracking: -0.24px;
  --nb-type-heading-xl-size: 20px;
  --nb-type-heading-xl-line: 28px;
  --nb-type-heading-xl-weight: 300;
  --nb-type-heading-xl-tracking: 0px;
  --nb-type-heading-lg-size: 18px;
  --nb-type-heading-lg-line: 28px;
  --nb-type-heading-lg-weight: 300;
  --nb-type-heading-lg-tracking: 0px;
  --nb-type-body-base-size: 16px;
  --nb-type-body-base-line: 24px;
  --nb-type-body-sm-size: 14px;
  --nb-type-body-sm-line: 20px;
  --nb-type-body-xs-size: 12px;
  --nb-type-body-xs-line: 16px;
  --nb-type-label-tiny-size: 11px;
  --nb-type-label-tiny-line: 16px;
  --nb-spacing-1: 4px;
  --nb-spacing-2: 8px;
  --nb-spacing-3: 12px;
  --nb-spacing-4: 16px;
  --nb-spacing-6: 24px;
  --nb-space-1: var(--nb-spacing-1);
  --nb-space-2: var(--nb-spacing-2);
  --nb-space-3: var(--nb-spacing-3);
  --nb-space-4: var(--nb-spacing-4);
  --nb-space-5: var(--nb-spacing-6);
  --nb-radius-none: 0px;
  --nb-radius-xs: 2px;
  --nb-radius-sm: 4px;
  --nb-radius-md: 6px;
  --nb-radius-lg: 8px;
  --nb-radius-xl: 12px;
  --nb-radius-2xl: 16px;
  --nb-radius-full: 9999px;
  --nb-radius-control: var(--nb-radius-md);
  --nb-radius-card: var(--nb-radius-lg);
  --nb-color-surface: #fff;
  --nb-color-surface-subtle: #fafafd;
  --nb-color-text: #34343d;
  --nb-color-text-muted: #85858f;
  --nb-color-border: #e1e1e8;
  --nb-color-focus: #81818d;
  --nb-color-hover: #f4f4f7;
  --nb-color-selection: #eff6ff;
  --nb-color-selection-border: #84b6fa;
  --nb-color-danger: #b4473d;
  --nb-color-danger-hover: #963b33;
  --nb-brand-primary: #ff5100;
  --ds-app-surface: var(--nb-color-surface);
  --ds-app-surface-subtle: var(--nb-color-surface-subtle);
  --ds-canvas-node-surface: var(--ds-app-surface);
  --ds-canvas-node-border: var(--ds-button-border);
  --ds-canvas-node-text: var(--ds-text);
  --ds-canvas-node-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
  --nb-toggle-surface: #fdfdfd;
  --nb-toggle-track-off: #0000000a;
  --nb-toggle-thumb-off: #696969;
  --nb-toggle-thumb-on: #ffffff;
  --nb-toggle-track-on: #ff5100;
  --ds-toggle-node-surface: var(--nb-toggle-surface);
  --ds-toggle-track-off: var(--nb-toggle-track-off);
  --ds-toggle-thumb-off: var(--nb-toggle-thumb-off);
  --ds-toggle-thumb-on: var(--nb-toggle-thumb-on);
  --ds-toggle-track-on: var(--nb-toggle-track-on);
  --ds-post-it-background: #FFF7AB;
  --ds-figma-post-it-header-text: #171717;
  --ds-text: var(--nb-color-text);
  --ds-muted: var(--nb-color-text-muted);
  --ds-field-surface: var(--nb-color-surface-subtle);
  --ds-field-border: #dedee6;
  --ds-field-focus: var(--nb-color-focus);
  --ds-button-surface: var(--nb-color-surface);
  --ds-button-border: var(--nb-color-border);
  --ds-button-border-hover: #c6c6d0;
  --ds-button-icon: #777782;
  --ds-button-hover: var(--nb-color-hover);
  --ds-button-primary-surface: #2d67de;
  --ds-button-primary-hover: #255dca;
  --ds-button-primary-border: #2d67de;
  --ds-button-primary-border-hover: #255dca;
  --ds-button-primary-foreground: #fff;
  --field-border: var(--ds-field-border);
  --field-background: var(--ds-field-surface);
  --field-text: var(--ds-text);
  --field-focus: var(--ds-field-focus);
  --ds-selection-surface: var(--nb-color-selection);
  --ds-selection-border: var(--nb-color-selection-border);
  --ds-danger: var(--nb-color-danger);
  --ds-danger-hover: var(--nb-color-danger-hover);
  --ds-danger-foreground: #fff;
  --ds-node-field-border: #e5e6ec;
  --ds-node-field-surface: #fafafd;
  --ds-node-field-open-surface: #fff;
  --ds-node-field-input-border: #dbdce4;
  --ds-panel-surface: #fafbfe;
  --ds-panel-border: #e5e7ee;
  --ds-panel-text: #686a77;
  --ds-panel-muted: #858792;
  --ds-accent: #8055dd;
  --ds-slider-track: #efefef;
  --ds-slider-range: var(--nb-brand-primary, #ff5100);
  --ds-slider-thumb-surface: var(--ds-app-surface);
  --ds-carousel-active-border: #ff7e42;
  --ds-info-surface: #f8fbff;
  --ds-info-border: #dde7fb;
  --ds-info-settings-border: #dfe7f7;
  --ds-info-text: #5272a6;
  --ds-info-body: #4d5363;
  --ds-info-danger: #a9473d;
  --ds-type-preview-border: #e7e7ed;
  --ds-type-control-border: #e1e1e7;
  --ds-type-control-surface: #f4f4f6;
  --ds-type-row-text: #555560;
  --ds-type-control-text: #73737d;
  --ds-instagram-surface: #fff;
  --ds-instagram-surface-subtle: #fafafd;
  --ds-instagram-border: #05050530;
  --ds-instagram-divider: #05050530;
  --ds-instagram-text: #171717;
  --ds-instagram-muted: #777781;
  --ds-instagram-placeholder: #f3f3f6;
  --ds-instagram-settings-border: #e8e8ee;
  --ds-instagram-settings-muted: #777781;
  --ds-table-border: #eeeef1;
  --ds-table-header-surface: #fafafd;
  --ds-table-header-text: #5c5c66;
  --ds-table-cell-text: #555560;
  --ds-inspector-control-surface: #fff;
  --ds-inspector-control-border: #dedee6;
  --ds-inspector-control-text: #363640;
  --ds-inspector-option-text: #393943;
  --ds-inspector-option-active-surface: #eef4ff;
  --ds-inspector-option-active-text: #2867d9;
  --ds-inspector-control-focus-shadow: #81818d18;
  --ds-unsplash-surface: #fff;
  --ds-unsplash-surface-subtle: #fafafd;
  --ds-unsplash-border: #e8e8ee;
  --ds-unsplash-muted: #777781;
  --ds-unsplash-text: #73737d;
  --ds-unsplash-accent: #2563eb;
  --ds-unsplash-danger: #b4473d;
  --ds-unsplash-drop-surface: #f4f8ff;
  --ds-upload-placeholder: #8a8a95;
  --ds-upload-remove-border: #e1e1e8;
  --ds-upload-remove-surface: #fffffff0;
  --ds-upload-remove-text: #5f5f69;
  --ds-upload-remove-hover-border: #efc9c5;
  --ds-upload-remove-hover-surface: #fff5f4;
  --ds-color-picker-surface: #fff;
  --ds-color-picker-border: #dedee6;
  --ds-color-picker-text: #3b3b45;
  --ds-color-picker-muted: #777782;
  --ds-color-picker-hover: #f5f5f7;
  --ds-color-picker-field-text: #555560;
  --ds-color-picker-divider: #eeeeF2;
  --ds-color-picker-swatch-border: #dedee6;
  --ds-inspector-section-border: #e8e8ee;
  --ds-inspector-section-label: #777781;
  --ds-brand-kit-surface: #fafafd;
  --ds-brand-kit-border: #e4e4eb;
  --ds-brand-kit-swatches-border: #dedee6;
  --ds-brand-kit-title: #363640;
  --ds-brand-kit-muted: #85858f;
  --ds-capability-border: #e6e6eb;
  --ds-capability-text: #565661;
  --ds-status-neutral-surface: #fafafd;
  --ds-status-neutral-border: #e4e4eb;
  --ds-status-neutral-text: #686872;
  --ds-status-neutral-icon-surface: #ededf1;
  --ds-status-success-surface: #f1fbf5;
  --ds-status-success-border: #b9e6d0;
  --ds-status-success-text: #23734e;
  --ds-status-success-icon-surface: #ccefdc;
  --ds-status-danger-surface: #fff7f5;
  --ds-status-danger-border: #f2d1cc;
  --ds-status-danger-text: #a9473d;
  --ds-status-danger-icon-surface: #f9dfdb;
  --ds-auth-card-surface: #fffffff5;
  --ds-auth-border: var(--ds-button-border);
  --ds-auth-heading: #292932;
  --ds-auth-text: var(--ds-text);
  --ds-auth-muted: #73737d;
  --ds-auth-backdrop: linear-gradient(145deg,#f8f9fc 0%,#fff 48%,#f3f6ff 100%);
  --ds-auth-shadow: 0 24px 64px #20202a1c;
  --ds-auth-dialog-backdrop: rgba(20,21,28,.32);
  --ds-admin-primary-hover: #255dca;
  --ds-admin-primary-text: #fff;
  --ds-admin-warning-surface: #fff9ed;
  --ds-admin-warning-border: #f1dfbd;
  --ds-admin-warning-text: #936b2a;
  --ds-canvas-group-border: #d8d8e0;
  --ds-canvas-group-selected: #60a5fa;
  --ds-canvas-group-surface: #ececf033;
  --ds-canvas-group-header: #f0f1f4;
  --ds-canvas-group-text: #454650;
  --ds-canvas-group-handle-border: #a7a7b0;
  --ds-canvas-group-handle-surface: #fff;
  --ds-inspector-group-border: #e8e8ee;
  --ds-inspector-group-item-surface: #fafafd;
  --ds-inspector-group-item-text: #5d5d67;
  --ds-compositor-stage-border: #e6e6ec;
  --ds-compositor-stage-checker-a: #f0f0f4;
  --ds-compositor-stage-checker-b: #fafafd;
  --ds-compositor-selection: var(--ds-selection-border);
  --ds-compositor-selection-shadow: #2563eb55;
  --ds-compositor-handle-surface: var(--ds-app-surface);
  --ds-compositor-empty-border: #d8d8e0;
  --ds-compositor-empty-text: var(--ds-muted);
  --ds-node-status-muted: #92929c;
  --ds-node-status-waiting: #a97d3b;
  --ds-node-status-problem: #c95c60;
  --ds-port-border: #8d8d98;
  --ds-port-surface: var(--ds-app-surface);
  --ds-port-center: #62626d;
  --ds-port-pending: #25252b;
  --ds-control-flow-neutral: #738196;
  --ds-control-flow-neutral-surface: #f7f8fb;
  --ds-control-flow-success: #029c17;
  --ds-control-flow-danger: #f24822;
  --ds-library-panel-surface: #fff;
  --ds-library-rail-surface: #fafafd;
  --ds-library-rail-border: #e5e5eb;
  --ds-library-rail-icon: #73737d;
  --ds-library-rail-hover-surface: #f0f0f4;
  --ds-library-rail-hover-text: #34343d;
  --ds-library-rail-active-surface: var(--ds-selection-surface);
  --ds-library-rail-active-text: #246bdb;
  --ds-library-rail-active-border: #bfdbfe;
  --ds-library-tabs-border: #e7e7ed;
  --ds-library-tabs-surface: #f6f6f8;
  --ds-library-tab-text: #858590;
  --ds-library-tab-hover-text: #484853;
  --ds-library-tab-active-surface: var(--ds-app-surface);
  --ds-library-tab-active-text: #22232a;
  --ds-library-group-title: #777782;
  --ds-library-chip-surface: #24242b;
  --ds-library-chip-text: #fff;
  --ds-library-chip-hover: #555562;
  --ds-canvas-menu-surface: #fff;
  --ds-canvas-menu-border: #dedee6;
  --ds-canvas-menu-shadow: #29293222;
  --ds-canvas-menu-text: #3d3d46;
  --ds-canvas-menu-muted: #667085;
  --ds-canvas-menu-divider: #eaecf0;
  --ds-canvas-menu-hover: #eff6ff;
  --ds-canvas-menu-hover-text: #1d4ed8;
  --ds-canvas-menu-icon-surface: #f1f2f6;
  --ds-canvas-menu-icon: #656572;
  --ds-canvas-menu-icon-hover-surface: #dbeafe;
  --ds-canvas-menu-icon-hover: #2563eb;
  --ds-canvas-menu-subtle-hover: #f3f4f8;
  --ds-canvas-menu-button-border: #e2e3e9;
  --ds-canvas-menu-button-text: #4f505a;
  --ds-canvas-menu-focus-border: #bfdbfe;
  --ds-canvas-toolbar-surface: #fff;
  --ds-canvas-toolbar-border: #e1e1e8;
  --ds-canvas-toolbar-shadow: #20202918;
  /* Figma shadow/md effect: two restrained layers from the shared popup style. */
  --nb-shadow-default: 0 6px 18px #25252a24;
  --nb-shadow-md-style: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --ds-canvas-toolbar-text: #34343d;
  --ds-canvas-toolbar-button: #44444e;
  --ds-canvas-toolbar-hover: #f1f1f5;
  --ds-canvas-toolbar-disabled: #b4b4bd;
  --ds-canvas-toolbar-divider: #e2e2e8;
  --ds-canvas-toolbar-active: #eff6ff;
  --ds-canvas-toolbar-active-text: #2563eb;
  --ds-canvas-toolbar-active-border: #bfdbfe;
  --ds-canvas-marquee-border: #8d8d98;
  --ds-canvas-marquee-surface: #8d8d9818;
  --ds-minimap-control-surface: #fffffff2;
  --ds-minimap-control-border: #dedee6;
  --ds-minimap-control-text: #666671;
  --ds-minimap-control-shadow: #25252a12;
  --ds-minimap-control-hover-surface: #f4f4f7;
  --ds-minimap-control-hover-text: #2d2d36;
  --ds-minimap-panel-surface: #ffffffef;
  --ds-minimap-panel-border: #dedee6;
  --ds-minimap-panel-shadow: #25252a18;
  --ds-minimap-viewport-surface: color-mix(in srgb, var(--ds-muted) 14%, transparent);
  --ds-minimap-viewport-border: var(--ds-muted);
  --ds-app-header-surface: var(--ds-app-surface);
  --ds-app-header-border: #e5e5eb;
  --ds-app-brand-text: #15151a;
  --ds-app-brand-status-surface: #dffbea;
  --ds-app-brand-status-text: #276448;
  --ds-project-picker-surface: #f6f6f7;
  --ds-project-picker-text: #31313a;
  --ds-project-picker-icon: #666672;
  --ds-header-state-text: #73737d;
  --ds-instagram-header-surface: var(--ds-app-surface);
  --ds-instagram-header-border: #dddde4;
  --ds-instagram-header-text: #36363f;
  --ds-account-avatar-surface: #653cff;
  --ds-account-avatar-text: #fff;
  --ds-header-menu-surface: #fff;
  --ds-header-menu-border: var(--ds-button-border);
  --ds-header-menu-shadow: var(--ds-canvas-toolbar-shadow);
  --ds-header-menu-text: #45454e;
  --ds-header-menu-hover: #f4f4f7;
  --ds-header-menu-icon: #6c6c75;
  --ds-header-menu-heading: #92929b;
  --ds-header-menu-divider: #ececf0;
  --ds-header-menu-meta: #90909a;
  --ds-header-menu-summary: #2c2c34;
  --ds-header-menu-summary-meta: #777780;
  --ds-header-menu-current: #262630;
  --ds-header-menu-current-meta: #92929b;
  --ds-header-menu-action: #777782;
  --ds-header-menu-danger-surface: #fff2f1;
  --ds-header-menu-danger: var(--ds-danger);
  --ds-header-menu-active-shadow: #11131f1c;
  --ds-header-search-surface: var(--ds-app-surface);
  --ds-header-search-border: rgba(3,3,3,.15);
  --ds-header-search-text: #34343d;
  --ds-header-search-muted: #696969;
  --ds-header-search-focus-border: #9ba5b5;
  --ds-header-search-focus-ring: #2563eb12;
  --ds-header-results-surface: #fff;
  --ds-header-results-border: #e3e3e9;
  --ds-header-results-shadow: #2020291c;
  --ds-header-results-active: var(--ds-selection-surface);
  --ds-header-results-active-text: #1d4ed8;
  --ds-header-results-meta: #85858f;
}

:root[data-theme="dark"] {
  --nb-toggle-surface: #131413;
  --nb-toggle-track-off: #ebebeb0d;
  --nb-toggle-thumb-off: #989a99;
  --nb-toggle-track-on: #ff7e42;
  color-scheme: dark !important;
  --nb-color-surface: #1b1c22;
  --nb-color-surface-subtle: #24252d;
  --nb-color-text: #f2f3f7;
  --nb-color-text-muted: #a9acb9;
  --nb-color-border: #3a3c47;
  --nb-color-focus: #b7b9c6;
  --nb-color-hover: #30323c;
  --nb-color-selection: #263854;
  --nb-color-selection-border: #75a7ff;
  --nb-color-danger: #ec7d72;
  --nb-color-danger-hover: #f09288;
  --nb-brand-primary: #ff8055;
  --ds-node-field-border: var(--ds-button-border);
  --ds-canvas-node-surface: var(--ds-app-surface);
  --ds-canvas-node-border: var(--ds-button-border);
  --ds-canvas-node-text: var(--ds-text);
  --ds-node-field-surface: var(--ds-app-surface-subtle);
  --ds-node-field-open-surface: var(--ds-app-surface);
  --ds-node-field-input-border: var(--ds-field-border);
  --ds-panel-surface: var(--ds-app-surface-subtle);
  --ds-panel-border: var(--ds-button-border);
  --ds-panel-text: var(--ds-text);
  --ds-panel-muted: var(--ds-muted);
  --ds-accent: #b9a0ff;
  --ds-slider-track: #4a4a4a;
  --ds-slider-range: var(--nb-brand-primary, #ff8055);
  --ds-slider-thumb-surface: var(--ds-app-surface);
  --ds-carousel-active-border: #ffab85;
  --ds-button-primary-surface: #75a7ff;
  --ds-button-primary-hover: #91b7ff;
  --ds-button-primary-border: #75a7ff;
  --ds-button-primary-border-hover: #91b7ff;
  --ds-button-primary-foreground: #1b1c22;
  --ds-info-surface: var(--ds-app-surface-subtle);
  --ds-info-border: var(--ds-button-border);
  --ds-info-settings-border: var(--ds-button-border);
  --ds-info-text: var(--ds-muted);
  --ds-info-body: var(--ds-text);
  --ds-info-danger: var(--ds-danger);
  --ds-type-preview-border: var(--ds-button-border);
  --ds-type-control-border: var(--ds-button-border);
  --ds-type-control-surface: var(--ds-app-surface-subtle);
  --ds-type-row-text: var(--ds-text);
  --ds-type-control-text: var(--ds-muted);
  --ds-field-border: #41434f;
  --ds-button-icon: #c9ccd7;
  --ds-instagram-surface: #1b1d1c;
  --ds-instagram-surface-subtle: #24252d;
  --ds-instagram-border: #eeeeee2c;
  --ds-instagram-divider: #eeeeee2c;
  --ds-instagram-text: #edefee;
  --ds-instagram-muted: #bcbebc;
  --ds-instagram-placeholder: #24252d;
  --ds-instagram-settings-border: #3a3c47;
  --ds-instagram-settings-muted: #a9acb9;
  --ds-table-border: #3a3c47;
  --ds-table-header-surface: #24252d;
  --ds-table-header-text: #f2f3f7;
  --ds-table-cell-text: #d2d4dc;
  --ds-inspector-control-surface: #1b1c22;
  --ds-inspector-control-border: #3a3c47;
  --ds-inspector-control-text: #f2f3f7;
  --ds-inspector-option-text: #f2f3f7;
  --ds-inspector-option-active-surface: #263854;
  --ds-inspector-option-active-text: #75a7ff;
  --ds-inspector-control-focus-shadow: #b7b9c618;
  --ds-unsplash-surface: var(--ds-app-surface);
  --ds-unsplash-surface-subtle: var(--ds-app-surface-subtle);
  --ds-unsplash-border: var(--ds-button-border);
  --ds-unsplash-muted: var(--ds-muted);
  --ds-unsplash-text: var(--ds-muted);
  --ds-unsplash-accent: var(--ds-selection-border);
  --ds-unsplash-danger: var(--ds-danger);
  --ds-unsplash-drop-surface: var(--ds-selection-surface);
  --ds-upload-placeholder: var(--ds-muted);
  --ds-upload-remove-border: var(--ds-button-border);
  --ds-upload-remove-surface: var(--ds-app-surface);
  --ds-upload-remove-text: var(--ds-button-icon);
  --ds-upload-remove-hover-border: var(--ds-danger);
  --ds-upload-remove-hover-surface: var(--ds-app-surface-subtle);
  --ds-color-picker-surface: var(--ds-app-surface);
  --ds-color-picker-border: var(--ds-button-border);
  --ds-color-picker-text: var(--ds-text);
  --ds-color-picker-muted: var(--ds-muted);
  --ds-color-picker-hover: var(--ds-button-hover);
  --ds-color-picker-field-text: var(--ds-text);
  --ds-color-picker-divider: var(--ds-button-border);
  --ds-color-picker-swatch-border: var(--ds-button-border);
  --ds-inspector-section-border: var(--ds-button-border);
  --ds-inspector-section-label: var(--ds-muted);
  --ds-brand-kit-surface: var(--ds-app-surface-subtle);
  --ds-brand-kit-border: var(--ds-button-border);
  --ds-brand-kit-swatches-border: var(--ds-button-border);
  --ds-brand-kit-title: var(--ds-text);
  --ds-brand-kit-muted: var(--ds-muted);
  --ds-capability-border: var(--ds-button-border);
  --ds-capability-text: var(--ds-muted);
  --ds-status-neutral-surface: var(--ds-app-surface-subtle);
  --ds-status-neutral-border: var(--ds-button-border);
  --ds-status-neutral-text: var(--ds-muted);
  --ds-status-neutral-icon-surface: var(--ds-app-surface);
  --ds-status-success-surface: #20392f;
  --ds-status-success-border: #35674f;
  --ds-status-success-text: #92d7ae;
  --ds-status-success-icon-surface: #2d5340;
  --ds-status-danger-surface: #452e31;
  --ds-status-danger-border: #74454b;
  --ds-status-danger-text: #f09288;
  --ds-status-danger-icon-surface: #603b40;
  --ds-auth-card-surface: #1b1c22;
  --ds-auth-border: var(--ds-button-border);
  --ds-auth-heading: var(--ds-text);
  --ds-auth-text: var(--ds-text);
  --ds-auth-muted: var(--ds-muted);
  --ds-auth-backdrop: linear-gradient(145deg,#171820 0%,#1b1c22 48%,#202337 100%);
  --ds-auth-shadow: 0 24px 64px #0008;
  --ds-auth-dialog-backdrop: rgba(0,0,0,.56);
  --ds-admin-primary-hover: #75a7ff;
  --ds-admin-primary-text: #1b1c22;
  --ds-admin-warning-surface: #3c3427;
  --ds-admin-warning-border: #6c5935;
  --ds-admin-warning-text: #e9ba72;
  --ds-canvas-group-border: #41434f;
  --ds-canvas-group-selected: #75a7ff;
  --ds-canvas-group-surface: #5054633d;
  --ds-canvas-group-header: #30323c;
  --ds-canvas-group-text: #f2f3f7;
  --ds-canvas-group-handle-border: #777e91;
  --ds-canvas-group-handle-surface: #24252d;
  --ds-inspector-group-border: var(--ds-button-border);
  --ds-inspector-group-item-surface: var(--ds-app-surface-subtle);
  --ds-inspector-group-item-text: var(--ds-text);
  --ds-compositor-stage-border: var(--ds-button-border);
  --ds-compositor-stage-checker-a: #30323c;
  --ds-compositor-stage-checker-b: #24252d;
  --ds-compositor-selection: var(--ds-selection-border);
  --ds-compositor-selection-shadow: #75a7ff55;
  --ds-compositor-handle-surface: var(--ds-app-surface-subtle);
  --ds-compositor-empty-border: var(--ds-button-border);
  --ds-compositor-empty-text: var(--ds-muted);
  --ds-node-status-muted: var(--ds-muted);
  --ds-node-status-waiting: #e9ba72;
  --ds-node-status-problem: #ec7d72;
  --ds-port-border: #8e93a2;
  --ds-port-surface: var(--ds-app-surface);
  --ds-port-center: #c9ccd7;
  --ds-port-pending: #b7b9c6;
  --ds-control-flow-neutral: #a9acb9;
  --ds-control-flow-neutral-surface: #30323c;
  --ds-control-flow-success: #55cf85;
  --ds-control-flow-danger: #ff806b;
  --ds-library-panel-surface: var(--ds-app-surface);
  --ds-library-rail-surface: var(--ds-app-surface-subtle);
  --ds-library-rail-border: var(--ds-button-border);
  --ds-library-rail-icon: var(--ds-muted);
  --ds-library-rail-hover-surface: var(--ds-button-hover);
  --ds-library-rail-hover-text: var(--ds-text);
  --ds-library-rail-active-surface: var(--ds-selection-surface);
  --ds-library-rail-active-text: var(--ds-selection-border);
  --ds-library-rail-active-border: var(--ds-selection-border);
  --ds-library-tabs-border: var(--ds-button-border);
  --ds-library-tabs-surface: var(--ds-app-surface-subtle);
  --ds-library-tab-text: var(--ds-muted);
  --ds-library-tab-hover-text: var(--ds-text);
  --ds-library-tab-active-surface: var(--ds-app-surface);
  --ds-library-tab-active-text: var(--ds-text);
  --ds-library-group-title: var(--ds-muted);
  --ds-library-chip-surface: #3a3c47;
  --ds-library-chip-text: var(--ds-text);
  --ds-library-chip-hover: #4a4c58;
  --ds-canvas-menu-surface: var(--ds-app-surface-subtle);
  --ds-canvas-menu-border: var(--ds-button-border);
  --ds-canvas-menu-shadow: #0008;
  --ds-canvas-menu-text: var(--ds-text);
  --ds-canvas-menu-muted: var(--ds-muted);
  --ds-canvas-menu-divider: var(--ds-button-border);
  --ds-canvas-menu-hover: var(--ds-selection-surface);
  --ds-canvas-menu-hover-text: var(--ds-selection-border);
  --ds-canvas-menu-icon-surface: var(--ds-app-surface);
  --ds-canvas-menu-icon: var(--ds-button-icon);
  --ds-canvas-menu-icon-hover-surface: var(--ds-selection-surface);
  --ds-canvas-menu-icon-hover: var(--ds-selection-border);
  --ds-canvas-menu-subtle-hover: var(--ds-button-hover);
  --ds-canvas-menu-button-border: var(--ds-button-border);
  --ds-canvas-menu-button-text: var(--ds-text);
  --ds-canvas-menu-focus-border: var(--ds-selection-border);
  --ds-canvas-toolbar-surface: var(--ds-app-surface);
  --ds-canvas-toolbar-border: var(--ds-button-border);
  --ds-canvas-toolbar-shadow: #0008;
  --ds-canvas-toolbar-text: var(--ds-text);
  --ds-canvas-toolbar-button: var(--ds-button-icon);
  --ds-canvas-toolbar-hover: var(--ds-button-hover);
  --ds-canvas-toolbar-disabled: var(--ds-muted);
  --ds-canvas-toolbar-divider: var(--ds-button-border);
  --ds-canvas-toolbar-active: var(--ds-selection-surface);
  --ds-canvas-toolbar-active-text: var(--ds-selection-border);
  --ds-canvas-toolbar-active-border: var(--ds-selection-border);
  --ds-canvas-marquee-border: var(--ds-selection-border);
  --ds-canvas-marquee-surface: color-mix(in srgb,var(--ds-selection-border) 12%,transparent);
  --ds-minimap-control-surface: var(--ds-app-surface-subtle);
  --ds-minimap-control-border: var(--ds-button-border);
  --ds-minimap-control-text: var(--ds-text);
  --ds-minimap-control-shadow: #0008;
  --ds-minimap-control-hover-surface: var(--ds-button-hover);
  --ds-minimap-control-hover-text: var(--ds-text);
  --ds-minimap-panel-surface: var(--ds-app-surface);
  --ds-minimap-panel-border: var(--ds-button-border);
  --ds-minimap-panel-shadow: #0008;
  --ds-minimap-viewport-surface: color-mix(in srgb, var(--ds-muted) 22%, transparent);
  --ds-minimap-viewport-border: var(--ds-muted);
  --ds-app-header-surface: var(--ds-app-surface);
  --ds-app-header-border: var(--ds-button-border);
  --ds-app-brand-text: var(--ds-text);
  --ds-app-brand-status-surface: #20392f;
  --ds-app-brand-status-text: #92d7ae;
  --ds-project-picker-surface: var(--ds-app-surface-subtle);
  --ds-project-picker-text: var(--ds-text);
  --ds-project-picker-icon: var(--ds-muted);
  --ds-header-state-text: var(--ds-muted);
  --ds-instagram-header-surface: var(--ds-app-surface);
  --ds-instagram-header-border: var(--ds-button-border);
  --ds-instagram-header-text: var(--ds-text);
  --ds-account-avatar-surface: #815cf1;
  --ds-account-avatar-text: #fff;
  --ds-header-menu-surface: var(--ds-app-surface);
  --ds-header-menu-border: var(--ds-button-border);
  --ds-header-menu-shadow: var(--ds-canvas-toolbar-shadow);
  --ds-header-menu-text: var(--ds-text);
  --ds-header-menu-hover: var(--ds-button-hover);
  --ds-header-menu-icon: var(--ds-muted);
  --ds-header-menu-heading: var(--ds-muted);
  --ds-header-menu-divider: var(--ds-button-border);
  --ds-header-menu-meta: var(--ds-muted);
  --ds-header-menu-summary: var(--ds-text);
  --ds-header-menu-summary-meta: var(--ds-muted);
  --ds-header-menu-current: var(--ds-text);
  --ds-header-menu-current-meta: var(--ds-muted);
  --ds-header-menu-action: var(--ds-button-icon);
  --ds-header-menu-danger-surface: #452e31;
  --ds-header-menu-danger: var(--ds-danger);
  --ds-header-menu-active-shadow: #0008;
  --ds-header-search-surface: var(--ds-app-surface);
  --ds-header-search-border: var(--ds-button-border);
  --ds-header-search-text: var(--ds-text);
  --ds-header-search-muted: var(--ds-muted);
  --ds-header-search-focus-border: var(--ds-selection-border);
  --ds-header-search-focus-ring: color-mix(in srgb,var(--ds-selection-border) 12%,transparent);
  --ds-header-results-surface: var(--ds-app-surface);
  --ds-header-results-border: var(--ds-button-border);
  --ds-header-results-shadow: #0008;
  --ds-header-results-active: var(--ds-selection-surface);
  --ds-header-results-active-text: var(--ds-selection-border);
  --ds-header-results-meta: var(--ds-muted);
}

:root[data-theme="light"] {
  color-scheme: light !important;
}

:root {
  --ds-designer-dialog-backdrop: #1d203044;
  --ds-designer-dialog-shadow: #16192338;
  --ds-designer-dialog-eyebrow: #8a8d98;
  --ds-designer-dialog-label: #5b5d68;
  --ds-designer-dialog-heading: #31323b;
  --ds-designer-dialog-input-text: #373944;
  --ds-designer-dialog-list-border: #e3e4ea;
  --ds-designer-dialog-list-text: #4e505b;
  --ds-designer-page-current-surface: #f6f9ff;
  --ds-designer-page-current-border: #dfe4ee;
  --ds-designer-page-preview: #dce8fd;
  --ds-designer-page-preview-border: #536071;
  --ds-designer-page-next-preview: #d7e5ff;
  --ds-designer-page-arrow: #4778cf;
  --ds-designer-primary: #2d67de;
}

:root[data-theme="dark"] {
  --ds-designer-dialog-backdrop: #08090dcc;
  --ds-designer-dialog-shadow: #0009;
  --ds-designer-dialog-eyebrow: var(--ds-muted);
  --ds-designer-dialog-label: var(--ds-text);
  --ds-designer-dialog-heading: var(--ds-text);
  --ds-designer-dialog-input-text: var(--ds-text);
  --ds-designer-dialog-list-border: var(--ds-button-border);
  --ds-designer-dialog-list-text: var(--ds-text);
  --ds-designer-page-current-surface: var(--ds-app-surface-subtle);
  --ds-designer-page-current-border: var(--ds-button-border);
  --ds-designer-page-preview: var(--ds-selection-surface);
  --ds-designer-page-preview-border: var(--ds-muted);
  --ds-designer-page-next-preview: var(--ds-selection-surface);
  --ds-designer-page-arrow: var(--ds-selection-border);
  --ds-designer-primary: #2d67de;
}

:root {
  --ds-designer-layers-surface: var(--ds-app-surface);
  --ds-designer-layers-border: #e1e2e8;
  --ds-designer-layers-heading: #7d7e89;
  --ds-designer-layer-text: #50515d;
  --ds-designer-layer-icon: #747784;
  --ds-designer-layer-selected: var(--ds-selection-surface);
  --ds-designer-layer-group-text: #555762;
  --ds-designer-layer-group-hover: #f7f9fc;
  --ds-designer-layer-group-active: #2867db;
  --ds-designer-layer-action: #8a8d99;
  --ds-designer-layer-action-hover: #eaf2ff;
  --ds-designer-layer-popover-shadow: #25252a20;
  --ds-designer-layer-popover-hover: #f3f5f9;
  --ds-designer-layer-danger-hover: #fff2f0;
  --ds-designer-mask-source: #5a39c9;
  --ds-designer-mask-target: #5572a8;
}

:root[data-theme="dark"] {
  --ds-designer-layers-border: var(--ds-button-border);
  --ds-designer-layers-heading: var(--ds-muted);
  --ds-designer-layer-text: var(--ds-text);
  --ds-designer-layer-icon: var(--ds-muted);
  --ds-designer-layer-selected: var(--ds-selection-surface);
  --ds-designer-layer-group-text: var(--ds-text);
  --ds-designer-layer-group-hover: var(--ds-button-hover);
  --ds-designer-layer-group-active: var(--ds-selection-border);
  --ds-designer-layer-action: var(--ds-muted);
  --ds-designer-layer-action-hover: var(--ds-selection-surface);
  --ds-designer-layer-popover-shadow: #0009;
  --ds-designer-layer-popover-hover: var(--ds-button-hover);
  --ds-designer-layer-danger-hover: #452e31;
  --ds-designer-mask-source: #b9a0ff;
  --ds-designer-mask-target: #9cb9ef;
}

:root {
  --ds-inspector-panel-surface: var(--ds-app-surface);
  --ds-inspector-panel-border: #e8e8ed;
  --ds-inspector-label: #6e6e78;
  --ds-inspector-empty: #9999a2;
  --ds-inspector-empty-heading: #55555e;
  --ds-inspector-hint: #85858e;
  --ds-inspector-field-surface: var(--ds-app-surface-subtle);
  --ds-inspector-field-border: var(--ds-inspector-control-border);
  --ds-inspector-field-text: var(--ds-text);
  --ds-inspector-button-surface: var(--ds-app-surface);
  --ds-inspector-button-border: #e1e1e7;
  --ds-inspector-button-text: #62626d;
  --ds-inspector-type-group: #f4f4f6;
  --ds-inspector-type-border: #e1e1e7;
  --ds-inspector-type-text: #73737d;
  --ds-inspector-type-accent: var(--ds-selection-border);
}

:root[data-theme="dark"] {
  --ds-inspector-panel-border: var(--ds-button-border);
  --ds-inspector-label: var(--ds-muted);
  --ds-inspector-empty: var(--ds-muted);
  --ds-inspector-empty-heading: var(--ds-text);
  --ds-inspector-hint: var(--ds-muted);
  --ds-inspector-field-surface: var(--ds-app-surface);
  --ds-inspector-field-border: var(--ds-button-border);
  --ds-inspector-field-text: var(--ds-text);
  --ds-inspector-button-surface: var(--ds-button-surface);
  --ds-inspector-button-border: var(--ds-button-border);
  --ds-inspector-button-text: var(--ds-button-icon);
  --ds-inspector-type-group: var(--ds-app-surface-subtle);
  --ds-inspector-type-border: var(--ds-button-border);
  --ds-inspector-type-text: var(--ds-muted);
  --ds-inspector-type-accent: var(--ds-selection-border);
}

:root {
  --ds-designer-popup-surface: var(--ds-app-surface);
  --ds-designer-popup-border: #dfe2e9;
  --ds-designer-popup-shadow: #20232c2b;
  --ds-designer-popup-text: #4f515d;
  --ds-designer-popup-divider: #e8e9ee;
  --ds-designer-popup-hover: #edf3ff;
  --ds-designer-popup-hover-text: #2867db;
  --ds-designer-popup-danger-hover: #fff1ef;
  --ds-designer-popup-danger: #ba493e;
  --ds-designer-font-menu-surface: var(--ds-app-surface);
  --ds-designer-font-menu-border: #dedfe7;
  --ds-designer-font-menu-shadow: #25262d24;
  --ds-designer-font-menu-text: #353641;
  --ds-designer-font-menu-hover: #eef4ff;
  --ds-designer-font-menu-active: #2867d9;
  --ds-designer-font-control-text: #41424b;
  --ds-designer-font-control-icon: #4c4d58;
}

:root[data-theme="dark"] {
  --ds-designer-popup-surface: var(--ds-app-surface);
  --ds-designer-popup-border: var(--ds-button-border);
  --ds-designer-popup-shadow: #0009;
  --ds-designer-popup-text: var(--ds-text);
  --ds-designer-popup-divider: var(--ds-button-border);
  --ds-designer-popup-hover: var(--ds-selection-surface);
  --ds-designer-popup-hover-text: var(--ds-selection-border);
  --ds-designer-popup-danger-hover: #452e31;
  --ds-designer-popup-danger: var(--ds-danger);
  --ds-designer-font-menu-surface: var(--ds-app-surface);
  --ds-designer-font-menu-border: var(--ds-button-border);
  --ds-designer-font-menu-shadow: #0009;
  --ds-designer-font-menu-text: var(--ds-text);
  --ds-designer-font-menu-hover: var(--ds-selection-surface);
  --ds-designer-font-menu-active: var(--ds-selection-border);
  --ds-designer-font-control-text: var(--ds-text);
  --ds-designer-font-control-icon: var(--ds-muted);
}

:root {
  --ds-designer-toolbar-surface: #fffffff2;
  --ds-designer-toolbar-border: #dedfe6;
  --ds-designer-toolbar-shadow: #24263114;
  --ds-designer-toolbar-text: #53545e;
  --ds-designer-toolbar-muted: #767782;
  --ds-designer-toolbar-hover: #edf3ff;
  --ds-designer-toolbar-hover-text: #2468e9;
  --ds-designer-toolbar-divider: #e5e5ea;
  --ds-designer-toolbar-field-border: #e0e1e7;
  --ds-designer-toolbar-field-text: #44454e;
  --ds-designer-selection-toolbar-surface: #fff;
  --ds-designer-selection-toolbar-border: #e0e1e7;
  --ds-designer-selection-toolbar-shadow: #20222b18;
  --ds-designer-selection-toolbar-text: #4e4f59;
  --ds-designer-selection-toolbar-divider: #e7e8ed;
  --ds-designer-selection-toolbar-hover: #f2f6ff;
  --ds-designer-selection-toolbar-hover-text: #2769e3;
  --ds-designer-selection-toolbar-muted: #8a8b96;
}

:root[data-theme="dark"] {
  --ds-designer-toolbar-surface: var(--ds-app-surface);
  --ds-designer-toolbar-border: var(--ds-button-border);
  --ds-designer-toolbar-shadow: #0009;
  --ds-designer-toolbar-text: var(--ds-text);
  --ds-designer-toolbar-muted: var(--ds-muted);
  --ds-designer-toolbar-hover: var(--ds-button-hover);
  --ds-designer-toolbar-hover-text: var(--ds-selection-border);
  --ds-designer-toolbar-divider: var(--ds-button-border);
  --ds-designer-toolbar-field-border: var(--ds-field-border);
  --ds-designer-toolbar-field-text: var(--ds-text);
  --ds-designer-selection-toolbar-surface: var(--ds-app-surface);
  --ds-designer-selection-toolbar-border: var(--ds-button-border);
  --ds-designer-selection-toolbar-shadow: #0009;
  --ds-designer-selection-toolbar-text: var(--ds-text);
  --ds-designer-selection-toolbar-divider: var(--ds-button-border);
  --ds-designer-selection-toolbar-hover: var(--ds-button-hover);
  --ds-designer-selection-toolbar-hover-text: var(--ds-selection-border);
  --ds-designer-selection-toolbar-muted: var(--ds-muted);
}

:root {
  --ds-designer-header-surface: #fffffff2;
  --ds-designer-header-border: #e4e5eb;
  --ds-designer-header-text: #2e3038;
  --ds-designer-header-muted: #80818c;
  --ds-designer-header-button-surface: #fff;
  --ds-designer-header-button-border: #dfe0e7;
  --ds-designer-header-button-text: #5c5d68;
  --ds-designer-header-button-hover: #f3f4f7;
  --ds-designer-header-button-hover-text: #2f313a;
  --ds-designer-header-primary: #2d64ee;
  --ds-designer-header-primary-text: #fff;
  --ds-designer-navigation-surface: #fffffff2;
  --ds-designer-navigation-border: #dedfe6;
  --ds-designer-navigation-shadow: #24263114;
  --ds-designer-navigation-text: #737480;
  --ds-designer-navigation-hover: #e9eef8;
  --ds-designer-navigation-hover-text: #2867d9;
  --ds-designer-navigation-divider: #e5e5ea;
  --ds-designer-controls-surface: #fffffff2;
  --ds-designer-controls-border: #dedfe6;
  --ds-designer-controls-shadow: #24263124;
  --ds-designer-controls-text: #565762;
  --ds-designer-controls-muted: #474852;
  --ds-designer-controls-hover: #edf3ff;
  --ds-designer-controls-hover-text: #2468e9;
  --ds-designer-controls-divider: #e5e5ea;
  --ds-designer-controls-action-surface: #fff;
  --ds-designer-controls-action-border: #dfe1e8;
}

:root[data-theme="dark"] {
  --ds-designer-header-surface: var(--ds-app-surface);
  --ds-designer-header-border: var(--ds-button-border);
  --ds-designer-header-text: var(--ds-text);
  --ds-designer-header-muted: var(--ds-muted);
  --ds-designer-header-button-surface: var(--ds-button-surface);
  --ds-designer-header-button-border: var(--ds-button-border);
  --ds-designer-header-button-text: var(--ds-button-icon);
  --ds-designer-header-button-hover: var(--ds-button-hover);
  --ds-designer-header-button-hover-text: var(--ds-text);
  --ds-designer-header-primary: var(--ds-selection-border);
  --ds-designer-header-primary-text: var(--ds-app-surface);
  --ds-designer-navigation-surface: var(--ds-app-surface);
  --ds-designer-navigation-border: var(--ds-button-border);
  --ds-designer-navigation-shadow: #0009;
  --ds-designer-navigation-text: var(--ds-muted);
  --ds-designer-navigation-hover: var(--ds-selection-surface);
  --ds-designer-navigation-hover-text: var(--ds-selection-border);
  --ds-designer-navigation-divider: var(--ds-button-border);
  --ds-designer-controls-surface: var(--ds-app-surface);
  --ds-designer-controls-border: var(--ds-button-border);
  --ds-designer-controls-shadow: #0009;
  --ds-designer-controls-text: var(--ds-button-icon);
  --ds-designer-controls-muted: var(--ds-text);
  --ds-designer-controls-hover: var(--ds-button-hover);
  --ds-designer-controls-hover-text: var(--ds-selection-border);
  --ds-designer-controls-divider: var(--ds-button-border);
  --ds-designer-controls-action-surface: var(--ds-button-surface);
  --ds-designer-controls-action-border: var(--ds-button-border);
}

:root {
  --ds-designer-sidebar-surface: #fff;
  --ds-designer-sidebar-border: #e1e2e8;
  --ds-designer-rail-surface: #fafafd;
  --ds-designer-rail-divider: #ebebef;
  --ds-designer-rail-text: #777884;
  --ds-designer-rail-hover: #f0f5ff;
  --ds-designer-rail-hover-text: #2768dd;
  --ds-designer-panel-surface: #fff;
  --ds-designer-panel-text: #383943;
  --ds-designer-panel-muted: #9394a0;
  --ds-designer-panel-empty: #81828d;
  --ds-designer-panel-empty-icon: #a0a2ad;
  --ds-designer-panel-button-surface: #fff;
  --ds-designer-panel-button-border: #e1e2e8;
  --ds-designer-panel-button-text: #93949d;
  --ds-designer-panel-button-hover: #f8f9fc;
  --ds-designer-asset-divider: #eaebf0;
  --ds-designer-asset-heading: #555764;
  --ds-designer-asset-text: #535560;
  --ds-designer-asset-muted: #8a8c97;
  --ds-designer-asset-field-surface: #fff;
  --ds-designer-asset-field-border: #dee0e7;
  --ds-designer-asset-field-text: #41434e;
  --ds-designer-asset-card-surface: #fff;
  --ds-designer-asset-card-border: #e2e3e9;
  --ds-designer-asset-card-text: #535560;
  --ds-designer-asset-card-hover: #f5f9ff;
  --ds-designer-asset-action: #2d67de;
  --ds-designer-asset-action-text: #fff;
  --ds-designer-asset-preview-surface: #f0f1f4;
  --ds-designer-asset-error: #b54b42;
  --ds-designer-text-action-surface: #fff;
  --ds-designer-text-action-border: #e1e2e9;
  --ds-designer-text-action-text: #34353d;
  --ds-designer-text-action-muted: #888995;
  --ds-designer-text-action-hover: #f7faff;
  --ds-designer-text-action-hover-border: #9dbaf5;
  --ds-designer-template-surface: #fff;
  --ds-designer-template-border: #e0e2e9;
  --ds-designer-template-text: #4d4e59;
  --ds-designer-template-muted: #898a95;
  --ds-designer-template-icon: #757783;
  --ds-designer-template-card-text: #50515c;
  --ds-designer-template-card-hover: #f6f9ff;
  --ds-designer-template-card-hover-border: #80a9f1;
  --ds-designer-template-card-hover-text: #2867d9;
  --ds-designer-template-preview: #eceef3;
}

:root[data-theme="dark"] {
  --ds-designer-sidebar-surface: var(--ds-app-surface);
  --ds-designer-sidebar-border: var(--ds-button-border);
  --ds-designer-rail-surface: var(--ds-app-surface-subtle);
  --ds-designer-rail-divider: var(--ds-button-border);
  --ds-designer-rail-text: var(--ds-muted);
  --ds-designer-rail-hover: var(--ds-selection-surface);
  --ds-designer-rail-hover-text: var(--ds-selection-border);
  --ds-designer-panel-surface: var(--ds-app-surface);
  --ds-designer-panel-text: var(--ds-text);
  --ds-designer-panel-muted: var(--ds-muted);
  --ds-designer-panel-empty: var(--ds-muted);
  --ds-designer-panel-empty-icon: var(--ds-button-icon);
  --ds-designer-panel-button-surface: var(--ds-button-surface);
  --ds-designer-panel-button-border: var(--ds-button-border);
  --ds-designer-panel-button-text: var(--ds-muted);
  --ds-designer-panel-button-hover: var(--ds-button-hover);
  --ds-designer-asset-divider: var(--ds-button-border);
  --ds-designer-asset-heading: var(--ds-text);
  --ds-designer-asset-text: var(--ds-text);
  --ds-designer-asset-muted: var(--ds-muted);
  --ds-designer-asset-field-surface: var(--ds-field-surface);
  --ds-designer-asset-field-border: var(--ds-field-border);
  --ds-designer-asset-field-text: var(--ds-text);
  --ds-designer-asset-card-surface: var(--ds-button-surface);
  --ds-designer-asset-card-border: var(--ds-button-border);
  --ds-designer-asset-card-text: var(--ds-text);
  --ds-designer-asset-card-hover: var(--ds-button-hover);
  --ds-designer-asset-action: var(--ds-selection-border);
  --ds-designer-asset-action-text: var(--ds-app-surface);
  --ds-designer-asset-preview-surface: var(--ds-app-surface-subtle);
  --ds-designer-asset-error: var(--ds-danger);
  --ds-designer-text-action-surface: var(--ds-button-surface);
  --ds-designer-text-action-border: var(--ds-button-border);
  --ds-designer-text-action-text: var(--ds-text);
  --ds-designer-text-action-muted: var(--ds-muted);
  --ds-designer-text-action-hover: var(--ds-selection-surface);
  --ds-designer-text-action-hover-border: var(--ds-selection-border);
  --ds-designer-template-surface: var(--ds-app-surface);
  --ds-designer-template-border: var(--ds-button-border);
  --ds-designer-template-text: var(--ds-text);
  --ds-designer-template-muted: var(--ds-muted);
  --ds-designer-template-icon: var(--ds-muted);
  --ds-designer-template-card-text: var(--ds-text);
  --ds-designer-template-card-hover: var(--ds-selection-surface);
  --ds-designer-template-card-hover-border: var(--ds-selection-border);
  --ds-designer-template-card-hover-text: var(--ds-selection-border);
  --ds-designer-template-preview: var(--ds-app-surface-subtle);
}

:root {
  --ds-figma-node-surface: #fdfdfd;
  --ds-figma-node-tertiary-body-surface: #fdfdfd;
  --ds-figma-condition-body-surface: #fdfdfd;
  --ds-figma-node-body-surface: #fdfdfd;
  --ds-figma-tooltip-surface: #fdfdfd;
  --ds-figma-overlay-border: #00000015;
  --ds-figma-tooltip-border: var(--ds-figma-overlay-border);
  --ds-figma-node-orient-body-surface: #fdfdfd;
  --ds-figma-node-correction-body-surface: #fdfdfd;
  --ds-figma-node-levels-body-surface: #fdfdfd;
  --ds-figma-node-blur-body-surface: #fdfdfd;
  --ds-figma-node-invert-body-surface: #fdfdfd;
  --ds-figma-node-resize-body-surface: #fdfdfd;
  --ds-figma-node-crop-body-surface: #fdfdfd;
  --ds-figma-seed-field-surface: #00000004;
  --ds-figma-seed-field-border: #00000025;
  --ds-figma-array-field-surface: #00000004;
  --ds-figma-array-field-border: #00000025;
  --ds-figma-array-add-border: #d14100bf;
  --ds-figma-node-primary-action-surface: #ff5100;
  --ds-figma-node-primary-action-border: #d14100bf;
  --ds-figma-node-primary-action-foreground: #fdfdfd;
  --ds-figma-node-button-surface: #fdfdfd;
  --ds-figma-node-field-surface: #00000004;
  --ds-figma-node-field-border: #00000025;
  --ds-figma-reel-tabs-border: #00000015;
  --ds-figma-node-field-placeholder: #c7c7c7;
  --ds-figma-list-placeholder: #505050;
  --ds-figma-node-text: #171717;
  --ds-figma-node-muted: #777781;
  --ds-figma-node-port-border: #6f6f6f;
  --ds-figma-node-body-border: #a0a0a0;
  --ds-figma-filter-table-port-border: #6f6f6f;
  --ds-figma-summary-table-port-border: #6f6f6f;
  --ds-figma-compare-port-border: #6f6f6f;
  --ds-figma-router-port-border: #6f6f6f;
  --ds-figma-switch-port-border: #6f6f6f;
  --ds-figma-node-port-surface: #ffffff;
  --ds-figma-node-port-fill: #62626d;
  --ds-figma-node-port-label: #464646;
  --ds-figma-node-slider-track: rgba(0, 0, 0, 0.05);
  --ds-figma-node-slider-range: #ff5100;
  --ds-designer-shell-surface: #f7f7f9;
  --ds-designer-workspace-surface: #f5f5f7;
  --ds-designer-workspace-dot: #dcdee6;
}

:root[data-theme="dark"] {
  --ds-figma-node-surface: #131413;
  --ds-figma-node-tertiary-body-surface: #222322;
  --ds-figma-post-it-header-text: #edefee;
  --ds-figma-condition-body-surface: #222322;
  --ds-figma-node-body-surface: #222322;
  --ds-figma-tooltip-surface: #f0f0f011;
  --ds-figma-logic-tooltip-surface: #222322;
  --ds-figma-overlay-border: #f2f2f213;
  --ds-figma-tooltip-border: var(--ds-figma-overlay-border);
  --ds-figma-router-tooltip-surface: #0000000e;
  --ds-figma-node-orient-body-surface: #222322;
  --ds-figma-node-correction-body-surface: #222322;
  --ds-figma-node-levels-body-surface: #222322;
  --ds-figma-node-blur-body-surface: #222322;
  --ds-figma-node-invert-body-surface: #222322;
  --ds-figma-node-resize-body-surface: #222322;
  --ds-figma-node-crop-body-surface: #222322;
  --ds-figma-seed-field-surface: #0000001f;
  --ds-figma-seed-field-border: #f0f0f022;
  --ds-figma-array-field-surface: #0000001f;
  --ds-figma-array-field-border: #f0f0f022;
  --ds-figma-array-add-border: #9e32004d;
  --ds-figma-node-primary-action-surface: #9e3200;
  --ds-figma-node-primary-action-border: #9e32004d;
  --ds-figma-node-primary-action-foreground: #fbebe4;
  --ds-figma-node-button-surface: #181a19;
  --ds-figma-node-field-surface: #0000001f;
  --ds-figma-node-field-border: #f0f0f022;
  --ds-figma-reel-tabs-border: #f2f2f213;
  --ds-figma-node-field-placeholder: #989a99;
  --ds-figma-list-placeholder: #989a99;
  --ds-figma-node-text: #edefee;
  --ds-figma-node-muted: #a9acb9;
  --ds-figma-node-port-border: #6f6f6f;
  --ds-figma-node-body-border: #a0a0a0;
  --ds-figma-filter-table-port-border: #a0a0a0;
  --ds-figma-summary-table-port-border: #a0a0a0;
  --ds-figma-compare-port-border: #a0a0a0;
  --ds-figma-router-port-border: #a0a0a0;
  --ds-figma-switch-port-border: #a0a0a0;
  --ds-figma-node-port-surface: #1b1d1c;
  --ds-figma-node-port-fill: #bcbebc;
  --ds-figma-node-port-label: #bcbebc;
  --ds-figma-node-slider-track: rgba(240, 240, 240, 0.07);
  --ds-figma-node-slider-range: #ff5100;
  --ds-designer-shell-surface: var(--ds-app-surface-subtle);
  --ds-designer-workspace-surface: var(--ds-app-surface-subtle);
  --ds-designer-workspace-dot: #4a4c58;
}