refactor(treasury): move add button first and use col-3 cards

Add button now precedes the bank cards and each card sits in a col-3
grid cell.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

src/pages/financial/TreasuryPage.vue

@@ -3,27 +3,25 @@
     <DefaultHeaderPage title="Tesouraria" :show-filter-icon="false" />
 
     <div class="q-px-md"><DevBanner /></div>
-    <div class="row q-pa-md q-gutter-md items-stretch">
-      <FinancialCard
-        v-for="bank in cards"
-        :key="bank.key"
-        :title="bank.label"
-        :icon="bank.icon"
-        :financial-value="0"
-        :percentage="0"
-        clickable
-        :selected="selectedBank.key === bank.key"
-        @click="selectedBank = bank"
-      />
-
-      <q-card
-        v-if="!loading"
-        class="treasury-add-card"
-        @click="openCreateDialog"
-      >
-        <q-icon name="mdi-plus" size="28px" color="primary" />
-        <span class="text-subtitle2 text-primary">Adicionar banco</span>
-      </q-card>
+    <div class="row q-pa-md q-col-gutter-md items-stretch">
+      <div v-if="!loading" class="col-3">
+        <q-card class="treasury-add-card" @click="openCreateDialog">
+          <q-icon name="mdi-plus" size="28px" color="primary" />
+          <span class="text-subtitle2 text-primary">Adicionar banco</span>
+        </q-card>
+      </div>
+
+      <div v-for="bank in cards" :key="bank.key" class="col-3">
+        <FinancialCard
+          :title="bank.label"
+          :icon="bank.icon"
+          :financial-value="0"
+          :percentage="0"
+          clickable
+          :selected="selectedBank.key === bank.key"
+          @click="selectedBank = bank"
+        />
+      </div>
     </div>
 
     <div class="q-px-md">
@@ -104,8 +102,8 @@ onMounted(fetchAccounts);
 @import "src/css/quasar.variables.scss";
 
 .treasury-add-card {
-  flex: 1 1 0;
-  min-width: 220px;
+  width: 100%;
+  height: 100%;
   border-radius: 12px;
   border: 1.5px dashed #c0c0c0;
   box-shadow: none !important;