:root {
    --bg: #07111f;
    --bg-2: #0b1628;
    --card: rgba(16, 28, 51, 0.88);
    --card-solid: #101c33;
    --line: rgba(148, 163, 184, 0.16);
    --text: #eef4ff;
    --muted: #93a4c3;
    --green: #22d3a2;
    --green-2: #16a34a;
    --blue: #4f8cff;
    --pink: #f472b6;
    --red: #fb7185;
    --purple: #8b7cff;
    --purple-2: #6d5ef5;
    --amber: #f59e0b;
    --cyan: #06b6d4;
    --radius: 22px;
    --shadow: 0 16px 40px rgba(2, 8, 20, 0.35);
    --sidebar: 248px;
    --font: "Plus Jakarta Sans", "Segoe UI", sans-serif;
    --overlay: rgba(2, 8, 18, 0.62);
    --input: #0c1729;
    --nav: #10192c;
    --focus: #8eb4ff;
    --on-kpi: #eef4ff;
    --on-kpi-muted: #d5e4ff;
    --grad-saldo: linear-gradient(155deg, #1faf78 0%, #12845c 46%, #0b5a42 100%);
    --grad-receitas: linear-gradient(155deg, #3b82f6 0%, #2563eb 48%, #1d4ed8 100%);
    --grad-despesas: linear-gradient(155deg, #fb7185 0%, #e11d48 52%, #be185d 100%);
    --grad-meta: linear-gradient(155deg, #a78bfa 0%, #7c3aed 50%, #6d28d9 100%);
    --grad-nav: linear-gradient(90deg, #6d63f5, #7b74ff);
    --grad-brand: linear-gradient(180deg, #8b7cff, #4f8cff);
    --grad-fab: linear-gradient(180deg, #8b7cff, #6d5ef5);
    --grad-page: radial-gradient(circle at top right, rgba(79, 140, 255, 0.18), transparent 28%),
        radial-gradient(circle at 10% 20%, rgba(34, 211, 162, 0.12), transparent 24%),
        var(--bg);
    --btn-despesa: #e11d48;
    color-scheme: dark;
}

[hidden] { display: none !important; }

html.sessao-local #tela-login { display: none !important; }

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body { min-height: 100%; max-width: 100%; }

body {
    font-family: var(--font);
    background: var(--grad-page);
    color: var(--text);
    overflow-x: clip;
}

body.menu-aberto,
body.modal-aberto { overflow: hidden; }

img { max-width: 100%; }

a { color: inherit; text-decoration: none; }

button, input, select, textarea { font: inherit; color: inherit; }

button { cursor: pointer; }

button:disabled { cursor: not-allowed; opacity: 0.65; }

:focus-visible {
    outline: 2px solid var(--focus);
    outline-offset: 2px;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.pular {
    position: absolute;
    left: 12px;
    top: -40px;
    background: var(--card-solid);
    color: var(--text);
    padding: 8px 12px;
    border-radius: 10px;
    z-index: 80;
}

.pular:focus { top: 12px; }

h1, h2, h3 { line-height: 1.2; }

p { line-height: 1.45; }

@keyframes subir {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}

@keyframes subir-painel {
    from { transform: translateY(12px); }
    to { transform: none; }
}

@keyframes brilho {
    from { background-position: 100% 0; }
    to { background-position: -100% 0; }
}

@keyframes girar { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation: none !important;
        transition: none !important;
    }
}