/**
 * PhotoFolio Support Manual — canonical light/dark tokens.
 *
 * Load AFTER manual-theme-final.css so this file wins token fights.
 * Every surface should read ink / panel / accent from these vars.
 * Do not re-declare competing --custom-* or --pf-chat-* stacks elsewhere.
 */

/* -------------------------------------------------------------------------- */
/* Dark                                                                      */
/* -------------------------------------------------------------------------- */

:root,
:root[data-manual-theme="dark"] {
  color-scheme: dark;

  --custom-bg: #050505 !important;
  --custom-paper: #111111 !important;
  --custom-panel: #151515 !important;
  --custom-ink: #e8e8e8 !important;
  --custom-copy: #d0d0d0 !important;
  --custom-muted: #9a9a9a !important;
  --custom-line: #2a2a2a !important;
  --custom-accent: #0099ff !important;
  --custom-accent-soft: rgba(0, 153, 255, 0.14) !important;
  --custom-accent-line: rgba(0, 153, 255, 0.45) !important;
  --custom-warm: #0099ff !important;

  --pf-chat-stage: #050505 !important;
  --pf-chat-surface: #101010 !important;
  --pf-chat-surface-soft: #080808 !important;
  --pf-chat-ink: #e8e8e8 !important;
  --pf-chat-muted: #9a9a9a !important;
  --pf-chat-line: #2a2a2a !important;
  --pf-chat-neon: #0099ff !important;
  --pf-chat-neon-strong: #33aaff !important;
  --pf-chat-neon-soft: rgba(0, 153, 255, 0.14) !important;
  --pf-chat-panel: #151515 !important;
  --pf-chat-panel-2: #1a1a1a !important;

  --chat-chrome-bg: #111111 !important;
  --chat-chrome-bg-elevated: #1a1a1a !important;
  --chat-chrome-line: #2a2a2a !important;
  --chat-chrome-ink: #e8e8e8 !important;
  --chat-chrome-muted: #9a9a9a !important;

  --dx-panel: #1a1a1a !important;
  --dx-elevated: #222222 !important;
  --dx-bar: #151515 !important;
  --dx-line: #333333 !important;
  --dx-copy: #e6e6e6 !important;
  --dx-label: #c9c9c9 !important;
  --dx-muted: #999999 !important;
  --dx-toggle: #0099ff !important;

  --black: #050505 !important;
  --white: #e8e8e8 !important;
  --text: #d0d0d0 !important;
  --muted: #9a9a9a !important;
  --panel: #151515 !important;
  --panel-raised: #1a1a1a !important;
  --panel-border: #2a2a2a !important;
  --code-bg: #0c0c0c !important;
  --neon: #0099ff !important;
  --neon-border: #0099ff !important;

  /* Studio chrome aliases */
  --studio-chrome-glass: rgba(16, 20, 26, 0.58);
  --studio-chrome-glass-edge: rgba(255, 255, 255, 0.14);
  --studio-chrome-panel: rgba(12, 15, 20, 0.94);
  --studio-chrome-row: rgba(255, 255, 255, 0.045);
  --studio-chrome-row-tip: rgba(212, 168, 92, 0.1);
  --studio-chrome-row-edge: rgba(255, 255, 255, 0.08);
  --studio-chrome-ink: #d7dde3;
  --studio-chrome-ink-dim: #9aa3ac;
  --studio-chrome-ink-soft: #6f7882;
  --studio-chrome-accent: var(--pf-chat-neon);
  --studio-chrome-accent-soft: var(--pf-chat-neon-soft);
  --studio-chrome-accent-ink: #7cc8ff;
  --studio-chrome-hover: rgba(255, 255, 255, 0.08);
  --studio-chrome-active-bg: color-mix(in srgb, var(--pf-chat-neon) 16%, transparent);
  --studio-chrome-blur: blur(22px) saturate(1.35);
  --studio-chrome-shadow: 0 14px 40px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  --studio-chrome-sheen: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.12),
    rgba(255, 255, 255, 0.02) 48%,
    transparent
  );
  --studio-seo-good: #7ddea8;
  --studio-seo-warn: #e0b56a;
  --studio-seo-bad: #e69898;
  --studio-seo-mark-good-bg: rgba(125, 222, 168, 0.14);
  --studio-seo-mark-warn-bg: rgba(224, 181, 106, 0.16);

  --seo-copy: var(--custom-copy);
  --seo-muted: var(--custom-muted);
  --seo-accent: var(--pf-chat-neon);
  --seo-line: color-mix(in srgb, var(--pf-chat-neon) 18%, var(--custom-line));
  --seo-surface: var(--chat-chrome-bg);
  --seo-surface-raised: var(--chat-chrome-bg-elevated);
  --seo-surface-sunken: color-mix(in srgb, var(--custom-bg) 78%, var(--custom-panel) 22%);
  --seo-input: color-mix(in srgb, var(--custom-bg) 88%, var(--custom-panel) 12%);
  --seo-hover: color-mix(in srgb, var(--pf-chat-neon) 7%, var(--chat-chrome-bg-elevated));
  --seo-open: color-mix(in srgb, var(--pf-chat-neon) 10%, var(--chat-chrome-bg-elevated));
}

/* -------------------------------------------------------------------------- */
/* Light                                                                     */
/* -------------------------------------------------------------------------- */

:root[data-manual-theme="light"],
:root:not([data-manual-theme="dark"]) {
  color-scheme: light;

  --custom-bg: #f5f7f9 !important;
  --custom-paper: #ffffff !important;
  --custom-panel: #ffffff !important;
  --custom-ink: #101820 !important;
  --custom-copy: #24323c !important;
  --custom-muted: #5f6f79 !important;
  --custom-line: #d3dde4 !important;
  --custom-accent: #0088e6 !important;
  --custom-accent-soft: rgba(0, 136, 230, 0.12) !important;
  --custom-accent-line: rgba(0, 136, 230, 0.42) !important;
  --custom-warm: #0088e6 !important;

  --pf-chat-stage: #f5f7f9 !important;
  --pf-chat-surface: #ffffff !important;
  --pf-chat-surface-soft: #edf3f6 !important;
  --pf-chat-ink: #101820 !important;
  --pf-chat-muted: #5f6f79 !important;
  --pf-chat-line: #d3dde4 !important;
  --pf-chat-neon: #0088e6 !important;
  --pf-chat-neon-strong: #0070c4 !important;
  --pf-chat-neon-soft: rgba(0, 136, 230, 0.12) !important;
  --pf-chat-panel: #ffffff !important;
  --pf-chat-panel-2: #edf3f6 !important;

  --chat-chrome-bg: #ffffff !important;
  --chat-chrome-bg-elevated: #f4f7f9 !important;
  --chat-chrome-line: #d3dde4 !important;
  --chat-chrome-ink: #101820 !important;
  --chat-chrome-muted: #5f6f79 !important;

  --dx-panel: #ffffff !important;
  --dx-elevated: #f4f7f9 !important;
  --dx-bar: #ffffff !important;
  --dx-line: #d3dde4 !important;
  --dx-copy: #24323c !important;
  --dx-label: #3a4650 !important;
  --dx-muted: #5f6f79 !important;
  --dx-toggle: #0088e6 !important;

  --black: #f5f7f9 !important;
  --white: #101820 !important;
  --text: #24323c !important;
  --muted: #5f6f79 !important;
  --panel: #ffffff !important;
  --panel-raised: #f8fafb !important;
  --panel-border: #d3dde4 !important;
  --code-bg: #eef4f7 !important;
  --neon: #0088e6 !important;
  --neon-border: #0088e6 !important;

  --studio-chrome-glass: rgba(255, 255, 255, 0.82);
  --studio-chrome-glass-edge: rgba(30, 40, 50, 0.12);
  --studio-chrome-panel: rgba(255, 255, 255, 0.97);
  --studio-chrome-row: rgba(30, 40, 50, 0.04);
  --studio-chrome-row-tip: rgba(170, 110, 20, 0.08);
  --studio-chrome-row-edge: rgba(30, 40, 50, 0.1);
  --studio-chrome-ink: #2f3740;
  --studio-chrome-ink-dim: #5a6570;
  --studio-chrome-ink-soft: #84909a;
  --studio-chrome-accent: var(--pf-chat-neon);
  --studio-chrome-accent-soft: var(--pf-chat-neon-soft);
  --studio-chrome-accent-ink: #0070c4;
  --studio-chrome-hover: rgba(30, 40, 50, 0.06);
  --studio-chrome-active-bg: color-mix(in srgb, var(--pf-chat-neon) 12%, transparent);
  --studio-chrome-blur: blur(22px) saturate(1.25);
  --studio-chrome-shadow: 0 12px 32px rgba(20, 28, 36, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  --studio-chrome-sheen: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.65),
    rgba(255, 255, 255, 0.18) 48%,
    transparent
  );
  --studio-seo-good: #1f8a58;
  --studio-seo-warn: #9a6b1e;
  --studio-seo-bad: #b54a4a;
  --studio-seo-mark-good-bg: rgba(31, 138, 88, 0.12);
  --studio-seo-mark-warn-bg: rgba(154, 107, 30, 0.12);

  /* SEO Center: darker body text for light backgrounds */
  --seo-copy: #152028 !important;
  --seo-muted: #3d4b56 !important;
  --seo-accent: var(--pf-chat-neon);
  --seo-line: color-mix(in srgb, var(--pf-chat-neon) 18%, var(--custom-line));
  --seo-surface: var(--chat-chrome-bg);
  --seo-surface-raised: var(--chat-chrome-bg-elevated);
  --seo-surface-sunken: color-mix(in srgb, var(--custom-bg) 78%, var(--custom-panel) 22%);
  --seo-input: #ffffff;
  --seo-hover: color-mix(in srgb, var(--pf-chat-neon) 7%, var(--chat-chrome-bg-elevated));
  --seo-open: color-mix(in srgb, var(--pf-chat-neon) 10%, var(--chat-chrome-bg-elevated));
}

/* Explicit light attr wins over the :not(dark) twin when both would match */
:root[data-manual-theme="light"] {
  color-scheme: light;
}

/* -------------------------------------------------------------------------- */
/* App-wide conflict killers — map leftover hardcoded surfaces to tokens      */
/* -------------------------------------------------------------------------- */

body,
.app,
.main,
.content,
.sidebar,
#chat-root,
.chat-shell,
.chat-body,
.chat-layout,
.chat-main,
.chat-log {
  color: var(--custom-copy);
}

body,
.app,
.main,
.content {
  background: var(--custom-bg) !important;
}

.sidebar,
.sidebar-header,
.nav-tree {
  background: var(--custom-panel) !important;
  color: var(--custom-copy) !important;
  border-color: var(--custom-line) !important;
}

.brand,
.subtitle,
.tab,
.nav-section-title,
.nav-folder summary,
.folder-label,
.nav-link {
  color: var(--custom-ink) !important;
}

.folder-desc,
.folder-count,
.chat-muted,
.chat-hint {
  color: var(--custom-muted) !important;
}

/* Workbench right cluster — stop forcing a dark plate in light mode */
:is(#chat-root, .chat-media.chat-media--block-draft-fullscreen)
  .chat-prototype-workbench-head
  .chat-prototype-view-controls {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--studio-chrome-ink, var(--custom-copy)) !important;
}

:is(#chat-root, .chat-media.chat-media--block-draft-fullscreen)
  .chat-prototype-workbench-head
  .chat-prototype-view-controls
  > :is(button, span, strong, small) {
  color: inherit;
}

:is(#chat-root, .chat-media.chat-media--block-draft-fullscreen)
  .chat-prototype-workbench-head
  .chat-prototype-view-controls
  > .chat-prototype-workbench-apply {
  color: var(--studio-chrome-accent-ink, var(--pf-chat-neon)) !important;
  border-color: color-mix(in srgb, var(--pf-chat-neon) 45%, transparent) !important;
  background: var(--pf-chat-neon-soft) !important;
}

/* Approval cards follow theme */
.pending-approval-card,
.pending-approval-card__dismiss,
.pending-approval-card--insert .pending-approval-card__dismiss {
  background: var(--custom-panel) !important;
  border-color: var(--custom-line) !important;
  color: var(--custom-copy) !important;
}

.pending-approval-card__dismiss:hover {
  border-color: var(--pf-chat-neon) !important;
  color: var(--pf-chat-neon) !important;
}

/* Designs gallery — never stick to dark-only hex */
body.is-designs-view .designs-gallery,
body.is-designs-view .designs-card {
  background: var(--custom-panel) !important;
  color: var(--custom-copy) !important;
  border-color: var(--custom-line) !important;
}

body.is-designs-view .designs-gallery-head {
  background: transparent !important;
  color: var(--custom-copy) !important;
  border-color: transparent !important;
}

body.is-designs-view .designs-card:hover,
body.is-designs-view .designs-card.is-active {
  border-color: var(--pf-chat-neon) !important;
}

/* Format / shape strips + portaled panels use DX tokens */
body > .chat-format-menu-panel.is-pinned-fixed,
body > .chat-format-menu-panel[data-pf-portaled="1"],
:is(#chat-root, .chat-media.chat-media--block-draft-fullscreen)
  :is(.chat-prototype-format-strip, .chat-format-menu-panel, .chat-prototype-shape-strip) {
  background: var(--dx-panel) !important;
  border-color: var(--dx-line) !important;
  color: var(--dx-copy) !important;
  box-shadow: 0 12px 28px color-mix(in srgb, #000 18%, transparent) !important;
}

/* Workspace tools menu */
.main-top-actions .chat-utility-popover,
.chat-utility-popover {
  background: var(--custom-panel) !important;
  border: 1px solid var(--custom-line) !important;
  color: var(--custom-copy) !important;
  box-shadow: 0 14px 34px color-mix(in srgb, #000 16%, transparent) !important;
}

.chat-utility-popover button {
  color: var(--custom-copy) !important;
  background: transparent !important;
}

.chat-utility-popover button:hover,
.chat-utility-popover button:focus-visible {
  background: var(--pf-chat-neon-soft) !important;
  color: var(--pf-chat-neon) !important;
  border-left-color: var(--pf-chat-neon) !important;
}

/* Workspace burger — no plate, thin light lines */
.main-top .chat-utility-toggle,
#chat-utility-toggle.chat-header-tool {
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--custom-muted) !important;
}

.main-top .chat-utility-toggle:hover,
.main-top .chat-utility-toggle:focus-visible,
#chat-utility-toggle.chat-header-tool:hover,
#chat-utility-toggle.chat-header-tool:focus-visible {
  background: transparent !important;
  color: var(--custom-ink) !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.main-top .chat-utility-toggle[aria-expanded="true"],
#chat-utility-toggle.chat-header-tool[aria-expanded="true"] {
  color: var(--pf-chat-neon) !important;
}

.chat-utility-toggle-icon,
.chat-utility-toggle-icon::before,
.chat-utility-toggle-icon::after {
  width: 14px !important;
  height: 1.75px !important;
  border-radius: 1px !important;
  background: currentColor !important;
  opacity: 0.88 !important;
  box-shadow: none !important;
}

.chat-utility-toggle-icon::before {
  top: -5.5px !important;
}

.chat-utility-toggle-icon::after {
  top: 5.5px !important;
}

/* -------------------------------------------------------------------------- */
/* SEO Center — light mode dark ink (must beat #chat-root #chat-log rules)     */
/* -------------------------------------------------------------------------- */

:root[data-manual-theme="light"] #chat-root,
:root:not([data-manual-theme="dark"]) #chat-root {
  --seo-copy: #121a22 !important;
  --seo-muted: #3a4652 !important;
  --seo-surface: #ffffff !important;
  --seo-surface-raised: #f7f9fb !important;
  --seo-surface-sunken: #f1f4f7 !important;
  --seo-input: #ffffff !important;
  --seo-line: #c5d0d8 !important;
  --seo-hover: #eef5fb !important;
  --seo-open: #e7f2fb !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card,
:root[data-manual-theme="light"] #chat-root .chat-seo-card,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions {
  color: #121a22 !important;
  background: #ffffff !important;
  border-color: var(--pf-chat-neon) !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-head,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-head,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-head,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-head {
  background: #f4f7f9 !important;
  border-bottom-color: #d3dde4 !important;
  color: #121a22 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-head .chat-tool-mode,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-head .chat-tool-mode,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-head .chat-tool-mode,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-head .chat-tool-mode,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-head small,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-head small,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-head small,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-head small,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-score span,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-score span,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-score span,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-score span {
  color: #3a4652 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-head strong,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-head strong,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-head strong,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-head strong {
  color: #101820 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-group,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-group,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-group,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-group {
  background: #ffffff !important;
  border-bottom-color: #d3dde4 !important;
  color: #121a22 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-body,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-group-body,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-body,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-group-body,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-questionnaire,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-questionnaire,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-questionnaire,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-questionnaire {
  background: #f7f9fb !important;
  color: #121a22 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-copy strong,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-group-copy strong,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-copy strong,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-group-copy strong,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-check-title > strong,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-check-title > strong,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-check-title > strong,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-check-title > strong,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-check > div strong,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-check > div strong,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-check > div strong,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-check > div strong {
  color: #101820 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-copy small,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-group-copy small,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-copy small,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-group-copy small,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-check-copy > small,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-check-copy > small,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-check-copy > small,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-check-copy > small,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-meta,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-group-meta,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-meta,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-group-meta,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-category-score,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-category-score,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-category-score,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-category-score {
  color: #3a4652 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-fields label,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-profile-fields label,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-fields label,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-profile-fields label,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-fields label > span,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-profile-fields label > span,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-fields label > span,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-profile-fields label > span,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-actions small,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-profile-actions small,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-actions small,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-profile-actions small,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-term-chips > small,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-term-chips > small,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-term-chips > small,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-term-chips > small,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-insert > small,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-insert > small,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-insert > small,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-insert > small {
  color: #2f3b46 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-fields textarea,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-profile-fields textarea,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-fields textarea,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-profile-fields textarea,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions textarea,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions textarea,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions textarea,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions textarea {
  color: #121a22 !important;
  background: #ffffff !important;
  border-color: #c5d0d8 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions textarea::placeholder,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions textarea::placeholder,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions textarea::placeholder,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions textarea::placeholder {
  color: #667887 !important;
  opacity: 1 !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-actions button,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-profile-actions button,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-profile-actions button,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-profile-actions button,
:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-insert button,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-insert button,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-insert button,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-insert button {
  color: var(--pf-chat-neon) !important;
  border-color: var(--pf-chat-neon) !important;
  background: transparent !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-score strong,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-score strong,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-score strong,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-score strong {
  color: var(--pf-chat-neon) !important;
}

:root[data-manual-theme="light"] #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-summary > i,
:root[data-manual-theme="light"] #chat-root .chat-seo-card--actions .chat-seo-group-summary > i,
:root:not([data-manual-theme="dark"]) #chat-root #chat-log .chat-seo-card--actions .chat-seo-group-summary > i,
:root:not([data-manual-theme="dark"]) #chat-root .chat-seo-card--actions .chat-seo-group-summary > i {
  border-right-color: #3a4652 !important;
  border-bottom-color: #3a4652 !important;
}


/* -------------------------------------------------------------------------- */
/* SEO Center card refine — clean list chrome for light + dark                */
/* -------------------------------------------------------------------------- */

#chat-root #chat-log .chat-seo-card.chat-seo-card--actions,
#chat-root .chat-seo-card.chat-seo-card--actions {
  display: grid !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--seo-line, var(--custom-line)) !important;
  border-radius: 12px !important;
  background: var(--seo-surface, var(--custom-panel)) !important;
  box-shadow: 0 10px 28px color-mix(in srgb, #000 12%, transparent) !important;
}

#chat-root #chat-log .chat-seo-card--actions > .chat-seo-head,
#chat-root .chat-seo-card--actions > .chat-seo-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px 14px 10px !important;
  border: 0 !important;
  border-bottom: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-sizing: border-box !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy,
#chat-root .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > div:first-child {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
}

/* Beat theme-final crush: #chat-log .chat-seo-head > div:first-child > small {6.5px} */
#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy > .chat-tool-mode,
#chat-root .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy > .chat-tool-mode,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > div:first-child > .chat-tool-mode {
  margin: 0 !important;
  color: var(--seo-muted) !important;
  font: 650 10px/1.1 "Work Sans", "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy > strong.chat-seo-head-scope,
#chat-root .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy > strong.chat-seo-head-scope,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > div:first-child > strong.chat-seo-head-scope,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > div:first-child > strong {
  max-width: none !important;
  margin: 0 !important;
  color: var(--seo-copy) !important;
  font: 600 13px/1.25 "Work Sans", "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy > small,
#chat-root .chat-seo-card--actions .chat-seo-head > .chat-seo-head-copy > small,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-head > div:first-child > small {
  max-width: none !important;
  margin: 0 !important;
  color: var(--seo-muted) !important;
  font: 500 11px/1.3 "Work Sans", "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

#chat-root #chat-log .chat-seo-card--actions > .chat-seo-head > .chat-seo-score,
#chat-root .chat-seo-card--actions > .chat-seo-head > .chat-seo-score {
  display: grid !important;
  justify-items: end !important;
  align-content: center !important;
  gap: 2px !important;
  min-width: 52px !important;
  min-height: 0 !important;
  padding: 0 0 0 12px !important;
  border: 0 !important;
  border-left: 1px solid var(--seo-line) !important;
  background: transparent !important;
}

#chat-root #chat-log .chat-seo-card--actions > .chat-seo-head > .chat-seo-score > strong,
#chat-root .chat-seo-card--actions > .chat-seo-head > .chat-seo-score > strong {
  color: var(--pf-chat-neon) !important;
  font: 650 22px/1 ui-monospace, SFMono-Regular, Menlo, monospace !important;
  letter-spacing: -0.04em !important;
  font-variant-numeric: tabular-nums !important;
}

#chat-root #chat-log .chat-seo-card--actions > .chat-seo-head > .chat-seo-score > span,
#chat-root .chat-seo-card--actions > .chat-seo-head > .chat-seo-score > span {
  color: var(--seo-muted) !important;
  font: 500 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace !important;
}

#chat-root #chat-log .chat-seo-card--actions > .chat-seo-meter,
#chat-root .chat-seo-card--actions > .chat-seo-meter {
  display: block !important;
  width: calc(100% - 28px) !important;
  height: 3px !important;
  margin: 0 14px 10px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--seo-muted) 18%, transparent) !important;
}

#chat-root #chat-log .chat-seo-card--actions > .chat-seo-meter > span,
#chat-root .chat-seo-card--actions > .chat-seo-meter > span {
  display: block !important;
  width: calc(var(--seo-score, 0) * 1%) !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, var(--pf-chat-neon), color-mix(in srgb, var(--pf-chat-neon) 55%, #7ddea8)) !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-groups,
#chat-root .chat-seo-card--actions .chat-seo-groups {
  display: grid !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 8px 8px !important;
  background: transparent !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group,
#chat-root .chat-seo-card--actions .chat-seo-group,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-group.chat-seo-profile,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-group.chat-seo-category,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-group.chat-seo-group--insights {
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--seo-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group:last-of-type,
#chat-root .chat-seo-card--actions .chat-seo-group:last-of-type {
  border-bottom: 0 !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-summary,
#chat-root .chat-seo-card--actions .chat-seo-group-summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 44px !important;
  padding: 10px 8px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  cursor: pointer !important;
  list-style: none !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-summary::-webkit-details-marker,
#chat-root .chat-seo-card--actions .chat-seo-group-summary::-webkit-details-marker {
  display: none !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-summary > i,
#chat-root .chat-seo-card--actions .chat-seo-group-summary > i {
  width: 7px !important;
  height: 7px !important;
  margin: 0 2px 0 0 !important;
  border: 0 !important;
  border-right: 1.5px solid var(--seo-muted) !important;
  border-bottom: 1.5px solid var(--seo-muted) !important;
  border-radius: 0 !important;
  background: transparent !important;
  transform: rotate(45deg) !important;
  transition: transform 0.16s ease !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group[open] > .chat-seo-group-summary > i,
#chat-root .chat-seo-card--actions .chat-seo-group[open] > .chat-seo-group-summary > i {
  transform: rotate(225deg) !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-summary:hover,
#chat-root .chat-seo-card--actions .chat-seo-group-summary:hover {
  background: var(--seo-hover) !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group[open] > .chat-seo-group-summary,
#chat-root .chat-seo-card--actions .chat-seo-group[open] > .chat-seo-group-summary {
  background: var(--seo-open) !important;
  border-bottom: 0 !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-copy,
#chat-root .chat-seo-card--actions .chat-seo-group-copy {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-copy strong,
#chat-root .chat-seo-card--actions .chat-seo-group-copy strong {
  color: var(--seo-copy) !important;
  font: 650 12px/1.2 "Work Sans", "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-copy small,
#chat-root .chat-seo-card--actions .chat-seo-group-copy small {
  color: var(--seo-muted) !important;
  font: 500 11px/1.25 "Work Sans", "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-meta,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-category-score,
#chat-root .chat-seo-card--actions .chat-seo-group-meta,
#chat-root .chat-seo-card--actions .chat-seo-category-score {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 36px !important;
  height: 22px !important;
  padding: 0 8px !important;
  border: 1px solid var(--seo-line) !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--seo-muted) !important;
  box-shadow: none !important;
  font: 600 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-variant-numeric: tabular-nums !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-group-body,
#chat-root .chat-seo-card--actions .chat-seo-group-body {
  padding: 4px 8px 12px !important;
  background: transparent !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert,
#chat-root .chat-seo-card--actions .chat-seo-insert {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px 12px !important;
  margin: 0 !important;
  padding: 12px 14px 14px !important;
  border: 0 !important;
  border-top: 1px solid var(--seo-line) !important;
  border-radius: 0 !important;
  background: color-mix(in srgb, var(--seo-surface-sunken) 80%, transparent) !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert-copy,
#chat-root .chat-seo-card--actions .chat-seo-insert-copy {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert .chat-tool-mode,
#chat-root .chat-seo-card--actions .chat-seo-insert .chat-tool-mode {
  color: var(--seo-muted) !important;
  font: 650 9px/1 "Work Sans", sans-serif !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert-copy strong,
#chat-root .chat-seo-card--actions .chat-seo-insert-copy strong {
  color: var(--seo-copy) !important;
  font: 600 13px/1.2 "Work Sans", sans-serif !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert-copy small,
#chat-root .chat-seo-card--actions .chat-seo-insert-copy small {
  color: var(--seo-muted) !important;
  font: 500 11px/1.35 "Work Sans", sans-serif !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert > button,
#chat-root .chat-seo-card--actions .chat-seo-insert > button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 0 14px !important;
  border: 1px solid var(--pf-chat-neon) !important;
  border-radius: 999px !important;
  background: var(--pf-chat-neon-soft) !important;
  color: var(--pf-chat-neon) !important;
  font: 650 11px/1 "Work Sans", sans-serif !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  cursor: pointer !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert-status:empty,
#chat-root .chat-seo-card--actions .chat-seo-insert-status:empty {
  display: none !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-insert-status,
#chat-root .chat-seo-card--actions .chat-seo-insert-status {
  grid-column: 1 / -1 !important;
  color: var(--seo-muted) !important;
  font: 500 11px/1.35 "Work Sans", sans-serif !important;
}


/* -------------------------------------------------------------------------- */
/* SEO score factors — placement refine (ring + 2x2)                          */
/* -------------------------------------------------------------------------- */

#chat-root #chat-log .chat-seo-card--actions .chat-seo-scoreboard-hero,
#chat-root .chat-seo-card--actions .chat-seo-scoreboard-hero {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  width: 100% !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-ring,
#chat-root .chat-seo-card--actions .chat-seo-score-ring {
  width: 112px !important;
  height: 112px !important;
  margin: 0 !important;
  justify-self: start !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factors,
#chat-root .chat-seo-card--actions .chat-seo-score-factors {
  list-style: none !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(52px, 1fr) !important;
  gap: 6px !important;
  align-self: stretch !important;
  min-height: 112px !important;
  height: 112px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factor,
#chat-root .chat-seo-card--actions .chat-seo-score-factor {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  grid-template-areas:
    "label value"
    "detail detail" !important;
  align-content: center !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 2px !important;
  min-height: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid var(--seo-line) !important;
  border-radius: 8px !important;
  background: var(--seo-surface-sunken, #1a1d1f) !important;
  box-sizing: border-box !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factor.is-live,
#chat-root .chat-seo-card--actions .chat-seo-score-factor.is-live {
  border-color: color-mix(in srgb, var(--pf-chat-neon) 28%, var(--seo-line)) !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factor > .chat-seo-score-factor-label,
#chat-root .chat-seo-card--actions .chat-seo-score-factor > .chat-seo-score-factor-label,
#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factor > span.chat-seo-score-factor-label,
#chat-root .chat-seo-card--actions .chat-seo-score-factor > span.chat-seo-score-factor-label {
  grid-area: label !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  color: var(--seo-copy) !important;
  font: 650 11px/1.15 "Work Sans", "Helvetica Neue", Arial, sans-serif !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factor > strong,
#chat-root .chat-seo-card--actions .chat-seo-score-factor > strong {
  grid-area: value !important;
  align-self: center !important;
  justify-self: end !important;
  margin: 0 !important;
  color: var(--pf-chat-neon) !important;
  font: 700 15px/1 ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -0.02em !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factor > small,
#chat-root .chat-seo-card--actions .chat-seo-score-factor > small {
  grid-area: detail !important;
  align-self: start !important;
  margin: 0 !important;
  color: var(--seo-muted) !important;
  font: 500 10px/1.25 "Work Sans", "Helvetica Neue", Arial, sans-serif !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factor-label .chat-seo-help,
#chat-root .chat-seo-card--actions .chat-seo-score-factor-label .chat-seo-help {
  flex: 0 0 14px !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
}

@media (max-width: 640px) {
  #chat-root #chat-log .chat-seo-card--actions .chat-seo-scoreboard-hero,
  #chat-root .chat-seo-card--actions .chat-seo-scoreboard-hero {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
  }

  #chat-root #chat-log .chat-seo-card--actions .chat-seo-score-factors,
  #chat-root .chat-seo-card--actions .chat-seo-score-factors {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    grid-auto-rows: minmax(52px, auto) !important;
  }

  #chat-root #chat-log .chat-seo-card--actions .chat-seo-score-ring,
  #chat-root .chat-seo-card--actions .chat-seo-score-ring {
    justify-self: center !important;
  }
}