:root{
  --brand:#4f46e5;
  --brand-2:#7c3aed;
  --brand-soft:#eef2ff;
  --income:#0f9d6e;
  --income-soft:#e7f7f1;
  --expense:#e11d48;
  --expense-soft:#fdeef1;
  --ink:#0f172a;
  --ink-2:#475569;
  --muted:#7b8798;
  --line:#e7eaf1;
  --bg:#f5f6fa;
  --card:#ffffff;
  --sidebar:#0d1526;
  --sidebar-2:#131e33;
  --radius:18px;
  --shadow:0 18px 40px -26px rgba(15,23,42,.45);
  --shadow-sm:0 6px 18px -12px rgba(15,23,42,.4);
  --bs-body-font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
}

*{ -webkit-tap-highlight-color:transparent; }

body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--bs-body-font-family);
  font-size:15px;
  letter-spacing:-.01em;
  min-height:100vh;
}

.ic{ font-size:1.05rem; line-height:1; vertical-align:-2px; }

.brand-line{ display:flex; align-items:center; gap:10px; }
.brand-dot{
  width:34px;height:34px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--brand),var(--brand-2));
  box-shadow:0 10px 22px -12px rgba(79,70,229,.9);flex:0 0 auto;
}
.brand-dot svg{ width:19px;height:19px; }
.brand-name{ font-weight:800; font-size:1.02rem; letter-spacing:-.02em; }

.auth-page{
  flex-direction:column;
  background:
    radial-gradient(900px 500px at 10% -10%, #e0e7ff 0%, rgba(224,231,255,0) 60%),
    radial-gradient(800px 460px at 95% 5%, #ede9fe 0%, rgba(237,233,254,0) 55%),
    linear-gradient(180deg,#f8fafc,#eef1f7);
  display:flex; align-items:center; justify-content:center; padding:28px 16px;
}
.auth-wrap{ width:100%; max-width:940px; }
.auth-split{
  display:grid; grid-template-columns:1.05fr .95fr; background:#fff; border-radius:26px;
  box-shadow:0 40px 80px -50px rgba(15,23,42,.6); overflow:hidden; border:1px solid rgba(15,23,42,.05);
}
.auth-side{
  background:linear-gradient(155deg,#1b1f3b 0%, #312e81 55%, #4f46e5 120%);
  color:#fff; padding:42px 38px; position:relative; overflow:hidden;
}
.auth-side:after{
  content:""; position:absolute; width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.22),rgba(255,255,255,0) 65%);
  right:-110px; bottom:-140px;
}
.auth-side h2{ font-size:1.6rem; font-weight:800; letter-spacing:-.03em; margin:26px 0 10px; position:relative; }
.auth-side p{ color:#c7d2fe; font-size:.92rem; line-height:1.6; position:relative; }
.auth-side ul{ list-style:none; padding:0; margin:26px 0 0; position:relative; }
.auth-side li{ display:flex; gap:10px; align-items:flex-start; font-size:.88rem; color:#e0e7ff; margin-bottom:12px; }
.auth-side li i{ color:#a5b4fc; margin-top:2px; }

.auth-form{ padding:42px 40px; }
.auth-title{ font-size:1.42rem; font-weight:800; letter-spacing:-.03em; margin:18px 0 6px; }
.auth-sub{ color:var(--muted); font-size:.9rem; margin-bottom:24px; }
.auth-card{
  background:#fff; border-radius:22px; padding:34px; max-width:430px; margin:0 auto;
  box-shadow:0 30px 70px -45px rgba(15,23,42,.55); border:1px solid rgba(15,23,42,.05);
}

.form-label{ font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-2); margin-bottom:6px; }
.form-control, .form-select{
  border:1.5px solid var(--line); border-radius:12px; padding:.7rem .9rem; font-size:.95rem;
  background:#fff; color:var(--ink);
}
.form-control:focus, .form-select:focus{ border-color:var(--brand); box-shadow:0 0 0 4px rgba(79,70,229,.12); }
.input-group-text{ background:#f8fafc; border:1.5px solid var(--line); border-radius:12px; color:var(--muted); font-weight:700; }

.btn-google{
  display:flex; align-items:center; justify-content:center; gap:10px; width:100%;
  padding:.78rem; border-radius:12px; border:1.5px solid var(--line); background:#fff;
  font-weight:700; font-size:.94rem; color:var(--ink); text-decoration:none; transition:.18s;
}
.btn-google:hover{ background:#f8fafc; border-color:#cbd5e1; color:var(--ink); }
.btn-google svg{ width:18px; height:18px; flex:0 0 auto; }
.divisor{ display:flex; align-items:center; gap:10px; margin:18px 0; color:var(--muted); font-size:.76rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.divisor:before, .divisor:after{ content:""; flex:1; height:1px; background:var(--line); }

.btn{ border-radius:12px; font-weight:700; font-size:.92rem; padding:.62rem 1.05rem; }
.btn-primary{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); border:none; box-shadow:0 14px 26px -16px rgba(79,70,229,.95); }
.btn-primary:hover{ background:linear-gradient(135deg,#4338ca,#6d28d9); }
.btn-light{ background:#fff; border:1.5px solid var(--line); }
.btn-soft{ background:var(--brand-soft); color:var(--brand); border:none; }
.btn-soft:hover{ background:#e0e7ff; color:#3730a3; }
.btn-sm{ padding:.42rem .8rem; font-size:.82rem; border-radius:10px; }

.shell{ display:flex; min-height:100vh; }
.sidebar{
  width:262px; flex:0 0 262px; background:linear-gradient(180deg,var(--sidebar),var(--sidebar-2));
  color:#cbd5e1; padding:20px 16px; position:fixed; inset:0 auto 0 0; z-index:1040;
  display:flex; flex-direction:column; gap:6px; transition:transform .25s ease;
}
.sidebar .brand-line{ padding:6px 8px 20px; }
.sidebar .brand-name{ color:#fff; }
.nav-label{ font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; color:#5b6b85; margin:14px 10px 6px; font-weight:800; }
.nav-item{
  display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:12px;
  color:#aebacd; text-decoration:none; font-size:.9rem; font-weight:600; transition:.16s;
}
.nav-item i{ font-size:1.02rem; opacity:.9; }
.nav-item:hover{ background:rgba(255,255,255,.06); color:#fff; }
.nav-item.active{ background:linear-gradient(135deg,rgba(79,70,229,.95),rgba(124,58,237,.85)); color:#fff; box-shadow:0 12px 24px -16px rgba(79,70,229,.9); }
.sidebar-foot{ margin-top:auto; padding-top:14px; border-top:1px solid rgba(255,255,255,.07); }
.user-chip{ display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:12px; }
.avatar{
  width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-weight:800;font-size:.85rem;
  background:linear-gradient(140deg,#6366f1,#8b5cf6); color:#fff; flex:0 0 auto;
}
.user-chip .nm{ font-size:.85rem; font-weight:700; color:#fff; line-height:1.15; }
.user-chip .em{ font-size:.72rem; color:#7c8aa0; }

.main{ flex:1; margin-left:262px; min-width:0; display:flex; flex-direction:column; }
.topbar{
  position:sticky; top:0; z-index:1020; background:rgba(255,255,255,.86); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line); padding:12px 26px; display:flex; align-items:center; gap:14px;
}
.topbar h1{ font-size:1.12rem; font-weight:800; letter-spacing:-.02em; margin:0; }
.topbar .sub{ font-size:.78rem; color:var(--muted); }
.month-pick{
  display:flex; align-items:center; gap:6px; background:#fff; border:1.5px solid var(--line);
  border-radius:12px; padding:4px 6px;
}
.month-pick button{ border:none; background:transparent; color:var(--ink-2); width:26px; height:26px; border-radius:8px; }
.month-pick button:hover{ background:#f1f5f9; }
.month-pick input{
  border:none; background:transparent; font-weight:700; font-size:.84rem; color:var(--ink);
  width:158px; text-align:center;
}
.month-pick input:focus{ outline:none; }

.content{ padding:24px 26px 96px; }
.view{ display:none; animation:fade .22s ease; }
.view.active{ display:block; }
@keyframes fade{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }

.card-x{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.card-x .card-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:18px 20px 0; }
.card-x .card-head h3{ font-size:.98rem; font-weight:800; margin:0; letter-spacing:-.01em; }
.card-x .card-body-x{ padding:16px 20px 20px; }

.kpi{ padding:18px 20px; height:100%; position:relative; overflow:hidden; }
.kpi .lbl{ font-size:.72rem; text-transform:uppercase; letter-spacing:.09em; color:var(--muted); font-weight:800; }
.kpi .val{ font-size:1.62rem; font-weight:800; letter-spacing:-.03em; margin-top:6px; }
.kpi .chip{ font-size:.72rem; font-weight:800; padding:3px 9px; border-radius:99px; display:inline-block; margin-top:8px; }
.kpi .kicon{
  position:absolute; right:16px; top:16px; width:42px;height:42px;border-radius:13px;
  display:grid;place-items:center; font-size:1.1rem;
}
.kpi.income .kicon{ background:var(--income-soft); color:var(--income); }
.kpi.expense .kicon{ background:var(--expense-soft); color:var(--expense); }
.kpi.balance .kicon{ background:var(--brand-soft); color:var(--brand); }
.kpi.savings .kicon{ background:#fff7ed; color:#ea580c; }
.chip.up{ background:var(--income-soft); color:var(--income); }
.chip.down{ background:var(--expense-soft); color:var(--expense); }
.chip.flat{ background:#f1f5f9; color:var(--muted); }

.pos{ color:var(--income); }
.neg{ color:var(--expense); }
.mut{ color:var(--muted); }

.table-x{ width:100%; margin:0; }
.table-x th{
  font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
  font-weight:800; padding:10px 12px; border-bottom:1px solid var(--line); white-space:nowrap;
}
.table-x td{ padding:12px; border-bottom:1px solid #f1f4f9; vertical-align:middle; font-size:.9rem; }
.table-x tbody tr:last-child td{ border-bottom:none; }
.table-x tbody tr:hover{ background:#fafbff; }
.tx-desc{ font-weight:700; }
.tx-meta{ font-size:.74rem; color:var(--muted); }
.cat-pill{
  display:inline-flex; align-items:center; gap:7px; font-size:.78rem; font-weight:700;
  padding:4px 10px; border-radius:99px; background:#f4f6fb; color:var(--ink-2);
}
.cat-dot{ width:8px;height:8px;border-radius:50%; flex:0 0 auto; }

.empty{ text-align:center; padding:38px 16px; color:var(--muted); }
.empty i{ font-size:2rem; display:block; margin-bottom:8px; opacity:.45; }

.fab{
  position:fixed; right:26px; bottom:26px; z-index:1030; border:none; border-radius:16px;
  background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; font-weight:800;
  padding:14px 20px; display:flex; align-items:center; gap:9px; box-shadow:0 20px 34px -18px rgba(79,70,229,1);
}
.fab:hover{ transform:translateY(-1px); }

.quick-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.quick-opt{
  border:1.5px solid var(--line); border-radius:14px; padding:12px; background:#fff; text-align:left;
  display:flex; align-items:center; gap:10px; font-weight:700; font-size:.9rem; color:var(--ink);
}
.quick-opt.in{ border-color:#c7ecd9; background:var(--income-soft); color:#065f46; }
.quick-opt.out{ border-color:#fbd0da; background:var(--expense-soft); color:#9f1239; }
.quick-opt.active{ box-shadow:0 0 0 3px rgba(79,70,229,.12); border-color:var(--brand); }

.modal-content{ border:none; border-radius:20px; box-shadow:0 40px 80px -40px rgba(15,23,42,.6); }
.modal-header{ border-bottom:1px solid var(--line); padding:18px 22px; }
.modal-title{ font-size:1.02rem; font-weight:800; }
.modal-body{ padding:20px 22px; }
.modal-footer{ border-top:1px solid var(--line); padding:14px 22px; }

.goal{ padding:14px 0; border-bottom:1px solid #f1f4f9; }
.goal:last-child{ border-bottom:none; }
.goal .bar{ height:8px; background:#eef1f7; border-radius:99px; overflow:hidden; margin-top:8px; }
.goal .bar > span{ display:block; height:100%; border-radius:99px; background:linear-gradient(90deg,#34d399,#10b981); }
.goal .bar > span.warn{ background:linear-gradient(90deg,#fbbf24,#f59e0b); }
.goal .bar > span.over{ background:linear-gradient(90deg,#fb7185,#e11d48); }

.cat-card{ padding:16px; border-radius:16px; border:1px solid var(--line); background:#fff; height:100%; }
.cat-card .ico{
  width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:1.05rem;color:#fff;
}
.cat-card .nm{ font-weight:800; font-size:.92rem; margin-top:10px; }
.cat-card .tp{ font-size:.72rem; text-transform:uppercase; letter-spacing:.07em; font-weight:800; color:var(--muted); }
.cat-actions{ display:flex; gap:6px; margin-top:12px; }

.icon-pick{ display:grid; grid-template-columns:repeat(8,1fr); gap:6px; max-height:150px; overflow:auto; }
.icon-pick button{ border:1.5px solid var(--line); background:#fff; border-radius:10px; padding:7px 0; font-size:1rem; color:var(--ink-2); }
.icon-pick button.sel{ border-color:var(--brand); background:var(--brand-soft); color:var(--brand); }
.color-pick{ display:flex; gap:8px; flex-wrap:wrap; }
.color-pick button{ width:28px;height:28px;border-radius:9px;border:2px solid #fff; box-shadow:0 0 0 1.5px var(--line); }
.color-pick button.sel{ box-shadow:0 0 0 2.5px var(--brand); }

.toast-wrap{ position:fixed; right:18px; bottom:18px; z-index:1090; display:flex; flex-direction:column; gap:8px; }
.toast-x{
  background:#0f172a; color:#fff; padding:12px 16px; border-radius:12px; font-size:.88rem; font-weight:600;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.6); animation:slideIn .2s ease; max-width:340px;
}
.toast-x.ok{ background:#065f46; }
.toast-x.err{ background:#9f1239; }
@keyframes slideIn{ from{opacity:0; transform:translateX(20px);} to{opacity:1; transform:none;} }

.imp-banner{
  background:#fef3c7; border-bottom:1px solid #fde68a; color:#92400e; padding:9px 26px;
  font-size:.85rem; display:flex; align-items:center; justify-content:space-between; gap:12px; font-weight:600;
}

.tabs-x{ display:flex; gap:6px; background:#eef1f7; padding:4px; border-radius:12px; width:max-content; }
.tabs-x button{ border:none; background:transparent; padding:7px 14px; border-radius:9px; font-size:.85rem; font-weight:700; color:var(--ink-2); }
.tabs-x button.active{ background:#fff; color:var(--ink); box-shadow:0 4px 10px -6px rgba(15,23,42,.3); }

.filters{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.filters .form-control, .filters .form-select{ font-size:.86rem; padding:.5rem .7rem; }

.page-nav{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 20px; border-top:1px solid var(--line); }
.page-nav .pg-info{ font-size:.8rem; color:var(--muted); }

.report-table td.num, .report-table th.num{ text-align:right; font-variant-numeric:tabular-nums; }
.total-row td{ font-weight:800; background:#f8fafc; }

.bottom-nav{
  display:none; position:fixed; bottom:0; left:0; right:0; background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px); border-top:1px solid var(--line); z-index:1035; padding:6px 4px calc(6px + env(safe-area-inset-bottom));
}
.bottom-nav a{
  flex:1; text-align:center; text-decoration:none; color:var(--muted); font-size:.64rem; font-weight:700;
  padding:6px 2px; border-radius:10px; display:flex; flex-direction:column; align-items:center; gap:3px;
}
.bottom-nav a i{ font-size:1.15rem; }
.bottom-nav a.active{ color:var(--brand); }

.chart-box{ position:relative; width:100%; }
.card-x.h-100{ display:flex; flex-direction:column; }
.card-x.h-100 .card-body-x{ flex:1; display:flex; flex-direction:column; }
.card-x.h-100 .card-body-x > .chart-box{ flex:1; }

.skeleton{ background:linear-gradient(90deg,#eef1f7 25%,#f7f9fc 50%,#eef1f7 75%); background-size:200% 100%; animation:sk 1.1s infinite; border-radius:8px; }
@keyframes sk{ 0%{background-position:200% 0;} 100%{background-position:-200% 0;} }

@media (max-width:991px){
  .sidebar{ transform:translateX(-100%); }
  .sidebar.open{ transform:none; }
  .main{ margin-left:0; }
  .content{ padding:18px 16px 110px; }
  .topbar{ padding:10px 16px; }
  .auth-split{ grid-template-columns:1fr; }
  .auth-side{ display:none; }
  .auth-form{ padding:26px 22px; }
  .bottom-nav{ display:flex; }
  .fab{ bottom:78px; right:16px; padding:12px 16px; }
  .kpi .val{ font-size:1.4rem; }
  .topbar h1{ font-size:1rem; }
}
@media (max-width:575px){
  .kpi{ padding:14px; }
  .kpi .val{ font-size:1.02rem; }
  .kpi .chip{ font-size:.6rem; padding:2px 6px; }
  .kpi .kicon{ width:30px; height:30px; font-size:.9rem; right:10px; top:10px; }
  .quick-grid{ grid-template-columns:1fr; }
  .icon-pick{ grid-template-columns:repeat(6,1fr); }
  .content{ padding:14px 12px 110px; }
}

@media print{
  .sidebar, .topbar, .fab, .bottom-nav, .no-print, .toast-wrap{ display:none !important; }
  .main{ margin:0 !important; }
  .content{ padding:0 !important; }
  .card-x{ box-shadow:none !important; border:1px solid #ddd !important; page-break-inside:avoid; }
  body{ background:#fff !important; }
}

.site-footer{
  margin-top:28px; padding:16px 12px 22px; border-top:1px solid var(--line);
  text-align:center; color:var(--muted); font-size:.72rem; line-height:1.6;
}
.site-footer .sf-linha{ display:block; }
.site-footer .sf-curso{ font-weight:800; text-transform:uppercase; letter-spacing:.09em; font-size:.66rem; color:var(--ink-2); margin-bottom:4px; }
.site-footer .sf-equipe{ color:var(--ink-2); }
.site-footer .sf-equipe strong{ color:var(--ink); font-weight:800; }
.site-footer .sf-sep{ margin:0 6px; opacity:.5; }
.site-footer .sf-ods{ margin-top:6px; display:flex; align-items:center; justify-content:center; gap:6px; }
.site-footer .sf-badge{
  background:var(--brand-soft); color:var(--brand); font-weight:800; font-size:.62rem;
  padding:2px 7px; border-radius:99px; letter-spacing:.04em;
}
@media (max-width:575px){
  .site-footer{ font-size:.68rem; }
  .site-footer .sf-sep{ display:none; }
  .site-footer .sf-equipe span{ display:block; }
}