:root{--bg:#f5f7fb;--card:#fff;--text:#172033;--muted:#697386;--line:#e4e9f2;--primary:#3995cf;--purple:#8a50cf;--red:#cf2250;--gold:#e6b624;--orange:#e66118;--green:#3dc2a1;--shadow:0 8px 28px rgba(20,35,70,.08)}*{box-sizing:border-box}body{margin:0;font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}.layout{display:grid;grid-template-columns:255px 1fr;min-height:100vh}.sidebar{background:#101828;color:#fff;padding:22px 16px;position:sticky;top:0;height:100vh;overflow:auto}.brand{font-size:24px;font-weight:900;margin:0 8px 24px}.brand small{display:block;font-size:11px;color:#98a2b3;font-weight:500}.nav a{display:block;padding:11px 12px;margin:4px 0;border-radius:10px;color:#d0d5dd}.nav a:hover,.nav a.active{background:#24314b;color:#fff}.content{padding:26px;min-width:0}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.topbar h1{font-size:24px;margin:0}.userbox{color:var(--muted)}.grid{display:grid;gap:16px}.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}.metric small{color:var(--muted)}.metric strong{display:block;font-size:23px;margin-top:8px}.section-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:25px 0 12px}.section-title h2{font-size:19px;margin:0}.btn{border:0;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}.btn.primary{background:var(--primary);color:#fff}.btn.danger{background:#fee4e8;color:#b42318}.btn.secondary{background:#eef2f7;color:#344054}.btn.small{padding:7px 10px;font-size:13px}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:14px}.table{width:100%;border-collapse:collapse;min-width:760px}.table th,.table td{padding:12px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}.table th{font-size:12px;text-transform:uppercase;color:var(--muted)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid label{font-weight:700;font-size:13px}.form-grid input,.form-grid select,.form-grid textarea{display:block;width:100%;margin-top:6px;border:1px solid #cfd7e6;border-radius:10px;padding:11px;background:#fff;font:inherit}.full{grid-column:1/-1}.actions-sticky{position:sticky;bottom:0;background:rgba(255,255,255,.96);border-top:1px solid var(--line);padding:13px 0;margin-top:18px;display:flex;justify-content:flex-end;gap:10px;z-index:3}.alert{padding:12px;border-radius:10px;margin:12px 0}.alert.ok{background:#dcfae6;color:#067647}.alert.error{background:#fee4e8;color:#b42318}.badge{display:inline-block;padding:4px 8px;border-radius:999px;background:#eef2f7;font-size:12px}.progress{height:10px;background:#edf1f7;border-radius:99px;overflow:hidden}.progress span{display:block;height:100%;background:var(--green)}.auth-body{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#101828,#24314b)}.auth-card{width:min(520px,100%);background:#fff;border-radius:20px;padding:28px;box-shadow:var(--shadow)}.auth-card h1{margin:0}.auth-card h2{color:var(--muted);font-size:17px}.tabs{display:flex;gap:8px;flex-wrap:wrap}.tabs a{padding:8px 12px;border-radius:9px;background:#eef2f7}.tabs a.active{background:var(--primary);color:#fff}.mobile-toggle{display:none}.chart-bars{display:flex;align-items:end;gap:10px;height:220px;padding-top:20px}.chart-bar{flex:1;min-width:34px;text-align:center}.chart-bar i{display:block;background:var(--primary);border-radius:7px 7px 0 0;min-height:3px}.chart-bar small{font-size:11px;color:var(--muted)}@media(max-width:980px){.cards{grid-template-columns:repeat(2,1fr)}.layout{grid-template-columns:1fr}.sidebar{position:fixed;left:-280px;width:260px;z-index:20;transition:.2s}.sidebar.open{left:0}.mobile-toggle{display:inline-flex}.content{padding:18px}}@media(max-width:620px){.cards{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.topbar{align-items:flex-start}.userbox{font-size:12px}.content{padding:14px}.actions-sticky{margin-left:-14px;margin-right:-14px;padding:12px 14px}.actions-sticky .btn{flex:1}.card{padding:14px}}
/* +QGrana 1.4.0 — aplicação ampliada da paleta inspirada nas cédulas do Real */
.btn.accent{background:var(--purple);color:#fff}.btn.success{background:var(--green);color:#083b32}.privacy-link{text-align:center;color:var(--primary);font-weight:700}.privacy-card{width:min(760px,100%)}.privacy-card h2{color:var(--purple);margin-top:22px}.consent{display:flex!important;align-items:flex-start;gap:10px;font-weight:500!important}.consent input{width:auto!important;margin:4px 0 0!important}.consent a{color:var(--primary);text-decoration:underline}.admin-accent{border-top:5px solid var(--primary)}.badge.gold{background:#fff4cc;color:#765900}.inline-actions{display:flex;gap:8px;align-items:center}.phone-form{display:flex;gap:6px;min-width:250px}.phone-form input{min-width:145px;border:1px solid #cfd7e6;border-radius:8px;padding:7px}.nav a[href*="transactions"]{border-left:3px solid var(--red)}.nav a[href*="tracking"]{border-left:3px solid var(--orange)}.nav a[href*="projections"]{border-left:3px solid var(--gold)}.nav a[href*="goals"]{border-left:3px solid var(--purple)}.metric:nth-child(1){border-top:4px solid var(--green)}.metric:nth-child(2){border-top:4px solid var(--red)}.metric:nth-child(3){border-top:4px solid var(--purple)}.metric:nth-child(4){border-top:4px solid var(--primary)}
@media(max-width:620px){.inline-actions,.phone-form{flex-direction:column;align-items:stretch}.phone-form{min-width:180px}.auth-card{padding:20px}}

/* +QGrana 1.4.0 — navegação modular */
.brand span{color:var(--green)}
.nav-group{margin:0 0 16px}
.nav-group-title{padding:0 12px 5px;color:#98a2b3;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.nav-group:nth-of-type(1) .nav-group-title{color:var(--primary)}
.nav-group:nth-of-type(2) .nav-group-title{color:var(--gold)}
.nav-group:nth-of-type(3) .nav-group-title{color:var(--purple)}

/* +QGrana 1.6.0 — experiência e ajuda contextual de Importações */
.import-intro{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:14px}.import-intro h2{margin:3px 0 5px;font-size:22px}.import-intro p{margin:0;color:var(--muted);max-width:760px}.eyebrow{display:block;color:var(--primary);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em}.import-switch{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 16px}.import-switch a{padding:9px 13px;border-radius:10px;background:#fff;border:1px solid var(--line);font-weight:750;color:#475467}.import-switch a.active{background:var(--primary);color:#fff;border-color:var(--primary)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 18px}.step{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);padding:10px 12px;border-radius:12px;color:var(--muted)}.step strong{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#eef2f7;font-size:12px}.step.active{color:var(--text);border-color:#b8dced}.step.active strong{background:var(--primary);color:#fff}.help-box{background:#fff;border:1px solid var(--line);border-radius:12px;min-width:190px;max-width:430px}.help-box summary{cursor:pointer;list-style:none;padding:10px 13px;font-weight:800;color:var(--primary)}.help-box summary::-webkit-details-marker{display:none}.help-box[open] summary{border-bottom:1px solid var(--line)}.help-content{padding:12px 14px;color:#475467;font-size:13px}.help-content p:first-child,.help-content ol:first-child{margin-top:0}.help-content p:last-child,.help-content ol:last-child{margin-bottom:0}.help-content ol{padding-left:20px}.help-content li{margin:5px 0}.inline-help{max-width:none;margin:12px 0 16px}.compact-help{min-width:auto;max-width:360px}.compact-help summary{padding:7px 11px}.field-help{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#eef2f7;color:var(--primary);font-size:11px;font-weight:900;cursor:help;vertical-align:middle}.muted-copy,.section-subtitle{color:var(--muted)}.section-subtitle{margin:3px 0 0;font-size:13px}.format-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.format-box{border:1px solid var(--line);border-radius:12px;padding:12px;background:#fafbfc}.format-box strong{display:block;color:var(--primary);margin-bottom:4px}.format-box span{display:block;color:var(--muted);font-size:13px}.privacy-note,.help-note,.learn-note{border-radius:12px;padding:12px 14px;font-size:13px}.privacy-note{background:#f2f7fb;color:#344054}.help-note{background:#f8fafc;border:1px dashed #cfd7e6;margin-bottom:14px}.learn-note{margin-top:14px;background:#f0fbf7;border-left:4px solid var(--green);color:#245b4f}.review-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}.review-summary>div{background:#f5f8fb;border:1px solid var(--line);border-radius:12px;padding:12px}.review-summary strong{display:block;font-size:21px;color:var(--primary)}.review-summary span{color:var(--muted);font-size:12px;font-weight:700}.review-summary .warn strong{color:#987500}.review-summary .danger strong{color:var(--red)}.import-review-table .row-possible td{background:#fffaf0}.import-review-table .row-duplicate td{background:#fff5f6;color:#667085}.import-review-table .description-cell{white-space:normal;min-width:240px}.badge.danger{background:#fee4e8;color:#b42318}.empty-state{padding:22px;text-align:center;display:grid;gap:4px;color:var(--muted)}.empty-state strong{color:var(--text)}
@media(max-width:760px){.import-intro{display:block}.help-box{margin-top:12px;max-width:none}.steps{grid-template-columns:1fr}.step{padding:8px 10px}.format-grid{grid-template-columns:1fr}.review-summary{grid-template-columns:repeat(3,1fr)}.review-summary>div{padding:10px}.review-summary strong{font-size:18px}.import-switch a{flex:1;text-align:center}}
@media(max-width:480px){.review-summary{grid-template-columns:1fr}.import-switch{display:grid;grid-template-columns:1fr}.import-switch a{width:100%}}

/* +QGrana / Planejador de Investimentos — Produção */
.nav a[href*="page=settings"]{border-left:3px solid var(--green)}
.nav a[href*="page=investments"]{border-left:3px solid var(--orange)}
.nav a[href*="page=import_spreadsheet"]{border-left:3px solid var(--primary)}
.nav a[href*="page=import_card"]{border-left:3px solid var(--purple)}
.nav-group:nth-of-type(1) .nav-group-title{color:var(--primary)}
.nav-group:nth-of-type(2) .nav-group-title{color:var(--purple)}
.nav-group:nth-of-type(3) .nav-group-title{color:var(--orange)}
.nav-group:nth-of-type(4) .nav-group-title{color:var(--green)}
.inv-tabs{margin:0 0 18px}.inv-tabs a{border:1px solid var(--line)}.inv-tabs a.active{background:var(--primary);color:#fff}
.inv-dashboard-grid{grid-template-columns:1.4fr 1fr;margin:16px 0}
.inv-line-chart{width:100%;height:230px;color:var(--primary);overflow:visible}.inv-line-chart text{font-size:10px;fill:var(--muted)}
.inv-composition{display:grid;gap:12px}.inv-comp-row{display:grid;grid-template-columns:100px 1fr 55px 110px;gap:8px;align-items:center}.inv-comp-row small{text-align:right;color:var(--muted)}
.inv-mini-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}.inv-mini-metrics span{background:#f7f9fc;border-radius:9px;padding:8px;font-size:11px}.inv-mini-metrics strong{display:block;margin-top:3px}
.target-inline{display:flex;gap:6px;align-items:center}.target-inline input{width:88px;padding:7px;border:1px solid var(--line);border-radius:8px}
.sheet-table{min-width:1450px}.sheet-table input{width:94px;padding:7px;border:1px solid var(--line);border-radius:7px}.sheet-total td{background:#f6f8fb}
.inv-attachments{margin-top:18px}.wrap-cell{white-space:normal!important;min-width:320px}
@media(max-width:980px){.inv-dashboard-grid{grid-template-columns:1fr}.inv-comp-row{grid-template-columns:90px 1fr 50px}.inv-comp-row small{grid-column:2/4}.target-inline{flex-direction:column;align-items:stretch}}

/* +QGrana 1.11.0 — preparação mobile: senha e gestão segura de cadastros */
.password-field{position:relative;margin-top:6px}.password-field input{margin-top:0!important;padding-right:76px!important}.password-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:#eef2f7;color:var(--primary);border-radius:8px;padding:7px 10px;font:inherit;font-size:12px;font-weight:800;cursor:pointer}.password-toggle:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.row-inactive{opacity:.62}.muted-badge{background:#f2f4f7;color:#667085}.settings-accent-category{border-top:5px solid var(--purple)}.settings-accent-account{border-top:5px solid var(--green)}
@media(max-width:620px){.table-wrap .table{min-width:680px}.password-toggle{min-height:36px}.help-content{font-size:14px;line-height:1.5}}



/* =========================================================
   +QGrana 2.0 Mobile — M02
   Estrutura compartilhada de navegação e componentes mobile
   ========================================================= */

:root{
  --qg-safe-top: env(safe-area-inset-top, 0px);
  --qg-safe-right: env(safe-area-inset-right, 0px);
  --qg-safe-bottom: env(safe-area-inset-bottom, 0px);
  --qg-safe-left: env(safe-area-inset-left, 0px);
}

.sidebar-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.sidebar-close{display:none;border:0;background:transparent;color:#fff;font-size:32px;line-height:1;cursor:pointer;padding:4px 8px}
.sidebar-overlay{display:none}
.topbar-title{display:flex;align-items:center;gap:10px;min-width:0}
.userbox{display:grid;gap:2px;text-align:right}
.user-name{font-weight:500}
.user-email{font-size:13px}
.mobile-card-list{display:none}
.desktop-only{display:block}
.mobile-only{display:none}

/* Base para as próximas conversões de tabelas. */
.responsive-data{min-width:0}
.responsive-data .table-wrap{max-width:100%}

@media(max-width:980px){
  body.mobile-nav-open{overflow:hidden}
  .sidebar{
    left:calc(-1 * min(86vw, 320px));
    width:min(86vw, 320px);
    max-width:320px;
    padding-top:max(18px,var(--qg-safe-top));
    padding-left:max(16px,var(--qg-safe-left));
    padding-bottom:max(22px,var(--qg-safe-bottom));
    box-shadow:12px 0 30px rgba(16,24,40,.25);
    z-index:1001;
  }
  .sidebar.open{left:0}
  .sidebar-close{display:inline-flex}
  .sidebar-overlay{
    position:fixed;inset:0;border:0;background:rgba(16,24,40,.48);
    z-index:1000;cursor:pointer;
  }
  body.mobile-nav-open .sidebar-overlay{display:block}
  .content{
    padding-left:max(18px,var(--qg-safe-left));
    padding-right:max(18px,var(--qg-safe-right));
    padding-bottom:max(18px,var(--qg-safe-bottom));
  }
}

@media(max-width:620px){
  .content{
    padding:14px max(14px,var(--qg-safe-right)) max(18px,var(--qg-safe-bottom)) max(14px,var(--qg-safe-left));
  }
  .topbar{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    margin-bottom:18px;
  }
  .topbar-title{gap:8px}
  .topbar h1{
    font-size:24px;
    line-height:1.15;
    overflow-wrap:anywhere;
  }
  .mobile-toggle{
    min-width:44px;min-height:44px;padding:8px;
    flex:0 0 44px;
  }
  .userbox{
    max-width:42vw;
    text-align:right;
    line-height:1.15;
  }
  .user-name{
    font-size:12px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
  }
  .user-email{display:none}

  /* Não deixar a barra de ações cobrir campos no celular. */
  .actions-sticky{
    position:static;
    margin:18px 0 0;
    padding:14px 0 0;
    background:transparent;
    border-top:1px solid var(--line);
    box-shadow:none;
    display:flex;
    gap:10px;
  }
  .actions-sticky .btn{min-height:46px}

  /* Ajuda contextual mais compacta no mobile. */
  .page-context-help,
  .import-intro .help-box{
    width:100%;
    min-width:0;
    max-width:none;
  }
  .help-box summary{
    min-height:46px;
    display:flex;
    align-items:center;
    padding:11px 14px;
  }

  /* Áreas clicáveis de checkbox. */
  .form-grid label:has(input[type="checkbox"]){
    min-height:44px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:8px 0;
  }
  .form-grid label:has(input[type="checkbox"]) input[type="checkbox"]{
    width:22px!important;
    height:22px;
    margin:0!important;
    flex:0 0 22px;
  }

  .desktop-only{display:none!important}
  .mobile-only{display:block!important}
  .desktop-table{display:none!important}
  .mobile-card-list{display:grid;gap:12px}
}

/* Pequenas telas */
@media(max-width:380px){
  .topbar{grid-template-columns:1fr}
  .userbox{display:none}
  .topbar h1{font-size:22px}
}


/* =========================================================
   +QGrana 2.0 Mobile — M03
   Lançamentos, realizações parciais e switches
   ========================================================= */
.qg-switch-form{display:flex;align-items:center;gap:8px}
.qg-switch-form>small,.qg-switch-form>span{font-weight:700;color:var(--muted)}
.qg-switch{
  position:relative;width:58px;height:32px;padding:0;border:0;border-radius:999px;
  background:#98a2b3;cursor:pointer;flex:0 0 58px;transition:.18s ease;
}
.qg-switch>span{
  position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;
  background:#fff;box-shadow:0 1px 4px rgba(16,24,40,.25);transition:.18s ease;
}
.qg-switch.is-on{background:var(--green)}
.qg-switch.is-on>span{left:29px}
.quick-status-card{
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  background:var(--card);border:1px solid var(--line);border-radius:16px;
  padding:14px 16px;box-shadow:var(--shadow);
}
.quick-status-card>div{display:grid;gap:3px;min-width:0}
.quick-status-card strong{overflow-wrap:anywhere}
.quick-status-card small{color:var(--muted)}
.mobile-quick-list{display:grid;gap:10px}
.realization-card{margin:20px 0}
.realization-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0 18px}
.realization-summary>div{background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:12px}
.realization-summary small{display:block;color:var(--muted)}
.realization-summary strong{display:block;margin-top:4px}
.realization-list{display:grid;gap:8px;margin-top:16px}
.realization-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px}
.realization-item>div{display:grid;gap:2px}.realization-item small{color:var(--muted)}
.transaction-mobile-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:var(--shadow);display:grid;gap:12px}
.tx-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.tx-card-head>div{display:grid;gap:4px;min-width:0}.tx-card-head small{color:var(--muted)}
.tx-card-meta{display:flex;flex-wrap:wrap;gap:6px}.tx-card-meta span{background:#f2f4f7;border-radius:999px;padding:5px 9px;font-size:12px}
.tx-card-actions{display:flex;flex-wrap:wrap;gap:8px}.tx-card-actions form{display:inline-flex}
.tx-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tx-plan-grid>div{background:#f8fafc;border-radius:10px;padding:9px}.tx-plan-grid small{display:block;color:var(--muted);font-size:11px}.tx-plan-grid strong{font-size:14px}
.tx-switch-row{justify-content:space-between;border-top:1px solid var(--line);padding-top:10px}

@media(max-width:620px){
  .realization-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quick-status-card{padding:12px}
  .qg-switch{width:56px;height:32px}
  .tx-card-actions .btn{min-height:42px}
  .realization-form .actions-sticky{border-top:0;padding-top:0}
}
@media(max-width:380px){
  .tx-plan-grid{grid-template-columns:1fr}
}


/* +QGrana 2.0 Mobile — M03.1 */
.dashboard-ledger{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.dashboard-ledger-row{display:grid;grid-template-columns:72px minmax(180px,1fr) 145px 145px 120px;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line)}
.dashboard-ledger-row:last-child{border-bottom:0}.dashboard-ledger-head{background:#f8fafc;color:var(--muted);font-size:11px;text-transform:uppercase;font-weight:800}
.dashboard-ledger-link{transition:.15s ease}.dashboard-ledger-link:hover{background:#f8fafc}.dashboard-ledger-link span:nth-child(2){display:grid;gap:2px}.dashboard-ledger-link small{color:var(--muted)}
.ledger-income{color:#147d64;font-weight:800}.ledger-expense{color:#b42318;font-weight:800}
@media(max-width:760px){
 .dashboard-ledger{box-shadow:none}.dashboard-ledger-head{display:none}
 .dashboard-ledger-row{grid-template-columns:52px minmax(0,1fr) auto;gap:8px 10px;padding:11px 12px}
 .dashboard-ledger-link span:nth-child(2){grid-column:2}.dashboard-ledger-link .ledger-income,.dashboard-ledger-link .ledger-expense{grid-column:3;grid-row:1 / span 2;text-align:right}
 .dashboard-ledger-link span:last-child{grid-column:2;color:var(--muted);font-size:12px}.dashboard-ledger-title{align-items:flex-start}
}


/* +QGrana 2.0 Mobile — M03.2 */
.dashboard-ledger-link.ledger-grouped{border-left:4px solid var(--purple)}
.dashboard-ledger-link.ledger-grouped span:nth-child(2) strong{color:var(--purple)}


/* =========================================================
   +QGrana 2.0 Mobile — M04
   ========================================================= */
@media(max-width:760px){
  /* Corrige as tabelas de operações e rendimentos mostradas nos prints:
     no celular viram cartões verticais em vez de tabela horizontal cortada. */
  .inv-mobile-stack{overflow:visible!important}
  .inv-mobile-stack .table{min-width:0!important;width:100%!important;display:block}
  .inv-mobile-stack thead{display:none}
  .inv-mobile-stack tbody{display:grid;gap:10px}
  .inv-mobile-stack tr{display:grid!important;grid-template-columns:1fr 1fr;background:var(--card,#fff);border:1px solid var(--line,#dce3ed);border-radius:14px;padding:12px;gap:9px 12px}
  .inv-mobile-stack td{display:grid!important;gap:2px;padding:0!important;border:0!important;white-space:normal!important;min-width:0}
  .inv-mobile-stack td::before{font-size:10px;line-height:1.2;text-transform:uppercase;font-weight:800;color:var(--muted,#667085)}
  .inv-operation-history td:nth-child(1)::before{content:"Data"}
  .inv-operation-history td:nth-child(2)::before{content:"Ativo"}
  .inv-operation-history td:nth-child(3)::before{content:"Operação"}
  .inv-operation-history td:nth-child(4)::before{content:"Quantidade"}
  .inv-operation-history td:nth-child(5)::before{content:"Preço"}
  .inv-operation-history td:nth-child(6)::before{content:"Ações"}
  .inv-operation-history td:nth-child(6){grid-column:1/-1}
  .inv-income-history td:nth-child(1)::before{content:"Recebimento"}
  .inv-income-history td:nth-child(2)::before{content:"Ativo"}
  .inv-income-history td:nth-child(3)::before{content:"Tipo"}
  .inv-income-history td:nth-child(4)::before{content:"Valor"}
  .inv-income-history td:nth-child(5)::before{content:"Ações"}
  .inv-income-history td:nth-child(5){grid-column:1/-1}
}
.premium-user-list{display:grid;gap:12px}
.premium-user-card{border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;grid-template-columns:minmax(180px,1fr) 2fr auto;align-items:center;gap:14px;background:var(--card,#fff)}
.premium-user-card>div:first-child{display:grid;gap:3px}.premium-user-card small{color:var(--muted)}
.premium-feature-options{display:flex;flex-wrap:wrap;gap:8px 14px}.premium-feature-options label{display:grid;grid-template-columns:auto 1fr;gap:2px 7px;align-items:start}.premium-feature-options label small{grid-column:2}
.loan-contract-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.loan-contract-card{display:grid;gap:7px;text-decoration:none}.loan-kpi{display:grid;gap:2px;margin-top:8px}.loan-card-meta{display:flex;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:12px}
.loan-two-col{grid-template-columns:repeat(2,minmax(0,1fr))}
.loan-installment-list{display:grid;gap:6px;margin-top:14px;max-height:520px;overflow:auto}
.loan-installment-row{display:grid;grid-template-columns:70px 120px 1fr auto;gap:10px;align-items:center;padding:9px 10px;border-bottom:1px solid var(--line)}
.loan-preview-list,.loan-balance-list,.loan-attachment-list{display:grid;gap:8px;margin:12px 0}
.loan-preview-list>div,.loan-balance-list>div,.loan-attachment-list>div{display:flex;gap:12px;justify-content:space-between;align-items:center;padding:9px 10px;border:1px solid var(--line);border-radius:10px}
.loan-attachment-list form{display:inline}
@media(max-width:760px){
 .premium-user-card{grid-template-columns:1fr}.premium-user-card .btn{width:100%}
 .loan-two-col{grid-template-columns:1fr}
 .loan-installment-row{grid-template-columns:50px 90px 1fr}.loan-installment-row .badge{grid-column:1/-1;justify-self:start}
}


/* =========================================================
   +QGrana 2.0 Mobile — M04.1
   Ordem semântica do menu, cores e tradução visual
   ========================================================= */
.nav-group-organizar .nav-group-title{color:var(--green)!important}
.nav-group-planejar .nav-group-title{color:var(--purple)!important}
.nav-group-acompanhar .nav-group-title{color:var(--primary)!important}
.nav-group-importacoes .nav-group-title{color:var(--orange)!important}
.nav-group-administrar .nav-group-title{color:var(--green)!important}
.nav-group-ajuda .nav-group-title{color:#98a2b3!important}

.nav a[href*="page=loans"]{border-left:3px solid var(--primary)}
.nav a[href*="page=loans"].active{border-left-color:var(--primary)}
.loan-contract-card{border-top:4px solid var(--primary)}
.loan-contract-grid .loan-contract-card:nth-child(3n+2){border-top-color:var(--purple)}
.loan-contract-grid .loan-contract-card:nth-child(3n+3){border-top-color:var(--orange)}
.loan-two-col>.card:nth-child(1){border-top:4px solid var(--primary)}
.loan-two-col>.card:nth-child(2){border-top:4px solid var(--green)}
#schedule-import{border-top:4px solid var(--purple)}


/* =========================================================
   +QGrana 2.0 Mobile — M04.2
   Rolagem do menu e descoberta de importação/anexos
   ========================================================= */
@media(max-width:980px){
  .sidebar{
    top:0!important;
    bottom:0!important;
    height:100vh!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    box-sizing:border-box;
  }
  .sidebar .nav{
    min-height:max-content;
    padding-bottom:calc(28px + var(--qg-safe-bottom));
  }
  .sidebar .logout-link{
    display:block;
    margin:10px 0 0;
    padding:13px 12px;
    border-top:1px solid rgba(255,255,255,.12);
    border-left:3px solid var(--red);
    color:#fff;
    font-weight:800;
  }
}
.loan-after-save-guide{
  border:1px solid var(--line);
  border-left:5px solid var(--primary);
  border-radius:14px;
  padding:14px;
  margin:0 0 18px;
  background:#f8fafc;
}
.loan-after-save-guide>strong{font-size:16px}
.loan-after-save-guide p{margin:7px 0}
.loan-after-save-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}
.loan-after-save-actions>span{
  display:grid;
  grid-template-columns:28px 1fr;
  gap:2px 8px;
  align-items:start;
  padding:10px;
  border:1px solid var(--line);
  border-radius:11px;
  background:var(--card,#fff);
}
.loan-after-save-actions b{
  grid-row:1/3;
  display:grid;
  place-items:center;
  width:28px;height:28px;
  border-radius:50%;
  background:var(--primary);
  color:#fff;
}
.loan-after-save-actions small{grid-column:2;color:var(--muted)}
.loan-quick-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 14px;
}
#loan-attachments{scroll-margin-top:20px}
#loan-payment{scroll-margin-top:20px}
#loan-balance{scroll-margin-top:20px}
#schedule-import{scroll-margin-top:20px}
@media(max-width:760px){
  .loan-after-save-actions{grid-template-columns:1fr}
  .loan-quick-actions{display:grid;grid-template-columns:1fr}
  .loan-quick-actions .btn{width:100%;min-height:46px}
}


/* =========================================================
   +QGrana 2.0 Mobile — M04.3
   Categorias, contas e cartões responsivos
   ========================================================= */
.settings-mobile-list{margin-bottom:18px}
.settings-mobile-card{
  background:var(--card,#fff);
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  display:grid;
  gap:12px;
  box-shadow:var(--shadow);
}
.settings-mobile-card.is-inactive{opacity:.65}
.settings-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.settings-card-head>div{display:grid;gap:6px;min-width:0}
.settings-card-head strong{font-size:17px;overflow-wrap:anywhere}
.settings-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.settings-card-grid>div{background:#f8fafc;border:1px solid var(--line);border-radius:11px;padding:10px}
.settings-card-grid small{display:block;color:var(--muted);font-size:11px;margin-bottom:3px}
.settings-card-grid strong{display:block}
.settings-card-actions{display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:10px}
.settings-card-actions form{display:inline-flex}
.account-mobile-card.is-card{border-top:4px solid var(--primary)}
.account-mobile-card.is-account{border-top:4px solid var(--green)}
.category-mobile-card{border-top:4px solid var(--purple)}
@media(max-width:380px){
  .settings-card-grid{grid-template-columns:1fr}
  .settings-card-actions{display:grid;grid-template-columns:1fr}
  .settings-card-actions .btn,.settings-card-actions form,.settings-card-actions button{width:100%}
}


/* =========================================================
   +QGrana 2.0 Mobile — M05
   Dashboard acionável, competência e novo lançamento
   ========================================================= */

/* Componente único de competência */
.competence-filter{
  display:flex;
  align-items:end;
  gap:10px;
  margin:0 0 16px;
}
.competence-filter label{display:grid;gap:6px;font-weight:700;font-size:13px}
.competence-filter label>span{color:var(--text)}
.competence-input,
input[type="month"].competence-input{
  appearance:auto;
  min-height:44px;
  min-width:190px;
  padding:10px 12px;
  border:1px solid #cfd7e6;
  border-radius:10px;
  background:#fff;
  color:var(--text);
  font:inherit;
  font-size:14px;
  line-height:1.2;
}

/* Cards acionáveis do Dashboard */
.dashboard-action-card{display:grid;gap:10px}
.metric-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto}
.metric-actions a{font-size:12px;font-weight:800}
.metric-actions .metric-add{
  display:inline-flex;
  padding:6px 9px;
  border-radius:8px;
  background:#eef2f7;
}
.dashboard-action-card.income-card{border-top:4px solid var(--green)}
.dashboard-action-card.expense-card{border-top:4px solid var(--red)}
.dashboard-action-card.investment-card{border-top:4px solid var(--purple)}
.dashboard-action-card.balance-card{border-top:4px solid var(--primary)}

.balance-composition{margin:16px 0 22px;border-top:4px solid var(--primary)}
.balance-lines{display:grid;gap:0}
.balance-lines>a,.balance-lines>div{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:4px 14px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
  align-items:center;
}
.balance-lines>a:hover{background:#f8fafc}
.balance-neutral small{grid-column:1/-1;color:var(--muted)}
.balance-total{font-size:17px;border-bottom:0!important}
.balance-total strong{font-size:20px}

/* Novo fluxo de lançamento */
.transaction-entry-card{border-top:4px solid var(--primary)}
.transaction-section-title{
  display:grid;
  gap:3px;
  padding-bottom:10px;
  border-bottom:1px solid var(--line);
}
.transaction-section-title strong{font-size:17px}
.transaction-section-title small{color:var(--muted)}
.transaction-suggested-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  padding:12px;
  background:#f8fafc;
  border:1px solid var(--line);
  border-radius:14px;
}
.transaction-suggested-grid label small{display:block;margin-top:5px;color:var(--muted);font-weight:500}
.transaction-realized-control{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:58px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
}
.transaction-realized-control>div{display:grid;gap:2px}
.transaction-realized-control small{color:var(--muted)}
.transaction-primary-actions{margin-top:4px}
.transaction-more-options{
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
}
.transaction-more-options>summary{
  cursor:pointer;
  list-style:none;
  padding:13px 14px;
  font-weight:800;
}
.transaction-more-options>summary::-webkit-details-marker{display:none}
.transaction-more-options>summary::after{content:"▾";float:right;color:var(--muted)}
.transaction-more-options[open]>summary::after{content:"▴"}
.transaction-more-grid{padding:14px;border-top:1px solid var(--line)}

@media(max-width:620px){
  .competence-filter{display:grid;grid-template-columns:1fr}
  .competence-filter label,.competence-filter .competence-input,.competence-filter .btn{width:100%}
  .competence-input,input[type="month"].competence-input{min-width:0;min-height:48px;font-size:16px}
  .transaction-suggested-grid{grid-template-columns:1fr}
  .transaction-form-m05{gap:12px}
  .transaction-primary-actions{display:grid;grid-template-columns:1fr}
  .transaction-primary-actions .btn{width:100%}
  .metric-actions{display:grid;grid-template-columns:1fr}
  .metric-actions a{min-height:34px;display:flex;align-items:center}
}


/* =========================================================
   +QGrana 2.0 Mobile — M05.1
   Padronização global de seletores
   ========================================================= */
.qg-selector,
select.qg-selector,
input.qg-selector{
  box-sizing:border-box;
  min-height:44px;
  padding:10px 12px;
  border:1px solid #cfd7e6;
  border-radius:10px;
  background:#fff;
  color:var(--text);
  font:inherit;
  font-size:14px;
  line-height:1.2;
}
select.qg-selector{
  padding-right:34px;
}
.qg-selector:focus{
  outline:2px solid rgba(57,149,207,.18);
  outline-offset:1px;
  border-color:var(--primary);
}
.period-filter{
  display:flex;
  align-items:end;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 16px;
}
.period-filter label{
  display:grid;
  gap:6px;
  font-size:13px;
  font-weight:700;
}
.period-filter label>span{color:var(--text)}
.period-filter-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.investment-section-filter{margin-bottom:10px}
.investment-section-filter label{min-width:250px}
@media(min-width:761px){
  .investment-section-filter{display:none}
}
@media(max-width:760px){
  .period-filter{
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
  }
  .period-filter label,
  .period-filter .qg-selector,
  .period-filter .btn,
  .period-filter-actions{
    width:100%;
  }
  .period-filter-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .qg-selector,
  select.qg-selector,
  input.qg-selector{
    min-height:48px;
    font-size:16px;
  }
  .inv-tabs{display:none!important}
}


/* +QGrana 2.0 Mobile — M05.2 */
.monthly-measurement-filter{margin-bottom:8px}
.monthly-measurement-filter label{min-width:min(320px,100%)}


/* +QGrana 2.0 Mobile — M05.3 */
.currency-input{display:flex;align-items:center;gap:8px;min-width:0}
.currency-input>span{flex:0 0 auto;font-weight:700;color:var(--text)}
.currency-input .investment-value-input{min-width:0;width:100%;max-width:220px}
@media(max-width:760px){
  .currency-input .investment-value-input{max-width:none;width:100%;min-height:48px;font-size:16px}
}


/* =========================================================
   +QGrana 2.0 Mobile — M05.4
   CSV de fatura flexível e multicompetência
   ========================================================= */
.card-csv-models{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.card-csv-models .format-box{display:grid;gap:8px;align-content:start}
.card-csv-models .btn{justify-self:start}
.card-competence-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin:12px 0 16px}
.card-competence-summary>div{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#f8fafc}
.card-competence-summary span{font-size:12px;color:var(--muted)}
@media(max-width:760px){.card-csv-models{grid-template-columns:1fr}.card-csv-models .btn{width:100%}}

/* =========================================================
   +QGrana 2.0 — M06
   Saldo do mês, DRE simplificada, faturas e semântica de investimentos
   ========================================================= */
.month-balance-head{display:flex;align-items:end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.month-balance-head .competence-filter{margin-bottom:0}
.month-summary-cards{margin-bottom:18px}
.dre-month{margin-top:26px}
.dre-list{display:grid;gap:10px}
.dre-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:13px;padding:13px 14px;box-shadow:0 4px 14px rgba(20,35,70,.04)}
.dre-row>div:first-child{display:grid;gap:3px;min-width:0}
.dre-row small{color:var(--muted)}
.dre-row.income{border-left:4px solid var(--green)}
.dre-row.expense{border-left:4px solid var(--red)}
.dre-row.card-expense{border-left:4px solid var(--orange)}
.dre-row.investment{border-left:4px solid var(--purple)}
.dre-row.neutral{border-left:4px solid var(--primary)}
.dre-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.dre-invoice{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 4px 14px rgba(20,35,70,.04)}
.dre-invoice .dre-row{border:0;border-radius:0;box-shadow:none}
.dre-invoice details{border-top:1px solid var(--line)}
.dre-invoice summary{cursor:pointer;padding:10px 14px;font-weight:800;color:var(--orange)}
.invoice-items{display:grid;border-top:1px solid var(--line)}
.invoice-items>div{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line)}
.invoice-items span{display:grid;gap:2px}.invoice-items a{font-size:12px;font-weight:800;color:var(--primary)}
.invoice-payment-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-items:end;gap:10px;padding:13px 14px;background:#fffaf2;border-top:1px solid var(--line)}
.invoice-payment-form label{font-size:12px;font-weight:800}.invoice-payment-form input,.invoice-payment-form select{width:100%;margin-top:5px;border:1px solid #cfd7e6;border-radius:9px;padding:9px;background:#fff;font:inherit}
.invoice-pending{border-left:4px solid var(--orange)}
.dashboard-pending-list{margin-bottom:22px}
.settings-accent-investment{border-top:4px solid var(--purple);margin-bottom:16px}
.inv-positive{color:var(--green)!important}.inv-negative{color:var(--red)!important}.inv-neutral{color:var(--muted)!important}
.nav a[href*="month_balance"]{border-left:3px solid var(--primary)}
.nav a[href*="recurrences"]{border-left:3px solid var(--gold)}
.nav a[href*="investment_settings"]{border-left:3px solid var(--purple)}
@media(max-width:760px){
 .month-balance-head{display:grid;grid-template-columns:1fr}.month-balance-head>.btn{width:100%}
 .dre-row{grid-template-columns:1fr auto}.dre-actions{grid-column:1/-1;justify-content:stretch}.dre-actions .btn{flex:1}
 .invoice-items>div{grid-template-columns:1fr auto}.invoice-items a{grid-column:1/-1}
 .invoice-payment-form{grid-template-columns:1fr}.invoice-payment-form .btn{width:100%}
}


/* =========================================================
   +QGrana 2.0 — M06.1
   Revisão visual/funcional pós-M06
   ========================================================= */

/* Paleta +QGrana mais evidente no menu lateral */
.nav-group-organizar .nav-group-title{color:var(--green)!important}
.nav-group-planejar .nav-group-title{color:var(--purple)!important}
.nav-group-acompanhar .nav-group-title{color:var(--primary)!important}
.nav-group-administrar .nav-group-title{color:var(--green)!important}
.nav-group-importacoes .nav-group-title{color:var(--orange)!important}
.nav-group-organizar>a{border-left:3px solid var(--green)!important}
.nav-group-planejar>a{border-left:3px solid var(--purple)!important}
.nav-group-acompanhar>a{border-left:3px solid var(--primary)!important}
.nav-group-administrar>a{border-left:3px solid var(--green)!important}
.nav-group-importacoes>a{border-left:3px solid var(--orange)!important}
.nav-group-organizar>a.active{box-shadow:inset 4px 0 0 var(--green)}
.nav-group-planejar>a.active{box-shadow:inset 4px 0 0 var(--purple)}
.nav-group-acompanhar>a.active{box-shadow:inset 4px 0 0 var(--primary)}
.nav-group-administrar>a.active{box-shadow:inset 4px 0 0 var(--green)}
.nav-group-importacoes>a.active{box-shadow:inset 4px 0 0 var(--orange)}

/* Dashboard: Atenção somente quando há item crítico */
.dashboard-attention-title{margin-top:28px}
.dashboard-attention-list .attention-overdue{border-left:4px solid var(--red)}
.dashboard-attention-list .invoice-pending{border-left:4px solid var(--orange)}

/* DRE mais compacta no desktop */
@media(min-width:761px){
  .dre-list{gap:6px}
  .dre-row{padding:9px 12px;border-radius:10px;box-shadow:0 2px 8px rgba(20,35,70,.035)}
  .dre-row>div:first-child{gap:1px}
  .dre-row small{font-size:12px}
  .dre-actions .btn{padding:6px 9px}
  .dre-invoice{border-radius:10px;box-shadow:0 2px 8px rgba(20,35,70,.035)}
}

/* Identidade visual de faturas */
.dre-invoice.invoice-open{border-left:5px solid var(--orange)}
.dre-invoice.invoice-partial{border-left:5px solid var(--gold)}
.dre-invoice.invoice-paid{border-left:5px solid var(--green)}
.dre-invoice.invoice-legacy{border-left:5px solid #98a2b3}
.table tr.invoice-open td:first-child{border-left:4px solid var(--orange)}
.table tr.invoice-partial td:first-child{border-left:4px solid var(--gold)}
.table tr.invoice-paid td:first-child{border-left:4px solid var(--green)}
.table tr.invoice-legacy td:first-child{border-left:4px solid #98a2b3}
.dre-invoice.invoice-open summary{color:var(--orange)}
.dre-invoice.invoice-partial summary{color:#987500}
.dre-invoice.invoice-paid summary{color:#247a68}
.dre-invoice.invoice-legacy summary{color:var(--muted)}

/* Evolução dos investimentos */
.inv-chart-wrap{display:grid;gap:4px}
.inv-line-chart{min-height:250px}
.inv-chart-points circle{fill:var(--primary);stroke:#fff;stroke-width:3}
.inv-line-chart .inv-chart-period{font-size:11px;fill:var(--muted)}
.inv-line-chart .inv-chart-value{font-size:11px;font-weight:800;fill:var(--text)}
.inv-chart-note{text-align:center;margin:0 0 4px}

/* Yield/variações — paleta oficial +QGrana */
.inv-positive{color:#3DC2A1!important}
.inv-negative{color:#CF2250!important}
.inv-neutral{color:var(--muted)!important}
.inv-mini-metrics .inv-positive{background:rgba(61,194,161,.10);border-radius:6px;padding:1px 4px}
.inv-mini-metrics .inv-negative{background:rgba(207,34,80,.08);border-radius:6px;padding:1px 4px}

/* Configurações permanecem dentro do Planejador */
.investment-settings-head{margin-top:6px}
.settings-accent-investment{border-top:4px solid var(--purple);margin-top:14px}


/* =========================================================
   +QGrana 2.0 — M06.3
   Previdência: Contribuição mensal + Aporte extra
   ========================================================= */
.pension-contribution-table .pension-monthly-row td:first-child{border-left:4px solid var(--primary)}
.pension-contribution-table .pension-extra-row td:first-child{border-left:4px solid var(--orange)}
.pension-contribution-table .pension-legacy-row td:first-child{border-left:4px solid #98a2b3}
.pension-contribution-table .pension-extra-row{background:rgba(230,97,24,.035)}
.pension-contribution-table .pension-legacy-row{background:rgba(152,162,179,.06);color:var(--muted)}
.pension-subrow-label{font-weight:800;color:var(--orange)}
.pension-extra-entry{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.pension-extra-history{margin-top:18px}
@media(max-width:760px){
  .pension-contribution-table input[data-pgbl-monthly]{min-width:120px}
}


/* +QGrana 2.0 — M06.4: Previdência operacional */
.pension-summary-cards{margin-bottom:16px}
.pension-extra-disclosure{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.pension-extra-disclosure>summary{list-style:none;display:inline-flex;cursor:pointer}
.pension-extra-disclosure>summary::-webkit-details-marker{display:none}
.pension-extra-disclosure[open]>.pension-extra-trigger{margin-bottom:14px}
.pension-extra-entry{margin-top:0;padding-top:0;border-top:0}
.pension-extra-history{margin-top:14px;border:1px solid var(--line);border-radius:12px;padding:12px}
.pension-extra-history>summary{cursor:pointer;font-weight:700}


/* =========================================================
   +QGrana 2.0 — M06.5 Correções Operacionais
   ========================================================= */
.qg-add-plus{
  color:#3DC2A1;
  font-weight:900;
  font-size:1.25em;
  line-height:.8;
}
.btn.primary .qg-add-plus{color:#fff}
.dashboard-action-card .metric-add .qg-add-plus{color:#3DC2A1}

.disregarded-section{margin-top:22px;border-left:4px solid #98a2b3}
.disregarded-section>summary{cursor:pointer;list-style:none}
.disregarded-section>summary::-webkit-details-marker{display:none}
.dre-row.disregarded{opacity:.58;border-left:4px solid #98a2b3}
.dre-row.disregarded strong,
.dre-row.disregarded small{text-decoration:line-through}
.dre-row.disregarded .btn{text-decoration:none;opacity:1}

.qg-percent-input{font-variant-numeric:tabular-nums}

@media(max-width:760px){
  .loan-contracts-title{
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
  }
  .loan-contracts-title .btn{
    width:100%;
    min-height:48px;
  }
  #loan-contract-form{scroll-margin-top:12px}
}

/* M06.5.1 — formulário de contrato */
.loan-contract-form-card{margin-top:18px;border-top:4px solid var(--primary)}

/* +QGrana 2.0 — M06.5.2: rota dedicada de criação de contrato */
.loan-contract-form-card{display:block!important;visibility:visible!important;opacity:1!important}

/* +QGrana 2.0 — M06.5.3: formulário de empréstimo sempre disponível */
.loan-contract-disclosure{padding:0;overflow:hidden;margin-top:16px}
.loan-contract-form-summary{list-style:none;cursor:pointer;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--card,#fff)}
.loan-contract-form-summary::-webkit-details-marker{display:none}
.loan-contract-form-summary>span:first-child{display:grid;gap:4px}
.loan-contract-form-summary strong{font-size:16px}
.loan-contract-form-summary small{color:var(--muted)}
.loan-contract-chevron{font-size:18px;color:var(--primary);transition:transform .2s ease}
.loan-contract-disclosure[open] .loan-contract-chevron{transform:rotate(180deg)}
.loan-contract-form-body{padding:0 18px 18px;border-top:1px solid var(--line)}
@media(max-width:760px){
  .loan-contract-form-summary{padding:15px}
  .loan-contract-form-body{padding:0 14px 14px}
}


/* =========================================================
   +QGrana 2.0 — M06.5.4
   Formulário de contratos sempre renderizado
   ========================================================= */
.loan-contract-form-card{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  margin-top:18px;
  border-top:4px solid var(--primary);
}
.loan-contract-form-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.loan-contract-form-header>div{display:grid;gap:4px}
.loan-contract-form-header strong{font-size:17px}
.loan-contract-form-header small{color:var(--muted)}
.loan-contract-render-marker{
  margin-top:8px;
  font-size:10px;
  color:var(--muted);
  opacity:.55;
}
.loan-contract-form-card.is-collapsed .loan-contract-form-body{display:none!important}
.loan-contract-form-card.is-open .loan-contract-form-body{display:block!important}
.loan-contract-form-body{margin-top:14px}
.loan-contract-disclosure,
.loan-contract-form-summary,
.loan-contract-chevron{display:initial}

@media(max-width:760px){
  .loan-contract-form-header{display:grid;grid-template-columns:1fr}
  .loan-contract-form-header .btn{width:100%;min-height:46px}
  .loan-contract-form-card{margin-top:12px}
}


/* =========================================================
   +QGrana 2.0 — M06.5.5
   Empréstimos: formulário sempre visível
   ========================================================= */
.loan-contract-form-card{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}
.loan-contract-form-card .loan-contract-form-body{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}
.loan-contract-form-card.is-collapsed .loan-contract-form-body{
  display:block!important;
}
.loan-contract-form-header{
  margin-bottom:12px;
}
.loan-contract-toggle,
.loan-contract-render-marker{
  display:none!important;
}
#loan-contract-form{
  scroll-margin-top:16px;
}


/* +QGrana 2.0 — M06.5.7 — exclusão de contrato */
.loan-contract-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.loan-contract-actions form{display:inline-flex}
@media(max-width:760px){
  .loan-contract-actions{display:grid;grid-template-columns:1fr;width:100%}
  .loan-contract-actions a,
  .loan-contract-actions form,
  .loan-contract-actions button{width:100%}
}


/* =========================================================
   +QGrana 2.0 — M06.6.0 — linguagem visual de adição
   ========================================================= */
.qg-add-plus{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#3DC2A1!important;
  font-weight:950;
  font-size:1.2em;
  line-height:1;
  margin-right:2px;
}
.btn .qg-add-plus,
.btn.primary .qg-add-plus,
summary .qg-add-plus{color:#3DC2A1!important}
.qg-add-action{display:inline-flex;align-items:center;gap:5px}
.transaction-row-disregarded,
.transaction-mobile-card.transaction-disregarded{
  opacity:.58;
}
.transaction-row-disregarded td:not(:last-child),
.transaction-mobile-card.transaction-disregarded .tx-card-head,
.transaction-mobile-card.transaction-disregarded .tx-card-meta{
  text-decoration:line-through;
}


/* +QGrana 2.0 — M06.6.1 — cartão parcelado */
.card-installment-options{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(180px,.35fr);
  gap:14px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f8fafc;
}
.card-installment-options[hidden]{display:none!important}
.card-installment-toggle{display:grid;gap:6px}
.card-installment-toggle>span{display:flex;gap:8px;align-items:center}
#card-installment-preview{grid-column:1/-1}
@media(max-width:620px){.card-installment-options{grid-template-columns:1fr}}


/* +QGrana 2.0 — M06.6.2 — desconsiderado em cartão */
.invoice-item.is-disregarded,
.card-invoice-item.is-disregarded{
  opacity:.55;
}
.invoice-item.is-disregarded .description-cell,
.invoice-item.is-disregarded strong,
.invoice-item.is-disregarded small,
.invoice-item.is-disregarded .invoice-item-main,
.card-invoice-item.is-disregarded{
  text-decoration:line-through;
}
.invoice-item.is-disregarded .btn,
.invoice-item.is-disregarded .badge{
  text-decoration:none!important;
  opacity:1;
}


/* +QGrana 2.0 — M06.6.2.1 — tachado efetivo de item desconsiderado na fatura */
.invoice-items .invoice-item.is-disregarded{
  opacity:.52;
}
.invoice-items .invoice-item.is-disregarded .invoice-item-main,
.invoice-items .invoice-item.is-disregarded .invoice-item-value{
  text-decoration-line:line-through;
  text-decoration-thickness:2px;
}
.invoice-items .invoice-item.is-disregarded a,
.invoice-items .invoice-item.is-disregarded .badge{
  text-decoration:none!important;
  opacity:1;
}


/* +QGrana 2.0 — M06.6.3 — Desconsiderado também na seção de origem */
.dre-row.origin-disregarded{
  opacity:.56;
}
.dre-row.origin-disregarded > div:first-child strong,
.dre-row.origin-disregarded > div:first-child small,
.dre-row.origin-disregarded > strong{
  text-decoration-line:line-through;
  text-decoration-thickness:2px;
}
.dre-row.origin-disregarded .dre-actions,
.dre-row.origin-disregarded .dre-actions *,
.dre-row.origin-disregarded .badge,
.dre-row.origin-disregarded .btn{
  text-decoration:none!important;
  opacity:1;
}


/* +QGrana 2.0 — M06.6.4 — Outras fontes de pagamento */
.other-payment-source-box{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:#f8fafc;
}
.other-payment-source-toggle{display:grid;gap:5px}
.other-payment-source-toggle>span{display:flex;align-items:center;gap:8px;font-weight:700}
.other-payment-source-fields{margin-top:12px}
.other-payment-source-fields[hidden]{display:none!important}
.other-source-badge{
  background:var(--qg-surface-elevated,var(--qg-light-bg,#F5F7FB));
  border:1px solid var(--qg-border,var(--qg-light-line,#E4E9F2));
  color:var(--qg-text,var(--qg-light-text,#172033));
}
.block-note{display:block;margin-top:3px;color:var(--muted);font-size:12px}


/* +QGrana 2.0 — M06.6.5 — detalhe exclusivo da fatura */
.invoice-detail-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:18px
}
.invoice-detail-head h1{margin:5px 0 4px}
.invoice-detail-head p{margin:0;color:var(--muted)}
.invoice-back-link{font-size:13px;color:var(--muted);text-decoration:none}
.invoice-detail-metrics{margin-bottom:18px}
.invoice-detail-card{margin-top:12px}
.invoice-detail-list{display:grid;gap:8px}
.invoice-detail-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:14px;
  padding:12px 0;
  border-bottom:1px solid var(--line)
}
.invoice-detail-item:last-child{border-bottom:0}
.invoice-detail-main{display:grid;gap:4px;min-width:0}
.invoice-detail-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.invoice-detail-main small{color:var(--muted)}
.invoice-detail-value{white-space:nowrap}
.invoice-detail-item.is-disregarded{opacity:.55}
.invoice-detail-item.is-disregarded .invoice-detail-main,
.invoice-detail-item.is-disregarded .invoice-detail-value{text-decoration:line-through}
.invoice-detail-item.is-disregarded .badge,
.invoice-detail-item.is-disregarded .btn{text-decoration:none!important;opacity:1}
.invoice-payment-card{margin-top:18px}
.invoice-payment-summary{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:12px}
.dre-invoice .card-expense{grid-template-columns:minmax(0,1fr) auto auto;align-items:center}

@media(max-width:760px){
 .invoice-detail-head{display:grid;align-items:stretch}
 .invoice-detail-head .btn{width:100%}
 .invoice-detail-item{grid-template-columns:1fr auto}
 .invoice-detail-item .btn{grid-column:1/-1;width:100%}
 .invoice-detail-value{align-self:start}
 .dre-invoice .card-expense{grid-template-columns:1fr}
 .dre-invoice .card-expense>.btn{width:100%}
}


/* +QGrana 2.0 — M06.7.0 — Central de Rendimentos */
.inv-income-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:12px;align-items:end;margin-bottom:16px}
.inv-income-entry{margin-bottom:16px}
.inv-tax-box{border:1px solid var(--line);border-radius:14px;padding:14px;background:#f8fafc}
.inv-tax-box .section-title{margin-bottom:10px}
.inv-income-summary{margin:16px 0}
.inv-income-chart{margin:16px 0}
.inv-month-bars{height:250px;display:grid;grid-template-columns:repeat(12,minmax(28px,1fr));gap:8px;align-items:end;padding-top:24px;overflow-x:auto}
.inv-month-bar{height:210px;min-width:34px;display:grid;grid-template-rows:32px 1fr 24px;gap:4px;align-items:end;text-align:center}
.inv-month-bar-value{font-size:10px;white-space:nowrap;transform:rotate(-45deg);transform-origin:center;overflow:visible}
.inv-month-bar-track{height:145px;display:flex;align-items:flex-end;justify-content:center;border-bottom:1px solid var(--line)}
.inv-month-bar-track span{display:block;width:70%;min-height:2px;background:currentColor;border-radius:6px 6px 0 0;opacity:.75}
.inv-month-bar small{font-size:11px;color:var(--muted)}
.inv-income-dates{border:1px solid var(--line);border-radius:10px;padding:12px 14px}
@media(max-width:900px){.inv-income-filters{grid-template-columns:1fr 1fr}.inv-income-filters .btn{grid-column:1/-1}}
@media(max-width:620px){.inv-income-filters{grid-template-columns:1fr}.inv-income-filters .btn{grid-column:auto}.inv-month-bars{grid-template-columns:repeat(12,48px)}}


/* +QGrana 2.0 — M06.7.1 — Rendimentos multimoeda / gráfico */
.inv-income-filters select[name="income_year"]{min-width:112px}
.inv-income-currency-box{border:1px solid var(--line);border-radius:14px;padding:14px;background:#fbfcfe}
.inv-month-bars{height:310px;grid-template-columns:repeat(12,minmax(54px,1fr));gap:10px;padding:34px 4px 0}
.inv-month-bar{height:250px;min-width:54px;grid-template-rows:48px 1fr 30px;gap:6px}
.inv-month-bar-value{font-size:13px;font-weight:700;line-height:1.15;transform:none;display:flex;align-items:flex-end;justify-content:center;white-space:nowrap}
.inv-month-bar-track{height:165px}
.inv-month-bar-track span{width:68%;opacity:.92}
.inv-month-bar small{font-size:13px;font-weight:700}
.inv-fx-current{margin:14px 0}
.inv-fx-current .metric span{font-size:12px;color:var(--muted);margin-top:4px}
.inv-fx-manual{border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.inv-fx-manual summary{cursor:pointer;font-weight:700}
@media(max-width:900px){.inv-month-bars{grid-template-columns:repeat(12,64px)}}
@media(max-width:620px){.inv-month-bars{grid-template-columns:repeat(12,68px);height:300px}.inv-month-bar{min-width:68px}.inv-month-bar-value{font-size:12px}.inv-month-bar small{font-size:13px}}


/* +QGrana 2.0 — M06.8.0 — identidade visual de efetivação */
.qg-operation-heading{display:flex;align-items:center;gap:9px}
.qg-operation-heading img{width:28px;height:28px;object-fit:contain}
.qg-operation-status{
  --op:#3995CF;
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:30px;padding:5px 10px;border:1.5px solid var(--op);
  border-radius:9px;font-size:12px;font-weight:750;line-height:1;
  white-space:nowrap;background:#fff;color:var(--op)
}
.qg-operation-status img{width:20px;height:20px;object-fit:contain}
.qg-operation-status.expense,.qg-confirm-action.expense{--op:#E66118}
.qg-operation-status.revenue,.qg-confirm-action.revenue{--op:#238e70}
.qg-operation-status.investment,.qg-confirm-action.investment{--op:#8A50CF}
.qg-operation-status.transfer,.qg-confirm-action.transfer{--op:#3995CF}
.qg-operation-status.is-pending{background:color-mix(in srgb,var(--op) 5%,#fff);border-color:color-mix(in srgb,var(--op) 78%,#fff)}
.qg-operation-status.is-confirmed{background:var(--op);color:#fff;border-color:var(--op);box-shadow:0 5px 14px color-mix(in srgb,var(--op) 18%,transparent)}
.qg-operation-status.is-confirmed img{filter:brightness(0) invert(1)}
.qg-confirm-action{
  --op:#3995CF;
  appearance:none;text-decoration:none;border:0;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:34px;padding:7px 13px;border-radius:9px;
  background:var(--op);color:#fff;font:inherit;font-size:13px;font-weight:800;
  cursor:pointer;box-shadow:0 5px 14px color-mix(in srgb,var(--op) 18%,transparent);
  transition:transform .15s ease,box-shadow .15s ease
}
.qg-confirm-action:hover{transform:translateY(-1px);box-shadow:0 7px 17px color-mix(in srgb,var(--op) 25%,transparent)}
.qg-confirm-action.full{width:100%}
.qg-confirm-mark{width:15px;height:15px;border:2px solid currentColor;border-radius:50%;display:inline-block}
.qg-confirm-check{font-size:18px;line-height:1}
.dre-actions{align-items:center;flex-wrap:wrap}

@media(max-width:760px){
  .dre-row{position:relative}
  .qg-operation-heading img{width:32px;height:32px}
  .qg-operation-status{
    min-height:42px;padding:7px 12px;border-radius:11px;
    font-size:14px;box-shadow:0 7px 16px rgba(18,38,63,.08)
  }
  .qg-operation-status img{width:30px;height:30px}
  .qg-confirm-action{
    min-height:46px;padding:10px 15px;border-radius:11px;font-size:15px
  }
  .dre-actions .qg-confirm-action{flex:1 1 100%}
  .dre-actions .qg-operation-status{order:-1}
}


/* +QGrana 2.0 — M06.8.1 — ajustes operacionais do Saldo do mês e Lançamentos */
.inline-form{display:inline}
.qg-identity-strip{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0 2px}
.qg-identity-strip .qg-operation-status{opacity:.72;transition:transform .15s ease,opacity .15s ease,box-shadow .15s ease}
.qg-identity-strip .qg-operation-status.is-focus{opacity:1;transform:translateY(-1px);box-shadow:0 7px 17px rgba(18,38,63,.10)}
.transaction-realized-control{align-items:center;gap:14px}
.transaction-realized-control > div{display:flex;flex-direction:column;gap:2px}
.transaction-realized-control > div strong{font-size:16px}
.transaction-realized-control > div small{font-size:12px;color:#5f6f86}
.card-expense .dre-actions,.investment .dre-actions{justify-content:flex-end}
@media(max-width:760px){
  .qg-identity-strip{gap:8px}
  .qg-identity-strip .qg-operation-status{flex:1 1 calc(50% - 8px)}
  .inline-form{display:block;width:100%}
}


/* +QGrana 2.0 — M06.8.2 — identidade consolidada e biblioteca de figuras */
.qg-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.qg-field-label{font-size:12px;font-weight:800;color:#263c59;margin-bottom:7px;display:block}
.qg-type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.qg-type-card{border:1.5px solid #d8dfeb;background:#fff;border-radius:12px;padding:13px 9px;display:flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:800;color:#243447;cursor:pointer;transition:.15s ease}
.qg-type-card img{width:32px;height:32px}
.qg-type-card:hover{transform:translateY(-1px);box-shadow:0 7px 16px rgba(18,38,63,.08)}
.qg-type-card.despesa.is-selected{border-color:#E66118;background:#fff6f1;color:#c34f10}
.qg-type-card.receita.is-selected{border-color:#3DC2A1;background:#effbf7;color:#238e70}
.qg-type-card.investimento.is-selected{border-color:#8A50CF;background:#f7f2fc;color:#6840a8}
.qg-type-card.transferencia.is-selected{border-color:#3995CF;background:#f1f8fd;color:#1f72aa}
.qg-context-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:12px;background:#f7f9fc;border:1px solid #e0e6ef}
.qg-context-status small{color:#5f6f86}
.qg-realized-panel{display:flex!important;justify-content:space-between;padding:13px 15px;border:1px solid #dce3ed;border-radius:12px;background:#fbfcfe}
.qg-realized-copy{display:flex;align-items:center;gap:10px}.qg-realized-copy>img{width:34px;height:34px}.qg-realized-copy>div{display:flex;flex-direction:column;gap:2px}
.qg-row-main{display:flex;align-items:center;gap:10px;min-width:0}.qg-row-main>div{min-width:0}.qg-row-icon{flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:#f6f8fb;display:grid;place-items:center}.qg-row-icon img{width:26px;height:26px}.qg-row-icon.investment{background:#f7f2fc}
.qg-icon-preview{display:flex;align-items:center;gap:10px;min-height:56px;border:1px dashed #cdd6e4;border-radius:10px;padding:8px 12px;background:#fafbfd}.qg-icon-preview img{width:38px;height:38px}.qg-icon-preview span{font-size:12px;color:#5f6f86}
.qg-list-icon{width:30px;height:30px;object-fit:contain}.qg-settings-title-with-icon{display:flex;align-items:center;gap:10px}.qg-settings-title-with-icon>div{display:flex;flex-direction:column;gap:4px}
@media(max-width:760px){.qg-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.qg-type-card{min-height:62px}.qg-row-icon{width:40px;height:40px}.qg-row-icon img{width:30px;height:30px}.qg-realized-panel{align-items:center}}


/* +QGrana 2.0 — M06.8.3 — pagamento parcial / dívida de cartão */
.qg-operation-status.is-partial{--op:#E6B624;background:#fff9e6;color:#8a6700;border-color:#E6B624}
.invoice-partial-help{margin-top:10px;padding:10px 12px;border-radius:10px;background:#fff8e8;border:1px solid #f2dfaa;font-size:12px}
.card-payment-history,.card-debt-card{margin-top:18px}
.card-payment-list{display:grid;gap:8px}
.card-payment-row{padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.card-payment-row strong{display:block}.card-payment-row small{display:block;color:var(--muted);margin-top:3px}
.card-debt-note,.card-debt-summary{padding:14px;border:1px solid var(--line);border-radius:12px;background:#fff}
.card-debt-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}
.card-debt-summary small,.card-debt-summary strong{display:block}
.card-debt-summary small{color:var(--muted);margin-bottom:4px}
.card-debt-create{margin-top:8px;border:1px solid #ead8c7;border-radius:12px;padding:12px;background:#fffaf5}
.card-debt-create summary{cursor:pointer}
@media(max-width:760px){.card-debt-summary{grid-template-columns:1fr 1fr}.invoice-payment-form{grid-template-columns:1fr}}


/* +QGrana 2.0 — M06.8.4 — refinamento gráfico de ações */
.btn.ghost{background:transparent;border:1px solid #d7deea;color:#53647a;box-shadow:none}
.btn.ghost:hover{background:#f7f9fc;color:#243447}
.qg-confirm-action.compact{min-height:34px;padding:7px 11px;font-size:12px}
.qg-attention-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 14px;background:#fff}
.qg-attention-main{display:flex;align-items:center;gap:11px;min-width:0}
.qg-attention-main>div{display:grid;gap:3px;min-width:0}
.qg-attention-icon{flex:0 0 auto;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:#f7f9fc;border:1px solid #e7ebf2}
.qg-attention-icon img{width:30px;height:30px}
.qg-attention-card.expense .qg-attention-icon{background:#fff6f1;border-color:#f5d9c9}
.qg-attention-card.revenue .qg-attention-icon{background:#effbf7;border-color:#ccefe2}
.qg-attention-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}

.qg-type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.qg-type-card{min-height:96px;justify-content:flex-start;text-align:left;padding:13px 14px;border-radius:14px;gap:11px;position:relative;overflow:hidden}
.qg-type-card::after{content:"";position:absolute;inset:auto 0 0;height:3px;background:transparent}
.qg-type-card.receita::after{background:#3DC2A1}
.qg-type-card.despesa::after{background:#E66118}
.qg-type-card.investimento::after{background:#8A50CF}
.qg-type-card.transferencia::after{background:#3995CF}
.qg-type-icon{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:#f8fafc;flex:0 0 auto}
.qg-type-icon img{width:37px!important;height:37px!important}
.qg-type-copy{display:flex;min-width:0;flex-direction:column;gap:3px}
.qg-type-copy strong{font-size:14px;line-height:1.1}
.qg-type-copy small{font-size:11px;font-weight:500;color:#65758b}
.qg-type-copy em{margin-top:3px;font-size:10px;font-style:normal;text-transform:uppercase;letter-spacing:.04em;font-weight:800;color:#708096}
.qg-type-card.receita.is-selected .qg-type-icon{background:#dcf7ed}
.qg-type-card.despesa.is-selected .qg-type-icon{background:#fff0e7}
.qg-type-card.investimento.is-selected .qg-type-icon{background:#efe5fa}
.qg-type-card.transferencia.is-selected .qg-type-icon{background:#e5f3fb}
.qg-type-card.is-selected{box-shadow:0 8px 20px rgba(18,38,63,.10)}
.qg-context-status{padding:12px 14px;background:#fff;box-shadow:0 4px 12px rgba(18,38,63,.04)}
.qg-context-status.revenue{border-left:4px solid #3DC2A1}
.qg-context-status.expense{border-left:4px solid #E66118}
.qg-context-status.investment{border-left:4px solid #8A50CF}
.qg-context-status.transfer{border-left:4px solid #3995CF}
.qg-save-transaction{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.qg-save-icon{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.20);font-size:12px}
.qg-metric-operation{display:inline-flex!important;align-items:center;gap:4px}
.qg-metric-operation img{width:17px;height:17px}

@media(max-width:900px){.qg-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .qg-attention-card{align-items:flex-start;flex-direction:column}
  .qg-attention-actions{width:100%;justify-content:stretch}
  .qg-attention-actions .qg-operation-status{flex:0 0 auto}
  .qg-attention-actions .qg-confirm-action{flex:1}
  .qg-type-card{min-height:104px;padding:13px 11px;align-items:center}
  .qg-type-icon{width:48px;height:48px}
}
@media(max-width:420px){
  .qg-type-grid{grid-template-columns:1fr 1fr;gap:8px}
  .qg-type-card{min-height:96px;flex-direction:column;text-align:center;justify-content:center}
  .qg-type-copy small{display:none}
}

/* +QGrana 2.0 — M06.8.6 — usabilidade operacional */
.realization-history{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.realization-history h3{margin:0 0 10px}
.realization-history-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.realization-history-row strong,.realization-history-row small{display:block}
.realization-history-row small{color:var(--muted);margin-top:2px}
.qg-partial-action{white-space:nowrap}
.qg-delete-compact{opacity:.82}
.loan-contract-form-card{margin-top:22px}
@media(max-width:760px){.realization-history-row{align-items:flex-start}.qg-partial-action{width:100%;justify-content:center}}

/* +QGrana 2.0 — M06.8.7 — confirmação rápida e edição de realizações */
.realization-history-row .inline-actions{display:flex;gap:6px;align-items:center}
.inline-form .qg-confirm-action{border:0;cursor:pointer}
@media(max-width:760px){.realization-history-row .inline-actions{flex-wrap:wrap;justify-content:flex-end}}

.qg-partial-action + .inline-form{display:inline-flex}


/* +QGrana 2.0 — M06.8.8 — Desembolsos/Recebimentos como subfunção inline */
.qg-realizations-action{
  border-style:dashed;background:#fff;font-weight:700;
}
.inline-realization-panel{
  margin:-2px 12px 12px;
  padding:16px;
  border:1px solid #dde5ef;
  border-top:0;
  border-radius:0 0 14px 14px;
  background:#fbfcfe;
  box-shadow:0 8px 18px rgba(18,38,63,.05);
}
.inline-realization-panel.expense{border-left:4px solid #E66118}
.inline-realization-panel.revenue{border-left:4px solid #3DC2A1}
.inline-realization-header{
  display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
}
.inline-realization-header h3{margin:2px 0 3px}
.inline-realization-header p{margin:0;color:var(--muted);font-size:12px}
.realization-summary.inline{
  margin:14px 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px
}
.realization-summary.inline>div{
  padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff
}
.inline-realization-new{
  border:1px solid var(--line);border-radius:11px;background:#fff;padding:10px 12px;margin-top:10px
}
.inline-realization-new>summary{cursor:pointer;font-weight:800}
.realization-form.inline{margin-top:12px}
.inline-realization-form-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.inline-realization-history-title{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px
}
.inline-realization-history-title h4{margin:0}
.inline-realization-history-title span{font-size:11px;color:var(--muted)}
.empty-state.compact{padding:12px;min-height:auto}
.dre-row:has(+ .inline-realization-panel){border-radius:12px 12px 0 0}
@media(max-width:760px){
 .inline-realization-panel{margin:-2px 0 12px;padding:12px}
 .inline-realization-header{flex-direction:column}
 .realization-summary.inline{grid-template-columns:1fr 1fr 1fr}
 .inline-realization-form-actions>*{width:100%;justify-content:center}
}
@media(max-width:460px){
 .realization-summary.inline{grid-template-columns:1fr}
 .qg-realizations-action{flex:1;justify-content:center}
}


/* +QGrana 2.0 — M06.8.9R — identidade lateral por grupo */
.nav-group-organizar .nav-group-title{color:#3DC2A1}
.nav-group-planejar .nav-group-title{color:#8A50CF}
.nav-group-acompanhar .nav-group-title{color:#3995CF}

.nav-group-organizar>a{border-left-color:#3DC2A1}
.nav-group-planejar>a{border-left-color:#8A50CF}
.nav-group-acompanhar>a{border-left-color:#3995CF}

.nav-group-organizar>a.active{box-shadow:inset 3px 0 0 #3DC2A1}
.nav-group-planejar>a.active{box-shadow:inset 3px 0 0 #8A50CF}
.nav-group-acompanhar>a.active{box-shadow:inset 3px 0 0 #3995CF}


/* +QGrana 2.0 — M06.8.9R2 — atalhos contextuais e empréstimos */
.nav-group-acompanhar .nav-group-title{color:#E66118}
.nav-group-acompanhar>a{border-left-color:#E66118}
.nav-group-acompanhar>a.active{box-shadow:inset 3px 0 0 #E66118}

.qg-context-action,
.qg-tool-link{
  display:inline-flex;align-items:center;justify-content:center;
  padding:6px 9px;border-radius:8px;text-decoration:none;
  font-size:11px;font-weight:800;border:1px solid transparent;
  white-space:nowrap;
}
.qg-context-action.expense,.qg-tool-link.expense{
  color:#b44d16;background:#fff4ec;border-color:#f4cfbb
}
.qg-context-action.investment{
  color:#6f3aa7;background:#f5effc;border-color:#dfcdf3
}
.qg-tool-link.balance{
  color:#2578a8;background:#eef8fd;border-color:#c9e8f7
}
.qg-tool-link.loan{
  color:#b34e15;background:#fff2e9;border-color:#f2c7ad
}
.qg-tool-link.recurrence{
  color:#5a6575;background:#f4f6f9;border-color:#dce2e9
}
.qg-tool-link.settings{
  color:#2578a8;background:#eef8fd;border-color:#c9e8f7
}
.qg-tool-link.import{
  color:#b44d16;background:#fff4ec;border-color:#f4cfbb
}

.dashboard-context-tools,
.transactions-context-tools{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:0 0 18px;padding:10px 12px;
  background:#fff;border:1px solid var(--line);border-radius:12px
}
.dashboard-context-label{
  font-size:11px;font-weight:900;color:var(--muted);
  text-transform:uppercase;letter-spacing:.04em;margin-right:4px
}
.transactions-context-tools{
  justify-content:space-between
}
.transactions-context-copy{
  display:grid;gap:2px
}
.transactions-context-copy span{
  font-size:11px;color:var(--muted)
}
.transactions-context-actions{
  display:flex;gap:7px;flex-wrap:wrap
}

@media(max-width:760px){
 .dashboard-context-tools{align-items:flex-start}
 .qg-tool-link{flex:1}
 .transactions-context-tools{align-items:flex-start;flex-direction:column}
 .transactions-context-actions{width:100%}
 .transactions-context-actions .qg-tool-link{flex:1}
 .qg-attention-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
 .qg-attention-actions>*{width:100%;justify-content:center}
}


/* +QGrana 2.0 — M06.9.1 — Ferramentas e importações por contexto */
.nav-group-organizar>a[href*="page=tools"]{
  border-left-color:#3DC2A1;
}
.nav-group-organizar>a[href*="page=tools"].active{
  box-shadow:inset 3px 0 0 #3DC2A1;
  background:rgba(61,194,161,.12);
}
.module-header-actions{
  display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap
}
.qg-import-action{
  display:inline-flex;align-items:center;gap:7px;font-weight:800;
  border:1px solid transparent;box-shadow:none
}
.qg-import-action.spreadsheet{
  background:#fff7e8;border-color:#edd293;color:#8a6906
}
.qg-import-action.card-import{
  background:#fff1e8;border-color:#f1c5aa;color:#ad4a13
}
.qg-import-action:hover{filter:brightness(.98)}
.tools-intro{align-items:flex-start}
.tools-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px
}
.tool-card{
  display:flex;align-items:center;gap:14px;min-height:96px;padding:16px;
  text-decoration:none;background:#fff;border:1px solid var(--line);
  border-radius:14px;box-shadow:0 6px 14px rgba(18,38,63,.04);
  transition:transform .15s ease,box-shadow .15s ease
}
.tool-card:hover{transform:translateY(-1px);box-shadow:0 9px 20px rgba(18,38,63,.07)}
.tool-card-icon{
  width:48px;height:48px;border-radius:13px;display:grid;place-items:center;flex:0 0 auto
}
.tool-card-icon img{width:36px;height:36px}
.tool-symbol{font-size:24px;font-weight:900}
.tool-card-copy{display:grid;gap:4px}
.tool-card-copy strong{font-size:14px;color:#17263a}
.tool-card-copy small{font-size:11px;color:var(--muted);line-height:1.4}
.tool-card.expense{border-left:4px solid #E66118}
.tool-card.expense .tool-card-icon{background:#fff2e9}
.tool-card.recurrence{border-left:4px solid #3DC2A1}
.tool-card.recurrence .tool-card-icon{background:#eaf9f4;color:#23866f}
.tool-card.settings{border-left:4px solid #3995CF}
.tool-card.settings .tool-card-icon{background:#edf7fc;color:#2578a8}
.tool-card.balance{border-left:4px solid #8A50CF}
.tool-card.balance .tool-card-icon{background:#f3ecfb;color:#6d3aa0}

/* ACOMPANHAR / empréstimos mantém identidade laranja definida */
.nav-group-acompanhar .nav-group-title{color:#E66118}
.nav-group-acompanhar>a{border-left-color:#E66118}
.nav-group-acompanhar>a.active{box-shadow:inset 3px 0 0 #E66118}

@media(max-width:760px){
 .module-header-actions{width:100%;justify-content:stretch}
 .module-header-actions .btn{flex:1;justify-content:center}
 .tools-grid{grid-template-columns:1fr}
}


/* +QGrana 2.0 — M06.9.2 — exclusão recorrente assistida */
.qg-recurrence-focus{
  outline:2px solid #E6B624;
  outline-offset:-2px;
  background:rgba(230,182,36,.10)!important;
}
.qg-recurrence-focus-note{
  border-left:4px solid #E6B624;
}
.dre-actions .qg-delete-compact[href*="page=recurrences"]{
  background:#fff4f1;
  border-color:#efc1b8;
  color:#a83d2b;
}


/* +QGrana 2.0 — M06.9.3 — integração Empréstimos ↔ Despesas */
.loan-realization-note{
  margin:10px 0;padding:11px 13px;border-radius:10px;
  background:#fff2e9;border:1px solid #f2c7ad;border-left:4px solid #E66118;
  color:#71320f;font-size:12px;line-height:1.45
}

.loan-bulk-payment-form{display:grid;gap:12px;margin-top:14px}
.loan-bulk-payment-head{display:flex;align-items:end;justify-content:space-between;gap:14px;padding:12px;border-radius:10px;background:#fff7f1;border:1px solid #f2d0bb}
.loan-bulk-payment-head>div{display:grid;gap:3px}.loan-bulk-payment-head small{color:var(--muted);max-width:650px}
.loan-bulk-payment-head label{min-width:190px}
.loan-installment-row{grid-template-columns:34px 60px 110px 130px minmax(145px,1fr) 100px;align-items:center}
.loan-installment-row input[data-money]{max-width:145px}
.loan-installment-row.is-paid{opacity:.68}.loan-installment-check{display:grid;place-items:center}
.qg-loan-bulk-pay{justify-self:end;background:#E66118;color:#fff;border-color:#E66118}
@media(max-width:760px){
 .loan-bulk-payment-head{align-items:stretch;flex-direction:column}
 .loan-bulk-payment-head label{min-width:0}
 .loan-installment-row{grid-template-columns:28px 52px 1fr;gap:7px}
 .loan-installment-row>*:nth-child(4),.loan-installment-row>*:nth-child(5),.loan-installment-row>*:nth-child(6){grid-column:2/-1}
 .loan-installment-row input[data-money]{max-width:none;width:100%}
 .qg-loan-bulk-pay{width:100%;justify-content:center}
}


/* +QGrana 2.0 — M06.9.4 — refinamento visual da quitação antecipada */
.loan-bulk-payment-form{
  margin-top:16px;
  padding:0;
  border:1px solid #f0d5c4;
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 6px 16px rgba(18,38,63,.04);
}

.loan-bulk-payment-head{
  margin:0;
  padding:16px 18px;
  border:0;
  border-bottom:1px solid #f0d5c4;
  border-radius:0;
  background:#fff6ef;
  align-items:center;
}

.loan-bulk-payment-head>div{
  gap:5px;
}

.loan-bulk-payment-head>div>strong{
  font-size:15px;
  color:#7b3510;
}

.loan-bulk-payment-head small{
  color:#75584a;
  font-size:11px;
  line-height:1.45;
}

.loan-bulk-payment-head label{
  display:grid;
  gap:5px;
  font-size:11px;
  font-weight:800;
  color:#6c3b20;
}

.loan-bulk-payment-head input[type="date"]{
  min-height:38px;
  border:1px solid #efcdb8;
  border-radius:9px;
  background:#fff;
  padding:8px 10px;
}

.loan-installment-list{
  display:grid;
  gap:0;
  padding:0 14px;
  max-height:510px;
  overflow:auto;
  background:#fff;
}

.loan-installment-row{
  min-height:54px;
  padding:10px 8px;
  border-bottom:1px solid #edf0f4;
  grid-template-columns:38px 64px 112px 128px minmax(150px,1fr) 108px;
  gap:10px;
  background:#fff;
}

.loan-installment-row:last-child{
  border-bottom:0;
}

.loan-installment-row:hover{
  background:#fffaf7;
}

.loan-installment-row.is-paid{
  background:#fafbfc;
  opacity:.78;
}

.loan-installment-check{
  display:flex;
  align-items:center;
  justify-content:center;
}

.loan-installment-check input[type="checkbox"]{
  appearance:none;
  width:20px;
  height:20px;
  border:2px solid #d7a284;
  border-radius:6px;
  background:#fff;
  position:relative;
  cursor:pointer;
}

.loan-installment-check input[type="checkbox"]:checked{
  background:#E66118;
  border-color:#E66118;
}

.loan-installment-check input[type="checkbox"]:checked::after{
  content:"✓";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:13px;
  font-weight:900;
}

.loan-installment-row>span:nth-child(2){
  font-weight:800;
  color:#29374a;
}

.loan-installment-row>span:nth-child(3){
  color:#526274;
}

.loan-installment-row>strong{
  color:#17263a;
  font-size:13px;
}

.loan-installment-row input[data-money]{
  width:100%;
  max-width:160px;
  min-height:36px;
  padding:7px 10px;
  border:1px solid #d8dee8;
  border-radius:8px;
  background:#fff;
  font-weight:700;
  color:#17263a;
}

.loan-installment-row input[data-money]:focus{
  outline:none;
  border-color:#E66118;
  box-shadow:0 0 0 3px rgba(230,97,24,.12);
}

.loan-installment-row .badge{
  min-width:88px;
  text-align:center;
  border-radius:999px;
  padding:5px 10px;
  font-size:10px;
  font-weight:800;
}

.loan-installment-row:not(.is-paid) .badge{
  background:#fff1e8;
  color:#b34e15;
  border:1px solid #f1c5aa;
}

.loan-installment-row.is-paid .badge{
  background:#eef3f8;
  color:#5b6877;
  border:1px solid #dfe6ee;
}

.loan-bulk-payment-form>.qg-loan-bulk-pay{
  margin:14px 16px 16px auto;
  min-height:40px;
  padding:9px 16px;
  border-radius:9px;
  background:#E66118;
  border-color:#E66118;
  color:#fff;
  font-weight:900;
  box-shadow:0 5px 12px rgba(230,97,24,.18);
}

.loan-bulk-payment-form>.qg-loan-bulk-pay:hover{
  filter:brightness(.97);
  transform:translateY(-1px);
}

@media(max-width:760px){
  .loan-bulk-payment-form{
    border-radius:12px;
  }
  .loan-bulk-payment-head{
    padding:14px;
  }
  .loan-installment-list{
    padding:0 10px;
    max-height:none;
  }
  .loan-installment-row{
    padding:12px 4px;
    grid-template-columns:32px 54px 1fr;
  }
  .loan-installment-row>*:nth-child(4),
  .loan-installment-row>*:nth-child(5),
  .loan-installment-row>*:nth-child(6){
    grid-column:2/-1;
  }
  .loan-installment-row input[data-money]{
    max-width:none;
  }
  .loan-bulk-payment-form>.qg-loan-bulk-pay{
    width:calc(100% - 24px);
    margin:12px;
    justify-content:center;
  }
}

/* +QGrana 2.0 — M06.9.5 — consignado */
.qg-payroll-loan-note{border-left:4px solid #E66118;background:#fff6ef;color:#71320f}


/* +QGrana 2.0 — M07.0.0 — consolidação de usabilidade */
.qg-negative-balance strong{color:#CF2250!important}
.qg-card-overdue strong,.qg-card-overdue small:last-of-type{color:#CF2250}
.qg-primary-invoice{display:flex;align-items:center;justify-content:space-between;gap:18px;border-left:4px solid #E66118}
.qg-primary-invoice h2{margin:6px 0}
.qg-other-invoices>summary{display:flex;justify-content:space-between;gap:12px;cursor:pointer;align-items:center}
.qg-card-month-config-note{border-left:4px solid #3DC2A1;background:rgba(61,194,161,.09)}
.qg-single-exception-note{border-left:4px solid #3995CF}
.transaction-primary-actions-final{margin-top:4px}
.transaction-more-grid>.transaction-expense-option,
.transaction-more-grid>.transaction-recurring-option,
.other-payment-source-toggle{min-height:52px;display:flex;align-items:center}
.transaction-more-grid{align-items:start}
.inv-tax-box .form-grid{align-items:start}
.qg-month-navigation{display:flex;align-items:end;gap:8px}
.qg-month-step{display:none}
@media(max-width:760px){
  .qg-month-navigation{display:grid;grid-template-columns:auto minmax(135px,1fr) auto;align-items:end;width:100%}
  .qg-month-navigation label{min-width:0}
  .qg-month-step{display:inline-flex;justify-content:center;min-height:44px;border-color:#3995CF;color:#245f88}
  .qg-month-apply{display:none}
  .transaction-more-grid{grid-template-columns:1fr!important}
  .transaction-more-grid>.transaction-expense-option,
  .transaction-more-grid>.transaction-recurring-option,
  .other-payment-source-box{grid-column:1/-1}
  .transaction-primary-actions-final{position:static!important;display:grid!important;grid-template-columns:1fr 1fr;gap:10px}
  .transaction-primary-actions-final .btn{min-height:48px;justify-content:center}
  .qg-primary-invoice{display:block}
  .qg-primary-invoice .inline-actions{margin-top:14px}
  .inv-tax-box .form-grid{grid-template-columns:1fr!important}
}
@media(min-width:761px){
  .transaction-more-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .transaction-more-grid .full{grid-column:1/-1}
}



/* +QGrana 2.0 — M07.0.1 — Rendimentos: filtros sem sobreposição */
.qg-income-filters{
  display:block!important;
  padding:14px 16px!important;
}
.qg-income-filter-row{
  display:grid;
  gap:14px;
  align-items:end;
  width:100%;
}
.qg-income-filter-row-main{
  grid-template-columns:minmax(180px,.75fr) minmax(260px,1.35fr) minmax(180px,.75fr);
}
.qg-income-filter-row-period{
  grid-template-columns:minmax(150px,.7fr) minmax(300px,1.4fr) minmax(140px,.65fr) auto;
  margin-top:14px;
}
.qg-income-filter-row label{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
  margin:0;
}
.qg-income-filter-row .qg-selector{
  width:100%;
  min-width:0;
  max-width:none;
  box-sizing:border-box;
}
.qg-income-month-nav{
  display:grid;
  grid-template-columns:40px minmax(170px,1fr) 40px;
  gap:8px;
  align-items:end;
  min-width:0;
}
.qg-income-month-nav label{min-width:0}
.qg-income-month-step{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:40px;
  min-width:40px;
  height:40px;
  min-height:40px;
  padding:0!important;
  border:1px solid #3995CF!important;
  background:rgba(57,149,207,.08)!important;
  color:#286e9b!important;
  border-radius:10px!important;
  font-size:24px!important;
  line-height:1!important;
  font-weight:700!important;
}
.qg-income-month-step:hover,
.qg-income-month-step:focus{
  background:rgba(57,149,207,.16)!important;
  border-color:#3995CF!important;
  color:#1f5c83!important;
}
.qg-income-apply{
  min-height:40px;
  align-self:end;
}
.inv-income-summary{
  margin-top:14px;
}
@media(max-width:1100px){
  .qg-income-filter-row-main{
    grid-template-columns:1fr 1.35fr 1fr;
  }
  .qg-income-filter-row-period{
    grid-template-columns:1fr 1.5fr 1fr auto;
  }
}
@media(max-width:760px){
  .qg-income-filters{padding:12px!important}
  .qg-income-filter-row-main,
  .qg-income-filter-row-period{
    grid-template-columns:1fr!important;
    gap:12px;
  }
  .qg-income-filter-row-period{margin-top:12px}
  .qg-income-month-nav{
    grid-template-columns:44px minmax(0,1fr) 44px;
    width:100%;
  }
  .qg-income-month-step{
    width:44px;
    min-width:44px;
    height:44px;
    min-height:44px;
    border-radius:12px!important;
  }
  .qg-income-apply{
    width:100%;
    min-height:44px;
  }
}


/* +QGrana 2.0 — M07.0.2 — edição de pagamentos de fatura */
.card-payment-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.card-payment-row .inline-actions{flex:0 0 auto}
.qg-payment-edit-form{
  margin-bottom:14px;
  padding:14px;
  border:1px solid rgba(57,149,207,.28);
  border-radius:12px;
  background:rgba(57,149,207,.05);
}
.qg-future-invoice-warning{
  border-left:4px solid #E6B624;
  background:rgba(230,182,36,.10);
  margin-bottom:12px;
}
@media(max-width:760px){
  .card-payment-row{
    align-items:flex-start;
    flex-direction:column;
  }
  .card-payment-row .inline-actions{
    width:100%;
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .card-payment-row .inline-actions .btn,
  .card-payment-row .inline-actions form,
  .card-payment-row .inline-actions form .btn{width:100%}
}


/* +QGrana 2.0 — M07.0.3 — origem estrutural de financiamento */
.qg-loan-source-badge{
  border:1px solid rgba(230,97,24,.35);
  background:rgba(230,97,24,.10);
  color:#9a430f;
}
.qg-loan-manage-action{
  border-color:rgba(230,97,24,.45)!important;
  color:#9a430f!important;
}


/* +QGrana M07.1.1 — seletor visual de 100 ícones */
.qg-category-icon-picker{display:block}
.qg-icon-picker-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.qg-icon-picker-head>span{font-size:13px;color:var(--muted,#667085)}
.qg-icon-quick{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.qg-icon-choice{width:58px;height:58px;padding:7px;border:1px solid #d8dee8;border-radius:14px;background:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:.15s ease}
.qg-icon-choice img{width:42px;height:42px;display:block}
.qg-icon-choice:hover,.qg-icon-choice.is-selected{border-color:#3995CF;box-shadow:0 0 0 3px rgba(57,149,207,.12)}
.qg-more-icons{display:inline-block;position:relative}
.qg-more-icons>summary{min-height:58px;padding:0 15px;border:1px dashed #3995CF;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#266f9e;font-weight:700;cursor:pointer;list-style:none;background:#f7fbfe}
.qg-more-icons>summary::-webkit-details-marker{display:none}
.qg-icon-gallery-panel{margin-top:12px;padding:14px;border:1px solid #dfe4ec;border-radius:16px;background:#fff;box-shadow:0 12px 30px rgba(36,52,71,.10)}
.qg-icon-search{display:block;margin-bottom:12px;font-weight:600}
.qg-icon-search input{margin-top:6px}
.qg-icon-gallery{display:grid;grid-template-columns:repeat(6,minmax(78px,1fr));gap:10px;max-height:460px;overflow:auto;padding:2px}
.qg-icon-gallery-item{min-height:92px;border:1px solid #e2e7ee;background:#fff;border-radius:14px;padding:8px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;color:#243447}
.qg-icon-gallery-item:hover,.qg-icon-gallery-item.is-selected{border-color:#3995CF;background:#f7fbfe;box-shadow:0 0 0 2px rgba(57,149,207,.10)}
.qg-icon-gallery-item img{width:44px;height:44px;display:block}
.qg-icon-gallery-item span{font-size:12px;line-height:1.15;text-align:center;font-weight:600;word-break:normal}
.qg-category-icon-picker .qg-icon-preview{margin-top:12px}
@media(max-width:900px){
 .qg-icon-gallery{grid-template-columns:repeat(4,minmax(70px,1fr))}
}
@media(max-width:560px){
 .qg-icon-picker-head{align-items:flex-start;flex-direction:column;gap:3px}
 .qg-icon-quick{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
 .qg-icon-choice{width:100%;height:64px}
 .qg-more-icons{grid-column:1/-1;width:100%}
 .qg-more-icons>summary{width:100%}
 .qg-icon-gallery-panel{padding:10px}
 .qg-icon-gallery{grid-template-columns:repeat(3,minmax(72px,1fr));gap:8px;max-height:58vh}
 .qg-icon-gallery-item{min-height:88px;padding:7px 4px}
 .qg-icon-gallery-item img{width:40px;height:40px}
 .qg-icon-gallery-item span{font-size:12px}
}

/* +QGrana M07.1.2 — navegação da galeria de ícones */
.qg-icon-gallery-panel{scroll-margin-top:18px}
@media(max-width:560px){
  .qg-icon-gallery-panel{scroll-margin-top:84px}
}

/* +QGrana M07.2.0 — cartão no Dashboard e figuras por categoria */
.dashboard-action-card.qg-card-dashboard-card{border-top:4px solid #3995CF}
.dashboard-action-card.qg-card-dashboard-card .metric-add{color:#266f9e}
.qg-card-item-category-icon{flex:0 0 auto}
.invoice-detail-item{align-items:center}
@media(max-width:620px){
  .qg-card-item-category-icon{align-self:flex-start}
}

.invoice-detail-item{grid-template-columns:auto minmax(0,1fr) auto auto}
@media(max-width:760px){
  .invoice-detail-item{grid-template-columns:auto minmax(0,1fr) auto}
  .invoice-detail-item .btn{grid-column:2/-1}
}

/* +QGrana M07.2.2 — proteção visual definitiva para compras no cartão */
#transaction-form.qg-card-expense-mode #transaction-realized-control{
  display:none!important;
}


/* +QGrana M07.3.0 — Dashboard: boards mais legíveis e ações padronizadas */
.qg-dashboard-cards-v0730{gap:18px}
.qg-dashboard-cards-v0730 .dashboard-action-card{
  border-width:1px;
  border-style:solid;
  box-shadow:0 8px 22px rgba(23,32,51,.07);
  padding:20px;
}
.qg-dashboard-cards-v0730 .income-card{border-color:rgba(61,194,161,.42);border-top:5px solid #3DC2A1}
.qg-dashboard-cards-v0730 .expense-card{border-color:rgba(207,34,80,.32);border-top:5px solid #CF2250}
.qg-dashboard-cards-v0730 .qg-card-dashboard-card{border-color:rgba(57,149,207,.38);border-top:5px solid #3995CF}
.qg-dashboard-cards-v0730 .investment-card,
.qg-dashboard-cards-v0730 .investment-balance-card{border-color:rgba(138,80,207,.34);border-top:5px solid #8A50CF}
.qg-dashboard-cards-v0730 .balance-card{border-color:rgba(57,149,207,.30);border-top:5px solid #3995CF}
.qg-dashboard-cards-v0730 .total-financial-card{border-color:#d9e0ea;border-top:5px solid #E6B624}

.qg-board-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  width:100%;
  margin-top:14px;
}
.qg-board-actions-single{grid-template-columns:1fr}
.qg-board-link{
  min-height:44px;
  border-radius:11px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:13px;
  font-weight:800;
  line-height:1.1;
  text-align:center;
  border:1px solid transparent;
}
.qg-board-view{justify-content:space-between}
.qg-board-view.revenue{background:rgba(61,194,161,.11);border-color:rgba(61,194,161,.24);color:#237e68}
.qg-board-view.expense{background:rgba(207,34,80,.08);border-color:rgba(207,34,80,.20);color:#a81e45}
.qg-board-view.card,.qg-board-view.balance{background:rgba(57,149,207,.10);border-color:rgba(57,149,207,.22);color:#266f9e}
.qg-board-view.investment{background:rgba(138,80,207,.09);border-color:rgba(138,80,207,.21);color:#6f3eb0}
.qg-board-add{background:#f5f7fb;border-color:#dde4ed;color:#344054}
.qg-board-add.revenue .qg-add-plus{color:#3DC2A1}
.qg-board-add.expense .qg-add-plus{color:#E66118}
.qg-board-add.card .qg-add-plus{color:#3995CF}
.qg-board-add.investment .qg-add-plus{color:#8A50CF}

/* Padronização dos botões nas listas mensais e compras da fatura */
@media(max-width:760px){
  .dre-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px!important;
    width:100%;
  }
  .dre-actions>a,
  .dre-actions>form,
  .dre-actions>form>button,
  .dre-actions>.qg-operation-status{
    width:100%;
    min-height:46px;
  }
  .dre-actions>form{display:block!important}
  .dre-actions>a,
  .dre-actions>form>button,
  .dre-actions>.qg-operation-status{
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:11px!important;
  }
  .invoice-detail-item{
    grid-template-columns:auto minmax(0,1fr) auto!important;
    gap:10px;
    padding:16px 0;
  }
  .invoice-detail-item>.btn,
  .invoice-detail-item>form{
    min-height:46px;
  }
  .invoice-detail-item>.btn{
    grid-column:2/3!important;
    width:100%!important;
    border-radius:11px!important;
  }
  .invoice-detail-item>form{
    grid-column:2/3;
    width:100%;
  }
  .invoice-detail-item>form>button{
    width:100%;
    min-height:46px;
    border-radius:11px!important;
  }
  .qg-dashboard-cards-v0730{grid-template-columns:1fr!important}
  .qg-dashboard-cards-v0730 .dashboard-action-card{padding:18px}
  .qg-board-link{min-height:48px;font-size:14px}
}
@media(max-width:390px){
  .qg-board-actions{grid-template-columns:1fr}
}


/* =========================================================
   +QGrana M07.4.0 — identidade visual validada
   Paleta de 8 referências de cédulas
   ========================================================= */
:root{
  --qg-r1:#3DC2A1;
  --qg-r2:#3995CF;
  --qg-r5:#8A50CF;
  --qg-r10:#CF2250;
  --qg-r20:#E6B624;
  --qg-r50:#E66118;
  --qg-r100:#3DC2A1;
  --qg-r200:#837577;
  --qg-r200-soft:#F4F1F2;
}

/* Cartão de crédito: identidade R$ 200 */
.qg-dashboard-cards-v0730 .qg-card-dashboard-card{
  border-color:rgba(131,117,119,.38)!important;
  border-top-color:var(--qg-r200)!important;
}
.qg-dashboard-cards-v0730 .qg-card-dashboard-card .qg-board-view,
.qg-board-view.card{
  background:var(--qg-r200-soft)!important;
  border-color:rgba(131,117,119,.35)!important;
  color:var(--qg-r200)!important;
}
.card-credit-summary{
  border-color:rgba(131,117,119,.28)!important;
  border-top:4px solid var(--qg-r200)!important;
}
.qg-primary-invoice.qg-credit-r200{
  border:1px solid rgba(131,117,119,.36)!important;
  border-left:5px solid var(--qg-r200)!important;
  background:var(--qg-r200-soft)!important;
}
.qg-card-focus-variation{
  min-width:165px;
  padding-left:16px;
  border-left:1px solid rgba(131,117,119,.26);
}
.qg-card-focus-variation small{display:block;color:var(--muted)}
.qg-card-focus-variation strong{display:block;color:var(--qg-r200);font-size:17px;margin:3px 0}

/* Navegação lateral: somente Cartões e Faturas recebe a identidade R$ 200 */
.nav a.qg-nav-card-credit{
  display:flex;
  align-items:center;
  gap:9px;
}
.qg-nav-card-icon{
  width:20px;
  height:20px;
  flex:0 0 auto;
}
.nav a.qg-nav-card-credit.active{
  background:rgba(131,117,119,.22)!important;
  color:#fff!important;
  box-shadow:inset 4px 0 0 var(--qg-r200);
}

/* Botões dos boards: preserva identidade anterior da ação +, em duas colunas */
.qg-board-actions .metric-add.qg-metric-operation{
  width:100%;
  min-height:44px;
  margin:0;
  border-radius:10px;
}
.qg-board-actions .qg-board-view{
  width:100%;
  min-height:44px;
  border-radius:10px;
}

/* M07.15.2.20 — ação de despesa iniciada no cartão segue o sépia de Cartões/Faturas. */
.qg-board-link.credit-card-action{color:var(--qg-sepia)!important}
.qg-board-link.credit-card-action .qg-add-plus{color:var(--qg-sepia)!important}
.qg-board-link.credit-card-action>span:last-child{color:var(--qg-sepia)!important}
.btn.credit-card-action .qg-add-plus{color:#fff!important}

/* M07.15.2.23 — textos da ação do cartão padronizados com os demais cards. */
.qg-dashboard-cards-v0730 .qg-card-dashboard-card .qg-board-view.card,
.qg-board-link.credit-card-action{color:var(--qg-text)!important}
.qg-board-link.credit-card-action .qg-add-plus,
.btn.credit-card-action .qg-add-plus{color:var(--qg-green)!important}
.qg-board-link.credit-card-action>span:last-child{color:var(--qg-text)!important}

/* Card principal das áreas no Saldo do mês */
.qg-category-primary{
  margin:0 0 12px!important;
  padding:16px 18px;
  border-radius:15px;
  border:1px solid var(--qg-section-soft);
  border-left:5px solid var(--qg-section-accent);
  background:var(--qg-section-tint);
  box-shadow:0 6px 18px rgba(20,35,70,.04);
}
.qg-category-primary.revenue{
  --qg-section-accent:#3DC2A1;
  --qg-section-soft:rgba(61,194,161,.28);
  --qg-section-tint:rgba(61,194,161,.08);
}
.qg-category-primary.expense{
  --qg-section-accent:#CF2250;
  --qg-section-soft:rgba(207,34,80,.25);
  --qg-section-tint:rgba(207,34,80,.07);
}
.qg-category-primary.investment{
  --qg-section-accent:#8A50CF;
  --qg-section-soft:rgba(138,80,207,.25);
  --qg-section-tint:rgba(138,80,207,.08);
}
.qg-category-primary-value{
  min-width:185px;
  text-align:right;
}
.qg-category-primary-value>strong{display:block;font-size:20px}
.qg-category-primary-value small{display:block;color:var(--muted);font-size:12px}
.qg-category-primary-value b{display:block;color:var(--qg-section-accent);font-size:16px;margin:2px 0}

/* Demais lançamentos: fundo branco, lateral e linha fina da própria área */
.qg-category-section .dre-list{
  display:grid;
  gap:12px;
}
.qg-category-section .dre-row{
  background:#fff;
  border-radius:13px;
  border:1px solid var(--line);
  box-shadow:0 3px 12px rgba(20,35,70,.025);
}
.qg-category-section.revenue .dre-row{
  border-left:4px solid #3DC2A1;
  border-bottom-color:rgba(61,194,161,.24);
}
.qg-category-section.expense .dre-row{
  border-left:4px solid #CF2250;
  border-bottom-color:rgba(207,34,80,.20);
}
.qg-category-section.investment .dre-row{
  border-left:4px solid #8A50CF;
  border-bottom-color:rgba(138,80,207,.22);
}

/* Compras na fatura: layout existente, com identidade discreta do módulo */
.invoice-detail-list{
  display:grid;
  gap:12px;
}
.invoice-detail-item{
  background:#fff;
  border:1px solid rgba(131,117,119,.24);
  border-left:4px solid var(--qg-r200);
  border-radius:12px;
  padding:13px 14px;
}
.invoice-detail-head,
.invoice-detail-card,
.invoice-payment-card,
.card-payment-history,
.card-debt-card{
  border-color:rgba(131,117,119,.24);
}
.invoice-back-link{color:var(--qg-r200)}

/* Visão executiva de Investimentos: primeiro card destacado */
.qg-investment-primary{
  border:1px solid rgba(138,80,207,.28)!important;
  border-top:5px solid #8A50CF!important;
  background:rgba(138,80,207,.07)!important;
}
.qg-investment-primary-variation{
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid rgba(138,80,207,.20);
}
.qg-investment-primary-variation small{display:block}
.qg-investment-primary-variation b{display:block;color:#8A50CF;font-size:16px;margin:2px 0}

@media(max-width:760px){
  .qg-category-primary{
    align-items:flex-start!important;
    gap:12px!important;
  }
  .qg-category-primary-value{
    width:100%;
    min-width:0;
    text-align:left;
    padding-top:10px;
    border-top:1px solid var(--qg-section-soft);
  }
  .qg-primary-invoice.qg-credit-r200{
    display:grid;
    gap:12px;
  }
  .qg-card-focus-variation{
    min-width:0;
    padding-left:0;
    padding-top:10px;
    border-left:0;
    border-top:1px solid rgba(131,117,119,.26);
  }
}

/* M07.4.0 — ações estruturais do módulo Cartões e Faturas */
.qg-import-action.card-import{
  background:var(--qg-r200-soft)!important;
  border-color:rgba(131,117,119,.34)!important;
  color:var(--qg-r200)!important;
}
.qg-primary-invoice.qg-credit-r200 .btn.secondary{
  border:1px solid rgba(131,117,119,.35);
  background:#fff;
  color:var(--qg-r200);
}


/* +QGrana M07.4.2 — fechamento robusto da galeria após seleção */
.qg-more-icons.qg-gallery-closed-after-choice:not([open]) .qg-icon-gallery-panel{
  display:none!important;
}
.qg-category-icon-picker [data-icon-return-anchor]{
  scroll-margin-top:84px;
  transition:box-shadow .18s ease,border-color .18s ease,background .18s ease;
}
.qg-category-icon-picker [data-icon-return-anchor].is-updated{
  border-color:#3995CF;
  background:rgba(57,149,207,.06);
  box-shadow:0 0 0 3px rgba(57,149,207,.10);
}

/* +QGrana 2.0 — M07.5.0 | Cadastro simplificado de ativos / Tributação */
.inv-asset-form-body{margin-top:16px}.inv-form-heading{display:flex;flex-direction:column;gap:3px;padding:4px 0 2px}.inv-form-heading strong{font-size:1rem;color:var(--text,#172033)}.inv-form-heading small{color:var(--muted,#697386)}
.inv-tax-identification{background:#f7f1fd;border:1px solid #e2d2f5;border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:14px}.inv-tax-identification.is-pending{background:#fbf8fe;border-style:dashed}.inv-tax-title{display:flex;align-items:center;gap:12px}.inv-tax-title>div{display:flex;flex-direction:column;gap:3px}.inv-tax-title small{color:var(--muted,#697386)}.inv-tax-symbol{width:38px;height:38px;border-radius:12px;background:#8A50CF;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:1.05rem;flex:0 0 auto}.inv-tax-status-line{display:flex}.inv-tax-status-badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;background:#fff;color:#6d35a9;font-size:.82rem;font-weight:700;border:1px solid #decaf4}.inv-tax-identification.is-pending .inv-tax-status-badge{color:#7b5b20;background:#fffaf0;border-color:#ead9ad}.inv-tax-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.inv-tax-grid>div{background:#fff;border:1px solid #eadff7;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:4px}.inv-tax-grid small{color:var(--muted,#697386)}.inv-tax-grid strong{font-size:.92rem;line-height:1.35}.inv-tax-question{border-top:1px solid #e4d4f7;padding-top:12px}.inv-tax-rule-details{border-top:1px solid #e4d4f7;padding-top:10px}.inv-tax-rule-details summary{cursor:pointer;color:#6f39ad;font-weight:700}.inv-tax-rule-details p{margin:10px 0 0;color:var(--muted,#697386);line-height:1.55}.inv-more-options,.inv-how-it-works{border:1px solid var(--line,#e4e9f2);border-radius:12px;padding:12px 14px;background:#fff}.inv-more-options>summary,.inv-how-it-works>summary{cursor:pointer;font-weight:700}.inv-more-options-body{margin-top:14px}.inv-check-label{display:flex!important;align-items:flex-start;gap:10px}.inv-check-label>input{width:auto;margin-top:3px}.inv-check-label>span{display:flex;flex-direction:column;gap:3px}.inv-how-it-works ol{margin:12px 0 0 20px;padding:0;color:var(--muted,#697386);line-height:1.6}
@media(max-width:780px){.inv-tax-grid{grid-template-columns:1fr 1fr}.inv-tax-identification{padding:15px}}@media(max-width:480px){.inv-tax-grid{grid-template-columns:1fr}.inv-tax-title{align-items:flex-start}}

/* +QGrana M07.5.2 — Tributação de Investimentos / Renda Fixa */
.inv-tax-page-head{margin-bottom:14px}.inv-tax-view-tabs{display:flex;gap:8px;align-items:center;margin-bottom:16px}.inv-tax-view-tabs a,.inv-tax-view-tabs span{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:10px;border:1px solid var(--line,#e4e9f2);background:#fff;font-weight:700}.inv-tax-view-tabs a.active{background:#f7f1fd;border-color:#d9c1f0;color:#6f39ad}.inv-tax-view-tabs .disabled{color:var(--muted,#697386);opacity:.7}.inv-tax-notice{border-left:4px solid #8A50CF;background:#fbf8fe}.inv-tax-notice p{margin:6px 0 0;color:var(--muted,#697386);line-height:1.55}.inv-tax-rule-cards,.inv-tax-summary{margin-bottom:18px}.inv-tax-rule-cards .metric strong,.inv-tax-summary .metric strong{color:#6f39ad}.inv-tax-iof-card details summary,.inv-tax-calc-details summary{cursor:pointer;color:#6f39ad;font-weight:700}.inv-tax-calc-details{min-width:110px}.inv-tax-memory{min-width:270px;max-width:420px;padding:8px 0}.inv-tax-memory p{margin:5px 0;line-height:1.45}.inv-tax-history td{vertical-align:top}.inv-tax-history .badge{white-space:nowrap}@media(max-width:780px){.inv-tax-view-tabs{overflow:auto}.inv-tax-view-tabs a,.inv-tax-view-tabs span{white-space:nowrap}.inv-tax-memory{min-width:0;max-width:none}}

/* +QGrana M07.5.3 — Fundos e ETFs / eventos fiscais */
.inv-tax-fund-event-card{border-color:#e4d4f7;background:linear-gradient(180deg,#fff 0%,#fbf8fe 100%)}
.inv-tax-fund-event-card h3{margin-top:0;color:#6f35b4}
.inv-tax-fund-event-card .form-grid{margin-top:14px}
[data-etf-rf-tax-question]{border-top:1px solid var(--line,#e4e9f2);margin-top:12px;padding-top:12px}
@media(max-width:720px){.inv-tax-fund-event-card .form-grid{grid-template-columns:1fr}.inv-tax-fund-event-card .btn.full{width:100%}}


/* =========================================================
   +QGrana 2.0 — M07.6.0
   Padronização visual transversal + Claro / Escuro / Sistema
   Mantém os HEX oficiais consolidados e não altera SVGs.
   ========================================================= */
:root{
  --qg-green:#3DC2A1;
  --qg-blue:#3995CF;
  --qg-purple:#8A50CF;
  --qg-red:#CF2250;
  --qg-gold:#E6B624;
  --qg-orange:#E66118;
  --qg-sepia:#837577;
  --qg-sepia-soft:#F4F1F2;

  --qg-light-bg:#F5F7FB;
  --qg-light-card:#FFFFFF;
  --qg-light-text:#172033;
  --qg-light-muted:#697386;
  --qg-light-line:#E4E9F2;

  --qg-dark-bg:#101828;
  --qg-dark-card:#172033;
  --qg-dark-elevated:#24314B;
  --qg-dark-border:#344054;
  --qg-dark-muted:#98A2B3;
  --qg-dark-soft:#D0D5DD;
  --qg-dark-text:#FFFFFF;

  --qg-bg:var(--qg-light-bg);
  --qg-surface:var(--qg-light-card);
  --qg-surface-elevated:#F8FAFC;
  --qg-text:var(--qg-light-text);
  --qg-muted:var(--qg-light-muted);
  --qg-border:var(--qg-light-line);
  --qg-input-bg:#FFFFFF;
  --qg-soft-text:#475467;
  --qg-shadow:0 8px 28px rgba(20,35,70,.08);

  --qg-revenue:var(--qg-green);
  --qg-transfer:var(--qg-blue);
  --qg-investment:var(--qg-purple);
  --qg-expense:var(--qg-red);
  --qg-loan:var(--qg-orange);
  --qg-credit-card:var(--qg-sepia);
  --qg-total:var(--qg-gold);

  --qg-module-accent:var(--qg-blue);
  --qg-module-accent-rgb:57,149,207;

  /* aliases legados: preservam compatibilidade com o CSS atual */
  --bg:var(--qg-bg);
  --card:var(--qg-surface);
  --text:var(--qg-text);
  --muted:var(--qg-muted);
  --line:var(--qg-border);
  --border:var(--qg-border);
  --primary:var(--qg-blue);
  --purple:var(--qg-purple);
  --red:var(--qg-red);
  --gold:var(--qg-gold);
  --orange:var(--qg-orange);
  --green:var(--qg-green);
  --shadow:var(--qg-shadow);
}

html[data-theme="dark"]{
  --qg-bg:var(--qg-dark-bg);
  --qg-surface:var(--qg-dark-card);
  --qg-surface-elevated:var(--qg-dark-elevated);
  --qg-text:var(--qg-dark-text);
  --qg-muted:var(--qg-dark-muted);
  --qg-border:var(--qg-dark-border);
  --qg-input-bg:var(--qg-dark-elevated);
  --qg-soft-text:var(--qg-dark-soft);
  --qg-shadow:none;
  color-scheme:dark;
}
@media(prefers-color-scheme:dark){
  html[data-theme="system"]{
    --qg-bg:var(--qg-dark-bg);
    --qg-surface:var(--qg-dark-card);
    --qg-surface-elevated:var(--qg-dark-elevated);
    --qg-text:var(--qg-dark-text);
    --qg-muted:var(--qg-dark-muted);
    --qg-border:var(--qg-dark-border);
    --qg-input-bg:var(--qg-dark-elevated);
    --qg-soft-text:var(--qg-dark-soft);
    --qg-shadow:none;
    color-scheme:dark;
  }
}

/* Identidade cromática por área */
body[data-page="dashboard"],body[data-page="transactions"],body[data-page="tools"],body[data-page="settings"],body[data-page="month_balance"],body[data-page="help"],body[data-page="admin"],body[data-page="import_spreadsheet"]{--qg-module-accent:var(--qg-blue);--qg-module-accent-rgb:57,149,207}
body[data-page="cards"],body[data-page="card_invoice"],body[data-page="import_card"]{--qg-module-accent:var(--qg-sepia);--qg-module-accent-rgb:131,117,119}
body[data-page="tracking"],body[data-page="loans"],body[data-page="loan_contract_create"]{--qg-module-accent:var(--qg-orange);--qg-module-accent-rgb:230,97,24}
body[data-page="recurrences"],body[data-page="projections"]{--qg-module-accent:var(--qg-gold);--qg-module-accent-rgb:230,182,36}
body[data-page="goals"],body[data-page="investments"],body[data-page="investment_settings"]{--qg-module-accent:var(--qg-purple);--qg-module-accent-rgb:138,80,207}

/* Superfícies e tipografia */
body{background:var(--qg-bg);color:var(--qg-text)}
.card,.table-wrap,.help-box,.format-box,.review-summary>div,.qg-icon-gallery-panel,.qg-icon-choice,.qg-icon-gallery-item,.inv-more-options,.inv-how-it-works,.inv-tax-view-tabs a,.inv-tax-view-tabs span{background:var(--qg-surface);border-color:var(--qg-border);color:var(--qg-text);box-shadow:var(--qg-shadow)}
.table-wrap{background:var(--qg-surface)!important}
.table th,.table td{border-color:var(--qg-border)}
.form-grid input,.form-grid select,.form-grid textarea,.phone-form input,.help-search,.qg-icon-search input{background:var(--qg-input-bg);color:var(--qg-text);border-color:var(--qg-border)}
.form-grid input::placeholder,.form-grid textarea::placeholder,.help-search::placeholder{color:var(--qg-muted)}
.actions-sticky{background:color-mix(in srgb,var(--qg-surface) 96%,transparent);border-color:var(--qg-border)}
.btn.secondary{background:var(--qg-surface-elevated);color:var(--qg-soft-text);border:1px solid var(--qg-border)}
.btn.primary{background:var(--qg-module-accent);color:#fff}
.tabs a,.import-switch a{background:var(--qg-surface-elevated);color:var(--qg-soft-text);border-color:var(--qg-border)}
.tabs a.active,.import-switch a.active{background:var(--qg-module-accent);border-color:var(--qg-module-accent);color:#fff}
.eyebrow{color:var(--qg-module-accent)}
.badge{background:var(--qg-surface-elevated);color:var(--qg-soft-text)}
.help-content,.muted-copy,.section-subtitle,.inv-form-heading small,.inv-tax-title small,.inv-tax-grid small,.inv-tax-rule-details p,.inv-how-it-works ol{color:var(--qg-muted)}

/* Ações e cartões principais do módulo */
.admin-accent{border-top-color:var(--qg-module-accent)}
body[data-page="tracking"] .card:first-of-type,
body[data-page="recurrences"] .card:first-of-type,
body[data-page="projections"] .card:first-of-type,
body[data-page="goals"] .card:first-of-type,
body[data-page="loans"] .loan-contract-card:first-of-type{
  border-color:rgba(var(--qg-module-accent-rgb),.32);
  border-top:4px solid var(--qg-module-accent);
}

/* Correções cromáticas solicitadas */
.nav a[href*="page=investments"]{border-left-color:var(--qg-purple)!important}
.nav a[href*="page=loans"]{border-left-color:var(--qg-orange)!important}
.nav a[href*="page=recurrences"]{border-left-color:var(--qg-gold)!important}
.nav a[href*="page=month_balance"]{border-left-color:var(--qg-blue)!important}
.tool-card.recurrence{border-left-color:var(--qg-gold)!important}
.tool-card.recurrence .tool-card-icon{background:rgba(230,182,36,.14)!important;color:#8d6e00!important}

/* Cartões e Faturas — identidade R$ 200 em ambos os temas */
.card-credit-summary,.invoice-detail-head,.invoice-detail-card,.invoice-payment-card,.card-payment-history,.card-debt-card{border-color:rgba(131,117,119,.34)!important}
.qg-primary-invoice.qg-credit-r200,.qg-dashboard-cards-v0730 .qg-card-dashboard-card .qg-board-view,.qg-board-view.card{
  background:rgba(131,117,119,.14)!important;
  border-color:rgba(131,117,119,.34)!important;
}
.invoice-detail-item{background:var(--qg-surface)!important;border-color:rgba(131,117,119,.28)!important;border-left-color:var(--qg-sepia)!important}
.qg-primary-invoice.qg-credit-r200 .btn.secondary{background:var(--qg-surface)!important;color:var(--qg-sepia)!important}

/* Lançamentos individuais permanecem neutros */
.qg-category-section .dre-row{background:var(--qg-surface)!important;border-color:var(--qg-border);box-shadow:var(--qg-shadow)}
.qg-category-primary{box-shadow:var(--qg-shadow)}

/* Investimentos / objetivos: roxo como identidade estrutural */
.qg-investment-primary{background:rgba(138,80,207,.11)!important;border-color:rgba(138,80,207,.34)!important}
.inv-tax-identification,.inv-tax-notice,.inv-tax-fund-event-card{background:rgba(138,80,207,.10)!important;border-color:rgba(138,80,207,.28)!important}
.inv-tax-grid>div{background:var(--qg-surface)!important;border-color:rgba(138,80,207,.25)!important}
.inv-tax-status-badge{background:var(--qg-surface)!important}
.inv-tax-view-tabs a.active{background:rgba(138,80,207,.16)!important;border-color:rgba(138,80,207,.35)!important;color:var(--qg-purple)!important}

/* Dashboard geral: identidades próprias, sem percentuais novos */
.qg-dashboard-cards-v0730 .balance-card{border-top-color:var(--qg-blue)!important}
.qg-dashboard-cards-v0730 .investment-card,.qg-dashboard-cards-v0730 .investment-balance-card{border-top-color:var(--qg-purple)!important}
.qg-dashboard-cards-v0730 .total-financial-card{border-top-color:var(--qg-gold)!important}
.qg-board-add{background:var(--qg-surface-elevated);border-color:var(--qg-border);color:var(--qg-soft-text)}

/* Dark mode: neutraliza superfícies claras legadas sem alterar acentos */
html[data-theme="dark"] .privacy-note,
html[data-theme="dark"] .help-note,
html[data-theme="dark"] .step,
html[data-theme="dark"] .format-box,
html[data-theme="dark"] .review-summary>div,
html[data-theme="dark"] .qg-more-icons>summary,
html[data-theme="dark"] .qg-icon-gallery-item,
html[data-theme="dark"] .qg-icon-choice,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .help-faq details,
html[data-theme="dark"] .inv-more-options,
html[data-theme="dark"] .inv-how-it-works,
html[data-theme="dark"] .inv-tax-view-tabs a,
html[data-theme="dark"] .inv-tax-view-tabs span{background:var(--qg-surface)!important;color:var(--qg-text)!important;border-color:var(--qg-border)!important}
@media(prefers-color-scheme:dark){
  html[data-theme="system"] .privacy-note,
  html[data-theme="system"] .help-note,
  html[data-theme="system"] .step,
  html[data-theme="system"] .format-box,
  html[data-theme="system"] .review-summary>div,
  html[data-theme="system"] .qg-more-icons>summary,
  html[data-theme="system"] .qg-icon-gallery-item,
  html[data-theme="system"] .qg-icon-choice,
  html[data-theme="system"] .auth-card,
  html[data-theme="system"] .help-faq details,
  html[data-theme="system"] .inv-more-options,
  html[data-theme="system"] .inv-how-it-works,
  html[data-theme="system"] .inv-tax-view-tabs a,
  html[data-theme="system"] .inv-tax-view-tabs span{background:var(--qg-surface)!important;color:var(--qg-text)!important;border-color:var(--qg-border)!important}
}
html[data-theme="dark"] .learn-note{background:rgba(61,194,161,.10);color:var(--qg-dark-soft)}
@media(prefers-color-scheme:dark){html[data-theme="system"] .learn-note{background:rgba(61,194,161,.10);color:var(--qg-dark-soft)}}

/* Sidebar permanece escura no modo claro, como na produção atual. */
.sidebar{background:var(--qg-dark-bg);color:#fff}
.nav a{color:var(--qg-dark-soft)}
.nav a:hover,.nav a.active{background:var(--qg-dark-elevated);color:#fff}

/* Seletor Claro / Escuro / Sistema */
.topbar-tools{display:flex;align-items:center;justify-content:flex-end;gap:14px;min-width:0}
.qg-theme-switch{display:inline-flex;align-items:center;gap:4px;padding:4px;border:1px solid var(--qg-border);border-radius:12px;background:var(--qg-surface-elevated);flex:0 0 auto}
.qg-theme-btn{min-height:34px;border:0;border-radius:9px;background:transparent;color:var(--qg-muted);padding:7px 9px;font-size:12px;font-weight:750;cursor:pointer}
.qg-theme-btn:hover{color:var(--qg-text)}
.qg-theme-btn.is-active{background:var(--qg-surface);color:var(--qg-text);box-shadow:0 1px 3px rgba(16,24,40,.12)}
.qg-theme-btn:focus-visible{outline:2px solid var(--qg-module-accent);outline-offset:2px}

/* Auth também acompanha Claro/Escuro/Sistema; sem alterar fluxo de autenticação. */
.auth-body{background:linear-gradient(135deg,var(--qg-dark-bg),var(--qg-dark-elevated));color:var(--qg-text)}
.auth-card{background:var(--qg-surface);color:var(--qg-text)}

@media(max-width:760px){
  .topbar{gap:10px;align-items:flex-start}
  .topbar-tools{gap:8px;align-items:flex-end;flex-direction:column-reverse}
  .qg-theme-switch{max-width:100%}
  .qg-theme-btn{padding:7px 8px}
}
@media(max-width:520px){
  .topbar-tools{width:100%;align-items:stretch}
  .qg-theme-switch{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .qg-theme-btn{width:100%}
  .userbox{display:none}
}


/* =========================================================
   +QGrana 2.0 — M07.6.1
   Estabilização do modo escuro: contraste e superfícies legadas.
   O tema inicial volta a ser Claro; Sistema só quando escolhido.
   ========================================================= */

/* Componentes legados com fundo branco fixo passam a usar tokens no escuro. */
html[data-theme="dark"] .qg-attention-card,
html[data-theme="dark"] .transaction-mobile-card,
html[data-theme="dark"] .dashboard-ledger,
html[data-theme="dark"] .dre-row,
html[data-theme="dark"] .dre-invoice,
html[data-theme="dark"] .card-payment-row,
html[data-theme="dark"] .card-debt-note,
html[data-theme="dark"] .card-debt-summary,
html[data-theme="dark"] .qg-context-status,
html[data-theme="dark"] .qg-icon-gallery-panel,
html[data-theme="dark"] .qg-icon-gallery-item,
html[data-theme="dark"] .qg-icon-choice,
html[data-theme="dark"] .qg-type-card{
  background:var(--qg-surface)!important;
  color:var(--qg-text)!important;
  border-color:var(--qg-border)!important;
  box-shadow:var(--qg-shadow)!important;
}

/* Dashboard > Atenção: correção principal observada em produção. */
html[data-theme="dark"] .qg-attention-card strong,
html[data-theme="dark"] .qg-attention-card .qg-attention-main,
html[data-theme="dark"] .qg-attention-card .qg-attention-main>div{
  color:var(--qg-text)!important;
}
html[data-theme="dark"] .qg-attention-card small,
html[data-theme="dark"] .qg-attention-card .item-meta,
html[data-theme="dark"] .qg-attention-card .muted-copy{
  color:var(--qg-dark-soft)!important;
}
html[data-theme="dark"] .qg-attention-icon{
  background:var(--qg-surface-elevated)!important;
  border-color:var(--qg-border)!important;
}
html[data-theme="dark"] .qg-attention-card.expense .qg-attention-icon{
  background:rgba(230,97,24,.12)!important;
  border-color:rgba(230,97,24,.32)!important;
}
html[data-theme="dark"] .qg-attention-card.revenue .qg-attention-icon{
  background:rgba(61,194,161,.12)!important;
  border-color:rgba(61,194,161,.30)!important;
}

/* Tabelas/listagens e cabeçalhos legados. */
html[data-theme="dark"] .dashboard-ledger-head{
  background:var(--qg-surface-elevated)!important;
  color:var(--qg-dark-soft)!important;
}
html[data-theme="dark"] .dashboard-ledger-link:hover{
  background:var(--qg-surface-elevated)!important;
}
html[data-theme="dark"] .dashboard-ledger-link small,
html[data-theme="dark"] .transaction-mobile-card small,
html[data-theme="dark"] .dre-row small,
html[data-theme="dark"] .dre-invoice small{
  color:var(--qg-dark-muted)!important;
}

/* Formulários e controles que ainda tinham branco fixo. */
html[data-theme="dark"] .invoice-payment-form{
  background:var(--qg-surface-elevated)!important;
  border-color:var(--qg-border)!important;
}
html[data-theme="dark"] .invoice-payment-form input,
html[data-theme="dark"] .invoice-payment-form select{
  background:var(--qg-input-bg)!important;
  color:var(--qg-text)!important;
  border-color:var(--qg-border)!important;
}

/* Blocos informativos com fundos claros fixos: mantém semântica, melhora contraste. */
html[data-theme="dark"] .invoice-partial-help,
html[data-theme="dark"] .card-debt-create,
html[data-theme="dark"] .loan-bulk-payment-head,
html[data-theme="dark"] .qg-payroll-loan-note{
  background:var(--qg-surface-elevated)!important;
  color:var(--qg-dark-soft)!important;
  border-color:var(--qg-border)!important;
}
html[data-theme="dark"] .badge.gold{
  background:rgba(230,182,36,.14)!important;
  color:#F6D96F!important;
}
html[data-theme="dark"] .badge.danger,
html[data-theme="dark"] .alert.error{
  background:rgba(207,34,80,.14)!important;
  color:#FF9DB5!important;
}
html[data-theme="dark"] .alert.ok{
  background:rgba(61,194,161,.14)!important;
  color:#8FE3CD!important;
}

/* Seletores de tipo: texto não pode herdar tons escuros sobre fundo escuro. */
html[data-theme="dark"] .qg-type-card{
  color:var(--qg-text)!important;
}
html[data-theme="dark"] .qg-type-card.despesa.is-selected{
  background:rgba(230,97,24,.12)!important;
  color:#FFB58D!important;
  border-color:rgba(230,97,24,.45)!important;
}
html[data-theme="dark"] .qg-type-card.despesa.is-selected .qg-type-icon{
  background:rgba(230,97,24,.16)!important;
}

/* Botões claros em cards escuros: texto legível e sem desaparecer. */
html[data-theme="dark"] .qg-board-add,
html[data-theme="dark"] .metric-add,
html[data-theme="dark"] .btn.secondary{
  background:var(--qg-surface-elevated)!important;
  color:var(--qg-dark-soft)!important;
  border-color:var(--qg-border)!important;
}
html[data-theme="dark"] .qg-board-add strong,
html[data-theme="dark"] .metric-add strong,
html[data-theme="dark"] .btn.secondary strong{
  color:inherit!important;
}

/* Mantém o mesmo tratamento quando o usuário escolhe explicitamente Sistema
   e o dispositivo está em modo escuro. */
@media(prefers-color-scheme:dark){
  html[data-theme="system"] .qg-attention-card,
  html[data-theme="system"] .transaction-mobile-card,
  html[data-theme="system"] .dashboard-ledger,
  html[data-theme="system"] .dre-row,
  html[data-theme="system"] .dre-invoice,
  html[data-theme="system"] .card-payment-row,
  html[data-theme="system"] .card-debt-note,
  html[data-theme="system"] .card-debt-summary,
  html[data-theme="system"] .qg-context-status,
  html[data-theme="system"] .qg-icon-gallery-panel,
  html[data-theme="system"] .qg-icon-gallery-item,
  html[data-theme="system"] .qg-icon-choice,
  html[data-theme="system"] .qg-type-card{
    background:var(--qg-surface)!important;
    color:var(--qg-text)!important;
    border-color:var(--qg-border)!important;
    box-shadow:var(--qg-shadow)!important;
  }
  html[data-theme="system"] .qg-attention-card strong,
  html[data-theme="system"] .qg-attention-card .qg-attention-main,
  html[data-theme="system"] .qg-attention-card .qg-attention-main>div{color:var(--qg-text)!important}
  html[data-theme="system"] .qg-attention-card small,
  html[data-theme="system"] .qg-attention-card .item-meta,
  html[data-theme="system"] .qg-attention-card .muted-copy{color:var(--qg-dark-soft)!important}
  html[data-theme="system"] .qg-attention-icon{background:var(--qg-surface-elevated)!important;border-color:var(--qg-border)!important}
  html[data-theme="system"] .dashboard-ledger-head{background:var(--qg-surface-elevated)!important;color:var(--qg-dark-soft)!important}
  html[data-theme="system"] .dashboard-ledger-link:hover{background:var(--qg-surface-elevated)!important}
  html[data-theme="system"] .invoice-payment-form{background:var(--qg-surface-elevated)!important;border-color:var(--qg-border)!important}
  html[data-theme="system"] .invoice-payment-form input,
  html[data-theme="system"] .invoice-payment-form select{background:var(--qg-input-bg)!important;color:var(--qg-text)!important;border-color:var(--qg-border)!important}
  html[data-theme="system"] .qg-board-add,
  html[data-theme="system"] .metric-add,
  html[data-theme="system"] .btn.secondary{background:var(--qg-surface-elevated)!important;color:var(--qg-dark-soft)!important;border-color:var(--qg-border)!important}
}

/* ==========================================================
   M07.6.5 — PADRÃO GLOBAL DE AJUDA CONTEXTUAL
   "Como funciona?" passa a ser exibido somente como botão ?
   circular. O conteúdo e a semântica <details> são preservados.
   ========================================================== */

.help-box > summary,
.inv-how-it-works > summary {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(57,149,207,.32) !important;
  border-radius: 50% !important;
  background: rgba(57,149,207,.10) !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer;
  list-style: none !important;
  overflow: hidden;
  box-shadow: none !important;
  flex: 0 0 40px;
}

.help-box > summary::-webkit-details-marker,
.inv-how-it-works > summary::-webkit-details-marker {
  display: none !important;
}

.help-box > summary::after,
.inv-how-it-works > summary::after {
  content: "?";
  color: var(--qg-blue, #3995CF);
  font-size: 19px;
  line-height: 1;
  font-weight: 900;
  text-indent: 0;
}

.help-box > summary:hover,
.help-box > summary:focus-visible,
.inv-how-it-works > summary:hover,
.inv-how-it-works > summary:focus-visible {
  background: rgba(57,149,207,.16) !important;
  border-color: var(--qg-blue, #3995CF) !important;
  outline: none;
}

.help-box > summary:focus-visible,
.inv-how-it-works > summary:focus-visible {
  box-shadow: 0 0 0 3px rgba(57,149,207,.18) !important;
}

/* Recolhido: apenas o botão circular ocupa espaço. */
details.help-box:not([open]),
details.inv-how-it-works:not([open]) {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  padding: 0 !important;
  margin-top: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Aberto: o botão continua circular e o conteúdo aparece no painel. */
details.help-box[open],
details.inv-how-it-works[open] {
  width: auto;
  max-width: 100%;
}

details.help-box[open] > summary,
details.inv-how-it-works[open] > summary {
  border-bottom: 1px solid rgba(57,149,207,.32) !important;
  margin-bottom: 10px !important;
}

/* Ajuda contextual do cabeçalho não deve forçar largura total no mobile. */
.page-context-help:not([open]),
.import-intro .help-box:not([open]),
.inv-help:not([open]) {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
}

/* Investimentos: remove o aspecto de card quando a ajuda está fechada. */
.card.inv-how-it-works:not([open]) {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* Dark mode: mantém contraste e o mesmo desenho. */
html[data-theme="dark"] .help-box > summary,
html[data-theme="dark"] .inv-how-it-works > summary {
  background: rgba(57,149,207,.14) !important;
  border-color: rgba(57,149,207,.42) !important;
}

@media (prefers-color-scheme: dark) {
  html[data-theme="system"] .help-box > summary,
  html[data-theme="system"] .inv-how-it-works > summary {
    background: rgba(57,149,207,.14) !important;
    border-color: rgba(57,149,207,.42) !important;
  }
}

@media (max-width:760px) {
  .help-box > summary,
  .inv-how-it-works > summary {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
  }

  .page-context-help:not([open]),
  .import-intro .help-box:not([open]) {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    margin-top: 0 !important;
  }
}

/* ==========================================================
   M07.6.6 — SELETOR DE TEMA COMPACTO POR ÍCONES
   ========================================================== */
.qg-theme-switch{
  display:inline-flex!important;
  width:auto!important;
  max-width:none!important;
  grid-template-columns:none!important;
  align-items:center;
  gap:2px!important;
  padding:3px!important;
  border-radius:11px!important;
}
.qg-theme-btn{
  width:32px!important;
  min-width:32px!important;
  max-width:32px!important;
  height:32px!important;
  min-height:32px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:8px!important;
  font-size:0!important;
  line-height:1!important;
  flex:0 0 32px!important;
}
.qg-theme-icon{
  display:block;
  font-size:16px;
  line-height:1;
  font-weight:700;
  color:inherit;
}
.qg-theme-btn[data-qg-theme="light"] .qg-theme-icon{font-size:17px}
.qg-theme-btn[data-qg-theme="dark"] .qg-theme-icon{font-size:18px}
.qg-theme-btn[data-qg-theme="system"] .qg-theme-icon{font-size:16px}
@media(max-width:760px){
  .qg-theme-switch{
    width:auto!important;
    display:inline-flex!important;
    grid-template-columns:none!important;
    max-width:none!important;
  }
  .qg-theme-btn{
    width:30px!important;
    min-width:30px!important;
    max-width:30px!important;
    height:30px!important;
    min-height:30px!important;
    flex-basis:30px!important;
  }
  .qg-theme-icon{font-size:15px}
}

/* ==========================================================
   +QGrana 2.0 — M07.7.0
   Central Financeira, Ferramentas e Relatórios
   ========================================================== */
html[data-theme="dark"] 
.nav a[href*="page=reports"]{border-left:3px solid #3995CF}
.nav a[href*="page=tools"]{border-left:3px solid #E6B624}

.qg-tools-v0770 .tool-card.appearance{--tool-accent:#3995CF}
.qg-tools-v0770 .tool-card.import-sheet{--tool-accent:#3DC2A1}
.qg-tools-v0770 .tool-card.card-import{--tool-accent:#837577}
.qg-tools-v0770 .tool-card.expense{--tool-accent:#E66118}
.qg-tools-v0770 .tool-card.recurrence{--tool-accent:#E6B624}
.qg-tools-v0770 .tool-card.settings{--tool-accent:#3995CF}
.qg-tools-v0770 .tool-card{
  position:relative;
  border-left:5px solid var(--tool-accent);
}
.qg-tools-v0770 .tool-card.appearance{
  cursor:default;
}
.qg-tool-theme{
  grid-column:1/-1;
  display:flex;
  gap:7px;
  margin-top:12px;
}
.qg-tool-theme .qg-theme-btn{
  width:42px;
  height:42px;
  min-width:42px;
  padding:0;
  border-radius:12px;
}
html[data-theme="dark"] .qg-tools-v0770 .tool-card{
  background:#172033;
  border-top-color:#344054;
  border-right-color:#344054;
  border-bottom-color:#344054;
}

/* Relatórios */
.qg-report-filter{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  gap:12px;
  align-items:end;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  margin-bottom:14px;
}
.qg-report-filter label{font-size:12px;font-weight:800;color:var(--muted)}
.qg-report-filter select{
  display:block;width:100%;margin-top:5px;border:1px solid var(--line);
  border-radius:11px;padding:10px;background:var(--card);color:var(--text)
}
.qg-report-summary-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px
}
.qg-report-summary{
  background:var(--card);border:1px solid var(--line);border-top:5px solid var(--report-accent);
  border-radius:16px;padding:14px
}
.qg-report-summary.revenue{--report-accent:#3DC2A1}
.qg-report-summary.expense{--report-accent:#CF2250}
.qg-report-summary.investment{--report-accent:#8A50CF}
.qg-report-summary.balance{--report-accent:#3995CF}
.qg-report-summary.balance.negative{--report-accent:#CF2250}
.qg-report-summary small{color:var(--muted)}
.qg-report-summary strong{display:block;margin-top:6px;font-size:20px}
.qg-report-section-label{
  margin:22px 2px 10px;font-size:11px;font-weight:900;color:var(--muted);
  text-transform:uppercase;letter-spacing:.08em
}
.qg-report-card{
  --report-accent:#3995CF;
  background:var(--card);border:1px solid var(--line);border-top:5px solid var(--report-accent);
  border-radius:17px;padding:16px;margin-bottom:14px
}
.qg-report-card.cashflow{--report-accent:#3995CF}
.qg-report-card.result{--report-accent:#E6B624}
.qg-report-card.categories{--report-accent:#E66118}
.qg-report-card.cards{--report-accent:#837577}
.qg-report-card.aportes{--report-accent:#8A50CF}
.qg-report-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.qg-report-card h2{margin:0 0 4px;font-size:18px}
.qg-report-card p{margin:0;color:var(--muted);font-size:13px}
.qg-report-tag{
  flex:0 0 auto;padding:5px 8px;border-radius:999px;
  background:color-mix(in srgb,var(--report-accent) 12%,var(--card));
  border:1px solid color-mix(in srgb,var(--report-accent) 32%,var(--line));
  color:var(--report-accent);font-size:11px;font-weight:900
}
.qg-report-flow-chart{
  display:flex;align-items:flex-end;gap:8px;height:180px;margin:18px 0 0;
  padding:10px 8px 0;border-bottom:1px solid var(--line)
}
.qg-report-month-column{flex:1;height:100%;display:grid;grid-template-rows:1fr auto;gap:5px;min-width:24px}
.qg-report-paired-bars{height:100%;display:flex;align-items:flex-end;justify-content:center;gap:3px}
.qg-bar{display:block;min-height:4px;border-radius:5px 5px 2px 2px}
.qg-report-paired-bars .qg-bar{width:42%}
.qg-bar.revenue{background:#3DC2A1}
.qg-bar.expense{background:#CF2250}
.qg-bar.card{background:#837577}
.qg-bar.investment{background:#8A50CF}
.qg-report-month-column small,.qg-report-single-chart small{text-align:center;color:var(--muted);font-size:10px}
.qg-report-legend{display:flex;gap:14px;margin-top:10px;color:var(--muted);font-size:11px}
.qg-report-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
.qg-report-legend i.revenue{background:#3DC2A1}
.qg-report-legend i.expense{background:#CF2250}
.qg-report-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.qg-report-kpis>div{background:color-mix(in srgb,var(--report-accent) 7%,var(--card));border-radius:12px;padding:12px}
.qg-report-kpis small,.qg-report-kpis span{display:block;color:var(--muted);font-size:11px}
.qg-report-kpis strong{display:block;margin:4px 0;font-size:18px}
.qg-report-category-list{display:grid;gap:12px;margin-top:14px}
.qg-report-category-row>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:12px}
.qg-report-category-row small{display:block;text-align:right;color:var(--muted);font-size:10px;margin-top:3px}
.qg-report-track{height:8px;border-radius:999px;background:color-mix(in srgb,#E66118 8%,var(--card));overflow:hidden;margin-top:5px}
.qg-report-track span{display:block;height:100%;background:#E66118;border-radius:999px}
.qg-report-single-chart{
  height:120px;display:flex;align-items:flex-end;gap:8px;margin-top:16px;padding-top:6px
}
.qg-report-single-chart>div{flex:1;height:100%;display:grid;grid-template-rows:1fr auto;gap:5px;align-items:end}
.qg-report-single-chart .qg-bar{width:60%;justify-self:center;align-self:end}
.qg-report-action{
  display:flex;justify-content:center;align-items:center;min-height:42px;margin-top:14px;
  border-radius:11px;border:1px solid color-mix(in srgb,var(--report-accent) 30%,var(--line));
  background:color-mix(in srgb,var(--report-accent) 10%,var(--card));
  color:var(--report-accent);font-weight:800
}
.qg-report-action.cards{--report-accent:#837577}
.qg-report-action.investment{--report-accent:#8A50CF}

html[data-theme="dark"] .qg-report-filter,
html[data-theme="dark"] .qg-report-card,
html[data-theme="dark"] .qg-report-summary{
  background:#172033;border-color:#344054
}
html[data-theme="dark"] .qg-report-filter select{background:#24314B;border-color:#344054;color:#fff}

@media(max-width:980px){
  .qg-report-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  
.qg-report-filter{grid-template-columns:1fr 1fr}
  .qg-report-filter-action{grid-column:1/-1}
  .qg-report-filter-action .btn{width:100%}
  .qg-report-flow-chart{height:155px;gap:5px;padding-left:2px;padding-right:2px}
}
@media(max-width:480px){
  .qg-report-summary-grid{grid-template-columns:1fr 1fr;gap:8px}
  .qg-report-summary{padding:12px}
  .qg-report-summary strong{font-size:17px}
  .qg-report-filter{grid-template-columns:1fr}
  .qg-report-filter-action{grid-column:auto}
  .qg-report-card-head{display:block}
  .qg-report-tag{display:inline-block;margin-top:8px}
  .qg-report-kpis{grid-template-columns:1fr 1fr}
}

/* ==========================================================
   +QGrana 2.0 — M07.7.1
   Navegação lateral: ACOMPANHAR unificado e IMPORTAÇÕES removido
   ========================================================== */

/* No menu lateral, os itens do grupo ACOMPANHAR usam a mesma
   identidade estrutural azul. As identidades próprias continuam
   válidas dentro das respectivas telas. */
.nav-group[data-group="ACOMPANHAR"] a,
.sidebar-group[data-group="ACOMPANHAR"] a,
.nav-section[data-group="ACOMPANHAR"] a {
  border-left-color:#3995CF !important;
}

/* Fallback para a estrutura atual baseada em href. */
.nav a[href*="page=reports"],
.nav a[href*="page=loans"] {
  border-left-color:#3995CF !important;
}

/* Ferramentas permanece em UTILIDADES com sua identidade própria. */
.nav a[href*="page=tools"] {
  border-left-color:#E6B624;
}

/* ==========================================================
   +QGrana 2.0 — M07.7.2
   Correção de navegação: remoção definitiva de IMPORTAÇÕES.
   Sem alteração visual adicional.
   ========================================================== */

/* ==========================================================
   +QGrana 2.0 — M07.7.3
   ACOMPANHAR: cor estrutural azul inclusive no item ativo
   ========================================================== */

/* Menu lateral: Relatórios e Financiamentos/Empréstimos
   compartilham a identidade estrutural azul do grupo ACOMPANHAR,
   inclusive quando selecionados. A identidade laranja de
   Financiamentos permanece apenas no conteúdo interno da tela. */

.nav a[href*="page=reports"],
.nav a[href*="page=loans"],
.nav a[href*="page=reports"].active,
.nav a[href*="page=loans"].active,
.nav a[href*="page=reports"][aria-current="page"],
.nav a[href*="page=loans"][aria-current="page"],
.sidebar a[href*="page=reports"],
.sidebar a[href*="page=loans"],
.sidebar a[href*="page=reports"].active,
.sidebar a[href*="page=loans"].active,
.sidebar a[href*="page=reports"][aria-current="page"],
.sidebar a[href*="page=loans"][aria-current="page"] {
  border-left-color:#3995CF !important;
}

/* Compatibilidade com estruturas onde o destaque ativo usa pseudo-elemento. */
.nav a[href*="page=reports"]::before,
.nav a[href*="page=loans"]::before,
.nav a[href*="page=reports"].active::before,
.nav a[href*="page=loans"].active::before,
.sidebar a[href*="page=reports"]::before,
.sidebar a[href*="page=loans"]::before,
.sidebar a[href*="page=reports"].active::before,
.sidebar a[href*="page=loans"].active::before {
  background:#3995CF !important;
  border-color:#3995CF !important;
}

/* ==========================================================
   +QGrana 2.0 — M07.7.4
   CORREÇÃO DEFINITIVA — grupo ACOMPANHAR no menu lateral
   Regra final da cascata: identidade estrutural azul.
   ========================================================== */

/* Título do grupo. */
.nav .nav-group-acompanhar .nav-group-title,
.sidebar .nav-group-acompanhar .nav-group-title {
  color:#3995CF !important;
}

/* Todos os itens do grupo, inclusive Financiamentos/Empréstimos. */
.nav .nav-group-acompanhar > a,
.sidebar .nav-group-acompanhar > a {
  border-left-color:#3995CF !important;
}

/* Estado ativo: o destaque visual real é box-shadow inset.
   Esta regra sobrescreve explicitamente as regras legadas laranja. */
.nav .nav-group-acompanhar > a.active,
.sidebar .nav-group-acompanhar > a.active,
.nav .nav-group-acompanhar > a[aria-current="page"],
.sidebar .nav-group-acompanhar > a[aria-current="page"] {
  border-left-color:#3995CF !important;
  box-shadow:inset 3px 0 0 #3995CF !important;
}

/* Cobertura adicional das rotas atuais do grupo. */
.nav .nav-group-acompanhar > a[href*="page=reports"],
.nav .nav-group-acompanhar > a[href*="page=loans"],
.sidebar .nav-group-acompanhar > a[href*="page=reports"],
.sidebar .nav-group-acompanhar > a[href*="page=loans"] {
  border-left-color:#3995CF !important;
}

.nav .nav-group-acompanhar > a[href*="page=reports"].active,
.nav .nav-group-acompanhar > a[href*="page=loans"].active,
.sidebar .nav-group-acompanhar > a[href*="page=reports"].active,
.sidebar .nav-group-acompanhar > a[href*="page=loans"].active {
  border-left-color:#3995CF !important;
  box-shadow:inset 3px 0 0 #3995CF !important;
}

/* ==========================================================
   +QGrana 2.0 — M07.7.5
   CORREÇÃO DEFINITIVA — Cartões e Faturas em ORGANIZAR
   ========================================================== */

/* ORGANIZAR usa verde estrutural no menu, inclusive no estado ativo. */
.nav .nav-group-organizar .nav-group-title,
.sidebar .nav-group-organizar .nav-group-title {
  color:#3DC2A1 !important;
}

.nav .nav-group-organizar > a,
.sidebar .nav-group-organizar > a {
  border-left-color:#3DC2A1 !important;
}

.nav .nav-group-organizar > a.active,
.sidebar .nav-group-organizar > a.active,
.nav .nav-group-organizar > a[aria-current="page"],
.sidebar .nav-group-organizar > a[aria-current="page"] {
  border-left-color:#3DC2A1 !important;
  box-shadow:inset 4px 0 0 #3DC2A1 !important;
}

/* Cartões e Faturas tinha uma regra ativa sépia própria.
   No menu ela passa a obedecer ao padrão do grupo ORGANIZAR.
   O sépia continua restrito aos componentes internos do módulo. */
.nav a.qg-nav-card-credit.active,
.sidebar a.qg-nav-card-credit.active,
.nav a.qg-nav-card-credit[aria-current="page"],
.sidebar a.qg-nav-card-credit[aria-current="page"] {
  background:#24314b !important;
  color:#fff !important;
  border-left-color:#3DC2A1 !important;
  box-shadow:inset 4px 0 0 #3DC2A1 !important;
}

.nav a.qg-nav-card-credit::before,
.sidebar a.qg-nav-card-credit::before,
.nav a.qg-nav-card-credit.active::before,
.sidebar a.qg-nav-card-credit.active::before {
  background:#3DC2A1 !important;
  border-color:#3DC2A1 !important;
}

/* ==========================================================
   +QGrana 2.0 — M07.7.6
   PADRONIZAÇÃO — UTILIDADES / Ferramentas
   ========================================================== */

/* O grupo UTILIDADES usa dourado estrutural no menu lateral. */
.nav .nav-group-utilidades .nav-group-title,
.sidebar .nav-group-utilidades .nav-group-title {
  color:#E6B624 !important;
}

/* Ferramentas segue a identidade estrutural dourada do grupo. */
.nav .nav-group-utilidades > a,
.sidebar .nav-group-utilidades > a {
  border-left-color:#E6B624 !important;
}

/* Estado ativo/selecionado: mesmo fundo padrão do menu e faixa dourada. */
.nav .nav-group-utilidades > a.active,
.sidebar .nav-group-utilidades > a.active,
.nav .nav-group-utilidades > a[aria-current="page"],
.sidebar .nav-group-utilidades > a[aria-current="page"] {
  background:#24314b !important;
  border-left-color:#E6B624 !important;
  box-shadow:inset 4px 0 0 #E6B624 !important;
}

/* Cobertura explícita da rota Ferramentas. */
.nav .nav-group-utilidades > a[href*="page=tools"],
.sidebar .nav-group-utilidades > a[href*="page=tools"] {
  border-left-color:#E6B624 !important;
}

.nav .nav-group-utilidades > a[href*="page=tools"].active,
.sidebar .nav-group-utilidades > a[href*="page=tools"].active,
.nav .nav-group-utilidades > a[href*="page=tools"][aria-current="page"],
.sidebar .nav-group-utilidades > a[href*="page=tools"][aria-current="page"] {
  background:#24314b !important;
  border-left-color:#E6B624 !important;
  box-shadow:inset 4px 0 0 #E6B624 !important;
}

/* Compatibilidade com destaque via pseudo-elemento. */
.nav .nav-group-utilidades > a[href*="page=tools"]::before,
.sidebar .nav-group-utilidades > a[href*="page=tools"]::before,
.nav .nav-group-utilidades > a[href*="page=tools"].active::before,
.sidebar .nav-group-utilidades > a[href*="page=tools"].active::before {
  background:#E6B624 !important;
  border-color:#E6B624 !important;
}

/* ==========================================================
   +QGrana 2.0 — M07.7.7
   Aparência funcional, dark mode e status Tá pago
   ========================================================== */

/* Board Aparência: conteúdo em duas linhas, sem overflow. */
.qg-tools-v0770 .tool-card.appearance{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  align-items:stretch !important;
  gap:12px !important;
  overflow:hidden;
}
.qg-tools-v0770 .tool-card.appearance .qg-tool-main{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.qg-tools-v0770 .tool-card.appearance .tool-card-copy{
  min-width:0;
}
.qg-tools-v0770 .tool-card.appearance .tool-card-copy strong{
  color:var(--qg-text,var(--text)) !important;
}
.qg-tools-v0770 .qg-tool-theme{
  display:inline-flex !important;
  width:max-content !important;
  max-width:100% !important;
  align-items:center !important;
  gap:5px !important;
  margin:0 !important;
  padding:4px !important;
  border:1px solid var(--qg-border,var(--line)) !important;
  border-radius:12px !important;
  background:var(--qg-surface-elevated,var(--card)) !important;
  overflow:hidden;
}
.qg-tools-v0770 .qg-tool-theme .qg-theme-btn{
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
  height:34px !important;
  min-height:34px !important;
  flex:0 0 34px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border-radius:9px !important;
  color:var(--qg-muted,var(--muted)) !important;
  background:transparent !important;
}
.qg-tools-v0770 .qg-tool-theme .qg-theme-btn.is-active{
  background:var(--qg-surface,var(--card)) !important;
  color:var(--qg-text,var(--text)) !important;
  box-shadow:0 1px 3px rgba(16,24,40,.16) !important;
}
.qg-tools-v0770 .qg-tool-theme .qg-theme-icon{
  display:block !important;
  font-size:17px !important;
  line-height:1 !important;
  color:inherit !important;
}

/* Dark mode: Ferramentas e superfícies legadas passam a usar tokens escuros. */
html[data-theme="dark"] .qg-tools-v0770 .tool-card{
  background:var(--qg-surface) !important;
  color:var(--qg-text) !important;
  border-top-color:var(--qg-border) !important;
  border-right-color:var(--qg-border) !important;
  border-bottom-color:var(--qg-border) !important;
}
html[data-theme="dark"] .qg-tools-v0770 .tool-card-copy strong,
html[data-theme="dark"] .qg-tools-v0770 .tool-card-copy small{
  color:var(--qg-text) !important;
}
html[data-theme="dark"] .qg-tools-v0770 .tool-card-copy small{
  color:var(--qg-muted) !important;
}

/* Nome/valor da competência: legível em branco no tema escuro. */
html[data-theme="dark"] .competence-input,
html[data-theme="dark"] input[type="month"].competence-input,
html[data-theme="dark"] .qg-month-navigation input[type="month"],
html[data-theme="dark"] .qg-month-navigation label,
html[data-theme="dark"] .qg-month-navigation label span{
  color:#FFFFFF !important;
}
html[data-theme="dark"] .competence-input,
html[data-theme="dark"] input[type="month"].competence-input,
html[data-theme="dark"] .qg-month-navigation input[type="month"]{
  background:var(--qg-input-bg) !important;
  border-color:var(--qg-border) !important;
  color-scheme:dark;
}
html[data-theme="dark"] input[type="month"]::-webkit-datetime-edit,
html[data-theme="dark"] input[type="month"]::-webkit-datetime-edit-fields-wrapper,
html[data-theme="dark"] input[type="month"]::-webkit-datetime-edit-month-field,
html[data-theme="dark"] input[type="month"]::-webkit-datetime-edit-year-field{
  color:#FFFFFF !important;
}

/* Status Tá pago: garante que o ícone interno permaneça visível e detalhado. */
.qg-operation-status{
  overflow:visible !important;
}
.qg-operation-status img{
  display:block !important;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  object-fit:contain !important;
  opacity:1 !important;
  filter:none !important;
}
.qg-operation-status.expense.is-confirmed img{
  background:transparent !important;
  mix-blend-mode:normal !important;
}

/* Linhas do Ver no mês no escuro: acabamento visual uniforme. */
html[data-theme="dark"] .dre-row,
html[data-theme="dark"] .dre-invoice{
  background:var(--qg-surface) !important;
  color:var(--qg-text) !important;
  border-color:var(--qg-border) !important;
}
html[data-theme="dark"] .dre-row strong,
html[data-theme="dark"] .dre-row .btn,
html[data-theme="dark"] .dre-actions{
  color:var(--qg-text);
}

@media(max-width:760px){
  .qg-tools-v0770 .tool-card.appearance{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .qg-tools-v0770 .qg-tool-theme{
    width:max-content !important;
    max-width:100% !important;
  }
}

/* ==========================================================
   +QGrana 2.0 — M07.7.8
   DARK MODE — formulários e superfícies legadas
   ========================================================== */

/* Regra base: controles nativos e campos editáveis usam tokens de tema. */
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .input,
html[data-theme="dark"] .select,
html[data-theme="dark"] .textarea {
  background:var(--qg-input-bg,var(--qg-dark-elevated,#24314B)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
  box-shadow:none !important;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color:var(--qg-muted,var(--qg-dark-muted,#98A2B3)) !important;
  opacity:1;
}

/* Lançamentos */
html[data-theme="dark"] body[data-page="transactions"] .card,
html[data-theme="dark"] body[data-page="transactions"] .form-card,
html[data-theme="dark"] body[data-page="transactions"] .learn-note,
html[data-theme="dark"] body[data-page="transactions"] .transaction-expense-option,
html[data-theme="dark"] body[data-page="transactions"] .other-payment-source-box,
html[data-theme="dark"] body[data-page="transactions"] .qg-type-card,
html[data-theme="dark"] body[data-page="transactions"] details,
html[data-theme="dark"] body[data-page="transactions"] .more-options,
html[data-theme="dark"] body[data-page="transactions"] .inv-more-options {
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

html[data-theme="dark"] body[data-page="transactions"] label,
html[data-theme="dark"] body[data-page="transactions"] .field-label,
html[data-theme="dark"] body[data-page="transactions"] small,
html[data-theme="dark"] body[data-page="transactions"] .help-text {
  color:var(--qg-muted,var(--qg-dark-muted,#98A2B3)) !important;
}

html[data-theme="dark"] body[data-page="transactions"] strong,
html[data-theme="dark"] body[data-page="transactions"] h2,
html[data-theme="dark"] body[data-page="transactions"] h3 {
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
}

/* Planejador de Investimentos */
html[data-theme="dark"] body[data-page="investments"] .card,
html[data-theme="dark"] body[data-page="investments"] .table-wrap,
html[data-theme="dark"] body[data-page="investments"] .inv-more-options,
html[data-theme="dark"] body[data-page="investments"] .inv-how-it-works,
html[data-theme="dark"] body[data-page="investments"] .inv-income-filters,
html[data-theme="dark"] body[data-page="investments"] .investment-section-filter {
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

html[data-theme="dark"] body[data-page="investments"] input,
html[data-theme="dark"] body[data-page="investments"] select,
html[data-theme="dark"] body[data-page="investments"] textarea,
html[data-theme="dark"] body[data-page="investment_settings"] input,
html[data-theme="dark"] body[data-page="investment_settings"] select,
html[data-theme="dark"] body[data-page="investment_settings"] textarea {
  background:var(--qg-input-bg,var(--qg-dark-elevated,#24314B)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

html[data-theme="dark"] body[data-page="investments"] table,
html[data-theme="dark"] body[data-page="investments"] th,
html[data-theme="dark"] body[data-page="investments"] td {
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

/* Perfil / Administração */
html[data-theme="dark"] body[data-page="admin"] .card,
html[data-theme="dark"] body[data-page="admin"] .table-wrap,
html[data-theme="dark"] body[data-page="admin"] .settings-mobile-card,
html[data-theme="dark"] body[data-page="admin"] .admin-card {
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

html[data-theme="dark"] body[data-page="admin"] input,
html[data-theme="dark"] body[data-page="admin"] select,
html[data-theme="dark"] body[data-page="admin"] textarea {
  background:var(--qg-input-bg,var(--qg-dark-elevated,#24314B)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

html[data-theme="dark"] body[data-page="admin"] table,
html[data-theme="dark"] body[data-page="admin"] th,
html[data-theme="dark"] body[data-page="admin"] td {
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

/* Componentes legados comuns que ainda podiam fixar branco. */
html[data-theme="dark"] .settings-card-grid>div,
html[data-theme="dark"] .sheet-table td,
html[data-theme="dark"] .sheet-table th,
html[data-theme="dark"] .invoice-detail-item,
html[data-theme="dark"] .form-grid,
html[data-theme="dark"] .inline-realization-panel,
html[data-theme="dark"] .review-summary>div {
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

/* M07.15.2.39 — Desembolsos legíveis no tema escuro. */
html[data-theme="dark"] .realization-summary.inline>div,
html[data-theme="dark"] .inline-realization-new {
  background:var(--qg-surface-elevated,var(--qg-dark-elevated,#24314B)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}
html[data-theme="dark"] .realization-summary.inline small,
html[data-theme="dark"] .realization-summary.inline strong,
html[data-theme="dark"] .inline-realization-new>summary {
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
}
html[data-theme="dark"] .inline-realization-new small,
html[data-theme="dark"] .inline-realization-header p,
html[data-theme="dark"] .inline-realization-history-title span {
  color:var(--qg-muted,var(--qg-dark-muted,#98A2B3)) !important;
}

/* Mantém elementos de seleção e botões coerentes no escuro. */
html[data-theme="dark"] button.secondary,
html[data-theme="dark"] .btn.secondary,
html[data-theme="dark"] .btn.ghost {
  background:var(--qg-surface-elevated,var(--qg-dark-elevated,#24314B)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

/* Evita que o date/month nativo volte a texto escuro em controles claros. */
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="month"],
html[data-theme="dark"] input[type="time"] {
  color-scheme:dark;
}

/* ==========================================================
   +QGrana 2.0 — M07.7.9
   DARK MODE — correção dos dois boards brancos em Lançamentos
   ========================================================== */

/* Board Mês / Categoria — seletor real do markup. */
html[data-theme="dark"] body[data-page="transactions"] .transaction-suggested-grid{
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
  box-shadow:none !important;
}
html[data-theme="dark"] body[data-page="transactions"] .transaction-suggested-grid label{
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
}
html[data-theme="dark"] body[data-page="transactions"] .transaction-suggested-grid label small{
  color:var(--qg-muted,var(--qg-dark-muted,#98A2B3)) !important;
}

/* Board de status — seletores reais do markup. */
html[data-theme="dark"] body[data-page="transactions"] .transaction-realized-control,
html[data-theme="dark"] body[data-page="transactions"] .qg-realized-panel{
  background:var(--qg-surface,var(--qg-dark-card,#172033)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
  box-shadow:none !important;
}
html[data-theme="dark"] body[data-page="transactions"] .transaction-realized-control strong,
html[data-theme="dark"] body[data-page="transactions"] .qg-realized-panel strong{
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
}
html[data-theme="dark"] body[data-page="transactions"] .transaction-realized-control small,
html[data-theme="dark"] body[data-page="transactions"] .qg-realized-panel small{
  color:var(--qg-muted,var(--qg-dark-muted,#98A2B3)) !important;
}

/* Inputs internos continuam usando o padrão dark já consolidado. */
html[data-theme="dark"] body[data-page="transactions"] .transaction-suggested-grid input,
html[data-theme="dark"] body[data-page="transactions"] .transaction-suggested-grid select{
  background:var(--qg-input-bg,var(--qg-dark-elevated,#24314B)) !important;
  color:var(--qg-text,var(--qg-dark-text,#FFFFFF)) !important;
  border-color:var(--qg-border,var(--qg-dark-border,#344054)) !important;
}

/* PWA/mobile: mantém os boards contidos. */
@media(max-width:760px){
  html[data-theme="dark"] body[data-page="transactions"] .transaction-suggested-grid,
  html[data-theme="dark"] body[data-page="transactions"] .transaction-realized-control,
  html[data-theme="dark"] body[data-page="transactions"] .qg-realized-panel{
    width:100%;
    max-width:100%;
  }
}


/* M07.12.0 — Outras fontes de pagamento */
.qg-other-sources-card{width:100%;text-align:left;font:inherit;color:var(--qg-text,var(--qg-light-text,#172033));cursor:pointer;border:1px solid var(--qg-border,var(--qg-light-line,#E4E9F2))}
.qg-other-sources-card .qg-metric-action{display:block;margin-top:.45rem;font-size:.78rem;font-weight:700;color:var(--qg-text,var(--qg-light-text,#172033))}
.qg-other-sources-card:hover,.qg-other-sources-card:focus-visible{box-shadow:0 0 0 3px rgba(57,149,207,.14);outline:none}
.qg-detail-dialog{width:min(960px,calc(100vw - 32px));max-height:min(82vh,760px);padding:0;border:0;border-radius:18px;background:var(--qg-light-card,#fff);color:var(--qg-light-text,#172033);box-shadow:0 24px 60px rgba(16,24,40,.28)}
.qg-detail-dialog::backdrop{background:rgba(16,24,40,.52)}
.qg-detail-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px 24px;border-bottom:1px solid var(--qg-light-line,#E4E9F2)}
.qg-detail-dialog-head h2{margin:0 0 5px}.qg-detail-dialog-head p{margin:0;color:var(--qg-light-muted,#697386)}
.qg-dialog-close{border:0;background:transparent;color:inherit;font-size:28px;line-height:1;cursor:pointer;padding:2px 6px}
.qg-other-sources-summary{display:flex;justify-content:space-between;gap:18px;padding:18px 24px;background:rgba(57,149,207,.07)}
.qg-other-sources-summary strong{font-size:1.2rem}
.qg-detail-table-wrap{overflow:auto;max-height:55vh;padding:0 24px 24px}
.qg-detail-table{width:100%;border-collapse:collapse;min-width:720px}
.qg-detail-table th,.qg-detail-table td{padding:14px 10px;border-bottom:1px solid var(--qg-light-line,#E4E9F2);text-align:left;vertical-align:middle}
.qg-detail-table th{font-size:.78rem;color:var(--qg-light-muted,#697386);text-transform:uppercase;letter-spacing:.03em}
.qg-detail-table td small{display:block;margin-top:3px;color:var(--qg-light-muted,#697386)}
[data-theme="dark"] .qg-other-sources-card{border-color:var(--qg-dark-border,#344054);color:var(--qg-dark-text,#fff)}
[data-theme="dark"] .qg-other-sources-card .qg-metric-action{color:var(--qg-dark-text,#fff)}
[data-theme="dark"] .qg-detail-dialog{background:var(--qg-dark-card,#172033);color:var(--qg-dark-text,#fff)}
[data-theme="dark"] .qg-detail-dialog-head,[data-theme="dark"] .qg-detail-table th,[data-theme="dark"] .qg-detail-table td{border-color:var(--qg-dark-border,#344054)}
[data-theme="dark"] .qg-detail-dialog-head p,[data-theme="dark"] .qg-detail-table th,[data-theme="dark"] .qg-detail-table td small{color:var(--qg-dark-muted,#98A2B3)}


/* M07.14.0 — Calculadora auxiliar */
.qg-calculator-trigger{margin-left:6px;width:34px;height:34px;border:1px solid var(--qg-light-line,#E4E9F2);border-radius:8px;background:var(--qg-light-card,#fff);cursor:pointer;vertical-align:middle;font-size:17px}
.qg-calculator-trigger:hover,.qg-calculator-trigger:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(138,80,207,.14);border-color:var(--qg-purple,#8A50CF)}
.qg-calculator-dialog{width:min(360px,calc(100vw - 28px));padding:0;border:0;border-radius:18px;background:var(--qg-light-card,#fff);color:var(--qg-light-text,#172033);box-shadow:0 24px 60px rgba(16,24,40,.28)}
.qg-calculator-dialog::backdrop{background:rgba(16,24,40,.52)}
.qg-calculator-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:18px 18px 12px}
.qg-calculator-head h2{margin:0 0 3px}.qg-calculator-head p{margin:0;color:var(--qg-light-muted,#697386);font-size:.85rem}
.qg-calculator-body{padding:0 18px 18px}
.qg-calculator-display{min-height:78px;padding:12px 14px;border-radius:12px;background:var(--qg-light-bg,#F5F7FB);text-align:right;display:flex;flex-direction:column;justify-content:flex-end}
.qg-calculator-display small{min-height:18px;color:var(--qg-light-muted,#697386)}
.qg-calculator-display strong{font-size:1.8rem;line-height:1.2;word-break:break-all}
.qg-calculator-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.qg-calculator-grid button{min-height:48px;border:1px solid var(--qg-light-line,#E4E9F2);border-radius:10px;background:var(--qg-light-card,#fff);color:inherit;font:inherit;font-weight:700;cursor:pointer}
.qg-calculator-grid button:hover{background:var(--qg-light-bg,#F5F7FB)}
.qg-calculator-grid [data-calc-op],.qg-calculator-grid [data-calc-action="percent"]{color:var(--qg-purple,#8A50CF)}
.qg-calculator-grid .qg-calc-zero{grid-column:span 2}
.qg-calculator-grid .qg-calc-equals{background:var(--qg-purple,#8A50CF);color:#fff;border-color:var(--qg-purple,#8A50CF)}
.qg-calculator-grid .qg-calc-equals:hover{filter:brightness(.96)}
.qg-calc-use{width:100%;margin-top:12px}
[data-theme="dark"] .qg-calculator-trigger,[data-theme="dark"] .qg-calculator-dialog,[data-theme="dark"] .qg-calculator-grid button{background:var(--qg-dark-card,#172033);color:var(--qg-dark-text,#fff);border-color:var(--qg-dark-border,#344054)}
[data-theme="dark"] .qg-calculator-display{background:var(--qg-dark-elevated,#24314B)}
[data-theme="dark"] .qg-calculator-head p,[data-theme="dark"] .qg-calculator-display small{color:var(--qg-dark-muted,#98A2B3)}
[data-theme="dark"] .qg-calculator-grid button:hover{background:var(--qg-dark-elevated,#24314B)}


/* M07.14.3 — alinhamento do botão 2x2 da calculadora */
.qg-money-field-wrap{
  position:relative;
  display:block;
  width:100%;
}
.qg-money-with-calculator{
  position:relative;
}
.qg-money-with-calculator > input[data-money]{
  width:100%;
  padding-right:58px;
}
.qg-money-with-calculator > .qg-calculator-trigger{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  margin:0;
  width:40px;
  height:40px;
  padding:4px;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:1px;
  align-items:center;
  justify-items:center;
  border:1px solid var(--qg-light-line,#E4E9F2);
  border-radius:9px;
  background:var(--qg-light-card,#FFFFFF);
  color:var(--qg-purple,#8A50CF);
  cursor:pointer;
  line-height:1;
  font-weight:800;
  font-size:14px;
  z-index:2;
}
.qg-money-with-calculator > .qg-calculator-trigger .qg-calc-symbol{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
}
.qg-money-with-calculator > .qg-calculator-trigger:hover,
.qg-money-with-calculator > .qg-calculator-trigger:focus-visible{
  outline:none;
  border-color:var(--qg-purple,#8A50CF);
  background:rgba(138,80,207,.06);
  box-shadow:0 0 0 3px rgba(138,80,207,.12);
}
[data-theme="dark"] .qg-money-with-calculator > .qg-calculator-trigger{
  background:var(--qg-dark-card,#172033);
  color:#CDA8F6;
  border-color:var(--qg-dark-border,#344054);
}
[data-theme="dark"] .qg-money-with-calculator > .qg-calculator-trigger:hover,
[data-theme="dark"] .qg-money-with-calculator > .qg-calculator-trigger:focus-visible{
  background:rgba(138,80,207,.18);
  border-color:var(--qg-purple,#8A50CF);
}
@media (max-width:700px){
  .qg-money-with-calculator > input[data-money]{
    padding-right:66px;
  }
  .qg-money-with-calculator > .qg-calculator-trigger{
    right:7px;
    width:46px;
    height:46px;
    padding:5px;
    border-radius:10px;
    font-size:16px;
  }
}


/* M07.15.0 — Release A: leitura assistida de despesas */
.qg-doc-entry{border:1px solid var(--qg-light-line,#E4E9F2);border-radius:14px;padding:14px;background:var(--qg-light-bg,#F5F7FB)}
.qg-doc-entry-head{display:flex;justify-content:space-between;gap:16px;margin-bottom:10px}
.qg-doc-entry-head strong{display:block}.qg-doc-entry-head small{display:block;margin-top:3px;color:var(--qg-light-muted,#697386)}
.qg-doc-entry-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.qg-doc-entry-card{min-height:82px;border:1px solid var(--qg-light-line,#E4E9F2);border-radius:12px;background:var(--qg-light-card,#fff);color:inherit;padding:10px;cursor:pointer;display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;text-align:left;align-items:center}
.qg-doc-entry-card .qg-doc-entry-icon{grid-row:1/3;width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:rgba(138,80,207,.09);color:var(--qg-purple,#8A50CF);font-weight:800;font-size:19px}
.qg-doc-entry-card strong{font-size:.92rem}.qg-doc-entry-card small{color:var(--qg-light-muted,#697386)}
.qg-doc-entry-card.is-selected{border-color:var(--qg-purple,#8A50CF);box-shadow:0 0 0 2px rgba(138,80,207,.10)}
.qg-doc-dialog{width:min(680px,calc(100vw - 28px));max-height:88vh;padding:0;border:0;border-radius:18px;background:var(--qg-light-card,#fff);color:var(--qg-light-text,#172033);box-shadow:0 24px 60px rgba(16,24,40,.28)}
.qg-doc-dialog::backdrop{background:rgba(16,24,40,.55)}
.qg-doc-dialog-head{display:flex;justify-content:space-between;gap:16px;padding:20px 22px;border-bottom:1px solid var(--qg-light-line,#E4E9F2)}
.qg-doc-dialog-head h2{margin:0 0 4px}.qg-doc-dialog-head p{margin:0;color:var(--qg-light-muted,#697386)}
.qg-doc-dialog-body{padding:20px 22px}
.qg-doc-qr-video{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#101828;border-radius:12px;margin-bottom:12px}
.qg-doc-reader-status{padding:10px 12px;border-radius:10px;background:var(--qg-light-bg,#F5F7FB);color:var(--qg-light-muted,#697386);margin-bottom:12px}
.qg-doc-review-form{padding:18px}.qg-doc-origin-strip{display:flex;flex-wrap:wrap;gap:8px 18px;padding:12px 14px;border-radius:10px;background:var(--qg-light-bg,#F5F7FB);margin-bottom:18px;font-size:.86rem}
.qg-doc-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:24px 0 10px}.qg-doc-section-head h3{margin:0}.qg-doc-section-head p{margin:3px 0 0;color:var(--qg-light-muted,#697386)}
.qg-doc-items{display:grid;gap:10px}.qg-doc-item-row{display:grid;grid-template-columns:minmax(220px,2fr) repeat(6,minmax(90px,1fr)) auto;gap:8px;padding:12px;border:1px solid var(--qg-light-line,#E4E9F2);border-radius:12px;align-items:end}
.qg-doc-item-row label{min-width:0}.qg-doc-item-description{min-width:220px}.qg-doc-delete{display:flex;align-items:center;gap:5px;padding-bottom:10px}
.qg-doc-raw{margin-top:18px}.qg-doc-raw pre{white-space:pre-wrap;max-height:320px;overflow:auto;background:var(--qg-light-bg,#F5F7FB);padding:12px;border-radius:10px}
.qg-doc-final-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.qg-doc-review-actions{margin-top:12px}
[data-theme="dark"] .qg-doc-entry,[data-theme="dark"] .qg-doc-reader-status,[data-theme="dark"] .qg-doc-origin-strip,[data-theme="dark"] .qg-doc-raw pre{background:var(--qg-dark-elevated,#24314B);border-color:var(--qg-dark-border,#344054)}
[data-theme="dark"] .qg-doc-entry-card,[data-theme="dark"] .qg-doc-dialog{background:var(--qg-dark-card,#172033);color:var(--qg-dark-text,#fff);border-color:var(--qg-dark-border,#344054)}
[data-theme="dark"] .qg-doc-dialog-head,[data-theme="dark"] .qg-doc-item-row{border-color:var(--qg-dark-border,#344054)}
[data-theme="dark"] .qg-doc-entry-head small,[data-theme="dark"] .qg-doc-entry-card small,[data-theme="dark"] .qg-doc-dialog-head p,[data-theme="dark"] .qg-doc-reader-status,[data-theme="dark"] .qg-doc-section-head p{color:var(--qg-dark-muted,#98A2B3)}
@media(max-width:900px){.qg-doc-item-row{grid-template-columns:1fr 1fr}.qg-doc-item-description{grid-column:1/-1}.qg-doc-entry-actions{grid-template-columns:1fr}}
@media(max-width:600px){.qg-doc-item-row,.qg-doc-final-grid{grid-template-columns:1fr}.qg-doc-entry{padding:10px}.qg-doc-dialog-body{padding:16px}.qg-doc-entry-card{min-height:72px}}
/* Preferência de conta: ação curta e reconhecível. */
.qg-preferred-action{border:0;background:transparent;color:#837577;cursor:pointer;font-size:1.35rem;line-height:1;min-width:32px;min-height:32px;padding:3px 6px;border-radius:8px}.qg-preferred-action:hover,.qg-preferred-action:focus-visible{background:rgba(131,117,119,.12);color:#837577}.qg-preferred-action.is-preferred{color:#E6B624}.qg-preferred-action.is-preferred:hover,.qg-preferred-action.is-preferred:focus-visible{background:rgba(230,182,36,.14);color:#E6B624}.settings-card-actions .qg-preferred-action{margin-right:2px}

/* M07.15.2.21 — Outras fontes acompanha a cor neutra do texto em claro/escuro. */
.other-source-badge{background:var(--qg-surface-elevated)!important;border-color:var(--qg-border)!important;color:var(--qg-text)!important}
[data-theme="dark"] .other-source-badge{background:var(--qg-dark-elevated,#24314B)!important;border-color:var(--qg-dark-border,#344054)!important;color:var(--qg-dark-text,#fff)!important}
.other-source-tag{background:color-mix(in srgb,var(--source-color,#3995CF) 16%,transparent)!important;border:1px solid var(--source-color,#3995CF)!important;color:var(--qg-text)!important;white-space:nowrap}
.other-source-tag::before{content:'';display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--source-color,#3995CF);margin-right:.3rem;vertical-align:middle}
.other-source-extra-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto auto;gap:10px;align-items:end;margin-top:10px}
@media(max-width:680px){.other-source-extra-row{grid-template-columns:1fr 1fr}.other-source-extra-row .remove-other-source{grid-column:1/-1}}

/* M07.15.2.44 — alinhamento consistente das opções com checkbox. */
.form-grid label:has(input[type="checkbox"]){
  display:flex;
  align-items:flex-start;
  gap:9px;
  line-height:1.35;
}
.form-grid label:has(input[type="checkbox"]) input[type="checkbox"]{
  display:inline-block;
  flex:0 0 18px;
  width:18px!important;
  height:18px;
  margin:2px 0 0!important;
}
.form-grid label:has(input[type="checkbox"])>span{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
.form-grid label:has(input[type="checkbox"])>small{
  flex:1 1 100%;
}
.transaction-more-grid>.transaction-expense-option,
.transaction-more-grid>.transaction-recurring-option,
.transaction-more-grid>.other-payment-source-box{
  align-items:flex-start;
}
.card-installment-toggle,
.other-payment-source-toggle{
  display:grid!important;
  grid-template-columns:1fr;
  gap:6px!important;
}