:root {
            --bg-soft: #F5F5F5;
            --bg-panel: #ffffff;
            --ink: #111111;
            --muted: #64748b;
            --line: #dbe4ef;
            --brand: #2EC8D9;
            --brand-soft: #ecfeff;
            --focus: #0284c7;
            --red-main: #F0516F;
            --blue-main: #2EC8D9;
            --yellow-main: #F2AA1B;
            --dark-main: #143A40;
        }

        ::-webkit-scrollbar { width: 6px; height: 6px; }
        ::-webkit-scrollbar-track { background: transparent; }
        ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
        ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
        body {
            -webkit-font-smoothing: antialiased;
            background:
                radial-gradient(1100px 380px at 5% -10%, #e0f2fe 0%, transparent 55%),
                radial-gradient(1000px 420px at 95% -10%, #ecfeff 0%, transparent 60%),
                var(--bg-soft);
            color: var(--ink);
        }
        button, label { -webkit-tap-highlight-color: transparent; }
        .hide-scrollbar::-webkit-scrollbar { display: none; }
        .hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
        
        details > summary { list-style: none; }
        details > summary::-webkit-details-marker { display: none; }

        /* Classe de Privacidade: Embaça tudo que for classe .privacy-blur */
        body.is-private .privacy-blur {
            filter: blur(7px);
            opacity: 0.7;
            user-select: none;
            pointer-events: none;
            transition: all 0.3s ease;
        }
        #dashboard-screen.is-private .privacy-blur {
            filter: blur(7px);
            opacity: 0.7;
            user-select: none;
            pointer-events: none;
            transition: all 0.3s ease;
        }
        .privacy-blur { transition: all 0.3s ease; }

        #dashboard-screen > div[class*="bg-white"] {
            background: var(--bg-panel) !important;
            border-color: var(--line) !important;
            box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
        }
        #dashboard-screen .section-title {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 0;
            border-radius: 0;
            font-size: 1rem;
            font-weight: 600;
            line-height: 1.25;
            letter-spacing: -0.01em;
            background: transparent;
            color: #111111;
            border: 0;
        }
        #dashboard-screen .section-title.fin { color: var(--blue-main); }
        #dashboard-screen .section-title.warn { color: var(--yellow-main); }
        #dashboard-screen .section-title.risk { color: var(--red-main); }

        #dashboard-screen h1 { letter-spacing: -0.02em; }
        #dashboard-screen h4 { font-weight: 700; color: #334155; }
        #dashboard-screen p, #dashboard-screen label { color: var(--muted); }

        #carteira-valor { color: #ffffff !important; }
        #fatura-valor { color: var(--red-main) !important; }
        #reserva-valor { color: var(--yellow-main) !important; }
        #renda-mensal-valor { color: var(--blue-main) !important; }
        #saldo-livre-valor { color: var(--blue-main) !important; }
        #gasto-total-mes { color: var(--red-main) !important; }
        #valor-desperdicio { color: var(--red-main) !important; }

        #dashboard-screen button {
            transition: all 0.18s ease;
        }
        #dashboard-screen button:hover { transform: translateY(-1px); }

        #dashboard-screen header .bg-white {
            border-color: var(--line) !important;
            box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
        }

        #dashboard-screen input,
        #dashboard-screen select,
        #modal-cadastro input,
        #modal-cadastro select,
        #modal-configuracoes input,
        #modal-configuracoes select {
            border-color: var(--line) !important;
        }
        #dashboard-screen input:focus,
        #dashboard-screen select:focus,
        #modal-cadastro input:focus,
        #modal-cadastro select:focus,
        #modal-configuracoes input:focus,
        #modal-configuracoes select:focus {
            outline: none;
            border-color: var(--focus) !important;
            box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.12);
        }

        #dashboard-screen .overflow-x-auto { overflow-x: auto; }

        /* Paleta global aplicada no app (além dos títulos) */
        #dashboard-screen .text-rose-500, #dashboard-screen .text-rose-600, #dashboard-screen .text-rose-700,
        #dashboard-screen .text-orange-500, #dashboard-screen .text-orange-600, #dashboard-screen .text-orange-700,
        #dashboard-screen .text-red-500, #dashboard-screen .text-red-600 {
            color: var(--red-main) !important;
        }
        #dashboard-screen .bg-rose-50, #dashboard-screen .bg-rose-100, #dashboard-screen .bg-rose-50\/50,
        #dashboard-screen .bg-orange-50, #dashboard-screen .bg-orange-100, #dashboard-screen .bg-orange-50\/50 {
            background-color: rgba(240,81,111,0.10) !important;
        }
        #dashboard-screen .border-rose-100, #dashboard-screen .border-rose-200,
        #dashboard-screen .border-orange-100, #dashboard-screen .border-orange-200 {
            border-color: rgba(240,81,111,0.35) !important;
        }

        #dashboard-screen .text-amber-500, #dashboard-screen .text-amber-600, #dashboard-screen .text-amber-700,
        #dashboard-screen .text-yellow-500, #dashboard-screen .text-yellow-600 {
            color: var(--yellow-main) !important;
        }
        #dashboard-screen .bg-amber-50, #dashboard-screen .bg-amber-100, #dashboard-screen .bg-amber-50\/50 {
            background-color: color-mix(in srgb, var(--yellow-main) 14%, white) !important;
        }
        #dashboard-screen .border-amber-100, #dashboard-screen .border-amber-200 {
            border-color: color-mix(in srgb, var(--yellow-main) 32%, white) !important;
        }

        #dashboard-screen .text-blue-500, #dashboard-screen .text-blue-600, #dashboard-screen .text-blue-700,
        #dashboard-screen .text-cyan-600, #dashboard-screen .text-cyan-700,
        #dashboard-screen .text-emerald-600, #dashboard-screen .text-emerald-700 {
            color: var(--blue-main) !important;
        }
        #dashboard-screen .bg-blue-50, #dashboard-screen .bg-blue-100, #dashboard-screen .bg-blue-50\/50,
        #dashboard-screen .bg-cyan-50, #dashboard-screen .bg-cyan-100,
        #dashboard-screen .bg-emerald-50, #dashboard-screen .bg-emerald-100 {
            background-color: color-mix(in srgb, var(--blue-main) 12%, white) !important;
        }
        #dashboard-screen .border-blue-100, #dashboard-screen .border-blue-200,
        #dashboard-screen .border-cyan-100, #dashboard-screen .border-cyan-200,
        #dashboard-screen .border-emerald-100, #dashboard-screen .border-emerald-200 {
            border-color: color-mix(in srgb, var(--blue-main) 30%, white) !important;
        }

        #dashboard-screen .text-slate-700, #dashboard-screen .text-slate-800, #dashboard-screen .text-slate-900 {
            color: var(--ink) !important;
        }
        #dashboard-screen .bg-slate-100, #dashboard-screen .bg-slate-50 {
            background-color: #f5f5f5 !important;
        }
        #dashboard-screen .border-slate-200, #dashboard-screen .border-slate-100 {
            border-color: #e5e7eb !important;
        }

        #modal-cadastro .text-rose-500, #modal-cadastro .text-rose-600, #modal-cadastro .text-rose-700,
        #modal-configuracoes .text-rose-500, #modal-configuracoes .text-rose-600, #modal-configuracoes .text-rose-700 { color: var(--red-main) !important; }
        #modal-cadastro .text-blue-500, #modal-cadastro .text-blue-600, #modal-cadastro .text-blue-700,
        #modal-configuracoes .text-blue-500, #modal-configuracoes .text-blue-600, #modal-configuracoes .text-blue-700,
        #modal-cadastro .text-emerald-600, #modal-configuracoes .text-emerald-600 { color: var(--blue-main) !important; }
        #modal-cadastro .text-amber-500, #modal-cadastro .text-amber-600, #modal-cadastro .text-amber-700,
        #modal-configuracoes .text-amber-500, #modal-configuracoes .text-amber-600, #modal-configuracoes .text-amber-700 { color: var(--yellow-main) !important; }
        #dashboard-screen table { table-layout: auto; width: 100%; }
        #extrato-tabela { width: 100%; min-width: 0; table-layout: fixed; }
        #extrato-tabela th,
        #extrato-tabela td {
            font-size: 12px;
            line-height: 1.2;
            word-break: normal !important;
            overflow-wrap: normal !important;
        }
        #extrato-tabela th:nth-child(1), #extrato-tabela td:nth-child(1) { width: 72px; white-space: nowrap !important; }
        #extrato-tabela th:nth-child(2), #extrato-tabela td:nth-child(2) { width: 50%; }
        #extrato-tabela th:nth-child(3), #extrato-tabela td:nth-child(3) { width: 150px; white-space: nowrap !important; }
        #extrato-tabela th:nth-child(4), #extrato-tabela td:nth-child(4) { width: 120px; white-space: nowrap !important; }
        #extrato-tabela th:nth-child(5), #extrato-tabela td:nth-child(5) { width: 72px; white-space: nowrap !important; }
        #extrato-tabela .text-blue-600,
        #extrato-tabela .text-blue-700 { color: #143A40 !important; }
        #extrato-tabela .bg-blue-50 { background-color: rgba(20,58,64,.10) !important; }
        #extrato-tabela .border-blue-100 { border-color: rgba(20,58,64,.22) !important; }
        .bancos-summary {
            background: #ffffff;
            border: 1px solid #dbe3ee;
            color: #415a77;
        }
        .bancos-summary:hover { background: #f8fafc; }
        #dashboard-screen table th,
        #dashboard-screen table td {
            white-space: normal !important;
            word-break: break-word;
            vertical-align: middle;
        }
        /* Extrato: mantém colunas numéricas sem quebra */
        #extrato-tabela th:nth-child(1), #extrato-tabela td:nth-child(1),
        #extrato-tabela th:nth-child(3), #extrato-tabela td:nth-child(3),
        #extrato-tabela th:nth-child(4), #extrato-tabela td:nth-child(4),
        #extrato-tabela th:nth-child(5), #extrato-tabela td:nth-child(5) {
            white-space: nowrap !important;
            word-break: keep-all !important;
            overflow-wrap: normal !important;
        }
        #extrato-tabela th:nth-child(2), #extrato-tabela td:nth-child(2) {
            white-space: normal !important;
            word-break: break-word !important;
        }
        #dashboard-screen table th:nth-child(1),
        #dashboard-screen table td:nth-child(1) { width: 64px; }
        #dashboard-screen table th:nth-child(2),
        #dashboard-screen table td:nth-child(2) { width: auto; }
        #dashboard-screen table th:nth-child(3),
        #dashboard-screen table td:nth-child(3) { width: 130px; }
        #dashboard-screen table th:nth-child(4),
        #dashboard-screen table td:nth-child(4) { width: 96px; text-align: right; }
        #dashboard-screen table th:nth-child(5),
        #dashboard-screen table td:nth-child(5) { width: 78px; text-align: center; }

        @media (max-width: 768px) {
            body { padding-bottom: 110px; }
            #dashboard-screen { padding: 12px 12px 96px; }
            #dashboard-screen header {
                margin-bottom: 12px;
                gap: 10px;
                position: static;
                background: #F5F5F5;
                padding-top: 6px;
                padding-bottom: 8px;
            }
            #dashboard-screen h1 { font-size: 1.35rem; line-height: 1.2; }
            #dashboard-screen header > div:last-child {
                width: 100%;
                display: flex;
                flex-wrap: nowrap;
                align-items: center;
                justify-content: space-between;
                overflow: visible;
                gap: 6px;
                padding-bottom: 2px;
            }
            #dashboard-screen header button,
            #dashboard-screen header select {
                min-height: 40px;
                font-size: 13px;
            }
            #dashboard-screen header > div:last-child > * {
                min-width: 0;
                width: auto;
                display: flex;
                justify-content: center;
                flex: 0 0 auto;
            }
            #dashboard-screen header > div:last-child > .relative {
                min-width: 0;
            }
            #dashboard-screen header > div:last-child > button,
            #dashboard-screen header > div:last-child > .relative {
                min-height: 38px;
            }
            #dashboard-screen #btn-sair-topo {
                width: auto;
                min-width: 48px;
            }
            #dashboard-screen #btn-instalar-app {
                display: none !important;
            }

            #dashboard-screen .resumo-grid {
                grid-template-columns: 1fr !important;
                gap: 10px !important;
            }
            #dashboard-screen [class*="lg:grid-cols-3"] {
                grid-template-columns: 1fr !important;
                gap: 10px !important;
            }
            #dashboard-screen [class*="sm:grid-cols-2"] {
                grid-template-columns: 1fr !important;
            }
            #dashboard-screen [class*="rounded-2xl"] {
                border-radius: 14px !important;
            }
            #dashboard-screen [class*="p-6"] { padding: 14px !important; }
            #dashboard-screen [class*="p-5"] { padding: 12px !important; }

            #grid-bancos-dashboard,
            #lista-grandes-dividas,
            #lista-dividas-atrasadas,
            #lista-contas-recorrentes-mes {
                grid-template-columns: 1fr !important;
                gap: 10px !important;
            }

            #modal-cadastro > div {
                max-height: 92vh;
                border-top-left-radius: 20px;
                border-top-right-radius: 20px;
            }
            #modal-cadastro .grid.grid-cols-2 { grid-template-columns: 1fr !important; gap: 10px !important; }
            #modal-cadastro form { gap: 14px; }
            #modal-cadastro input,
            #modal-cadastro select,
            #modal-cadastro button { font-size: 14px; }

            #modal-configuracoes {
                align-items: flex-end;
                padding: 0;
            }

            #modal-configuracoes > div {
                width: 100%;
                max-width: none;
                max-height: 92vh;
                border-bottom-left-radius: 0;
                border-bottom-right-radius: 0;
                border-top-left-radius: 20px;
                border-top-right-radius: 20px;
                padding: 18px;
            }
            #modal-configuracoes .grid.grid-cols-2,
            #modal-configuracoes .grid.grid-cols-2.md\:grid-cols-3,
            #modal-configuracoes .grid.grid-cols-1.md\:grid-cols-2,
            #modal-configuracoes .grid.grid-cols-2.md\:grid-cols-3,
            #modal-configuracoes .grid.grid-cols-2.md\:grid-cols-3.gap-3 {
                grid-template-columns: 1fr !important;
            }
            #modal-configuracoes input,
            #modal-configuracoes select,
            #modal-configuracoes button { font-size: 14px; }

            #btn-salvar,
            #auth-btn,
            #btn-salvar-perfil,
            #btn-salvar-limites {
                min-height: 46px;
            }

            #lista-alertas-topo { max-height: 45vh !important; }

            #dashboard-screen .custom-scrollbar { max-height: 62vh !important; }
            #dashboard-screen .custom-scrollbar table { min-width: 100%; }
            #dashboard-screen .custom-scrollbar table thead th { font-size: 10px; }
            #dashboard-screen .custom-scrollbar table tbody td {
                font-size: 11px;
                padding-top: 10px;
                padding-bottom: 10px;
            }
            #extrato-tabela th:nth-child(1), #extrato-tabela td:nth-child(1) { width: 66px; }
            #extrato-tabela th:nth-child(3), #extrato-tabela td:nth-child(3) { width: 112px; }
            #extrato-tabela th:nth-child(4), #extrato-tabela td:nth-child(4) { width: 102px; }
            #extrato-tabela th:nth-child(5), #extrato-tabela td:nth-child(5) { width: 58px; }
            #dashboard-screen table th:nth-child(3),
            #dashboard-screen table td:nth-child(3) { width: 120px; }
            #dashboard-screen table th:nth-child(4),
            #dashboard-screen table td:nth-child(4) { width: 92px; }
            #dashboard-screen table th:nth-child(5),
            #dashboard-screen table td:nth-child(5) { width: 64px; }
        }

        @media (min-width: 769px) {
            #dashboard-screen { padding-top: 28px; }
            #dashboard-screen header > div:last-child {
                display: flex;
                flex-wrap: wrap;
                justify-content: flex-end;
                row-gap: 8px;
            }
            #dashboard-screen .custom-scrollbar { max-height: 70vh; }
            #dashboard-screen .resumo-grid {
                grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
                gap: 10px !important;
            }
            #dashboard-screen .resumo-grid > div {
                grid-column: span 1 / span 1 !important;
                padding: 10px 14px !important;
                min-height: 108px;
            }
            #dashboard-screen .resumo-grid h2 { font-size: 1.95rem; }
            #dashboard-screen .resumo-principal {
                background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
                border-color: #1f2937 !important;
            }
        }