/* PORTED from projects/fa-creative-hub/css/fa-hubs-notion.css + tokens from styles.css. Do not re-author — re-port if upstream changes. */

/* Scoping approach: Option B (selector prefix).
   Every light-mode selector is prefixed with [data-notion-theme="light"] so the
   ported rules do not leak onto Artemis's existing dark `app.css` chrome.
   The original file already prefixed its dark-mode rules with
   [data-notion-theme="dark"], so those carry over verbatim.
   Rationale for B over A (single CSS-nesting wrap):
     1. Source uses `:root` to declare vars — nesting `:root` under
        [data-notion-theme="light"] would never match anything.
     2. Source uses bare `@media` rules — wrapping them inside a nesting block
        works in modern browsers but the nested-selector parser is finicky with
        complex `:has()` selectors used here.
     3. Source already contains `[data-notion-theme="dark"] ...` rules. Wrapping
        them under [data-notion-theme="light"] would yield the impossible
        compound selector `[data-notion-theme="light"] [data-notion-theme="dark"]`
        and dark mode would silently break.
   Prefix-based scoping sidesteps all three.

   FA-specific selectors (#tab-script-pipeline, #tab-animated-ads, etc.) are
   intentionally kept verbatim. They won't match anything in Artemis but are
   harmless and preserve byte-for-byte parity for the visual diff in Task 24.1.
*/

/* === styles.css token ports ===
   Sourced from projects/fa-creative-hub/css/styles.css :root (lines 9–48).
   Scoped to [data-notion-theme="light"] so artemis dark-theme tokens are
   untouched. Typography font stacks are merged with the Inter stack used
   throughout fa-hubs-notion.css.
*/
[data-notion-theme="light"] {
  /* Colors (light surface variants for the Notion panel) */
  --bg-darkest: #0A0A0A;
  --bg-dark: #111111;
  --bg-medium: #1A1A1A;
  --bg-light: #242424;
  --bg-lighter: #2A2A2A;

  --text-primary: rgba(0, 0, 0, 0.94);
  --text-secondary: #615d59;
  --text-muted: #a39e98;

  --accent: #F0582B;
  --accent-hover: #FF6B3D;
  --accent-muted: rgba(240, 88, 43, 0.2);

  --success: #22C55E;
  --warning: #EAB308;
  --danger: #EF4444;
  --info: #3B82F6;

  --border: rgba(0, 0, 0, 0.10);
  --border-light: rgba(0, 0, 0, 0.065);

  /* Typography */
  --font-ui: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Spacing */
  --sidebar-width: 240px;
  --sidebar-collapsed: 64px;
  --content-padding: 32px;
  --card-radius: 12px;
  --btn-radius: 8px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.10);
}

/* === fa-hubs-notion.css ports ===
   FA Hubs — Notion-inspired design layer
   Scoped to the FA Hubs sidebar routes only. Preserves sidebar/nav shell,
   chibi assistant, and app behavior. For iframe hubs, this can only style the
   parent frame/chrome; the child app must be styled in its own project.
*/

[data-notion-theme="light"] {
  --notion-page: #ffffff;
  --notion-warm-white: #f6f5f4;
  --notion-warm-panel: #fbfaf8;
  --notion-text: rgba(0, 0, 0, 0.94);
  --notion-muted: #615d59;
  --notion-subtle: #a39e98;
  --notion-border: rgba(0, 0, 0, 0.10);
  --notion-soft-border: rgba(0, 0, 0, 0.065);
  --notion-blue: #0075de;
  --notion-focus: #097fe8;
  --notion-card-shadow: rgba(0,0,0,0.04) 0px 4px 18px,
    rgba(0,0,0,0.027) 0px 2.025px 7.84688px,
    rgba(0,0,0,0.02) 0px 0.8px 2.925px,
    rgba(0,0,0,0.01) 0px 0.175px 1.04062px;
  --fa-accent: #f0582b;
  --fa-accent-soft: rgba(240, 88, 43, 0.10);
  --fa-success: #168a46;
  --margin-green: #2f7a2f;
  --margin-yellow: #b07000;
  --margin-red: #c43535;
  --margin-green-bg: #e3f5e3;
  --margin-yellow-bg: #fff8e0;
  --margin-red-bg: #ffe0e0;
  --chip-gold: #b8860b;
  --chip-gold-bg: #fff4e0;
}

/* Notion-dark tokens (originally defined in daily-briefing-notion.css :root).
   Ported here so the [data-notion-theme="dark"] block below is self-contained. */
[data-notion-theme="dark"] {
  --notion-dark-page: #191817;
  --notion-dark-panel: #22211f;
  --notion-dark-card: #2a2926;
  --notion-dark-text: rgba(255, 252, 247, 0.94);
  --notion-dark-muted: #c4bdb4;
  --notion-dark-subtle: #8f8981;
  --notion-dark-border: rgba(255, 252, 247, 0.12);
  --notion-dark-soft-border: rgba(255, 252, 247, 0.08);
  --notion-dark-card-shadow: rgba(0,0,0,0.22) 0px 8px 28px,
    rgba(0,0,0,0.14) 0px 3px 10px,
    rgba(0,0,0,0.10) 0px 1px 4px;
}

[data-notion-theme="light"] .main-content:has(#tab-script-pipeline.active),
[data-notion-theme="light"] .main-content:has(#tab-script-studio.active),
[data-notion-theme="light"] .main-content:has(#tab-animated-ads.active),
[data-notion-theme="light"] .main-content:has(.tab-content-iframe.active) {
  background: linear-gradient(180deg, var(--notion-warm-white) 0%, #ffffff 44%, var(--notion-warm-panel) 100%) !important;
  color: var(--notion-text) !important;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

[data-notion-theme="light"] .main-content:has(#tab-script-pipeline.active) .content-wrapper,
[data-notion-theme="light"] .main-content:has(#tab-script-studio.active) .content-wrapper,
[data-notion-theme="light"] .main-content:has(#tab-animated-ads.active) .content-wrapper {
  max-width: 1320px;
  padding: 40px 44px 72px;
}

[data-notion-theme="light"] #tab-script-pipeline.active,
[data-notion-theme="light"] #tab-script-studio.active,
[data-notion-theme="light"] #tab-animated-ads.active {
  color: var(--notion-text) !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active .page-title,
[data-notion-theme="light"] #tab-script-studio.active .page-title,
[data-notion-theme="light"] #tab-animated-ads.active .page-title,
[data-notion-theme="light"] #tab-script-pipeline.active h1,
[data-notion-theme="light"] #tab-script-studio.active h1,
[data-notion-theme="light"] #tab-animated-ads.active h1 {
  color: var(--notion-text) !important;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: clamp(34px, 3.8vw, 50px) !important;
  line-height: 1.02 !important;
  letter-spacing: -1.55px !important;
  font-weight: 760 !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active .page-subtitle,
[data-notion-theme="light"] #tab-script-studio.active .page-subtitle,
[data-notion-theme="light"] #tab-animated-ads.active .page-subtitle,
[data-notion-theme="light"] #tab-script-pipeline.active p,
[data-notion-theme="light"] #tab-script-studio.active p,
[data-notion-theme="light"] #tab-animated-ads.active p,
[data-notion-theme="light"] #tab-script-pipeline.active .aa-stage-subtitle,
[data-notion-theme="light"] #tab-animated-ads.active .aa-stage-subtitle,
[data-notion-theme="light"] #tab-script-studio.active [style*="color:#888"],
[data-notion-theme="light"] #tab-script-studio.active [style*="color:#999"],
[data-notion-theme="light"] #tab-script-studio.active [style*="color:#666"] {
  color: var(--notion-muted) !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active h2,
[data-notion-theme="light"] #tab-script-pipeline.active h3,
[data-notion-theme="light"] #tab-script-studio.active h2,
[data-notion-theme="light"] #tab-script-studio.active h3,
[data-notion-theme="light"] #tab-animated-ads.active h2,
[data-notion-theme="light"] #tab-animated-ads.active h3,
[data-notion-theme="light"] #tab-animated-ads.active .aa-stage-title,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recent-title,
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-card-header strong,
[data-notion-theme="light"] #tab-script-studio.active [style*="color:#e6e8ee"],
[data-notion-theme="light"] #tab-animated-ads.active [style*="color:#e6e8ee"] {
  color: var(--notion-text) !important;
}

/* Shared white-card treatment for internal hubs. */
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-quota-card,
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-column,
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-card,
[data-notion-theme="light"] #tab-script-pipeline.active .script-detail-panel,
[data-notion-theme="light"] #tab-script-pipeline.active .script-modal,
[data-notion-theme="light"] #tab-script-pipeline.active .script-body,
[data-notion-theme="light"] #tab-script-pipeline.active .pin-feedback-composer,
[data-notion-theme="light"] #tab-script-pipeline.active .side-by-side-pane,
[data-notion-theme="light"] #tab-script-studio.active .studio-controls,
[data-notion-theme="light"] #tab-script-studio.active .studio-track-card,
[data-notion-theme="light"] #tab-script-studio.active #studio-active-track > div,
[data-notion-theme="light"] #tab-script-studio.active form,
[data-notion-theme="light"] #tab-script-studio.active [style*="background:#141414"],
[data-notion-theme="light"] #tab-script-studio.active [style*="background:#0a0a0a"],
[data-notion-theme="light"] #tab-animated-ads.active .aa-stage,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recent-section,
[data-notion-theme="light"] #tab-animated-ads.active .aa-pc-section,
[data-notion-theme="light"] #tab-animated-ads.active .aa-persona-preview,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recommendation-card,
[data-notion-theme="light"] #tab-animated-ads.active .aa-hook-card,
[data-notion-theme="light"] #tab-animated-ads.active .aa-beat-card,
[data-notion-theme="light"] #tab-animated-ads.active .aa-script-card,
[data-notion-theme="light"] #tab-animated-ads.active .aa-pc-component,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recommendations-status,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recommendations-error {
  background: #ffffff !important;
  border: 1px solid var(--notion-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--notion-card-shadow) !important;
  color: var(--notion-text) !important;
}

/* Softer nested surfaces. */
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-column-body,
[data-notion-theme="light"] #tab-script-pipeline.active .script-sidebar,
[data-notion-theme="light"] #tab-script-pipeline.active .script-line,
[data-notion-theme="light"] #tab-script-studio.active .selected-anchor,
[data-notion-theme="light"] #tab-script-studio.active [style*="border:1px dashed"],
[data-notion-theme="light"] #tab-animated-ads.active .aa-pc-body,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recent-body,
[data-notion-theme="light"] #tab-animated-ads.active .aa-discovery-suggestions,
[data-notion-theme="light"] #tab-animated-ads.active .aa-status-banner,
[data-notion-theme="light"] #tab-animated-ads.active .aa-prompt-preview {
  background: var(--notion-warm-panel) !important;
  border-color: var(--notion-soft-border) !important;
  color: var(--notion-text) !important;
}

/* Buttons / controls. */
[data-notion-theme="light"] #tab-script-pipeline.active button,
[data-notion-theme="light"] #tab-script-pipeline.active .btn,
[data-notion-theme="light"] #tab-script-pipeline.active .btn-small,
[data-notion-theme="light"] #tab-script-studio.active button,
[data-notion-theme="light"] #tab-script-studio.active select,
[data-notion-theme="light"] #tab-script-studio.active textarea,
[data-notion-theme="light"] #tab-script-studio.active input,
[data-notion-theme="light"] #tab-animated-ads.active button,
[data-notion-theme="light"] #tab-animated-ads.active select,
[data-notion-theme="light"] #tab-animated-ads.active textarea,
[data-notion-theme="light"] #tab-animated-ads.active input,
[data-notion-theme="light"] #tab-animated-ads.active .aa-select,
[data-notion-theme="light"] #tab-animated-ads.active .aa-textarea {
  font-family: 'Inter', system-ui, sans-serif !important;
  border-radius: 6px !important;
}

[data-notion-theme="light"] #tab-script-studio.active select,
[data-notion-theme="light"] #tab-script-studio.active textarea,
[data-notion-theme="light"] #tab-script-studio.active input,
[data-notion-theme="light"] #tab-animated-ads.active select,
[data-notion-theme="light"] #tab-animated-ads.active textarea,
[data-notion-theme="light"] #tab-animated-ads.active input,
[data-notion-theme="light"] #tab-animated-ads.active .aa-select,
[data-notion-theme="light"] #tab-animated-ads.active .aa-textarea {
  background: #ffffff !important;
  border: 1px solid var(--notion-border) !important;
  color: var(--notion-text) !important;
  box-shadow: rgba(0,0,0,0.02) 0 1px 2px !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active .btn-primary,
[data-notion-theme="light"] #tab-script-pipeline.active button[style*="var(--accent)"],
[data-notion-theme="light"] #tab-script-studio.active button[type="submit"],
[data-notion-theme="light"] #tab-animated-ads.active .aa-btn-primary {
  background: var(--fa-accent) !important;
  border-color: var(--fa-accent) !important;
  color: #ffffff !important;
  box-shadow: rgba(240,88,43,0.22) 0 4px 12px !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active .btn-secondary,
[data-notion-theme="light"] #tab-script-pipeline.active .btn-small,
[data-notion-theme="light"] #tab-script-studio.active button:not([type="submit"]),
[data-notion-theme="light"] #tab-animated-ads.active .aa-btn-secondary,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recent-refresh,
[data-notion-theme="light"] #tab-animated-ads.active .aa-pc-toggle {
  background: #ffffff !important;
  border: 1px solid var(--notion-border) !important;
  color: var(--notion-muted) !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-card:hover,
[data-notion-theme="light"] #tab-script-studio.active .studio-track-card:hover,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recommendation-card:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(240, 88, 43, 0.28) !important;
  box-shadow: var(--notion-card-shadow) !important;
}

[data-notion-theme="light"] #tab-animated-ads.active .aa-stage:hover {
  transform: none !important;
  border-color: var(--notion-border) !important;
  box-shadow: var(--notion-card-shadow) !important;
}

/* Badges / chips / metadata. */
[data-notion-theme="light"] #tab-script-pipeline.active .brand-tag,
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-chip,
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-column-count,
[data-notion-theme="light"] #tab-script-studio.active [style*="color:#a5b4fc"],
[data-notion-theme="light"] #tab-animated-ads.active .aa-persona-preview-label {
  background: var(--fa-accent-soft) !important;
  border-color: rgba(240, 88, 43, 0.22) !important;
  color: var(--fa-accent) !important;
  border-radius: 9999px !important;
}

/* Animated Ads labels are full-width/block elements, not pills. Do not give
   them chip backgrounds — it creates the horizontal orange/brown bands Josh
   saw around Stage 1 / Product / Persona, especially in dark mode. */
[data-notion-theme="light"] #tab-animated-ads.active .aa-stage-num,
[data-notion-theme="light"] #tab-animated-ads.active .aa-field-label {
  background: transparent !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  color: var(--fa-accent) !important;
}

[data-notion-theme="light"] #tab-animated-ads.active .aa-field-hint {
  background: transparent !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  color: var(--notion-muted) !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-card-meta,
[data-notion-theme="light"] #tab-script-pipeline.active .pipeline-empty,
[data-notion-theme="light"] #tab-script-studio.active span,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recent-hint,
[data-notion-theme="light"] #tab-animated-ads.active .aa-recommendations-hint {
  color: var(--notion-muted) !important;
}

/* Keep semantic status colors readable on light surfaces. */
[data-notion-theme="light"] #tab-script-pipeline.active [style*="var(--success)"],
[data-notion-theme="light"] #tab-script-studio.active [style*="var(--success)"],
[data-notion-theme="light"] #tab-animated-ads.active [style*="var(--success)"] {
  color: var(--fa-success) !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active [style*="var(--danger)"],
[data-notion-theme="light"] #tab-script-studio.active [style*="var(--danger)"],
[data-notion-theme="light"] #tab-animated-ads.active [style*="var(--danger)"] {
  color: #c2410c !important;
}

[data-notion-theme="light"] #tab-script-pipeline.active [style*="var(--warning)"],
[data-notion-theme="light"] #tab-script-studio.active [style*="var(--warning)"],
[data-notion-theme="light"] #tab-animated-ads.active [style*="var(--warning)"] {
  color: #a16207 !important;
}

/* Embedded hubs: style only the parent frame/chrome from fa-creative-hub. */
[data-notion-theme="light"] .tab-content-iframe.active {
  background: var(--notion-warm-white) !important;
  padding: 18px !important;
}

[data-notion-theme="light"] .tab-content-iframe.active .hub-iframe {
  background: #ffffff !important;
  border: 1px solid var(--notion-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--notion-card-shadow) !important;
  overflow: hidden !important;
}

@media (max-width: 768px) {
  [data-notion-theme="light"] .main-content:has(#tab-script-pipeline.active) .content-wrapper,
  [data-notion-theme="light"] .main-content:has(#tab-script-studio.active) .content-wrapper,
  [data-notion-theme="light"] .main-content:has(#tab-animated-ads.active) .content-wrapper {
    padding: 72px 16px 48px !important;
  }

  [data-notion-theme="light"] #tab-script-studio.active form,
  [data-notion-theme="light"] #tab-animated-ads.active .aa-form {
    grid-template-columns: 1fr !important;
  }
}


[data-notion-theme="dark"] .main-content:has(#tab-script-pipeline.active),
[data-notion-theme="dark"] .main-content:has(#tab-script-studio.active),
[data-notion-theme="dark"] .main-content:has(#tab-animated-ads.active),
[data-notion-theme="dark"] .main-content:has(.tab-content-iframe.active) {
  background: linear-gradient(180deg, var(--notion-dark-page) 0%, #1f1e1c 44%, #171614 100%) !important;
  color: var(--notion-dark-text) !important;
}

[data-notion-theme="dark"] #tab-script-pipeline.active,
[data-notion-theme="dark"] #tab-script-studio.active,
[data-notion-theme="dark"] #tab-animated-ads.active,
[data-notion-theme="dark"] #tab-script-pipeline.active .page-title,
[data-notion-theme="dark"] #tab-script-studio.active .page-title,
[data-notion-theme="dark"] #tab-animated-ads.active .page-title,
[data-notion-theme="dark"] #tab-script-pipeline.active h1,
[data-notion-theme="dark"] #tab-script-studio.active h1,
[data-notion-theme="dark"] #tab-animated-ads.active h1,
[data-notion-theme="dark"] #tab-script-pipeline.active h2,
[data-notion-theme="dark"] #tab-script-pipeline.active h3,
[data-notion-theme="dark"] #tab-script-studio.active h2,
[data-notion-theme="dark"] #tab-script-studio.active h3,
[data-notion-theme="dark"] #tab-animated-ads.active h2,
[data-notion-theme="dark"] #tab-animated-ads.active h3,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-stage-title,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recent-title,
[data-notion-theme="dark"] #tab-script-pipeline.active .pipeline-card-header strong,
[data-notion-theme="dark"] #tab-script-studio.active [style*="color:#e6e8ee"],
[data-notion-theme="dark"] #tab-animated-ads.active [style*="color:#e6e8ee"] {
  color: var(--notion-dark-text) !important;
}

[data-notion-theme="dark"] #tab-script-pipeline.active .page-subtitle,
[data-notion-theme="dark"] #tab-script-studio.active .page-subtitle,
[data-notion-theme="dark"] #tab-animated-ads.active .page-subtitle,
[data-notion-theme="dark"] #tab-script-pipeline.active p,
[data-notion-theme="dark"] #tab-script-studio.active p,
[data-notion-theme="dark"] #tab-animated-ads.active p,
[data-notion-theme="dark"] #tab-script-pipeline.active .pipeline-card-meta,
[data-notion-theme="dark"] #tab-script-pipeline.active .pipeline-empty,
[data-notion-theme="dark"] #tab-script-studio.active span,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-stage-subtitle,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recent-hint,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recommendations-hint,
[data-notion-theme="dark"] #tab-script-studio.active [style*="color:#888"],
[data-notion-theme="dark"] #tab-script-studio.active [style*="color:#999"],
[data-notion-theme="dark"] #tab-script-studio.active [style*="color:#666"] {
  color: var(--notion-dark-muted) !important;
}

[data-notion-theme="dark"] #tab-script-pipeline.active .pipeline-quota-card,
[data-notion-theme="dark"] #tab-script-pipeline.active .pipeline-column,
[data-notion-theme="dark"] #tab-script-pipeline.active .pipeline-card,
[data-notion-theme="dark"] #tab-script-pipeline.active .script-detail-panel,
[data-notion-theme="dark"] #tab-script-pipeline.active .script-modal,
[data-notion-theme="dark"] #tab-script-pipeline.active .script-body,
[data-notion-theme="dark"] #tab-script-pipeline.active .pin-feedback-composer,
[data-notion-theme="dark"] #tab-script-pipeline.active .side-by-side-pane,
[data-notion-theme="dark"] #tab-script-studio.active .studio-controls,
[data-notion-theme="dark"] #tab-script-studio.active .studio-track-card,
[data-notion-theme="dark"] #tab-script-studio.active #studio-active-track > div,
[data-notion-theme="dark"] #tab-script-studio.active form,
[data-notion-theme="dark"] #tab-script-studio.active [style*="background:#141414"],
[data-notion-theme="dark"] #tab-script-studio.active [style*="background:#0a0a0a"],
[data-notion-theme="dark"] #tab-animated-ads.active .aa-stage,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recent-section,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-pc-section,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-persona-preview,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recommendation-card,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-hook-card,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-beat-card,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-script-card,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-pc-component,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recommendations-status,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recommendations-error {
  background: var(--notion-dark-card) !important;
  border-color: var(--notion-dark-border) !important;
  box-shadow: var(--notion-dark-card-shadow) !important;
  color: var(--notion-dark-text) !important;
}

[data-notion-theme="dark"] #tab-script-pipeline.active .pipeline-column-body,
[data-notion-theme="dark"] #tab-script-pipeline.active .script-sidebar,
[data-notion-theme="dark"] #tab-script-pipeline.active .script-line,
[data-notion-theme="dark"] #tab-script-studio.active .selected-anchor,
[data-notion-theme="dark"] #tab-script-studio.active [style*="border:1px dashed"],
[data-notion-theme="dark"] #tab-animated-ads.active .aa-pc-body,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recent-body,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-discovery-suggestions,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-status-banner,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-prompt-preview {
  background: var(--notion-dark-panel) !important;
  border-color: var(--notion-dark-soft-border) !important;
  color: var(--notion-dark-text) !important;
}

[data-notion-theme="dark"] #tab-script-studio.active select,
[data-notion-theme="dark"] #tab-script-studio.active textarea,
[data-notion-theme="dark"] #tab-script-studio.active input,
[data-notion-theme="dark"] #tab-animated-ads.active select,
[data-notion-theme="dark"] #tab-animated-ads.active textarea,
[data-notion-theme="dark"] #tab-animated-ads.active input,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-select,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-textarea,
[data-notion-theme="dark"] #tab-script-pipeline.active .btn-secondary,
[data-notion-theme="dark"] #tab-script-pipeline.active .btn-small,
[data-notion-theme="dark"] #tab-script-studio.active button:not([type="submit"]),
[data-notion-theme="dark"] #tab-animated-ads.active .aa-btn-secondary,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-recent-refresh,
[data-notion-theme="dark"] #tab-animated-ads.active .aa-pc-toggle {
  background: var(--notion-dark-card) !important;
  border-color: var(--notion-dark-border) !important;
  color: var(--notion-dark-muted) !important;
}

[data-notion-theme="dark"] .tab-content-iframe.active {
  background: var(--notion-dark-page) !important;
}

[data-notion-theme="dark"] .tab-content-iframe.active .hub-iframe {
  background: var(--notion-dark-card) !important;
  border-color: var(--notion-dark-border) !important;
  box-shadow: var(--notion-dark-card-shadow) !important;
}

/* === Sidebar tokens — ported from fa-creative-hub/css/styles.css ===
   Story 6B: Command Center sidebar inherits Notion design language. */

[data-notion-theme="light"] {
  --sidebar-width: 240px;
  --sidebar-width-collapsed: 64px;
  --sidebar-bg: #fbfaf9;
  --sidebar-border: rgba(0, 0, 0, 0.07);
  --sidebar-item-color: #37352f;
  --sidebar-item-color-active: #1f1d18;
  --sidebar-item-hover-bg: rgba(55, 53, 47, 0.06);
  --sidebar-item-active-bg: rgba(35, 131, 226, 0.10);
  --sidebar-section-label-color: #9b9a97;
  --sidebar-icon-size: 18px;
}

[data-notion-theme="dark"] {
  --sidebar-width: 240px;
  --sidebar-width-collapsed: 64px;
  --sidebar-bg: #1f1f1f;
  --sidebar-border: rgba(255, 255, 255, 0.06);
  --sidebar-item-color: #cfcfcf;
  --sidebar-item-color-active: #ffffff;
  --sidebar-item-hover-bg: rgba(255, 255, 255, 0.05);
  --sidebar-item-active-bg: rgba(35, 131, 226, 0.18);
  --sidebar-section-label-color: #7a7a7a;
  --sidebar-icon-size: 18px;
}