MelissaFinanceiro mobile: .mf-card 300px fixo + scroll interno

Em mobile cada .mf-card tem min/max-height 300px com scroll no body
(flex: 1 + min-height: 0 + overflow-y: auto). Garante que o "Ultimos
lancamentos" fique visivel e cada card tenha altura previsivel sem
consumir toda a altura do .mf-body. Chart wrap vira flex: 1 dentro
do body de 300px - head.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/layout/melissa/MelissaFinanceiro.vue

@@ -885,25 +885,30 @@ onMounted(async () => {
         order: -1;
         margin-left: 0;
     }
-    /* Row 50/50 empilha em mobile, com altura natural por card.
-       Reseta flex/overflow do desktop pra evitar que os cards
-       consumam toda a altura do .mf-body e empurrem o
-       "Ultimos lancamentos" pra fora do scroll. */
+    /* Row 50/50 empilha em mobile. Todo .mf-card vira slot fixo de
+       300px com scroll interno no body — assim o "Ultimos lancamentos"
+       nao some e cada card mantem altura previsivel. */
     .mf-cards-row {
         flex-direction: column;
     }
     .mf-cards-row > .mf-card {
         flex: 0 0 auto;
     }
-    .mf-cards-row > .mf-card .mf-card__body {
-        flex: 0 0 auto;
-        min-height: 0;
-        overflow-y: visible;
+    .mf-card {
+        min-height: 300px;
+        max-height: 300px;
+        display: flex;
+        flex-direction: column;
     }
-    .mf-cards-row > .mf-card--chart .mf-chart-wrap {
-        flex: 0 0 auto;
-        height: 240px;
-        min-height: 240px;
+    .mf-card__body {
+        flex: 1;
+        min-height: 0;
+        overflow-y: auto;
+    }
+    .mf-card--chart .mf-chart-wrap {
+        flex: 1;
+        height: auto;
+        min-height: 0;
     }
 }
 </style>