/* ── Organizer Themes ─────────────────────────────────────
 * Each theme block defines the full set of CSS variables.
 * `:root` = Light (default). `[data-theme="light"]` = explicit Light.
 * `[data-theme="dark"]` = generic dark alias.
 * Named themes (dracula, nord, etc.) work via their own selectors.
 * Variable aliases at the bottom map app.css & component vars.
 * ────────────────────────────────────────────────────────── */

/* ── Light (default) ───────────────────────────────────── */
:root,
:root[data-theme="light"] {
    --theme-name: Light;
    color-scheme: light;

    /* Layout */
    --header-height: 44px;
    --header-min-height: 2rem;
    --sidebar-width: 228px;
    --sidebar-width-compact: min(84vw, 20rem);
    --tab-height: 40px;
    --ai-w: 340px;
    --safe-area-top: env(safe-area-inset-top, 0px);
    --safe-area-right: env(safe-area-inset-right, 0px);
    --safe-area-bottom: env(safe-area-inset-bottom, 0px);
    --safe-area-left: env(safe-area-inset-left, 0px);
    --overlay-gap: 12px;
    --panel-padding: clamp(0.5rem, 1.5vw, 1rem);

    /* Surfaces & text */
    --bg: #f1f3f7;
    --bg-canvas: #e9ecf2;
    --bg-sidebar: #f7f8fb;
    --bg-elev: #ffffff;
    --bg-elev-strong: #f0f2f7;
    --bg-muted: #e2e6ed;
    --text: #1c2333;
    --text-strong: #0d1117;
    --text-muted: #5e6b80;
    --accent: #2563eb;
    --accent-contrast: #ffffff;
    --accent-soft: rgba(37, 99, 235, 0.08);
    --accent-border: rgba(37, 99, 235, 0.25);
    --hover-bg: rgba(37, 99, 235, 0.06);
    --active-bg: rgba(37, 99, 235, 0.12);
    --overlay: transparent;
    --danger: #dc2626;
    --danger-soft: #fef2f2;
    --success-soft: #f0fdf4;
    --success: #16a34a;
    --warning: #d97706;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1), 0 1px 4px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
    --border-color: #c8cdd8;
    --border-strong: #9da5b4;

    /* Component-specific */
    --board-col-bg: #edf0f7;
    --board-card-bg: #ffffff;
    --board-card-border: #c0c9d8;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
    --calendar-surface: var(--bg);

    /* Badges */
    --badge-folder-text: #92400e;
    --badge-folder-bg: #fef3c7;
    --badge-folder-border: #fcd34d;
    --badge-text-text: #1e40af;
    --badge-text-bg: #dbeafe;
    --badge-text-border: #93c5fd;
    --badge-board-text: #6d28d9;
    --badge-board-bg: #ede9fe;
    --badge-board-border: #a78bfa;
    --badge-calendar-text: #0f766e;
    --badge-calendar-bg: #ccfbf1;
    --badge-calendar-border: #5eead4;
    --badge-spreadsheet-text: #9a3412;
    --badge-spreadsheet-bg: #ffedd5;
    --badge-spreadsheet-border: #fdba74;

    /* Syntax highlighting */
    --syntax-plain: #24292e;
    --syntax-bg: #ffffff;
    --syntax-keyword: #d73a49;
    --syntax-string: #032f62;
    --syntax-number: #005cc5;
    --syntax-constant: #005cc5;
    --syntax-comment: #6a737d;
    --syntax-builtin: #e36209;
    --syntax-entity: #6f42c1;
    --syntax-tag: #22863a;
    --syntax-section: #005cc5;
    --syntax-bullet: #735c0f;
    --syntax-link: #7f8c8d;
    --syntax-error: #d73a49;
    --syntax-meta: #555;
    --syntax-hr: #999;
    --syntax-bracket: #997;
    --syntax-qualifier: #555;
    --syntax-addition: #22863a;
    --syntax-addition-bg: #f0fff4;
    --syntax-deletion: #b31d28;
    --syntax-deletion-bg: #ffeef0;
    --syntax-selection: #add6ff;
    --caret-color: #1c2333;
}

/* ── Light Orange ──────────────────────────────────────── */
:root[data-theme="light-orange"] {
    --theme-name: Light Orange;
    color-scheme: light;

    --border-color: #ddd6cc;
    --border-strong: #c4bab0;
    --bg: #fcf7f0;
    --bg-canvas: #f8f0e6;
    --bg-sidebar: var(--bg);
    --bg-elev: #ffffff;
    --bg-elev-strong: #faf3ea;
    --bg-muted: #ece4d9;
    --text: #2d2a27;
    --text-strong: #1a1815;
    --text-muted: #8a8278;
    --accent: #f59e0b;
    --accent-contrast: #ffffff;
    --accent-soft: rgba(245, 158, 11, 0.1);
    --accent-border: rgba(245, 158, 11, 0.25);
    --hover-bg: rgba(245, 158, 11, 0.07);
    --active-bg: rgba(245, 158, 11, 0.14);
    --overlay: transparent;
    --danger: #dc2626;
    --danger-soft: #fef2f2;
    --success-soft: #f0fdf4;
    --success: #16a34a;
    --warning: #d97706;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08), 0 1px 4px rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.06);
    --board-col-bg: #f5eee5;
    --board-card-bg: #ffffff;
    --board-card-border: #ddd6cc;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    --calendar-surface: var(--bg);
    --badge-folder-text: #92400e;
    --badge-folder-bg: #fef3c7;
    --badge-folder-border: #fcd34d;
    --badge-text-text: #1e40af;
    --badge-text-bg: #dbeafe;
    --badge-text-border: #93c5fd;
    --badge-board-text: #6d28d9;
    --badge-board-bg: #ede9fe;
    --badge-board-border: #a78bfa;
    --badge-calendar-text: #0f766e;
    --badge-calendar-bg: #ccfbf1;
    --badge-calendar-border: #5eead4;
    --badge-spreadsheet-text: #9a3412;
    --badge-spreadsheet-bg: #ffedd5;
    --badge-spreadsheet-border: #fdba74;
    --syntax-plain: #24292e;
    --syntax-bg: #faf3ea;
    --syntax-keyword: #d73a49;
    --syntax-string: #b8860b;
    --syntax-number: #005cc5;
    --syntax-constant: #005cc5;
    --syntax-comment: #8a8278;
    --syntax-builtin: #c96b0d;
    --syntax-entity: #6f42c1;
    --syntax-tag: #b8860b;
    --syntax-section: #005cc5;
    --syntax-bullet: #b8860b;
    --syntax-link: #8a8278;
    --syntax-error: #dc2626;
    --syntax-meta: #8a8278;
    --syntax-hr: #8a8278;
    --syntax-bracket: #8a8278;
    --syntax-qualifier: #8a8278;
    --syntax-addition: #22863a;
    --syntax-addition-bg: #f0fff4;
    --syntax-deletion: #b31d28;
    --syntax-deletion-bg: #ffeef0;
    --syntax-selection: #ffe7b3;
    --caret-color: #2d2a27;
}

/* ── Dark (generic) ────────────────────────────────────── */
:root[data-theme="dark"] {
    --theme-name: Dark;
    color-scheme: dark;
    --syntax-selection: #264f78;
    --caret-color: #c9d1d9;

    --border-color: #2a2e33;
    --border-strong: #3a4050;
    --bg: #1a2125;
    --bg-canvas: #151c20;
    --bg-sidebar: var(--bg);
    --bg-elev: #1f282e;
    --bg-elev-strong: #252e35;
    --bg-muted: #222b30;
    --text: #c9d1d9;
    --text-strong: #e5ecf5;
    --text-muted: #6b7280;
    --accent: #8fbc8f;
    --accent-contrast: #1a2125;
    --accent-soft: rgba(143, 188, 143, 0.15);
    --accent-border: rgba(143, 188, 143, 0.3);
    --hover-bg: #2d3540;
    --active-bg: #3a4a55;
    --overlay: transparent;
    --danger: #c78a7a;
    --danger-soft: rgba(199, 138, 122, 0.15);
    --success-soft: rgba(143, 188, 143, 0.15);
    --success: #6bbf6b;
    --warning: #e2b714;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #1c252b;
    --board-card-bg: #1f282e;
    --board-card-border: #2a2e33;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);

    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);

    --syntax-plain: #c9d1d9;
    --syntax-bg: #1a2125;
    --syntax-keyword: #f39c12;
    --syntax-string: #4ecdc4;
    --syntax-number: #8fbc8f;
    --syntax-constant: #8fbc8f;
    --syntax-comment: #6b7280;
    --syntax-builtin: #c78a7a;
    --syntax-entity: #9b59b6;
    --syntax-tag: #f39c12;
    --syntax-section: #4ecdc4;
    --syntax-bullet: #f39c12;
    --syntax-link: #4ecdc4;
    --syntax-error: #c78a7a;
    --syntax-meta: #6b7280;
    --syntax-hr: #6b7280;
    --syntax-bracket: #6b7280;
    --syntax-qualifier: #6b7280;
    --syntax-addition: #8fbc8f;
    --syntax-addition-bg: rgba(143, 188, 143, 0.15);
    --syntax-deletion: #c78a7a;
    --syntax-deletion-bg: rgba(199, 138, 122, 0.15);
}

/* ── Nord Light ────────────────────────────────────────── */
:root[data-theme="nord-light"] {
    --theme-name: Nord Light;
    color-scheme: light;
    --border-color: #cbd3e2;
    --border-strong: #b0bccf;
    --bg: #eceff4;
    --bg-canvas: #e5e9f0;
    --bg-sidebar: #f2f5f9;
    --bg-elev: #ffffff;
    --bg-elev-strong: #f0f3f8;
    --bg-muted: #d8dee9;
    --text: #2e3440;
    --text-strong: #1a1d25;
    --text-muted: #7987a3;
    --accent: #5e81ac;
    --accent-contrast: #ffffff;
    --accent-soft: rgba(94, 129, 172, 0.1);
    --accent-border: rgba(94, 129, 172, 0.25);
    --hover-bg: #d8dee9;
    --active-bg: #c0cbd8;
    --overlay: transparent;
    --danger: #bf616a;
    --danger-soft: #fdf3f3;
    --success-soft: #f4f9f2;
    --success: #5eac7a;
    --warning: #d08770;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
    --board-col-bg: #e5e9f0;
    --board-card-bg: #ffffff;
    --board-card-border: #cbd3e2;
    --board-shadow: 0 2px 6px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.05);
    --calendar-surface: var(--bg);
    --badge-folder-text: #92400e;
    --badge-folder-bg: #fef3c7;
    --badge-folder-border: #fcd34d;
    --badge-text-text: #1e40af;
    --badge-text-bg: #dbeafe;
    --badge-text-border: #93c5fd;
    --badge-board-text: #6d28d9;
    --badge-board-bg: #ede9fe;
    --badge-board-border: #a78bfa;
    --badge-calendar-text: #0f766e;
    --badge-calendar-bg: #ccfbf1;
    --badge-calendar-border: #5eead4;
    --badge-spreadsheet-text: #9a3412;
    --badge-spreadsheet-bg: #ffedd5;
    --badge-spreadsheet-border: #fdba74;
    --syntax-plain: #2e3440;
    --syntax-bg: #ffffff;
    --syntax-keyword: #81a1c1;
    --syntax-string: #a3be8c;
    --syntax-number: #b48ead;
    --syntax-constant: #b48ead;
    --syntax-comment: #7b88a1;
    --syntax-builtin: #d08770;
    --syntax-entity: #b48ead;
    --syntax-tag: #81a1c1;
    --syntax-section: #88c0d0;
    --syntax-bullet: #d08770;
    --syntax-link: #a3be8c;
    --syntax-error: #bf616a;
    --syntax-meta: #7b88a1;
    --syntax-hr: #7b88a1;
    --syntax-bracket: #7b88a1;
    --syntax-qualifier: #7b88a1;
    --syntax-addition: #a3be8c;
    --syntax-addition-bg: #f4f9f2;
    --syntax-deletion: #bf616a;
    --syntax-deletion-bg: #fdf3f3;
    --syntax-selection: #b3d7ff;
    --caret-color: #2e3440;
}

/* ── Forest Night ──────────────────────────────────────── */
:root[data-theme="forest-night"] {
    --theme-name: Forest Night;
    color-scheme: dark;
    --syntax-selection: #264f78;
    --caret-color: #c9d1d9;
    --border-color: #2a2e33;
    --border-strong: #3a4050;
    --bg: #1a2125;
    --bg-canvas: #151c20;
    --bg-sidebar: var(--bg);
    --bg-elev: #1f282e;
    --bg-elev-strong: #252e35;
    --bg-muted: #222b30;
    --text: #c9d1d9;
    --text-strong: #e5ecf5;
    --text-muted: #6b7280;
    --accent: #8fbc8f;
    --accent-contrast: #1a2125;
    --accent-soft: rgba(143, 188, 143, 0.15);
    --accent-border: rgba(143, 188, 143, 0.3);
    --hover-bg: #2d3540;
    --active-bg: #3a4a55;
    --overlay: transparent;
    --danger: #c78a7a;
    --danger-soft: rgba(199, 138, 122, 0.15);
    --success-soft: rgba(143, 188, 143, 0.15);
    --success: #6bbf6b;
    --warning: #e2b714;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #1c252b;
    --board-card-bg: #1f282e;
    --board-card-border: #2a2e33;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #c9d1d9;
    --syntax-bg: #1a2125;
    --syntax-keyword: #f39c12;
    --syntax-string: #4ecdc4;
    --syntax-number: #8fbc8f;
    --syntax-constant: #8fbc8f;
    --syntax-comment: #6b7280;
    --syntax-builtin: #c78a7a;
    --syntax-entity: #9b59b6;
    --syntax-tag: #f39c12;
    --syntax-section: #4ecdc4;
    --syntax-bullet: #f39c12;
    --syntax-link: #4ecdc4;
    --syntax-error: #c78a7a;
    --syntax-meta: #6b7280;
    --syntax-hr: #6b7280;
    --syntax-bracket: #6b7280;
    --syntax-qualifier: #6b7280;
    --syntax-addition: #8fbc8f;
    --syntax-addition-bg: rgba(143, 188, 143, 0.15);
    --syntax-deletion: #c78a7a;
    --syntax-deletion-bg: rgba(199, 138, 122, 0.15);
}

/* ── Darcula ──────────────────────────────────────────── */
:root[data-theme="darcula"] {
    --theme-name: Darcula;
    color-scheme: dark;
    --border-color: #4e5256;
    --border-strong: #5b5f63;
    --bg: #2b2b2b;
    --bg-canvas: #232323;
    --bg-sidebar: var(--bg);
    --bg-elev: #313335;
    --bg-elev-strong: #3c3f41;
    --bg-muted: #35373a;
    --text: #a9b7c6;
    --text-strong: #d8dce0;
    --text-muted: #6e7b85;
    --accent: #6897bb;
    --accent-contrast: #2b2b2b;
    --accent-soft: rgba(104, 151, 187, 0.15);
    --accent-border: rgba(104, 151, 187, 0.3);
    --hover-bg: #3a4045;
    --active-bg: #4a5058;
    --overlay: transparent;
    --danger: #cc6666;
    --danger-soft: rgba(204, 102, 102, 0.15);
    --success-soft: rgba(104, 151, 187, 0.15);
    --success: #5f9b7a;
    --warning: #d6a34e;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #2f2f2f;
    --board-card-bg: #313335;
    --board-card-border: #4e5256;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #a9b7c6;
    --syntax-bg: #2b2b2b;
    --syntax-keyword: #cc7832;
    --syntax-string: #6a8759;
    --syntax-number: #6897bb;
    --syntax-constant: #6897bb;
    --syntax-comment: #808080;
    --syntax-builtin: #ffc66d;
    --syntax-entity: #c77dbb;
    --syntax-tag: #cc7832;
    --syntax-section: #6897bb;
    --syntax-bullet: #cc7832;
    --syntax-link: #6a8759;
    --syntax-error: #cc6666;
    --syntax-meta: #808080;
    --syntax-hr: #808080;
    --syntax-bracket: #808080;
    --syntax-qualifier: #808080;
    --syntax-addition: #6a8759;
    --syntax-addition-bg: rgba(106, 135, 89, 0.15);
    --syntax-deletion: #cc6666;
    --syntax-deletion-bg: rgba(204, 102, 102, 0.15);
    --syntax-selection: #3a5055;
    --caret-color: #a9b7c6;
}

/* ── Dracula ──────────────────────────────────────────── */
:root[data-theme="dracula"] {
    --theme-name: Dracula;
    color-scheme: dark;
    --border-color: #414458;
    --border-strong: #555770;
    --bg: #282a36;
    --bg-canvas: #21222c;
    --bg-sidebar: var(--bg);
    --bg-elev: #2c2e3e;
    --bg-elev-strong: #343746;
    --bg-muted: #2f3142;
    --text: #f8f8f2;
    --text-strong: #ffffff;
    --text-muted: #6272a4;
    --accent: #bd93f9;
    --accent-contrast: #282a36;
    --accent-soft: rgba(189, 147, 249, 0.15);
    --accent-border: rgba(189, 147, 249, 0.3);
    --hover-bg: #3a3d52;
    --active-bg: #44475a;
    --overlay: transparent;
    --danger: #ff5555;
    --danger-soft: rgba(255, 85, 85, 0.15);
    --success-soft: rgba(80, 250, 123, 0.15);
    --success: #50fa7b;
    --warning: #ffb86c;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #242637;
    --board-card-bg: #2c2e3e;
    --board-card-border: #414458;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #f8f8f2;
    --syntax-bg: #282a36;
    --syntax-keyword: #ff79c6;
    --syntax-string: #f1fa8c;
    --syntax-number: #bd93f9;
    --syntax-constant: #bd93f9;
    --syntax-comment: #6272a4;
    --syntax-builtin: #50fa7b;
    --syntax-entity: #ff79c6;
    --syntax-tag: #ff79c6;
    --syntax-section: #50fa7b;
    --syntax-bullet: #ff79c6;
    --syntax-link: #f1fa8c;
    --syntax-error: #ff5555;
    --syntax-meta: #6272a4;
    --syntax-hr: #6272a4;
    --syntax-bracket: #6272a4;
    --syntax-qualifier: #6272a4;
    --syntax-addition: #50fa7b;
    --syntax-addition-bg: rgba(80, 250, 123, 0.15);
    --syntax-deletion: #ff5555;
    --syntax-deletion-bg: rgba(255, 85, 85, 0.15);
    --syntax-selection: #44475a;
    --caret-color: #f8f8f2;
}

/* ── Nord ──────────────────────────────────────────────── */
:root[data-theme="nord"] {
    --theme-name: Nord;
    color-scheme: dark;
    --border-color: #3b4252;
    --border-strong: #434c5e;
    --bg: #2e3440;
    --bg-canvas: #242933;
    --bg-sidebar: var(--bg);
    --bg-elev: #3b4252;
    --bg-elev-strong: #434c5e;
    --bg-muted: #363c49;
    --text: #d8dee9;
    --text-strong: #e5e9f0;
    --text-muted: #81a1c1;
    --accent: #88c0d0;
    --accent-contrast: #2e3440;
    --accent-soft: rgba(136, 192, 208, 0.15);
    --accent-border: rgba(136, 192, 208, 0.3);
    --hover-bg: #3b494f;
    --active-bg: #434c5e;
    --overlay: transparent;
    --danger: #bf616a;
    --danger-soft: rgba(191, 97, 106, 0.15);
    --success-soft: rgba(163, 190, 140, 0.15);
    --success: #a3be8c;
    --warning: #d08770;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #2f3646;
    --board-card-bg: #3b4252;
    --board-card-border: #434c5e;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #d8dee9;
    --syntax-bg: #2e3440;
    --syntax-keyword: #81a1c1;
    --syntax-string: #a3be8c;
    --syntax-number: #b48ead;
    --syntax-constant: #b48ead;
    --syntax-comment: #616e88;
    --syntax-builtin: #d08770;
    --syntax-entity: #b48ead;
    --syntax-tag: #81a1c1;
    --syntax-section: #88c0d0;
    --syntax-bullet: #d08770;
    --syntax-link: #a3be8c;
    --syntax-error: #bf616a;
    --syntax-meta: #616e88;
    --syntax-hr: #616e88;
    --syntax-bracket: #616e88;
    --syntax-qualifier: #616e88;
    --syntax-addition: #a3be8c;
    --syntax-addition-bg: rgba(163, 190, 140, 0.15);
    --syntax-deletion: #bf616a;
    --syntax-deletion-bg: rgba(191, 97, 106, 0.15);
    --syntax-selection: #3b4252;
    --caret-color: #d8dee9;
}

/* ── Monokai ──────────────────────────────────────────── */
:root[data-theme="monokai"] {
    --theme-name: Monokai;
    color-scheme: dark;
    --border-color: #3e3d32;
    --border-strong: #4a493c;
    --bg: #272822;
    --bg-canvas: #1e1f1c;
    --bg-sidebar: var(--bg);
    --bg-elev: #2d2e2a;
    --bg-elev-strong: #3e3d32;
    --bg-muted: #33342f;
    --text: #f8f8f2;
    --text-strong: #ffffff;
    --text-muted: #75715e;
    --accent: #a6e22e;
    --accent-contrast: #272822;
    --accent-soft: rgba(166, 226, 46, 0.15);
    --accent-border: rgba(166, 226, 46, 0.3);
    --hover-bg: #3b3c35;
    --active-bg: #4a4a40;
    --overlay: transparent;
    --danger: #f92672;
    --danger-soft: rgba(249, 38, 114, 0.15);
    --success-soft: rgba(166, 226, 46, 0.15);
    --success: #a6e22e;
    --warning: #fd971f;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #22231e;
    --board-card-bg: #2d2e2a;
    --board-card-border: #3e3d32;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #f8f8f2;
    --syntax-bg: #272822;
    --syntax-keyword: #f92672;
    --syntax-string: #e6db74;
    --syntax-number: #ae81ff;
    --syntax-constant: #ae81ff;
    --syntax-comment: #75715e;
    --syntax-builtin: #a6e22e;
    --syntax-entity: #f92672;
    --syntax-tag: #f92672;
    --syntax-section: #a6e22e;
    --syntax-bullet: #f92672;
    --syntax-link: #e6db74;
    --syntax-error: #f92672;
    --syntax-meta: #75715e;
    --syntax-hr: #75715e;
    --syntax-bracket: #75715e;
    --syntax-qualifier: #75715e;
    --syntax-addition: #a6e22e;
    --syntax-addition-bg: rgba(166, 226, 46, 0.15);
    --syntax-deletion: #f92672;
    --syntax-deletion-bg: rgba(249, 38, 114, 0.15);
    --syntax-selection: #3e3d32;
    --caret-color: #f8f8f2;
}

/* ── Dark Orange ───────────────────────────────────────── */
:root[data-theme="dark-orange"] {
    --theme-name: Dark Orange;
    color-scheme: dark;
    --border-color: #2a2e33;
    --border-strong: #3a4050;
    --bg: #1a1c1f;
    --bg-canvas: #141618;
    --bg-sidebar: var(--bg);
    --bg-elev: #202326;
    --bg-elev-strong: #282b30;
    --bg-muted: #23262b;
    --text: #c9d1d9;
    --text-strong: #e5ecf5;
    --text-muted: #6b7280;
    --accent: #f59e0b;
    --accent-contrast: #1a1c1f;
    --accent-soft: rgba(245, 158, 11, 0.15);
    --accent-border: rgba(245, 158, 11, 0.3);
    --hover-bg: #2d2b20;
    --active-bg: #3a3525;
    --overlay: transparent;
    --danger: #e74c3c;
    --danger-soft: rgba(231, 76, 60, 0.15);
    --success-soft: rgba(46, 204, 113, 0.15);
    --success: #2ecc71;
    --warning: #f59e0b;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #1c1e21;
    --board-card-bg: #202326;
    --board-card-border: #2a2e33;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #c9d1d9;
    --syntax-bg: #1a1c1f;
    --syntax-keyword: #f59e0b;
    --syntax-string: #e8c36a;
    --syntax-number: #f59e0b;
    --syntax-constant: #f59e0b;
    --syntax-comment: #6b7280;
    --syntax-builtin: #e67e22;
    --syntax-entity: #f39c12;
    --syntax-tag: #f59e0b;
    --syntax-section: #e8c36a;
    --syntax-bullet: #f59e0b;
    --syntax-link: #e8c36a;
    --syntax-error: #e74c3c;
    --syntax-meta: #6b7280;
    --syntax-hr: #6b7280;
    --syntax-bracket: #6b7280;
    --syntax-qualifier: #6b7280;
    --syntax-addition: #2ecc71;
    --syntax-addition-bg: rgba(46, 204, 113, 0.15);
    --syntax-deletion: #e74c3c;
    --syntax-deletion-bg: rgba(231, 76, 60, 0.15);
    --syntax-selection: #3a3525;
    --caret-color: #c9d1d9;
}

/* ── Tokyo Night ──────────────────────────────────────── */
:root[data-theme="tokyo-night"] {
    --theme-name: Tokyo Night;
    color-scheme: dark;
    --border-color: #292e42;
    --border-strong: #33415e;
    --bg: #1a1b26;
    --bg-canvas: #16161e;
    --bg-sidebar: var(--bg);
    --bg-elev: #1f2335;
    --bg-elev-strong: #24283b;
    --bg-muted: #1e2233;
    --text: #a9b1d6;
    --text-strong: #c0caf5;
    --text-muted: #565f89;
    --accent: #7aa2f7;
    --accent-contrast: #1a1b26;
    --accent-soft: rgba(122, 162, 247, 0.15);
    --accent-border: rgba(122, 162, 247, 0.3);
    --hover-bg: #2f3650;
    --active-bg: #3b4370;
    --overlay: transparent;
    --danger: #f7768e;
    --danger-soft: rgba(247, 118, 142, 0.15);
    --success-soft: rgba(158, 206, 106, 0.15);
    --success: #9ece6a;
    --warning: #e0af68;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --board-col-bg: #1c1f2e;
    --board-card-bg: #1f2335;
    --board-card-border: #292e42;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #a9b1d6;
    --syntax-bg: #1a1b26;
    --syntax-keyword: #bb9af7;
    --syntax-string: #9ece6a;
    --syntax-number: #ff9e64;
    --syntax-constant: #ff9e64;
    --syntax-comment: #565f89;
    --syntax-builtin: #7dcfff;
    --syntax-entity: #bb9af7;
    --syntax-tag: #f7768e;
    --syntax-section: #7aa2f7;
    --syntax-bullet: #f7768e;
    --syntax-link: #9ece6a;
    --syntax-error: #f7768e;
    --syntax-meta: #565f89;
    --syntax-hr: #565f89;
    --syntax-bracket: #565f89;
    --syntax-qualifier: #565f89;
    --syntax-addition: #9ece6a;
    --syntax-addition-bg: rgba(158, 206, 106, 0.15);
    --syntax-deletion: #f7768e;
    --syntax-deletion-bg: rgba(247, 118, 142, 0.15);
    --syntax-selection: #2f3650;
    --caret-color: #a9b1d6;
}

/* ── Cyberpunk ─────────────────────────────────────────── */
:root[data-theme="cyberpunk"] {
    --theme-name: Cyberpunk;
    color-scheme: dark;
    --border-color: #2a1050;
    --border-strong: #3d1a70;
    --bg: #0d0221;
    --bg-canvas: #080015;
    --bg-sidebar: var(--bg);
    --bg-elev: #150433;
    --bg-elev-strong: #1f0647;
    --bg-muted: #11032a;
    --text: #d0d0e0;
    --text-strong: #e8e8ff;
    --text-muted: #7b68a0;
    --accent: #f706cf;
    --accent-contrast: #0d0221;
    --accent-soft: rgba(247, 6, 207, 0.15);
    --accent-border: rgba(247, 6, 207, 0.3);
    --hover-bg: #2a0845;
    --active-bg: #3d0d66;
    --overlay: transparent;
    --danger: #ff2a6d;
    --danger-soft: rgba(255, 42, 109, 0.15);
    --success-soft: rgba(5, 255, 161, 0.15);
    --success: #05ffa1;
    --warning: #ffd700;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.55);
    --board-col-bg: #0e0325;
    --board-card-bg: #150433;
    --board-card-border: #2a1050;
    --board-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    --calendar-surface: var(--bg);
    --badge-folder-text: #fbbf24;
    --badge-folder-bg: rgba(251, 191, 36, 0.15);
    --badge-folder-border: rgba(251, 191, 36, 0.35);
    --badge-text-text: #93c5fd;
    --badge-text-bg: rgba(147, 197, 253, 0.15);
    --badge-text-border: rgba(147, 197, 253, 0.35);
    --badge-board-text: #a78bfa;
    --badge-board-bg: rgba(167, 139, 250, 0.15);
    --badge-board-border: rgba(167, 139, 250, 0.35);
    --badge-calendar-text: #5eead4;
    --badge-calendar-bg: rgba(94, 234, 212, 0.15);
    --badge-calendar-border: rgba(94, 234, 212, 0.35);
    --badge-spreadsheet-text: #fdba74;
    --badge-spreadsheet-bg: rgba(253, 186, 116, 0.15);
    --badge-spreadsheet-border: rgba(253, 186, 116, 0.35);
    --syntax-plain: #d0d0e0;
    --syntax-bg: #0d0221;
    --syntax-keyword: #f706cf;
    --syntax-string: #05ffa1;
    --syntax-number: #ffd700;
    --syntax-constant: #ffd700;
    --syntax-comment: #5a3d8a;
    --syntax-builtin: #00fff0;
    --syntax-entity: #f706cf;
    --syntax-tag: #ff2a6d;
    --syntax-section: #00fff0;
    --syntax-bullet: #f706cf;
    --syntax-link: #05ffa1;
    --syntax-error: #ff2a6d;
    --syntax-meta: #5a3d8a;
    --syntax-hr: #5a3d8a;
    --syntax-bracket: #5a3d8a;
    --syntax-qualifier: #5a3d8a;
    --syntax-addition: #05ffa1;
    --syntax-addition-bg: rgba(5, 255, 161, 0.15);
    --syntax-deletion: #ff2a6d;
    --syntax-deletion-bg: rgba(255, 42, 109, 0.15);
    --syntax-selection: #2a0845;
    --caret-color: #d0d0e0;
}

/* ── Common variable aliases ──────────────────────────────
 * Maps component-used names to canonical theme vars.
 * Every theme inherits these via the [data-theme] selector.
 */
[data-theme] {
    --bg-surface: var(--bg);
    --bg-overlay: var(--bg-elev);
    --bg-hover: var(--hover-bg);
    --bg-active: var(--active-bg);
    --bg-input: var(--bg-muted);
    --text-dim: var(--text-muted);
    --border: var(--border-color);
    --border-light: color-mix(in srgb, var(--border-color) 70%, transparent);
    --accent-text: var(--accent-contrast);
    --accent-hover: var(--accent);
    --danger-hover: var(--danger);
}

/* ── Badge utility classes ─────────────────────────────── */
.badge-folder { color: var(--badge-folder-text); background: var(--badge-folder-bg); border-color: var(--badge-folder-border); }
.badge-text { color: var(--badge-text-text); background: var(--badge-text-bg); border-color: var(--badge-text-border); }
.badge-board { color: var(--badge-board-text); background: var(--badge-board-bg); border-color: var(--badge-board-border); }
.badge-calendar { color: var(--badge-calendar-text); background: var(--badge-calendar-bg); border-color: var(--badge-calendar-border); }
.badge-spreadsheet { color: var(--badge-spreadsheet-text); background: var(--badge-spreadsheet-bg); border-color: var(--badge-spreadsheet-border); }

/* ── Jspreadsheet dark theme overrides ─────────────────── */
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet {
    background-color: var(--bg);
    color: var(--text);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet table {
    background-color: var(--bg);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td,
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet th {
    background-color: var(--bg-elev);
    color: var(--text);
    border-color: var(--border-color);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet thead td,
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet thead th {
    background-color: var(--bg-elev-strong) !important;
    color: var(--text-strong) !important;
    border-color: var(--border-color) !important;
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td.jss_row {
    background-color: var(--bg-elev-strong) !important;
    color: var(--text-strong) !important;
    border-color: var(--border-color) !important;
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td.jss_selectall {
    background-color: var(--bg-elev-strong) !important;
    border-color: var(--border-color) !important;
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet .jss_corner {
    background-color: var(--bg-elev-strong) !important;
    border-color: var(--border-color) !important;
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td.highlight {
    background-color: var(--active-bg);
    color: var(--text-strong);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td.highlight-left {
    border-left: 1px solid var(--accent);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td.highlight-right {
    border-right: 1px solid var(--accent);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td.highlight-top {
    border-top: 1px solid var(--accent);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_spreadsheet td.highlight-bottom {
    border-bottom: 1px solid var(--accent);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_textarea textarea,
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jss_textarea input {
    background-color: var(--bg-elev) !important;
    color: var(--text-strong) !important;
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jcontextmenu {
    background-color: var(--bg-sidebar);
    color: var(--text);
    border-color: var(--border-color);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jcontextmenu > div:hover {
    background-color: var(--hover-bg);
}
[data-theme]:is([data-theme="dark"],[data-theme="forest-night"],[data-theme="darcula"],[data-theme="dracula"],[data-theme="nord"],[data-theme="monokai"],[data-theme="dark-orange"],[data-theme="tokyo-night"],[data-theme="cyberpunk"]) .jcontextmenu hr {
    border-color: var(--border-strong);
}

/* ── Jspreadsheet dropdown theme overrides ─────────────── */
[data-theme] .jdropdown,
[data-theme] .jdropdown-container,
[data-theme] .jdropdown-content {
    background-color: var(--bg-elev) !important;
    color: var(--text) !important;
    border-color: var(--border-color) !important;
}
[data-theme] .jdropdown-header,
[data-theme] .jdropdown-container-header,
[data-theme] .jdropdown-picker {
    background-color: var(--bg-input) !important;
    color: var(--text-strong) !important;
    border-color: var(--border-color) !important;
}
[data-theme] .jdropdown-item,
[data-theme] .jdropdown-title,
[data-theme] .jdropdown-description {
    color: var(--text) !important;
}
[data-theme] .jdropdown-item:hover,
[data-theme] .jdropdown-cursor {
    background-color: var(--hover-bg) !important;
    color: var(--text-strong) !important;
}
[data-theme] .jdropdown-selected {
    background-color: var(--active-bg) !important;
    color: var(--text-strong) !important;
}
[data-theme] .jdropdown-close,
[data-theme] .jdropdown-reset_ {
    color: var(--text-muted) !important;
}

/* ── Code block text selection ───────────────────────────
   CM6 injects theme classes that override ::selection and
   render selection backgrounds via .cm-selectionBackground
   elements. We override with !important rules keyed to our
   theme variable. */
.draftly-editor-host .cm-content::selection,
.draftly-editor-host .cm-content *::selection,
.draftly-editor-host .cm-content .cm-line::selection,
.draftly-editor-host .cm-content .cm-line *::selection {
    background-color: var(--syntax-selection) !important;
}

.draftly-editor-host .cm-selectionLayer .cm-selectionBackground {
    background: var(--syntax-selection) !important;
}

.draftly-editor-host .cm-cursorLayer .cm-cursor {
    border-left-color: var(--caret-color) !important;
}