/* ==========================================================================
   Dashboard patrimonial partagé (modèle Finary) — extrait le 2026-08-12
   pour être utilisé à l'identique sur tableau-de-bord.html ET l'onglet
   "Mon Patrimoine" de espace-membre.html (voir assets/js/patrimoine-
   dashboard.js pour la logique JS correspondante). Palette GammaInvest
   (or/navy) à la place des couleurs Finary d'origine. Toujours en thème
   sombre (fond pur noir), pas de variante claire nécessaire.
   ========================================================================== */
/* ==========================================================================
   PHASE 1 — densification "terminal financier" (2026-08-21, demande de
   Jean : rapprocher le Dashboard d'un outil de suivi patrimonial pro type
   Bloomberg/Keepinvestiing, sans toucher à un seul calcul ni appel
   Supabase). Radius plus serré, paddings réduits, chiffres en tabular-nums
   pour un alignement propre colonne par colonne — uniquement du visuel.
   ========================================================================== */
/* ==========================================================================
   PHASE 2 — refonte "terminal financier" (2026-08-22, spec 27 points de
   Jean). Jetons de design (point 16 du brief) posés en variables CSS,
   mappés sur la palette sombre GammaInvest déjà en place (aucune couleur
   changée, juste nommée) pour que les nouveaux blocs (marchés, bandeau du
   jour, objectifs d'allocation) restent cohérents avec l'existant sans le
   modifier.
   ========================================================================== */
.fin-dash-root {
  --background-primary: #08090b;
  --background-secondary: rgba(255,255,255,0.03);
  --card-background: rgba(255,255,255,0.03);
  --border-subtle: rgba(255,255,255,0.08);
  --text-primary: #ffffff;
  --text-secondary: rgba(255,255,255,0.55);
  --text-tertiary: rgba(255,255,255,0.35);
  --positive: #7fd68f;
  --negative: #e2735c;
  --neutral: rgba(255,255,255,0.5);
}

.fin-dash, .fin-asset-panel, .fin-dash-left, .fin-dash-right,
.fin-asset-modal, .goal-bar-track, .dash-stat, .task-item, #task-suggestions .task-suggest-row,
.fin-today-banner, .fin-market-card, .fin-alloc-panel, .fin-alloc-row {
  font-variant-numeric: tabular-nums;
}

.fin-dash { display: grid; grid-template-columns: 1.6fr 1fr; gap: 14px; align-items: stretch; }
@media (max-width: 900px) { .fin-dash { grid-template-columns: 1fr; } }
.fin-dash-left, .fin-dash-right { background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 16px 18px; }
.fin-dash-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.fin-dash-select { font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:rgba(255,255,255,0.55); background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); padding:6px 12px; border-radius:6px; }
.fin-dash-periods { display:flex; gap:2px; flex-wrap:wrap; }
.fin-period { appearance:none; border:none; background:transparent; color:rgba(255,255,255,0.5); font-family:inherit; font-size:11.5px; font-weight:600; padding:5px 10px; border-radius:6px; cursor:pointer; transition:background .15s ease, color .15s ease; }
.fin-period:hover { color:#fff; }
.fin-period.is-active { background:rgba(255,255,255,0.1); color:#fff; }
.fin-dash-total { font-size:clamp(26px, 3.4vw, 36px); font-weight:800; color:#fff; line-height:1.1; }
.fin-dash-variation { display:flex; align-items:center; gap:10px; margin-top:8px; flex-wrap:wrap; }
.fin-variation-pill { font-size:12px; font-weight:700; padding:3px 9px; border-radius:6px; }
.fin-variation-pill.is-up { background:rgba(127,214,143,0.16); color:#7fd68f; }
.fin-variation-pill.is-down { background:rgba(226,115,92,0.16); color:#e2735c; }
.fin-variation-pill.is-flat { background:rgba(255,255,255,0.08); color:rgba(255,255,255,0.6); }
.fin-variation-label { font-size:12px; color:rgba(255,255,255,0.4); }
/* CORRECTIF 2026-08-24e (demande de Jean) : graphique agrandi (200px ->
   320px) pour mieux voir l'évolution du patrimoine dans l'encadré. */
.fin-dash-chart-wrap { margin-top:14px; height:320px; }
@media (max-width: 640px) { .fin-dash-chart-wrap { height:240px; } }
.fin-dash-hint { font-size:11.5px; color:rgba(255,255,255,0.35); margin-top:8px; }
.fin-dash-right-head { display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
.fin-dash-tabs { display:flex; gap:4px; background:rgba(255,255,255,0.04); border-radius:6px; padding:3px; }
.fin-subtab { appearance:none; border:none; background:transparent; color:rgba(255,255,255,0.5); font-family:inherit; font-size:12px; font-weight:600; padding:5px 14px; border-radius:5px; cursor:pointer; }
.fin-subtab.is-active { background:rgba(255,255,255,0.1); color:#fff; }
.fin-donut-wrap { position:relative; width:150px; height:150px; margin:4px auto 18px; }
.fin-donut-center { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.fin-donut-total { font-size:14px; font-weight:700; color:#fff; }
.fin-donut-label { font-size:10.5px; color:rgba(255,255,255,0.45); margin-top:2px; }
.fin-empty { font-size:13px; color:rgba(255,255,255,0.45); text-align:center; padding:16px 0; }

/* ==========================================================================
   Liste classée à côté du donut (CORRECTIF 2026-08-17, capture Finary
   fournie par Jean : nom + barre de répartition horizontale + % à droite,
   triée du plus gros au plus petit actif) — vient compléter le donut déjà
   en place, qui seul ne montrait pas la hiérarchie entre les actifs aussi
   clairement qu'un classement avec barres.
   ========================================================================== */
.fin-donut-list { display:flex; flex-direction:column; gap:2px; margin-top:4px; }
.fin-donut-list-item { display:grid; grid-template-columns: minmax(0,1fr) auto auto; align-items:center; gap:4px 12px; padding:7px 2px; border-bottom:1px solid rgba(255,255,255,0.05); }
.fin-donut-list-item:last-child { border-bottom:none; }
.fin-donut-list-name { font-size:13px; font-weight:600; color:rgba(255,255,255,0.85); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fin-donut-list-amount { font-size:12.5px; font-weight:600; color:rgba(255,255,255,0.5); text-align:right; white-space:nowrap; }
.fin-donut-list-pct { font-size:13px; font-weight:700; color:#fff; text-align:right; }
/* CORRECTIF 2026-08-23 : barre légèrement plus épaisse et piste plus
   contrastée — demande de Jean, qui ne voyait qu'un simple séparateur fin
   sous chaque ligne (cache navigateur probable, la largeur proportionnelle
   au poids était déjà calculée côté JS, voir renderDonutList/weightColor).
   Ce correctif rend la barre remplie plus difficile à manquer dans tous
   les cas. */
.fin-donut-list-bar-wrap { grid-column: 1 / -1; height:6px; border-radius:999px; background:rgba(255,255,255,0.09); overflow:hidden; }
.fin-donut-list-bar { height:100%; min-width:2px; border-radius:999px; transition:width 0.4s ease; }

/* ==========================================================================
   Aperçu enrichi en tête de la modale "Détails de l'actif" (CORRECTIF
   2026-08-17), pour les comptes-titres (PEA/CTO/Cryptomonnaies) déjà
   renseignés : valeur actuelle, +/- value depuis le PRU, et depuis quand le
   compte est suivi — façon "vue de compte" Finary, mais construite
   uniquement à partir de ce qui est réellement saisi (pas de positions
   individuelles ni de cours de marché en direct, non suivis ici).
   ========================================================================== */
.fin-asset-modal-overview { margin:-4px 0 20px; padding:18px 18px 16px; background:linear-gradient(155deg, rgba(201,162,75,0.12), rgba(255,255,255,0.03)); border:1px solid rgba(201,162,75,0.22); border-radius:14px; }
.fin-asset-modal-overview-total { font-size:26px; font-weight:800; color:#fff; line-height:1.15; }
.fin-asset-modal-overview-row { display:flex; align-items:center; gap:10px; margin-top:6px; flex-wrap:wrap; }
.fin-asset-modal-overview-gain { font-size:13px; font-weight:700; padding:3px 9px; border-radius:999px; }
.fin-asset-modal-overview-gain.is-up { background:rgba(127,214,143,0.16); color:#7fd68f; }
.fin-asset-modal-overview-gain.is-down { background:rgba(226,115,92,0.16); color:#e2735c; }
.fin-asset-modal-overview-gain.is-flat { background:rgba(255,255,255,0.08); color:rgba(255,255,255,0.6); }
.fin-asset-modal-overview-since { font-size:12px; color:rgba(255,255,255,0.45); }
.fin-asset-modal-overview-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px; padding-top:14px; border-top:1px solid rgba(255,255,255,0.08); }
.fin-asset-modal-overview-stat { text-align:left; }
.fin-asset-modal-overview-stat span { display:block; font-size:11px; color:rgba(255,255,255,0.45); margin-bottom:3px; }
.fin-asset-modal-overview-stat strong { font-size:14px; color:#fff; font-weight:700; }
@media (max-width: 420px) { .fin-asset-modal-overview-stats { grid-template-columns:1fr 1fr; } }

/* ==========================================================================
   Table d'actifs façon Finary (CORRECTIF 2026-08-13, capture de référence
   fournie par Jean) : colonnes strictement alignées Nom / Répartition /
   Valeur / +/- value, via une grille CSS PARTAGÉE (.fin-asset-grid-row)
   appliquée à l'entête, aux lignes de groupe ET aux lignes d'actif — c'est
   ce partage de grille qui garantit l'alignement exact demandé (montants
   entre eux, plus-values entre elles), quelle que soit la catégorie.
   ========================================================================== */
.fin-asset-panel { margin-top: 16px; background: rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 16px 18px; }
.fin-asset-panel-head { margin-bottom:14px; }
.fin-asset-panel-head h3 { margin:0 0 4px; font-size:14.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:rgba(255,255,255,0.7); }
.fin-asset-panel-head p { margin:0; font-size:12.5px; color:rgba(255,255,255,0.45); }

/* Formulaire d'ajout — replié par défaut, ouvert via le bouton "+ Ajouter un
   actif" de la barre d'outils (voir ensureAssetTableShell() en JS). */
.fin-asset-form { display:none; gap:10px; flex-wrap:wrap; margin-bottom:20px; padding:16px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:12px; }
.fin-asset-form.is-open { display:flex; }
.fin-asset-form select, .fin-asset-form input { flex:1; min-width:140px; padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.15); background:rgba(255,255,255,0.04); color:#fff; font-family:inherit; font-size:13.5px; }
.fin-asset-form button { flex-shrink:0; }
/* CORRECTIF 2026-08-12 : la liste déroulante d'un <select> est rendue par
   l'OS/le navigateur, qui n'hérite pas toujours du fond semi-transparent du
   <select> lui-même — sur certains systèmes, les options s'affichaient en
   blanc sur blanc, illisibles. Fond plein (non transparent) et texte clair
   forcés explicitement sur le <select> ET sur chaque <option>. */
.fin-asset-form select { background-color: #14161b; }
.fin-asset-form select option { background-color: #14161b; color: #fff; }

/* Barre d'outils au-dessus de la table (+ Ajouter, Grouper par type,
   Rechercher) — construite dynamiquement, voir ensureAssetTableShell(). */
.fin-asset-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.fin-asset-toolbar-left { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.fin-asset-add-btn { appearance:none; border:1px solid rgba(255,255,255,0.16); background:rgba(255,255,255,0.05); color:#fff; font-family:inherit; font-size:12.5px; font-weight:700; padding:8px 16px; border-radius:999px; cursor:pointer; transition:background .15s ease; }
.fin-asset-add-btn:hover { background:rgba(255,255,255,0.1); }
.fin-asset-group-toggle { display:flex; align-items:center; gap:8px; font-size:12.5px; color:rgba(255,255,255,0.6); font-weight:600; cursor:pointer; user-select:none; }
.fin-asset-group-toggle input { position:absolute; opacity:0; width:0; height:0; }
.fin-asset-toggle-track { width:34px; height:19px; border-radius:999px; background:rgba(255,255,255,0.14); position:relative; transition:background .15s ease; flex-shrink:0; }
.fin-asset-toggle-thumb { position:absolute; top:2px; left:2px; width:15px; height:15px; border-radius:50%; background:#fff; transition:transform .15s ease; }
.fin-asset-group-toggle input:checked + .fin-asset-toggle-track { background:var(--gold-light); }
.fin-asset-group-toggle input:checked + .fin-asset-toggle-track .fin-asset-toggle-thumb { transform:translateX(15px); background:#050609; }
.fin-asset-search-wrap { display:flex; align-items:center; gap:8px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.12); border-radius:999px; padding:8px 14px; min-width:200px; }
.fin-asset-search-wrap svg { width:15px; height:15px; color:rgba(255,255,255,0.4); flex-shrink:0; }
.fin-asset-search-wrap input { border:none; background:transparent; outline:none; color:#fff; font-family:inherit; font-size:13px; width:100%; }
.fin-asset-search-wrap input::placeholder { color:rgba(255,255,255,0.35); }

/* Grille partagée — 5 colonnes : Nom (flex) / Répartition / Valeur /
   +/- value / Actions. Sur mobile, on autorise le défilement horizontal
   plutôt que de casser l'alignement (voir .fin-asset-table-body). */
.fin-asset-grid-row { display:grid; grid-template-columns: minmax(180px,2fr) 100px 120px 130px 76px; align-items:center; gap:10px; }
.fin-asset-table-head { padding:0 4px 8px; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:rgba(255,255,255,0.35); border-bottom:1px solid rgba(255,255,255,0.08); }
.fin-asset-table-head span:nth-child(2), .fin-asset-table-head span:nth-child(3), .fin-asset-table-head span:nth-child(4) { text-align:right; }
.fin-asset-table-body { max-width:100%; overflow-x:auto; }
@media (max-width: 720px) { .fin-asset-grid-row { grid-template-columns: minmax(160px,1.6fr) 80px 100px 110px 60px; } }
@media (max-width: 420px) { .fin-donut-list-amount { display:none; } .fin-donut-list-item { grid-template-columns: minmax(0,1fr) auto; } }

.fin-asset-group-head { width:100%; padding:12px 4px; background:transparent; border:none; border-top:1px solid rgba(255,255,255,0.08); cursor:pointer; font-family:inherit; text-align:left; }
.fin-asset-group:first-child .fin-asset-group-head { border-top:none; }
.fin-asset-group-head .fin-asset-row-namecell { gap:10px; }
.fin-asset-group-caret { width:14px; height:14px; color:rgba(255,255,255,0.4); transition: transform .18s ease; flex-shrink:0; }
.fin-asset-group.is-collapsed .fin-asset-group-caret { transform: rotate(-90deg); }
.fin-asset-group.is-collapsed .fin-asset-group-rows { display:none; }
.fin-asset-group-name { font-size:14.5px; font-weight:700; color:#fff; }
.fin-asset-group-count { font-size:11.5px; color:rgba(255,255,255,0.4); background:rgba(255,255,255,0.06); padding:2px 8px; border-radius:999px; }
.fin-asset-group-total { font-weight:700; color:var(--gold-light); }

.fin-asset-row-detailed { padding:7px 4px 7px 30px; border-top:1px solid rgba(255,255,255,0.04); }
.fin-asset-row-clickable { cursor:pointer; border-radius:8px; transition:background .15s ease; }
.fin-asset-row-clickable:hover, .fin-asset-row-clickable:focus-visible { background:rgba(255,255,255,0.035); outline:none; }
.fin-asset-row-namecell { display:flex; align-items:center; gap:10px; min-width:0; }
.fin-asset-row-avatar { flex-shrink:0; width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,0.06); display:flex; align-items:center; justify-content:center; font-size:15px; }
.fin-asset-row-nametext { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.fin-asset-row-name { font-size:13.5px; font-weight:600; color:#fff; }
.fin-asset-row-sub { font-size:11.5px; color:rgba(255,255,255,0.4); display:flex; align-items:center; gap:6px; }
.fin-asset-row-date { font-size:10.5px; color:rgba(255,255,255,0.4); background:rgba(255,255,255,0.06); padding:1px 7px; border-radius:999px; }
.fin-asset-row-pctcell { display:flex; align-items:center; justify-content:flex-end; gap:7px; font-size:12.5px; color:rgba(255,255,255,0.55); }
.fin-asset-ring { width:14px; height:14px; border-radius:50%; flex-shrink:0; }
.fin-asset-row-valuecell { text-align:right; font-size:13.5px; font-weight:700; color:#fff; }
.fin-asset-row-latentcell { text-align:right; }
.fin-asset-row-latent { font-size:12.5px; font-weight:700; }
.fin-asset-row-latent.is-up { color:#7fd68f; }
.fin-asset-row-latent.is-down { color:#e2735c; }
.fin-asset-row-latent.is-empty { color:rgba(255,255,255,0.25); font-weight:400; }
/* CORRECTIF 2026-08-23 : % à côté du montant € dans "+/- value" (demande de
   Jean) — même couleur que le montant, un peu plus discret (poids/opacité
   réduits) pour rester lisible sans dominer le montant en €. */
.fin-asset-row-latent-pct { font-weight:600; opacity:0.75; }
.fin-asset-row-actionscell { display:flex; align-items:center; justify-content:flex-end; gap:6px; }

.fin-asset-inline-input { background:transparent; border:1px solid transparent; border-radius:8px; padding:5px 7px; color:rgba(255,255,255,0.85); font-family:inherit; font-size:13.5px; transition:border-color .15s ease, background .15s ease; width:100%; }
.fin-asset-inline-input:hover, .fin-asset-inline-input:focus { border-color:rgba(255,255,255,0.15); background:rgba(255,255,255,0.04); outline:none; }
.fin-asset-inline-label { font-weight:600; }
.fin-asset-inline-amount { text-align:right; }
.fin-asset-row-amount-readonly { font-size:13.5px; font-weight:700; color:#fff; }
.fin-asset-row-delete { flex-shrink:0; width:24px; height:24px; border-radius:50%; border:none; background:transparent; color:rgba(255,255,255,0.3); font-size:15px; cursor:pointer; transition:color .15s ease, background .15s ease; }
.fin-asset-row-delete:hover { color:#e2735c; background:rgba(226,115,92,0.1); }
.fin-asset-row-detail-btn { flex-shrink:0; appearance:none; border:1px solid rgba(255,255,255,0.15); background:rgba(255,255,255,0.04); color:rgba(255,255,255,0.75); font-family:inherit; font-size:11px; font-weight:600; padding:5px 10px; border-radius:999px; cursor:pointer; transition:background .15s ease, color .15s ease; white-space:nowrap; }
.fin-asset-row-detail-btn:hover { background:rgba(255,255,255,0.1); color:#fff; }

.fin-asset-modal-overlay { position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,0.72); backdrop-filter: blur(4px); padding:20px; }
.fin-asset-modal-overlay.is-open { display:flex; }
.fin-asset-modal { position:relative; width:100%; max-width:440px; max-height:88vh; overflow-y:auto; background:#111319; border:1px solid rgba(255,255,255,0.1); border-radius: 12px; padding:24px 22px 20px; box-shadow:0 20px 60px rgba(0,0,0,0.5); }
.fin-asset-modal h3 { margin:0 0 18px; font-size:17px; color:#fff; padding-right:24px; }
.fin-asset-modal-close { position:absolute; top:16px; right:16px; width:28px; height:28px; border-radius:50%; border:none; background:rgba(255,255,255,0.06); color:rgba(255,255,255,0.6); font-size:16px; cursor:pointer; }
.fin-asset-modal-close:hover { background:rgba(255,255,255,0.12); color:#fff; }
.fin-modal-field { display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.fin-modal-field span { font-size:12.5px; color:rgba(255,255,255,0.55); font-weight:600; }
.fin-modal-field input { padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.15); background:#14161b; color:#fff; font-family:inherit; font-size:13.5px; }
.fin-modal-symbole-hint { margin:-8px 0 14px; font-size:11.5px; color:rgba(255,255,255,0.4); line-height:1.5; }
.fin-modal-checkbox { display:flex; align-items:center; gap:10px; margin-bottom:14px; font-size:13.5px; color:rgba(255,255,255,0.8); cursor:pointer; }
.fin-modal-checkbox input { width:16px; height:16px; }
.fin-asset-modal-computed { margin:16px 0; padding:14px 16px; background:rgba(255,255,255,0.04); border-radius:10px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.fin-asset-modal-computed strong { font-size:15px; color:#fff; }
.fin-asset-modal-computed .is-up { color:#7fd68f; font-weight:700; font-size:13px; }
.fin-asset-modal-computed .is-down { color:#e2735c; font-weight:700; font-size:13px; }
.fin-asset-modal-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:6px; }
.fin-asset-modal-delete { appearance:none; border:none; background:transparent; color:rgba(226,115,92,0.8); font-family:inherit; font-size:12.5px; font-weight:600; cursor:pointer; padding:8px 4px; }
.fin-asset-modal-delete:hover { color:#e2735c; }
.fin-asset-modal-save { appearance:none; border:none; background:var(--gold-light); color:#050609; font-family:inherit; font-size:13.5px; font-weight:700; padding:11px 22px; border-radius:999px; cursor:pointer; margin-left:auto; }
.fin-asset-modal-save:hover { opacity:0.9; }
.fin-asset-modal-save:disabled { opacity:0.6; cursor:default; }

/* ==========================================================================
   PHASE 2b (2026-08-22) — Vue des marchés (spec point 6). Widget
   TradingView "Ticker Tape" (gratuit, sans clé API) plutôt qu'un état
   "non connecté" : mêmes données réellement en direct que "Gamma Radar"
   sur observatoire.html. Le wrapper garde juste un peu d'air et un fond
   cohérent avec les autres blocs du dashboard.
   ========================================================================== */
.fin-market-strip { background:var(--card-background); border:1px solid var(--border-subtle); border-radius:10px; padding:6px 4px; margin-bottom:12px; overflow:hidden; }
.fin-market-strip-note { font-size:11px; color:var(--text-tertiary); margin:-4px 0 16px; }

/* ==========================================================================
   Bandeau "Portefeuille du jour" (spec point 7) — reprend le total déjà
   calculé par renderFinChart()/currentTotal() (pas de nouveau calcul, pas
   de duplication de logique) et ajoute la date de dernière mise à jour
   réelle. Toggle "Live" retiré le 2026-08-24 (demande de Jean).
   ========================================================================== */
.fin-today-banner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; background:var(--card-background); border:1px solid var(--border-subtle); border-radius:10px; padding:16px 18px; margin-bottom:14px; }
.fin-today-banner-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--text-secondary); margin-bottom:4px; }
.fin-today-banner-total { font-size:clamp(22px, 2.8vw, 28px); font-weight:800; color:var(--text-primary); line-height:1.1; }
.fin-today-banner-updated { font-size:12px; color:var(--text-tertiary); margin-top:4px; }

/* ==========================================================================
   Objectifs d'allocation par catégorie (spec points 12-14) — cible % par
   catégorie saisie par le membre (table patrimoine_allocation_targets,
   vide par défaut), écart calculé côté client : Écart = Cible − Actuel.
   ========================================================================== */
.fin-alloc-panel { margin-top:16px; background:var(--card-background); border:1px solid var(--border-subtle); border-radius:10px; padding:16px 18px; }
.fin-alloc-panel-head { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:4px; }
.fin-alloc-panel-head h3 { margin:0; font-size:14.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--text-secondary); }
.fin-alloc-reset { appearance:none; border:1px solid var(--border-subtle); background:transparent; color:var(--text-tertiary); font-family:inherit; font-size:11.5px; font-weight:600; padding:5px 12px; border-radius:999px; cursor:pointer; }
.fin-alloc-reset:hover { color:var(--negative); border-color:rgba(226,115,92,0.35); }
.fin-alloc-panel-sub { margin:0 0 14px; font-size:12.5px; color:var(--text-tertiary); }
.fin-alloc-row { display:grid; grid-template-columns: minmax(140px,1.5fr) 90px 100px 90px 1fr; align-items:center; gap:10px; padding:9px 2px; border-top:1px solid rgba(255,255,255,0.05); }
.fin-alloc-row:first-child { border-top:none; }
.fin-alloc-name { font-size:13px; font-weight:600; color:var(--text-primary); }
.fin-alloc-current { font-size:12.5px; color:var(--text-secondary); text-align:right; }
.fin-alloc-target-input { width:100%; padding:6px 8px; border-radius:8px; border:1px solid var(--border-subtle); background:#14161b; color:#fff; font-family:inherit; font-size:13px; text-align:right; }
.fin-alloc-gap { font-size:12px; font-weight:700; text-align:right; padding:3px 8px; border-radius:999px; }
.fin-alloc-gap.is-over { background:rgba(226,115,92,0.14); color:var(--negative); }
.fin-alloc-gap.is-under { background:rgba(127,214,143,0.14); color:var(--positive); }
.fin-alloc-gap.is-empty { color:var(--text-tertiary); background:transparent; text-align:right; padding:3px 0; }
.fin-alloc-bar-track { height:5px; border-radius:999px; background:rgba(255,255,255,0.06); overflow:hidden; position:relative; }
.fin-alloc-bar-fill { position:absolute; inset:0 auto 0 0; border-radius:999px; background:var(--text-tertiary); }
.fin-alloc-bar-fill.is-over { background:var(--negative); }
.fin-alloc-bar-fill.is-under { background:var(--positive); }
@media (max-width: 640px) { .fin-alloc-row { grid-template-columns: minmax(120px,1.3fr) 70px 80px 70px; } .fin-alloc-bar-track { display:none; } }