:root {
    --font-family-system: "Instrument Sans", "Source Sans 3", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
    --font-family-display: "Space Grotesk", "Instrument Sans", "Inter", sans-serif;
    --font-size-xs: 0.59375rem;
    --font-size-s: 0.653125rem;
    --font-size-m: 0.7125rem;
    --font-size-base: 0.771875rem;
    --font-size-l: 0.855rem;
    --font-size-xl: 0.961875rem;
    --transition-quick: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --border-radius-s: 5px;
    --border-radius-m: 10px;
    --border-radius-l: 16px;
    /* Cantos leves (botões/chips retangulares): nunca pílula (999px/50%). */
    --rl-soft-radius: 8px;
    --ui-titlebar-height: 40px;
    --ui-titlebar-text-scale: 1.4;
    --ui-titlebar-gap: 0.5rem;
    --ui-titlebar-logo-size: 29px;
    --ui-titlebar-actions-gap: 8px;
    --ui-titlebar-action-size: 30px;
    --ui-titlebar-window-btn-width: 46px;
    --ui-panel-header-btn-size: 28px;
    --ui-main-content-width: min(98.5vw, calc(100vw - 8px));
    --ui-player-container-padding: 52px 12px 12px 12px;
    --ui-layout-gap: 0.65rem;
    --ui-content-column-gap: 0.5rem;
    --ui-content-row-gap: 0.5rem;
    --ui-player-column-width: 299px;
    --ui-player-column-padding: 21px;
    --ui-player-column-gap: 18px;
    --ui-player-art-width: calc(100% + 26px);
    --ui-player-art-height: auto;
    --ui-player-art-aspect: 1 / 1;
    --ui-player-art-margin: -13px -13px 0;
    --ui-player-details-offset: -16px;
    --ui-details-header-padding: 8px 12px;
    --ui-details-title-scale: 1;
    --ui-details-content-padding: 12px;
    --ui-details-content-max-height: clamp(190px, calc(100dvh - 320px), 420px);
    --ui-track-gap: 4px;
    --ui-track-title-scale: 1.25;
    --ui-track-artist-scale: 1.4;
    --ui-player-footer-min-height: 136px;
    --ui-player-footer-padding: 12px 0 18px 0;
    --ui-player-footer-margin: 0 calc(var(--ui-player-column-padding, 21px) * -1) calc(var(--ui-player-column-padding, 21px) * -1);
    --ui-player-footer-width: calc(100% + (var(--ui-player-column-padding, 21px) * 2));
    --ui-player-footer-content-width: 100%;
    --ui-player-footer-row-gap: 10px;
    --ui-panel-chrome-pad-block: 10px;
    --rl-panel-header-height-scale: 0.8;
    --rl-main-panel-header-height: 33px;
    --rl-main-panel-footer-height: 42px;
    --ui-panel-header-padding: calc(var(--ui-panel-chrome-pad-block) * var(--rl-panel-header-height-scale)) 14px;
    --ui-panel-header-gap: 12px;
    --ui-panel-header-min-height: 25px;
    --ui-panel-footer-padding: 0 14px;
    --ui-panel-footer-gap: 8px;
    --ui-panel-footer-control-size: 34px;
    --ui-panel-footer-control-radius: var(--rl-soft-radius, 8px);
    --ui-player-transport-size: 42px;
    --ui-player-transport-radius: 14px;
    --ui-player-main-radius: 18px;
    --ui-playlist-item-min-height: 33px;
    --ui-playlist-item-padding: 1px 8px 1px 1px;
    --ui-playlist-item-margin: 1px;
    --ui-app-footer-padding: 10.2px 24px;
    --ui-app-footer-gap: 3.4px;
    --ui-app-footer-line-height: 1.4;

    /* Cores de perfil por tipo - consistentes em ambos os temas */
    --accent-primary: #00BFFF;
    --accent-music: #00BFFF;
    --accent-announcement: #10B981;
    /* shuffle anúncios ativo */
    --announcement-shuffle-active: var(--accent-announcement);
    --accent-tts: #D2691E;
    --accent-danger: #EF4444;
    --accent-warning: #DAA520;
    --accent-danger-bg: rgba(239, 68, 68, 0.1);
    --theme-accent: var(--accent-primary);
    --theme-accent-strong: #008cc2;
    --theme-accent-rgb: 0, 191, 255;
    --theme-accent-bg-subtle: rgba(var(--theme-accent-rgb), 0.08);
    --theme-accent-bg-soft: rgba(var(--theme-accent-rgb), 0.14);
    --theme-accent-bg-medium: rgba(var(--theme-accent-rgb), 0.22);
    --theme-accent-border: rgba(var(--theme-accent-rgb), 0.28);
    --theme-accent-border-strong: rgba(var(--theme-accent-rgb), 0.46);
    --theme-accent-ring: rgba(var(--theme-accent-rgb), 0.3);
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.18);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.28);
    --theme-accent-gradient: linear-gradient(180deg, var(--theme-accent) 0%, var(--theme-accent-strong) 100%);
    --theme-accent-gradient-soft: linear-gradient(180deg, var(--theme-accent-bg-soft) 0%, var(--theme-accent-bg-subtle) 100%);

    --quality-hd-bg: #D1FAE5;
    --quality-hd-border: #6EE7B7;
    --quality-hd-text: #057857;
    --quality-ultrahd-bg: #EDE9FE;
    --quality-ultrahd-border: #C4B5FD;
    --quality-ultrahd-text: #5B21B6;
    --quality-hires-bg: #FEE2E2;
    --quality-hires-border: #FCA5A5;
    --quality-hires-text: #B91C1C;

    --color-win-light-bg: #F5F5F7;
    /* Tema escuro com meio tom mais claro - cor texturizada */
    --color-win-dark-bg: #3C3C3C;

    --color-light-bg-primary: rgba(255, 255, 255, 0.7);
    --color-light-bg-secondary: #FFFFFF;
    --color-light-bg-tertiary: #F8F9FA;
    --color-light-bg-hover: #F0F0F1;
    --color-light-text-primary: #1A202C;
    --color-light-text-secondary: #4A5568;
    --color-light-text-tertiary: #718096;
    --color-light-border-primary: rgba(0, 0, 0, 0.08);
    --color-light-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
    --color-light-shadow-sm-top: 0 -1px 2px rgba(0, 0, 0, 0.04);
    --color-light-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
    --color-light-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.07), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

    --color-dark-bg-primary: rgba(50, 50, 50, 0.85);
    --color-dark-bg-secondary: #464646;
    --color-dark-bg-tertiary: #505050;
    --color-dark-bg-hover: rgba(255, 255, 255, 0.08);
    --color-dark-text-primary: #EAEAEA;
    --color-dark-text-secondary: #8A8A8A;
    --color-dark-text-tertiary: #707070;
    --color-dark-border-primary: rgba(130, 130, 130, 0.28);
    --color-dark-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.25);
    --color-dark-shadow-sm-top: 0 -2px 4px rgba(0, 0, 0, 0.25);
    --color-dark-shadow-md: 0 6px 12px rgba(0, 0, 0, 0.35);
    --color-dark-shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.45);

    --rl-grafite-canvas: #242424;
    --rl-grafite-field: #202124;
    --rl-grafite-surface-1: #292a2d;
    --rl-grafite-surface-2: #303134;
    --rl-grafite-surface-3: #35363a;
    --rl-grafite-hover: #3c4043;
    --rl-grafite-divider: #5f6368;
    --rl-grafite-text-primary: #f1f3f4;
    --rl-grafite-text-secondary: #d0d0d0;
    --rl-grafite-text-muted: #9aa0a6;
    --rl-grafite-accent: #a8c7fa;
    --rl-grafite-accent-rgb: 168, 199, 250;
    --rl-grafite-focus-ring: rgba(var(--rl-grafite-accent-rgb), 0.24);
    --rl-grafite-border: rgba(255, 255, 255, 0.12);
    --rl-grafite-border-strong: rgba(255, 255, 255, 0.2);
    --rl-grafite-shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.32);
    --rl-grafite-shadow-md: 0 8px 18px rgba(0, 0, 0, 0.38);
    --rl-grafite-shadow-lg: 0 14px 30px rgba(0, 0, 0, 0.46), 0 3px 8px rgba(0, 0, 0, 0.34);

    --title-brand-shell-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(229, 235, 243, 0.82) 100%);
    --title-brand-shell-border: rgba(148, 163, 184, 0.26);
    --title-brand-shell-shadow: 0 10px 20px rgba(15, 23, 42, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.92);
    --title-brand-logo-shell-bg: radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.94), transparent 44%), linear-gradient(160deg, rgba(var(--theme-accent-rgb), 0.16) 0%, rgba(226, 232, 240, 0.46) 100%);
    --title-brand-logo-shell-border: rgba(148, 163, 184, 0.24);
    --title-brand-logo-shadow: 0 10px 18px rgba(var(--theme-accent-rgb), 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.96);
    --title-brand-primary-from: #163a68;
    --title-brand-primary-to: #5b728f;
    --title-brand-accent-from: var(--theme-accent-strong);
    --title-brand-accent-to: #f97316;
    --title-brand-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.78), 0 10px 16px rgba(15, 23, 42, 0.08);
    --title-brand-accent-shadow: 0 1px 0 rgba(255, 255, 255, 0.74), 0 10px 16px rgba(249, 115, 22, 0.08);
    --title-brand-badge-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(231, 237, 243, 0.82) 100%);
    --title-brand-badge-border: rgba(148, 163, 184, 0.22);
    --title-brand-badge-shadow: 0 8px 16px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

body:not(.theme-dark) {
    /* tema claro */

    /* Fundo principal - cinza claro com padrão de grade */
    --bg-body-fixed: #E5E7EB;

    /* Painéis - cores sólidas base (gradientes aplicados via CSS específico) */
    --bg-primary: rgba(248, 250, 252, 0.95);
    --bg-secondary: #F1F5F9;
    --bg-tertiary: #E8ECF0;
    --bg-hover: #E2E8F0;

    /* Versões sólidas para compatibilidade */
    --bg-secondary-solid: #F1F5F9;
    --bg-tertiary-solid: #E2E8F0;

    /* Textos - cores escuras para contraste máximo em fundos claros */
    --text-primary: #111827;
    --text-secondary: #374151;
    --text-tertiary: #6B7280;

    /* Bordas */
    --border-primary: rgba(0, 0, 0, 0.1);
    --border-secondary-solid: #D1D5DB;

    /* Sombras com profundidade */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-sm-top: 0 -1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.05);

    /* Scrollbar e progress */
    --scrollbar-thumb: rgba(107, 114, 128, 0.5);
    --progress-bar-track: #D1D5DB;
    --main-control-idle-bg: #9CA3AF;

    /* Backgrounds por tipo - mantendo identidade de cores */
    --accent-music-bg: var(--theme-accent-bg-soft);
    --accent-announcement-bg: rgba(16, 185, 129, 0.12);
    --accent-tts-bg: rgba(210, 105, 30, 0.12);
    --theme-accent: #718197;
    --theme-accent-strong: #52647a;
    --theme-accent-rgb: 113, 129, 151;
    --theme-accent-bg-subtle: rgba(var(--theme-accent-rgb), 0.08);
    --theme-accent-bg-soft: rgba(var(--theme-accent-rgb), 0.14);
    --theme-accent-bg-medium: rgba(var(--theme-accent-rgb), 0.22);
    --theme-accent-border: rgba(var(--theme-accent-rgb), 0.28);
    --theme-accent-border-strong: rgba(var(--theme-accent-rgb), 0.46);
    --theme-accent-ring: rgba(var(--theme-accent-rgb), 0.3);
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.16);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.24);

    /* Agendamento - cores escuras para texto em fundos claros */
    --schedule-start-bg: #DCFCE7;
    --schedule-start-text: #14532D;
    --schedule-end-bg: #FEF3C7;
    --schedule-end-text: #78350F;

    /* Badges - texto escuro para contraste */
    --badge-text: #14532D;
    --badge-gradient-from: #DCFCE7;
    --badge-gradient-to: #BBF7D0;

    /* Qualidade de áudio - textos escuros */
    --quality-hd-bg: #DCFCE7;
    --quality-hd-border: #86EFAC;
    --quality-hd-text: #14532D;
    --quality-ultrahd-bg: #EDE9FE;
    --quality-ultrahd-border: #C4B5FD;
    --quality-ultrahd-text: #4C1D95;
    --quality-hires-bg: #FEE2E2;
    --quality-hires-border: #FCA5A5;
    --quality-hires-text: #7F1D1D;
    --title-brand-shell-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.84) 0%, rgba(238, 243, 248, 0.66) 100%);
    --title-brand-shell-border: rgba(15, 23, 42, 0.08);
    --title-brand-shell-shadow: 0 10px 18px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.8);
    --title-brand-logo-shell-bg: radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.8), transparent 44%), linear-gradient(160deg, rgba(var(--theme-accent-rgb), 0.12) 0%, rgba(255, 255, 255, 0.32) 100%);
    --title-brand-logo-shell-border: rgba(148, 163, 184, 0.22);
    --title-brand-logo-shadow: 0 10px 18px rgba(var(--theme-accent-rgb), 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95);
    --title-brand-primary-from: #183b6b;
    --title-brand-primary-to: #516b8f;
    --title-brand-accent-from: var(--theme-accent-strong);
    --title-brand-accent-to: #fb923c;
    --title-brand-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.72), 0 10px 16px rgba(var(--theme-accent-rgb), 0.08);
    --title-brand-accent-shadow: 0 1px 0 rgba(255, 255, 255, 0.72), 0 10px 16px rgba(249, 115, 22, 0.1);
    --title-brand-badge-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(230, 235, 242, 0.8) 100%);
    --title-brand-badge-border: rgba(148, 163, 184, 0.22);
    --title-brand-badge-shadow: 0 10px 16px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

body.theme-dark {
    --bg-body-fixed: var(--color-win-dark-bg);
    --bg-primary: var(--color-dark-bg-primary);
    --bg-secondary: var(--color-dark-bg-secondary);
    --bg-tertiary: var(--color-dark-bg-tertiary);
    --bg-secondary-solid: var(--color-dark-bg-secondary);
    --bg-tertiary-solid: var(--color-dark-bg-tertiary);
    --bg-hover: var(--color-dark-bg-hover);
    --text-primary: var(--color-dark-text-primary);
    --text-secondary: var(--color-dark-text-secondary);
    --text-tertiary: var(--color-dark-text-tertiary);
    --border-primary: var(--color-dark-border-primary);
    --border-secondary-solid: #121212;
    --shadow-sm: var(--color-dark-shadow-sm);
    --shadow-sm-top: var(--color-dark-shadow-sm-top);
    --shadow-md: var(--color-dark-shadow-md);
    --shadow-lg: var(--color-dark-shadow-lg);
    --scrollbar-thumb: rgba(255, 255, 255, 0.25);
    --progress-bar-track: #374151;
    --main-control-idle-bg: var(--bg-tertiary-solid);
    --accent-music-bg: var(--theme-accent-bg-soft);
    --accent-announcement-bg: rgba(0, 139, 69, 0.1);
    --accent-tts-bg: rgba(210, 105, 30, 0.1);
    --theme-accent: #c8d0d9;
    --theme-accent-strong: #8f98a5;
    --theme-accent-rgb: 200, 208, 217;
    --theme-accent-bg-subtle: rgba(var(--theme-accent-rgb), 0.08);
    --theme-accent-bg-soft: rgba(var(--theme-accent-rgb), 0.14);
    --theme-accent-bg-medium: rgba(var(--theme-accent-rgb), 0.22);
    --theme-accent-border: rgba(var(--theme-accent-rgb), 0.28);
    --theme-accent-border-strong: rgba(var(--theme-accent-rgb), 0.46);
    --theme-accent-ring: rgba(var(--theme-accent-rgb), 0.28);
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.12);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.2);

    --schedule-start-bg: #162f1c;
    --schedule-start-text: #00CD00;
    --schedule-end-bg: #422006;
    --schedule-end-text: #DAA520;
    --badge-text: #6ee7b7;
    --badge-gradient-from: rgba(52, 211, 153, 0.15);
    --badge-gradient-to: rgba(16, 185, 129, 0.2);

    --quality-hd-bg: #064E3B;
    --quality-hd-text: #6EE7B7;
    --quality-ultrahd-bg: #4C1D95;
    --quality-ultrahd-text: #A78BFA;
    --quality-hires-bg: #7F1D1D;
    --quality-hires-text: #F87171;
}

body.theme-dark[data-bootstrap-theme="dark-fixed"] {
    --bg-body-fixed: #202124;
    --bg-primary: rgba(38, 39, 42, 0.92);
    --bg-secondary: #25272b;
    --bg-tertiary: #303237;
    --bg-secondary-solid: #25272b;
    --bg-tertiary-solid: #303237;
    --bg-hover: rgba(255, 255, 255, 0.065);
    --text-primary: #f3f4f6;
    --text-secondary: #c9ced6;
    --text-tertiary: #8f98a5;
    --border-primary: rgba(255, 255, 255, 0.09);
    --accent-primary: #b5beca;
    --accent-music: #c8d0d9;
    --accent-music-bg: rgba(200, 208, 217, 0.12);
    --theme-accent: #c8d0d9;
    --theme-accent-strong: #8f98a5;
    --theme-accent-rgb: 200, 208, 217;
    --accent-announcement: #a7b0bc;
    --accent-announcement-bg: rgba(167, 176, 188, 0.12);
    --accent-tts: #d2c7b6;
    --accent-tts-bg: rgba(210, 199, 182, 0.12);
    --scrollbar-thumb: rgba(229, 231, 235, 0.22);
    --progress-bar-track: #41454b;
    --main-control-idle-bg: #43474d;
    --shadow-sm: 0 4px 10px rgba(0, 0, 0, 0.28);
    --shadow-md: 0 12px 28px rgba(0, 0, 0, 0.38);
    --shadow-lg: 0 24px 54px rgba(0, 0, 0, 0.46);
    --badge-text: #dfe6ee;
    --badge-gradient-from: rgba(148, 163, 184, 0.12);
    --badge-gradient-to: rgba(203, 213, 225, 0.16);
    --title-brand-shell-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.03) 100%);
    --title-brand-shell-border: rgba(203, 213, 225, 0.14);
    --title-brand-logo-shell-bg: radial-gradient(circle at 26% 20%, rgba(255, 255, 255, 0.3), transparent 44%), linear-gradient(160deg, rgba(148, 163, 184, 0.18) 0%, rgba(35, 39, 43, 0.18) 100%);
    --title-brand-primary-from: #f5f7fa;
    --title-brand-primary-to: #d2d9e3;
    --title-brand-accent-from: #8ec5ff;
    --title-brand-accent-to: #cbd5e1;
}

body.theme-dark[data-bootstrap-theme="grafite"] {
    --bg-body-fixed: var(--rl-grafite-canvas);
    --bg-primary: var(--rl-grafite-surface-1);
    --bg-secondary: var(--rl-grafite-surface-2);
    --bg-tertiary: var(--rl-grafite-surface-3);
    --bg-secondary-solid: var(--rl-grafite-surface-2);
    --bg-tertiary-solid: var(--rl-grafite-surface-3);
    --bg-hover: var(--rl-grafite-hover);
    --text-primary: var(--rl-grafite-text-primary);
    --text-secondary: var(--rl-grafite-text-secondary);
    --text-tertiary: var(--rl-grafite-text-muted);
    --border-primary: var(--rl-grafite-border);
    --border-secondary-solid: var(--rl-grafite-divider);
    --shadow-sm: var(--rl-grafite-shadow-sm);
    --shadow-sm-top: 0 -2px 6px rgba(0, 0, 0, 0.32);
    --shadow-md: var(--rl-grafite-shadow-md);
    --shadow-lg: var(--rl-grafite-shadow-lg);
    --accent-primary: var(--rl-grafite-accent);
    --accent-music: var(--rl-grafite-accent);
    --accent-announcement: var(--rl-grafite-text-secondary);
    --accent-tts: var(--rl-grafite-text-primary);
    --accent-music-bg: rgba(var(--rl-grafite-accent-rgb), 0.12);
    --accent-announcement-bg: rgba(208, 208, 208, 0.1);
    --accent-tts-bg: rgba(241, 243, 244, 0.1);
    --theme-accent: var(--rl-grafite-accent);
    --theme-accent-strong: #7baaf7;
    --theme-accent-rgb: var(--rl-grafite-accent-rgb);
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.14);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.22);
    --scrollbar-thumb: var(--rl-grafite-divider);
    --progress-bar-track: var(--rl-grafite-field);
    --main-control-idle-bg: var(--rl-grafite-hover);
    --title-brand-shell-bg: var(--rl-grafite-surface-3);
    --title-brand-shell-border: var(--rl-grafite-border);
    --title-brand-shell-shadow: var(--rl-grafite-shadow-sm);
    --title-brand-logo-shell-bg: var(--rl-grafite-surface-2);
    --title-brand-logo-shell-border: var(--rl-grafite-border);
    --title-brand-logo-shadow: var(--rl-grafite-shadow-sm);
    --title-brand-primary-from: var(--rl-grafite-text-primary);
    --title-brand-primary-to: var(--rl-grafite-text-secondary);
    --title-brand-accent-from: var(--rl-grafite-accent);
    --title-brand-accent-to: #d3e3fd;
    --title-brand-text-shadow: 0 2px 6px rgba(0, 0, 0, 0.38);
    --title-brand-accent-shadow: 0 2px 8px rgba(0, 0, 0, 0.42);
    --title-brand-badge-bg: var(--rl-grafite-surface-2);
    --title-brand-badge-border: var(--rl-grafite-border);
    --title-brand-badge-shadow: var(--rl-grafite-shadow-sm);
}

body.theme-dark[data-bootstrap-theme="cristal-azul"] {
    --bg-body-fixed: #64a8bd;
    --bg-primary: rgba(63, 132, 154, 0.88);
    --bg-secondary: #3f849a;
    --bg-tertiary: #66a7ba;
    --bg-secondary-solid: #3f849a;
    --bg-tertiary-solid: #66a7ba;
    --bg-hover: rgba(229, 248, 252, 0.11);
    --text-primary: #f7fcff;
    --text-secondary: #e6f6fb;
    --text-tertiary: #c2e1ea;
    --border-primary: rgba(229, 248, 252, 0.16);
    --accent-primary: #b9e8f3;
    --accent-music: #c7eef6;
    --accent-music-bg: rgba(199, 238, 246, 0.12);
    --theme-accent: #c7eef6;
    --theme-accent-strong: #6fbacf;
    --theme-accent-rgb: 199, 238, 246;
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.18);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.3);
    --accent-announcement: #bdeee4;
    --accent-announcement-bg: rgba(189, 238, 228, 0.11);
    --accent-tts: #f4e5c6;
    --accent-tts-bg: rgba(244, 229, 198, 0.12);
    --scrollbar-thumb: rgba(229, 248, 252, 0.26);
    --progress-bar-track: #76b4c6;
    --main-control-idle-bg: #79b8c8;
    --title-brand-shell-bg: linear-gradient(180deg, rgba(229, 248, 252, 0.16) 0%, rgba(110, 178, 196, 0.1) 100%);
    --title-brand-shell-border: rgba(229, 248, 252, 0.22);
    --title-brand-logo-shell-bg: radial-gradient(circle at 26% 20%, rgba(255, 255, 255, 0.38), transparent 42%), linear-gradient(160deg, rgba(199, 238, 246, 0.24) 0%, rgba(86, 151, 172, 0.22) 100%);
    --title-brand-primary-from: #ffffff;
    --title-brand-primary-to: #b9eaff;
    --title-brand-accent-from: #67e8f9;
    --title-brand-accent-to: #fde047;
    --title-brand-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.12), 0 12px 18px rgba(8, 47, 73, 0.26);
    --title-brand-accent-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 12px 18px rgba(34, 211, 238, 0.24);
    --title-brand-badge-bg: linear-gradient(180deg, rgba(103, 232, 249, 0.16) 0%, rgba(14, 116, 144, 0.14) 100%);
    --title-brand-badge-border: rgba(125, 211, 252, 0.24);
}

body.theme-dark[data-bootstrap-theme="ouro"] {
    --bg-body-fixed: #654a24;
    --bg-primary: rgba(120, 88, 28, 0.88);
    --bg-secondary: #a8842e;
    --bg-tertiary: #c9a24a;
    --bg-secondary-solid: #a8842e;
    --bg-tertiary-solid: #c9a24a;
    --bg-hover: rgba(255, 236, 180, 0.12);
    --text-primary: #fff8e7;
    --text-secondary: #f5e6c8;
    --text-tertiary: #654a24;
    --border-primary: rgba(255, 236, 180, 0.22);
    --accent-primary: #f0d78a;
    --accent-music: #f0d78a;
    --accent-music-bg: rgba(240, 215, 138, 0.14);
    --theme-accent: #f0d78a;
    --theme-accent-strong: #c9a24a;
    --theme-accent-rgb: 240, 215, 138;
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.16);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.28);
    --accent-announcement: #e8c76a;
    --accent-announcement-bg: rgba(232, 199, 106, 0.12);
    --accent-tts: #ffe9a8;
    --accent-tts-bg: rgba(255, 233, 168, 0.12);
    --scrollbar-thumb: rgba(255, 236, 180, 0.3);
    --progress-bar-track: #8a6a22;
    --main-control-idle-bg: #a8842e;
    --shadow-sm: 0 4px 10px rgba(8, 6, 2, 0.32);
    --shadow-md: 0 12px 28px rgba(8, 6, 2, 0.4);
    --shadow-lg: 0 24px 54px rgba(8, 6, 2, 0.48);
    --title-brand-shell-bg: linear-gradient(180deg, rgba(255, 248, 220, 0.22) 0%, rgba(201, 162, 74, 0.14) 100%);
    --title-brand-shell-border: rgba(255, 236, 180, 0.32);
    --title-brand-logo-shell-bg: radial-gradient(circle at 26% 20%, rgba(255, 252, 230, 0.5), transparent 44%), linear-gradient(160deg, rgba(240, 215, 138, 0.3) 0%, rgba(120, 88, 28, 0.24) 100%);
    --title-brand-primary-from: #fff8e7;
    --title-brand-primary-to: #f0d78a;
    --title-brand-accent-from: #ffe9a8;
    --title-brand-accent-to: #c9a24a;
    --title-brand-text-shadow: 0 1px 0 rgba(255, 248, 220, 0.2), 0 12px 18px rgba(8, 6, 2, 0.35);
    --title-brand-accent-shadow: 0 1px 0 rgba(255, 248, 220, 0.16), 0 12px 18px rgba(201, 162, 74, 0.28);
    --title-brand-badge-bg: linear-gradient(180deg, rgba(240, 215, 138, 0.22) 0%, rgba(138, 106, 34, 0.18) 100%);
    --title-brand-badge-border: rgba(255, 236, 180, 0.3);
}

body:not(.theme-dark)[data-bootstrap-theme="arcoiris"] {
    --bg-body-fixed: #fff8fb;
    --bg-primary: rgba(255, 255, 255, 0.94);
    --bg-secondary: #fff8fb;
    --bg-tertiary: #f2fbff;
    --bg-secondary-solid: #fff8fb;
    --bg-tertiary-solid: #f2fbff;
    --bg-hover: rgba(255, 255, 255, 0.96);
    --text-primary: #273046;
    --text-secondary: #56617b;
    --text-tertiary: #8892ad;
    --border-primary: rgba(110, 132, 180, 0.12);
    --theme-accent: #8b5cf6;
    --theme-accent-strong: #ec4899;
    --theme-accent-rgb: 139, 92, 246;
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.18);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.28);
    --accent-primary: var(--theme-accent);
    --accent-music: var(--theme-accent);
    --accent-music-bg: var(--theme-accent-bg-soft);
    --accent-announcement: #22c55e;
    --accent-announcement-bg: rgba(34, 197, 94, 0.14);
    --accent-tts: #fb7185;
    --accent-tts-bg: rgba(251, 113, 133, 0.14);
    --scrollbar-thumb: rgba(168, 85, 247, 0.22);
    --progress-bar-track: #e4d8fb;
    --main-control-idle-bg: #d8c7f7;
    --shadow-sm: 0 4px 10px rgba(168, 85, 247, 0.08);
    --shadow-md: 0 12px 28px rgba(168, 85, 247, 0.12);
    --shadow-lg: 0 22px 48px rgba(168, 85, 247, 0.14);
    --badge-text: #7c3aed;
    --badge-gradient-from: rgba(254, 240, 138, 0.42);
    --badge-gradient-to: rgba(244, 114, 182, 0.18);
    --title-brand-shell-bg: linear-gradient(120deg, rgba(255, 255, 255, 0.9) 0%, rgba(245, 240, 255, 0.82) 42%, rgba(238, 248, 255, 0.88) 100%);
    --title-brand-shell-border: rgba(168, 85, 247, 0.14);
    --title-brand-logo-shell-bg: radial-gradient(circle at 24% 20%, rgba(255, 255, 255, 0.96), transparent 42%), linear-gradient(155deg, rgba(168, 85, 247, 0.16) 0%, rgba(34, 211, 238, 0.18) 46%, rgba(251, 146, 60, 0.18) 100%);
    --title-brand-primary-from: #3b2b55;
    --title-brand-primary-to: #6f5d8c;
    --title-brand-accent-from: #8b5cf6;
    --title-brand-accent-to: #f97316;
    --title-brand-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.84), 0 10px 16px rgba(168, 85, 247, 0.08);
    --title-brand-accent-shadow: 0 1px 0 rgba(255, 255, 255, 0.84), 0 10px 16px rgba(249, 115, 22, 0.1);
    --title-brand-badge-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(245, 238, 255, 0.82) 100%);
    --title-brand-badge-border: rgba(168, 85, 247, 0.16);
}

body:not(.theme-dark)[data-bootstrap-theme="light-fixed"] {
    --bg-body-fixed: #f0f0eb;
    --bg-primary: rgba(252, 252, 250, 0.92);
    --bg-secondary: #f6f6f3;
    --bg-tertiary: #eaeae5;
    --bg-secondary-solid: #f6f6f3;
    --bg-tertiary-solid: #eaeae5;
    --bg-hover: rgba(255, 255, 255, 0.94);
    --text-primary: #252725;
    --text-secondary: #5c5f5a;
    --text-tertiary: #898d86;
    --border-primary: rgba(108, 112, 104, 0.12);
    --accent-primary: #b9bdb4;
    --accent-music: #aeb4aa;
    --accent-music-bg: rgba(174, 180, 170, 0.14);
    --theme-accent: #aeb4aa;
    --theme-accent-strong: #7f867a;
    --theme-accent-rgb: 174, 180, 170;
    --theme-accent-shadow: rgba(var(--theme-accent-rgb), 0.14);
    --theme-accent-shadow-strong: rgba(var(--theme-accent-rgb), 0.22);
    --accent-announcement: #bfc4b8;
    --accent-announcement-bg: rgba(191, 196, 184, 0.14);
    --accent-tts: #d3d0c5;
    --accent-tts-bg: rgba(211, 208, 197, 0.16);
    --scrollbar-thumb: rgba(137, 141, 134, 0.3);
    --progress-bar-track: #dddcd4;
    --main-control-idle-bg: #d6d5ce;
    --title-brand-shell-bg: linear-gradient(180deg, rgba(255, 255, 253, 0.95) 0%, rgba(237, 237, 232, 0.9) 100%);
    --title-brand-shell-border: rgba(130, 134, 124, 0.2);
    --title-brand-logo-shell-bg: radial-gradient(circle at 26% 20%, rgba(255, 255, 253, 0.98), transparent 42%), linear-gradient(160deg, rgba(216, 217, 210, 0.36) 0%, rgba(246, 246, 242, 0.6) 100%);
    --title-brand-primary-from: #2e342f;
    --title-brand-primary-to: #74786e;
    --title-brand-accent-from: #9ca194;
    --title-brand-accent-to: #d3d0c5;
}

/* tema claro: texto/cores */

/* Garantir textos legíveis nos painéis */
body:not(.theme-dark) .player-column-lhs,
body:not(.theme-dark) .playlist-panel,
body:not(.theme-dark) .chamadas-panel {
    color: #111827;
}

/* Textos do header sempre escuros */
body:not(.theme-dark) .panel-header,
body:not(.theme-dark) .panel-header .panel-title,
body:not(.theme-dark) .panel-header-meta {
    color: #374151;
}

body:not(.theme-dark) .panel-footer {
    color: #374151;
}

body:not(.theme-dark) .title-bar-text {
    color: #374151;
}

/* Títulos e labels dos modais */
body:not(.theme-dark) .modal-header,
body:not(.theme-dark) .modal-title,
body:not(.theme-dark) .form-label,
body:not(.theme-dark) label {
    color: #111827;
}

/* Textos secundários em modais */
body:not(.theme-dark) .help-text {
    color: #6B7280;
}

/* Inputs com aparência prateada e texto escuro */
body:not(.theme-dark) input[type="text"],
body:not(.theme-dark) input[type="password"],
body:not(.theme-dark) input[type="number"],
body:not(.theme-dark) input[type="time"],
body:not(.theme-dark) input[type="date"],
body:not(.theme-dark) textarea,
body:not(.theme-dark) select {
    background: linear-gradient(180deg, #FFFFFF 0%, #F9FAFB 100%);
    border: 1px solid #D1D5DB;
    color: #111827;
    box-shadow:
        inset 0 1px 2px rgba(0, 0, 0, 0.04),
        0 1px 0 rgba(255, 255, 255, 0.8);
}

body:not(.theme-dark) input::placeholder,
body:not(.theme-dark) textarea::placeholder {
    color: #9CA3AF;
}

body:not(.theme-dark) input[type="text"]:focus,
body:not(.theme-dark) input[type="password"]:focus,
body:not(.theme-dark) input[type="number"]:focus,
body:not(.theme-dark) input[type="time"]:focus,
body:not(.theme-dark) input[type="date"]:focus,
body:not(.theme-dark) textarea:focus,
body:not(.theme-dark) select:focus {
    border-color: var(--accent-primary);
    box-shadow:
        inset 0 1px 2px rgba(0, 0, 0, 0.04),
        0 0 0 3px var(--theme-accent-ring);
}

/* Botões primários com texto branco */
body:not(.theme-dark) .btn-primary {
    background: linear-gradient(180deg,
            var(--accent-primary) 0%,
            color-mix(in srgb, var(--accent-primary) 80%, black) 100%);
    color: #FFFFFF;
    box-shadow:
        0 2px 4px rgba(0, 0, 0, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

body:not(.theme-dark) .btn-primary:hover {
    background: linear-gradient(180deg,
            color-mix(in srgb, var(--accent-primary) 90%, white) 0%,
            var(--accent-primary) 100%);
    color: #FFFFFF;
}

/* Botões secundários/ghost com texto escuro */
body:not(.theme-dark) .btn-secondary,
body:not(.theme-dark) .btn-ghost {
    color: #374151;
    background: rgba(0, 0, 0, 0.05);
}

body:not(.theme-dark) .btn-secondary:hover,
body:not(.theme-dark) .btn-ghost:hover {
    background: rgba(0, 0, 0, 0.1);
    color: #111827;
}

/* Playlist items */
body:not(.theme-dark) .playlist-item {
    color: #111827;
}

body:not(.theme-dark) .playlist-item .track-title {
    color: #111827;
}

body:not(.theme-dark) .playlist-item .track-artist,
body:not(.theme-dark) .playlist-item .track-duration {
    color: #6B7280;
}

/* Tooltips com contraste alinhado ao tema ativo */
body [data-tooltip]::after {
    background: var(--tooltip-bg, #1F2937);
    color: var(--tooltip-text, #FFFFFF);
    border-color: var(--tooltip-border, rgba(0, 0, 0, 0.2));
    box-shadow: var(--tooltip-shadow, 0 4px 12px rgba(0, 0, 0, 0.15));
}

/* Dropdowns e menus */
body:not(.theme-dark) .dropdown-menu,
body:not(.theme-dark) .context-menu {
    background: #FFFFFF;
    border: 1px solid #D1D5DB;
    color: #111827;
}

body:not(.theme-dark) .dropdown-item {
    color: #374151;
}

body:not(.theme-dark) .dropdown-item:hover {
    background: #F3F4F6;
    color: #111827;
}

/* Badges com texto escuro */
body:not(.theme-dark) .badge,
body:not(.theme-dark) .tag {
    color: #374151;
}

/* Scrollbar estilizada */
body:not(.theme-dark) ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

body:not(.theme-dark) ::-webkit-scrollbar-track {
    background: #E5E7EB;
    border-radius: 4px;
}

body:not(.theme-dark) ::-webkit-scrollbar-thumb {
    background: #9CA3AF;
    border-radius: 4px;
}

body:not(.theme-dark) ::-webkit-scrollbar-thumb:hover {
    background: #6B7280;
}