/*
 * Camada final do tema escuro.
 *
 * Este arquivo e carregado por ultimo para manter a aparencia do tema claro
 * intacta e evitar que estilos de modulos mais antigos sobrescrevam as cores
 * de contraste do tema escuro.
 */
body[data-theme="dark"] {
  --contrast-page: #0b1020;
  --contrast-surface: #111827;
  --contrast-raised: #182238;
  --contrast-raised-strong: #222d46;
  --contrast-border: #475569;
  --contrast-text: #f8fafc;
  --contrast-muted: #cbd5e1;
  --contrast-accent: #ddd6fe;
  --contrast-purple: #6d28d9;
  --contrast-purple-strong: #5b21b6;
  background-color: var(--contrast-page) !important;
}

/* Base compartilhada: botões, campos e navegação. */
body[data-theme="dark"] #appShell,
body[data-theme="dark"] #appShell > .vibra-app-top,
body[data-theme="dark"] #appShell > nav.app-nav {
  color: var(--contrast-text);
  background-color: var(--contrast-page);
}

/* O modal de repertório deixa uma faixa do app-shell exposta ao lado da
   navegação desktop. Sem esta regra, uma cor clara legada aparece nessa área. */
body[data-theme="dark"] #appShell.is-saved-active {
  background: var(--contrast-page) !important;
}

body[data-theme="dark"] #appShell .vibra-logo-text,
body[data-theme="dark"] #appShell .vibra-logo-subtitle {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #appShell > nav.app-nav,
body[data-theme="dark"] #appShell .desktop-home-menu {
  border-color: rgba(196, 181, 253, 0.22) !important;
  background: #12182a !important;
}

body[data-theme="dark"] #appShell .desktop-home-nav-item:not(.is-active),
body[data-theme="dark"] #appShell .desktop-home-list-more:not(.is-active),
body[data-theme="dark"] #appShell .nav-button:not(.is-active) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] #appShell .desktop-home-nav-item:not(.is-active) svg,
body[data-theme="dark"] #appShell .desktop-home-list-more:not(.is-active) svg,
body[data-theme="dark"] #appShell .nav-button:not(.is-active) .nav-icon {
  color: #a5b4fc !important;
}

body[data-theme="dark"] #appShell .desktop-home-nav-item:hover,
body[data-theme="dark"] #appShell .desktop-home-nav-item:focus-visible,
body[data-theme="dark"] #appShell .desktop-home-list-more:hover,
body[data-theme="dark"] #appShell .desktop-home-list-more:focus-visible,
body[data-theme="dark"] #appShell .nav-button:hover,
body[data-theme="dark"] #appShell .nav-button:focus-visible {
  color: var(--contrast-text) !important;
  background: rgba(124, 58, 237, 0.28) !important;
}

body[data-theme="dark"] #appShell .desktop-home-nav-item.is-active,
body[data-theme="dark"] #appShell .desktop-home-nav-item.is-active span,
body[data-theme="dark"] #appShell .desktop-home-nav-item.is-active svg,
body[data-theme="dark"] #appShell .nav-button.is-active,
body[data-theme="dark"] #appShell .nav-button.is-active .nav-icon {
  color: #ffffff !important;
}

body[data-theme="dark"] #appShell :where(input, textarea, select) {
  border-color: var(--contrast-border);
  color: var(--contrast-text);
  background-color: var(--contrast-surface);
}

body[data-theme="dark"] #appShell select option {
  color: var(--contrast-text);
  background: var(--contrast-surface);
}

body[data-theme="dark"] #appShell .secondary-button:not(.is-active),
body[data-theme="dark"] #appShell .ghost:not(.is-active) {
  border-color: var(--contrast-border) !important;
  color: var(--contrast-muted) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] #appShell .secondary-button:not(.is-active):hover,
body[data-theme="dark"] #appShell .secondary-button:not(.is-active):focus-visible,
body[data-theme="dark"] #appShell .ghost:not(.is-active):hover,
body[data-theme="dark"] #appShell .ghost:not(.is-active):focus-visible {
  color: #ffffff !important;
  border-color: #a78bfa !important;
  background: #312e62 !important;
}

body[data-theme="dark"] #authShell .auth-submit {
  color: #ffffff !important;
  background: linear-gradient(135deg, #6d28d9, #4c1d95) !important;
}

/* Home: elimina textos escuros que restavam sobre os cards noturnos. */
body[data-theme="dark"] #appShell.is-home-active :where(
  #homeNextGreeting,
  .home-next-greeting h1,
  .home-next-greeting h2,
  .home-next-heading h2,
  .home-next-card h2,
  .home-next-card h3,
  .home-next-card strong,
  .home-next-journey h2,
  .home-next-step strong,
  .home-next-profile-card strong
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #appShell.is-home-active :where(
  .home-next-greeting p,
  .home-next-card p,
  .home-next-card small,
  .home-next-card span,
  .home-next-journey p,
  .home-next-step p,
  .home-next-profile-card small,
  .home-next-profile-card span
) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] #appShell.is-home-active :where(
  .home-next-shortcuts > button,
  .home-next-card-head button,
  .home-next-profile-completion,
  #homeNextProfileCompletion
) {
  border-color: rgba(196, 181, 253, 0.28) !important;
  color: var(--contrast-text) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] #appShell.is-home-active :where(
  .home-next-shortcuts > button strong,
  .home-next-shortcuts > button small,
  .home-next-card-head button,
  #homeNextProfileCompletion strong,
  #homeNextProfileCompletion small,
  #desktopHomeProfileMessage
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #appShell.is-home-active #homeNextRepertoireCover {
  color: #ffffff !important;
  background: linear-gradient(135deg, #7c3aed, #4c1d95) !important;
}

body[data-theme="dark"] #appShell.is-home-active :where(
  .home-next-eyebrow,
  .home-next-suggested-label,
  .home-next-step-copy > span
) {
  color: var(--contrast-accent) !important;
}

/* Comunidade. */
body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] :where(
  .community-trending-card,
  .community-network-card,
  .community-new-person,
  .community-metric,
  .community-card-media
) {
  border-color: rgba(196, 181, 253, 0.24) !important;
  color: var(--contrast-text) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-card-media {
  background: linear-gradient(135deg, #5b21b6, #312e81) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] :where(
  .community-card-media span,
  .community-card-media button,
  .community-new-avatar
) {
  color: #ffffff !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-new-avatar {
  background: #6d28d9 !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] :where(
  .community-card-title span,
  .community-network-card small,
  .community-trending-card small,
  .community-metric small,
  .community-moment-copy p
) {
  color: var(--contrast-accent) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] :where(
  .community-trending-card strong,
  .community-network-card strong,
  .community-metric strong
) {
  color: var(--contrast-text) !important;
}

/* Cadastro de música. */
body[data-theme="dark"] .vibra-song-form-page :where(
  .vibra-form-card,
  .vibra-tip-card,
  .tone-info-section,
  .tone-auto-field,
  .tone-reminder-wrapper
) {
  border-color: rgba(196, 181, 253, 0.24) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] .vibra-song-form-page :where(
  #song-remember-title,
  #song-tips-title,
  .tone-info-title-row h3,
  .tone-info-column > label
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .vibra-song-form-page :where(
  .vibra-card-head p,
  .tone-info-title-row p,
  .tone-info-column > label,
  .vibra-tip-card p
) {
  color: var(--contrast-muted) !important;
}

/* Afinador e detector de tom. */
body[data-theme="dark"] .tuner-card-title span {
  color: var(--contrast-accent) !important;
  background: #2e2558 !important;
}

body[data-theme="dark"] .tuner-string-grid small {
  color: #ffffff !important;
  background: #5b21b6 !important;
}

body[data-theme="dark"] .tuner-string-grid :where(span, em),
body[data-theme="dark"] .tuner-tip-card p {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] #clearKeyDetector,
body[data-theme="dark"] #clearKeyDetector :is(span, svg) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .detector-window-controls button {
  color: var(--contrast-muted) !important;
  background: transparent !important;
}

body[data-theme="dark"] .detector-window-controls button[aria-pressed="true"] {
  color: #ffffff !important;
  background: var(--contrast-purple) !important;
}

/* Dicionário de acordes. */
body[data-theme="dark"] .dictionary-chord-card :where(dt, header span, .dictionary-card-meta) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] .dictionary-chord-card :where(dd, strong, .chord-open, .chord-muted) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #dbChordPageLabel {
  color: var(--contrast-muted) !important;
}

/* Escalas: desktop e mobile usam o mesmo conjunto de cores de leitura. */
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  .scale-redesign-head,
  .scale-redesign-tip,
  .scale-control-card,
  .scale-kind-select,
  .scale-segment,
  .scale-bpm-control,
  .scale-note-detail,
  .scale-how-to,
  .scale-harmonic-details,
  .scale-note-list-item:not(.is-root)
) {
  border-color: rgba(196, 181, 253, 0.26) !important;
  color: var(--contrast-text) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  #scale-title,
  .scale-redesign-title h2,
  .scale-redesign-tip strong,
  .scale-control-card h3,
  #scaleViewerTitle,
  .scale-notes-panel h3,
  .scale-how-to strong,
  .scale-harmonic-details summary
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  #scaleInstrumentLabel,
  #scaleInstrumentDescription,
  .scale-redesign-title > div > span,
  .scale-redesign-tip small,
  #scaleViewerMeta,
  .scale-fretboard-titlebar span,
  .scale-open-header,
  .scale-legend,
  .scale-note-detail,
  .scale-how-to small
) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  .scale-kind-select,
  .scale-tone-button,
  .scale-desktop-display-toggle button,
  .scale-accidental-toggle button,
  .scale-segment button,
  .scale-bpm-control button
) {
  border-color: #4c5f89 !important;
  color: var(--contrast-text) !important;
  background: #202a40 !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  .scale-tone-button.is-selected,
  .scale-tone-button[aria-pressed="true"],
  .scale-desktop-display-toggle button.is-active,
  .scale-desktop-display-toggle button[aria-pressed="true"],
  .scale-accidental-toggle button.is-active,
  .scale-accidental-toggle button[aria-pressed="true"],
  .scale-segment button.is-active,
  .scale-segment button[aria-pressed="true"]
) {
  color: #ffffff !important;
  border-color: #8b5cf6 !important;
  background: var(--contrast-purple) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-note-list-item:not(.is-root) :where(span, strong, small) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-note-list-item:not(.is-root) > span {
  color: #ffffff !important;
  background: #43306c !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-note-list-item.is-root,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-note-list-item.is-root :where(span, strong, small) {
  color: #ffffff !important;
  background-color: var(--contrast-purple) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  .scale-fret-numbers span,
  .scale-mobile-fret-numbers span,
  .scale-mobile-string-name,
  .scale-open-string-label
) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  .scale-fret.is-scale-note strong,
  .scale-fret.is-root-note strong,
  .scale-open-note.is-scale-note strong
) {
  color: #ffffff !important;
  border-color: #c4b5fd !important;
  background: var(--contrast-purple) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret.is-outside-note strong {
  color: var(--contrast-text) !important;
  border-color: #94a3b8 !important;
  background: #334155 !important;
}

/* Repertórios e bandas: os poucos textos que ainda herdavam tinta escura. */
body[data-theme="dark"] .saved-repertoires-panel[data-section-panel="salvos"] :where(
  .saved-head .eyebrow,
  .saved-library-section-head h3,
  .saved-library-section-head h3 span,
  .saved-filter-button,
  #savedVisibleCount
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .band-panel[data-section-panel="bandas"] .band-kicker {
  color: var(--contrast-accent) !important;
}

/* Batucada. */
body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] .batucada-module-header {
  border-color: rgba(167, 139, 250, 0.32) !important;
  background: linear-gradient(135deg, #171331, #201a42) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] :where(
  .batucada-head-copy h2,
  .batucada-card-heading strong,
  .batucada-summary-value,
  .batucada-training-card strong,
  .batucada-main-card strong,
  .batucada-practice-card strong,
  .batucada-count-card strong
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] :where(
  .batucada-head-copy .eyebrow,
  .batucada-head-copy > span,
  .batucada-load-status,
  #batucadaLoadStatus,
  .batucada-summary-card small,
  .batucada-summary-card p,
  .batucada-training-card small,
  .batucada-speed-card small,
  .batucada-tip-card p
) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] :where(
  .batucada-summary-icon,
  .batucada-card-icon,
  .batucada-info-chip,
  .batucada-practice-options button:not(.is-selected),
  .batucada-suggestion-list button:not(.is-selected),
  .batucada-dial-stepper button,
  .batucada-tap-button,
  #batucadaStop,
  #batucadaTipDismiss
) {
  border-color: #596987 !important;
  color: var(--contrast-accent) !important;
  background: #202a40 !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] :where(
  .batucada-practice-options button.is-selected,
  .batucada-suggestion-list button.is-selected
) {
  color: #ffffff !important;
  background: var(--contrast-purple) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] :where(
  #batucadaRateDisplay,
  .batucada-dial-content > span
) {
  color: var(--contrast-accent) !important;
}

/* Regras legadas aplicam tinta diretamente nos filhos da navegação. */
body[data-theme="dark"] #appShell .desktop-home-menu :where(
  .desktop-home-nav-item:not(.is-active) > span,
  .desktop-home-list-more:not(.is-active) > span,
  .desktop-home-list-heading > span
) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] #appShell .desktop-home-menu :where(
  .desktop-home-nav-item:not(.is-active) > svg,
  .desktop-home-list-more:not(.is-active) > svg
) {
  color: #a5b4fc !important;
}

body[data-theme="dark"] #appShell .desktop-home-menu :where(
  .desktop-home-nav-item.is-active > span,
  .desktop-home-list-more.is-active,
  .desktop-home-list-more.is-active > span,
  .desktop-home-list-more.is-active > svg
) {
  color: #ffffff !important;
}

/* Complementos da Home que possuem IDs e cores locais. */
body[data-theme="dark"] #appShell.is-home-active :where(
  #homeNextUserName,
  #homeNextProfileAvatar,
  #homeNextProfileLevel,
  #desktopHomeProfilePercent,
  .home-next-rail-card .home-next-card-head button,
  .home-next-rail-card .home-next-card-head button span
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #appShell.is-home-active :where(
  #homeNextProfileAvatar,
  #homeNextProfileLevel,
  #desktopHomeProfilePercent
) {
  background: #34285f !important;
}

/* Componentes sociais com fundos claros próprios. */
body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-new-person > span {
  color: #ffffff !important;
  background: #3d2b72 !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-network-card :where(
  .community-network-grid > button,
  .community-network-grid > button small,
  .community-side-head h3,
  .community-side-head button
) {
  color: var(--contrast-text) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-network-card .community-network-grid > button {
  border-color: rgba(196, 181, 253, 0.26) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] :where(
  .community-head .eyebrow,
  .community-head .community-intro > span,
  .community-vibrando-label
) {
  color: #ffffff !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-tip-card {
  border-color: rgba(196, 181, 253, 0.26) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-tip-card :where(strong, p, small) {
  color: var(--contrast-text) !important;
}

/* Detalhes da página de cadastro. */
body[data-theme="dark"] .vibra-song-form-page :where(
  .vibra-tips-list li,
  .vibra-theory-empty,
  .tone-auto-field__text,
  .tone-reminder-wrapper input
) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] .vibra-song-form-page .tone-info-column.tone-reminder {
  background: var(--contrast-raised) !important;
}

/* Notas abertas e notas do braço: cada marcador recebe fundo escuro o bastante. */
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  .scale-open-note > strong,
  .scale-fret > strong,
  .scale-mobile-note > strong,
  .scale-mobile-open-note > strong
) {
  color: #ffffff !important;
  border-color: #c4b5fd !important;
  background: var(--contrast-purple) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel :where(
  .scale-fret.is-outside-note > strong,
  .scale-mobile-note.is-outside-note > strong
) {
  color: var(--contrast-text) !important;
  border-color: #94a3b8 !important;
  background: #334155 !important;
}

/* Repertório: filtros e contadores ainda tinham superfícies claras. */
body[data-theme="dark"] .saved-repertoires-panel[data-section-panel="salvos"] :where(
  .saved-filter-button,
  .saved-filter-button span,
  #savedVisibleCount
) {
  border-color: var(--contrast-border) !important;
  color: var(--contrast-text) !important;
  background: var(--contrast-raised) !important;
}

/* Batucada possui regras de título/estado de maior especificidade no módulo. */
body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] :where(
  #batucada-title,
  .batucada-head-copy .eyebrow,
  .batucada-head-copy > span,
  #batucadaLoadStatus,
  .batucada-training-track small,
  .batucada-suggestion-list button.is-selected small
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] #batucadaLoadStatus {
  border-color: #596987 !important;
  background: #202a40 !important;
}

body[data-theme="dark"] #lyricsFullscreenCard#lyricsFullscreenCard .lyrics-fullscreen-practice-row {
  border-color: #8b5cf6 !important;
  color: #f5f3ff !important;
  background: #2a2148 !important;
}

body[data-theme="dark"] #lyricsFullscreenCard#lyricsFullscreenCard .lyrics-fullscreen-practice-row span {
  background: #4c3688 !important;
}

body[data-theme="dark"] #lyricsFullscreenCard#lyricsFullscreenCard .lyrics-fullscreen-training-timer {
  border-color: #3f4d68 !important;
  color: #d7dfef !important;
  background: #182238 !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025) !important;
}

body[data-theme="dark"] #lyricsFullscreenCard#lyricsFullscreenCard .lyrics-fullscreen-training-timer strong {
  color: #f3f6ff !important;
}


/* O shell ocupa toda a área útil da aplicação. Sem esta regra, o fundo
   branco legado aparece nas faixas vazias ao redor dos módulos escuros. */
body[data-theme="dark"] main#appShell.app-shell {
  color: var(--contrast-text) !important;
  background: var(--contrast-page) !important;
}

/* Escalas: todos os marcadores do braço precisam continuar legíveis no tema escuro.
   Esta camada final cobre as variantes desktop, mobile, corda solta e notas fora
   da escala, inclusive quando regras antigas aplicam gradientes diretamente. */
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-open-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-open-note > strong {
  color: #ffffff !important;
  background: #6d28d9 !important;
  background-image: none !important;
  border: 1px solid #ddd6fe !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.34), 0 4px 12px rgba(0, 0, 0, 0.42) !important;
  opacity: 1 !important;
  text-shadow: 0 1px 2px rgba(15, 23, 42, 0.78) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret.is-outside-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-open-note.is-outside-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-note.is-outside-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-open-note.is-outside-note > strong {
  color: #f8fafc !important;
  background: #334155 !important;
  background-image: none !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5) !important;
  text-shadow: 0 1px 2px rgba(15, 23, 42, 0.8) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret.is-root-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-open-note.is-root-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-note.is-root-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-open-note.is-root-note > strong {
  color: #ffffff !important;
  background: #7c3aed !important;
  border-color: #f5f3ff !important;
  box-shadow: 0 0 0 2px #0f172a, 0 0 0 4px rgba(196, 181, 253, 0.92), 0 0 16px rgba(124, 58, 237, 0.82) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret {
  border-right-color: rgba(226, 232, 240, 0.62) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret::before {
  background: rgba(226, 232, 240, 0.82) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-fret-line {
  background: rgba(226, 232, 240, 0.78) !important;
  box-shadow: none !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-string-line {
  background: rgba(226, 232, 240, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.72) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-position-marker {
  background: #e2e8f0 !important;
  border: 1px solid #0f172a !important;
  box-shadow: 0 0 0 2px rgba(226, 232, 240, 0.22) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-position-marker.is-octave {
  background: transparent !important;
  border: 2px solid #e2e8f0 !important;
  box-shadow: inset 0 0 0 3px rgba(51, 65, 85, 0.9), 0 0 0 2px rgba(226, 232, 240, 0.22) !important;
}

/* Diagramas de acordes: os mini diagramas tinham um ponto quase preto
   (#111827), que desaparecia sobre as superfícies do tema escuro. */
body[data-theme="dark"] :where(
  .chord-strings span,
  .chord-start-fret
) {
  color: #e2e8f0 !important;
  text-shadow: 0 1px 2px rgba(15, 23, 42, 0.85) !important;
}

body[data-theme="dark"] :where(
  .chord-dot,
  .chord-barre
) {
  color: #ffffff !important;
  background: #7c3aed !important;
  background-image: none !important;
  border: 1px solid #ddd6fe !important;
  box-shadow: 0 0 0 1px rgba(196, 181, 253, 0.52), 0 3px 9px rgba(0, 0, 0, 0.46) !important;
  text-shadow: 0 1px 2px rgba(15, 23, 42, 0.8) !important;
}

body[data-theme="dark"] :where(
  .chord-open,
  .chord-muted
) {
  color: #f8fafc !important;
  text-shadow: 0 1px 2px rgba(15, 23, 42, 0.86) !important;
}

body[data-theme="dark"] .chord-open {
  background: #334155 !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.42) !important;
}

body[data-theme="dark"] .chord-muted {
  color: #fda4af !important;
}

body[data-theme="dark"] :where(
  .chord-string-line,
  .chord-fret-line
) {
  background: #cbd5e1 !important;
  opacity: 1 !important;
}

/* Os mini diagramas possuem uma regra específica para as divisões das casas. */
body[data-theme="dark"] .chord-mini .chord-string-line,
body[data-theme="dark"] .chord-mini .chord-fret-line,
body[data-theme="dark"] .chord-panel[data-section-panel="acordes"] .chord-string-line,
body[data-theme="dark"] .chord-panel[data-section-panel="acordes"] .chord-fret-line {
  background: #cbd5e1 !important;
  opacity: 1 !important;
}

body[data-theme="dark"] .chord-fretboard {
  border-top-color: #e2e8f0 !important;
}

/* Repertorios: o organizador e renderizado em um dialogo proprio e possuia
   fundos claros com regras de alta especificidade. */
body[data-theme="dark"] :is(.saved-repertoire-modal, .saved-repertoire-dialog),
body[data-theme="dark"] .saved-repertoire-dialog .saved-modal-body {
  color: var(--contrast-text) !important;
  background: var(--contrast-page) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-navigation-head > span {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-organizer-sidebar,
  .repertoire-block-navigation,
  .repertoire-organizer-song,
  .repertoire-block-section,
  .repertoire-block-section > header
) {
  border-color: var(--contrast-border) !important;
  background: var(--contrast-surface) !important;
  box-shadow: none !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-sidebar-head {
  border-color: var(--contrast-border) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-organizer-sidebar-head span,
  .repertoire-organizer-sidebar .repertoire-library-tab small,
  .repertoire-organizer-content-head span,
  .repertoire-row-blocks > span,
  .repertoire-block-navigation-head small,
  .repertoire-block-section > header span,
  .repertoire-organizer-empty
) {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-organizer-sidebar-head strong,
  .repertoire-organizer-content-head strong,
  .repertoire-song-copy strong,
  .repertoire-block-section > header strong
) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-sidebar .repertoire-library-tab:not(.is-active) {
  color: var(--contrast-text) !important;
  background: transparent !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-sidebar .repertoire-library-tab:not(.is-active) > span {
  color: var(--contrast-accent) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-sidebar-new,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-search,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-tone-filter,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-row-block-option:not(.is-active),
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-song-text-action,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-row-block-arrow,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-navigation-arrow,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-chip:not(.is-active),
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-add-chip,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-composer,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-composer > div > button:last-child,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-row-menu,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-more-popover,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-mobile-tabs .repertoire-library-tab:not(.is-active),
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-mobile-new {
  border-color: var(--contrast-border) !important;
  color: var(--contrast-text) !important;
  background: var(--contrast-raised) !important;
  box-shadow: none !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-organizer-search > span,
  .repertoire-organizer-tone-filter > span,
  .repertoire-sidebar-new,
  .repertoire-add-chip,
  .repertoire-row-block-arrow,
  .repertoire-block-navigation-arrow,
  .repertoire-row-more
) {
  color: var(--contrast-accent) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-organizer-search input,
  .repertoire-organizer-tone-filter select,
  .repertoire-block-composer input
) {
  color: var(--contrast-text) !important;
  background: transparent !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-search input::placeholder,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-composer input::placeholder {
  color: #aab7cc !important;
  opacity: 1 !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-loading > span {
  border-color: var(--contrast-border) !important;
  color: var(--contrast-muted) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-song-order {
  color: var(--contrast-muted) !important;
  background: transparent !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-song-copy small,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-composer label {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-chip:not(.is-active) b {
  color: var(--contrast-text) !important;
  background: var(--contrast-raised-strong) !important;
}

/* Alguns rótulos dos chips recebem uma cor própria na cascata legada.  A
   cor do botão-pai não é herdada nesses casos, então aplicamos o contraste
   diretamente aos elementos internos. */
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-chip:not(.is-active) .repertoire-block-chip-label,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-block-chip:not(.is-active) .repertoire-block-menu-button {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-library-tab.is-active,
  .repertoire-block-chip.is-active,
  .repertoire-row-block-option.is-active,
  .repertoire-primary-action,
  .repertoire-add-song-button,
  .repertoire-play-button
) {
  border-color: var(--contrast-purple) !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--contrast-purple), var(--contrast-purple-strong)) !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-library-tab.is-active,
  .repertoire-block-chip.is-active,
  .repertoire-row-block-option.is-active,
  .repertoire-primary-action,
  .repertoire-add-song-button,
  .repertoire-play-button
) :where(span, strong, small, b) {
  color: #ffffff !important;
}

body[data-theme="dark"] .saved-repertoire-dialog .repertoire-row-menu button,
body[data-theme="dark"] .saved-repertoire-dialog .repertoire-organizer-more-popover button {
  color: var(--contrast-text) !important;
  background: transparent !important;
}

body[data-theme="dark"] .saved-repertoire-dialog :where(
  .repertoire-row-menu button:hover,
  .repertoire-organizer-more-popover button:hover,
  .repertoire-organizer-song:hover,
  .repertoire-row-block-arrow:hover:not(:disabled),
  .repertoire-block-navigation-arrow:hover:not(:disabled)
) {
  border-color: #a78bfa !important;
  background: var(--contrast-raised-strong) !important;
}

@media (max-width: 760px) {
  body[data-theme="dark"] .saved-repertoire-dialog :where(
    .repertoire-organizer-search-row,
    .repertoire-mobile-tabs
  ) {
    background: var(--contrast-page) !important;
  }

  body[data-theme="dark"] .saved-repertoire-dialog :where(
    .repertoire-mobile-header > header strong,
    .repertoire-mobile-active-name strong
  ) {
    color: var(--contrast-text) !important;
  }

  body[data-theme="dark"] .saved-repertoire-dialog .repertoire-mobile-active-name span,
  body[data-theme="dark"] .saved-repertoire-dialog .repertoire-mobile-tabs .repertoire-library-tab small {
    color: var(--contrast-muted) !important;
  }
}

/* Últimos elementos com estilos próprios de alta especificidade. */
body[data-theme="dark"] #appShell.is-home-active .home-next-greeting h1 > span {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-head .community-intro {
  background: #4c1d95 !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-head .community-intro > :where(.eyebrow, span) {
  color: #ffffff !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-network-card .community-side-head h3,
body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-network-card .community-side-head button {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-network-card .community-network-grid > :is(button, div) {
  border-color: rgba(196, 181, 253, 0.26) !important;
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-network-card .community-network-grid > button,
body[data-theme="dark"] .community-panel[data-section-panel="comunidade"] .community-network-card .community-network-grid :where(strong, small, span) {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] .batucada-suggestion-list button.is-selected small {
  color: #ffffff !important;
}

/* A grade "Minha rede" possui uma composição desktop com especificidade alta. */
@media (min-width: 761px) {
  body[data-theme="dark"]:has(.community-panel[data-section-panel="comunidade"]:not(.is-hidden)) #appShell .community-network-card .community-side-head h3,
  body[data-theme="dark"]:has(.community-panel[data-section-panel="comunidade"]:not(.is-hidden)) #appShell .community-network-card .community-side-head button,
  body[data-theme="dark"]:has(.community-panel[data-section-panel="comunidade"]:not(.is-hidden)) #appShell .community-network-card .community-metric-info :is(strong, small) {
    color: var(--contrast-text) !important;
  }

  body[data-theme="dark"]:has(.community-panel[data-section-panel="comunidade"]:not(.is-hidden)) #appShell .community-network-card .community-network-grid > :is(button, div) {
    border-color: rgba(196, 181, 253, 0.26) !important;
    background: var(--contrast-raised) !important;
  }

  body[data-theme="dark"]:has(.community-panel[data-section-panel="comunidade"]:not(.is-hidden)) #appShell .community-network-card .community-network-icon {
    color: var(--contrast-accent) !important;
    background: #31265a !important;
  }
}

/* Ajustes equivalentes para as composições compactas do mobile. */
body[data-theme="dark"] main#appShell.is-home-active > header.vibra-home-top.vibra-app-top .vibra-logo-copy .vibra-logo-text {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] main#appShell.is-saved-active > .saved-repertoires-panel[data-section-panel="salvos"] .saved-head .eyebrow.dark,
body[data-theme="dark"] main#appShell.is-saved-active > .saved-repertoires-panel[data-section-panel="salvos"] .saved-library-section-head h3,
body[data-theme="dark"] main#appShell.is-saved-active > .saved-repertoires-panel[data-section-panel="salvos"] .saved-library-section-head h3 span {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] main#appShell.is-saved-active > .saved-repertoires-panel[data-section-panel="salvos"] .saved-library-section-head {
  background: var(--contrast-raised) !important;
}

body[data-theme="dark"] main#appShell .vibra-song-form-page .vibra-card-head > div > p {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel #scaleInstrumentDescription,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-fretboard-head > span {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] .batucada-training-track small {
  background: #2e2558 !important;
}

body[data-theme="dark"] .band-panel[data-section-panel="bandas"] .band-hero-mark {
  color: var(--contrast-accent) !important;
}

/* Guardas de especificidade para regras legadas que também usam !important. */
body[data-theme="dark"] main#appShell.app-shell nav.app-nav .desktop-home-menu .desktop-home-nav-item:not(.is-active) > span,
body[data-theme="dark"] main#appShell.app-shell nav.app-nav .desktop-home-menu .desktop-home-list-more:not(.is-active) > span,
body[data-theme="dark"] main#appShell.app-shell nav.app-nav .desktop-home-menu .desktop-home-list-heading > span {
  color: var(--contrast-muted) !important;
}

body[data-theme="dark"] main#appShell.app-shell nav.app-nav .desktop-home-menu .desktop-home-nav-item.is-active > span,
body[data-theme="dark"] main#appShell.app-shell nav.app-nav .desktop-home-menu .desktop-home-list-more.is-active,
body[data-theme="dark"] main#appShell.app-shell nav.app-nav .desktop-home-menu .desktop-home-list-more.is-active > span {
  color: #ffffff !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-open-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-open-note > strong {
  color: #ffffff !important;
  border-color: #c4b5fd !important;
  background: var(--contrast-purple) !important;
}

body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-fret.is-outside-note > strong,
body[data-theme="dark"] #scaleLibraryPanel.scale-library-panel .scale-mobile-note.is-outside-note > strong {
  color: var(--contrast-text) !important;
  border-color: #94a3b8 !important;
  background: #334155 !important;
}

body[data-theme="dark"] #appShell.is-home-active #homeNextUserName,
body[data-theme="dark"] #appShell.is-home-active #homeNextProfileAvatar,
body[data-theme="dark"] #appShell.is-home-active #homeNextProfileLevel,
body[data-theme="dark"] #appShell.is-home-active #desktopHomeProfilePercent {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] #appShell.is-home-active #homeNextProfileAvatar,
body[data-theme="dark"] #appShell.is-home-active #homeNextProfileLevel,
body[data-theme="dark"] #appShell.is-home-active #desktopHomeProfilePercent {
  background: #34285f !important;
}

body[data-theme="dark"] .saved-repertoires-panel[data-section-panel="salvos"] #savedVisibleCount,
body[data-theme="dark"] .saved-repertoires-panel[data-section-panel="salvos"] #savedFilterButton,
body[data-theme="dark"] .saved-repertoires-panel[data-section-panel="salvos"] #savedFilterButton span {
  border-color: var(--contrast-border) !important;
  color: var(--contrast-text) !important;
  background: var(--contrast-raised) !important;
}

/* Ações de treino: mantêm contraste mesmo sobre os estilos legados dos módulos. */
body[data-theme="dark"] .scale-library-panel .scale-training-button {
  border-color: #8b5cf6 !important;
  color: #f5f3ff !important;
  background: #2a2148 !important;
}

body[data-theme="dark"] .audio-library-hero-actions .audio-library-training-button {
  border-color: #a78bfa !important;
  color: #f5f3ff !important;
  background: #282044 !important;
}

body[data-theme="dark"] .audio-library-hero-actions .audio-library-training-button::before {
  background: #c4b5fd !important;
}

body[data-theme="dark"] .training-flow-song-field select {
  border-color: #596987 !important;
  color: var(--contrast-text) !important;
  background: #202a40 !important;
}

body[data-theme="dark"] [data-module-practice].is-practice-active {
  color: #ffffff !important;
  border-color: #22c55e !important;
  background: linear-gradient(135deg, #166534, #16a34a) !important;
}

body[data-theme="dark"] [data-module-practice].is-practice-active [data-practice-label] {
  color: #ffffff !important;
}

body[data-theme="dark"] .module-practice-summary {
  border-color: #3c4b6b !important;
  background: #17223a !important;
}

body[data-theme="dark"] .module-practice-summary-card {
  border-color: #3c4b6b !important;
  background: #202a40 !important;
}

body[data-theme="dark"] .module-practice-summary-card strong,
body[data-theme="dark"] .module-practice-summary-card b {
  color: #f8fafc !important;
}

body[data-theme="dark"] .module-practice-summary-card small {
  color: #bfcae2 !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] #batucada-title,
body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] .batucada-head-copy .eyebrow,
body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] .batucada-head-copy > span,
body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] #batucadaLoadStatus {
  color: var(--contrast-text) !important;
}

body[data-theme="dark"] .batucada-panel[data-section-panel="batucada"] #batucadaLoadStatus {
  border-color: #596987 !important;
  background: #202a40 !important;
}
