/* ═══════════════════════════════════════════════════════════════
   CADA CENTAVO — STYLE LIMPO E ORGANIZADO
   Gerado a partir do style.css consolidado
═══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   01. RESET / BASE / TOKENS
═══════════════════════════════════════════════════════════════ */
*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

:root{
  --radius:8px;
  --radius-lg:12px;
  --radius-xl:18px;
  --font:'Sora',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --mono:'DM Mono','JetBrains Mono',Consolas,monospace;
  --sidebar:230px;
  --topbar:62px;
}

html,
body{
  width:100%;
  height:100%;
  background:var(--bg1);
  color:var(--text1);
  font-family:var(--font);
  transition:background .25s,color .25s;
}

body{
  overflow:hidden;
}

a{
  color:var(--acc);
  text-decoration:none;
}

button,
input,
select,
textarea{
  font-family:var(--font);
}

button{
  cursor:pointer;
}

svg{
  flex-shrink:0;
}

::selection{
  background:color-mix(in srgb,var(--acc) 35%,transparent);
  color:var(--text1);
}

::-webkit-scrollbar{
  width:8px;
  height:8px;
}

::-webkit-scrollbar-track{
  background:color-mix(in srgb,var(--bg1) 80%,transparent);
}

::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--acc) 28%,var(--border2));
  border-radius:999px;
  border:2px solid var(--bg1);
}

::-webkit-scrollbar-thumb:hover{
  background:color-mix(in srgb,var(--acc) 48%,var(--border2));
}

*{
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--acc) 32%,var(--border2)) var(--bg1);
}

button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:none;
  box-shadow:
    0 0 0 3px color-mix(in srgb,var(--acc) 20%,transparent),
    0 0 0 1px var(--acc);
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   02. TEMAS
═══════════════════════════════════════════════════════════════ */
[data-theme="Nubank"]{
  --bg1:#0f0914;--bg2:#16101f;--bg3:#221b2b;--bg4:#2f2638;--bg5:#3c3245;
  --border:#221b2b;--border2:#3c3245;
  --text1:#faf9fc;--text2:#f3f1f7;--text3:#cab0f2;
  --shadow:none;
  --acc:#b06cf0;--acc-dim:#b06fff;--acc-bg:#26123d;--acc-mid:#432466;
  --red:#bb0404e1;--red-bg:#3b1e0d;--red-mid:#3d0018;
  --blue:#22d3ee;--blue-bg:#0e363d;
  --amber:#fcc419;
  --chart-grid:rgba(255,255,255,.03);--chart-tick:#8a79a1;
  --chart-tooltip-bg:#16101f;--chart-tooltip-border:#221b2b;
  --over:rgba(15,9,20,.85);
}

[data-theme="LightBlue"]{
  --bg1:#faf9fc;--bg2:#f4f0fa;--bg3:#ebe4f5;--bg4:#ded2ed;--bg5:#cfbee0;
  --border:#ded2ed;--border2:#beabd4;
  --text1:#191221;--text2:#443b4f;--text3:#9c46ed;
  --shadow:0 1px 3px rgba(130,10,209,.03);
  --acc:#a855f7;--acc-dim:#9333ea;--acc-bg:#f3e8ff;--acc-mid:#e9d5ff;
  --red:#ff0000;--red-bg:#fee2e2;--red-mid:#fca5a5;
  --blue:#06b6d4;--blue-bg:#ecfeff;
  --amber:#eab308;
  --chart-grid:rgba(130,10,209,.04);--chart-tick:#7a7282;
  --chart-tooltip-bg:#fff;--chart-tooltip-border:#ded2ed;
  --over:rgba(255,255,255,.85);
}

[data-theme="dark"]{
  --bg1:#0b111e;--bg2:#0f172a;--bg3:#161c2d;--bg4:#1e2640;--bg5:#242e4a;
  --border:#1f2a42;--border2:#2a3858;
  --text1:#fff;--text2:#fff;--text3:#cab0f2;
  --shadow:none;
  --acc:#fff;--acc-dim:#fff;--acc-bg:#001a12;--acc-mid:#003d28;
  --red:#db2c2cd0;--red-bg:#1a000a;--red-mid:#3d0018;
  --blue:#fff;--blue-bg:#5b5a9b;
  --amber:#fff;
  --chart-grid:rgba(255,255,255,.04);--chart-tick:#4d5f80;
  --chart-tooltip-bg:#1e2640;--chart-tooltip-border:#2a3858;
  --over:rgba(0,0,0,.75);
}

[data-theme="LightRose"]{
  --bg1:#fdfbfb;--bg2:#f7f3f5;--bg3:#f0e9ed;--bg4:#e6dae2;--bg5:#dccbd6;
  --border:#e6dae2;--border2:#cbb4c3;
  --text1:#1f121a;--text2:#3d2433;--text3:#db2777;
  --shadow:0 1px 3px rgba(0,0,0,.05);
  --acc:#f472b6;--acc-dim:#db2777;--acc-bg:#fce7f3;--acc-mid:#fbcfe8;
  --red:#ff0000;--red-bg:#fee2e2;--red-mid:#fca5a5;
  --blue:#3b82f6;--blue-bg:#eff6ff;
  --amber:#eab308;
  --chart-grid:rgba(0,0,0,.04);--chart-tick:#8c7381;
  --chart-tooltip-bg:#fff;--chart-tooltip-border:#e6dae2;
  --over:rgba(255,255,255,.85);
}

[data-theme="c6bank"]{
  --bg1:#0a0a0a;--bg2:#121212;--bg3:#1a1a1a;--bg4:#262626;--bg5:#323232;
  --border:#262626;--border2:#404040;
  --text1:#f5f5f5;--text2:#e5e5e5;--text3:#a3a3a3;
  --shadow:none;
  --acc:#01afaa;--acc-dim:#059669;--acc-bg:#022c22;--acc-mid:#065f46;
  --red:#bb0404e1;--red-bg:#450a0a;--red-mid:#3d0018;
  --blue:#3b82f6;--blue-bg:#065f46;
  --amber:#f59e0b;
  --chart-grid:rgba(255,255,255,.02);--chart-tick:#737373;
  --chart-tooltip-bg:#121212;--chart-tooltip-border:#262626;
  --over:rgba(0,0,0,.85);
}

[data-theme="omie"]{
  --bg1:#0a0a0a;--bg2:#202024;--bg3:#2d2d30;--bg4:#3f3f46;--bg5:#52525b;
  --border:#27272a;--border2:#52525b;
  --text1:#f4f4f5;--text2:#e4e4e7;--text3:#d4d4d8;
  --shadow:none;
  --acc:#fff6df;--acc-dim:#d97706;--acc-bg:#291e06;--acc-mid:#543d0c;
  --red:#ee4242;--red-bg:#2d1919;--red-mid:#592424;
  --blue:#60a5fa;--blue-bg:#543d0c;
  --amber:#fcd34d;
  --chart-grid:rgba(255,255,255,.03);--chart-tick:#71717a;
  --chart-tooltip-bg:#202024;--chart-tooltip-border:#27272a;
  --over:rgba(0,0,0,.75);
}

/* ═══════════════════════════════════════════════════════════════
   03. LAYOUT GERAL
═══════════════════════════════════════════════════════════════ */
.app{
  display:flex;
  width:100vw;
  height:100vh;
  overflow:hidden;
}

.main{
  flex:1;
  min-width:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  background:var(--bg1);
}

.content{
  flex:1;
  overflow-y:auto;
  display:block;
  padding:0;
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 6%,transparent),transparent 34%),
    var(--bg1);
}

.section{
  display:none;
  padding:20px 22px;
}

.section.active{
  display:block;
  animation:fadeIn .18s ease;
}

.section > *:first-child,
.section > *:first-child > *:first-child{
  margin-top:0 !important;
}

.page-header{
  margin:0 0 22px;
}

.page-header h2{
  font-size:22px;
  font-weight:900;
  letter-spacing:-.5px;
  color:var(--text1);
  margin:0 0 6px;
}

.page-header p,
.muted{
  color:var(--text3);
  font-size:13px;
  line-height:1.5;
}

@keyframes fadeIn{
  from{opacity:0}
  to{opacity:1}
}

@keyframes slideUp{
  from{transform:translateY(16px);opacity:0}
  to{transform:translateY(0);opacity:1}
}

/* ═══════════════════════════════════════════════════════════════
   04. COMPONENTES GLOBAIS
═══════════════════════════════════════════════════════════════ */
.btn,
.btn-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:38px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid var(--border2);
  background:var(--bg4);
  color:var(--text1);
  font-size:12px;
  font-weight:850;
  white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s,transform .12s;
}

.btn svg,
.btn-action svg{
  width:13px;
  height:13px;
  stroke-width:2;
}

.btn:hover,
.btn-action:hover{
  background:var(--bg5);
}

.btn-acc,
.btn-action{
  background:color-mix(in srgb,var(--acc-bg) 82%,transparent);
  border-color:color-mix(in srgb,var(--acc) 42%,var(--acc-mid));
  color:var(--acc);
}

.btn-acc:hover,
.btn-action:hover{
  background:color-mix(in srgb,var(--acc-bg) 55%,var(--acc) 16%);
  border-color:var(--acc);
}

.btn-red,
.btn-danger{
  background:transparent;
  border-color:color-mix(in srgb,var(--red) 36%,var(--red-mid));
  color:var(--red);
}

.btn-red:hover,
.btn-danger:hover{
  background:color-mix(in srgb,var(--red-bg) 55%,var(--red) 16%);
  border-color:var(--red);
  color:var(--red);
}

.btn-ghost,
.btn-secondary{
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border-color:color-mix(in srgb,var(--border2) 65%,transparent);
  color:var(--text2);
}

.btn-ghost:hover,
.btn-secondary:hover{
  background:color-mix(in srgb,var(--bg4) 85%,var(--acc) 8%);
  border-color:color-mix(in srgb,var(--acc) 36%,var(--border2));
  color:var(--acc);
}

.btn-purple{
  background:var(--acc-bg);
  border-color:var(--acc-mid);
  color:var(--acc);
}

.btn-purple:hover{
  background:var(--acc-mid);
}

.btn-amber{
  background:color-mix(in srgb,var(--amber) 18%,transparent);
  border-color:var(--amber);
  color:var(--amber);
}

.fi,
.form-ctrl,
.form-sel,
.month-sel,
.pay-modal-date,
textarea,
select,
input[type="text"],
input[type="number"],
input[type="date"]{
  min-height:38px;
  border-radius:12px;
  background:color-mix(in srgb,var(--bg3) 88%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 65%,transparent);
  color:var(--text1);
  font-size:13px;
  font-weight:650;
  outline:none;
}

.fi,
.form-ctrl,
.form-sel,
.pay-modal-date,
textarea{
  width:100%;
  padding:9px 12px;
}

textarea{
  min-height:88px;
  resize:vertical;
}

.fi:hover,
.form-ctrl:hover,
.form-sel:hover,
.month-sel:hover,
.pay-modal-date:hover,
textarea:hover,
select:hover,
input:hover{
  border-color:color-mix(in srgb,var(--acc) 30%,var(--border2));
}

.fi:focus,
.form-ctrl:focus,
.form-sel:focus,
.month-sel:focus,
.pay-modal-date:focus,
textarea:focus,
select:focus,
input:focus{
  border-color:var(--acc);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 13%,transparent);
}

.fi::placeholder,
.form-ctrl::placeholder{
  color:color-mix(in srgb,var(--text3) 70%,transparent);
}

select.form-ctrl{
  cursor:pointer;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23888' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:32px;
}

.fg,
.form-group{
  margin-bottom:14px;
}

.form-group{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.fg2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.fl,
.form-label,
.pay-modal-lbl{
  display:block;
  margin-bottom:6px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.7px;
  text-transform:uppercase;
  color:var(--text3);
}

.card,
.tcard,
.cc-card,
.fixos-card,
.fixo-card,
.cfg-section,
.bcard{
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 7%,transparent),transparent 38%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
  border:1px solid color-mix(in srgb,var(--acc) 18%,var(--border2));
  border-radius:20px;
  box-shadow:0 12px 32px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.03);
}

.card{
  padding:16px 18px;
}

.card-title,
.tcard-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:var(--text1);
  font-family:var(--mono);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.7px;
  margin-bottom:16px;
  padding-bottom:10px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 60%,transparent);
}

.v-acc,.v-receita{color:var(--acc)}
.v-red{color:var(--red)}
.v-blue{color:var(--blue)}
.v-amber{color:var(--amber)}

.badge{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:4px 10px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  font-family:var(--mono);
  text-transform:uppercase;
  letter-spacing:.4px;
  white-space:nowrap;
}

.badge-rec{
  background:color-mix(in srgb,var(--acc-bg) 82%,transparent);
  color:var(--acc);
  border:1px solid color-mix(in srgb,var(--acc) 50%,var(--acc-mid));
}

.badge-desp{
  background:color-mix(in srgb,var(--red-bg) 82%,transparent);
  color:var(--red);
  border:1px solid color-mix(in srgb,var(--red) 50%,var(--red-mid));
}

.badge-mov{
  background:color-mix(in srgb,var(--blue) 12%,transparent);
  color:var(--blue);
  border:1px solid color-mix(in srgb,var(--blue) 48%,var(--border2));
}

.lancamento-origem{
  color:var(--text3);
  font-family:var(--mono);
  font-size:9px;
  white-space:nowrap;
}

.pg-badge{
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:900;
  font-family:var(--mono);
  background:color-mix(in srgb,var(--acc-bg) 78%,transparent);
  color:var(--acc);
  border:1px solid color-mix(in srgb,var(--acc) 38%,var(--acc-mid));
  white-space:nowrap;
}

.empty-state{
  padding:34px 18px;
  border-radius:18px;
  background:
    radial-gradient(circle at top,color-mix(in srgb,var(--acc) 8%,transparent),transparent 42%),
    color-mix(in srgb,var(--bg3) 84%,transparent);
  border:1px dashed color-mix(in srgb,var(--acc) 28%,var(--border2));
  color:var(--text3);
  font-size:12px;
  font-weight:700;
  text-align:center;
}

.empty-state svg{
  width:42px;
  height:42px;
  margin:0 auto 12px;
  opacity:.72;
  color:var(--acc);
  stroke:currentColor;
}

.empty-state p,
.empty-state strong{
  color:var(--text2);
  font-weight:850;
}

.alert{
  display:flex;
  gap:14px;
  padding:16px 18px;
  border-radius:18px;
  border:1px solid;
  margin:16px 0;
  font-size:13px;
  align-items:flex-start;
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 8%,transparent),transparent 40%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
  box-shadow:0 10px 30px rgba(0,0,0,.14);
}

.alert svg{
  width:20px;
  height:20px;
  flex-shrink:0;
  margin-top:2px;
}

.alert strong{
  display:block;
  margin-bottom:4px;
  font-size:13px;
  font-weight:900;
  color:var(--text1);
}

.alert p{
  margin:0;
  color:var(--text3);
  font-size:12px;
  line-height:1.4;
}

.alert-danger{
  border-color:color-mix(in srgb,var(--red) 45%,var(--red-mid));
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--red) 14%,transparent),transparent 40%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
  color:var(--red);
}

.alert-danger svg,
.alert-danger strong{color:var(--red)}

.alert-warning{
  border-color:color-mix(in srgb,var(--amber) 48%,var(--border2));
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--amber) 14%,transparent),transparent 40%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
  color:var(--amber);
}

.alert-warning svg,
.alert-warning strong{color:var(--amber)}

mark{
  background:var(--amber);
  color:#000;
  border-radius:2px;
  padding:0 1px;
}

/* ═══════════════════════════════════════════════════════════════
   05. SIDEBAR / TOPBAR
═══════════════════════════════════════════════════════════════ */
.sidebar{
  width:var(--sidebar);
  min-width:var(--sidebar);
  flex:0 0 var(--sidebar);
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  overflow-x:hidden;
  z-index:80;
  transition:transform .25s,background .25s;
  background:
    radial-gradient(circle at top left,color-mix(in srgb,var(--acc) 7%,transparent),transparent 36%),
    linear-gradient(180deg,color-mix(in srgb,var(--bg2) 96%,var(--acc) 3%),var(--bg2));
  border-right:1px solid color-mix(in srgb,var(--border2) 62%,transparent);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.02);
}

.logo-wrap{
  padding:22px 18px 18px;
  display:flex;
  align-items:center;
  gap:12px;
  background:radial-gradient(circle at top left,color-mix(in srgb,var(--acc) 14%,transparent),transparent 42%);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 52%,transparent);
}

.logo-wrap svg{
  width:70px !important;
  height:70px !important;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.26));
}

.logo-text{
  font-size:16px;
  font-weight:900;
  line-height:1.05;
  letter-spacing:-.5px;
  color:var(--text1);
}

.logo-ver{
  margin-top:4px;
  font-size:10px;
  font-family:var(--mono);
  color:var(--text3);
}

.nav{
  padding:14px 8px;
  flex:1;
}

.nav-lbl{
  margin:14px 0 7px;
  padding:0 12px;
  font-size:9px;
  font-weight:900;
  color:var(--text3);
  letter-spacing:1.1px;
  text-transform:uppercase;
}

.nav-item{
  min-height:40px;
  padding:9px 12px;
  margin-bottom:4px;
  border-radius:12px;
  display:flex;
  align-items:center;
  gap:9px;
  cursor:pointer;
  font-size:12px;
  font-weight:800;
  color:var(--text2);
  background:transparent;
  border:1px solid transparent;
  position:relative;
  white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s;
}

.nav-item svg{
  width:16px;
  height:16px;
  stroke-width:2;
}

.nav-item:hover{
  background:color-mix(in srgb,var(--bg4) 86%,var(--acc) 5%);
  border-color:color-mix(in srgb,var(--border2) 55%,transparent);
  color:var(--text1);
}

.nav-item.active{
  background:linear-gradient(90deg,color-mix(in srgb,var(--acc-bg) 88%,transparent),color-mix(in srgb,var(--bg3) 82%,transparent));
  color:var(--acc);
  border-color:color-mix(in srgb,var(--acc) 38%,var(--acc-mid));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 8%,transparent);
}

.nav-item.active::before{
  content:'';
  position:absolute;
  left:-1px;
  top:50%;
  transform:translateY(-50%);
  width:4px;
  height:62%;
  border-radius:0 999px 999px 0;
  background:var(--acc);
}

.sidebar-foot{
  padding:15px;
  background:color-mix(in srgb,var(--bg2) 90%,#000 5%);
  border-top:1px solid color-mix(in srgb,var(--border2) 52%,transparent);
}

.theme-lbl{
  font-size:9px;
  font-weight:900;
  color:var(--text3);
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:10px;
}

.theme-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-bottom:12px;
}

.theme-opt{
  min-height:34px;
  padding:0 9px;
  border-radius:11px;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:800;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 62%,transparent);
  color:var(--text2);
  cursor:pointer;
  font-family:var(--font);
}

.theme-opt:hover{
  background:color-mix(in srgb,var(--bg4) 84%,var(--acc) 5%);
  color:var(--text1);
}

.theme-opt.active{
  background:color-mix(in srgb,var(--acc-bg) 82%,transparent);
  border-color:color-mix(in srgb,var(--acc) 38%,var(--acc-mid));
  color:var(--acc);
}

.theme-dot{
  width:8px;
  height:8px;
  border-radius:50%;
}

.theme-custom-opt{
  grid-column:1 / -1;
  width:100%;
  justify-content:center;
}

.theme-custom-icon{
  color:var(--acc);
  font-size:13px;
}

.custom-theme-modal{
  width:min(760px,calc(100vw - 32px));
  max-width:760px;
  max-height:min(820px,calc(100vh - 32px));
  display:flex;
  flex-direction:column;
  transition:opacity .18s ease,background .18s ease;
}

#modal-tema-personalizado{
  background:rgba(0,0,0,.28);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}

#modal-tema-personalizado.color-picker-active{
  background:transparent;
}

#modal-tema-personalizado.color-picker-active .custom-theme-modal{
  opacity:.08;
}

.custom-theme-subtitle{
  margin-top:4px;
  color:var(--text3);
  font-size:11px;
  font-weight:500;
}

.custom-theme-slots{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
  margin:4px 0 16px;
}

.custom-theme-slot{
  min-height:54px;
  padding:8px 10px;
  border:1px solid var(--border2);
  border-radius:11px;
  background:color-mix(in srgb,var(--bg3) 88%,transparent);
  color:var(--text1);
  text-align:left;
  font-family:var(--font);
  transition:background .15s,border-color .15s,box-shadow .15s;
}

.custom-theme-slot strong,
.custom-theme-slot small{
  display:block;
}

.custom-theme-slot strong{font-size:11px}
.custom-theme-slot small{margin-top:4px;color:var(--text3);font-size:9px}
.custom-theme-slot:hover{background:var(--bg4)}
.custom-theme-slot.active{
  border-color:var(--acc);
  background:color-mix(in srgb,var(--acc-bg) 78%,transparent);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--acc) 14%,transparent);
}

.custom-theme-slot-dot{
  display:inline-block;
  width:8px;
  height:8px;
  margin-right:6px;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--border2) 70%,transparent);
  vertical-align:-1px;
}

.custom-theme-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:4px 0 12px;
  color:var(--text2);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.7px;
}

.custom-theme-toolbar-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}

#btn-apagar-tema-personalizado:disabled{
  opacity:.38;
  cursor:not-allowed;
}

.custom-theme-colors{
  min-height:0;
  overflow:auto;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  padding:2px 4px 4px 0;
}

.custom-theme-group-title{
  grid-column:1 / -1;
  margin-top:9px;
  padding-bottom:5px;
  border-bottom:1px solid var(--border2);
  color:var(--text3);
  font-size:9px;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}

.custom-theme-color-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 38px 92px;
  align-items:center;
  gap:8px;
  min-height:48px;
  padding:7px 9px;
  border:1px solid color-mix(in srgb,var(--border2) 62%,transparent);
  border-radius:10px;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
}

.custom-theme-color-name strong{color:var(--text1);font-size:11px}
.custom-theme-picker{width:38px;height:32px;padding:2px;border:1px solid var(--border2);border-radius:8px;background:var(--bg2)}
.custom-theme-hex{width:92px;min-height:32px;padding:0 7px;border:1px solid var(--border2);border-radius:8px;background:var(--bg2);color:var(--text1);font:500 10px var(--mono);text-transform:uppercase}
.custom-theme-hex.invalid{border-color:var(--red);box-shadow:0 0 0 2px color-mix(in srgb,var(--red) 15%,transparent)}

@media(max-width:640px){
  .custom-theme-colors{grid-template-columns:1fr}
  .custom-theme-color-row{grid-template-columns:minmax(0,1fr) 38px 86px}
  .custom-theme-toolbar{align-items:flex-start;flex-direction:column}
  .custom-theme-toolbar-actions{width:100%;justify-content:stretch}
  .custom-theme-toolbar-actions .btn{flex:1}
}

.topbar{
  height:var(--topbar);
  min-height:var(--topbar);
  padding:0 24px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:12px;
  flex-shrink:0;
  position:sticky;
  top:0;
  z-index:50;
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 5%,transparent),transparent 42%),
    linear-gradient(180deg,color-mix(in srgb,var(--bg2) 96%,var(--acc) 3%),var(--bg2));
  border-bottom:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
  box-shadow:0 8px 28px rgba(0,0,0,.08);
}

.topbar-left{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  justify-self:start;
}

.topbar-title{
  font-size:17px;
  font-weight:900;
  letter-spacing:-.45px;
  color:var(--text1);
  white-space:nowrap;
}

.topbar-right{
  width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.ham{
  display:none;
  width:40px;
  height:40px;
  border-radius:12px;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 65%,transparent);
  color:var(--text2);
}

.ham svg{
  width:20px;
  height:20px;
  stroke:currentColor;
  stroke-width:2;
}

.ham:hover{
  background:color-mix(in srgb,var(--bg4) 84%,var(--acc) 5%);
  color:var(--text1);
}

.search-bar{
  height:40px;
  max-width:360px;
  padding:0 14px;
  border-radius:13px;
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  min-width:0;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 65%,transparent);
}

.search-bar:focus-within{
  border-color:var(--acc);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 13%,transparent);
}

.search-bar svg{
  width:15px;
  height:15px;
  color:var(--text3);
}

.search-bar input{
  width:100%;
  min-height:0;
  padding:0;
  border:none;
  background:none;
  color:var(--text1);
  font-size:12px;
  font-weight:700;
  outline:none;
  box-shadow:none !important;
}

.search-bar input::placeholder{
  color:var(--text3);
}

.month-sel{
  height:40px;
  max-width:145px;
  padding:0 12px;
  font-family:var(--mono);
  font-size:12px;
  font-weight:900;
  text-align:center;
  cursor:pointer;
}

#btn-cadeado{
  width:40px;
  min-width:40px;
  height:40px;
  padding:0;
  border-radius:13px;
  margin-left:0;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 65%,transparent);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  justify-self:center;
  transition:width .2s ease,background .15s,border-color .15s,transform .12s,box-shadow .2s;
}

#btn-cadeado:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--acc) 38%,var(--border2));
}

#btn-cadeado.fechado{
  width:190px;
  min-width:190px;
  height:46px;
  padding:0 16px;
  justify-content:flex-start;
  background:color-mix(in srgb,var(--red-bg) 78%,transparent);
  border-color:color-mix(in srgb,var(--red) 58%,var(--red-mid));
  box-shadow:
    0 0 0 4px color-mix(in srgb,var(--red) 10%,transparent),
    0 10px 28px color-mix(in srgb,var(--red) 16%,transparent);
}

#icon-cadeado{
  font-size:18px;
  line-height:1;
  color:var(--text1) !important;
}

#btn-cadeado.fechado #icon-cadeado{
  font-size:20px;
}

.cadeado-aviso{
  display:none;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
  gap:1px;
  line-height:1.1;
  text-align:left;
}

#btn-cadeado.fechado .cadeado-aviso{
  display:flex;
}

.cadeado-aviso strong{
  color:var(--text1);
  font-size:12px;
  font-weight:900;
  letter-spacing:.1px;
}

.cadeado-aviso small{
  color:color-mix(in srgb,var(--red) 65%,var(--text2));
  font-size:9px;
  font-weight:800;
}

.mob-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.5);
  z-index:79;
}

.mob-overlay.open{
  display:block;
}

/* ═══════════════════════════════════════════════════════════════
   06. DASHBOARD
═══════════════════════════════════════════════════════════════ */
#sec-dashboard{
  padding:24px;
}

.metrics{
  display:grid;
  grid-template-columns:repeat(5,minmax(160px,1fr));
  gap:14px;
  margin-bottom:16px;
}

.metric{
  position:relative;
  overflow:hidden;
  min-height:104px;
  padding:16px 18px;
  border-radius:18px;
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 10%,transparent),transparent 38%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
  border:1px solid color-mix(in srgb,var(--acc) 18%,var(--border2));
  box-shadow:var(--shadow);
}

.metric::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:2px;
  border-radius:18px 18px 0 0;
}

.metric::after{
  content:'';
  position:absolute;
  right:-30px;
  bottom:-30px;
  width:90px;
  height:90px;
  border-radius:50%;
  background:color-mix(in srgb,var(--acc) 8%,transparent);
  pointer-events:none;
}

.m-acc::before{background:var(--acc)}
.m-red::before{background:var(--red)}
.m-blue::before{background:var(--blue)}
.m-amber::before{background:var(--amber)}

.m-acc{border-color:color-mix(in srgb,var(--acc) 42%,var(--border2))}
.m-red{border-color:color-mix(in srgb,var(--red) 42%,var(--border2))}
.m-blue{border-color:color-mix(in srgb,var(--blue) 42%,var(--border2))}
.m-amber{border-color:color-mix(in srgb,var(--amber) 42%,var(--border2))}

.metric-lbl,
.metric-val,
.metric-sub{
  position:relative;
  z-index:1;
}

.metric-lbl{
  font-size:10px;
  font-weight:900;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.8px;
  font-family:var(--mono);
  margin-bottom:8px;
}

.metric-val{
  font-size:19px;
  font-weight:900;
  font-family:var(--mono);
  letter-spacing:-1px;
}

.metric-sub{
  font-size:11px;
  color:var(--text3);
  margin-top:8px;
}

.prog{
  height:3px;
  background:var(--bg5);
  border-radius:2px;
  overflow:hidden;
  margin-top:6px;
}

.prog-fill{
  height:100%;
  border-radius:2px;
  transition:width .6s cubic-bezier(.4,0,.2,1);
}

.charts-row{
  display:grid;
  grid-template-columns:3fr 2fr;
  gap:14px;
  margin-bottom:16px;
}

.dash-row2{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:14px;
  margin-bottom:16px;
}

#sec-dashboard .charts-row .card{
  min-height:270px;
}

#sec-dashboard .charts-row canvas{
  max-height:200px;
}

#sec-dashboard canvas{
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.12));
}

#sec-dashboard .card-title{
  font-size:10px;
  margin-bottom:12px;
  padding-bottom:8px;
}

.legend{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.legend-item{
  display:flex;
  align-items:center;
  gap:4px;
  font-size:10px;
  color:var(--text2);
  font-family:var(--mono);
  cursor:pointer;
}

.legend-dot{
  width:8px;
  height:8px;
  border-radius:2px;
}

.chart-pie-wrap{
  position:relative;
  height:168px;
}

.chart-pie-legend{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px;
  margin-top:10px;
}

.chart-pie-legend .legend-item{
  gap:5px;
  padding:5px 8px;
  border:1px solid color-mix(in srgb,var(--border2) 42%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--bg3) 72%,transparent);
  color:var(--text2);
  cursor:default;
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}

.chart-pie-legend .legend-item:hover{
  transform:translateY(-1px);
  background:color-mix(in srgb,var(--bg4) 82%,transparent);
  border-color:color-mix(in srgb,var(--border2) 78%,transparent);
}

.chart-pie-legend .legend-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  box-shadow:0 0 0 2px color-mix(in srgb,currentColor 8%,transparent);
}

.top5-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 0;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 45%,transparent);
}

.top5-item:last-child{border-bottom:none}

.top5-name{
  font-size:12px;
  color:var(--text1);
  font-weight:600;
  min-width:80px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.top5-bar-wrap{
  flex:1;
  height:8px;
  border-radius:999px;
  overflow:hidden;
  background:color-mix(in srgb,var(--bg5) 78%,transparent);
}

.top5-bar{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--red),color-mix(in srgb,var(--red) 45%,var(--amber)));
  transition:width .5s;
}

.top5-val{
  font-size:12px;
  color:var(--text2);
  font-family:var(--mono);
  white-space:nowrap;
}

.saldo-trend{
  list-style:none;
}

.saldo-trend li{
  display:flex;
  justify-content:space-between;
  padding:9px 0;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 50%,transparent);
  font-size:12px;
}

.saldo-trend li:last-child{border-bottom:none}
.saldo-trend li span:first-child{color:var(--text3);font-family:var(--mono)}
.saldo-trend li span:last-child{font-weight:700;font-family:var(--mono)}

#prox-despesas-list > div{
  border-radius:12px;
  margin-bottom:8px;
  padding:10px 12px;
  background:color-mix(in srgb,var(--bg3) 88%,var(--red) 4%);
  border:1px solid color-mix(in srgb,var(--border2) 80%,transparent);
}

#saldo-projetado-aviso .alert{
  margin:0 0 18px;
}

#sec-dashboard .alert{
  margin:0 0 16px;
  padding:14px 18px;
  border-radius:18px;
}

#sec-dashboard .alert strong{
  font-size:13px;
}

#sec-dashboard .alert p{
  font-size:11px;
}

/* ═══════════════════════════════════════════════════════════════
   07. TABELAS / LANÇAMENTOS
═══════════════════════════════════════════════════════════════ */
.tcard{
  overflow:hidden;
  margin-bottom:14px;
}

.tcard-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  padding:16px 20px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--acc-bg) 65%,transparent),transparent);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 60%,transparent);
}

.tcard-title{
  margin:0;
  padding:0;
  border:none;
  font-size:14px;
  font-weight:900;
  color:var(--text1);
  letter-spacing:.4px;
}

.filter-row{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.filter-row .form-sel{
  width:auto;
  min-height:38px;
  border-radius:999px;
  font-weight:700;
}

table{
  width:100%;
  border-collapse:collapse;
}

th{
  height:40px;
  padding:10px 18px;
  background:color-mix(in srgb,var(--bg3) 88%,#000 8%);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 70%,transparent);
  color:var(--text3);
  font-size:10px;
  font-weight:800;
  text-align:left;
  font-family:var(--mono);
  text-transform:uppercase;
  letter-spacing:.5px;
  white-space:nowrap;
}

td{
  height:48px;
  padding:12px 18px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 42%,transparent);
  color:var(--text1);
  font-size:13px;
  vertical-align:middle;
}

tr:last-child td{border-bottom:none}
tr:hover td{background:color-mix(in srgb,var(--bg3) 82%,var(--acc) 5%)}

.sort-th{
  cursor:pointer;
  user-select:none;
}

.sort-th:hover{color:var(--acc)}

.sort-arrow{
  display:inline-block;
  width:0;
  height:0;
  margin-left:4px;
  vertical-align:middle;
  opacity:.3;
}

.sort-th.asc .sort-arrow{
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-bottom:4px solid var(--acc);
  opacity:1;
}

.sort-th.desc .sort-arrow{
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-top:4px solid var(--acc);
  opacity:1;
}

#sec-transacoes{
  padding:24px;
}

#sec-transacoes .tcard{
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 10%,transparent),transparent 34%),
    linear-gradient(180deg,var(--bg2),var(--bg3));
  border-color:color-mix(in srgb,var(--acc) 22%,var(--border2));
}

#trans-totals{
  padding:14px 20px !important;
  background:linear-gradient(90deg,color-mix(in srgb,var(--bg3) 90%,var(--acc) 4%),var(--bg3)) !important;
  border-top:1px solid color-mix(in srgb,var(--border2) 65%,transparent) !important;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 65%,transparent) !important;
}

#trans-totals > div{
  padding:6px 10px;
  border-radius:999px;
  background:color-mix(in srgb,var(--bg2) 70%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

#sec-transacoes input[type="checkbox"]{
  width:15px;
  height:15px;
  accent-color:var(--acc);
}

th.col-sel,
td.col-sel{
  width:28px;
  padding:0 4px !important;
  text-align:center;
}

th.col-sel input,
td.col-sel input{
  opacity:0;
  transition:opacity .15s;
  cursor:pointer;
}

#sec-transacoes:hover th.col-sel input,
#sec-transacoes:hover td.col-sel input,
.modo-sel th.col-sel input,
.modo-sel td.col-sel input{
  opacity:1;
}

#trans-tbody tr.selected,
#trans-tbody tr.selected td{
  background:color-mix(in srgb,var(--amber) 12%,transparent) !important;
}

#trans-tbody tr.selected td:first-child{
  border-left:3px solid var(--amber);
}

#sec-transacoes tbody .btn,
#sec-transacoes tbody button{
  min-height:30px;
  padding:5px 8px;
  border-radius:9px;
}

#trans-empty{
  margin:18px;
}

/* ═══════════════════════════════════════════════════════════════
   08. PLANEJAMENTO / FIXOS MENSAIS
═══════════════════════════════════════════════════════════════ */
#sec-fixos{
  padding:24px;
}

#fixos-sum{
  display:grid;
  grid-template-columns:repeat(3,minmax(180px,1fr));
  gap:14px;
  margin-bottom:18px;
}

#fixos-sum .metric{
  min-height:104px;
  padding:16px 18px;
}

#fixos-sum .metric-val{
  font-size:19px;
}

.hint{
  margin-bottom:14px;
  padding:10px 12px;
  border-radius:12px;
  background:color-mix(in srgb,var(--bg3) 82%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
  color:var(--text3);
  font-size:10px;
  font-family:var(--mono);
}

.fixos-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:start;
}

.fixos-card{
  overflow:hidden;
  border-radius:18px;
}

.fixos-head{
  min-height:64px;
  padding:14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.fixos-head.d{
  background:
    radial-gradient(circle at top left,color-mix(in srgb,var(--red) 13%,transparent),transparent 42%),
    linear-gradient(90deg,color-mix(in srgb,var(--red-bg) 62%,transparent),var(--bg3));
}

.fixos-head.r{
  background:
    radial-gradient(circle at top left,color-mix(in srgb,var(--acc) 13%,transparent),transparent 42%),
    linear-gradient(90deg,color-mix(in srgb,var(--acc-bg) 62%,transparent),var(--bg3));
}

.fixos-hlbl{
  font-size:12px;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
  line-height:1.2;
  margin-bottom:4px;
}

.fixos-hlbl.d{color:var(--red)}
.fixos-hlbl.r{color:var(--acc)}

.fixos-hsub,
.fixos-head small{
  display:block;
  font-size:11px;
  color:var(--text3);
  line-height:1.35;
}

.fixos-htot{
  font-size:14px;
  font-weight:850;
  font-family:var(--mono);
  white-space:nowrap;
  letter-spacing:-.3px;
}

.fixos-header{
  min-height:34px;
  padding:8px 18px;
  display:grid;
  grid-template-columns:1fr 68px 100px 86px 74px;
  gap:8px;
  align-items:center;
  background:color-mix(in srgb,var(--bg3) 88%,#000 8%);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
  font-family:var(--mono);
  font-size:9px;
  font-weight:900;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.7px;
}

.fixos-header div:nth-child(2),
.fixos-header div:nth-child(4){text-align:center}
.fixos-header div:nth-child(3),
.fixos-header div:nth-child(5){text-align:right}

.fixos-row,
.fixos-row-clean{
  display:grid;
  grid-template-columns:1fr 68px 100px 86px 74px;
  gap:8px;
  align-items:center;
  min-height:46px;
  padding:8px 18px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 42%,transparent);
  background:color-mix(in srgb,var(--bg2) 94%,transparent);
  transition:background .15s,border-color .15s;
}

.fixos-row-clean{
  grid-template-areas:"info venc valor status actions";
}

.fixos-row:hover,
.fixos-row-clean:hover{
  background:color-mix(in srgb,var(--bg3) 86%,var(--acc) 5%);
  border-bottom-color:color-mix(in srgb,var(--acc) 28%,var(--border2));
}

.fixos-row.is-pago,
.fixos-row-clean.is-pago{
  background:color-mix(in srgb,var(--bg2) 88%,var(--acc-bg) 8%);
}

.fixos-row.is-pago .fxname,
.fixos-row-clean.is-pago .fxname{
  opacity:.72;
}

.fixo-info{
  grid-area:info;
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
}

.fixo-venc{
  grid-area:venc;
  text-align:center;
  font-family:var(--mono);
  color:var(--text1);
}

.fixo-venc span{
  display:none;
}

.fixo-venc strong{
  font-size:12px;
  font-weight:900;
}

.fixo-valor{
  grid-area:valor;
  justify-self:end;
  text-align:right;
  font-family:var(--mono);
  font-size:12px;
  font-weight:850;
  white-space:nowrap;
}

.fixo-status{
  grid-area:status;
  justify-self:center;
}

.fixo-actions{
  grid-area:actions;
  justify-self:end;
  display:flex;
  gap:6px;
}

.fxname-wrap{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.fxname{
  color:var(--text1);
  font-size:13px;
  font-weight:750;
  line-height:1.2;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.fxstatus{
  display:inline-flex;
  align-items:center;
  height:24px;
  min-height:24px;
  padding:0 8px;
  border-radius:999px;
  font-size:8px;
  font-weight:900;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
  color:var(--text3);
  white-space:nowrap;
}

.fxstatus.amber{
  background:color-mix(in srgb,var(--amber) 15%,transparent);
  color:var(--amber);
  border-color:color-mix(in srgb,var(--amber) 35%,transparent);
}

.fxstatus.red{
  background:color-mix(in srgb,var(--red) 15%,transparent);
  color:var(--red);
  border-color:color-mix(in srgb,var(--red) 35%,transparent);
}

.fxapply,
.fxarchive,
.fxdel,
.fixo-actions .btn{
  width:28px;
  min-width:28px;
  height:28px;
  min-height:28px;
  padding:0;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.fxapply{
  background:color-mix(in srgb,var(--acc-bg) 82%,transparent);
  border:1px solid color-mix(in srgb,var(--acc) 58%,var(--acc-mid));
  color:var(--acc);
}

.fxapply:hover{
  background:color-mix(in srgb,var(--acc-bg) 55%,var(--acc) 18%);
  border-color:var(--acc);
}

.fxdel,
.fixo-actions .btn-red{
  color:var(--red);
  border-color:color-mix(in srgb,var(--red) 32%,var(--red-mid));
}

.fxdel:hover,
.fixo-actions .btn-red:hover{
  background:color-mix(in srgb,var(--red-bg) 55%,var(--red) 16%);
  border-color:var(--red);
  color:var(--red);
}

.fxapply svg,
.fixo-actions .btn svg{
  width:14px;
  height:14px;
}

.fixos-foot{
  padding:12px 14px;
  border-top:1px solid color-mix(in srgb,var(--border2) 45%,transparent);
}

.fixo-add,
.fixos-foot .btn{
  width:calc(100% - 36px);
  min-height:40px;
  margin:12px 18px;
  padding:0 16px;
  border-radius:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:12px;
  font-weight:900;
  letter-spacing:-.2px;
  cursor:pointer;
  transition:background .15s,border-color .15s,transform .12s;
}

.fixo-add:hover{transform:translateY(-1px)}
.fixo-add:active{transform:scale(.985)}

.fixo-add-desp{
  color:var(--red);
  border:1px dashed color-mix(in srgb,var(--red) 52%,var(--red-mid));
  background:linear-gradient(145deg,color-mix(in srgb,var(--red-bg) 68%,transparent),color-mix(in srgb,var(--bg2) 92%,transparent));
}

.fixo-add-rec{
  color:var(--acc);
  border:1px dashed color-mix(in srgb,var(--acc) 52%,var(--acc-mid));
  background:linear-gradient(145deg,color-mix(in srgb,var(--acc-bg) 68%,transparent),color-mix(in srgb,var(--bg2) 92%,transparent));
}

.fixo-add-desp:hover{
  border-style:solid;
  background:color-mix(in srgb,var(--red-bg) 55%,var(--red) 12%);
}

.fixo-add-rec:hover{
  border-style:solid;
  background:color-mix(in srgb,var(--acc-bg) 55%,var(--acc) 12%);
}

/* ═══════════════════════════════════════════════════════════════
   09. RECORRENTES / CARTÕES DE CRÉDITO
═══════════════════════════════════════════════════════════════ */
#sec-recorrentes{
  padding:24px;
}

.rec-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  margin-top:22px;
  align-items:start;
}

.fixo-card{
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.fixo-header{
  min-height:68px;
  padding:14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
  background:linear-gradient(90deg,color-mix(in srgb,var(--bg3) 86%,var(--acc) 5%),var(--bg3));
}

.fixo-card:has(#rec-total-desp) .fixo-header{
  background:
    radial-gradient(circle at top left,color-mix(in srgb,var(--red) 13%,transparent),transparent 42%),
    linear-gradient(90deg,color-mix(in srgb,var(--red-bg) 62%,transparent),var(--bg3));
}

.fixo-card:has(#rec-total-rec) .fixo-header{
  background:
    radial-gradient(circle at top left,color-mix(in srgb,var(--acc) 13%,transparent),transparent 42%),
    linear-gradient(90deg,color-mix(in srgb,var(--acc-bg) 62%,transparent),var(--bg3));
}

.fixo-title{
  font-size:12px;
  font-weight:900;
  letter-spacing:.5px;
  text-transform:uppercase;
  margin-bottom:4px;
  color:var(--text2);
}

.fixo-card:has(#rec-total-desp) .fixo-title{color:var(--red)}
.fixo-card:has(#rec-total-rec) .fixo-title{color:var(--acc)}

.fixo-sub{
  font-size:11px;
  color:var(--text3);
  line-height:1.3;
}

.fixo-total{
  font-size:15px;
  font-weight:800;
  font-family:var(--mono);
  letter-spacing:-.3px;
  white-space:nowrap;
}

#rec-total-desp{color:var(--red)}
#rec-total-rec{color:var(--acc)}

.fixo-table-head{
  min-height:36px;
  padding:8px 18px;
  display:grid;
  grid-template-columns:1fr 78px 90px 80px 74px;
  gap:8px;
  align-items:center;
  background:color-mix(in srgb,var(--bg3) 88%,#000 8%);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
  font-family:var(--mono);
  font-size:9px;
  font-weight:900;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.7px;
}

.fixo-table-head div{
  min-width:0;
}

.fixo-table-head > div:nth-child(1){
  justify-self:start;
  text-align:left;
}

.fixo-table-head > div:nth-child(2){
  justify-self:center;
  text-align:center;
}

.fixo-table-head > div:nth-child(3){
  justify-self:end;
  text-align:right;
}

.fixo-table-head > div:nth-child(4){
  justify-self:center;
  text-align:center;
}

.fixo-table-head div:nth-child(5){
  grid-column:5;
  justify-self:end;
  text-align:right;
  padding-right:6px;
}

.fixo-list{
  background:color-mix(in srgb,var(--bg2) 92%,transparent);
}

.rec-item,
.rec-item-mobile{
  display:grid;
  grid-template-columns:minmax(170px,1fr) 64px 100px 92px 86px;
  grid-template-areas:"info venc valor status actions";
  gap:8px;
  align-items:center;
  min-height:42px;
  padding:6px 18px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 42%,transparent);
  background:color-mix(in srgb,var(--bg2) 94%,transparent);
  font-size:12px;
  transition:background .15s,border-color .15s;
}

.rec-item:hover,
.rec-item-mobile:hover{
  background:color-mix(in srgb,var(--bg3) 86%,var(--acc) 5%);
  border-bottom-color:color-mix(in srgb,var(--acc) 28%,var(--border2));
}

.rec-item:has(.pg-badge),
.rec-item-mobile:has(.pg-badge){
  background:color-mix(in srgb,var(--bg2) 88%,var(--acc-bg) 8%);
}

.rec-item:has(.pg-badge) .rec-name,
.rec-item-mobile:has(.pg-badge) .rec-name{
  opacity:.72;
}

.rec-info{
  grid-area:info;
  min-width:0;
}

.rec-venc{
  grid-area:venc;
  text-align:left;
  font-family:var(--mono);
  color:var(--text1);
}

.rec-venc .rec-label{
  display:none;
}

.rec-venc strong{
  font-size:12px;
  font-weight:900;
}

.rec-valor{
  grid-area:valor;
  justify-self:left;
  text-align:left;
  font-family:var(--mono);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}

.rec-status{
  grid-area:status;
  justify-self:left;
}

.rec-actions{
  grid-area:actions;
  justify-self:left;
  display:flex;
  gap:8px;
}

.rec-name{
  font-size:13px;
  font-weight:850;
  color:var(--text1);
  letter-spacing:-.2px;
}

.rec-meta{
  margin-top:2px;
  font-size:10px;
  color:var(--text3);
}

.rec-item .btn,
.rec-item-mobile .btn,
.rec-pay{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border-radius:11px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.rec-pay,
.rec-item .btn-acc,
.rec-item-mobile .btn-acc{
  background:color-mix(in srgb,var(--acc-bg) 82%,transparent);
  border:1px solid color-mix(in srgb,var(--acc) 58%,var(--acc-mid));
  color:var(--acc);
}

.rec-pay:hover,
.rec-item .btn-acc:hover,
.rec-item-mobile .btn-acc:hover{
  background:color-mix(in srgb,var(--acc-bg) 55%,var(--acc) 18%);
  border-color:var(--acc);
}

.rec-item .btn-red,
.rec-item-mobile .btn-red{
  color:var(--red);
  border-color:color-mix(in srgb,var(--red) 32%,var(--red-mid));
}

.rec-pay svg,
.rec-item .btn svg,
.rec-item-mobile .btn svg{
  width:14px;
  height:14px;
}

.rec-info{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}

.rec-titulo-linha{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  min-width:0;
}

.rec-name{
  font-size:13px;
  font-weight:850;
  color:var(--text1);
  letter-spacing:-.2px;
  line-height:1.15;
}

.rec-meta{
  margin-top:1px;
  font-size:9px;
  color:var(--text3);
}

.rec-status-tag{
  display:inline-flex;
  align-items:center;
  height:24px;
  min-height:24px;
  padding:0 8px;
  border-radius:999px;
  font-size:8px;
  font-weight:900;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
  color:var(--text3);
  white-space:nowrap;
}

.rec-status-tag.amber{
  background:color-mix(in srgb,var(--amber) 15%,transparent);
  color:var(--amber);
  border-color:color-mix(in srgb,var(--amber) 35%,transparent);
}

.rec-status-tag.red{
  background:color-mix(in srgb,var(--red) 15%,transparent);
  color:var(--red);
  border-color:color-mix(in srgb,var(--red) 35%,transparent);
}

.rec-status-inline{
  height:24px;
  min-height:24px;
  padding:0 8px;
  font-size:8px;
}

/* Cartões */
.cc-card{
  overflow:hidden;
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 14%,transparent),transparent 34%),
    linear-gradient(160deg,var(--bg2),var(--bg3));
  border-color:color-mix(in srgb,var(--acc) 32%,var(--border2));
}

.card-destaque{
  border-color:var(--acc-mid);
}

.cc-card.alerta{
  border-color:var(--red-mid);
  animation:pulse-border .8s ease-in-out infinite alternate;
}

@keyframes pulse-border{
  0%{box-shadow:0 0 0 0 var(--red-mid)}
  100%{box-shadow:0 0 0 4px transparent}
}

.cc-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  padding:18px 20px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--acc-bg) 75%,transparent),transparent);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.cc-header-left{
  display:flex;
  align-items:center;
  gap:12px;
}

.cc-icon{
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:color-mix(in srgb,var(--acc-bg) 82%,var(--bg4));
  border:1px solid color-mix(in srgb,var(--acc) 28%,var(--border2));
  font-size:22px;
}

.cc-title{
  font-size:15px;
  font-weight:800;
  letter-spacing:-.3px;
  color:var(--text1);
}

.cc-subtitle{
  font-size:11px;
  color:var(--text3);
  margin-top:1px;
  font-family:var(--mono);
}

.cc-summary{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  background:color-mix(in srgb,var(--bg3) 88%,transparent);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.cc-summary-item{
  min-height:82px;
  padding:14px 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-right:1px solid color-mix(in srgb,var(--border2) 45%,transparent);
}

.cc-summary-item:last-child{border-right:none}

.cc-summary-lbl{
  font-size:10px;
  font-weight:800;
  color:var(--text3);
  letter-spacing:.7px;
  text-transform:uppercase;
  margin-bottom:8px;
  font-family:var(--mono);
}

.cc-summary-val{
  font-size:18px;
  font-weight:900;
  font-family:var(--mono);
  letter-spacing:-.5px;
  line-height:1.1;
}

.cc-item{
  overflow-x:hidden;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 48%,transparent);
  background:linear-gradient(180deg,color-mix(in srgb,var(--bg2) 92%,var(--acc) 4%),var(--bg2));
}

.cc-item:last-child{border-bottom:none}

.cc-item-header{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto auto auto;
  align-items:center;
  gap:10px;
  width:100%;
  max-width:100%;
  overflow:hidden;
  min-height:72px;
  padding:14px 20px;
  cursor:pointer;
  transition:background .15s;
}

.cc-item-header:hover{
  background:color-mix(in srgb,var(--bg3) 84%,var(--acc) 6%);
}

.cc-chip{
  width:46px;
  height:30px;
  border-radius:9px;
  position:relative;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.25),0 8px 18px rgba(0,0,0,.24);
}

.cc-chip::after{
  content:'';
  position:absolute;
  right:7px;
  bottom:6px;
  width:12px;
  height:8px;
  border-radius:3px;
  background:rgba(255,255,255,.34);
}

.cc-item-name{
  font-size:14px;
  font-weight:800;
  color:var(--text1);
}

.cc-item-meta,
.cc-item-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.cc-item-meta{
  font-size:10px;
  color:var(--text3);
  font-family:var(--mono);
  margin-top:1px;
}

.cc-item-total{
  font-size:15px;
  font-weight:900;
  font-family:var(--mono);
  color:var(--red);
  text-align:right;
  white-space:nowrap;
}

.cc-item-limit{
  font-size:10px;
  color:var(--text3);
  font-family:var(--mono);
  text-align:right;
  white-space:nowrap;
}

.cc-chevron{
  color:var(--text3);
  transition:transform .2s;
}

.cc-chevron.open{transform:rotate(180deg)}

.cc-limit-bar{
  height:5px;
  margin:0 20px 12px;
  background:color-mix(in srgb,var(--bg5) 70%,transparent);
  border-radius:999px;
  overflow:hidden;
}

.cc-limit-fill{
  height:100%;
  border-radius:999px;
  box-shadow:0 0 14px color-mix(in srgb,var(--acc) 38%,transparent);
  transition:width .5s;
}

.cc-body{
  display:none;
  overflow-x:hidden;
  border-top:1px solid color-mix(in srgb,var(--border2) 48%,transparent);
  background:color-mix(in srgb,var(--bg2) 94%,#000 6%);
}

.cc-body.open{display:block}

.cc-body-actions{
  display:flex;
  gap:10px;
  padding:12px 20px;
  flex-wrap:wrap;
  background:color-mix(in srgb,var(--bg3) 90%,transparent);
  border-bottom:1px solid color-mix(in srgb,var(--border2) 48%,transparent);
}

.cc-lancamentos{
  max-height:320px;
  overflow-y:auto;
  overflow-x:hidden;
}

.cc-lanc-row{
  display:grid;
  grid-template-columns:92px 1fr auto auto auto;
  align-items:center;
  gap:8px;
  min-height:52px;
  padding:11px 20px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
  font-size:12px;
}

.cc-lanc-row:last-child{border-bottom:none}
.cc-lanc-row:hover{background:color-mix(in srgb,var(--bg3) 80%,var(--acc) 6%)}

.cc-lanc-date{font-size:11px;color:var(--text3);font-family:var(--mono)}
.cc-lanc-desc{font-size:13px;font-weight:700;color:var(--text1)}
.cc-lanc-cat{padding:3px 8px;border-radius:999px;background:var(--bg3);border:1px solid var(--border2);font-size:10px;color:var(--text3)}
.cc-lanc-parc{padding:3px 8px;border-radius:999px;background:color-mix(in srgb,var(--acc-bg) 88%,transparent);border:1px solid color-mix(in srgb,var(--acc) 35%,var(--acc-mid));color:var(--acc);font-size:10px;font-weight:800;font-family:var(--mono);white-space:nowrap}
.cc-lanc-val{font-family:var(--mono);font-size:13px;font-weight:900;color:var(--red);text-align:right;white-space:nowrap}
.cc-empty-lanc{padding:24px;text-align:center;color:var(--text3);font-size:12px}

.cc-item-header .btn{
  width:34px !important;
  min-width:34px !important;
  height:34px !important;
  min-height:34px !important;
  padding:0 !important;
  border-radius:11px !important;
}

.cc-badge-assin{
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border-radius:999px;
  font-size:9px;
  font-family:var(--mono);
  font-weight:800;
  background:color-mix(in srgb,var(--blue-bg) 80%,transparent);
  color:var(--blue);
  border:1px solid color-mix(in srgb,var(--blue) 55%,var(--border2));
  margin-left:5px;
  white-space:nowrap;
}

.cc-cor-opt{
  width:22px;
  height:22px;
  border-radius:50%;
  cursor:pointer;
  border:2px solid transparent;
  transition:transform .15s,border-color .15s;
}

.cc-cor-opt:hover,
.cc-cor-opt.selected{
  transform:scale(1.15);
}

.cc-cor-opt.selected{
  border-color:var(--text1);
}

/* ═══════════════════════════════════════════════════════════════
   10. HISTÓRICO DE FATURAS
═══════════════════════════════════════════════════════════════ */
#sec-faturas{
  padding:24px;
}

#sec-faturas > .card{
  border-radius:22px;
  padding:22px;
}

#sec-faturas .card-title{
  font-size:15px;
}

#faturas-list > .card{
  border-radius:18px;
  padding:18px !important;
  margin-bottom:14px !important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--bg2) 92%,var(--acc) 4%),var(--bg3));
  border:1px solid color-mix(in srgb,var(--border2) 70%,transparent);
}

#faturas-list > .card:hover{
  border-color:color-mix(in srgb,var(--acc) 38%,var(--border2));
}

#faturas-list > .card > div:first-child{
  padding-bottom:10px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 50%,transparent);
}

#faturas-list > .card > div:first-child strong:first-child{
  font-size:15px;
  color:var(--text1);
  font-weight:900;
}

#faturas-list > .card > div:first-child strong:last-child{
  font-size:16px;
  color:var(--red);
  font-family:var(--mono);
  font-weight:900;
}

#faturas-list > .card > div:nth-child(2){
  margin-top:10px !important;
  color:var(--text3) !important;
  font-family:var(--mono);
  font-size:12px;
}

#faturas-list > .card > div:nth-child(3){
  display:inline-flex;
  align-items:center;
  margin-top:10px !important;
  padding:5px 10px;
  border-radius:999px;
  background:color-mix(in srgb,var(--acc-bg) 82%,transparent);
  border:1px solid color-mix(in srgb,var(--acc) 34%,var(--acc-mid));
  color:var(--acc);
  font-size:11px;
  font-weight:800;
}

#faturas-list > .card > div:nth-child(4){
  margin-top:14px !important;
}

#faturas-list > .card > div:nth-child(4) .btn{
  border-radius:12px;
  font-weight:900;
}

#faturas-list [id^="fat_"]{
  margin-top:14px !important;
  padding:12px !important;
  border-radius:14px !important;
  background:color-mix(in srgb,var(--bg3) 88%,transparent) !important;
  border:1px solid color-mix(in srgb,var(--border2) 60%,transparent);
}

#faturas-list [id^="fat_"] > div{
  padding:8px 0 !important;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 45%,transparent) !important;
  font-size:12px;
}

#faturas-list [id^="fat_"] > div:last-child{border-bottom:none !important}
#faturas-list [id^="fat_"] span:first-child{color:var(--text1);font-weight:700}
#faturas-list [id^="fat_"] span:last-child{color:var(--red);font-family:var(--mono);font-weight:900}

/* ═══════════════════════════════════════════════════════════════
   11. BACKUP / CONFIGURAÇÕES / IMPORTAÇÃO
═══════════════════════════════════════════════════════════════ */
#sec-backup,
#sec-config{
  padding:24px;
}

.backup-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:18px;
}

.bcard{
  min-height:230px;
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:12px;
  transition:transform .12s,border-color .15s,background .15s;
}

.bcard:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--acc) 34%,var(--border2));
}

.bcard-danger{
  border-color:color-mix(in srgb,var(--red) 22%,var(--border2));
}

.bcard-danger:hover{
  border-color:color-mix(in srgb,var(--red) 42%,var(--red-mid));
}

.bcard-icon{
  width:50px;
  height:50px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  background:color-mix(in srgb,var(--acc-bg) 78%,var(--bg4));
  border:1px solid color-mix(in srgb,var(--acc) 30%,var(--border2));
}

.bcard-danger .bcard-icon{
  background:color-mix(in srgb,var(--red-bg) 78%,var(--bg4));
  border-color:color-mix(in srgb,var(--red) 30%,var(--border2));
}

.bcard-title{
  font-size:16px;
  font-weight:900;
  letter-spacing:-.25px;
  color:var(--text1);
}

.bcard-sub{
  font-size:12px;
  color:var(--text3);
  line-height:1.5;
  flex:1;
}

.bcard-status{
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--blue) 8%,transparent),transparent 38%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
}

.status-stats{
  display:flex;
  gap:12px;
  margin:10px 0;
}

.stat-item{
  flex:1;
  min-height:72px;
  padding:12px;
  border-radius:15px;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
}

.stat-value{
  font-size:26px;
  font-weight:900;
  font-family:var(--mono);
  color:var(--acc);
  line-height:1;
}

.stat-label{
  margin-top:6px;
  font-size:10px;
  font-weight:900;
  color:var(--text3);
  letter-spacing:.6px;
  text-transform:uppercase;
}

.overlay .backup-review-modal{
  width:min(660px,94vw);
}

.backup-review-file{
  margin:4px 0 18px;
  padding:10px 12px;
  overflow:hidden;
  border:1px solid var(--border2);
  border-radius:12px;
  color:var(--text2);
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.backup-month-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.backup-review-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:4px 0 10px;
}

.backup-select-all{
  padding:7px 10px;
  font-size:11px;
}

.backup-review-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.backup-review-item{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:10px;
  min-height:44px;
  padding:10px 12px;
  border:1px solid var(--border2);
  border-radius:12px;
  background:color-mix(in srgb,var(--bg3) 88%,transparent);
  color:var(--text2);
  cursor:pointer;
}

.backup-review-item input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.backup-check{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  border:2px solid color-mix(in srgb,var(--text2) 72%,var(--border2));
  border-radius:5px;
  background:transparent;
  color:#111318;
  font-family:Arial,sans-serif;
  font-size:15px;
  font-weight:900;
  line-height:1;
  transition:background .12s,border-color .12s,box-shadow .12s,transform .12s;
}

.backup-review-item input:checked + .backup-check{
  border-color:var(--acc);
  background:var(--acc);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 18%,transparent);
}

.backup-review-item input:checked + .backup-check::after{
  content:'\2713';
}

.backup-review-item input:focus-visible + .backup-check{
  outline:3px solid color-mix(in srgb,var(--acc) 38%,transparent);
  outline-offset:2px;
}

.backup-review-item:active .backup-check{
  transform:scale(.92);
}

.backup-review-item strong{
  min-width:28px;
  padding:3px 7px;
  border-radius:999px;
  background:var(--acc-bg);
  color:var(--acc);
  font-family:var(--mono);
  text-align:center;
}

.backup-review-item.is-empty{
  opacity:.5;
  cursor:not-allowed;
}

.backup-review-warning{
  margin-top:14px;
  padding:10px 12px;
  border:1px solid color-mix(in srgb,var(--amber) 32%,var(--border2));
  border-radius:12px;
  background:color-mix(in srgb,var(--amber) 8%,transparent);
  color:var(--text3);
  font-size:11px;
  line-height:1.45;
}

@media(max-width:600px){
  .backup-month-grid,
  .backup-review-list{grid-template-columns:1fr}

  .backup-check{
    width:23px;
    height:23px;
    border-radius:6px;
    font-size:17px;
  }
}

.cfg-tabs{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px;
  margin-bottom:20px;
  overflow-x:auto;
  border-radius:18px;
  background:color-mix(in srgb,var(--bg2) 92%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
}

.cfg-tab{
  min-height:42px;
  padding:0 16px;
  border-radius:13px;
  border:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:12px;
  font-weight:900;
  color:var(--text3);
  background:transparent;
  white-space:nowrap;
  transition:background .15s,color .15s;
}

.cfg-tab svg{
  width:16px;
  height:16px;
  stroke-width:2;
}

.cfg-tab:hover{
  background:color-mix(in srgb,var(--bg3) 86%,var(--acc) 5%);
  color:var(--text1);
}

.cfg-tab.active{
  background:color-mix(in srgb,var(--acc-bg) 82%,transparent);
  color:var(--acc);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 36%,var(--acc-mid));
}

.cfg-panel{
  display:none;
  animation:fadeIn .18s ease;
}

.cfg-panel.active{
  display:block;
}

.cfg-section{
  margin-bottom:18px;
  padding:22px;
}

.cfg-title{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:15px;
  font-weight:900;
  color:var(--text1);
  letter-spacing:-.25px;
  margin-bottom:6px;
}

.cfg-title svg{
  width:15px;
  height:15px;
  color:var(--acc);
}

.cfg-sub{
  font-size:12px;
  color:var(--text3);
  line-height:1.45;
  margin-bottom:16px;
}

.cfg-row{
  min-height:58px;
  padding:12px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 42%,transparent);
}

.cfg-row:last-child{border-bottom:none}

.cfg-lbl{
  font-size:13px;
  font-weight:850;
  color:var(--text1);
}

.cfg-row .cfg-sub{
  margin:3px 0 0;
  font-size:11px;
}

.cfg-cats-wrap{
  margin-top:12px;
}

.cat-chip{
  min-height:32px;
  padding:0 12px;
  margin:3px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 62%,transparent);
  color:var(--text2);
  font-size:11px;
  font-weight:850;
  cursor:pointer;
}

.cat-chip:hover{
  background:color-mix(in srgb,var(--bg4) 84%,var(--acc) 5%);
  border-color:color-mix(in srgb,var(--acc) 34%,var(--border2));
  color:var(--text1);
}

.chip-x{
  color:var(--red) !important;
  font-weight:900;
  font-size:13px;
  line-height:1;
}

.add-cat-row{
  display:flex;
  gap:10px;
  margin-top:12px;
}

.add-cat-row .fi{
  flex:1;
}

.cfg-cat-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}

.cfg-cat-head .cfg-sub{margin-bottom:0}

.cfg-categoria-resumo{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.cfg-categoria-resumo span{
  padding:7px 10px;
  border:1px solid color-mix(in srgb,var(--border2) 64%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  color:var(--text2);
  font-size:10px;
  font-weight:850;
}

.modal-categoria-box{
  width:min(560px, calc(100vw - 28px));
  max-width:560px;
  max-height:min(760px, calc(100vh - 32px));
  padding:28px 32px 30px;
  border-radius:22px;
}

.categoria-modal-title{
  margin-bottom:22px;
  font-size:19px;
}

.categoria-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:14px;
}

.categoria-form-grid .fg{margin-bottom:0}
.categoria-icone-input{font-size:16px}

.categoria-cor-wrap{
  height:43px;
  padding:7px;
  border:1px solid var(--border2);
  border-radius:10px;
  background:var(--bg3);
}

.categoria-cor-wrap input{
  width:100%;
  height:100%;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
}

#categoria-subs-grupo{margin-top:16px}

.categoria-form-actions{
  display:flex;
  align-items:center;
  gap:9px;
  margin:14px 0 17px;
}

.categoria-form-actions [hidden]{display:none !important}

.categoria-save-btn{
  background:#5be37d;
  border-color:#5be37d;
  color:#07110a;
}

.categoria-save-btn:hover{
  background:#6bef8b;
  border-color:#6bef8b;
  color:#07110a;
}

.categoria-form-actions .btn-red{margin-left:auto}

.categoria-gerenciador-lista{
  max-height:260px;
  padding-right:5px;
  overflow-y:auto;
  scrollbar-color:var(--border2) transparent;
  scrollbar-width:thin;
}

.categoria-manager-row{
  min-height:48px;
  margin-bottom:7px;
  padding:7px 11px 7px 13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-left:4px solid var(--categoria-cor);
  border-radius:9px;
  background:color-mix(in srgb,var(--bg3) 92%,var(--categoria-cor) 5%);
}

.categoria-manager-identidade,
.categoria-manager-meta{
  display:flex;
  align-items:center;
  min-width:0;
}

.categoria-manager-identidade{gap:9px}
.categoria-manager-identidade strong{
  overflow:hidden;
  color:var(--text1);
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.categoria-manager-emoji{width:22px;text-align:center}

.categoria-manager-meta{gap:10px;flex:0 0 auto}
.categoria-manager-meta > span{
  color:var(--text3);
  font-size:9px;
}

.categoria-manager-edit{
  min-height:30px;
  padding:0 9px;
  font-size:10px;
}

.categorias-vazio{
  padding:16px;
  border:1px dashed var(--border2);
  border-radius:10px;
  color:var(--text3);
  font-size:11px;
  text-align:center;
}

.categoria-modal-foot{
  margin-top:18px;
  padding-top:0;
  border-top:0;
}

@media (max-width: 640px){
  .cfg-cat-head{align-items:stretch;flex-direction:column}
  .cfg-cat-head .btn{width:100%}
  .modal-categoria-box{padding:22px 18px}
  .categoria-form-grid{grid-template-columns:1fr 1fr}
  .categoria-form-grid .fg:first-child{grid-column:1 / -1}
  .categoria-manager-row{align-items:flex-start;flex-direction:column}
  .categoria-manager-meta{width:100%;justify-content:space-between}
  .categoria-form-actions{align-items:stretch;flex-direction:column}
  .categoria-form-actions .btn,
  .categoria-form-actions .btn-red{width:100%;margin-left:0}
}

.badge-count{
  position:absolute;
  top:-6px;
  right:-6px;
  background:var(--acc-bg);
  color:#000;
  font-size:10px;
  font-weight:700;
  min-width:16px;
  height:16px;
  border-radius:8px;
  display:none;
  align-items:center;
  justify-content:center;
  padding:0 4px;
  border:2px solid var(--bg2);
  line-height:1;
}

#google-user-info{
  width:100%;
  padding:14px;
  flex-direction:column;
  gap:8px;
  border-radius:16px;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 58%,transparent);
}

#google-user-name{
  display:block;
  margin-bottom:2px;
  font-size:13px;
  font-weight:900;
  color:var(--text1);
  overflow-wrap:anywhere;
}

.bcard-drive{
  background:
    radial-gradient(circle at top right,color-mix(in srgb,#4285f4 10%,transparent),transparent 42%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
}

.bcard-drive #google-signin-area,
.bcard-drive #btn-login-google,
.bcard-drive #google-user-info .btn{
  width:100%;
}

.bcard-drive #btn-login-google,
.bcard-drive #google-user-info .btn{
  justify-content:center;
}

.google-g{
  color:#4285f4;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:900;
}

#cfg-panel-sobre .cfg-section{
  max-width:760px;
}

#cfg-panel-sobre strong{
  color:var(--acc);
}

.file-upload{
  padding:14px;
  border-radius:16px;
  display:flex;
  align-items:center;
  gap:12px;
  background:color-mix(in srgb,var(--bg3) 84%,transparent);
  border:1px dashed color-mix(in srgb,var(--acc) 28%,var(--border2));
}

.file-upload label{
  cursor:pointer;
}

#file-name,
#imp-file-name{
  font-size:13px;
  color:var(--text3);
}

#importar-preview{
  border-radius:16px;
  border:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
  background:color-mix(in srgb,var(--bg2) 86%,transparent);
  overflow:auto;
}

#importar-preview table{
  width:100%;
  border-collapse:collapse;
  border-radius:12px;
  overflow:hidden;
  font-size:13px;
}

#importar-preview th{
  height:38px;
  font-size:10px;
  font-weight:800;
}

#importar-preview td{
  height:42px;
  padding:6px;
}

#importar-preview input[type="text"],
#importar-preview select{
  width:100%;
  min-height:34px;
  padding:4px 8px;
  font-size:12px;
}

#importar-preview tr.dup{
  opacity:.48;
  filter:grayscale(.35);
}

#importar-preview tr.dup td:first-child::after{
  content:' já importado';
  display:inline-block;
  margin-left:6px;
  padding:2px 6px;
  border-radius:999px;
  background:color-mix(in srgb,var(--amber) 15%,transparent);
  color:var(--amber);
  border:1px solid color-mix(in srgb,var(--amber) 35%,transparent);
  font-size:10px;
  font-weight:800;
}

#lista-regras-ofx{
  max-height:320px;
  overflow-y:auto;
  margin-bottom:16px;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.regra-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-radius:14px;
  background:color-mix(in srgb,var(--bg3) 88%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 60%,transparent);
  font-size:13px;
}

.regra-item:hover{
  border-color:color-mix(in srgb,var(--acc) 30%,var(--border2));
}

.regra-texto{
  flex:1;
  color:var(--text1);
}

.regra-texto strong{
  color:var(--text1);
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:12px;
  align-items:end;
}

/* ═══════════════════════════════════════════════════════════════
   12. MODAIS
═══════════════════════════════════════════════════════════════ */
.overlay,
.modal-overlay,
.modal-backdrop,
.pay-modal{
  backdrop-filter:blur(10px);
  background:
    radial-gradient(circle at top,color-mix(in srgb,var(--acc) 9%,transparent),transparent 42%),
    rgba(0,0,0,.74);
}

.overlay{
  display:none;
  position:fixed;
  inset:0;
  z-index:200;
  align-items:flex-start;
  justify-content:center;
  padding-top:60px;
  overflow-y:auto;
}

.overlay.open{display:flex}

.modal-overlay,
.modal-backdrop{
  display:none;
  position:fixed;
  inset:0;
  z-index:1000;
  align-items:center;
  justify-content:center;
}

.modal-overlay.show,
.modal-backdrop.show{
  display:flex;
}

.pay-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
}

.overlay .modal,
.modal-backdrop .modal,
.modal-box,
.pay-modal-box{
  border-radius:22px;
  border:1px solid color-mix(in srgb,var(--acc) 18%,var(--border2));
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 8%,transparent),transparent 36%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
  box-shadow:0 28px 90px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.04);
  color:var(--text1);
  animation:slideUp .2s ease;
}

.overlay .modal{
  width:min(540px,94vw);
  padding:26px;
  margin-bottom:40px;
}

.modal-box{
  width:90%;
  max-height:90vh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

#modal-importar .modal-box,
#modal-regras .modal-box{
  width:min(820px,94vw);
  max-width:820px;
}

.modal-title{
  margin-bottom:20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:16px;
  font-weight:900;
  letter-spacing:-.3px;
  color:var(--text1);
}

.modal-header{
  min-height:58px;
  padding:16px 18px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
  color:var(--text1);
}

.modal-header h3,
.pay-modal-title{
  font-size:16px;
  font-weight:900;
  letter-spacing:-.3px;
}

.modal-close,
.modal-header button,
.btn-close{
  width:34px;
  height:34px;
  min-width:34px;
  padding:0;
  border-radius:11px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 65%,transparent);
  color:var(--text3);
  font-size:18px;
  line-height:1;
}

.modal-close:hover,
.modal-header button:hover,
.btn-close:hover{
  background:color-mix(in srgb,var(--red-bg) 58%,var(--red) 12%);
  border-color:color-mix(in srgb,var(--red) 40%,var(--red-mid));
  color:var(--red);
}

.modal-body{
  padding:18px;
  overflow:auto;
}

.modal-foot,
.modal-actions,
.pay-modal-actions,
.modal-footer{
  margin-top:20px;
  padding-top:18px;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  border-top:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.pay-modal-box{
  width:min(390px,94vw);
  padding:24px;
}

.pay-modal-desc{
  margin-bottom:16px;
  color:var(--text3);
  font-size:12px;
  line-height:1.5;
}

.toggle-row,
.recur-opts,
#modal-cc-item label:has(#cci-assinatura){
  border-radius:15px;
  background:color-mix(in srgb,var(--bg3) 84%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.toggle-row{
  padding:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:4px;
}

.toggle-lbl{
  font-size:12px;
  font-weight:800;
  color:var(--text2);
}

.toggle{
  position:relative;
  display:inline-block;
  width:36px;
  height:20px;
  flex-shrink:0;
}

.toggle input{
  opacity:0;
  width:0;
  height:0;
  position:absolute;
}

.toggle-track{
  position:absolute;
  inset:0;
  background:var(--bg5);
  border-radius:20px;
  cursor:pointer;
  transition:.2s;
}

.toggle input:checked + .toggle-track{
  background:var(--acc);
}

.toggle-thumb{
  position:absolute;
  left:3px;
  top:3px;
  width:14px;
  height:14px;
  background:#fff;
  border-radius:50%;
  transition:.2s;
  pointer-events:none;
}

.toggle input:checked ~ .toggle-thumb{
  left:19px;
}

.recur-opts{
  margin-top:10px;
  padding:14px;
  display:none;
}

.recur-opts.show{display:block}

#cci-parcelas-aviso{
  padding:7px 9px;
  border-radius:10px;
  background:color-mix(in srgb,var(--amber) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--amber) 35%,transparent);
}

#cf-itens{
  border:1px solid color-mix(in srgb,var(--border2) 60%,transparent);
  background:color-mix(in srgb,var(--bg3) 88%,transparent) !important;
  border-radius:14px !important;
}

.breakdown-section{margin-bottom:16px}
.breakdown-title{font-weight:600;margin-bottom:8px;display:flex;justify-content:space-between;color:var(--text3)}
.list-row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;color:var(--text1)}
.breakdown-total{border-top:2px solid var(--border2);margin-top:12px;padding-top:12px;display:flex;justify-content:space-between;font-size:16px;color:var(--text3)}

/* ═══════════════════════════════════════════════════════════════
   13. TOAST / FAB
═══════════════════════════════════════════════════════════════ */
#_toast{
  position:fixed !important;
  right:24px !important;
  bottom:24px !important;
  z-index:140000 !important;
  width:min(390px,calc(100vw - 32px)) !important;
  min-height:72px;
  padding:13px 12px 13px 14px !important;
  border-radius:18px !important;
  display:flex;
  align-items:center;
  gap:12px;
  background:
    radial-gradient(circle at top left,color-mix(in srgb,var(--acc) 11%,transparent),transparent 44%),
    linear-gradient(145deg,var(--bg2),var(--bg3)) !important;
  color:var(--text1) !important;
  border:1px solid color-mix(in srgb,var(--acc) 24%,var(--border2)) !important;
  box-shadow:0 18px 50px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.05) !important;
  font-size:13px !important;
  font-weight:600 !important;
  line-height:1.45 !important;
  white-space:normal !important;
  text-align:left !important;
  backdrop-filter:blur(12px) !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(18px) scale(.97);
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
}

#_toast.show{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}

.toast-status{
  width:10px;
  height:38px;
  flex:0 0 10px;
  border-radius:999px;
  background:var(--acc);
  box-shadow:0 0 18px color-mix(in srgb,var(--acc) 52%,transparent);
}

#_toast[data-tipo="sucesso"] .toast-status{
  background:#22c55e;
  box-shadow:0 0 18px color-mix(in srgb,#22c55e 48%,transparent);
}

#_toast[data-tipo="erro"] .toast-status{
  background:var(--red);
  box-shadow:0 0 18px color-mix(in srgb,var(--red) 48%,transparent);
}

.toast-content{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.toast-content strong{
  color:var(--text1);
  font-size:12px;
  font-weight:900;
}

.toast-message{
  color:var(--text2);
  overflow-wrap:anywhere;
}

.toast-close{
  width:30px;
  height:30px;
  flex:0 0 30px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--text3);
  font-size:19px;
  line-height:1;
}

.toast-close:hover{
  background:color-mix(in srgb,var(--bg4) 82%,transparent);
  color:var(--text1);
}

.system-dialog-backdrop{
  position:fixed;
  inset:0;
  z-index:140001;
  padding:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb,var(--over) 88%,rgba(0,0,0,.68));
  backdrop-filter:blur(10px);
  opacity:0;
  transition:opacity .16s ease;
}

.system-dialog-backdrop[hidden]{
  display:none !important;
}

.system-dialog-backdrop.show{
  opacity:1;
}

.system-dialog{
  width:min(460px,100%);
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--acc) 22%,var(--border2));
  border-radius:20px;
  background:
    radial-gradient(circle at top right,color-mix(in srgb,var(--acc) 10%,transparent),transparent 40%),
    linear-gradient(145deg,var(--bg2),var(--bg3));
  color:var(--text1);
  box-shadow:0 28px 90px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.05);
  transform:translateY(12px) scale(.97);
  transition:transform .18s ease;
}

.system-dialog-backdrop.show .system-dialog{
  transform:translateY(0) scale(1);
}

.system-dialog-header{
  min-height:58px;
  padding:14px 18px;
  display:flex;
  align-items:center;
  gap:11px;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.system-dialog-brand{
  width:30px;
  height:30px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,var(--acc-bg),var(--acc-mid));
  border:1px solid color-mix(in srgb,var(--acc) 42%,var(--border2));
  color:var(--acc);
  font-size:13px;
  font-weight:900;
}

.system-dialog-header strong{
  font-size:14px;
  font-weight:900;
  letter-spacing:-.2px;
}

.system-dialog-message{
  min-height:78px;
  max-height:min(55vh,480px);
  padding:20px 18px;
  overflow-y:auto;
  color:var(--text2);
  font-size:13px;
  font-weight:600;
  line-height:1.6;
  white-space:pre-line;
  overflow-wrap:anywhere;
}

.system-dialog-actions{
  padding:14px 18px 18px;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  border-top:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.system-dialog-actions .btn{
  min-width:92px;
}

#fab-novo-lancamento{
  display:none;
}

/* ═══════════════════════════════════════════════════════════════
   14. MOBILE
═══════════════════════════════════════════════════════════════ */
@media(max-width:1100px){
  .metrics{grid-template-columns:repeat(2,minmax(180px,1fr))}
  .charts-row,.dash-row2,.fixos-grid,.rec-grid{grid-template-columns:1fr}
}

@media(min-width:769px) and (max-width:1100px){
  .topbar:has(#btn-cadeado.fechado) .search-bar{display:none}
}

@media(max-width:768px){
  body{overflow:hidden}

  .sidebar{
    position:fixed;
    top:0;
    left:0;
    height:100%;
    width:280px;
    min-width:280px;
    transform:translateX(-100%);
    z-index:80;
    box-shadow:20px 0 70px rgba(0,0,0,.5);
  }

  .sidebar.open{transform:translateX(0)}
  .ham{display:flex}

  .logo-wrap{padding:18px 16px}
  .logo-wrap svg{width:62px !important;height:62px !important}

  .topbar{
    height:auto;
    min-height:62px;
    padding:10px 14px;
    display:flex;
    flex-wrap:wrap;
  }

  .topbar-left{width:auto;flex:1}
  .topbar-title{font-size:16px}

  .topbar-right{
    width:100%;
    display:grid;
    grid-template-columns:1fr auto auto;
    gap:8px;
  }

  .search-bar{
    grid-column:1 / -1;
    order:2;
    max-width:none;
    width:100%;
  }

  .month-sel{
    width:100%;
    max-width:none;
  }

  #btn-cadeado,
  .ham{
    width:40px;
    min-width:40px;
  }

  #btn-cadeado{
    position:static;
    flex:0 0 auto;
    transform:none;
  }

  #btn-cadeado:hover{
    transform:translateY(-1px);
  }

  #btn-cadeado.fechado{
    width:138px;
    min-width:138px;
    height:42px;
    padding:0 12px;
  }

  #btn-cadeado.fechado .cadeado-aviso small{
    display:none;
  }

  .content{
    padding-bottom:82px;
  }

  .section,
  #sec-dashboard,
  #sec-transacoes,
  #sec-fixos,
  #sec-recorrentes,
  #sec-faturas,
  #sec-backup,
  #sec-config{
    padding:16px !important;
  }

  .metrics,
  #fixos-sum{
    grid-template-columns:1fr !important;
    gap:12px !important;
  }

  .metric{
    min-height:92px;
    padding:14px 16px;
  }

  .metric-val{font-size:18px}
  #sec-dashboard .metric-val{font-size:22px}

  .card{padding:16px}

  .charts-row .card{
    min-height:280px;
  }

  #sec-dashboard .charts-row canvas{
    max-height:210px;
  }

  .hide-mob,
  td.hide-mob,
  th.hide-mob{display:none !important}

  .fg2,
  .form-grid{
    grid-template-columns:1fr;
  }

  .filter-row{
    width:100%;
  }

  .filter-row .form-sel,
  .filter-row .btn{
    flex:1;
    justify-content:center;
  }

  /* Lançamentos mobile: 4 colunas + ações por toque longo */
  #sec-transacoes .tcard table{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
  }

  #sec-transacoes .tcard thead{
    display:block !important;
    width:100% !important;
  }

  #sec-transacoes .tcard thead tr{
    display:grid !important;
    grid-template-columns:78px minmax(0,1fr) 28px 82px !important;
    gap:6px !important;
    padding:10px !important;
    width:100% !important;
  }

  #sec-transacoes .tcard thead th,
  #sec-transacoes .tcard tbody td{
    min-width:0 !important;
    width:auto !important;
    max-width:none !important;
  }

  #sec-transacoes .tcard thead th:nth-child(1),
  #sec-transacoes .tcard tbody td:nth-child(1),
  #sec-transacoes .tcard thead th:nth-child(4),
  #sec-transacoes .tcard tbody td:nth-child(4),
  #sec-transacoes .tcard thead th:nth-child(7),
  #sec-transacoes .tcard tbody td:nth-child(7){
    display:none !important;
  }

  #sec-transacoes .tcard thead th:nth-child(2),
  #sec-transacoes .tcard thead th:nth-child(3),
  #sec-transacoes .tcard thead th:nth-child(5),
  #sec-transacoes .tcard thead th:nth-child(6){
    display:block !important;
    font-size:9px !important;
    padding:0 !important;
    background:transparent !important;
    border:none !important;
  }

  #sec-transacoes .tcard thead th:nth-child(2){grid-column:1;text-align:left}
  #sec-transacoes .tcard thead th:nth-child(3){grid-column:2;text-align:left}
  #sec-transacoes .tcard thead th:nth-child(5){grid-column:3;text-align:center}
  #sec-transacoes .tcard thead th:nth-child(6){grid-column:4;text-align:right}

  #sec-transacoes .tcard tbody{
    display:block !important;
    width:100% !important;
  }

  #sec-transacoes .tcard tbody tr{
    display:grid !important;
    grid-template-columns:78px minmax(0,1fr) 28px 82px !important;
    gap:6px !important;
    align-items:center !important;
    position:relative;
    width:calc(100% - 20px) !important;
    min-height:86px !important;
    margin:8px 10px !important;
    padding:12px 10px !important;
    border-radius:14px;
    border:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
    background:linear-gradient(145deg,var(--bg2),var(--bg3));
  }

  #sec-transacoes .tcard tbody tr:hover td{
    background:transparent !important;
  }

  #sec-transacoes .tcard tbody td{
    height:auto !important;
    padding:0 !important;
    border:none !important;
    background:transparent !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(2){
    display:block !important;
    grid-column:1 !important;
    font-size:10px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    font-family:var(--mono) !important;
    color:var(--text3) !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(3){
    display:-webkit-box !important;
    grid-column:2 !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;
    white-space:normal !important;
    text-overflow:ellipsis !important;
    line-height:1.18 !important;
    font-size:11px !important;
    font-weight:800 !important;
    max-height:2.4em !important;
    padding-right:2px !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(5){
    display:flex !important;
    grid-column:3 !important;
    align-items:center !important;
    justify-content:center !important;
    justify-self:center !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(5) .badge{
    width:20px !important;
    height:20px !important;
    min-width:20px !important;
    padding:0 !important;
    border-radius:50% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:0 !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(5) .badge-rec::before{
    content:'↑';
    font-size:11px !important;
    line-height:1 !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(5) .badge-desp::before{
    content:'↓';
    font-size:11px !important;
    line-height:1 !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(5) .badge-mov::before{
    content:'↳';
    font-size:11px !important;
    line-height:1 !important;
  }

  #sec-transacoes .tcard tbody td:nth-child(6){
    display:block !important;
    grid-column:4 !important;
    font-size:11px !important;
    white-space:nowrap !important;
    text-align:right !important;
    justify-self:end !important;
    font-family:var(--mono) !important;
    font-weight:900 !important;
  }

  #sec-transacoes .tcard tbody tr.mobile-actions-open{
    padding-bottom:58px !important;
    border-color:color-mix(in srgb,var(--acc) 42%,var(--border2));
  }

  #sec-transacoes .tcard tbody tr.mobile-actions-open td:nth-child(7){
    display:flex !important;
    position:absolute !important;
    right:10px !important;
    bottom:10px !important;
    gap:8px;
    padding:8px !important;
    border-radius:12px;
    background:color-mix(in srgb,var(--bg3) 94%,#000 6%) !important;
    border:1px solid color-mix(in srgb,var(--border2) 70%,transparent) !important;
    box-shadow:0 10px 30px rgba(0,0,0,.25);
    z-index:5;
  }

  #sec-transacoes .tcard tbody tr.mobile-actions-open td:nth-child(7) button,
  #sec-transacoes .tcard tbody tr.mobile-actions-open td:nth-child(7) .btn{
    width:34px;
    height:34px;
    min-height:34px;
    padding:0;
    justify-content:center;
    border-radius:10px;
  }

  #trans-totals{
    gap:8px !important;
  }

  #trans-totals > div{
    width:100%;
    display:flex;
    justify-content:space-between;
  }

  /* Fixos mobile */
  .fixos-header,
  .fixo-table-head{
    display:none !important;
  }

  .fixos-row,
  .fixos-row-clean{
    grid-template-columns:1fr auto !important;
    grid-template-areas:
      'info valor'
      'info venc'
      'status actions' !important;
    gap:8px 10px !important;
    padding:12px 14px !important;
    min-height:auto !important;
  }

  .fixos-row-clean .fxname,
  .fxname{
    font-size:13px !important;
    white-space:normal;
  }

  .fxname-wrap,
  .fixo-info{
    grid-area:info;
    align-items:flex-start;
    min-width:0;
  }

  .fixo-venc,
  .fixos-row > div:nth-child(2){
    grid-area:venc;
    justify-self:end;
  }

  .fixo-valor,
  .fixos-row > div:nth-child(3){
    grid-area:valor;
    justify-self:end;
    font-size:12px !important;
  }

  .fixo-status,
  .fixos-row > div:nth-child(4){
    grid-area:status;
    justify-self:start;
  }

  .fixo-actions,
  .fixos-row > div:nth-child(5){
    grid-area:actions;
    justify-self:end;
  }

  .fxapply,
  .fxarchive,
  .fxdel,
  .fixo-actions .btn{
    width:36px !important;
    min-width:36px !important;
    height:36px !important;
    min-height:36px !important;
  }

  /* Recorrentes mobile */
  .rec-item,
  .rec-item-mobile{
    grid-template-columns:1fr auto !important;
    grid-template-areas:
      'info valor'
      'info venc'
      'status actions' !important;
    gap:8px 10px !important;
    padding:14px 16px !important;
    min-height:auto !important;
  }

  .rec-name{
    font-size:14px !important;
    line-height:1.2;
  }

  .rec-meta{
    font-size:11px !important;
  }

  .rec-info{grid-area:info}
  .rec-venc{grid-area:venc;justify-self:end}
  .rec-valor{grid-area:valor;justify-self:end;font-size:13px}
  .rec-status{grid-area:status;justify-self:start}
  .rec-actions{grid-area:actions;justify-self:end}

  .rec-item .btn,
  .rec-item-mobile .btn,
  .rec-pay{
  width:28px;
  min-width:28px;
  height:28px;
  min-height:28px;
  padding:0;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  }

  .rec-grid{
    gap:16px !important;
    margin-top:16px;
  }

  .cc-summary{
    grid-template-columns:repeat(2,1fr);
  }

  .cc-summary-item:nth-child(2n){border-right:none}

  .cc-item-header{
    grid-template-columns:auto minmax(0,1fr) auto !important;
    gap:8px;
  }

  .cc-item-total,
  .cc-item-limit{
    display:none;
  }

  .cc-lancamentos{
    max-height:none;
    overflow:visible;
  }

  .cc-lanc-row{
    grid-template-columns:72px 1fr auto;
    gap:8px;
  }

  .cc-lanc-parc,
  .cc-lanc-cat{
    display:none;
  }

  #sec-faturas > .card{
    padding:18px;
    border-radius:18px;
  }

  #faturas-list > .card{
    padding:16px !important;
  }

  #faturas-list > .card > div:first-child{
    flex-direction:column;
    align-items:flex-start !important;
    gap:6px;
  }

  #faturas-list > .card > div:nth-child(4){
    flex-direction:column;
  }

  #faturas-list > .card > div:nth-child(4) .btn{
    width:100%;
    justify-content:center;
  }

  .backup-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .bcard{
    min-height:auto;
    padding:18px;
    border-radius:18px;
  }

  .status-stats{
    flex-direction:column;
    gap:10px;
  }

  .cfg-tabs{
    padding:7px;
    gap:6px;
  }

  .cfg-tab{
    flex:0 0 auto;
    min-height:38px;
    padding:0 12px;
    font-size:11px;
  }

  .cfg-section{
    padding:18px;
    border-radius:18px;
  }

  .cfg-row,
  .add-cat-row{
    flex-direction:column;
    align-items:stretch;
  }

  .add-cat-row .btn,
  .bcard .btn,
  .bcard button{
    width:100%;
  }

  .overlay{
    align-items:flex-start;
    padding:18px 12px;
  }

  .overlay .modal,
  .modal-box,
  .pay-modal-box{
    width:94vw !important;
    max-width:94vw !important;
    border-radius:18px;
  }

  .overlay .modal{
    padding:20px;
  }

  .modal-foot,
  .modal-actions,
  .pay-modal-actions,
  .modal-footer{
    flex-direction:column-reverse;
  }

  .modal-foot .btn,
  .modal-actions .btn,
  .pay-modal-actions .btn,
  .modal-footer .btn{
    width:100%;
  }

  .file-upload{
    flex-direction:column;
    align-items:stretch;
  }

  #_toast{
    right:14px !important;
    bottom:14px !important;
    width:calc(100vw - 28px) !important;
    font-size:12px !important;
    border-radius:15px !important;
  }

  .system-dialog-backdrop{padding:14px}
  .system-dialog{border-radius:18px}
  .system-dialog-actions{flex-direction:row}
  .system-dialog-actions .btn{width:auto;flex:1}

  #fab-novo-lancamento{
    position:fixed;
    right:18px;
    bottom:22px;
    z-index:120;
    width:58px;
    height:58px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid color-mix(in srgb,var(--acc) 55%,var(--acc-mid));
    background:
      radial-gradient(circle at top left,color-mix(in srgb,#fff 20%,transparent),transparent 34%),
      linear-gradient(145deg,var(--acc-bg),var(--acc-mid));
    color:var(--acc);
    font-size:34px;
    font-weight:800;
    line-height:1;
    box-shadow:0 18px 40px rgba(0,0,0,.38),0 0 0 6px color-mix(in srgb,var(--acc) 9%,transparent);
    cursor:pointer;
    transition:transform .12s,box-shadow .15s;
  }

  #fab-novo-lancamento:active{
    transform:scale(.96);
  }

  body:has(.overlay.open) #fab-novo-lancamento,
  body:has(.modal-overlay.show) #fab-novo-lancamento,
  body:has(.modal-backdrop.show) #fab-novo-lancamento,
  body:has(.pay-modal[style*="flex"]) #fab-novo-lancamento{
    display:none !important;
  }
}

/* Gerenciamento de contas */
.contas-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:16px;
}

.contas-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.contas-saldo-resumo{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:14px;
  padding:16px 18px;
  border:1px solid color-mix(in srgb,var(--blue) 32%,var(--border2));
  border-radius:15px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 12%,var(--bg3)),var(--bg3));
}

.contas-saldo-resumo span,
.contas-saldo-resumo small{
  display:block;
}

.contas-saldo-resumo span{
  color:var(--text2);
  font-size:11px;
  font-weight:850;
}

.contas-saldo-resumo small{
  margin-top:3px;
  color:var(--text3);
  font-size:10px;
}

.contas-saldo-resumo strong{
  color:var(--acc);
  font-family:var(--mono);
  font-size:22px;
  white-space:nowrap;
}

.conta-saldo-atual{
  display:flex;
  align-items:baseline;
  gap:7px;
  margin-top:5px;
  color:var(--text3);
  font-size:10px;
}

.conta-saldo-atual strong{
  color:var(--acc);
  font-family:var(--mono);
  font-size:13px;
}

.contas-saldo-resumo .saldo-negativo,
.conta-saldo-atual.saldo-negativo strong{
  color:var(--red);
}

.conta-saldo-indisponivel{
  margin-top:5px;
  color:var(--text3);
  font-size:10px;
}

.conta-favorita-btn:disabled{
  opacity:1;
  color:var(--amber);
  border-color:color-mix(in srgb,var(--amber) 45%,var(--border2));
  cursor:default;
}

.contas-head-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.contas-transferencias-head{
  margin:22px 0 10px;
  color:var(--text2);
  font-size:11px;
  font-weight:900;
  font-family:var(--mono);
  text-transform:uppercase;
  letter-spacing:.6px;
}

.transferencias-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.transferencia-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:14px;
  padding:11px 13px;
  border-radius:14px;
  background:color-mix(in srgb,var(--bg3) 82%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.transferencia-nome{
  color:var(--text1);
  font-size:12px;
  font-weight:850;
}

.transferencia-row > strong{
  color:var(--blue);
  font-family:var(--mono);
  font-size:12px;
}

.transferencia-actions{
  display:flex;
  gap:6px;
}

.modal-transferencia-box{
  width:min(560px,calc(100vw - 28px));
}

.conta-avatar{
  color:var(--conta-cor,var(--acc));
  background:color-mix(in srgb,var(--conta-cor,var(--acc)) 14%,var(--bg3));
  border-color:color-mix(in srgb,var(--conta-cor,var(--acc)) 45%,var(--border2));
}

.modal-conta-box{
  width:min(620px,calc(100vw - 28px));
}

.conta-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.conta-form-grid .fg,
.conta-cartao-campos .fg{
  margin-bottom:0;
}

.conta-form-nome{
  grid-column:1 / -1;
}

.conta-favorita-opcao{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:14px;
  padding:12px 14px;
  border:1px solid color-mix(in srgb,var(--amber) 35%,var(--border2));
  border-radius:12px;
  background:color-mix(in srgb,var(--amber) 7%,var(--bg3));
  cursor:pointer;
}

.conta-favorita-opcao[hidden]{display:none}

.conta-favorita-opcao input{
  width:17px;
  height:17px;
  margin-top:2px;
  accent-color:var(--amber);
}

.conta-favorita-opcao strong,
.conta-favorita-opcao small{
  display:block;
}

.conta-favorita-opcao strong{
  color:var(--text1);
  font-size:12px;
}

.conta-favorita-opcao small{
  margin-top:3px;
  color:var(--text3);
  font-size:10px;
  line-height:1.45;
}

.conta-cor-input{
  padding:5px;
  cursor:pointer;
}

.conta-cartao-campos{
  display:none;
  grid-template-columns:1fr 1fr 1fr;
  gap:14px;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid color-mix(in srgb,var(--border2) 55%,transparent);
}

.conta-cartao-campos.show{
  display:grid;
}

.conta-msg{
  min-height:18px;
  margin:10px 0 2px;
  color:var(--red);
  font-size:11px;
  font-weight:800;
  font-family:var(--mono);
}

.saldo-contas-card{
  min-height:104px;
}

.saldo-contas-detalhe{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:8px;
  max-height:82px;
  overflow:auto;
  padding-right:3px;
}

.saldo-contas-detalhe > div{
  display:flex;
  justify-content:space-between;
  gap:8px;
  color:var(--text3);
  font-size:9px;
  font-family:var(--mono);
}

.saldo-contas-detalhe strong{
  color:var(--text2);
  white-space:nowrap;
}

.saldo-contas-detalhe .saldo-cartao{
  margin-top:2px;
  padding-top:4px;
  border-top:1px solid color-mix(in srgb,var(--border2) 45%,transparent);
}

.saldo-contas-detalhe .saldo-cartao strong{
  color:var(--red);
}

@media(max-width:768px){
  .conta-form-grid,
  .conta-cartao-campos{
    grid-template-columns:1fr;
  }

  .contas-head .btn{
    width:100%;
  }

  .contas-head-actions{
    width:100%;
    flex-direction:column;
  }

  .transferencia-row{
    grid-template-columns:1fr auto;
  }

  .transferencia-actions{
    grid-column:1 / -1;
  }
}

@media(max-width:520px){
  .filter-row{
    flex-direction:column;
    align-items:stretch;
  }

  .filter-row .form-sel,
  .filter-row .btn{
    width:100%;
  }
}

.mes-fechado-bloqueado,
.mes-fechado-bloqueado * {
  cursor: not-allowed !important;
}

.mes-fechado-bloqueado {
  opacity: 0.5 !important;
}

.fat-card-mini {
  padding: 14px 16px;
  margin-bottom: 10px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card);
}

.fat-mini-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.fat-mini-title {
  display: block;
  color: var(--text);
  font-size: 15px;
  margin-bottom: 5px;
}

.fat-mini-meta {
  font-size: 12px;
  color: var(--text2);
}

.fat-mini-valor {
  color: var(--red);
  font-family: var(--mono);
  font-size: 15px;
  white-space: nowrap;
}

.fat-mini-actions {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

.fat-mini-btn {
  padding: 7px 12px !important;
  font-size: 12px !important;
}

.fat-mini-icon {
  padding: 7px 9px !important;
}

.fat-mini-itens {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.fat-mini-itens div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 5px 0;
  font-size: 12px;
}

@media (max-width: 768px){

  /* RECORRENTES */
  .rec-item{
    position: relative;
    padding-bottom: 18px;
  }

  .rec-item .rec-status,
  .rec-item .rec-actions{
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: .18s ease;
  }

  .rec-item.show-actions .rec-status,
  .rec-item.show-actions .rec-actions{
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  .rec-item .rec-status{
    position: absolute;
    left: 18px;
    bottom: 14px;
  }

  .rec-item .rec-actions{
    position: absolute;
    right: 18px;
    bottom: 14px;
    display: flex;
    gap: 8px;
  }

  /* FIXOS */
  .fixos-row{
    position: relative;
    padding-bottom: 18px;
  }

  .fixos-row .fx-status,
  .fixos-row .fx-actions{
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: .18s ease;
  }

  .fixos-row.show-actions .fx-status,
  .fixos-row.show-actions .fx-actions{
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  .fixos-row .fx-status{
    position: absolute;
    left: 18px;
    bottom: 14px;
  }

  .fixos-row .fx-actions{
    position: absolute;
    right: 18px;
    bottom: 14px;
    display: flex;
    gap: 8px;
  }

  /* cabeçalho das ações pode sumir no mobile */
  .fixo-table-head div:nth-child(4),
  .fixo-table-head div:nth-child(5){
    opacity: .45;
  }
}

@media(max-width:768px){

  /* RECORRENTES - esconder ações */
  .rec-item,
  .rec-item-mobile{
    position:relative;
    padding-bottom:18px !important;
  }

  .rec-item .rec-status,
  .rec-item .rec-actions,
  .rec-item-mobile .rec-status,
  .rec-item-mobile .rec-actions{
    opacity:0;
    pointer-events:none;
    transform:translateY(8px);
    transition:.18s ease;
  }

  .rec-item.show-actions,
  .rec-item-mobile.show-actions{
    padding-bottom:64px !important;
    border-color:color-mix(in srgb,var(--acc) 42%,var(--border2));
  }

  .rec-item.show-actions .rec-status,
  .rec-item.show-actions .rec-actions,
  .rec-item-mobile.show-actions .rec-status,
  .rec-item-mobile.show-actions .rec-actions{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
  }

  .rec-item .rec-status,
  .rec-item-mobile .rec-status{
    position:absolute;
    left:18px;
    bottom:14px;
  }

  .rec-item .rec-actions,
  .rec-item-mobile .rec-actions{
    position:absolute;
    right:18px;
    bottom:14px;
    display:flex;
    gap:8px;
  }

  /* FIXOS - esconder ações */
  .fixos-row,
  .fixos-row-clean{
    position:relative;
    padding-bottom:18px !important;
  }

  .fixos-row .fixo-status,
  .fixos-row .fixo-actions,
  .fixos-row-clean .fixo-status,
  .fixos-row-clean .fixo-actions{
    opacity:0;
    pointer-events:none;
    transform:translateY(8px);
    transition:.18s ease;
  }

  .fixos-row.show-actions,
  .fixos-row-clean.show-actions{
    padding-bottom:64px !important;
    border-color:color-mix(in srgb,var(--acc) 42%,var(--border2));
  }

  .fixos-row.show-actions .fixo-status,
  .fixos-row.show-actions .fixo-actions,
  .fixos-row-clean.show-actions .fixo-status,
  .fixos-row-clean.show-actions .fixo-actions{
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
  }

  .fixos-row .fixo-status,
  .fixos-row-clean .fixo-status{
    position:absolute;
    left:18px;
    bottom:14px;
  }

  .fixos-row .fixo-actions,
  .fixos-row-clean .fixo-actions{
    position:absolute;
    right:18px;
    bottom:14px;
    display:flex;
    gap:8px;
  }
}

@media(max-width:768px){
  #fab-novo-lancamento{
    position:fixed;
    right:18px;
    bottom:92px;
    z-index:9998;
    width:58px;
    height:58px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid color-mix(in srgb,var(--acc) 55%,var(--acc-mid));
    background:
      radial-gradient(circle at top left,color-mix(in srgb,#fff 20%,transparent),transparent 34%),
      linear-gradient(145deg,var(--acc-bg),var(--acc-mid));
    color:var(--acc);
    font-size:34px;
    font-weight:800;
    line-height:1;
    box-shadow:0 18px 40px rgba(0,0,0,.38),0 0 0 6px color-mix(in srgb,var(--acc) 9%,transparent);
    cursor:pointer;
  }
}

/* ═══════════════════════════════════════════════════════════════
   AJUSTES FINAIS — MOBILE / FAB / FATURAS
═══════════════════════════════════════════════════════════════ */

/* Histórico de faturas no estilo “Próximas despesas” */
.fat-card-mini{
  padding:12px 14px !important;
  margin-bottom:10px !important;
  border:1px solid color-mix(in srgb,var(--border2) 80%,transparent) !important;
  border-radius:14px !important;
  background:color-mix(in srgb,var(--bg3) 88%,var(--red) 4%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.fat-mini-top{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
}

.fat-mini-title{
  display:block !important;
  color:var(--text1) !important;
  font-size:15px !important;
  font-weight:900 !important;
  margin-bottom:4px !important;
}

.fat-mini-meta{
  font-size:12px !important;
  color:var(--text2) !important;
  font-family:var(--mono) !important;
}

.fat-mini-valor{
  color:var(--red) !important;
  font-family:var(--mono) !important;
  font-size:15px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  align-self:center !important;
}

.fat-mini-actions{
  display:flex !important;
  gap:8px !important;
  margin-top:10px !important;
}

.fat-mini-btn{
  padding:7px 12px !important;
  font-size:12px !important;
  border-radius:12px !important;
}

.fat-mini-icon{
  padding:7px 9px !important;
  border-radius:12px !important;
}

.fat-mini-itens{
  margin-top:10px !important;
  padding-top:10px !important;
  border-top:1px solid color-mix(in srgb,var(--border2) 55%,transparent) !important;
}

.fat-mini-itens div{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:12px !important;
  padding:8px 0 !important;
  font-size:12px !important;
  color:var(--text2) !important;
}

.fat-mini-itens div strong{
  color:var(--red) !important;
  font-family:var(--mono) !important;
}

@media(max-width:768px){
  /* FAB mobile */
  #fab-novo-lancamento{
    position:fixed !important;
    right:18px !important;
    bottom:92px !important;
    z-index:9998 !important;
    width:58px !important;
    min-width:58px !important;
    height:58px !important;
    min-height:58px !important;
    border-radius:50% !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid color-mix(in srgb,var(--acc) 55%,var(--acc-mid)) !important;
    background:
      radial-gradient(circle at top left,color-mix(in srgb,#fff 20%,transparent),transparent 34%),
      linear-gradient(145deg,var(--acc-bg),var(--acc-mid)) !important;
    color:var(--acc) !important;
    font-size:34px !important;
    font-weight:900 !important;
    line-height:1 !important;
    box-shadow:0 18px 40px rgba(0,0,0,.38),0 0 0 6px color-mix(in srgb,var(--acc) 9%,transparent) !important;
    cursor:pointer !important;
  }

   body:not(:has(#sec-dashboard.active)):not(:has(#sec-transacoes.active)) #fab-novo-lancamento{
  display:none !important;
  }

  body:has(.overlay.open) #fab-novo-lancamento,
  body:has(.modal-overlay.show) #fab-novo-lancamento,
  body:has(.modal-backdrop.show) #fab-novo-lancamento,
  body:has(.pay-modal[style*="flex"]) #fab-novo-lancamento{
    display:none !important;
  }

  /* Recorrentes: ações escondidas e abertas embaixo no toque longo */
  .rec-item,
  .rec-item-mobile{
    position:relative !important;
    overflow:hidden !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "info valor"
      "info venc" !important;
    gap:7px 10px !important;
    padding:14px 16px !important;
    padding-bottom:14px !important;
    min-height:74px !important;
    align-items:center !important;
  }

  .rec-item .rec-status,
  .rec-item .rec-actions,
  .rec-item-mobile .rec-status,
  .rec-item-mobile .rec-actions{
    position:absolute !important;
    bottom:10px !important;
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(8px) !important;
    transition:.18s ease !important;
    z-index:5 !important;
  }

  .rec-item .rec-status,
  .rec-item-mobile .rec-status{
    left:14px !important;
  }

  .rec-item .rec-actions,
  .rec-item-mobile .rec-actions{
    right:14px !important;
    display:flex !important;
    gap:8px !important;
    padding:6px !important;
    border-radius:12px !important;
    background:color-mix(in srgb,var(--bg3) 94%,#000 6%) !important;
    border:1px solid color-mix(in srgb,var(--border2) 70%,transparent) !important;
    box-shadow:0 10px 30px rgba(0,0,0,.25) !important;
  }

  .rec-item.show-actions,
  .rec-item-mobile.show-actions{
    padding-bottom:66px !important;
    border-color:color-mix(in srgb,var(--acc) 42%,var(--border2)) !important;
  }

  .rec-item.show-actions .rec-status,
  .rec-item.show-actions .rec-actions,
  .rec-item-mobile.show-actions .rec-status,
  .rec-item-mobile.show-actions .rec-actions{
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
  }

  /* Planejamento/Fixos: ações escondidas e abertas embaixo no toque longo */
  .fixos-row,
  .fixos-row-clean{
    position:relative !important;
    overflow:hidden !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "info valor"
      "info venc" !important;
    gap:7px 10px !important;
    padding:14px 16px !important;
    padding-bottom:14px !important;
    min-height:74px !important;
    align-items:center !important;
  }

  .fixos-row .fixo-status,
  .fixos-row .fixo-actions,
  .fixos-row-clean .fixo-status,
  .fixos-row-clean .fixo-actions{
    position:absolute !important;
    bottom:10px !important;
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateY(8px) !important;
    transition:.18s ease !important;
    z-index:5 !important;
  }

  .fixos-row .fixo-status,
  .fixos-row-clean .fixo-status{
    left:14px !important;
  }

  .fixos-row .fixo-actions,
  .fixos-row-clean .fixo-actions{
    right:14px !important;
    display:flex !important;
    gap:8px !important;
    padding:6px !important;
    border-radius:12px !important;
    background:color-mix(in srgb,var(--bg3) 94%,#000 6%) !important;
    border:1px solid color-mix(in srgb,var(--border2) 70%,transparent) !important;
    box-shadow:0 10px 30px rgba(0,0,0,.25) !important;
  }

  .fixos-row.show-actions,
  .fixos-row-clean.show-actions{
    padding-bottom:66px !important;
    border-color:color-mix(in srgb,var(--acc) 42%,var(--border2)) !important;
  }

  .fixos-row.show-actions .fixo-status,
  .fixos-row.show-actions .fixo-actions,
  .fixos-row-clean.show-actions .fixo-status,
  .fixos-row-clean.show-actions .fixo-actions{
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
  }
}

.fixo-titulo-linha{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  min-width:0;
}

.fixo-meta{
  margin-top:2px;
  font-size:10px;
  color:var(--text3);
  line-height:1.2;
}

.fixo-info{
  display:flex;
  align-items:left;
}

.fixo-info .fxstatus{
  margin:0;
  white-space:nowrap;
}

/* ===== CORREÇÃO RECORRENTES COMPACTO DESKTOP ===== */

.rec-item,
.rec-item-mobile{
  display:grid !important;
  grid-template-columns:minmax(170px,1fr) 64px 100px 92px 86px !important;
  grid-template-areas:"info venc valor status actions" !important;
  gap:8px !important;
  align-items:center !important;
  min-height:42px !important;
  padding:6px 18px !important;
}

.rec-info{
  grid-area:info !important;
  display:block !important;
  min-width:0 !important;
}

.rec-venc{
  grid-area:venc !important;
  justify-self:center !important;
  text-align:center !important;
}

.rec-valor{
  grid-area:valor !important;
  justify-self:end !important;
  text-align:right !important;
}

.rec-status{
  grid-area:status !important;
  justify-self:center !important;
}

.rec-actions{
  grid-area:actions !important;
  justify-self:end !important;
  display:flex !important;
  gap:6px !important;
}

.rec-titulo-linha{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  min-width:0 !important;
}

.rec-name{
  font-size:13px !important;
  font-weight:850 !important;
  line-height:1.15 !important;
}

.rec-meta{
  display:block !important;
  margin-top:2px !important;
  font-size:9px !important;
  color:var(--text3) !important;
}

.rec-status-tag{
  display:inline-flex !important;
  align-items:center !important;
  height:24px !important;
  min-height:24px !important;
  padding:0 8px !important;
  border-radius:999px !important;
  font-size:8px !important;
  font-weight:900 !important;
  background:color-mix(in srgb,var(--bg3) 86%,transparent) !important;
  border:1px solid color-mix(in srgb,var(--border2) 58%,transparent) !important;
  color:var(--text3) !important;
  white-space:nowrap !important;
}

.rec-status-tag.amber{
  background:color-mix(in srgb,var(--amber) 15%,transparent) !important;
  color:var(--amber) !important;
  border-color:color-mix(in srgb,var(--amber) 35%,transparent) !important;
}

.rec-status-tag.red{
  background:color-mix(in srgb,var(--red) 15%,transparent) !important;
  color:var(--red) !important;
  border-color:color-mix(in srgb,var(--red) 35%,transparent) !important;
}

.rec-item .btn,
.rec-item-mobile .btn,
.rec-pay{
  width:28px !important;
  min-width:28px !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 !important;
  border-radius:9px !important;
}

/* ===== RECORRENTES MOBILE: AÇÕES EMBAIXO NO LONG PRESS ===== */

@media(max-width:768px){

  .rec-item,
  .rec-item-mobile{
    position:relative !important;
    grid-template-columns:1fr auto auto !important;
    grid-template-areas:
      "info venc valor" !important;
    padding:10px 16px !important;
    padding-bottom:14px !important;
    min-height:64px !important;
  }

  .rec-item .rec-status,
  .rec-item .rec-actions,
  .rec-item-mobile .rec-status,
  .rec-item-mobile .rec-actions{
    opacity:0 !important;
    pointer-events:none !important;
    position:absolute !important;
    bottom:12px !important;
    transform:translateY(8px) !important;
    transition:.18s ease !important;
  }

  .rec-item .rec-status,
  .rec-item-mobile .rec-status{
    left:16px !important;
  }

  .rec-item .rec-actions,
  .rec-item-mobile .rec-actions{
    right:16px !important;
    display:flex !important;
    gap:8px !important;
  }

  .rec-item.show-actions,
  .rec-item-mobile.show-actions{
    padding-bottom:58px !important;
  }

  .rec-item.show-actions .rec-status,
  .rec-item.show-actions .rec-actions,
  .rec-item-mobile.show-actions .rec-status,
  .rec-item-mobile.show-actions .rec-actions{
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
  }
}

.fxcat{
  margin-top:2px;
  font-size:9px;
  color:var(--text3);
  font-family:var(--mono);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


/* ===== FIXOS E RECORRENTES EM ESTILO CARD ===== */
@media(min-width:769px){
  #sec-recorrentes .fixo-table-head,
  #sec-fixos .fixos-header{
    display:none !important;
  }
}

#sec-recorrentes .fixo-list,
#sec-fixos .fixos-card{
  background:color-mix(in srgb,var(--bg2) 92%,transparent);
}

.lista-card{
  display:block !important;
  min-height:auto !important;
  padding:10px 12px !important;
  margin:8px 14px !important;
  border:1px solid color-mix(in srgb,var(--border2) 72%,transparent) !important;
  border-radius:12px !important;
  background:color-mix(in srgb,var(--bg3) 88%,var(--red) 4%) !important;
  cursor:pointer;
  transition:background .15s,border-color .15s,transform .12s;
}

.lista-card:hover{
  border-color:color-mix(in srgb,var(--acc) 28%,var(--border2)) !important;
  background:color-mix(in srgb,var(--bg3) 84%,var(--red) 5%) !important;
}

.lista-card.is-pago{
  background:color-mix(in srgb,var(--bg3) 88%,var(--acc) 4%) !important;
}

.lista-card-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-width:0;
}

.lista-card-info{
  min-width:0;
}

.lista-card-title{
  color:var(--text1) !important;
  font-size:13px !important;
  font-weight:850 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.lista-card-meta{
  margin-top:3px !important;
  color:var(--text3) !important;
  font-size:10px !important;
  line-height:1.25 !important;
  font-family:var(--font) !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.lista-card-value{
  font-family:var(--mono) !important;
  font-size:13px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  text-align:right !important;
  justify-self:auto !important;
}

.lista-status{
  font-weight:900;
  color:var(--text3);
}

.lista-status.amber{
  color:var(--amber);
}

.lista-status.red{
  color:var(--red);
}

.lista-status.ok{
  color:var(--acc);
}

.lista-card-actions{
  display:none;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid color-mix(in srgb,var(--border2) 45%,transparent);
}

.lista-card.show-actions .lista-card-actions{
  display:flex;
}

.lista-card .rec-status,
.lista-card .fixo-status,
.lista-card .rec-actions,
.lista-card .fixo-actions{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  justify-self:auto !important;
}

.lista-card .btn,
.lista-card .rec-pay,
.lista-card .fxapply,
.lista-card .fxdel{
  width:30px !important;
  min-width:30px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 !important;
  border-radius:10px !important;
}

#sec-recorrentes .fixo-card,
#sec-fixos .fixos-card{
  padding-bottom:4px;
}

/* Evita conflito com o layout antigo em cards */
.lista-card .rec-venc,
.lista-card .fixo-venc{
  display:none !important;
}

@media(max-width:768px){
  .lista-card{
    margin:8px 10px !important;
    padding:11px 12px !important;
  }

  .lista-card-main{
    gap:10px;
  }

  .lista-card-title{
    font-size:13px !important;
  }

  .lista-card-value{
    font-size:12px !important;
  }

  .lista-card-actions{
    display:none !important;
  }

  .lista-card.show-actions .lista-card-actions{
    display:flex !important;
  }
}

/* ===== MOSTRAR AÇÕES NOS CARDS DESKTOP ===== */
@media(min-width:769px){
  .lista-card .lista-card-actions{
    display:flex !important;
  }
}

/* ===== AÇÕES SÓ NO HOVER DESKTOP ===== */
@media(min-width:769px){
  .lista-card .lista-card-actions{
    opacity:0;
    pointer-events:none;
    transform:translateX(8px);
    transition:.15s ease;
  }

  .lista-card:hover .lista-card-actions{
    opacity:1;
    pointer-events:auto;
    transform:translateX(0);
  }
}

.lista-card{
  position:relative;
  padding:12px 14px;
  min-height:auto;
}

.lista-card-main{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}

.lista-card-info{
  min-width:0;
}

.lista-card-title{
  font-size:14px;
  font-weight:700;
  margin-bottom:2px;
}

.lista-card-meta{
  font-size:11px;
  color:var(--text3);
}

.lista-card-value{
  font-family:var(--mono);
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
}

.lista-card-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  margin-top:8px;

  opacity:0;
  max-height:0;
  overflow:hidden;
  pointer-events:none;
  transition:all .18s ease;
}

@media (min-width: 769px){
  .lista-card:hover .lista-card-actions{
    opacity:1;
    max-height:48px;
    pointer-events:auto;
  }
}

.lista-card.show-actions .lista-card-actions{
  opacity:1;
  max-height:48px;
  pointer-events:auto;
}

/* ===== LISTAS FIXAS / RECORRENTES MAIS COMPACTAS ===== */

.lista-card{
  padding:6px 8px 2px 8px !important;
  min-height:20px !important;
  margin-bottom:6px !important;
  border-radius:12px !important;
}

.lista-card-main{
  min-height:20px !important;
  align-items:center !important;
}

.lista-card-title{
  font-size:13px !important;
  line-height:1.1 !important;
  margin-bottom:2px !important;
}

.lista-card-meta{
  font-size:10px !important;
  line-height:1.15 !important;
}

.lista-card-value{
  font-size:13px !important;
  line-height:1 !important;
}

.lista-card-actions{
  margin-top:2px !important;
  padding-top:2px !important;
  max-height:0 !important;
}

.lista-card:hover .lista-card-actions,
.lista-card.show-actions .lista-card-actions{
  max-height:34px !important;
}

.lista-card-actions .btn,
.lista-card-actions button{
  width:28px !important;
  min-width:28px !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 !important;
  border-radius:9px !important;
}

/* ===== DIFERENÇA VISUAL ENTRE PAGO E PENDENTE ===== */

/* Cards pagos mais apagados */
.lista-card.is-pago{
  opacity:0.72;
  background:color-mix(in srgb,var(--bg2) 88%,var(--acc-bg) 8%) !important;
}

/* Nome de item pago */
.lista-card.is-pago .lista-card-title,
.lista-card.is-pago .fxname,
.lista-card.is-pago .rec-name{
  color:color-mix(in srgb,var(--text3) 72%,#ffffff 10%) !important;
  font-weight:700 !important;
}

/* Metadados de item pago */
.lista-card.is-pago .lista-card-meta,
.lista-card.is-pago .fxcat,
.lista-card.is-pago .rec-meta{
  color:color-mix(in srgb,var(--text3) 72%,transparent) !important;
}

/* Valor pago mais discreto */
.lista-card.is-pago .lista-card-value,
.lista-card.is-pago .fixo-valor,
.lista-card.is-pago .rec-valor{
  color:color-mix(in srgb,var(--text3) 70%,#000 80%) !important;
}

/* Pendente continua forte */
.lista-card:not(.is-pago) .lista-card-title,
.lista-card:not(.is-pago) .fxname,
.lista-card:not(.is-pago) .rec-name{
  color:var(--text1) !important;
  opacity:1 !important;
}

.metric-breakdown{
  margin-top:6px;
  display:flex;
  flex-direction:column;
  gap:3px;
  font-size:10px;
  color:var(--text3);
  font-family:var(--mono);
}

.metric-breakdown div{
  display:flex;
  justify-content:space-between;
  gap:10px;
  line-height:1.2;
}

.metric-breakdown strong{
  color:var(--text2);
  font-weight:800;
}

.metric-breakdown div:last-child{
  margin-top:3px;
  padding-top:5px;
  border-top:1px solid color-mix(in srgb,var(--border2) 45%,transparent);
}

.metric-breakdown div:last-child span,
.metric-breakdown div:last-child strong{
  color:var(--text1);
}

.despesas-previstas-breakdown > .metric-breakdown-cartao:last-child{
  margin-top:0;
  padding-top:0;
  border-top:0;
}

.despesas-previstas-breakdown > .metric-breakdown-cartao span{
  color:var(--text3);
}

.despesas-previstas-breakdown > .metric-breakdown-cartao strong{
  color:var(--text2);
}

.despesas-previstas-breakdown > .metric-breakdown-cartao.primeiro-cartao{
  margin-top:3px;
  padding-top:5px;
  border-top:1px solid color-mix(in srgb,var(--border2) 45%,transparent);
}

/* ===== MODAIS DE ORÇAMENTO - ALTURA CONTROLADA ===== */

#orcamento-modal,
#orcamento-receitas-modal{
  align-items:center !important;
  justify-content:center !important;
  padding:18px !important;
}

#orcamento-modal-content,
#orcamento-receitas-modal-content{
  width:min(560px,96vw) !important;
  max-height:88vh !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}

#orcamento-modal-content .modal-body,
#orcamento-receitas-modal-content .modal-body{
  overflow-y:auto !important;
  max-height:calc(88vh - 72px) !important;
  padding:14px 18px !important;
}

/* ===== LISTAS COMPACTAS DO MODAL DE ORÇAMENTO ===== */

#orcamento-modal-content .breakdown-section,
#orcamento-receitas-modal-content .breakdown-section{
  margin-bottom:14px !important;
}

#orcamento-modal-content .breakdown-title,
#orcamento-receitas-modal-content .breakdown-title{
  position:sticky;
  top:0;
  z-index:2;
  padding:8px 0 !important;
  margin-bottom:6px !important;
  background:var(--bg2);
  font-size:14px !important;
  font-weight:900 !important;
  color:var(--text1) !important;
  border-bottom:1px solid color-mix(in srgb,var(--border2) 50%,transparent);
}

#orcamento-modal-content .list-row,
#orcamento-receitas-modal-content .list-row{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  gap:12px !important;
  align-items:center !important;
  padding:5px 0 !important;
  font-size:12px !important;
  line-height:1.15 !important;
}

#orcamento-modal-content .list-row span,
#orcamento-modal-content .list-row div:first-child,
#orcamento-receitas-modal-content .list-row span,
#orcamento-receitas-modal-content .list-row div:first-child{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

#orcamento-modal-content .list-row div:last-child,
#orcamento-modal-content .list-row span:last-child,
#orcamento-receitas-modal-content .list-row div:last-child,
#orcamento-receitas-modal-content .list-row span:last-child{
  font-family:var(--mono) !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

#orcamento-modal-content .breakdown-total,
#orcamento-receitas-modal-content .breakdown-total{
  position:sticky;
  bottom:0;
  background:var(--bg2);
  margin-top:10px !important;
  padding-top:10px !important;
}

.user-chip{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:6px 10px;
  border-radius:999px;
  background:color-mix(in srgb,var(--bg3) 82%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 60%,transparent);
  color:var(--text2);
  font-size:11px;
  font-weight:800;
  font-family:var(--mono);
  white-space:nowrap;
}

.user-avatar{
  width:22px;
  height:22px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb,var(--acc-bg) 78%,transparent);
  border:1px solid color-mix(in srgb,var(--acc) 30%,transparent);
  font-size:12px;
}

@media(max-width:768px){
  .user-chip{
    display:none;
  }
}

.senha-msg{
  font-size:11px;
  font-weight:800;
  font-family:var(--mono);
  color:var(--text3);
}

.senha-msg.ok{
  color:var(--acc);
}

.senha-msg.erro{
  color:var(--red);
}

@media(max-width:900px){
  .senha-grid{
    grid-template-columns:1fr;
  }
}

/* ═══════════════════════════════════════════════════════════════
   USUÁRIOS DO SISTEMA
═══════════════════════════════════════════════════════════════ */
.usuarios-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:16px;
}

.usuarios-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.usuario-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 14px;
  border-radius:16px;
  background:color-mix(in srgb,var(--bg3) 86%,transparent);
  border:1px solid color-mix(in srgb,var(--border2) 62%,transparent);
}

.usuario-card:hover{
  background:color-mix(in srgb,var(--bg4) 84%,var(--acc) 5%);
  border-color:color-mix(in srgb,var(--acc) 30%,var(--border2));
}

.usuario-card.usuario-inativo{
  opacity:.68;
  background:color-mix(in srgb,var(--bg2) 88%,transparent);
}

.usuario-info{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.usuario-avatar{
  width:38px;
  height:38px;
  min-width:38px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb,var(--acc-bg) 80%,transparent);
  border:1px solid color-mix(in srgb,var(--acc) 34%,var(--acc-mid));
  color:var(--acc);
  font-size:15px;
  font-weight:900;
  font-family:var(--mono);
  text-transform:uppercase;
}

.usuario-texto{
  min-width:0;
}

.usuario-nome{
  color:var(--text1);
  font-size:13px;
  font-weight:900;
  line-height:1.2;
}

.usuario-meta{
  margin-top:3px;
  color:var(--text3);
  font-size:10px;
  font-family:var(--mono);
  line-height:1.35;
  overflow:hidden;
  text-overflow:ellipsis;
}

.usuario-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}

.usuario-status{
  min-height:26px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  font-family:var(--mono);
  text-transform:uppercase;
  white-space:nowrap;
}

.usuario-status.ativo{
  color:var(--acc);
  background:color-mix(in srgb,var(--acc-bg) 78%,transparent);
  border:1px solid color-mix(in srgb,var(--acc) 38%,var(--acc-mid));
}

.usuario-status.inativo{
  color:var(--red);
  background:color-mix(in srgb,var(--red-bg) 78%,transparent);
  border:1px solid color-mix(in srgb,var(--red) 38%,var(--red-mid));
}

.usuario-msg{
  min-height:18px;
  margin:4px 0 10px;
  font-size:11px;
  font-weight:800;
  font-family:var(--mono);
  color:var(--text3);
}

.usuario-msg.ok{
  color:var(--acc);
}

.usuario-msg.erro{
  color:var(--red);
}

@media(max-width:768px){
  .usuario-card{
    align-items:flex-start;
    flex-direction:column;
  }

  .usuario-actions{
    width:100%;
    justify-content:space-between;
  }
}

/* PRIMEIROS PASSOS / ONBOARDING */
.onboarding-help-btn{
  white-space:nowrap;
}

.onboarding-help-btn > span:first-child{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid currentColor;
  border-radius:50%;
  font-family:var(--mono);
  font-weight:900;
}

.onboarding-welcome-overlay{
  z-index:130000;
  align-items:center;
  padding:20px;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(10px);
}

.onboarding-welcome-card{
  width:min(520px,100%);
  text-align:center;
  padding:30px;
}

.onboarding-welcome-card h2{
  margin:14px 0 8px;
  color:var(--text1);
  font-size:23px;
}

.onboarding-welcome-card p{
  margin:0 auto;
  max-width:430px;
  color:var(--text2);
  font-size:13px;
  line-height:1.65;
}

.onboarding-welcome-icon{
  width:58px;
  height:58px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:20px;
  color:var(--acc);
  background:var(--acc-bg);
  border:1px solid var(--acc-mid);
  font-size:30px;
  font-weight:900;
}

.onboarding-welcome-points{
  margin:20px auto 4px;
  display:flex;
  justify-content:center;
  gap:10px 20px;
  flex-wrap:wrap;
  color:var(--text3);
  font:500 10px var(--mono);
}

.onboarding-welcome-actions{
  justify-content:center;
  margin-top:22px;
}

.onboarding-panel{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:120000;
  width:min(390px,calc(100vw - 28px));
  max-height:min(680px,calc(100vh - 44px));
  display:none;
  flex-direction:column;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--acc) 28%,var(--border2));
  border-radius:20px;
  background:color-mix(in srgb,var(--bg2) 97%,var(--acc) 3%);
  box-shadow:0 24px 70px rgba(0,0,0,.42);
}

.onboarding-panel.open{
  display:flex;
  animation:onboarding-in .2s ease-out;
}

@keyframes onboarding-in{
  from{opacity:0;transform:translateY(12px) scale(.98)}
  to{opacity:1;transform:none}
}

.onboarding-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:18px 18px 12px;
}

.onboarding-panel-head strong{
  color:var(--text1);
  font-size:15px;
}

.onboarding-eyebrow{
  margin-bottom:3px;
  color:var(--acc);
  font:700 9px var(--mono);
  letter-spacing:.08em;
}

.onboarding-progress-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 18px 14px;
  color:var(--text3);
  font:500 9px var(--mono);
}

.onboarding-progress{
  height:6px;
  flex:1;
  overflow:hidden;
  border-radius:999px;
  background:var(--bg4);
}

.onboarding-progress span{
  width:0;
  height:100%;
  display:block;
  border-radius:inherit;
  background:var(--acc);
  transition:width .25s ease;
}

.onboarding-list{
  padding:0 10px 8px;
  overflow:auto;
}

.onboarding-step{
  display:grid;
  grid-template-columns:30px minmax(0,1fr) auto;
  align-items:start;
  gap:10px;
  padding:11px 9px;
  border-top:1px solid color-mix(in srgb,var(--border2) 52%,transparent);
}

.onboarding-step:first-child{border-top:0}

.onboarding-step-check{
  width:26px;
  height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:var(--text3);
  background:var(--bg3);
  border:1px solid var(--border2);
  font:700 10px var(--mono);
}

.onboarding-step.done .onboarding-step-check{
  color:var(--bg1);
  background:var(--acc);
  border-color:var(--acc);
}

.onboarding-step-title{
  margin-top:1px;
  color:var(--text1);
  font-size:11px;
  font-weight:900;
}

.onboarding-step.done .onboarding-step-title{
  color:var(--text3);
  text-decoration:line-through;
}

.onboarding-step-desc{
  margin-top:3px;
  color:var(--text3);
  font-size:9px;
  line-height:1.45;
}

.onboarding-step-actions{
  display:flex;
  align-items:center;
  gap:5px;
}

.onboarding-step-actions .btn{
  min-height:29px;
  padding:0 9px;
  font-size:9px;
}

.onboarding-skip{
  min-width:29px !important;
  padding:0 7px !important;
}

.onboarding-panel.guiding .onboarding-list{
  display:none;
}

.onboarding-action-target{
  position:relative !important;
  z-index:120001 !important;
  overflow:visible !important;
  pointer-events:auto !important;
  border-color:var(--acc);
  color:var(--acc);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--acc) 22%,transparent),
    0 0 30px color-mix(in srgb,var(--acc) 42%,transparent);
  animation:onboarding-action-pulse 1.1s ease-in-out infinite;
  cursor:pointer !important;
}

.onboarding-action-target::after{
  content:attr(data-onboarding-label);
  position:absolute;
  left:50%;
  bottom:calc(100% + 11px);
  width:max-content;
  max-width:230px;
  padding:8px 11px;
  transform:translateX(-50%);
  border-radius:10px;
  color:#111827;
  background:#fff;
  border:1px solid #e5e7eb;
  box-shadow:0 10px 28px rgba(0,0,0,.35);
  font:800 10px/1.35 var(--mono);
  text-align:center;
  pointer-events:none;
}

.onboarding-overflow-visible{
  overflow:visible !important;
}

.cc-header .onboarding-action-target::after{
  top:calc(100% + 11px);
  bottom:auto;
  right:0;
  left:auto;
  transform:none;
}

[data-onboarding-dashboard-card].onboarding-action-target::after{
  top:calc(100% + 11px);
  bottom:auto;
  width:300px;
  max-width:calc(100vw - 32px);
  white-space:pre-line;
  text-align:left;
  line-height:1.5;
}

[data-onboarding-dashboard-card="0"].onboarding-action-target::after{
  left:0;
  transform:none;
}

[data-onboarding-dashboard-card="4"].onboarding-action-target::after{
  right:0;
  left:auto;
  transform:none;
}

#btn-cadeado.onboarding-action-target::after{
  top:calc(100% + 11px);
  bottom:auto;
  width:310px;
  max-width:calc(100vw - 32px);
  white-space:pre-line;
  text-align:left;
  line-height:1.5;
}

@keyframes onboarding-action-pulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.06)}
}

@media(max-width:900px){
  .onboarding-help-label{display:none}
  .onboarding-help-btn{min-width:38px;padding:0 8px}
}

@media(max-width:768px){
  .onboarding-help-btn{grid-column:auto;grid-row:auto}

  #btn-cadeado.onboarding-action-target::after{
    right:0;
    left:auto;
    transform:none;
  }

  .onboarding-panel{
    right:14px;
    bottom:14px;
    max-height:calc(100vh - 28px);
  }

  .onboarding-welcome-card{padding:24px 18px}
  .onboarding-welcome-actions{flex-direction:column-reverse}
  .onboarding-welcome-actions .btn{width:100%}
}