/**
 * [Layer: MOBILE]
 * Original path: styles/mobile.css
 * New path: styles/mobile/mobile.css
 * Talune Architecture Refactoring — 2026-03
 */
/* ================================================================
   Talune — mobile.css
   Layout exclusivo mobile/tablet. Não afeta o desktop (runtime.css).
   Carregado somente em telas ≤ 1024px via <link media="...">.
   ================================================================ */

/* ── Hamburger button ── */
.mobileMenuToggle{
  position:fixed;
  top:7px;
  left:10px;
  z-index:115;
  width:38px;
  height:38px;
  border:none;
  border-radius:9px;
  background:transparent;
  cursor:pointer;
  padding:0;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  transition:background .15s;
  display:none;
}

/* ================================================================
   MOBILE HOTFIX PASS - 2026-03-26
   Goal:
   - keep only mobile-specific overrides
   - remove quick actions from Home
   - rebuild Saldos por Classe as a compact single-line list
   - fix Lancamentos header and mobile feed layout
   - give Contas and Investimentos a true mobile hierarchy
   ================================================================ */
@media (max-width:680px){

  :root{
    --talune-mobile-content-bottom: calc(var(--talune-mobile-nav-height) + 118px);
  }

  .mobileFab{
    width:46px !important;
    height:46px !important;
    right:12px !important;
    bottom:calc(var(--talune-mobile-nav-height) + 8px) !important;
  }

  .mobileFabDial{
    right:12px !important;
    bottom:calc(var(--talune-mobile-nav-height) + 62px) !important;
  }

  .workspacePanel{
    padding-bottom:calc(var(--talune-mobile-content-bottom) + 18px) !important;
  }

  /* Home */
  #pf-visao-geral{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 18px) !important;
  }

  #pf-visao-geral .pfQuickHero{
    padding:22px 14px 0 !important;
  }

  #pf-visao-geral .pfQuickGreeting{
    margin:0 0 18px !important;
    font-size:17px !important;
    line-height:1.18 !important;
  }

  #pf-visao-geral .pfQuickGrid{
    margin-top:0 !important;
    gap:10px !important;
  }

  #pf-visao-geral .pfQuickActionsBox{
    display:none !important;
  }

  #pf-visao-geral .pfPanelGrid{
    gap:12px !important;
    margin-top:12px !important;
  }

  #pf-visao-geral .pfWidget.pfInvestClassCard{
    padding:14px !important;
  }

  #pf-visao-geral .pfWidget.pfInvestClassCard .pfWidgetHead{
    margin-bottom:10px !important;
  }

  #pf-visao-geral .pfInvestTableWrap{
    padding:0 !important;
    overflow:visible !important;
  }

  #pf-visao-geral .pfInvestTable thead{
    display:none !important;
  }

  #pf-visao-geral .pfInvestTable,
  #pf-visao-geral .pfInvestTable tbody{
    display:block !important;
    width:100% !important;
  }

  #pf-visao-geral .pfInvestTable tbody tr{
    display:grid !important;
    grid-template-columns:8px minmax(0,1fr) auto auto !important;
    align-items:center !important;
    column-gap:8px !important;
    row-gap:0 !important;
    padding:7px 0 !important;
    margin:0 !important;
    border:none !important;
    border-radius:0 !important;
    background:none !important;
    box-shadow:none !important;
  }

  #pf-visao-geral .pfInvestTable tbody tr + tr{
    margin-top:2px !important;
  }

  #pf-visao-geral .pfInvestTable tbody td{
    padding:0 !important;
    border:none !important;
    min-width:0 !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(1){
    align-self:center !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(2){
    font-size:13px !important;
    line-height:1.28 !important;
    font-weight:600 !important;
    color:#e9eef7 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    padding-right:4px !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(3){
    font-size:13px !important;
    font-weight:700 !important;
    text-align:right !important;
    white-space:nowrap !important;
    color:#f6fbff !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(4){
    font-size:11px !important;
    font-weight:600 !important;
    text-align:right !important;
    white-space:nowrap !important;
    color:rgba(226,232,240,.62) !important;
    padding-left:6px !important;
  }

  /* Lancamentos */
  #pf-lancamentos{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 18px) !important;
  }

  #pf-lancamentos .pfLaunchHeader{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:12px !important;
    padding:16px 14px 10px !important;
  }

  #pf-lancamentos .pfLaunchTitleWrap{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
  }

  #pf-lancamentos .pfLaunchTitle{
    margin:0 !important;
    font-size:20px !important;
    line-height:1.15 !important;
  }

  #pf-lancamentos .pfLaunchAddBtn{
    display:none !important;
  }

  #pf-lancamentos .pfLaunchMonthShell,
  #pf-lancamentos .pfLaunchMonthNav{
    width:100% !important;
  }

  #pf-lancamentos .pfLaunchMonthNav{
    min-height:46px !important;
  }

  #pfw-launch-month-caption{
    font-size:15px !important;
    line-height:1.1 !important;
    padding:0 10px !important;
  }

  #pf-lancamentos .pfLaunchTableWrap{
    padding:0 14px !important;
    overflow:visible !important;
  }

  #pfw-tx-table{
    min-width:0 !important;
  }

  #pfw-tx-table thead{
    display:none !important;
  }

  #pfw-tx-table,
  #pfw-tx-table tbody{
    display:block !important;
    width:100% !important;
  }

  #pfw-tx-table tbody tr{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "date date"
      "desc value"
      "category category"
      "account account"
      "status status" !important;
    column-gap:10px !important;
    row-gap:7px !important;
    align-items:start !important;
    padding:14px !important;
    margin:0 0 10px !important;
    border:1px solid rgba(255,255,255,.07) !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.03) !important;
    box-shadow:0 8px 18px rgba(0,0,0,.16) !important;
  }

  #pfw-tx-table tbody tr:last-child{
    margin-bottom:0 !important;
  }

  #pfw-tx-table tbody td{
    min-width:0 !important;
    padding:0 !important;
    border:none !important;
  }

  #pfw-tx-table tbody td:nth-child(1){
    grid-area:date !important;
    display:block !important;
    font-size:11px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    letter-spacing:.02em !important;
    text-transform:none !important;
    color:rgba(226,232,240,.54) !important;
  }

  #pfw-tx-table tbody td:nth-child(2){
    grid-area:desc !important;
    font-size:16px !important;
    line-height:1.25 !important;
    font-weight:700 !important;
    color:#f8fbff !important;
    white-space:normal !important;
    overflow:visible !important;
    display:block !important;
  }

  #pfw-tx-table tbody td:nth-child(3){
    grid-area:category !important;
    display:block !important;
  }

  #pfw-tx-table tbody td:nth-child(4){
    grid-area:account !important;
    display:block !important;
  }

  #pfw-tx-table tbody td:nth-child(5){
    grid-area:status !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
  }

  #pfw-tx-table tbody td:nth-child(6){
    grid-area:value !important;
    align-self:start !important;
    text-align:right !important;
    font-size:16px !important;
    font-weight:700 !important;
    white-space:nowrap !important;
  }

  #pfw-tx-table .pfTxCategory{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    min-width:0 !important;
  }

  #pfw-tx-table .pfTxCategoryIcon{
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
    border-radius:999px !important;
  }

  #pfw-tx-table .pfTxCategoryLabel{
    display:block !important;
    font-size:12.5px !important;
    line-height:1.3 !important;
    font-weight:600 !important;
    color:rgba(226,232,240,.72) !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }

  #pfw-tx-table .pfTxAccount,
  #pfw-tx-table .pfTxAccountTransfer{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    flex-wrap:wrap !important;
    min-width:0 !important;
  }

  #pfw-tx-table .pfTxAccountIcon{
    width:16px !important;
    height:16px !important;
    min-width:16px !important;
  }

  #pfw-tx-table .pfTxAccountLabel{
    display:block !important;
    font-size:12.5px !important;
    line-height:1.3 !important;
    color:rgba(226,232,240,.60) !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }

  #pfw-tx-table .pfTxStatusWrap{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
  }

  #pfw-tx-table .pfStatusBtn{
    padding:5px 12px !important;
    font-size:10px !important;
    letter-spacing:.12em !important;
  }

  #pfw-tx-table .pfTxEditBtn,
  #pfw-tx-table .pfTxDeleteBtn{
    display:none !important;
  }

  /* Contas e cartoes */
  #pf-contas{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 18px) !important;
  }

  #pf-contas .pfCardsGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:0 14px !important;
  }

  #pf-contas #pfw-accounts-grid .pfSmallCard.accountCard,
  #pf-contas #pfw-cards-grid .pfSmallCard{
    display:block !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #pf-contas .pfEntityHead{
    display:grid !important;
    grid-template-columns:56px minmax(0,1fr) auto !important;
    align-items:start !important;
    gap:12px !important;
  }

  #pf-contas .pfEntityMedia{
    width:56px !important;
    min-width:56px !important;
  }

  #pf-contas .pfAccountThumb,
  #pf-contas #pfw-cards-grid .pfAccountThumb{
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    border-radius:18px !important;
    overflow:hidden !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:#fff !important;
  }

  #pf-contas .pfAccountThumb img,
  #pf-contas #pfw-cards-grid .pfAccountThumb img{
    width:100% !important;
    height:100% !important;
    display:block !important;
    object-fit:cover !important;
    opacity:1 !important;
    visibility:visible !important;
    filter:none !important;
    transform:scale(1.04) !important;
  }

  #pf-contas .pfEntityMain{
    min-width:0 !important;
  }

  #pf-contas .pfEntityName{
    font-size:15px !important;
    line-height:1.22 !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }

  #pf-contas .pfEntityInstitution,
  #pf-contas .pfEntityTypeBelow.cardType{
    font-size:12px !important;
    line-height:1.3 !important;
    white-space:normal !important;
    color:rgba(226,232,240,.64) !important;
  }

  #pf-contas .pfPrimaryFlag{
    margin:0 !important;
    align-self:start !important;
    justify-self:end !important;
  }

  #pf-contas .pfCardTopRow{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:8px !important;
  }

  #pf-contas .pfEntityValueBlock{
    padding-top:10px !important;
  }

  #pf-contas .pfAccountBottomRow{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  #pf-contas .pfAccountActions,
  #pf-contas .pfSmallActions{
    width:100% !important;
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }

  #pf-contas #pfw-cards-summary{
    margin:0 14px 10px !important;
  }

  /* Investimentos */
  #pf-investimentos{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 18px) !important;
  }

  #pf-investimentos .invDashShell{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
    margin:0 14px 12px !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .invDashKpiGrid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #pf-investimentos .invDashKpiCard{
    min-height:auto !important;
    padding:15px 14px !important;
    border-radius:16px !important;
  }

  #pf-investimentos .invDashKpiBottomSplit{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }

  #pf-investimentos .invDashPanels{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
  }

  #pf-investimentos .invDashPanel{
    min-height:auto !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .invDashPanelHead{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  #pf-investimentos .invDashPanelControls{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    gap:8px !important;
  }

  #pf-investimentos .invDashPeriodGroup{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:6px !important;
    width:100% !important;
    overflow-x:auto !important;
    padding-bottom:4px !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
  }

  #pf-investimentos .invDashPeriodGroup::-webkit-scrollbar{
    display:none !important;
  }

  #pf-investimentos .invDashPeriodBtn{
    flex:0 0 auto !important;
    min-width:48px !important;
  }

  #pf-investimentos .invDashSelect{
    width:100% !important;
    min-height:42px !important;
  }

  #pf-investimentos .invDashInsights{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  #pf-investimentos #inv-dash-evolution-chart{
    min-height:250px !important;
    height:250px !important;
  }

  #pf-investimentos .section.collapsible{
    margin:0 14px 12px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .section.collapsible .sectionHead{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "lead actions"
      "summary summary" !important;
    gap:12px !important;
    padding:14px !important;
  }

  #pf-investimentos .invSectionLead{
    grid-area:lead !important;
    display:grid !important;
    grid-template-columns:40px minmax(0,1fr) !important;
    gap:10px !important;
    align-items:flex-start !important;
    min-width:0 !important;
  }

  #pf-investimentos .invSectionBadge{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    border-radius:12px !important;
  }

  #pf-investimentos .invSectionText h2{
    font-size:17px !important;
    line-height:1.16 !important;
  }

  #pf-investimentos .invSectionDesc{
    display:none !important;
  }

  #pf-investimentos .invSectionHeadActions{
    grid-area:actions !important;
    align-self:start !important;
    justify-content:flex-end !important;
    gap:8px !important;
  }

  #pf-investimentos .invSectionSummary{
    grid-area:summary !important;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
  }

  #pf-investimentos .invSummaryMetric{
    padding:10px 12px !important;
    border-radius:14px !important;
    background:var(--panel) !important;
  }

  #pf-investimentos .invSummaryMetric strong{
    font-size:14px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  #pf-investimentos .sectionBody{
    padding:0 12px 12px !important;
  }

  #pf-investimentos .invTableWrap{
    max-height:none !important;
    overflow:visible !important;
    border-top:none !important;
    background:none !important;
    padding-top:2px !important;
  }

  #pf-investimentos .invDataTable{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    border-collapse:separate !important;
  }

  #pf-investimentos .invDataTable thead{
    display:none !important;
  }

  #pf-investimentos .invDataTable tbody{
    display:block !important;
    width:100% !important;
  }

  #pf-investimentos .invDataTable tbody tr{
    display:block !important;
    margin:0 0 10px !important;
    padding:12px !important;
    border:1px solid rgba(255,255,255,.07) !important;
    border-radius:16px !important;
    background:rgba(255,255,255,.025) !important;
  }

  #pf-investimentos .invDataTable tbody tr:last-child{
    margin-bottom:0 !important;
  }

  #pf-investimentos .invDataTable tbody td{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:6px 0 !important;
    border:none !important;
    font-size:13px !important;
    line-height:1.32 !important;
    min-width:0 !important;
  }

  #pf-investimentos .invDataTable tbody td:first-child{
    display:block !important;
    padding:0 0 10px !important;
    margin-bottom:4px !important;
    border-bottom:1px solid rgba(255,255,255,.06) !important;
  }

  #pf-investimentos .invDataTable tbody td:nth-child(2)::before{ content:"Qtd./Aportes"; }
  #pf-investimentos .invDataTable tbody td:nth-child(3)::before{ content:"Investido / Medio"; }
  #pf-investimentos .invDataTable tbody td:nth-child(4)::before{ content:"Atual"; }
  #pf-investimentos .invDataTable tbody td:nth-child(5)::before{ content:"Variacao"; }
  #pf-investimentos .invDataTable tbody td:nth-child(6)::before{ content:"Saldo / Resultado"; }

  #pf-investimentos .invDataTable tbody td:nth-child(2)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(3)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(4)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(5)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(6)::before{
    display:block !important;
    flex:0 0 auto !important;
    font-size:10px !important;
    font-weight:700 !important;
    letter-spacing:.1em !important;
    text-transform:uppercase !important;
    color:rgba(226,232,240,.52) !important;
  }

  #pf-investimentos .invDataTable tbody td:nth-child(7){
    justify-content:flex-end !important;
    padding-top:10px !important;
    margin-top:4px !important;
    border-top:1px solid rgba(255,255,255,.06) !important;
  }

  #pf-investimentos .invDataTable tbody td:nth-child(7)::before{
    display:none !important;
  }

  #pf-investimentos .invAssetCell{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    min-width:0 !important;
  }

  #pf-investimentos .invAssetLogo{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    border-radius:12px !important;
  }

  #pf-investimentos .invAssetMain{
    min-width:0 !important;
  }

  #pf-investimentos .invAssetName{
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }

  #pf-investimentos .invAssetMeta{
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }

  #pf-investimentos .invManualGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #pf-investimentos .invSectionFooter{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
    padding-top:4px !important;
  }

  #pf-investimentos .invFooterBtn{
    flex:1 1 calc(50% - 4px) !important;
    min-width:0 !important;
  }
}

/* ================================================================
   MOBILE FINAL PASS — correções de regressão
   Foco:
   · overview com respiro melhor e sem "Acesso rápido"
   · lançamentos em cards verticais estáveis
   · investimentos realmente empilhados no celular
   · contas/cartões com logos e hierarquia legíveis
   · config substituído por placeholder de perfil no mobile
   ================================================================ */
@media (max-width:680px){

  :root{
    --talune-mobile-content-bottom: calc(var(--talune-mobile-nav-height) + 112px);
  }

  .container{
    padding:calc(var(--talune-mobile-header-height) + 8px) 0 var(--talune-mobile-content-bottom) !important;
  }

  .workspacePanel{
    padding:0 0 calc(var(--talune-mobile-content-bottom) + 16px) !important;
  }

  .mobileNavLabel{
    font-size:9.5px !important;
    line-height:1.05 !important;
  }

  .mobileFab{
    width:48px !important;
    height:48px !important;
    right:14px !important;
    bottom:calc(var(--talune-mobile-nav-height) + 10px) !important;
    box-shadow:0 16px 34px rgba(29,185,116,.34) !important;
  }

  .mobileFabDial{
    right:14px !important;
    bottom:calc(var(--talune-mobile-nav-height) + 66px) !important;
  }

  /* Início */
  #pf-visao-geral{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 14px) !important;
  }

  #pf-visao-geral .pfQuickHero{
    padding:18px 14px 0 !important;
  }

  #pf-visao-geral .pfQuickGreeting{
    font-size:17px !important;
    margin-bottom:16px !important;
  }

  #pf-visao-geral .pfQuickGrid{
    margin-top:8px !important;
  }

  #pf-visao-geral .pfQuickActionsBox{
    display:none !important;
  }

  #pf-visao-geral .pfPanelGrid{
    gap:14px !important;
    margin-top:10px !important;
  }

  #pf-visao-geral .pfWidget.pfInvestClassCard{
    overflow:hidden !important;
  }

  #pf-visao-geral .pfInvestTableWrap{
    padding-top:4px !important;
  }

  #pf-visao-geral .pfInvestTable tbody tr{
    grid-template-columns:10px minmax(0,1fr) auto !important;
    grid-template-areas:
      "swatch name value"
      "swatch name pct" !important;
    align-items:center !important;
    column-gap:10px !important;
    row-gap:3px !important;
    padding:12px 12px !important;
    margin-bottom:8px !important;
    border:1px solid rgba(255,255,255,.06) !important;
    border-radius:14px !important;
    background:rgba(255,255,255,.025) !important;
  }

  #pf-visao-geral .pfInvestTable tbody tr:last-child{
    margin-bottom:0 !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(2){
    font-size:14px !important;
    font-weight:600 !important;
    line-height:1.26 !important;
    padding-right:8px !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(3){
    font-size:14px !important;
    font-weight:700 !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(4){
    font-size:11px !important;
    color:rgba(255,255,255,.56) !important;
  }

  #pf-visao-geral .pfSwatch{
    width:9px !important;
    height:9px !important;
    border-radius:999px !important;
  }

  /* Lançamentos */
  #pf-lancamentos{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 14px) !important;
  }

  #pf-lancamentos .pfLaunchHeader{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:12px !important;
    padding:16px 14px 10px !important;
  }

  #pf-lancamentos .pfLaunchTitleWrap{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    min-width:0 !important;
  }

  #pf-lancamentos .pfLaunchTitle{
    font-size:18px !important;
    line-height:1.15 !important;
  }

  #pf-lancamentos .pfLaunchMonthShell,
  #pf-lancamentos .pfLaunchMonthNav{
    width:100% !important;
  }

  #pfw-launch-month-caption{
    font-size:16px !important;
    padding:0 12px !important;
  }

  #pfw-tx-table tbody tr{
    grid-template-columns:44px minmax(0,1fr) auto !important;
    grid-template-areas:
      "date date date"
      "icon desc value"
      "icon meta status" !important;
    column-gap:12px !important;
    row-gap:5px !important;
    align-items:start !important;
    padding:14px 14px 12px !important;
    margin-bottom:10px !important;
    border:1px solid rgba(255,255,255,.06) !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.025) !important;
  }

  #pfw-tx-table tbody td:nth-child(1){
    font-size:11px !important;
    font-weight:600 !important;
    line-height:1.15 !important;
    letter-spacing:.01em !important;
    text-transform:none !important;
    color:rgba(255,255,255,.54) !important;
  }

  #pfw-tx-table tbody td:nth-child(2){
    font-size:15px !important;
    font-weight:600 !important;
    line-height:1.25 !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
  }

  #pfw-tx-table tbody td:nth-child(3){
    align-items:flex-start !important;
    justify-content:center !important;
    padding-top:2px !important;
  }

  #pfw-tx-table .pfTxCategoryLabel{
    display:none !important;
  }

  #pfw-tx-table .pfTxCategoryIcon{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    border-radius:14px !important;
  }

  #pfw-tx-table tbody td:nth-child(4){
    font-size:12px !important;
    line-height:1.32 !important;
    color:rgba(255,255,255,.56) !important;
    white-space:normal !important;
  }

  #pfw-tx-table td:nth-child(4) .pfTxAccount{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    max-width:100% !important;
  }

  #pfw-tx-table td:nth-child(4) .pfTxAccount:not(.pfTxAccountTransfer){
    gap:0 !important;
  }

  #pfw-tx-table td:nth-child(4) .pfTxAccount:not(.pfTxAccountTransfer) .pfTxAccountIcon{
    display:none !important;
  }

  #pfw-tx-table td:nth-child(4) .pfTxAccountLabel{
    display:-webkit-box !important;
    -webkit-line-clamp:1 !important;
    -webkit-box-orient:vertical !important;
    white-space:normal !important;
    overflow:hidden !important;
  }

  #pfw-tx-table tbody td:nth-child(5){
    display:flex !important;
    justify-content:flex-end !important;
    align-items:flex-end !important;
    align-self:end !important;
  }

  #pfw-tx-table .pfTxStatusWrap{
    width:auto !important;
    justify-content:flex-end !important;
  }

  #pfw-tx-table .pfStatusBtn{
    padding:4px 11px !important;
  }

  #pfw-tx-table tbody td:nth-child(6){
    font-size:16px !important;
    font-weight:700 !important;
    text-align:right !important;
    justify-self:end !important;
    align-self:center !important;
  }

  /* Contas e cartões */
  #pf-contas{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 14px) !important;
  }

  #pf-contas .pfSectionToolbar{
    padding:14px 14px 10px !important;
  }

  #pf-contas .section{
    margin:0 14px 12px !important;
    border-radius:18px !important;
  }

  #pf-contas .pfCardsSummary{
    margin:0 14px 10px !important;
    padding:14px !important;
    border-radius:16px !important;
  }

  #pf-contas .pfCardsGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:0 14px !important;
  }

  #pf-contas .pfSmallCard.accountCard,
  #pf-contas #pfw-cards-grid .pfSmallCard{
    padding:14px !important;
    border-radius:16px !important;
  }

  #pf-contas .pfEntityHead{
    display:flex !important;
    align-items:flex-start !important;
    gap:12px !important;
  }

  #pf-contas .pfEntityMain{
    min-width:0 !important;
    flex:1 1 auto !important;
  }

  #pf-contas .pfEntityName{
    font-size:15px !important;
    line-height:1.2 !important;
    white-space:normal !important;
  }

  #pf-contas .pfEntityInstitution{
    font-size:12px !important;
    line-height:1.3 !important;
  }

  #pf-contas .pfAccountThumb,
  #pf-contas #pfw-cards-grid .pfAccountThumb{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    border-radius:16px !important;
    overflow:hidden !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:#fff !important;
  }

  #pf-contas .pfAccountThumb img,
  #pf-contas #pfw-cards-grid .pfAccountThumb img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    transform:scale(1.08) !important;
    opacity:1 !important;
    visibility:visible !important;
  }

  #pf-contas .pfPrimaryFlag{
    margin-left:auto !important;
    align-self:flex-start !important;
  }

  #pf-contas .pfAccountBottomRow{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
  }

  #pf-contas .pfAccountRightCol,
  #pf-contas .pfAccountActions{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    width:100% !important;
  }

  #pf-contas .pfCardTopRow{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:8px !important;
  }

  #pf-contas .pfSmallActions{
    display:flex !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    width:100% !important;
    justify-content:flex-start !important;
  }

  #pf-contas .pfTinyBtn{
    min-height:34px !important;
  }

  /* Investimentos */
  #pf-investimentos{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 14px) !important;
  }

  #pf-investimentos .invDashShell{
    display:flex !important;
    flex-direction:column !important;
    margin:0 14px 14px !important;
    padding:14px !important;
    gap:12px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .invDashKpiGrid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #pf-investimentos .invDashKpiCard{
    min-height:auto !important;
    padding:15px 14px !important;
    border-radius:16px !important;
  }

  #pf-investimentos .invDashKpiBottomSplit{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }

  #pf-investimentos .invDashPanels{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
  }

  #pf-investimentos .invDashPanel{
    min-height:auto !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .invDashPanelHead{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  #pf-investimentos .invDashPanelControls{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    gap:8px !important;
  }

  #pf-investimentos .invDashLegend{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:8px !important;
  }

  #pf-investimentos .section.collapsible{
    margin:0 14px 12px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .section.collapsible .sectionHead{
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "lead actions"
      "summary summary" !important;
    gap:12px !important;
    align-items:start !important;
  }

  #pf-investimentos .invSectionLead{
    grid-template-columns:40px minmax(0,1fr) !important;
    gap:10px !important;
  }

  #pf-investimentos .invSectionHeadActions{
    align-self:start !important;
  }

  #pf-investimentos .invSectionSummary{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
  }

  #pf-investimentos .section.collapsible.open .sectionBody{
    padding:0 12px 12px !important;
  }

  #pf-investimentos .invTableWrap{
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }

  #pf-investimentos .invDataTable{
    min-width:620px !important;
  }

  /* Perfil mobile */
  #pf-config{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 14px) !important;
  }

  #pf-config .pfConfigShell{
    display:none !important;
  }

  #pf-config .mobileProfilePane{
    display:block !important;
    margin:0 14px 12px !important;
    padding:18px 16px !important;
    border-radius:20px !important;
    border:1px solid rgba(255,255,255,.07) !important;
    background:linear-gradient(180deg, rgba(9,14,23,.96) 0%, rgba(6,10,18,.98) 100%) !important;
    box-shadow:0 18px 38px rgba(0,0,0,.28) !important;
  }

  #pf-config .mobileProfileHero{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    padding:20px 0 18px !important;
    text-align:center !important;
  }

  #pf-config .mobileProfileAvatar{
    width:72px !important;
    height:72px !important;
    border-radius:22px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color:#9ae6b4 !important;
    background:radial-gradient(circle at 30% 30%, rgba(29,185,116,.28), rgba(29,185,116,.08) 60%, rgba(255,255,255,.03) 100%) !important;
    border:1px solid rgba(29,185,116,.24) !important;
    box-shadow:0 16px 34px rgba(29,185,116,.18) !important;
  }

  #pf-config .mobileProfileTitle{
    font-size:18px !important;
    font-weight:700 !important;
    color:#f8fafc !important;
  }

  #pf-config .mobileProfileSub,
  #pf-config .mobileProfileEmpty{
    font-size:12px !important;
    line-height:1.5 !important;
    color:rgba(226,232,240,.68) !important;
    text-align:center !important;
  }

  #pf-config .mobileProfileEmpty{
    padding-top:14px !important;
    border-top:1px solid rgba(255,255,255,.06) !important;
  }
}
.mobileMenuToggle:hover{ background:rgba(255,255,255,.07); }
.mobileMenuToggle span{
  display:block;
  width:17px;
  height:2px;
  background:#c6ccd6;
  border-radius:2px;
  transition:transform .22s ease, opacity .18s ease, width .18s ease;
}
.mobileMenuToggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.mobileMenuToggle[aria-expanded="true"] span:nth-child(2){ opacity:0; width:0; }
.mobileMenuToggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ── Overlay ── */
.sidebarOverlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(4,7,12,.62);
  backdrop-filter:blur(3px);
  z-index:108;
}
.sidebarOverlay.active{ display:block; }

/* ================================================================
   DRAWER — max-width: 1024px  (tablet + mobile)
   ================================================================ */
@media (max-width:1024px){

  .mobileMenuToggle{ display:flex; }

  /* Container: encerra o grid de 2 colunas do desktop */
  .container{
    display:block !important;
    grid-template-columns:none !important;
    padding:16px 14px 40px !important;
  }

  /* Workspace panel: ocupa largura total */
  .workspacePanel{
    grid-column:unset !important;
    padding:0 0 4px !important;
  }
  .workspaceGlobalHeader{
    grid-column:unset !important;
    padding:0 0 12px !important;
  }
  .workspaceGlobalHeaderInner{
    gap:6px !important;
  }
  .workspaceGlobalHeaderActions{
    gap:6px !important;
  }

  /* Sidebar vira drawer */
  .unifiedSidebar{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    width:264px !important;
    height:100dvh !important;
    display:flex !important;
    flex-direction:column !important;
    gap:2px !important;
    padding:0 !important;
    background:#08101a !important;
    border-right:1px solid rgba(255,255,255,.07) !important;
    border-radius:0 !important;
    box-shadow:8px 0 40px rgba(0,0,0,.55) !important;
    z-index:110 !important;
    transform:translateX(-100%) !important;
    transition:transform .26s cubic-bezier(.4,0,.2,1) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    overscroll-behavior:contain !important;
    scrollbar-width:thin !important;
    scrollbar-color:rgba(138,154,176,.2) transparent !important;
  }
  .unifiedSidebar.sidebar-open{
    transform:translateX(0) !important;
  }

  /* Gradient decorativo — desativado no drawer (brand div assume) */
  .unifiedSidebar::before{ display:none !important; }
  .unifiedSidebar::after{ display:none !important; }

  /* Brand header no drawer: recua para o hamburger */
  .unifiedSidebarBrand{
    padding-left:56px !important;
    background:linear-gradient(180deg,#0c1420 0%,#070d18 100%) !important;
  }

  /* Section labels no drawer */
  .unifiedNavSection{
    padding:14px 16px 4px !important;
  }

  /* Botões nav no drawer */
  .unifiedNavBtn{
    width:100% !important;
    min-height:40px !important;
    font-size:13px !important;
    font-weight:500 !important;
    padding:8px 16px !important;
    border-radius:0 !important;
    color:#4e6075 !important;
    background:transparent !important;
    gap:10px !important;
    position:relative !important;
  }
  .unifiedNavBtn:hover{
    color:#c5d4e8 !important;
    background:rgba(255,255,255,.04) !important;
  }
  .unifiedNavBtn.active{
    color:#2ecc7a !important;
    background:rgba(28,157,96,.1) !important;
    font-weight:600 !important;
  }
  .unifiedNavBtn.active::before{
    content:"" !important;
    position:absolute !important;
    left:0 !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    height:54% !important;
    width:3px !important;
    background:#1db974 !important;
    border-radius:0 3px 3px 0 !important;
    box-shadow:0 0 12px rgba(29,185,116,.5) !important;
  }
  .unifiedNavIcon{
    width:16px !important;
    height:16px !important;
    flex-basis:16px !important;
    flex-shrink:0 !important;
    opacity:.45 !important;
    transition:opacity .12s !important;
  }
  .unifiedNavBtn:hover .unifiedNavIcon{ opacity:.7 !important; }
  .unifiedNavBtn.active .unifiedNavIcon{
    opacity:1 !important;
    color:#1c9d60 !important;
  }
  .unifiedNavCaret{
    margin-left:auto !important;
    width:14px !important;
    height:14px !important;
    color:rgba(197,212,232,.72) !important;
  }
  .unifiedNavBtnExpandable[aria-expanded="true"] .unifiedNavCaret{
    transform:rotate(180deg) !important;
  }
  .unifiedNavSubmenu{
    padding:0 10px 8px 38px !important;
    gap:4px !important;
  }
  .unifiedNavSubBtn{
    width:100% !important;
    min-height:32px !important;
    border:none !important;
    border-radius:9px !important;
    background:transparent !important;
    color:#90a7bf !important;
    padding:0 10px !important;
    font-size:12px !important;
    text-align:left !important;
  }
  .unifiedNavSubBtn.active{
    background:rgba(28,157,96,.12) !important;
    color:#eefaf3 !important;
    box-shadow:inset 0 0 0 1px rgba(28,157,96,.18) !important;
  }
  .unifiedNavIcon svg{
    width:16px !important;
    height:16px !important;
  }

  /* Divisor antes dos workspaces no drawer */
  .unifiedSidebar .unifiedNavBtn[data-unified-workspace="indicadores"]{
    margin-top:4px !important;
    border-top:1px solid rgba(255,255,255,.06) !important;
  }

  /* Grids tablet (2–3 colunas) */
  .pfPanelGrid,
  #pf-visao-geral .pfPanelGrid{
    grid-template-columns:repeat(auto-fit, minmax(280px,1fr)) !important;
  }
  .macroGrid,
  #workspace-indicadores .macroGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
  .pfCardsGrid{
    grid-template-columns:repeat(auto-fit, minmax(280px,1fr)) !important;
  }
  .pfCalendarWrap,
  .pfConfigGrid,
  .pfConfigMenu,
  .calcShell{
    grid-template-columns:1fr !important;
  }
}

/* ================================================================
   MOBILE — max-width: 680px
   Layout completamente diferente do desktop:
   · Barra fixa no topo (reaproveitando #workspace-nav como header)
   · Hamburger integrado ao topo
   · Subnav sticky abaixo do header
   · Conteúdo full-width em coluna única
   ================================================================ */
@media (max-width:680px){

  /* ── Container: padding-top = altura do header fixo ── */
  .container{
    padding:52px 0 32px !important;
  }

  /* ── Header fixo no topo (workspace bar reproposta como app bar) ── */
  #workspace-nav.workspaceBar{
    display:flex !important;
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    height:52px !important;
    padding:0 14px 0 56px !important;
    align-items:center !important;
    gap:8px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    flex-wrap:nowrap !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none !important;
    background:#07080f !important;
    border-bottom:1px solid rgba(255,255,255,.07) !important;
    z-index:100 !important;
    margin:0 !important;
  }
  #workspace-nav.workspaceBar::-webkit-scrollbar{ display:none; }

  /* Abas de workspace no header */
  .workspaceBtn{
    flex-shrink:0 !important;
    padding:5px 14px !important;
    font-size:12.5px !important;
    font-weight:500 !important;
    border-radius:7px !important;
    height:32px !important;
    display:inline-flex !important;
    align-items:center !important;
    white-space:nowrap !important;
  }

  /* ── Hamburger: encaixado sobre o header ── */
  .mobileMenuToggle{
    top:7px !important;
    left:10px !important;
    z-index:115 !important;
    width:38px !important;
    height:38px !important;
    border:none !important;
    background:transparent !important;
  }
  .mobileMenuToggle:hover{ background:rgba(255,255,255,.06) !important; }

  /* ── Workspace panel ── */
  .workspacePanel{
    padding:0 12px 4px !important;
  }
  .workspaceGlobalHeader{
    padding:6px 12px 8px !important;
  }
  .workspaceGlobalHeaderInner{
    flex-wrap:wrap !important;
  }

  /* ── Subnav PF: sticky abaixo do header ── */
  #pf-subnav{
    position:sticky !important;
    top:52px !important;
    z-index:90 !important;
    background:#07080f !important;
    border-bottom:1px solid rgba(255,255,255,.06) !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none !important;
    gap:4px !important;
    padding:8px 12px !important;
    margin:0 -12px !important;
  }
  #pf-subnav::-webkit-scrollbar{ display:none; }

  /* Override das regras desktop que ocultam o subnav */
  #workspace-pf > #pf-subnav{
    display:flex !important;
    justify-content:flex-start !important;
    border:none !important;
    border-radius:0 !important;
    background:#07080f !important;
    box-shadow:0 3px 12px rgba(0,0,0,.45) !important;
    padding:8px 12px !important;
  }
  #workspace-pf > #pf-subnav .subnavBtn{
    display:inline-flex !important;
    flex-shrink:0 !important;
    padding:5px 12px !important;
    font-size:12px !important;
    border-radius:7px !important;
    white-space:nowrap !important;
    height:30px !important;
    align-items:center !important;
  }
  #pf-subnav .subnavRightControls{
    flex-shrink:0 !important;
    margin-left:auto !important;
  }

  /* ── Layouts de conteúdo mobile ── */

  /* Overview: hero coluna única */
  .pfQuickHero{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }
  /* Quick cards: 2 colunas */
  .pfQuickGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:7px !important;
    align-items:stretch !important;
  }
  #pf-visao-geral .pfQuickHero{
    padding:14px 16px 4px !important;
  }
  #pf-visao-geral .pfQuickCard .v{
    font-size:17px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    line-height:1.05 !important;
  }
  #pf-visao-geral .pfQuickCard{
    min-height:94px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;
  }
  #pf-visao-geral .pfQuickCard .k{
    font-size:10px !important;
    line-height:1.2 !important;
  }
  #pf-visao-geral .pfQuickCard .s{
    font-size:10px !important;
    line-height:1.25 !important;
    margin-top:6px !important;
  }
  .pfQuickGreeting{ font-size:22px !important; line-height:1.05 !important; }

  /* Quick actions: row wrap */
  #pf-visao-geral .pfQuickActionsBox{
    min-height:auto !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
    gap:8px !important;
    padding:10px 12px !important;
  }
  #pf-visao-geral .pfQuickActionsBox .ttl{
    width:100%;
    text-align:center;
  }

  /* Panel grid: coluna única */
  .pfPanelGrid,
  #pf-visao-geral .pfPanelGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  /* Tabela de lançamentos: bloco responsivo (layout 2 linhas via mobile shell) */
  #pf-lancamentos .pfTable{ min-width:0 !important; width:100% !important; }

  /* Modais: coluna única */
  .finModalBody{ grid-template-columns:1fr !important; }
  .finModal#pf-card-modal #pfw-card-closing-day-wrap,
  .finModal#pf-card-modal #pfw-card-closing-offset-wrap,
  .finModal#pf-card-modal #pfw-card-due-day-wrap,
  .finModal#pf-card-modal #pfw-card-due-offset-wrap,
  .finModal#pf-card-modal #pfw-card-due-business-wrap{ grid-column:1 !important; }
  .finModalFoot{ flex-wrap:wrap !important; gap:8px !important; }

  /* Cards grid: coluna única */
  .pfCardsGrid{ grid-template-columns:1fr !important; }

  /* KPI grid: 2 colunas */
  .wsKpiGrid{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; }

  /* Investimentos */
  #pf-investimentos .invDashShell{
    grid-template-columns:1fr !important;
    padding:10px !important;
    gap:8px !important;
    overflow-x:hidden !important;
    overflow-y:visible !important;
  }
  #pf-investimentos .invDashKpiGrid{ grid-template-columns:1fr 1fr !important; gap:6px !important; }
  #pf-investimentos .invDashKpiCard{ min-height:64px !important; padding:8px 10px !important; }
  #pf-investimentos .invDashKpiValue{
    font-size:13px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    max-width:100% !important;
    display:block !important;
    text-align:left !important;
    line-height:1.12 !important;
  }
  #pf-investimentos .invDashKpiTitle{ font-size:9px !important; }
  #pf-investimentos .invDashPanel{
    min-height:200px !important;
    padding:10px !important;
    overflow-x:hidden !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    min-width:0 !important;
  }
  #pf-investimentos #inv-dash-evolution-chart{
    min-height:180px !important;
    width:100% !important;
    max-width:100% !important;
  }
  #pf-investimentos .invDashPanelHead h3{ font-size:14px !important; }
  #pf-investimentos .invDashPanelHead{
    align-items:flex-start !important;
    gap:8px !important;
    flex-wrap:wrap !important;
  }
  #pf-investimentos .invDashPanelControls{
    gap:4px !important;
    flex-wrap:wrap !important;
  }
  #pf-investimentos .invDashPeriodBtn{
    padding:4px 8px !important;
    font-size:11px !important;
  }
  #pf-investimentos .invTableWrap{
    max-height:280px !important;
    overflow-x:auto !important;
  }
  #pf-investimentos .invDataTable{
    font-size:12px !important;
    min-width:420px;
  }
  #pf-investimentos .invDataTable thead th,
  #pf-investimentos .invDataTable tbody td{
    padding:8px 10px !important;
    white-space:nowrap !important;
  }
  #pf-investimentos .section.collapsible .sectionHead{
    padding:10px 12px !important;
  }
  #pf-investimentos .invAssetTable,
  #pf-investimentos .invClassTable{
    display:block !important;
    overflow-x:auto !important;
    font-size:12px !important;
  }
  #pf-investimentos .invDashInsights{
    grid-template-columns:1fr 1fr !important;
  }
  #pf-investimentos .invSectionSummary{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }
  #pf-investimentos .invSummaryMetric strong{
    font-size:13px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  /* Workspace head */
  .wsHead{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:8px !important;
    padding:12px !important;
  }
  .wsActions{ justify-content:flex-end !important; flex-wrap:wrap !important; }
  .wsFilterBar{ flex-wrap:wrap !important; gap:6px !important; }

  /* Documentação */
  #pf-documentacao .pfDocsMd pre{ font-size:12px !important; padding:12px 14px !important; }
  #pf-documentacao .pfDocsMd table{ display:block !important; overflow-x:auto !important; }
  #pf-documentacao .pfDocsContent{ padding:14px !important; }

  /* Previne zoom em inputs no iOS */
  input[type="text"], input[type="number"], input[type="email"],
  input[type="password"], input[type="date"], input[type="search"],
  select, textarea{ font-size:16px !important; }
}

/* ================================================================
   TABLET — min-width: 681px e max-width: 1024px
   ================================================================ */
@media (min-width:681px) and (max-width:1024px){
  .pfQuickHero{ grid-template-columns:1.55fr .72fr !important; }
  .pfQuickGrid{ grid-template-columns:repeat(3, minmax(0,1fr)) !important; }
  .wsKpiGrid{ grid-template-columns:repeat(3, minmax(0,1fr)) !important; }
}

/* ================================================================
   EXTRA PEQUENO — max-width: 420px
   ================================================================ */
@media (max-width:420px){
  .pfQuickGrid{ grid-template-columns:1fr !important; }
  .wsKpiGrid{ grid-template-columns:1fr !important; }
  .subnavBtn{ font-size:11px !important; padding:5px 9px !important; }
}

/* ================================================================
   MOBILE SHELL — Separação real desktop/mobile
   Estrutura própria: header fixo + FAB + bottom nav
   Ativa somente em max-width:680px
   ================================================================ */

/* Por padrão, mobile shell é oculto (desktop) */
.mobileShell{ display:none; }

@media (max-width:680px){

  :root{
    --talune-mobile-safe-top: env(safe-area-inset-top, 0px);
    --talune-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
    --talune-mobile-header-core: 58px;
    --talune-mobile-header-height: calc(var(--talune-mobile-header-core) + var(--talune-mobile-safe-top));
    --talune-mobile-nav-core: 68px;
    --talune-mobile-nav-height: calc(var(--talune-mobile-nav-core) + var(--talune-mobile-safe-bottom));
    --talune-mobile-fab-gap: 12px;
  }

  /* ── Ativa mobile shell ── */
  /* position e z-index removidos: evita stacking context que prendia os filhos fixed
     (bottom nav z=130, FAB z=140) dentro de um contexto z=0, deixando-os cobertos por
     conteúdo externo. Sem z-index explícito, os filhos fixed participam do root context. */
  .mobileShell{
    display:block;
  }

  html, body{
    background:#07080f;
  }

  /* ── Oculta chrome desktop ── */
  #workspace-nav.workspaceBar{ display:none !important; }
  #workspace-global-header{ display:none !important; }
  #pf-subnav,
  #workspace-pf > #pf-subnav{ display:none !important; }
  .mobileMenuToggle{ display:none !important; }
  #unified-sidebar{ display:none !important; }
  #sidebar-overlay{ display:none !important; }

  /* ── Container: espaço para header (58px) + bottom nav (68px) ── */
  .container{
    padding:calc(var(--talune-mobile-header-height) + 8px) 0 calc(var(--talune-mobile-nav-height) + 10px) !important;
  }

  /* ── Mobile Header ── */
  .mobileHeader{
    position:fixed;
    top:0; left:0; right:0;
    min-height:var(--talune-mobile-header-height);
    height:auto;
    z-index:130;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    padding:calc(var(--talune-mobile-safe-top) + 8px) 14px 10px 16px;
    background:rgba(7,8,15,.96);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(255,255,255,.07);
    box-shadow:0 10px 28px rgba(0,0,0,.28);
  }
  .mobileHeaderBrand{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    flex:1 1 auto;
  }
  .mobileHeaderLogo{
    display:flex;
    align-items:center;
    flex-shrink:0;
  }
  .mobileHeaderBrandText{
    display:flex;
    flex-direction:column;
    gap:0;
    min-width:0;
  }
  .mobileHeaderTitle{
    font-size:15px;
    font-weight:700;
    color:#f0f0f0;
    line-height:1.1;
    letter-spacing:.02em;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .mobileHeaderSub{
    font-size:11px;
    color:rgba(255,255,255,.45);
    line-height:1.2;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .mobileHeaderActions{
    display:flex;
    align-items:center;
    gap:8px;
    flex-shrink:0;
  }
  .mobileHeaderBtn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:40px; height:40px;
    border-radius:14px;
    border:none;
    background:rgba(255,255,255,.04);
    color:rgba(255,255,255,.7);
    cursor:pointer;
    transition:background .15s, color .15s;
  }
  .mobileHeaderBtn:hover,
  .mobileHeaderBtn:focus-visible{
    background:rgba(255,255,255,.08);
    color:#fff;
  }
  .mobileHeaderBtn.spinning svg{
    animation:mobileSpinAnim .7s linear infinite;
  }
  @keyframes mobileSpinAnim{
    to{ transform:rotate(360deg); }
  }

  /* ── Connection dot ── */
  .mobileConnDot{
    width:8px; height:8px;
    border-radius:50%;
    background:rgba(255,255,255,.2);
    flex-shrink:0;
  }
  .mobileConnDot.connected{ background:#1db974; }
  .mobileConnDot.error{ background:#e05252; }
  .mobileConnDot.syncing{
    background:#1db974;
    animation:mobileConnPulse 1s ease-in-out infinite;
  }
  @keyframes mobileConnPulse{
    0%,100%{ opacity:1; }
    50%{ opacity:.3; }
  }

  /* ── Bottom Navigation ── */
  .mobileBottomNav{
    position:fixed;
    bottom:0; left:0; right:0;
    height:var(--talune-mobile-nav-height);
    min-height:var(--talune-mobile-nav-height);
    padding:6px 6px var(--talune-mobile-safe-bottom);
    z-index:130;
    display:grid;
    grid-template-columns:repeat(5, minmax(0, 1fr));
    align-items:center;
    gap:2px;
    background:rgba(7,8,15,.96);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border-top:1px solid rgba(255,255,255,.07);
    box-shadow:0 -10px 28px rgba(0,0,0,.24);
  }
  .mobileNavTab{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    height:62px;
    padding:0;
    border:none;
    background:transparent;
    color:rgba(255,255,255,.4);
    cursor:pointer;
    min-width:44px;
    border-radius:14px;
    transition:color .15s;
    -webkit-tap-highlight-color:transparent;
  }
  .mobileNavTab:hover,
  .mobileNavTab:focus-visible{
    color:rgba(255,255,255,.7);
  }
  .mobileNavTab.active{
    color:#1db974;
    background:rgba(29,185,116,.08);
  }
  .mobileNavIcon{
    flex-shrink:0;
    transition:transform .15s;
  }
  .mobileNavTab.active .mobileNavIcon{
    transform:scale(1.1);
  }
  .mobileNavLabel{
    font-size:10px;
    font-weight:500;
    line-height:1;
    letter-spacing:.01em;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* ── FAB (Floating Action Button) ── */
  .mobileFab{
    position:fixed;
    bottom:calc(var(--talune-mobile-nav-height) + var(--talune-mobile-fab-gap));
    left:50%;
    transform:translateX(-50%);
    width:56px; height:56px;
    border-radius:50%;
    border:none;
    background:linear-gradient(135deg, #1db974, #16a05e);
    color:#fff;
    box-shadow:0 10px 28px rgba(29,185,116,.32);
    cursor:pointer;
    z-index:140;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s;
    -webkit-tap-highlight-color:transparent;
  }
  .mobileFab:hover,
  .mobileFab:focus-visible{
    box-shadow:0 12px 30px rgba(29,185,116,.42);
  }
  .mobileFab.fab-open{
    transform:translateX(-50%) rotate(45deg);
  }
  .mobileFabSvg{
    position:absolute;
    transition:opacity .15s, transform .15s;
  }
  .mfab-plus{ opacity:1; transform:scale(1); }
  .mfab-close{ opacity:0; transform:scale(.5); }
  .mobileFab.fab-open .mfab-plus{ opacity:0; transform:scale(.5); }
  .mobileFab.fab-open .mfab-close{ opacity:1; transform:scale(1); }

  /* ── FAB Speed Dial ── */
  .mobileFabBackdrop{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.55);
    z-index:135;
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
  }
  .mobileFabBackdrop.fab-open{ display:block; }

  .mobileFabDial{
    position:fixed;
    bottom:calc(var(--talune-mobile-nav-height) + 82px);
    left:50%;
    transform:translateX(-50%);
    z-index:141;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    pointer-events:none;
    opacity:0;
    transition:opacity .15s;
  }
  .mobileFabDial.fab-open{
    pointer-events:auto;
    opacity:1;
  }
  .mobileFabDialItem{
    display:flex;
    align-items:center;
    gap:10px;
    border:none;
    background:rgba(18,20,32,.95);
    color:#f0f0f0;
    border-radius:24px;
    padding:10px 18px 10px 12px;
    font-size:13px;
    font-weight:500;
    cursor:pointer;
    white-space:nowrap;
    box-shadow:0 4px 16px rgba(0,0,0,.5);
    border:1px solid rgba(255,255,255,.09);
    transform:translateY(20px);
    opacity:0;
    transition:transform .2s cubic-bezier(.34,1.56,.64,1), opacity .15s;
    -webkit-tap-highlight-color:transparent;
    min-height:44px;
  }
  .mobileFabDialItem:nth-child(3){ transition-delay:.04s; }
  .mobileFabDialItem:nth-child(2){ transition-delay:.08s; }
  .mobileFabDialItem:nth-child(1){ transition-delay:.12s; }
  .mobileFabDial.fab-open .mobileFabDialItem{
    transform:translateY(0);
    opacity:1;
  }
  .mobileFabDialIcon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px; height:28px;
    border-radius:50%;
    background:rgba(255,255,255,.1);
    flex-shrink:0;
  }
  .mobileFabDialIcon--income{ background:rgba(29,185,116,.2); color:#1db974; }
  .mobileFabDialIcon--expense{ background:rgba(224,82,82,.15); color:#e05252; }

  /* ── Modais como bottom-sheet ── */
  .finModal .finModalCard{
    border-radius:20px 20px 0 0 !important;
    width:100% !important;
    max-width:100% !important;
    max-height:min(90dvh, calc(var(--talune-mobile-vh, 100dvh) - var(--talune-mobile-safe-top) - 8px)) !important;
    margin:0 !important;
    position:fixed !important;
    bottom:0 !important;
    left:0 !important;
    right:0 !important;
    top:auto !important;
    overflow-y:auto !important;
    padding-bottom:calc(20px + var(--talune-mobile-safe-bottom)) !important;
  }
  .finModal{
    align-items:flex-end !important;
    padding:0 !important;
  }
  .finModal .finModalHead{
    position:sticky !important;
    top:0 !important;
    z-index:2 !important;
    background:linear-gradient(180deg, rgba(11,16,27,.98), rgba(11,16,27,.94)) !important;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  .finModal .finModalActions{
    position:sticky !important;
    bottom:0 !important;
    z-index:2 !important;
    background:linear-gradient(180deg, rgba(11,16,27,.9), rgba(11,16,27,.98)) !important;
    padding-bottom:calc(12px + var(--talune-mobile-safe-bottom)) !important;
  }
  body.modal-open .mobileFab,
  body.modal-open .mobileFabDial,
  body.modal-open .mobileFabBackdrop,
  body.modal-open .mobileBottomNav{
    opacity:0 !important;
    pointer-events:none !important;
  }
  #pf-tx-modal input[type="text"],
  #pf-tx-modal input[type="number"],
  #pf-tx-modal input[type="date"],
  #pf-tx-modal select,
  #pf-tx-modal textarea,
  #pf-transfer-modal input[type="text"],
  #pf-transfer-modal input[type="number"],
  #pf-transfer-modal input[type="date"],
  #pf-transfer-modal select,
  #pf-transfer-modal textarea{
    font-size:16px !important;
    line-height:1.25 !important;
  }

  /* ── Seções de workspace ── */
  .workspacePanel{
    padding:0 0 20px !important;
  }

  /* ═══════════════════════════════════════════════════
     OVERVIEW — Início
  ═══════════════════════════════════════════════════ */

  /* Saldo hero */
  .pfQuickHero{
    display:block !important;
    background:transparent !important;
    padding:16px 16px 0 !important;
    border:none !important;
    box-shadow:none !important;
  }
  .pfQuickHeroBalance{
    font-size:28px !important;
    font-weight:700 !important;
    letter-spacing:-.5px !important;
  }
  .pfQuickHeroSub{
    font-size:12px !important;
    color:rgba(255,255,255,.45) !important;
    margin-bottom:4px !important;
  }
  .pfQuickHeroActions{
    display:flex !important;
    gap:8px !important;
    margin-top:14px !important;
    flex-wrap:wrap !important;
  }
  .pfQuickHeroActions .pfBtn,
  .pfQuickHeroActions button{
    flex:1 1 auto !important;
    min-height:42px !important;
    font-size:13px !important;
  }

  /* KPI cards grid */
  .pfQuickGrid{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    padding:12px 16px !important;
  }
  .pfQuickCard{
    border-radius:14px !important;
    padding:14px 12px !important;
  }
  .pfQuickCardLabel{
    font-size:11px !important;
  }
  .pfQuickCardValue{
    font-size:13px !important;
    font-weight:700 !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }

  /* Panel grid (overview panels) */
  .pfPanelGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:0 16px !important;
  }
  .pfPanel{
    border-radius:14px !important;
  }

  /* Totals bar on overview */
  #pfw-launch-totals{
    margin:0 16px 12px !important;
    border-radius:12px !important;
    padding:12px 14px !important;
  }

  /* ═══════════════════════════════════════════════════
     LANÇAMENTOS — Feed de transações (2 linhas/item)
  ═══════════════════════════════════════════════════ */

  #pf-lancamentos .pfLaunchHead,
  #pf-lancamentos .pfLaunchNav{
    padding:10px 16px 0 !important;
  }
  #pf-lancamentos .pfLaunchHeader{
    padding:14px 16px 10px !important;
    margin:0 !important;
    flex-wrap:wrap !important;
    align-items:flex-start !important;
    gap:10px !important;
  }
  #pf-lancamentos .pfLaunchTitleWrap{
    min-width:0 !important;
    flex:1 1 auto !important;
  }
  #pf-lancamentos .pfLaunchMonthNav{
    width:100% !important;
    justify-content:space-between !important;
  }
  #pfw-launch-month-caption{
    flex:1 1 auto !important;
    min-width:0 !important;
    text-align:center !important;
  }
  #pf-lancamentos .pfTableScroll{ overflow:visible !important; }

  /* Totais do mês: 2 colunas em vez de 3 */
  #pf-lancamentos .pfLaunchTotalsGrid{
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
  }
  #pf-lancamentos .pfLaunchTotalCard .v{
    font-size:14px !important;
    white-space:normal !important;
  }

  /* Tabela → blocos */
  #pf-lancamentos > div:has(> #pfw-tx-table){
    overflow-x:visible !important;
    overflow-y:visible !important;
  }
  #pfw-tx-table{
    min-width:0 !important;
    overflow:visible !important;
  }
  #pfw-tx-table thead{ display:none !important; }
  #pfw-tx-table,
  #pfw-tx-table tbody{ display:block !important; width:100% !important; }

  /*
   * Layout por row usando grid-template-areas (muito mais robusto no iOS Safari
   * do que grid-column/row numéricos, que sofriam com auto-placement conflicts).
   *
   * HTML: td1=data | td2=descrição | td3=categoria | td4=conta | td5=status | td6=valor
   * Grid: "icon  desc   value"
   *       "icon  meta   status"
   */
  #pfw-tx-table tr{
    display:grid !important;
    grid-template-columns:44px 1fr auto !important;
    grid-template-rows:auto auto !important;
    grid-template-areas:
      "icon desc  value"
      "icon meta  status" !important;
    column-gap:10px !important;
    row-gap:4px !important;
    padding:11px 16px !important;
    border-bottom:1px solid rgba(255,255,255,.05) !important;
    border-right:none !important;
    align-items:center !important;
    background:transparent !important;
    min-width:0 !important;
  }
  #pfw-tx-table tr:first-child{
    border-top:1px solid rgba(255,255,255,.05) !important;
  }

  /* td1 — data: removida do flow, não ocupa grid-area */
  #pfw-tx-table td:nth-child(1){
    display:none !important;
  }
  /* td2 — descrição */
  #pfw-tx-table td:nth-child(2){
    grid-area:desc !important;
    font-size:14px !important;
    font-weight:500 !important;
    color:#f0f0f0 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    padding:0 !important;
    border:none !important;
    min-width:0 !important;
    align-self:end !important;
  }
  /* td3 — ícone da categoria */
  #pfw-tx-table td:nth-child(3){
    grid-area:icon !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
    border:none !important;
  }
  #pfw-tx-table td:nth-child(3) .pfTxCategory{ gap:0 !important; }
  #pfw-tx-table td:nth-child(3) .pfTxCategory > span:last-child{ display:none !important; }
  #pfw-tx-table .pfTxCategoryIcon{
    width:38px !important; height:38px !important; min-width:38px !important;
    border-radius:50% !important;
    font-size:16px !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
    overflow:hidden !important;
    flex-shrink:0 !important;
  }
  #pfw-tx-table .pfTxCategoryIcon img{
    width:18px !important; height:18px !important;
    pointer-events:none !important;
  }
  /* td4 — conta */
  #pfw-tx-table td:nth-child(4){
    grid-area:meta !important;
    font-size:11px !important;
    color:rgba(255,255,255,.42) !important;
    padding:0 !important;
    border:none !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    min-width:0 !important;
    align-self:start !important;
  }
  #pfw-tx-table td:nth-child(4) .pfTxAccount,
  #pfw-tx-table td:nth-child(4) .pfTxAccountTransfer{
    min-width:0 !important;
    max-width:100% !important;
  }
  #pfw-tx-table td:nth-child(4) .pfTxAccount > span:last-child{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  #pfw-tx-table .pfTxAccount{ gap:4px !important; font-size:11px !important; }
  #pfw-tx-table .pfTxAccountIcon{
    width:14px !important; height:14px !important; min-width:14px !important;
    font-size:8px !important; border-radius:3px !important;
  }
  /* td5 — status / ações */
  #pfw-tx-table td:nth-child(5){
    grid-area:status !important;
    padding:0 !important;
    border:none !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:flex-end !important;
    align-self:start !important;
  }
  #pfw-tx-table td:nth-child(5) .pfTxStatusWrap{
    display:flex !important;
    justify-content:flex-end !important;
    width:100% !important;
  }
  #pfw-tx-table .pfTxEditBtn,
  #pfw-tx-table .pfTxDeleteBtn{ display:none !important; }
  #pfw-tx-table .pfStatusBtn{
    font-size:10px !important;
    padding:2px 6px !important;
    min-height:unset !important;
    border-radius:20px !important;
    white-space:nowrap !important;
  }
  /* td6 — valor */
  #pfw-tx-table td:nth-child(6){
    grid-area:value !important;
    font-size:14px !important;
    font-weight:600 !important;
    padding:0 !important;
    border:none !important;
    text-align:right !important;
    white-space:nowrap !important;
    align-self:end !important;
  }
  #pfw-tx-table td:nth-child(6) .moneySensitive{
    display:block !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  /* ═══════════════════════════════════════════════════
     CONTAS & CARTÕES
  ═══════════════════════════════════════════════════ */

  .pfCardsGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:0 16px !important;
  }
  .pfAccountCard,
  .pfCardItem{
    border-radius:14px !important;
    padding:14px 16px !important;
  }
  .pfAccountCardHeader{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    margin-bottom:10px !important;
  }
  .pfAccountIcon,
  .pfCardIcon{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    border-radius:12px !important;
    font-size:18px !important;
  }
  .pfAccountName,
  .pfCardName{
    font-size:15px !important;
    font-weight:600 !important;
  }
  .pfAccountType,
  .pfCardType{
    font-size:12px !important;
    color:rgba(255,255,255,.45) !important;
  }
  .pfAccountBalance{
    font-size:20px !important;
    font-weight:700 !important;
    color:#1db974 !important;
  }

  /* Invoice card (cartão de crédito) */
  .pfCardInvoiceGrid{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-top:10px !important;
    padding:10px 12px !important;
    background:rgba(255,255,255,.04) !important;
    border-radius:10px !important;
  }
  .pfCardInvoiceLabel{
    font-size:11px !important;
    color:rgba(255,255,255,.45) !important;
  }
  .pfCardInvoiceValue{
    font-size:15px !important;
    font-weight:600 !important;
  }

  /* Section title (e.g. "Minhas contas", "Meus cartões") */
  .pfSectionTitle,
  .pfPanelTitle,
  .pfSubsectionTitle{
    font-size:16px !important;
    font-weight:700 !important;
    padding:16px 16px 8px !important;
    margin:0 !important;
  }

  /* ═══════════════════════════════════════════════════
     SECTION HEADER (month nav, titles)
  ═══════════════════════════════════════════════════ */

  .wsHead{
    padding:14px 16px 10px !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:10px !important;
  }
  .wsKpiGrid{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    padding:0 16px !important;
  }
  .wsKpiCard{
    border-radius:12px !important;
    padding:12px !important;
  }

  /* ═══════════════════════════════════════════════════
     FILTROS (lançamentos)
  ═══════════════════════════════════════════════════ */

  .pfFiltersRow,
  #pf-lancamentos .pfFiltersRow{
    padding:8px 16px !important;
    gap:6px !important;
    flex-wrap:wrap !important;
  }
  .pfFiltersRow select,
  .pfFiltersRow input,
  .pfFiltersRow .pfCustomSelect{
    font-size:13px !important;
    min-height:36px !important;
  }

  /* ═══════════════════════════════════════════════════
     TOTAIS (lançamentos)
  ═══════════════════════════════════════════════════ */

  #pfw-launch-totals{
    grid-template-columns:1fr 1fr 1fr !important;
    padding:10px 16px !important;
    gap:0 !important;
    border-radius:0 !important;
    margin:0 !important;
    background:rgba(255,255,255,.04) !important;
    border-top:1px solid rgba(255,255,255,.06) !important;
    border-bottom:1px solid rgba(255,255,255,.06) !important;
  }
  .pfLaunchTotalItem{
    padding:8px 6px !important;
    text-align:center !important;
    border-right:1px solid rgba(255,255,255,.06) !important;
  }
  .pfLaunchTotalItem:last-child{
    border-right:none !important;
  }
  .pfLaunchTotalLabel{
    font-size:10px !important;
    color:rgba(255,255,255,.45) !important;
  }
  .pfLaunchTotalValue{
    font-size:14px !important;
    font-weight:700 !important;
  }

}

/* ── Guard: garante que mobile shell não aparece em desktop ── */
@media (min-width:681px){
  .mobileShell{ display:none !important; }
}

@media (max-width:1024px){
  .workspaceGlobalHeader{
    padding:0 0 4px !important;
  }
}

@media (max-width:680px){
  .container{
    padding:calc(var(--talune-mobile-header-height) + 2px) 0 calc(var(--talune-mobile-nav-height) + 10px) !important;
  }
  .workspacePanel{
    padding:0 0 14px !important;
  }
  #pf-lancamentos .pfLaunchHeader{
    padding:10px 16px 8px !important;
    gap:8px !important;
  }
  #pf-lancamentos .pfLaunchTitleWrap{
    width:auto !important;
    flex:0 1 auto !important;
    gap:8px !important;
  }
}

/* ================================================================
   MOBILE REFINEMENT PASS — max-width: 680px
   Consolida o layout real do celular após os overrides legados.
   Foco:
   · evitar grids espremidos
   · impedir FAB de cobrir conteúdo importante
   · transformar listas/tabelas em leitura vertical utilizável
   · reduzir densidade do dashboard de investimentos
   ================================================================ */
@media (max-width:680px){

  :root{
    --talune-mobile-content-bottom: calc(var(--talune-mobile-nav-height) + 96px);
  }

  .container{
    padding:calc(var(--talune-mobile-header-height) + 6px) 0 var(--talune-mobile-content-bottom) !important;
  }

  .workspacePanel{
    padding:0 0 calc(var(--talune-mobile-content-bottom) + 12px) !important;
  }

  .sub-section,
  .section,
  .pfWidget,
  .invDashShell,
  .calcGroupSection{
    scroll-margin-top:calc(var(--talune-mobile-header-height) + 10px);
  }

  .mobileBottomNav{
    gap:4px !important;
    padding:6px 8px calc(var(--talune-mobile-safe-bottom) + 2px) !important;
  }

  .mobileNavTab{
    height:60px !important;
    border-radius:16px !important;
  }

  .mobileNavLabel{
    font-size:9px !important;
    line-height:1.05 !important;
  }

  .mobileFab{
    left:auto !important;
    right:16px !important;
    transform:none !important;
    bottom:calc(var(--talune-mobile-nav-height) + 14px) !important;
    width:52px !important;
    height:52px !important;
  }

  .mobileFab.fab-open{
    transform:rotate(45deg) !important;
  }

  .mobileFabDial{
    left:auto !important;
    right:16px !important;
    transform:none !important;
    bottom:calc(var(--talune-mobile-nav-height) + 74px) !important;
    align-items:flex-end !important;
  }

  .mobileFabDialItem{
    padding:10px 14px 10px 12px !important;
  }

  /* ── Visão Geral ───────────────────────────────────────────── */
  #pf-visao-geral{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 8px) !important;
  }

  #pf-visao-geral .pfQuickHero{
    padding:14px 14px 0 !important;
  }

  #pf-visao-geral .pfQuickGreeting{
    font-size:16px !important;
    line-height:1.15 !important;
    margin-bottom:12px !important;
  }

  #pf-visao-geral .pfQuickGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:0 !important;
  }

  #pf-visao-geral .pfQuickCard{
    min-height:auto !important;
    padding:14px 14px 12px !important;
    border-radius:18px !important;
  }

  #pf-visao-geral .pfQuickCard .k{
    font-size:11px !important;
  }

  #pf-visao-geral .pfQuickCard .v{
    font-size:clamp(24px, 7vw, 30px) !important;
    line-height:1.04 !important;
  }

  #pf-visao-geral .pfQuickCard .s{
    font-size:11px !important;
    line-height:1.35 !important;
  }

  #pf-visao-geral .pfQuickCard.kpi-balance .pfBalanceHighlightRow,
  #pf-visao-geral .pfQuickCard.kpi-balance-featured .pfBalanceHighlightRow{
    align-items:flex-start !important;
    gap:10px !important;
  }

  #pf-visao-geral .pfQuickCard.kpi-balance .pfBankBrand,
  #pf-visao-geral .pfQuickCard.kpi-balance-featured .pfBankBrand{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    border-radius:12px !important;
    padding:4px !important;
    box-shadow:none !important;
    margin-left:auto !important;
    align-self:flex-start !important;
  }

  #pf-visao-geral .pfQuickCard.kpi-balance .pfBankName,
  #pf-visao-geral .pfQuickCard.kpi-balance-featured .pfBankName{
    display:none !important;
  }

  #pf-visao-geral .pfQuickActionsBox{
    margin-top:10px !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #pf-visao-geral .pfQuickActionsGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
  }

  #pf-visao-geral .pfQuickActionsGrid .pfIconAction{
    min-height:54px !important;
  }

  #pf-visao-geral .pfPanelGrid{
    grid-template-columns:1fr !important;
    gap:12px !important;
    padding:0 14px !important;
  }

  #pf-visao-geral .pfWidget{
    border-radius:18px !important;
  }

  #pf-visao-geral .pfWidgetHead{
    flex-wrap:wrap !important;
    align-items:flex-start !important;
    gap:8px !important;
  }

  #pf-visao-geral .pfFlowMonthNav{
    width:100% !important;
    justify-content:space-between !important;
  }

  #pf-visao-geral .pfTopExpensesWrap{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  #pf-visao-geral .pfMiniBars{
    order:2 !important;
  }

  #pf-visao-geral .pfDonutWrap{
    order:1 !important;
    min-height:220px !important;
    align-items:center !important;
    justify-content:center !important;
  }

  #pf-visao-geral .pfDonut{
    width:min(68vw, 220px) !important;
    height:min(68vw, 220px) !important;
    margin:0 auto !important;
  }

  #pf-visao-geral .pfInvestTableWrap{
    overflow:visible !important;
  }

  #pf-visao-geral .pfInvestTable thead{
    display:none !important;
  }

  #pf-visao-geral .pfInvestTable,
  #pf-visao-geral .pfInvestTable tbody{
    display:block !important;
    width:100% !important;
  }

  #pf-visao-geral .pfInvestTable tbody tr{
    display:grid !important;
    grid-template-columns:10px minmax(0,1fr) auto !important;
    grid-template-areas:
      "swatch name value"
      "swatch name pct" !important;
    column-gap:10px !important;
    row-gap:2px !important;
    padding:10px 0 !important;
    border-bottom:1px solid var(--stroke) !important;
  }

  #pf-visao-geral .pfInvestTable tbody td{
    padding:0 !important;
    border:none !important;
    min-width:0 !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(1){
    grid-area:swatch !important;
    align-self:center !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(2){
    grid-area:name !important;
    font-size:13px !important;
    line-height:1.32 !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(3){
    grid-area:value !important;
    text-align:right !important;
    font-size:13px !important;
    white-space:nowrap !important;
  }

  #pf-visao-geral .pfInvestTable tbody td:nth-child(4){
    grid-area:pct !important;
    text-align:right !important;
    font-size:12px !important;
    color:var(--muted) !important;
    white-space:nowrap !important;
  }

  #pf-visao-geral .pfInvestTable .pfEmptyCell{
    display:block !important;
    grid-column:1 / -1 !important;
    text-align:center !important;
    padding:14px 0 !important;
  }

  /* ── Lançamentos ───────────────────────────────────────────── */
  #pf-lancamentos{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 8px) !important;
  }

  #pf-lancamentos .pfLaunchHeader{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:14px 14px 10px !important;
  }

  #pf-lancamentos .pfLaunchTitleWrap{
    width:100% !important;
    min-width:0 !important;
    justify-content:space-between !important;
    align-items:center !important;
  }

  #pf-lancamentos .pfLaunchTitle{
    font-size:17px !important;
    line-height:1.15 !important;
  }

  #pf-lancamentos .pfLaunchAddBtn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    border-radius:14px !important;
  }

  #pf-lancamentos .pfLaunchMonthShell,
  #pf-lancamentos .pfLaunchMonthNav{
    width:100% !important;
  }

  #pfw-launch-month-caption{
    font-size:15px !important;
    padding:0 10px !important;
  }

  #pfw-launch-totals{
    margin:0 14px 10px !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #pf-lancamentos .pfLaunchTotalsGrid{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  #pf-lancamentos .wsFilterBar{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
    padding:0 14px 10px !important;
  }

  #pf-lancamentos .wsFilterBar .pfPeriodGhost{
    display:none !important;
  }

  #pf-lancamentos .wsFilter{
    min-width:0 !important;
  }

  #pf-lancamentos .wsFilter:last-child{
    grid-column:1 / -1 !important;
  }

  #pf-lancamentos .pfSectionToolbar{
    padding:0 14px 10px !important;
  }

  #pf-lancamentos .pfSearchInput{
    min-height:42px !important;
  }

  #pf-lancamentos .pfLaunchTableWrap{
    padding:0 14px !important;
    overflow:visible !important;
  }

  #pfw-tx-table{
    min-width:0 !important;
    border-collapse:separate !important;
    border-spacing:0 !important;
  }

  #pfw-tx-table thead{
    display:none !important;
  }

  #pfw-tx-table,
  #pfw-tx-table tbody{
    display:block !important;
    width:100% !important;
  }

  #pfw-tx-table tbody tr{
    display:grid !important;
    grid-template-columns:36px minmax(0,1fr) auto !important;
    grid-template-areas:
      "date date value"
      "icon desc desc"
      "icon meta meta"
      "icon status status" !important;
    column-gap:10px !important;
    row-gap:4px !important;
    padding:12px !important;
    margin-bottom:8px !important;
    border:1px solid var(--stroke) !important;
    border-radius:16px !important;
    background:var(--card) !important;
    align-items:start !important;
  }

  #pfw-tx-table tbody tr:last-child{
    margin-bottom:0 !important;
  }

  #pfw-tx-table tbody td{
    min-width:0 !important;
    padding:0 !important;
    border:none !important;
  }

  #pfw-tx-table tbody td:nth-child(1){
    display:inline-flex !important;
    grid-area:date !important;
    align-self:start !important;
    font-size:10px !important;
    line-height:1 !important;
    letter-spacing:.08em !important;
    text-transform:uppercase !important;
    color:var(--muted) !important;
  }

  #pfw-tx-table tbody td:nth-child(2){
    grid-area:desc !important;
    font-size:14px !important;
    font-weight:600 !important;
    white-space:normal !important;
    overflow:hidden !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
    line-height:1.28 !important;
  }

  #pfw-tx-table tbody td:nth-child(3){
    grid-area:icon !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    padding-top:2px !important;
  }

  #pfw-tx-table .pfTxCategoryIcon{
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
  }

  #pfw-tx-table tbody td:nth-child(4){
    grid-area:meta !important;
    font-size:12px !important;
    line-height:1.3 !important;
    color:var(--muted) !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  #pfw-tx-table .pfTxAccount{
    gap:6px !important;
    font-size:12px !important;
  }

  #pfw-tx-table .pfTxAccountIcon{
    width:16px !important;
    height:16px !important;
    min-width:16px !important;
  }

  #pfw-tx-table tbody td:nth-child(5){
    grid-area:status !important;
    display:flex !important;
    justify-content:flex-start !important;
    align-items:center !important;
  }

  #pfw-tx-table .pfTxStatusWrap{
    width:auto !important;
    justify-content:flex-start !important;
  }

  #pfw-tx-table .pfStatusBtn{
    padding:4px 10px !important;
    font-size:10px !important;
  }

  #pfw-tx-table tbody td:nth-child(6){
    grid-area:value !important;
    align-self:start !important;
    text-align:right !important;
    font-size:15px !important;
    font-weight:700 !important;
  }

  #pfw-tx-table .pfEmptyCell{
    display:block !important;
    grid-column:1 / -1 !important;
    text-align:center !important;
    padding:12px 0 !important;
  }

  /* ── Contas e cartões ──────────────────────────────────────── */
  #pf-contas{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 8px) !important;
  }

  #pf-contas .pfSectionToolbar{
    padding:14px !important;
    gap:8px !important;
    flex-wrap:wrap !important;
  }

  #pf-contas .pfSectionToolbar .workspaceAction{
    flex:1 1 calc(50% - 4px) !important;
    min-width:0 !important;
  }

  #pf-contas .section{
    margin:0 14px 12px !important;
    border-radius:18px !important;
  }

  #pf-contas .sectionHead{
    padding:14px !important;
  }

  #pf-contas .sectionBody{
    padding:0 0 14px !important;
  }

  #pf-contas .pfCardsGrid{
    padding:0 14px !important;
  }

  #pf-contas .pfAccountCard,
  #pf-contas .pfCardItem{
    padding:14px !important;
    border-radius:16px !important;
  }

  #pf-contas .pfCardInvoiceGrid{
    grid-template-columns:1fr !important;
  }

  /* ── Investimentos ─────────────────────────────────────────── */
  #pf-investimentos{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 8px) !important;
  }

  #pf-investimentos .invDashShell{
    margin:0 14px 12px !important;
    padding:14px !important;
    gap:12px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .invDashKpiGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #pf-investimentos .invDashKpiCard{
    min-height:auto !important;
    padding:14px !important;
    border-radius:16px !important;
  }

  #pf-investimentos .invDashKpiTitle{
    font-size:10px !important;
    letter-spacing:.12em !important;
  }

  #pf-investimentos .invDashKpiValue{
    font-size:clamp(22px, 7vw, 30px) !important;
    line-height:1.05 !important;
  }

  #pf-investimentos .invDashPanels{
    grid-template-columns:1fr !important;
  }

  #pf-investimentos .invDashPanel{
    min-height:auto !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .invDashPanelHead{
    gap:10px !important;
    align-items:stretch !important;
  }

  #pf-investimentos .invDashPanelControls{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    gap:8px !important;
  }

  #pf-investimentos .invDashPeriodGroup{
    width:100% !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    gap:6px !important;
    padding-bottom:4px !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
  }

  #pf-investimentos .invDashPeriodGroup::-webkit-scrollbar{
    display:none !important;
  }

  #pf-investimentos .invDashPeriodBtn{
    flex:0 0 auto !important;
    min-width:50px !important;
  }

  #pf-investimentos .invDashSelect{
    width:100% !important;
    min-height:42px !important;
  }

  #pf-investimentos .invDashInsights{
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  #pf-investimentos #inv-dash-evolution-chart{
    min-height:240px !important;
    height:240px !important;
  }

  #pf-investimentos .section.collapsible{
    margin:0 14px 12px !important;
    border-radius:18px !important;
  }

  #pf-investimentos .section.collapsible .sectionHead{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "lead actions"
      "summary summary" !important;
    gap:12px !important;
    padding:14px !important;
  }

  #pf-investimentos .invSectionLead{
    grid-area:lead !important;
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) !important;
    align-items:flex-start !important;
    gap:12px !important;
    min-width:0 !important;
  }

  #pf-investimentos .invSectionBadge{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    border-radius:14px !important;
  }

  #pf-investimentos .invSectionText h2{
    font-size:18px !important;
    line-height:1.15 !important;
  }

  #pf-investimentos .invSectionDesc{
    display:none !important;
  }

  #pf-investimentos .invSectionHeadActions{
    grid-area:actions !important;
    align-self:flex-start !important;
    justify-content:flex-end !important;
    gap:8px !important;
  }

  #pf-investimentos .invSectionSummary{
    grid-area:summary !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:8px !important;
  }

  #pf-investimentos .invSummaryMetric{
    padding:10px 12px !important;
    border-radius:14px !important;
    background:var(--panel) !important;
  }

  #pf-investimentos .invSummaryMetric strong{
    font-size:14px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }

  #pf-investimentos .sectionBody{
    padding:0 12px 12px !important;
  }

  #pf-investimentos .invManualGrid{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #pf-investimentos .invManualCard{
    border-radius:16px !important;
    padding:14px !important;
  }

  /* ── Recorrências ──────────────────────────────────────────── */
  #pf-recorrencias{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 8px) !important;
  }

  #pf-recorrencias .pfRecurringShell{
    margin:0 14px !important;
    border-radius:18px !important;
  }

  #pf-recorrencias .pfRecurringShellHead{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:6px !important;
  }

  #pf-recorrencias .pfRecurringTable thead{
    display:none !important;
  }

  #pf-recorrencias .pfRecurringTable,
  #pf-recorrencias .pfRecurringTable tbody{
    display:block !important;
    width:100% !important;
  }

  #pf-recorrencias .pfRecurringTable tbody tr{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "asset value"
      "date edit"
      "category edit"
      "period edit" !important;
    column-gap:10px !important;
    row-gap:4px !important;
    padding:12px 14px !important;
    border-bottom:1px solid var(--stroke) !important;
  }

  #pf-recorrencias .pfRecurringTable tbody td{
    padding:0 !important;
    border:none !important;
    min-width:0 !important;
  }

  #pf-recorrencias .pfRecurringTable tbody td:nth-child(1){ grid-area:asset !important; }
  #pf-recorrencias .pfRecurringTable tbody td:nth-child(2){ grid-area:date !important; color:var(--muted) !important; font-size:12px !important; }
  #pf-recorrencias .pfRecurringTable tbody td:nth-child(3){ grid-area:category !important; }
  #pf-recorrencias .pfRecurringTable tbody td:nth-child(4){ grid-area:period !important; }
  #pf-recorrencias .pfRecurringTable tbody td:nth-child(5){ grid-area:value !important; text-align:right !important; }
  #pf-recorrencias .pfRecurringTable tbody td:nth-child(6){ grid-area:edit !important; align-self:start !important; }

  /* ── Indicadores ───────────────────────────────────────────── */
  #workspace-indicadores #macro-dashboard.section{
    margin:0 14px 12px !important;
    padding:14px !important;
    border-radius:18px !important;
  }

  #workspace-indicadores #macro-dashboard .sectionHead{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:8px !important;
  }

  #workspace-indicadores .macroSummaryWrap{
    width:100% !important;
    justify-content:space-between !important;
  }

  #workspace-indicadores .macroActiveToolbar{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  #workspace-indicadores .macroSearchShell{
    width:100% !important;
    max-width:none !important;
  }

  #workspace-indicadores .macroTile.macroRow{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "name"
      "value"
      "meta" !important;
    gap:8px !important;
    padding:14px !important;
    border-radius:16px !important;
  }

  #workspace-indicadores .macroColValue,
  #workspace-indicadores .macroColMeta{
    justify-content:flex-start !important;
    align-items:flex-start !important;
  }

  /* ── Calculadoras ──────────────────────────────────────────── */
  #workspace-calculadora{
    padding-bottom:calc(var(--talune-mobile-content-bottom) - var(--talune-mobile-nav-height) + 8px) !important;
  }

  #workspace-calculadora .calcTabs{
    padding:0 14px 8px !important;
    gap:8px !important;
    overflow-x:auto !important;
    flex-wrap:nowrap !important;
    scrollbar-width:none !important;
  }

  #workspace-calculadora .calcTabs::-webkit-scrollbar{
    display:none !important;
  }

  #workspace-calculadora .calcGroupGrid{
    grid-template-columns:1fr !important;
    gap:12px !important;
  }

  #workspace-calculadora .calcCard{
    border-radius:18px !important;
  }

  #workspace-calculadora .calcHead{
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:8px !important;
  }

  #workspace-calculadora .calcHeadActions{
    width:100% !important;
    justify-content:space-between !important;
  }

  #workspace-calculadora .calcGrid{
    grid-template-columns:1fr !important;
  }

  #workspace-calculadora .calcActions{
    flex-wrap:wrap !important;
  }

  #workspace-calculadora .calcActions .workspaceAction{
    flex:1 1 calc(50% - 6px) !important;
    min-width:0 !important;
  }

  #workspace-calculadora .calcChartSvg{
    height:220px !important;
  }
}

@media (max-width:680px){
  #pf-visao-geral .pfQuickHero{ padding:22px 14px 0 !important; }
  #pf-visao-geral .pfQuickGreeting{ margin:0 0 18px !important; }
  #pf-visao-geral .pfQuickActionsBox{ display:none !important; }
  #pf-visao-geral .pfPanelGrid{ gap:12px !important; margin-top:12px !important; }
  #pf-visao-geral .pfInvestTable tbody tr{
    display:grid !important;
    grid-template-columns:8px minmax(0,1fr) auto auto !important;
    align-items:center !important;
    column-gap:8px !important;
    row-gap:0 !important;
    padding:7px 0 !important;
    margin:0 !important;
    border:none !important;
    border-radius:0 !important;
    background:none !important;
    box-shadow:none !important;
  }
  #pf-visao-geral .pfInvestTable tbody tr + tr{ margin-top:2px !important; }
  #pf-visao-geral .pfInvestTable tbody td{ padding:0 !important; border:none !important; min-width:0 !important; }
  #pf-visao-geral .pfInvestTable tbody td:nth-child(2){
    font-size:13px !important;
    font-weight:600 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  #pf-visao-geral .pfInvestTable tbody td:nth-child(3){
    font-size:13px !important;
    font-weight:700 !important;
    white-space:nowrap !important;
  }
  #pf-visao-geral .pfInvestTable tbody td:nth-child(4){
    font-size:11px !important;
    font-weight:600 !important;
    color:rgba(226,232,240,.62) !important;
    white-space:nowrap !important;
    padding-left:6px !important;
  }

  #pf-lancamentos .pfLaunchHeader{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:12px !important;
    padding:16px 14px 10px !important;
  }
  #pf-lancamentos .pfLaunchTitleWrap{ display:block !important; width:100% !important; }
  #pf-lancamentos .pfLaunchAddBtn{ display:none !important; }
  #pf-lancamentos .pfLaunchMonthShell,
  #pf-lancamentos .pfLaunchMonthNav{ width:100% !important; }
  #pfw-launch-month-caption{ font-size:15px !important; line-height:1.1 !important; }
  #pfw-tx-table tbody tr{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:
      "date date"
      "desc value"
      "category category"
      "account account"
      "status status" !important;
    column-gap:10px !important;
    row-gap:7px !important;
    align-items:start !important;
    padding:14px !important;
    margin:0 0 10px !important;
    border:1px solid rgba(255,255,255,.07) !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.03) !important;
    box-shadow:0 8px 18px rgba(0,0,0,.16) !important;
  }
  #pfw-tx-table tbody td{ min-width:0 !important; padding:0 !important; border:none !important; }
  #pfw-tx-table tbody td:nth-child(1){ grid-area:date !important; font-size:11px !important; font-weight:700 !important; color:rgba(226,232,240,.54) !important; }
  #pfw-tx-table tbody td:nth-child(2){ grid-area:desc !important; font-size:16px !important; font-weight:700 !important; white-space:normal !important; display:block !important; }
  #pfw-tx-table tbody td:nth-child(3){ grid-area:category !important; display:block !important; }
  #pfw-tx-table tbody td:nth-child(4){ grid-area:account !important; display:block !important; }
  #pfw-tx-table tbody td:nth-child(5){ grid-area:status !important; display:flex !important; justify-content:flex-start !important; }
  #pfw-tx-table tbody td:nth-child(6){ grid-area:value !important; text-align:right !important; font-size:16px !important; font-weight:700 !important; white-space:nowrap !important; }
  #pfw-tx-table .pfTxCategory{ display:flex !important; align-items:center !important; gap:8px !important; }
  #pfw-tx-table .pfTxCategoryIcon{ width:24px !important; height:24px !important; min-width:24px !important; border-radius:999px !important; }
  #pfw-tx-table .pfTxCategoryLabel{
    display:block !important;
    font-size:12.5px !important;
    font-weight:600 !important;
    color:rgba(226,232,240,.72) !important;
    white-space:normal !important;
    overflow:visible !important;
  }
  #pfw-tx-table .pfTxAccount,
  #pfw-tx-table .pfTxAccountTransfer{ display:flex !important; align-items:center !important; gap:6px !important; flex-wrap:wrap !important; }
  #pfw-tx-table .pfTxAccountIcon{ width:16px !important; height:16px !important; min-width:16px !important; }
  #pfw-tx-table .pfTxAccountLabel{
    display:block !important;
    font-size:12.5px !important;
    color:rgba(226,232,240,.60) !important;
    white-space:normal !important;
    overflow:visible !important;
  }
  #pfw-tx-table .pfTxStatusWrap{ display:flex !important; gap:8px !important; justify-content:flex-start !important; }
  #pfw-tx-table .pfTxEditBtn,
  #pfw-tx-table .pfTxDeleteBtn{ display:none !important; }

  #pf-contas .pfCardsGrid{ grid-template-columns:1fr !important; gap:10px !important; }
  #pf-contas #pfw-accounts-grid .pfSmallCard.accountCard,
  #pf-contas #pfw-cards-grid .pfSmallCard{ display:block !important; padding:14px !important; border-radius:18px !important; }
  #pf-contas .pfEntityHead{
    display:grid !important;
    grid-template-columns:56px minmax(0,1fr) auto !important;
    gap:12px !important;
    align-items:start !important;
  }
  #pf-contas .pfAccountThumb,
  #pf-contas #pfw-cards-grid .pfAccountThumb{
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    border-radius:18px !important;
    background:#fff !important;
    overflow:hidden !important;
  }
  #pf-contas .pfAccountThumb img,
  #pf-contas #pfw-cards-grid .pfAccountThumb img{
    width:100% !important;
    height:100% !important;
    display:block !important;
    object-fit:cover !important;
    opacity:1 !important;
    visibility:visible !important;
    filter:none !important;
  }
  #pf-contas .pfPrimaryFlag{ margin:0 !important; justify-self:end !important; align-self:start !important; }
  #pf-contas .pfCardTopRow{ display:flex !important; flex-direction:column !important; align-items:flex-start !important; gap:8px !important; }
  #pf-contas .pfAccountBottomRow{ display:flex !important; flex-direction:column !important; align-items:stretch !important; gap:10px !important; }
  #pf-contas .pfAccountActions,
  #pf-contas .pfSmallActions{ width:100% !important; justify-content:flex-start !important; flex-wrap:wrap !important; }

  #pf-investimentos .invDashShell{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
    margin:0 14px 12px !important;
    padding:14px !important;
    border-radius:18px !important;
  }
  #pf-investimentos .invDashKpiGrid{ display:grid !important; grid-template-columns:1fr !important; gap:10px !important; }
  #pf-investimentos .invDashPanels{ display:grid !important; grid-template-columns:1fr !important; gap:12px !important; }
  #pf-investimentos .invDashPanel{ min-height:auto !important; padding:14px !important; }
  #pf-investimentos .invDashPanelHead{ display:flex !important; flex-direction:column !important; align-items:stretch !important; gap:10px !important; }
  #pf-investimentos .invDashPanelControls{ display:grid !important; grid-template-columns:1fr !important; gap:8px !important; width:100% !important; }
  #pf-investimentos .invDashPeriodGroup{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    gap:6px !important;
    scrollbar-width:none !important;
  }
  #pf-investimentos .invDashPeriodGroup::-webkit-scrollbar{ display:none !important; }
  #pf-investimentos .section.collapsible .sectionHead{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:"lead actions" "summary summary" !important;
    gap:12px !important;
    padding:14px !important;
  }
  #pf-investimentos .invSectionSummary{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; gap:8px !important; }
  #pf-investimentos .invTableWrap{ max-height:none !important; overflow:visible !important; border-top:none !important; background:none !important; }
  #pf-investimentos .invDataTable{ display:block !important; width:100% !important; min-width:0 !important; }
  #pf-investimentos .invDataTable thead{ display:none !important; }
  #pf-investimentos .invDataTable tbody{ display:block !important; width:100% !important; }
  #pf-investimentos .invDataTable tbody tr{
    display:block !important;
    margin:0 0 10px !important;
    padding:12px !important;
    border:1px solid rgba(255,255,255,.07) !important;
    border-radius:16px !important;
    background:rgba(255,255,255,.025) !important;
  }
  #pf-investimentos .invDataTable tbody td{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:6px 0 !important;
    border:none !important;
  }
  #pf-investimentos .invDataTable tbody td:first-child{
    display:block !important;
    padding:0 0 10px !important;
    margin-bottom:4px !important;
    border-bottom:1px solid rgba(255,255,255,.06) !important;
  }
  #pf-investimentos .invDataTable tbody td:nth-child(2)::before{ content:"Qtd./Aportes"; }
  #pf-investimentos .invDataTable tbody td:nth-child(3)::before{ content:"Investido / Medio"; }
  #pf-investimentos .invDataTable tbody td:nth-child(4)::before{ content:"Atual"; }
  #pf-investimentos .invDataTable tbody td:nth-child(5)::before{ content:"Variacao"; }
  #pf-investimentos .invDataTable tbody td:nth-child(6)::before{ content:"Saldo / Resultado"; }
  #pf-investimentos .invDataTable tbody td:nth-child(2)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(3)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(4)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(5)::before,
  #pf-investimentos .invDataTable tbody td:nth-child(6)::before{
    font-size:10px !important;
    font-weight:700 !important;
    letter-spacing:.1em !important;
    text-transform:uppercase !important;
    color:rgba(226,232,240,.52) !important;
  }
  #pf-investimentos .invDataTable tbody td:nth-child(7){
    justify-content:flex-end !important;
    padding-top:10px !important;
    margin-top:4px !important;
    border-top:1px solid rgba(255,255,255,.06) !important;
  }
  #pf-investimentos .invDataTable tbody td:nth-child(7)::before{ display:none !important; }
  #pf-investimentos .invFooterBtn{ flex:1 1 calc(50% - 4px) !important; min-width:0 !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE CONTENT ROOT — territorio exclusivo da superficie mobile
   #m-content-root e o unico ponto de render do mobile (Fase 3).
   A classe html.m-active e adicionada por TaluneMobileRenderer.activate().
   ═══════════════════════════════════════════════════════════════════════ */

/* ── content root ───────────────────────────────────────────────────── */
#m-content-root{
  display:none;
  position:fixed;
  top:var(--talune-mobile-header-height, 58px);
  bottom:var(--talune-mobile-nav-height, 68px);
  left:0; right:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  z-index:20;
  /* tokens de design — herdados pelos componentes mobile */
  --m-bg:#0f1a2b; --m-surface:rgba(255,255,255,.04); --m-border:rgba(255,255,255,.08);
  --m-text:rgba(226,232,240,.9); --m-muted:rgba(148,163,184,.7);
  --m-income:#34d399; --m-expense:rgba(248,113,113,.9); --m-transfer:rgba(96,165,250,.85);
  --m-radius:12px; --m-radius-sm:8px;
  background:var(--m-bg);
}
html.m-active #m-content-root{
  display:block;
}
/* Impede scroll do body quando mobile ativo; o content root e o unico scrollable */
html.m-active body{
  overflow:hidden;
}
html.theme-light.m-active #m-content-root{
  --m-bg:#f1f5f9;
  --m-surface:rgba(255,255,255,.9); --m-border:rgba(15,23,42,.09);
  --m-text:#1e293b; --m-muted:#64748b;
  --m-income:#16a34a; --m-expense:#dc2626; --m-transfer:#2563eb;
  background:var(--m-bg);
}

/* ── paginas ─────────────────────────────────────────────────────────── */
.m-page{
  display:none;
  min-height:100%;
  padding-bottom:16px;
  box-sizing:border-box;
}
.m-page.m-page--active{ display:block; }

/* ── retrocompat: .m-surface-layer (nao mais criado, regras inofensivas) */
.m-surface-layer{ display:none; }

/* utilitarios */
.m-empty{ padding:16px; color:var(--m-muted); font-size:13px; text-align:center; }
.m-block-title{
  display:flex; align-items:center; justify-content:space-between;
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--m-muted); padding:0 16px 8px; margin-top:20px;
}
.m-section-add-btn{
  width:22px; height:22px; border-radius:6px; border:1px solid var(--m-border);
  background:rgba(255,255,255,.05); color:var(--m-muted);
  font-size:14px; line-height:1; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}

/* home */
.m-balance-hero{ display:flex; flex-direction:column; align-items:center; padding:24px 16px 16px; gap:4px; }
.m-balance-label{ font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--m-muted); }
.m-balance-value{ font-size:32px; font-weight:700; color:var(--m-text); letter-spacing:-.02em; }
.m-month-summary{
  display:flex; align-items:stretch; margin:0 16px 4px;
  background:var(--m-surface); border:1px solid var(--m-border); border-radius:var(--m-radius); overflow:hidden;
}
.m-summary-item{ flex:1; display:flex; flex-direction:column; align-items:center; padding:12px 8px; gap:3px; }
.m-summary-divider{ width:1px; background:var(--m-border); }
.m-si-label{ font-size:11px; color:var(--m-muted); }
.m-si-value{ font-size:15px; font-weight:600; }
.m-summary-item.m-income .m-si-value{ color:var(--m-income); }
.m-summary-item.m-expense .m-si-value{ color:var(--m-expense); }
.m-month-tag{ font-weight:400; text-transform:none; letter-spacing:0; }

/* transactions */
.m-tx-header{ display:flex; align-items:center; justify-content:center; gap:12px; padding:14px 16px 8px; }
.m-month-btn{
  width:28px; height:28px; border-radius:8px; border:1px solid var(--m-border);
  background:var(--m-surface); color:var(--m-text); font-size:16px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.m-month-label{ font-size:13px; font-weight:600; color:var(--m-text); }
.m-tx-totals{ display:flex; gap:8px; padding:0 16px 8px; }
.m-tx-total-item{
  flex:1; display:flex; flex-direction:column; align-items:center;
  background:var(--m-surface); border:1px solid var(--m-border);
  border-radius:var(--m-radius-sm); padding:10px 8px; gap:2px;
}
.m-tt-label{ font-size:10px; color:var(--m-muted); }
.m-tt-value{ font-size:14px; font-weight:600; }
.m-tx-total-item.m-income .m-tt-value{ color:var(--m-income); }
.m-tx-total-item.m-expense .m-tt-value{ color:var(--m-expense); }
.m-tx-count{ font-size:11px; color:var(--m-muted); padding:0 16px 4px; }

/* tx-item (home + transactions) */
.m-tx-list{ display:flex; flex-direction:column; gap:6px; padding:4px 16px; }
.m-tx-item{
  background:var(--m-surface); border:1px solid var(--m-border);
  border-radius:var(--m-radius-sm); padding:10px 12px; border-left-width:3px;
}
.m-tx-item.m-tx-income{ border-left-color:var(--m-income); }
.m-tx-item.m-tx-expense{ border-left-color:var(--m-expense); }
.m-tx-item.m-tx-transfer{ border-left-color:var(--m-transfer); }
.m-tx-row-main{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:4px; }
.m-tx-desc{ font-size:13.5px; font-weight:500; color:var(--m-text); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.m-tx-amount{ font-size:13.5px; font-weight:600; white-space:nowrap; flex-shrink:0; }
.m-tx-item.m-tx-income .m-tx-amount{ color:var(--m-income); }
.m-tx-item.m-tx-expense .m-tx-amount{ color:var(--m-expense); }
.m-tx-item.m-tx-transfer .m-tx-amount{ color:var(--m-transfer); }
.m-tx-row-meta{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.m-tx-date,.m-tx-cat,.m-tx-acc{ font-size:11px; color:var(--m-muted); }
.m-tx-cat::before,.m-tx-acc::before{ content:'·'; margin-right:4px; }
.m-transfer-label{ color:var(--m-transfer); }
.m-tx-status{ font-size:10px; font-weight:600; letter-spacing:.06em; padding:2px 6px; border-radius:4px; text-transform:uppercase; }
.m-status-pending{ background:rgba(251,191,36,.12); color:#fbbf24; }
.m-status-scheduled{ background:rgba(96,165,250,.12); color:#60a5fa; }

/* accounts */
.m-section-block{ margin-bottom:4px; }
.m-acc-list,.m-card-list{ display:flex; flex-direction:column; gap:8px; padding:0 16px; }
.m-acc-card{ background:var(--m-surface); border:1px solid var(--m-border); border-radius:var(--m-radius); padding:14px; }
.m-acc-card-top{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.m-acc-logo{ width:44px; height:44px; border-radius:10px; object-fit:contain; background:rgba(255,255,255,.05); flex-shrink:0; }
.m-acc-logo-placeholder{ width:44px; height:44px; border-radius:10px; background:rgba(255,255,255,.06); border:1px solid var(--m-border); }
.m-acc-info{ flex:1; min-width:0; }
.m-acc-name{ font-size:14px; font-weight:600; color:var(--m-text); display:block; }
.m-acc-type{ font-size:11px; color:var(--m-muted); }
.m-acc-primary-badge{ font-size:10px; font-weight:700; color:#fbbf24; background:rgba(251,191,36,.1); border:1px solid rgba(251,191,36,.2); border-radius:6px; padding:3px 7px; }
.m-acc-card-bottom{ display:flex; flex-direction:column; gap:2px; }
.m-acc-balance-label{ font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--m-muted); }
.m-acc-balance{ font-size:20px; font-weight:700; color:var(--m-text); }
.m-card-item{ display:flex; align-items:center; gap:12px; background:var(--m-surface); border:1px solid var(--m-border); border-radius:var(--m-radius-sm); padding:12px; }
.m-card-logo{ width:38px; height:38px; border-radius:8px; object-fit:contain; background:rgba(255,255,255,.05); flex-shrink:0; }
.m-card-logo-placeholder{ width:38px; height:38px; border-radius:8px; background:rgba(255,255,255,.06); border:1px solid var(--m-border); }
.m-card-info{ flex:1; min-width:0; }
.m-card-name{ font-size:13.5px; font-weight:600; color:var(--m-text); display:block; }
.m-card-meta{ font-size:11px; color:var(--m-muted); }

/* investments */
.m-invest-hero{ display:flex; flex-direction:column; align-items:center; padding:24px 16px 16px; gap:4px; }
.m-invest-hero-label{ font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--m-muted); }
.m-invest-hero-total{ font-size:30px; font-weight:700; color:var(--m-text); }
.m-invest-class-row{ display:flex; align-items:center; justify-content:space-between; padding:9px 16px; border-bottom:1px solid var(--m-border); }
.m-invest-class-row:last-child{ border-bottom:none; }
.m-invest-class-left{ display:flex; align-items:center; gap:10px; }
.m-inv-dot{ display:inline-block; width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.m-invest-class-name{ font-size:13px; color:var(--m-text); }
.m-invest-class-right{ display:flex; align-items:center; gap:8px; }
.m-invest-class-value{ font-size:13px; font-weight:600; color:var(--m-text); }
.m-invest-class-pct{ font-size:11px; color:var(--m-muted); min-width:42px; text-align:right; }
.m-invest-footer{ padding:12px 16px 4px; }
.m-invest-footer-note{ font-size:11px; color:var(--m-muted); font-style:italic; }

/* profile */
.m-profile-hero{ display:flex; flex-direction:column; align-items:center; padding:28px 16px 16px; gap:10px; }
.m-profile-avatar{ width:64px; height:64px; border-radius:50%; background:rgba(255,255,255,.08); border:2px solid var(--m-border); }
.m-profile-title{ font-size:18px; font-weight:700; color:var(--m-text); }
.m-profile-section{ margin:4px 16px; background:var(--m-surface); border:1px solid var(--m-border); border-radius:var(--m-radius); overflow:hidden; }
.m-profile-section-title{ font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--m-muted); padding:12px 14px 4px; }
.m-profile-row{ display:flex; justify-content:space-between; align-items:center; padding:12px 14px; }
.m-profile-row-label{ font-size:13px; color:var(--m-text); }
.m-profile-row-value{ font-size:12px; font-weight:600; }
.m-conn-ok{ color:#34d399; }
.m-conn-syncing{ color:#fbbf24; }
.m-conn-none{ color:rgba(148,163,184,.6); }
.m-profile-action{
  display:flex; align-items:center; width:100%; padding:13px 14px;
  background:none; border:none; border-top:1px solid var(--m-border);
  color:var(--m-text); font-size:13.5px; text-align:left; cursor:pointer; gap:10px;
}
.m-profile-action:hover{ background:rgba(255,255,255,.04); }
.m-profile-footer{ background:none !important; border:none !important; padding-top:4px; }
.m-profile-note{ font-size:11px; color:var(--m-muted); padding:0 2px; }
