/* Cebrix AI color themes — dark (default) + Figma light mode.
   Tokens are the single source of truth. Component files should prefer these
   variables; html[data-theme="light"] remaps every surface without layout changes. */

:root,
html[data-theme="dark"] {
  color-scheme: dark;

  --figma-bg: #140f20;
  --figma-surface: #1a1429;
  --figma-surface-soft: rgba(52, 40, 81, 0.35);
  --figma-accent: #9810fa;
  --figma-accent-light: #c27aff;
  --figma-border: #1e2939;
  --figma-border-soft: #4c4156;
  --figma-text: #f8f8f8;
  --figma-text-muted: #99a1af;
  --figma-text-secondary: #d1d5dc;
  --figma-text-label: #c27aff;
  --figma-text-faint: #99a1af;
  --stepper-upcoming: rgba(194, 122, 255, 0.45);
  --stepper-upcoming-line: rgba(194, 122, 255, 0.33);
  --stepper-active: var(--figma-accent-light);
  --stepper-active-line: var(--figma-accent-light);
  --stepper-complete: rgba(194, 122, 255, 0.75);
  --stepper-complete-line: var(--figma-accent-light);

  --cabinet-bg: #0f0a1f;
  --cabinet-surface: #1a1429;
  --cabinet-card: rgba(255, 255, 255, 0.03);
  --cabinet-card-inner: rgba(26, 20, 41, 0.92);
  --cabinet-accent: #9810fa;
  --cabinet-accent-strong: #7647eb;
  --cabinet-accent-soft: rgba(138, 91, 255, 0.18);
  --cabinet-accent-border: rgba(118, 71, 235, 0.25);
  --cabinet-text: #f8f8f8;
  --cabinet-text-muted: #99a1af;
  --cabinet-text-dim: #6a7282;
  --cabinet-text-label: #c27aff;
  --cabinet-border: rgba(255, 255, 255, 0.06);
  --cabinet-orange: #e8824a;
  --cabinet-danger: #ff5470;
  --cabinet-danger-bg: rgba(231, 0, 11, 0.1);
  --cabinet-card-gradient: linear-gradient(
    145deg,
    rgba(38, 26, 58, 0.38) 0%,
    rgba(15, 10, 31, 0.22) 100%
  );
  --cabinet-card-border-color: rgba(138, 91, 255, 0.1);
  --cabinet-card-shadow:
    0 8px 40px rgba(0, 0, 0, 0.55), 0 2px 16px rgba(0, 0, 0, 0.35);
  --cabinet-card-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --cabinet-card-recessed-shadow:
    inset 0 2px 10px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 6px 28px rgba(0, 0, 0, 0.45);

  --app-bg: var(--cabinet-bg);
  --dark-background: var(--cabinet-bg);
  --dark-main: var(--cabinet-surface);
  --dark-border: #242e3e;
  --lighter-border: #364153;
  --panel-bg: var(--cabinet-card);
  --panel-border: rgba(138, 91, 255, 0.15);
  --accent: var(--cabinet-accent);
  --inactive: #9810fa;
  --accent-strong: var(--cabinet-accent-strong);
  --accent-soft: var(--cabinet-accent-soft);
  --text: var(--cabinet-text);
  --text-muted: var(--cabinet-text-muted);
  --text2: var(--cabinet-text-muted);
  --text-muted-2: #6a7282;
  --headings-accent: #c27aff;
  --scroll-main: #5f47a8;
  --scroll-secondary: #433371;
  --danger: #ff5470;
  --danger-text: #9f0e26;
  --danger-2: #f98599;
  --success: #c27aff;
  --success-text: #9810fa;
  --success-2: #a78bfa;
  --surface: rgba(12, 12, 12, 0.9);
  --text-on-accent: #ffffff;

  --overlay-02: rgba(255, 255, 255, 0.02);
  --overlay-03: rgba(255, 255, 255, 0.03);
  --overlay-04: rgba(255, 255, 255, 0.04);
  --overlay-05: rgba(255, 255, 255, 0.05);
  --overlay-06: rgba(255, 255, 255, 0.06);
  --overlay-07: rgba(255, 255, 255, 0.07);
  --overlay-08: rgba(255, 255, 255, 0.08);
  --overlay-10: rgba(255, 255, 255, 0.1);
  --overlay-12: rgba(255, 255, 255, 0.12);
  --overlay-13: rgba(255, 255, 255, 0.13);
  --overlay-14: rgba(255, 255, 255, 0.14);
  --overlay-18: rgba(255, 255, 255, 0.18);
  --overlay-20: rgba(255, 255, 255, 0.2);
  --overlay-28: rgba(255, 255, 255, 0.28);
  --overlay-35: rgba(255, 255, 255, 0.35);
  --overlay-40: rgba(255, 255, 255, 0.4);
  --overlay-65: rgba(255, 255, 255, 0.65);
  --overlay-70: rgba(255, 255, 255, 0.7);
  --overlay-85: rgba(255, 255, 255, 0.85);
  --overlay-90: rgba(255, 255, 255, 0.9);

  --surface-inset: #1a1522;
  --surface-raised: #342851;
  --surface-input: #16121f;
  --surface-deep: #0a0a0f;
  --surface-chrome: #111118;
  --surface-module: #18181f;
  --profile-bar-bg: rgba(16, 24, 40, 0.3);
  --ghost-btn-bg: #1a1522;
  --ghost-btn-text: #f1eded;
  --placeholder: rgba(255, 255, 255, 0.38);
  --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='rgba(255,255,255,0.7)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --dropzone-bg: rgba(255, 255, 255, 0.02);
  --chip-bg: #f9fafb;
  --chip-border: #d1d5dc;
  --muted-fill: #f3f4f6;

  --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 8px 25px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.45);
  --shadow-xl: 0 25px 80px rgba(0, 0, 0, 0.35);
  --sidebar-expand-shadow: 8px 0 32px rgba(0, 0, 0, 0.4);
  --modal-scrim: rgba(0, 0, 0, 0.65);
  --loader-scrim: rgba(5, 5, 5, 0.9);
  --home-badge-bg: rgba(194, 122, 255, 0.26);
  --home-badge-text: #ebeced;
  --welcome-heading: rgba(232, 237, 233, 0.68);
  --welcome-body: rgba(143, 168, 154, 0.72);
  --welcome-value: rgba(232, 237, 233, 0.72);
  --code-bg: rgba(255, 255, 255, 0.1);
  --code-text: #f8f8f8;
  --strong-text: #f8f8f8;
  --input-text: #f5f5f5;
  --search-highlight-bg: rgba(194, 122, 255, 0.35);
  --search-highlight-text: #fff;
  --table-header-bg: color-mix(
    in srgb,
    var(--dark-main) 84%,
    rgb(118, 71, 235) 16%
  );
  --alert-success-bg: #f0fdf4;
  --alert-success-border: #bbf7d0;
  --alert-success-text: #166534;
  --cost-low-bg: #dcfce7;
  --cost-low-border: #b9f8cf;
  --cost-low-text: #008236;
  --cost-mid-bg: #fef3c6;
  --cost-mid-border: #fee685;
  --cost-mid-text: #bb4d00;
  --cost-high-bg: #ffe2e2;
  --cost-high-border: #ffc9c9;
  --cost-high-text: #c10007;
  --delete-btn-bg: #fef2f2;
  --delete-btn-border: #fecaca;
  --super-badge-bg: #fef3c6;
  --super-badge-border: #fee685;
  --super-badge-text: #973c00;
  --rank-low-bg: rgba(30, 70, 45, 0.72);
  --rank-low-bg-soft: rgba(46, 160, 90, 0.22);
  --rank-low-border: rgba(86, 200, 130, 0.65);
  --rank-low-text: #b8f0c8;
  --rank-mid-bg: rgba(70, 50, 20, 0.72);
  --rank-mid-bg-soft: rgba(200, 140, 40, 0.22);
  --rank-mid-border: rgba(230, 170, 60, 0.65);
  --rank-mid-text: #ffe2a8;
  --rank-high-bg: rgba(70, 28, 34, 0.72);
  --rank-high-bg-soft: rgba(200, 60, 70, 0.22);
  --rank-high-border: rgba(230, 90, 100, 0.65);
  --rank-high-text: #ffc0c0;
  --rank-unknown-bg: rgba(60, 55, 75, 0.72);
  --rank-unknown-bg-soft: rgba(140, 140, 160, 0.18);
  --rank-unknown-border: rgba(160, 160, 180, 0.45);
  --rank-unknown-text: #d0d0e0;
  --limit-warn-bg: rgba(212, 63, 17, 0.12);
  --limit-warn-border: rgba(212, 63, 17, 0.45);
  --limit-warn-text: #ffc9b8;
  --super-chip-bg: rgba(255, 196, 86, 0.18);
  --super-chip-border: rgba(255, 196, 86, 0.35);
  --super-chip-text: #ffe8b0;
  --wizard-adviser-name: var(--figma-accent-light);
  --wizard-adviser-row-bg: var(--figma-surface-soft);
  --wizard-adviser-row-border: var(--overlay-18);
  --wizard-source-badge-bg: rgba(152, 16, 250, 0.2);
  --wizard-source-badge-border: var(--overlay-13);
  --wizard-source-badge-text: var(--overlay-85);
  --wizard-icon-expand-bg: rgba(21, 93, 252, 0.2);
  --wizard-icon-expand-border: var(--overlay-13);
  --wizard-icon-expand-color: var(--text);
  --wizard-icon-delete-bg: rgba(231, 0, 11, 0.2);
  --wizard-icon-delete-border: var(--overlay-13);
  --wizard-icon-delete-color: var(--text);
}

html[data-theme="light"] {
  color-scheme: light;

  --figma-bg: #f7f5ff;
  --figma-surface: #ffffff;
  --figma-surface-soft: #f3f4f6;
  --figma-accent: #9810fa;
  --figma-accent-light: #c27aff;
  --figma-border: #e5e7eb;
  --figma-border-soft: #d1d5dc;
  --figma-text: #111827;
  --figma-text-muted: #6b7280;
  --figma-text-secondary: #4b5563;
  --figma-text-label: #374151;
  --figma-text-faint: #9ca3af;
  --stepper-upcoming: #9ca3af;
  --stepper-upcoming-line: #e5e7eb;
  --stepper-active: #9810fa;
  --stepper-active-line: #9810fa;
  --stepper-complete: #9810fa;
  --stepper-complete-line: #c27aff;

  --cabinet-bg: #f7f5ff;
  --cabinet-surface: #ffffff;
  --cabinet-card: #ffffff;
  --cabinet-card-inner: #ffffff;
  --cabinet-accent: #9810fa;
  --cabinet-accent-strong: #7647eb;
  --cabinet-accent-soft: rgba(152, 16, 250, 0.08);
  --cabinet-accent-border: rgba(152, 16, 250, 0.22);
  --cabinet-text: #111827;
  --cabinet-text-muted: #6b7280;
  --cabinet-text-dim: #6b7280;
  --cabinet-text-label: #9810fa;
  --cabinet-border: #e5e7eb;
  --cabinet-orange: #c47a2a;
  --cabinet-danger: #e11d48;
  --cabinet-danger-bg: rgba(225, 29, 72, 0.08);
  --cabinet-card-gradient: #ffffff;
  --cabinet-card-border-color: #d1d5dc;
  --cabinet-card-shadow:
    0 8px 28px rgba(17, 24, 39, 0.06), 0 1px 4px rgba(17, 24, 39, 0.04);
  --cabinet-card-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  --cabinet-card-recessed-shadow:
    inset 0 1px 2px rgba(17, 24, 39, 0.04), 0 4px 16px rgba(17, 24, 39, 0.05);

  --app-bg: var(--cabinet-bg);
  --dark-background: var(--cabinet-bg);
  --dark-main: var(--cabinet-surface);
  --dark-border: #e5e7eb;
  --lighter-border: #d1d5dc;
  --panel-bg: #ffffff;
  --panel-border: #e5e7eb;
  --accent: var(--cabinet-accent);
  --inactive: #9810fa;
  --accent-strong: var(--cabinet-accent-strong);
  --accent-soft: rgba(152, 16, 250, 0.1);
  --text: var(--cabinet-text);
  --text-muted: var(--cabinet-text-muted);
  --text2: #4b5563;
  --text-muted-2: #9ca3af;
  --headings-accent: #9810fa;
  --scroll-main: #c27aff;
  --scroll-secondary: #e9d5ff;
  --danger: #e11d48;
  --danger-text: #9f1239;
  --danger-2: #fecaca;
  --success: #166534;
  --success-text: #166534;
  --success-2: #bbf7d0;
  --surface: #ffffff;
  --text-on-accent: #ffffff;

  --overlay-02: rgba(17, 24, 39, 0.02);
  --overlay-03: rgba(17, 24, 39, 0.03);
  --overlay-04: rgba(17, 24, 39, 0.04);
  --overlay-05: rgba(17, 24, 39, 0.05);
  --overlay-06: rgba(17, 24, 39, 0.06);
  --overlay-07: rgba(17, 24, 39, 0.07);
  --overlay-08: rgba(17, 24, 39, 0.08);
  --overlay-10: rgba(17, 24, 39, 0.1);
  --overlay-12: rgba(17, 24, 39, 0.08);
  --overlay-13: rgba(17, 24, 39, 0.1);
  --overlay-14: rgba(17, 24, 39, 0.1);
  --overlay-18: rgba(17, 24, 39, 0.12);
  --overlay-20: rgba(17, 24, 39, 0.12);
  --overlay-28: rgba(17, 24, 39, 0.16);
  --overlay-35: rgba(17, 24, 39, 0.35);
  --overlay-40: rgba(17, 24, 39, 0.4);
  --overlay-65: rgba(17, 24, 39, 0.55);
  --overlay-70: rgba(17, 24, 39, 0.6);
  --overlay-85: rgba(17, 24, 39, 0.75);
  --overlay-90: rgba(17, 24, 39, 0.82);

  --surface-inset: #f9fafb;
  --surface-raised: #f3f4f6;
  --surface-input: #ffffff;
  --surface-deep: #f9fafb;
  --surface-chrome: #ffffff;
  --surface-module: #ffffff;
  --profile-bar-bg: rgba(0, 0, 0, 0.03);
  --ghost-btn-bg: #f3f4f6;
  --ghost-btn-text: #374151;
  --placeholder: #6b7280;
  --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --dropzone-bg: #f9fafb;
  --chip-bg: #f9fafb;
  --chip-border: #d1d5dc;
  --muted-fill: #f3f4f6;

  --shadow-sm: 0 2px 8px rgba(17, 24, 39, 0.06);
  --shadow-md: 0 8px 24px rgba(17, 24, 39, 0.08);
  --shadow-lg: 0 12px 32px rgba(17, 24, 39, 0.1);
  --shadow-xl: 0 24px 64px rgba(17, 24, 39, 0.12);
  --sidebar-expand-shadow: 8px 0 28px rgba(17, 24, 39, 0.08);
  --modal-scrim: rgba(17, 24, 39, 0.4);
  --loader-scrim: rgba(247, 245, 255, 0.88);
  --home-badge-bg: rgba(152, 16, 250, 0.08);
  --home-badge-text: #374151;
  --welcome-heading: #111827;
  --welcome-body: #6b7280;
  --welcome-value: #111827;
  --code-bg: #f3f4f6;
  --code-text: #111827;
  --strong-text: #111827;
  --input-text: #111827;
  --search-highlight-bg: rgba(152, 16, 250, 0.18);
  --search-highlight-text: #581c87;
  --table-header-bg: color-mix(in srgb, #ffffff 86%, rgb(152, 16, 250) 14%);
  --alert-success-bg: #f0fdf4;
  --alert-success-border: #bbf7d0;
  --alert-success-text: #166534;
  --rank-low-bg: var(--cost-low-bg);
  --rank-low-bg-soft: var(--cost-low-bg);
  --rank-low-border: var(--cost-low-border);
  --rank-low-text: var(--cost-low-text);
  --rank-mid-bg: var(--cost-mid-bg);
  --rank-mid-bg-soft: var(--cost-mid-bg);
  --rank-mid-border: var(--cost-mid-border);
  --rank-mid-text: var(--cost-mid-text);
  --rank-high-bg: var(--cost-high-bg);
  --rank-high-bg-soft: var(--cost-high-bg);
  --rank-high-border: var(--cost-high-border);
  --rank-high-text: var(--cost-high-text);
  --rank-unknown-bg: #f3f4f6;
  --rank-unknown-bg-soft: #f3f4f6;
  --rank-unknown-border: #d1d5dc;
  --rank-unknown-text: #4b5563;
  --limit-warn-bg: #fff1f2;
  --limit-warn-border: #fecaca;
  --limit-warn-text: #9f1239;
  --super-chip-bg: #fef3c6;
  --super-chip-border: #fee685;
  --super-chip-text: #973c00;
  --wizard-adviser-name: #9810fa;
  --wizard-adviser-row-bg: #ffffff;
  --wizard-adviser-row-border: #e5e7eb;
  --wizard-source-badge-bg: rgba(152, 16, 250, 0.08);
  --wizard-source-badge-border: rgba(152, 16, 250, 0.2);
  --wizard-source-badge-text: #9810fa;
  --wizard-icon-expand-bg: #f3f4f6;
  --wizard-icon-expand-border: #e5e7eb;
  --wizard-icon-expand-color: #374151;
  --wizard-icon-delete-bg: #fef2f2;
  --wizard-icon-delete-border: #fecaca;
  --wizard-icon-delete-color: #e11d48;
}

/* Apply theme to document chrome */
html[data-theme="light"] body.app-figma-shell,
html[data-theme="light"] body.app-shell,
html[data-theme="light"] body.cabinet-shell {
  background: var(--figma-bg);
  color: var(--figma-text);
  color-scheme: light;
}

html[data-theme="light"] .app-sidebar:hover {
  box-shadow: var(--sidebar-expand-shadow);
}

html[data-theme="light"] .app-sidebar__profile {
  background: var(--profile-bar-bg);
}

html[data-theme="light"] .app-sidebar__profile-menu {
  box-shadow: var(--shadow-lg);
}

html[data-theme="light"] .home-badge {
  background: var(--home-badge-bg);
  color: var(--home-badge-text);
}

html[data-theme="light"] .home-recent-card__tag--in_process,
html[data-theme="light"] .home-recent-card__tag--draft {
  background: #dbeafe;
  color: #1d4ed8;
}

html[data-theme="light"] .home-recent-card__tag--generating {
  background: #fef3c7;
  color: #92400e;
}

html[data-theme="light"] .home-recent-card__tag--completed {
  background: #dcfce7;
  color: #166534;
}

html[data-theme="light"] .home-hero__accent {
  background: linear-gradient(90deg, #9810fa 0%, #c27aff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html[data-theme="light"] .figma-btn--secondary {
  background: var(--ghost-btn-bg);
  color: var(--ghost-btn-text);
  border-color: var(--figma-border);
}

html[data-theme="light"] .wizard-page .figma-btn--secondary {
  background: var(--figma-surface);
  color: var(--figma-text-label);
  border-color: var(--figma-border);
}

html[data-theme="light"] .ghost-btn,
html[data-theme="light"] .btn {
  background: var(--ghost-btn-bg);
  color: var(--ghost-btn-text);
  border-color: var(--figma-border);
}

html[data-theme="light"] .expert-library-empty {
  background: var(--cabinet-card-gradient);
  border-color: color-mix(
    in srgb,
    var(--figma-accent-light) 40%,
    var(--figma-border)
  );
}

html[data-theme="light"] .cabinet-panel-title,
html[data-theme="light"] .cabinet-field-value,
html[data-theme="light"] .expert-card__name,
html[data-theme="light"] .home-recent-card__title {
  color: var(--figma-text);
}

html[data-theme="light"] .persona-profile-header__title {
  color: #111827;
}

html[data-theme="light"] .persona-profile-block__title {
  color: #6b7280;
}

html[data-theme="light"] .persona-profile-block__text,
html[data-theme="light"] .persona-profile-priorities li,
html[data-theme="light"] .persona-profile-kv__value,
html[data-theme="light"] .persona-profile-domains__name {
  color: #4b5563;
}

html[data-theme="light"] .persona-profile-quote {
  color: #5a5020;
}

html[data-theme="light"] .persona-chip--library,
html[data-theme="light"] .persona-chip--debater {
  color: #5a6db3;
}

html[data-theme="light"] .persona-chip--risk {
  color: #c47a2a;
}

html[data-theme="light"] .persona-chip--posture {
  color: #1a8a6a;
}

html[data-theme="light"] .persona-profile-values li {
  color: #c05a80;
}

html[data-theme="light"] .persona-profile-kv__key {
  color: #6b7280;
}

html[data-theme="light"] .cabinet-field-label,
html[data-theme="light"] .cabinet-stat-label,
html[data-theme="light"] .cabinet-participant-count,
html[data-theme="light"] .cabinet-updated,
html[data-theme="light"] .library-gen-tagline,
html[data-theme="light"] .library-gen-hint {
  color: var(--figma-text-muted);
}

html[data-theme="light"] .cabinet-field-value--dim {
  color: var(--figma-text-secondary);
}

html[data-theme="light"] ::placeholder {
  color: var(--placeholder);
  opacity: 1;
}

html[data-theme="light"] .welcome-policy-heading,
html[data-theme="light"] .welcome-debates-title {
  color: var(--welcome-heading);
}

html[data-theme="light"] .welcome-policy-sub,
html[data-theme="light"] .welcome-stat-label,
html[data-theme="light"] .welcome-debates-label,
html[data-theme="light"] .welcome-line-y-axis,
html[data-theme="light"] .welcome-line-x-axis {
  color: var(--welcome-body);
}

html[data-theme="light"] .welcome-policy-item-title,
html[data-theme="light"] .welcome-debates-pct,
html[data-theme="light"] .welcome-stat-value {
  color: var(--welcome-value);
}

html[data-theme="light"] .inline-alert.success {
  background-color: var(--alert-success-bg);
  border-color: var(--alert-success-border);
  color: var(--alert-success-text);
}

html[data-theme="light"] .markdown-rendered strong,
html[data-theme="light"] .markdown-rendered code {
  color: var(--strong-text);
}

html[data-theme="light"] .markdown-rendered code {
  background: var(--code-bg);
}

html[data-theme="light"] .markdown-rendered pre {
  background: var(--surface-inset);
}

html[data-theme="light"] .markdown-rendered th {
  background: var(--surface-raised);
}

html[data-theme="light"] .inputs,
html[data-theme="light"] .number-inputs,
html[data-theme="light"] .search-input,
html[data-theme="light"] .form-grid textarea,
html[data-theme="light"] .modal-panel textarea {
  color: var(--input-text);
  background: var(--surface-input);
}

html[data-theme="light"] .search-container {
  background: var(--figma-surface);
  border-color: var(--figma-border);
}

html[data-theme="light"] .search-container:focus-within {
  background: #ffffff;
  box-shadow:
    0 0 0 3px rgba(152, 16, 250, 0.1),
    0 4px 12px rgba(152, 16, 250, 0.12);
}

html[data-theme="light"] .search-highlight {
  background-color: var(--search-highlight-bg);
  color: var(--search-highlight-text);
}

html[data-theme="light"] .modal-overlay {
  background: var(--modal-scrim);
}

html[data-theme="light"] .loader-overlay {
  background: var(--loader-scrim);
  color: var(--text);
}

html[data-theme="light"] .otoken-warn__btn {
  background: rgba(255, 255, 255, 0.95);
}

html[data-theme="light"] .otoken-warn__panel {
  background: #ffffff;
  color: var(--figma-text);
}

html[data-theme="light"] .page-header,
html[data-theme="light"] .small-page-header,
html[data-theme="light"] .footer {
  background-color: var(--figma-surface);
  border-color: var(--figma-border);
}

html[data-theme="light"] .panel-debate-callout {
  background: linear-gradient(
    145deg,
    rgba(152, 16, 250, 0.08) 0%,
    rgba(247, 245, 255, 0.9) 100%
  );
  box-shadow: none;
}

html[data-theme="light"] .disclaimer-card {
  background: #fffbeb;
}

html[data-theme="light"] .disclaimer-title {
  color: #92400e;
}

html[data-theme="light"] .disclaimer-chip {
  background: #f3f4f6;
  color: #374151;
}

html[data-theme="light"] .cost-table-header,
html[data-theme="light"] .cost-table-header tr th {
  background: var(--table-header-bg);
}

html[data-theme="light"] .auth-container {
  background:
    radial-gradient(circle at top, rgba(152, 16, 250, 0.12), transparent 45%),
    #f7f5ff;
}

html[data-theme="light"] .auth-left {
  background: rgba(247, 245, 255, 0.6);
}

html[data-theme="light"] .auth-logo h1,
html[data-theme="light"] .auth-box h2 {
  color: var(--figma-text);
}

html[data-theme="light"] .auth-logo p {
  color: var(--figma-text-muted);
}

html[data-theme="light"] .auth-box {
  background: #ffffff;
  border: 1px solid var(--figma-border);
  box-shadow: var(--shadow-lg);
}

html[data-theme="light"] .auth-box input {
  background: #ffffff;
  border-color: var(--figma-border);
  color: var(--figma-text);
}

html[data-theme="light"] .persona-edit-module__head--identity {
  background: #eef2ff;
}
html[data-theme="light"] .persona-edit-module__head--philosophy {
  background: #f5e8ff;
}
html[data-theme="light"] .persona-edit-module__head--governance {
  background: #ffedd5;
}
html[data-theme="light"] .persona-edit-module__head--communication {
  background: #ecfdf5;
}
html[data-theme="light"] .persona-edit-module__head--cognition {
  background: #ede9fe;
}
html[data-theme="light"] .persona-edit-module__head--knowledge {
  background: #f0fdf4;
}
html[data-theme="light"] .persona-edit-module__head--stance {
  background: #fef3c7;
}
html[data-theme="light"] .persona-edit-module__head--voice {
  background: #fce7f3;
}

html[data-theme="light"] .persona-edit-module__title {
  color: var(--figma-text);
}

html[data-theme="light"] .persona-edit-module__desc {
  color: var(--figma-text-muted);
}

html[data-theme="light"] .carousel-btn {
  color: var(--text);
}

html[data-theme="light"] .debate-live-overlay__backdrop {
  background: rgba(247, 245, 255, 0.72);
}

html[data-theme="light"] .debate-ticker-bar {
  background: linear-gradient(
    90deg,
    #ede9fe 0%,
    var(--accent) 50%,
    #ede9fe 100%
  );
}

html[data-theme="light"] .debate-ticker-text {
  color: #111827;
}

html[data-theme="light"] .more-actions a {
  color: var(--text);
}

/* Theme switch — default for auth/floating; sidebar embeds it in the profile menu */
.theme-switch {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex-shrink: 0;
}

.app-sidebar__profile-menu .theme-switch {
  margin: 0;
  padding: 0;
}

.theme-switch__track {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border-radius: 999px;
  border: 1px solid var(--figma-border);
  background: var(--overlay-03);
}

.app-sidebar__profile-menu .theme-switch__track {
  flex-direction: row;
  border-radius: 999px;
}

.theme-switch__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--figma-text-muted);
  cursor: pointer;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

.theme-switch__btn:hover,
.theme-switch__btn:focus-visible {
  color: var(--figma-text);
  background: var(--overlay-06);
  outline: none;
}

.theme-switch__btn.is-active {
  background: var(--figma-accent);
  color: var(--text-on-accent);
}

.theme-switch__btn svg {
  display: block;
}

html[data-theme="light"] body.app-figma-shell,
html[data-theme="light"] .app-figma-shell select,
html[data-theme="light"] .app-figma-shell input,
html[data-theme="light"] .app-figma-shell textarea,
html[data-theme="light"] .sc-select,
html[data-theme="light"] .library-gen-form .library-gen-select,
html[data-theme="light"] .runtime-settings .rt-select,
html[data-theme="light"] .app-figma-shell select.persona-edit-input,
html[data-theme="light"] .app-figma-shell select.persona-input {
  color-scheme: light;
}

html[data-theme="light"] .library-gen-form .library-gen-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23374151' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

html[data-theme="light"] .app-figma-shell .llm-cost-rank-pill--low {
  background-color: var(--cost-low-bg);
  border-color: var(--cost-low-border);
  color: var(--cost-low-text);
}

html[data-theme="light"] .app-figma-shell .llm-cost-rank-pill--medium {
  background-color: var(--cost-mid-bg);
  border-color: var(--cost-mid-border);
  color: var(--cost-mid-text);
}

html[data-theme="light"] .app-figma-shell .llm-cost-rank-pill--high {
  background-color: var(--cost-high-bg);
  border-color: var(--cost-high-border);
  color: var(--cost-high-text);
}

html[data-theme="light"] .app-figma-shell .llm-select.llm-select--low {
  background-color: var(--cost-low-bg);
  border-color: var(--cost-low-border);
  color: var(--cost-low-text);
}

html[data-theme="light"] .app-figma-shell .llm-select.llm-select--medium {
  background-color: var(--cost-mid-bg);
  border-color: var(--cost-mid-border);
  color: var(--cost-mid-text);
}

html[data-theme="light"] .app-figma-shell .llm-select.llm-select--high {
  background-color: var(--cost-high-bg);
  border-color: var(--cost-high-border);
  color: var(--cost-high-text);
}

html[data-theme="light"] .app-figma-shell .runtime-settings {
  --rt-card: #ffffff;
  --rt-border: #e5e7eb;
  --rt-row-border: #f3f4f6;
  --rt-input-bg: #ffffff;
  --rt-well-bg: #f9fafb;
  --rt-title: #111827;
  --rt-muted: #6b7280;
  --rt-dim: #9ca3af;
  --rt-eyebrow: #9810fa;
  --rt-mono: #6d28d9;
  --rt-btn-border: #d1d5dc;
  --rt-btn-text: #7c3aed;
}

html[data-theme="light"] .app-figma-content .debate-transcript-scalable {
  --debate-transcript-body: var(--figma-text-secondary);
  --debate-transcript-heading: var(--figma-text);
}

html[data-theme="light"] .debate-transcript-scalable .markdown-rendered a {
  color: var(--accent);
}

html[data-theme="light"]
  .debate-transcript-scalable
  .markdown-rendered
  a:hover {
  color: var(--accent-strong);
}

html[data-theme="light"] .app-figma-shell textarea.home-create {
  background: #ffffff !important;
  border-color: var(--figma-border) !important;
}

html[data-theme="light"] .home-recent-card {
  background: #ffffff;
  border-color: var(--figma-border);
  box-shadow: var(--shadow-sm);
}

html[data-theme="light"] .figma-btn--primary {
  box-shadow: 0 8px 20px rgba(152, 16, 250, 0.22);
}

html[data-theme="light"] .modal-panel,
html[data-theme="light"] .app-sidebar__profile-menu {
  box-shadow: var(--shadow-lg);
}

html[data-theme="light"] .auth-left {
  background: rgba(247, 245, 255, 0.45);
}

html[data-theme="light"] .auth-form input,
html[data-theme="light"] .auth-form input:focus {
  background: #ffffff;
  color: var(--figma-text);
}

html[data-theme="light"] .auth-form input::placeholder {
  color: var(--figma-text-muted);
}

.theme-switch-floating {
  position: fixed;
  top: max(0.85rem, env(safe-area-inset-top, 0px));
  right: max(0.85rem, env(safe-area-inset-right, 0px));
  z-index: 40;
}

.theme-switch-floating .theme-switch {
  margin-top: 0;
  padding: 0;
}
