/* Waveform Lab theme sync: the page follows app theme, the oscilloscope screen stays dark. */
html[data-theme="light"] body[data-active-panel="waveform"],
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) {
  background: #f5f8fc !important;
  color: #0f172a !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .main,
html[data-theme="light"] body[data-active-panel="waveform"] .content,
html[data-theme="light"] body[data-active-panel="waveform"] .panel[data-panel="waveform"].active,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .main,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .content,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .panel[data-panel="waveform"].active {
  background:
    radial-gradient(circle at 20% 0%, rgba(91, 140, 255, 0.12), transparent 32%),
    radial-gradient(circle at 88% 6%, rgba(124, 77, 255, 0.1), transparent 30%),
    #f5f8fc !important;
  color: #0f172a !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .topbar,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .topbar {
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom-color: rgba(148, 163, 184, 0.18) !important;
  color: #0f172a !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .topbar h1,
html[data-theme="light"] body[data-active-panel="waveform"] .topbar h2,
html[data-theme="light"] body[data-active-panel="waveform"] .topbar-user-trigger strong,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .topbar h1,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .topbar h2,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .topbar-user-trigger strong {
  color: #0f172a !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .topbar-search input,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .topbar-search input {
  background: rgba(255, 255, 255, 0.96) !important;
  color: #0f172a !important;
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.22) !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .topbar-search input::placeholder,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .topbar-search input::placeholder {
  color: #94a3b8 !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .waveform-investigation-shell,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-investigation-shell {
  color: #0f172a !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .waveform-investigation-hero,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-measure-card,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-diagnosis-card,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-info-card,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-note-card,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-ai-panel,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-ai-card,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-investigation-hero,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-measure-card,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-diagnosis-card,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-info-card,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-note-card,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-ai-panel,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-ai-card {
  background: rgba(255, 255, 255, 0.94) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.07) !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .waveform-scope-card-main,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-scope-card-main {
  background:
    radial-gradient(circle at 50% 16%, rgba(56, 189, 248, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(9, 20, 36, 0.97), rgba(4, 11, 22, 0.99)) !important;
  border-color: rgba(30, 41, 59, 0.18) !important;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.14) !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .waveform-investigation-title h2,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-card-head h3,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-ai-panel h3,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-info-grid strong,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-diagnosis-copy strong,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-investigation-title h2,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-card-head h3,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-ai-panel h3,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-info-grid strong,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-diagnosis-copy strong {
  color: #0f172a !important;
}

html[data-theme="light"] body[data-active-panel="waveform"] .waveform-investigation-title p,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-card-head span,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-info-grid span,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-diagnosis-copy small,
html[data-theme="light"] body[data-active-panel="waveform"] .waveform-diagnosis-copy em,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-investigation-title p,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-card-head span,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-info-grid span,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-diagnosis-copy small,
html[data-theme="light"] body:has(.panel[data-panel="waveform"].active) .waveform-diagnosis-copy em {
  color: #64748b !important;
}