/* Light theme component overrides */
:root[data-theme='light'] .app-nav {
  background: var(--bg-panel);
}

:root[data-theme='light'] .pill {
  background: var(--bg-accent-soft);
  color: var(--neutral-600);
}

:root[data-theme='light'] html {
  color-scheme: light;
}

:root[data-theme='light'] body {
  background: var(--bg-app);
}

:root[data-theme='light'] .field,
:root[data-theme='light'] .textarea,
:root[data-theme='light'] .select {
  background: var(--bg-card-soft);
}

:root[data-theme='light'] .btn {
  background: var(--neutral-700);
  border-color: var(--neutral-600);
  color: var(--neutral-100);
}

:root[data-theme='light'] .story-row:hover,
:root[data-theme='light'] .story-row:focus-visible {
  background: var(--bg-accent-soft);
}

:root[data-theme='light'] .icon-button:hover {
  background: var(--bg-danger-soft);
}

:root[data-theme='light'] .icon-button--inspect:hover {
  background: color-mix(in srgb, var(--vibrance-success) 12%, transparent);
}

:root[data-theme='light'] .filter-chip.is-active,
:root[data-theme='light'] .filter-chip:hover {
  background: var(--bg-accent-soft);
}

:root[data-theme='light'] .choice-card {
  background: transparent;
}

:root[data-theme='light'] .source-row,
:root[data-theme='light'] .editor-dropzone {
  background: var(--bg-card-soft);
}

:root[data-theme='light'] .sequence-item {
  background: transparent;
}

:root[data-theme='light'] .dna-doc-card,
:root[data-theme='light'] .dna-profile-card {
  background: var(--bg-card-soft);
}

:root[data-theme='light'] .settings-item {
  background: transparent;
}

:root[data-theme='light'] .content-slide__image {
  background: var(--bg-card-soft);
}

:root[data-theme='light'] .story-modal__backdrop {
  background: var(--bg-overlay);
}

:root[data-theme='light'] .toast {
  background: var(--bg-panel);
}