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

:root {
    --background: #101827;
    --sidebar: #172235;
    --card: #1d2b40;
    --border: #304158;
    --text: #f1f5f9;
    --muted: #94a3b8;
    --green: #22c58b;
    --red: #f87171;
}

body {
    font-family: Arial, sans-serif;
    background: var(--background);
    color: var(--text);
}

.app-container {
    display: flex;
    min-height: 100vh;
}

.sidebar {
    width: 250px;
    background: var(--sidebar);
    padding: 25px 18px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--border);
}

.logo {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 40px;
}

.logo span {
    background: var(--green);
    color: #101827;
    padding: 10px;
    border-radius: 10px;
    font-weight: bold;
}

.logo h2 {
    font-size: 19px;
}

.environment {
    margin-bottom: 30px;
}

.environment label {
    display: block;
    font-size: 10px;
    color: var(--muted);
    margin-bottom: 10px;
    letter-spacing: 1px;
}

.environment select,
.filters select,
.filters input {
    width: 100%;
    padding: 12px;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 8px;
}

.menu {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.menu a {
    text-decoration: none;
    color: var(--muted);
    padding: 12px;
    border-radius: 8px;
    font-size: 14px;
    transition: 0.2s;
}

.menu a:hover,
.menu a.active {
    background: #263b50;
    color: var(--green);
}

.sidebar-footer {
    margin-top: auto;
    padding-top: 30px;
    font-size: 10px;
    color: var(--muted);
}

.main-content {
    flex: 1;
    padding: 35px;
    min-width: 0;
}

.topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.topbar h1 {
    font-size: 27px;
    margin-bottom: 8px;
}

.topbar p {
    color: var(--muted);
    font-size: 14px;
}

.profile-button {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: none;
    background: var(--green);
    color: #101827;
    font-weight: bold;
    font-size: 17px;
}

.filters {
    display: flex;
    gap: 12px;
    margin-bottom: 25px;
    max-width: 350px;
}

.summary-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-bottom: 25px;
}

.summary-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 23px;
}

.summary-card span {
    color: var(--muted);
    font-size: 13px;
}

.summary-card h2 {
    margin-top: 15px;
    font-size: 24px;
}

.highlight {
    border-color: var(--green);
}

.highlight h2 {
    color: var(--green);
}

.content-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 20px;
}

.panel {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 25px;
    min-height: 220px;
}

.panel h3 {
    font-size: 16px;
    margin-bottom: 25px;
}

.empty-state {
    color: var(--muted);
    font-size: 13px;
    padding: 15px 0;
}

@media (max-width: 1000px) {
    .summary-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 700px) {
    .sidebar {
        width: 75px;
        padding: 15px 8px;
    }

    .logo {
        justify-content: center;
    }

    .logo h2,
    .environment label,
    .environment select,
    .menu a,
    .sidebar-footer {
        font-size: 0;
    }

    .environment {
        display: none;
    }

    .menu a {
        text-align: center;
        padding: 15px 2px;
    }

    .main-content {
        padding: 20px 12px;
    }

    .summary-grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .summary-card {
        padding: 15px;
    }

    .summary-card h2 {
        font-size: 17px;
    }

    .content-grid {
        grid-template-columns: 1fr;
    }
}

/* Autenticação */
.auth-screen{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;background:#101827;color:#f1f5f9}
.auth-screen[hidden],.app-container[hidden]{display:none!important}
.auth-card{width:min(100%,420px);padding:32px;background:#1d2b40;border:1px solid #304158;border-radius:18px;box-shadow:0 24px 80px #0006}
.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:28px;font-size:20px}
.auth-brand span{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;background:#22c58b;color:#101827;font-weight:800}
.auth-card h1{font-size:25px;margin-bottom:8px}
.auth-card>p{color:#94a3b8;line-height:1.5;margin-bottom:22px}
.auth-form{display:flex;flex-direction:column;gap:10px}
.auth-form[hidden]{display:none}
.auth-form label{font-size:13px;color:#cbd5e1;margin-top:8px}
.auth-form input{width:100%;padding:13px 14px;border:1px solid #40516a;border-radius:9px;background:#101827;color:#f1f5f9;font-size:16px}
.auth-submit{padding:14px;border:0;border-radius:9px;background:#22c58b;color:#101827;font-size:15px;font-weight:700;cursor:pointer;margin-top:12px}
.auth-link{border:0;background:transparent;color:#22c58b;padding:10px;cursor:pointer}
.auth-message{min-height:22px;margin:14px 0 0!important;color:#22c58b;font-size:13px}
.auth-message.error{color:#f87171}
.profile-actions{display:flex;align-items:center;gap:12px}
#signed-in-email{font-size:12px;color:#94a3b8}
.logout-button{border:1px solid #40516a;background:#1d2b40;color:#f1f5f9;border-radius:8px;padding:9px 12px;cursor:pointer}
@media(max-width:700px){.auth-card{padding:24px}.profile-actions{gap:6px}#signed-in-email{display:none}}

/* Módulo funcional de receitas */
.module-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:26px}.module-heading,.income-toolbar,.income-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.module-heading p,.income-row small{display:block;color:var(--muted);font-size:13px;margin-top:6px}.primary-button,.secondary-button{border:0;border-radius:8px;padding:11px 16px;cursor:pointer;font-weight:700}.primary-button{background:var(--green);color:#101827}.secondary-button{background:#304158;color:var(--text)}.income-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0;padding:18px;border:1px solid var(--border);border-radius:10px}.income-form[hidden]{display:none}.income-form input,.income-form select,.income-form textarea,.income-toolbar input{width:100%;padding:11px;background:#101827;color:var(--text);border:1px solid #40516a;border-radius:8px}.income-form textarea,.form-actions,.form-error{grid-column:1/-1}.form-actions{display:flex;gap:10px}.income-toolbar{margin:24px 0;padding:14px 0;border-bottom:1px solid var(--border)}.income-toolbar label{color:var(--muted);font-size:13px}.income-toolbar input{display:block;margin-top:6px}.income-row{padding:16px 0;border-bottom:1px solid var(--border)}.income-row>div:first-child{flex:1}.income-row b{white-space:nowrap}.row-actions{display:flex;gap:10px}.row-actions button{border:0;background:transparent;color:var(--green);cursor:pointer}.row-actions .danger-link,.form-error{color:var(--red)}.form-error{font-size:13px;margin-top:8px}@media(max-width:700px){.module-heading,.income-toolbar,.income-row{align-items:flex-start;flex-wrap:wrap}.income-form{grid-template-columns:1fr}.income-row{gap:8px}}


/* Recorrência e painel conectado */
.recurrence-hint{grid-column:1/-1;color:var(--muted);font-size:12px;line-height:1.5}
.expense-notes{grid-column:1/-1}
.dashboard-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--border)}
.dashboard-row:last-child{border-bottom:0}
.dashboard-row span{min-width:0}
.dashboard-row strong{display:block;overflow-wrap:anywhere;font-size:13px}
.dashboard-row small{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.dashboard-row b{white-space:nowrap;font-size:13px}
.positive-value{color:var(--green)}
.negative-value{color:var(--red)}