/* ==========================================================================
   PlexRentabilité — feuille de style
   Palette « registre comptable » : encre froide, vert billet, brique.
   ========================================================================== */
:root {
  --encre: #101c26;
  --ardoise: #4a5c6a;
  --gris: #7b8b96;
  --papier: #eef1f0;
  --carte: #ffffff;
  --trait: #d9e0dd;
  --vert: #0b6b4f;
  --vert-pale: #e2efe9;
  --brique: #a32a1c;
  --brique-pale: #fae7e4;
  --ambre: #9a6300;
  --ambre-pale: #fbf0da;
  --serif: ui-serif, "New York", Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --r: 14px;
  --hautNav: calc(60px + env(safe-area-inset-bottom));
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--papier);
  color: var(--encre);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.45;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior-y: none;
}

h1, h2, h3 { font-family: var(--serif); font-weight: 600; letter-spacing: -0.01em; margin: 0; }
h1 { font-size: 1.5rem; }
h2 { font-size: 1.15rem; }
h3 { font-size: 1rem; }

.num { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }

/* ---------- Structure ---------- */
.entete {
  position: sticky; top: 0; z-index: 20;
  background: var(--encre); color: #fff;
  padding: calc(env(safe-area-inset-top) + 12px) 16px 12px;
  display: flex; align-items: center; gap: 12px;
}
.entete h1 { color: #fff; flex: 1; font-size: 1.25rem; }
.entete .sous { color: #9fb3ae; font-size: .75rem; margin-top: 2px; font-family: var(--sans); }
.entete .btn-icone { color: #fff; }
/* 8.0.0 — Bouton de langue (FR / EN), toujours visible dans l'en-tête. Cible
   tactile de 44 px de haut au minimum. */
.btn-langue {
  flex: none; min-width: 44px; min-height: 44px; padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, .45); border-radius: 10px;
  background: none; color: #fff; font: 600 .85rem var(--sans); letter-spacing: .04em;
}
@media print { .btn-langue { display: none !important; } }

.contenu { padding: 16px 16px calc(var(--hautNav) + 24px); max-width: 720px; margin: 0 auto; }

.nav {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 30;
  display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  background: rgba(255,255,255,.94);
  -webkit-backdrop-filter: saturate(150%) blur(12px); backdrop-filter: saturate(150%) blur(12px);
  border-top: 1px solid var(--trait);
  padding-bottom: env(safe-area-inset-bottom);
}
.nav button {
  background: none; border: 0; padding: 9px 4px 8px;
  font: inherit; font-size: .68rem; color: var(--gris);
  display: flex; flex-direction: column; align-items: center; gap: 3px;
}
.nav button .pic { font-size: 1.15rem; line-height: 1; }
.nav button[aria-current="true"] { color: var(--vert); font-weight: 600; }

/* ---------- Cartes ---------- */
.carte {
  background: var(--carte); border: 1px solid var(--trait);
  border-radius: var(--r); padding: 16px; margin-bottom: 14px;
}
.carte + .carte { margin-top: 0; }
.carte-plex { display: block; width: 100%; text-align: left; }
.carte-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.etiquette { font-size: .7rem; text-transform: uppercase; letter-spacing: .09em; color: var(--gris); font-weight: 600; }

.grille { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.grille-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }

.tuile { background: var(--papier); border-radius: 10px; padding: 10px 11px; }
.tuile .cle { font-size: .68rem; color: var(--ardoise); display: flex; align-items: center; gap: 4px; }
.tuile .val { font-family: var(--serif); font-size: 1.22rem; font-variant-numeric: tabular-nums; margin-top: 3px; }
.tuile.pos .val { color: var(--vert); }
.tuile.neg .val { color: var(--brique); }
.tuile.grande .val { font-size: 1.75rem; }

.btn-info {
  border: 0; background: var(--trait); color: var(--encre);
  width: 15px; height: 15px; border-radius: 50%; font-size: .62rem;
  line-height: 15px; padding: 0; font-weight: 700; flex: none;
}

/* ---------- Boutons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  background: var(--vert); color: #fff; border: 0; border-radius: 11px;
  padding: 13px 16px; font: inherit; font-weight: 600; font-size: .95rem; width: 100%;
}
.btn.secondaire { background: var(--carte); color: var(--encre); border: 1px solid var(--trait); }
.btn.discret { background: none; color: var(--ardoise); border: 1px solid var(--trait); padding: 9px 12px; font-size: .85rem; }
.btn.danger { background: none; color: var(--brique); border: 1px solid #e8c6c1; }
.btn-icone { background: none; border: 0; font-size: 1.05rem; padding: 6px; color: var(--ardoise); }
.rangee-btn { display: flex; gap: 8px; margin-bottom: 14px; }
.rangee-btn .btn { width: auto; flex: 1; }

/* ---------- Formulaire ---------- */
details.section {
  background: var(--carte); border: 1px solid var(--trait);
  border-radius: var(--r); margin-bottom: 10px; overflow: hidden;
}
details.section > summary {
  list-style: none; cursor: pointer; padding: 15px 16px;
  display: flex; align-items: center; gap: 10px; font-weight: 600;
}
details.section > summary::-webkit-details-marker { display: none; }
details.section > summary::after { content: "▾"; margin-left: auto; color: var(--gris); transition: transform .18s; }
details.section[open] > summary::after { transform: rotate(180deg); }
details.section > summary .resume { margin-left: auto; font-weight: 400; font-size: .8rem; color: var(--gris); font-variant-numeric: tabular-nums; }
details.section[open] > summary .resume { display: none; }
.section-corps { padding: 0 16px 16px; border-top: 1px solid var(--trait); padding-top: 14px; }

.champ { margin-bottom: 12px; }
.champ label { display: block; font-size: .8rem; color: var(--ardoise); margin-bottom: 5px; }
.champ input, .champ select {
  width: 100%; padding: 11px 12px; font: inherit; font-size: 1rem;
  border: 1px solid var(--trait); border-radius: 10px; background: #fff; color: var(--encre);
  font-variant-numeric: tabular-nums; -webkit-appearance: none; appearance: none;
}
.champ input:focus, .champ select:focus { outline: 2px solid var(--vert); outline-offset: 1px; border-color: var(--vert); }
/* Texte d'aide hors d'une case (8.2.0) : secondaire, comme dans les cases.
   Il s'affichait à la taille du texte principal. */
.aide { font-size: .82rem; color: var(--ardoise); line-height: 1.45; }
.champ .aide { font-size: .72rem; color: var(--gris); margin-top: 4px; }
/* Saisie refusée (8.1.0) : la case et son message, en brique. */
.champ input[aria-invalid="true"] { border-color: var(--brique); background: var(--brique-pale); }
.champ input[aria-invalid="true"]:focus { outline-color: var(--brique); border-color: var(--brique); }
.erreur-saisie { font-size: .76rem; color: #6d1a11; margin-top: 4px; }
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.interrupteur { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; }
.interrupteur span { font-size: .9rem; }
.interrupteur input { width: 22px; height: 22px; accent-color: var(--vert); }
.segments { display: flex; background: var(--papier); border-radius: 10px; padding: 3px; gap: 3px; }
.segments button {
  flex: 1; border: 0; background: none; padding: 9px 4px; border-radius: 8px;
  font: inherit; font-size: .82rem; color: var(--ardoise);
}
.segments button[aria-pressed="true"] { background: #fff; color: var(--encre); font-weight: 600; box-shadow: 0 1px 3px rgba(16,28,38,.14); }

.bloc-liste { border: 1px solid var(--trait); border-radius: 12px; padding: 12px; margin-bottom: 10px; background: #fcfdfd; }
.bloc-liste.inactif { opacity: .6; border-style: dashed; }
.bloc-liste .bloc-tete { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.bloc-liste .bloc-tete strong { font-size: .9rem; }

/* ---------- Barre collante de résultat ---------- */
/* --hautEntete : hauteur réelle de l'en-tête, mesurée par app.js. Sans elle,
   la barre glissait sous l'en-tête et ses étiquettes disparaissaient. */
.barre-vive {
  position: sticky; top: var(--hautEntete, calc(env(safe-area-inset-top) + 72px)); z-index: 15;
  background: var(--encre); color: #fff; border-radius: 12px;
  padding: 10px 14px; margin-bottom: 14px;
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
}
.barre-vive div { text-align: center; }
.barre-vive .cle { font-size: .62rem; color: #9fb3ae; text-transform: uppercase; letter-spacing: .07em; }
.barre-vive .val { font-family: var(--serif); font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.barre-vive .val.pos { color: #6fd3a8; }
.barre-vive .val.neg { color: #ff9b8c; }

/* ---------- Avis ---------- */
.avis { border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; font-size: .85rem; border: 1px solid; }
.avis strong { display: block; margin-bottom: 3px; font-size: .9rem; }
.avis.rouge { background: var(--brique-pale); border-color: #eec7c1; color: #6d1a11; }
.avis.orange { background: var(--ambre-pale); border-color: #efdcb3; color: #6a4400; }
.avis.info { background: var(--vert-pale); border-color: #c4dfd4; color: #0a4635; }

/* ---------- Tableaux ---------- */
.tableau-defile { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -16px; padding: 0 16px; }
table { border-collapse: collapse; width: 100%; font-size: .78rem; font-variant-numeric: tabular-nums; }
th, td { padding: 7px 9px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--trait); }
th { font-size: .66rem; text-transform: uppercase; letter-spacing: .05em; color: var(--gris); font-weight: 600; }
th:first-child, td:first-child { text-align: left; position: sticky; left: 0; background: var(--carte); }
tbody tr:nth-child(odd) td { background: #fafbfb; }
tbody tr:nth-child(odd) td:first-child { background: #fafbfb; }
table.compact th, table.compact td { padding: 6px 5px; font-size: .72rem; }
td.neg { color: var(--brique); }
td.pos { color: var(--vert); }

/* ---------- Graphiques ---------- */
.graphique { width: 100%; height: auto; display: block; }
.legende { display: flex; flex-wrap: wrap; gap: 12px; font-size: .74rem; color: var(--ardoise); margin-top: 8px; }
.legende i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; }

/* ---------- Modale ---------- */
.modale { position: fixed; inset: 0; z-index: 60; display: flex; align-items: flex-end; }
.modale[hidden] { display: none; }
.modale-fond { position: absolute; inset: 0; background: rgba(16,28,38,.5); }
.modale-boite {
  position: relative; background: var(--carte); width: 100%; max-height: 88vh;
  border-radius: 18px 18px 0 0; display: flex; flex-direction: column; overflow: hidden;
  animation: monte .2s ease-out;
}
@keyframes monte { from { transform: translateY(24px); opacity: .6 } to { transform: none; opacity: 1 } }
@media (prefers-reduced-motion: reduce) { .modale-boite { animation: none } }
.modale-tete { flex: none; display: flex; align-items: center; gap: 10px; padding: 16px; border-bottom: 1px solid var(--trait); }
.modale-tete h2 { flex: 1; font-size: 1.05rem; }
.modale-corps { flex: 1 1 auto; min-height: 0; padding: 16px; padding-bottom: calc(16px + env(safe-area-inset-bottom)); overflow-y: auto; font-size: .9rem; }
.modale-corps p { margin: 0 0 10px; }

/* ---------- Divers ---------- */
.vide { text-align: center; padding: 40px 20px; color: var(--ardoise); }
.vide .pic { font-size: 2.2rem; }
.pied { font-size: .72rem; color: var(--gris); text-align: center; padding: 18px 0 4px; line-height: 1.5; }
.puce { display: inline-block; font-size: .68rem; padding: 2px 8px; border-radius: 20px; background: var(--papier); color: var(--ardoise); font-weight: 600; }
.puce.pos { background: var(--vert-pale); color: var(--vert); }
.puce.neg { background: var(--brique-pale); color: var(--brique); }
@media (min-width: 560px) { .grille-3 { grid-template-columns: repeat(3, 1fr) } }

.rapport-entete-impression{display:none}
@media print{
  *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  body{background:#fff!important}
  .entete,.nav,.rapport-actions,.btn,.btn-icone{display:none!important}
  .contenu{padding:0!important;max-width:none!important}
  .rapport-entete-impression{display:block!important;padding:18px 0;border-bottom:3px solid #2f765b;margin-bottom:18px}
  .rapport-entete-impression h1{margin:0 0 8px;color:#17382e}
  .carte,.barre-vive,.avis{break-inside:avoid}
  .tableau-defile{overflow:visible!important}
  /* 8.5.6 : l'explication de l'IA fait partie du rapport ; pas sa case de code ni son bouton. */
  .carte-ia .champ,.carte-ia [data-analyse-lancer],.hero-actions{display:none!important}
}

/* v6 — validation */
.avis ul{padding-left:1rem}.avis li{margin:.2rem 0}

/* V6 finale — états indicatifs accessibles : couleur + libellé */
.tuile.etat-vert,.tuile.etat-jaune,.tuile.etat-rouge{position:relative}
.tuile.etat-vert::after{content:"✓ Repère favorable";font-size:.68rem;font-weight:700}
.tuile.etat-jaune::after{content:"! Zone de vigilance";font-size:.68rem;font-weight:700}
.tuile.etat-rouge::after{content:"× Repère défavorable";font-size:.68rem;font-weight:700}
/* Interface en anglais (html lang="en-CA") */
.tuile.etat-vert:lang(en)::after{content:"✓ Favourable benchmark"}
.tuile.etat-jaune:lang(en)::after{content:"! Caution zone"}
.tuile.etat-rouge:lang(en)::after{content:"× Unfavourable benchmark"}
.tuile.etat-vert{border:2px solid #0b6b4f}
.tuile.etat-jaune{border:2px solid #a66a00}
.tuile.etat-rouge{border:2px solid #a32a1c}
@media print{.glossaire-impression{break-before:page}.tuile{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

/* Analyse IA et import d'annonce */
.analyse-texte{margin-top:14px;font-size:.88rem;line-height:1.55}
.analyse-texte p{margin:0 0 10px}
.import-form label{display:block;font-size:.8rem;font-weight:600;margin:12px 0 4px}
.import-form input[type=text],.import-form input[type=url],.import-form textarea{width:100%;box-sizing:border-box;font:inherit;padding:10px 12px;border:1px solid var(--trait);border-radius:10px;background:#fff}
.import-form textarea{min-height:120px;resize:vertical}
.import-form summary{cursor:pointer;font-weight:600;font-size:.85rem;margin-top:12px}
.import-statut{margin:10px 0;font-size:.82rem;color:var(--gris)}
.import-prop{border:1px solid var(--trait);border-radius:10px;padding:10px 12px;margin-bottom:8px}
.import-prop label{display:flex;gap:8px;align-items:flex-start;font-weight:600;font-size:.85rem;margin:0}
.import-prop .citation{font-size:.76rem;color:var(--gris);margin-top:6px;font-style:italic}
.comparaison th{white-space:nowrap}
/* Noms d'options sur plusieurs lignes : deux options tiennent côte à côte
   sur un téléphone, sans défilement horizontal (la colonne B était cachée). */
.comparaison th:not(:first-child){white-space:normal;min-width:6.5em;vertical-align:bottom}
.comparaison td:first-child{text-align:left;white-space:normal;min-width:120px}
.comparaison .comp-meilleur{font-weight:700;position:relative}
.comparaison .comp-meilleur::after{content:"●";color:#0b6b4f;font-size:.6em;vertical-align:super;margin-left:3px}
.pastille-option{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle}
.total-portefeuille td{border-top:2px solid var(--trait);background:rgba(11,107,79,.05)}

/* 7.8.0 — Rien ne doit déborder sur un téléphone étroit (360 à 412 px) :
   au-delà de l'écran, le navigateur réduisait la page et la barre d'onglets
   du bas glissait en partie hors de l'écran. */
/* Tableaux « libellé + montants » : le libellé passe à la ligne, les montants
   restent sur une seule ligne. */
table.libelles td:first-child, table.libelles th:first-child { white-space: normal; position: static; }
table.libelles td:not(:first-child), table.libelles th:not(:first-child) { width: 1%; }
/* Tuiles sur 3 colonnes : 2 colonnes sous 380 px de large, et une tuile peut
   rapetisser sous la largeur de son contenu sans élargir la page. */
.grille-3 > * { min-width: 0; }
@media (max-width: 380px) { .grille-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Rangées de boutons (Dupliquer / Renommer / Supprimer…) : passent à la ligne
   plutôt que d'élargir la page sur les plus petits écrans (320 px). */
.rangee-btn { flex-wrap: wrap; }
/* Portefeuille : sur un téléphone, les titres de colonnes passent à la ligne
   pour que le tableau entier tienne (il restait coupé à « Cap rate »). */
@media (max-width: 560px) { table.portefeuille th { white-space: normal; } }

/* Analyse provisoire (8.2.0) : ligne pleine largeur sous les indicateurs. */
.barre-vive { flex-wrap: wrap; }
.barre-vive .provisoire { flex-basis: 100%; font-size: .68rem; color: #ffd28c; letter-spacing: .02em; }

/* ========================================================================== 
   8.3.0 — Interface « cristal »
   Refonte visuelle uniquement : bleu cristal, cyan, turquoise et reflets or.
   ========================================================================== */
:root {
  --encre: #08244a;
  --ardoise: #536b89;
  --gris: #7890ad;
  --papier: #eef9ff;
  --carte: rgba(255,255,255,.94);
  --trait: rgba(55,125,185,.18);
  --vert: #079d96;
  --vert-pale: #e5fbf7;
  --bleu-cristal: #087bf0;
  --cyan-cristal: #1fc6e8;
  --turquoise-cristal: #08b9a8;
  --or-cristal: #ffd65a;
  --or-pale: #fff8d7;
  --brique: #b2312a;
  --brique-pale: #ffefed;
  --ambre: #946300;
  --ambre-pale: #fff7df;
  --serif: var(--sans);
  --r: 20px;
  --hautNav: calc(92px + env(safe-area-inset-bottom));
}

html, body {
  min-height: 100%;
  background:
    radial-gradient(circle at 92% 4%, rgba(255,214,90,.20), transparent 18rem),
    radial-gradient(circle at 10% 18%, rgba(31,198,232,.15), transparent 23rem),
    linear-gradient(180deg, #edf9ff 0%, #f8fcff 46%, #edf9ff 100%);
}
body { overflow-x: hidden; }
h1,h2,h3 { font-family: var(--sans); font-weight: 750; letter-spacing: -.025em; }

.entete {
  background:
    radial-gradient(circle at 86% 0%, rgba(255,214,90,.38), transparent 8rem),
    radial-gradient(circle at 12% -20%, rgba(255,255,255,.28), transparent 11rem),
    linear-gradient(118deg, #075fd3 0%, #079be5 40%, #08a8ba 72%, #068a83 100%);
  box-shadow: 0 12px 34px rgba(0,82,155,.20);
  border-bottom: 1px solid rgba(255,255,255,.35);
  padding: calc(env(safe-area-inset-top) + 12px) 16px 13px;
}
.entete::after {
  content: "";
  position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background: linear-gradient(128deg, transparent 17%, rgba(255,255,255,.30) 18%, transparent 19%, transparent 70%, rgba(255,214,90,.22) 71%, transparent 72%);
}
.entete > * { position: relative; z-index: 1; }
.entete h1 { font-weight: 780; letter-spacing: -.025em; }
.entete .sous { color: rgba(255,255,255,.82); }
.btn-langue,
.bouton-retour {
  background: rgba(6,81,135,.22) !important;
  border: 1px solid rgba(255,255,255,.62) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.18), 0 5px 15px rgba(0,58,120,.12);
  border-radius: 14px;
}
.bouton-retour { width: 44px; height: 44px; font-size: 1.8rem; }

.contenu { padding: 18px 14px calc(var(--hautNav) + 26px); max-width: 760px; }

/* Navigation flottante */
.nav {
  left: 10px; right: 10px; bottom: calc(8px + env(safe-area-inset-bottom));
  border: 1px solid rgba(80,145,200,.18);
  border-radius: 24px;
  padding: 5px 6px;
  padding-bottom: 5px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 14px 34px rgba(23,80,126,.18), inset 0 1px rgba(255,255,255,.7);
  -webkit-backdrop-filter: blur(18px) saturate(145%); backdrop-filter: blur(18px) saturate(145%);
  overflow: hidden;
}
.nav::before {
  content: ""; position: absolute; left: 6%; right: 6%; top: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(31,198,232,.65), rgba(255,214,90,.45), transparent);
}
.nav button { min-width:0; padding: 8px 2px 7px; font-size: .65rem; border-radius: 16px; position: relative; }
.nav button .pic { font-size: 1.18rem; min-height: 20px; display:flex; align-items:center; }
.nav button[aria-current="true"] {
  color: #087bd9; font-weight: 750;
  background: linear-gradient(180deg, rgba(31,198,232,.10), rgba(8,123,240,.04));
}
.nav button[aria-current="true"]::after {
  content:""; position:absolute; bottom:2px; width:28px; height:3px; border-radius:9px;
  background: linear-gradient(90deg, var(--bleu-cristal), var(--turquoise-cristal));
  box-shadow: 0 0 10px rgba(31,198,232,.48);
}

/* Cartes et formulaires */
.carte,
details.section {
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(249,253,255,.92));
  border: 1px solid rgba(66,141,197,.15);
  box-shadow: 0 9px 26px rgba(29,92,137,.075), inset 0 1px rgba(255,255,255,.85);
}
.carte { border-radius: 22px; }
details.section { border-radius: 19px; margin-bottom: 12px; }
details.section > summary { padding: 16px; }
details.section[open] > summary { color: #073a72; }
details.section[open] { box-shadow: 0 12px 30px rgba(24,101,155,.10), inset 3px 0 rgba(31,198,232,.20); }
.section-corps { border-top-color: rgba(68,142,197,.12); }
.section-avancee { border-color: rgba(10,160,157,.26) !important; }

.tuile {
  background: linear-gradient(145deg, #f0faff, #eaf7fb);
  border: 1px solid rgba(80,151,199,.10);
  border-radius: 15px;
}
.tuile .val { font-family: var(--sans); font-weight: 760; letter-spacing: -.025em; }

.btn {
  border-radius: 15px; min-height: 46px;
  background: linear-gradient(110deg, #0876e8 0%, #069fd4 48%, #08a98f 100%);
  box-shadow: 0 8px 19px rgba(7,121,184,.18), inset 0 1px rgba(255,255,255,.20);
}
.btn.secondaire { background: rgba(255,255,255,.92); color: var(--encre); border-color: rgba(62,132,185,.22); box-shadow: 0 6px 16px rgba(32,86,127,.07); }
.btn.discret { background: rgba(242,250,255,.72); color: #416484; border-color: rgba(66,137,190,.20); box-shadow: none; }
.btn.discret:hover { background: #eaf8ff; color:#0873cf; }
.btn.discret:focus-visible { background: #eaf8ff; color:#0873cf; }
.btn.danger { color: var(--brique); background:#fff; }
.btn-cristal {
  position: relative; overflow: hidden;
  background: linear-gradient(105deg, #0863e7 0%, #078ee8 31%, #09b6c5 67%, #0ab895 100%);
  border: 1px solid rgba(255,255,255,.45);
  box-shadow: 0 11px 25px rgba(5,104,189,.25), 0 0 0 1px rgba(31,198,232,.10), inset 0 1px rgba(255,255,255,.40);
}
.btn-cristal::before {
  content:""; position:absolute; inset:-70% -15%; transform:rotate(17deg) translateX(-52%);
  background: linear-gradient(90deg, transparent 42%, rgba(255,255,255,.46) 49%, rgba(255,214,90,.30) 52%, transparent 59%);
  pointer-events:none;
}
.btn-cristal > * { position:relative; }

.champ label { color:#55708d; font-weight:620; }
.champ input,.champ select,.import-form input[type=text],.import-form input[type=url],.import-form textarea {
  border-color: rgba(78,145,194,.18);
  background: linear-gradient(135deg, #f3fbff, #eaf7fb);
  color: var(--encre); border-radius: 13px;
  box-shadow: inset 0 1px 2px rgba(17,79,123,.035);
}
.champ input:focus,.champ select:focus {
  outline: 3px solid rgba(31,198,232,.20); border-color:#1baeda;
  box-shadow: 0 0 0 1px rgba(8,123,240,.13), 0 5px 16px rgba(8,123,240,.08);
}
.segments { background:#e7f6fb; border:1px solid rgba(70,140,190,.12); }
.segments button[aria-pressed="true"] { background:#fff; color:#0873cf; box-shadow:0 3px 8px rgba(25,91,135,.12); }
.interrupteur input { accent-color: var(--bleu-cristal); }
.obligatoire { color:#d59b00; font-weight:850; text-shadow:0 0 9px rgba(255,214,90,.45); }
.grille-2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }

/* Barre de résultats en direct */
.barre-vive {
  border-radius: 18px;
  background:
    radial-gradient(circle at 92% 0%, rgba(255,214,90,.38), transparent 6rem),
    linear-gradient(105deg, #0755c4 0%, #078be1 36%, #09b7c4 68%, #07998e 100%);
  border: 1px solid rgba(255,255,255,.45);
  box-shadow: 0 10px 25px rgba(5,93,155,.18), inset 0 1px rgba(255,255,255,.25);
  padding: 12px 14px;
}
.barre-vive .cle { color:rgba(255,255,255,.72); }
.barre-vive .val { font-family:var(--sans); font-weight:780; }
.barre-vive .val.pos { color:#dfffee; }

.avis { border-radius:15px; }
.avis.info { background:linear-gradient(135deg,#e7fbfa,#eefaff); border-color:rgba(8,166,163,.22); color:#075c69; }
.avis.orange { background:linear-gradient(135deg,#fff9e7,#fffdf4); border-color:rgba(218,169,37,.28); }

/* Accueil */
.accueil-entete { position:sticky; }
.accueil-contenu { padding-top:16px; padding-bottom:34px; }
.accueil-hero {
  position:relative; overflow:hidden; isolation:isolate;
  color:#fff; border-radius:28px; padding:26px 20px 20px; margin-bottom:22px;
  background:
    radial-gradient(circle at 86% 9%, rgba(255,224,105,.75) 0 1px, transparent 2px),
    radial-gradient(circle at 80% 14%, rgba(255,255,255,.55) 0 1px, transparent 2px),
    radial-gradient(circle at 100% 0%, rgba(255,214,90,.34), transparent 10rem),
    linear-gradient(125deg,#0758cb 0%,#088fe0 35%,#0bb8c0 66%,#069a8b 100%);
  box-shadow:0 18px 38px rgba(5,93,155,.22), inset 0 1px rgba(255,255,255,.35);
  border:1px solid rgba(255,255,255,.48);
}
.accueil-hero::before {
  content:""; position:absolute; inset:-25%; z-index:-1; opacity:.7;
  background:
    linear-gradient(117deg, transparent 42%, rgba(255,255,255,.25) 44%, transparent 46%),
    linear-gradient(155deg, transparent 62%, rgba(255,214,90,.23) 63%, transparent 65%);
}
.accueil-reflet {
  position:absolute; width:180px; height:180px; right:-55px; top:-80px; border-radius:50%; z-index:-1;
  background:radial-gradient(circle,rgba(255,244,178,.58),rgba(31,198,232,.20) 42%,transparent 70%);
  filter:blur(2px);
}
.accueil-kicker { font-size:.67rem; letter-spacing:.16em; font-weight:800; color:#e9fbff; margin-bottom:9px; }
.accueil-hero h2 { font-size:1.72rem; line-height:1.08; max-width:560px; color:#fff; }
.accueil-hero p { margin:10px 0 18px; max-width:600px; color:rgba(255,255,255,.85); font-size:.91rem; }
.accueil-hero .btn-cristal { width:auto; min-width:185px; background:rgba(255,255,255,.96); color:#076ebf; box-shadow:0 9px 22px rgba(1,60,121,.18); }
.accueil-section-titre { display:flex; align-items:end; justify-content:space-between; gap:10px; margin:3px 2px 13px; }
.accueil-section-titre span { font-size:.66rem; letter-spacing:.13em; color:#66839e; font-weight:800; }
.accueil-section-titre h2 { font-size:1.36rem; }
.compteur-analyses { min-width:38px; height:38px; border-radius:14px; display:grid; place-items:center; font-weight:800; color:#0873cf; background:#fff; border:1px solid rgba(72,140,190,.18); box-shadow:0 6px 15px rgba(22,85,130,.08); }
.vide-accueil { background:rgba(255,255,255,.72); border:1px dashed rgba(55,125,185,.25); border-radius:22px; }
.carte-plex { border-radius:16px; }

/* Barre d'outils des données et adresse */
.donnees-outils {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-bottom:13px; padding:12px 13px;
  background:rgba(255,255,255,.78); border:1px solid rgba(65,134,185,.16); border-radius:17px;
  box-shadow:0 6px 17px rgba(30,87,128,.06);
}
.donnees-outils > div:first-child { min-width:0; }
.donnees-outils .aide { margin-top:2px; }
.bouton-tout-ouvrir { flex:none; width:auto; white-space:nowrap; color:#0873cf !important; background:#ebf8ff !important; }
.trio-adresse { display:grid; grid-template-columns:minmax(82px,.55fr) minmax(70px,.45fr) minmax(150px,2fr); gap:10px; }

/* Passage vers les hypothèses plus complexes */
.separateur-avance {
  display:flex; gap:12px; align-items:flex-start; margin:24px 0 14px; padding:15px 16px;
  border-radius:20px; border:1px solid rgba(9,168,165,.20);
  background:
    radial-gradient(circle at 98% 0%, rgba(255,214,90,.20), transparent 7rem),
    linear-gradient(125deg,rgba(229,251,247,.92),rgba(235,248,255,.96));
  box-shadow:0 8px 20px rgba(8,119,158,.07);
}
.separateur-avance-icone {
  flex:none; width:38px; height:38px; border-radius:13px; display:grid; place-items:center;
  color:#a97700; font-size:1.18rem;
  background:linear-gradient(145deg,#fffbe5,#fff2aa);
  box-shadow:0 0 18px rgba(255,214,90,.24);
}
.separateur-avance strong { color:#087577; }
.separateur-avance p { margin:3px 0 0; color:#5d7289; font-size:.82rem; }

/* Appel vers les résultats */
.cta-resultats {
  margin:22px 0 4px; padding:16px; border-radius:22px;
  background:rgba(255,255,255,.88); border:1px solid rgba(51,132,190,.18);
  box-shadow:0 11px 28px rgba(24,94,143,.10);
}
.cta-resultats > div { margin-bottom:12px; }
.cta-resultats strong { display:block; font-size:1rem; color:#0b3768; }
.cta-resultats span { display:block; color:#6c8198; font-size:.78rem; margin-top:2px; }
.cta-resultats .btn span { color:inherit; display:inline; margin:0; font-size:inherit; }

/* Glossaire explicatif */
.glossaire-intro {
  position:relative; overflow:hidden; margin-bottom:14px; padding:22px 18px;
  border-radius:23px; color:#fff;
  background:linear-gradient(120deg,#075acb,#0899d5 48%,#08a797);
  box-shadow:0 12px 28px rgba(8,101,162,.17);
}
.glossaire-intro::after { content:"✦"; position:absolute; right:18px; top:9px; color:#ffe677; font-size:1.4rem; text-shadow:0 0 14px #fff3a6; }
.glossaire-intro h2 { font-size:1.5rem; }
.glossaire-intro p { margin:7px 0 0; color:rgba(255,255,255,.84); font-size:.86rem; max-width:550px; }
.glossaire-kicker { display:block; font-size:.65rem; letter-spacing:.14em; font-weight:800; color:#dffaff; margin-bottom:5px; }
.glossaire-carte { padding:4px 14px; }
.glossaire-terme { border-bottom:1px solid rgba(69,138,189,.14); }
.glossaire-terme:last-child { border-bottom:0; }
.glossaire-terme > summary { list-style:none; cursor:pointer; padding:15px 4px; font-weight:750; color:#143b66; display:flex; align-items:center; gap:8px; }
.glossaire-terme > summary::-webkit-details-marker { display:none; }
.glossaire-terme > summary::after { content:"+"; margin-left:auto; color:#0a8fc5; font-size:1.2rem; }
.glossaire-terme[open] > summary::after { content:"−"; }
.glossaire-contenu { padding:0 4px 16px; color:#536b83; font-size:.88rem; line-height:1.55; }
.glossaire-contenu p { margin:7px 0; }
.glossaire-exemple { margin:10px 0; padding:11px 12px; border-left:3px solid #1bbbd2; background:#edfaff; border-radius:0 12px 12px 0; color:#285a75; }
.glossaire-attention { padding:9px 11px; background:#fff9df; border:1px solid rgba(222,177,42,.22); border-radius:12px; color:#735d16; }

/* Menu Plus */
.menu-plus-intro { margin-bottom:13px; padding:12px 13px; border-radius:15px; background:linear-gradient(135deg,#eefaff,#e9fbf7); border:1px solid rgba(53,142,187,.13); }
.menu-plus-grille { display:grid; gap:9px; }
.menu-plus-item {
  width:100%; display:flex; align-items:center; gap:12px; text-align:left; text-decoration:none;
  padding:12px; border:1px solid rgba(68,139,189,.15); border-radius:16px; color:var(--encre);
  background:linear-gradient(145deg,#fff,#f4fbff); font:inherit;
}
.menu-plus-item:active { transform:scale(.992); }
.menu-plus-item > span:last-child { display:flex; flex-direction:column; min-width:0; }
.menu-plus-item strong { font-size:.89rem; }
.menu-plus-item small { color:#6f849b; font-size:.73rem; margin-top:2px; }
.menu-plus-icone {
  flex:none; width:38px; height:38px; border-radius:13px; display:grid; place-items:center;
  color:#0879d3; font-weight:800; font-size:1.05rem;
  background:linear-gradient(145deg,#e4f8ff,#e9fbf8); border:1px solid rgba(31,171,208,.15);
}
.modale-fond { background:rgba(3,29,60,.52); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.modale-boite { border-radius:26px 26px 0 0; box-shadow:0 -12px 38px rgba(7,53,92,.16); }

/* Quelques détails cristal dans les tableaux et badges */
.puce { background:#edf8fd; }
.puce.pos { background:#e4fbf3; color:#087c67; }
.etiquette { color:#71879e; }
th { color:#7189a1; }
tbody tr:nth-child(odd) td,tbody tr:nth-child(odd) td:first-child { background:#f7fbfd; }
.comparaison .comp-meilleur::after { color:var(--turquoise-cristal); }

@media (max-width: 560px) {
  .contenu { padding-left:12px; padding-right:12px; }
  .grille-2 { grid-template-columns:1fr; }
}
@media (max-width: 420px) {
  .trio-adresse { grid-template-columns:1fr 1fr; }
  .trio-adresse .champ:last-child { grid-column:1 / -1; }
  .donnees-outils { align-items:flex-start; }
  .bouton-tout-ouvrir { padding:8px 10px; font-size:.78rem; }
  .accueil-hero h2 { font-size:1.5rem; }
}
@media (max-width: 350px) {
  .nav button { font-size:.59rem; }
  .nav button .pic { font-size:1.05rem; }
}

@media print {
  .donnees-outils,.cta-resultats,.separateur-avance { box-shadow:none!important; }
  .glossaire-terme { break-inside:avoid; }
}

/* ========================================================================== 
   8.4.0 — FinTech Moderne
   Priorité: clarté pendant la saisie, identité bleue ciblée, couleurs
   sémantiques. Les formules ne sont pas concernées par cette feuille de style.
   ========================================================================== */
:root {
  --encre: #0e2a47;
  --ardoise: #526a82;
  --gris: #7c8fa3;
  --papier: #f8fafc;
  --carte: #ffffff;
  --trait: #dbe5ee;
  --bleu-cristal: #0877d1;
  --cyan-cristal: #159fd7;
  --turquoise-cristal: #11a99b;
  --vert: #07966d;
  --vert-pale: #e8f8f2;
  --or-cristal: #efb12b;
  --ambre: #b77800;
  --ambre-pale: #fff7df;
  --brique: #d64545;
  --brique-pale: #fff0f0;
  --r: 18px;
  --hautNav: calc(82px + env(safe-area-inset-bottom));
}
html,body { background:#f8fafc; }
body { color:var(--encre); }
.entete {
  background:rgba(255,255,255,.96);
  color:var(--encre);
  box-shadow:0 1px 0 rgba(14,42,71,.08),0 8px 24px rgba(16,64,104,.05);
  border-bottom:1px solid #edf2f6;
}
.entete::after { display:none; }
.entete h1 { color:var(--encre); }
.entete .sous { color:#70859a; }
.entete .btn-icone { color:#1b527c; }
.btn-langue,.bouton-retour {
  background:#f4f8fb!important;
  color:#0e4e80!important;
  border:1px solid #d7e4ee!important;
  box-shadow:none;
}
.contenu { max-width:760px; }
.nav {
  background:rgba(255,255,255,.97);
  border-color:#dce7ef;
  box-shadow:0 10px 30px rgba(16,64,104,.12);
}
.nav::before { background:linear-gradient(90deg,transparent,#159fd7,transparent); opacity:.55; }
.nav button[aria-current="true"] { color:#0066d8; background:#eef6ff; }
.nav button[aria-current="true"]::after { background:#0066ff; box-shadow:none; }
.nav-projet { grid-template-columns:repeat(5,1fr); grid-auto-flow:initial; } /* 8.8.1 : Accueil en premier */
.nav-liste { grid-template-columns:repeat(3,1fr); grid-auto-flow:initial; }

.carte,details.section {
  background:#fff;
  border:1px solid #e0e9f0;
  box-shadow:0 5px 16px rgba(18,67,105,.055);
}
details.section[open] { box-shadow:0 7px 20px rgba(18,67,105,.07); inset:auto; }
details.section[open] > summary { color:#113b65; }
.section-corps { border-top-color:#edf2f6; }
.tuile { background:#f6f9fc; border-color:#e5edf3; }
.tuile .val { color:#102c49; }
.tuile .val.pos,.val.pos { color:var(--vert)!important; }
.tuile .val.neg,.val.neg { color:var(--brique)!important; }

.champ label { color:#425f79; font-weight:650; }
.champ input,.champ select,.import-form input[type=text],.import-form input[type=url],.import-form textarea {
  background:#f3f8fb;
  border:1px solid #cfdde7;
  color:#102a43;
  box-shadow:none;
}
.champ input::placeholder { color:#94a6b6; }
.champ input:focus,.champ select:focus {
  background:#fff;
  outline:3px solid rgba(21,159,215,.14);
  border-color:#159fd7;
  box-shadow:0 0 0 1px rgba(21,159,215,.08);
}
.segments { background:#edf3f7; border-color:#dfe8ef; padding:4px; }
.segments button { min-height:44px; border-radius:11px; }
.segments button[aria-pressed="true"] { color:#075fb3; border:1px solid #bed8ed; box-shadow:0 2px 6px rgba(16,72,116,.07); }
.interrupteur { min-height:48px; }
.interrupteur input { width:24px; height:24px; }
.obligatoire { color:#d49a0a; text-shadow:none; }
.btn { background:#0877d1; box-shadow:none; min-height:48px; }
.btn:hover { background:#066ab9; }
.btn:focus-visible { background:#066ab9; }
.btn-cristal { background:linear-gradient(100deg,#0877d1,#159fd7); box-shadow:0 8px 18px rgba(8,119,209,.18); }
.btn-cristal::before { display:none; }
.btn.secondaire { background:#fff; border-color:#d3e1eb; }
.btn.discret { background:#f7fafc; }
.btn-info { background:#e8f2f9; color:#17628f; width:18px; height:18px; line-height:18px; font-size:.7rem; }

/* Le KPI reste visible, mais devient calme pendant la saisie. */
.barre-vive {
  background:#0f3555;
  border:1px solid #244d6b;
  box-shadow:0 6px 18px rgba(11,50,81,.13);
  border-radius:16px;
  padding:10px 12px;
}
.barre-vive .cle { color:#abc0d1; }
.barre-vive .val { color:#fff; }
.barre-vive .val.pos { color:#54d8aa!important; }
.barre-vive .val.neg { color:#ff8c8c!important; }

/* Accueil plus compact: WOW ciblé, le reste est calme. */
.accueil-hero-compact {
  color:var(--encre);
  background:
    radial-gradient(circle at 92% 5%,rgba(21,159,215,.20),transparent 11rem),
    linear-gradient(135deg,#ffffff 0%,#f5fbff 62%,#eaf8fc 100%);
  border:1px solid #dbe9f2;
  box-shadow:0 8px 24px rgba(13,76,119,.08);
  padding:22px 18px 18px;
}
.accueil-hero-compact::before,.accueil-hero-compact .accueil-reflet { display:none; }
.accueil-hero-compact h2 { color:#0d2341; font-size:1.65rem; }
.accueil-hero-compact p { color:#617991; }
.accueil-hero-compact .btn-cristal { background:linear-gradient(100deg,#0877d1,#159fd7); color:#fff; box-shadow:none; }
.accueil-marque { display:flex; flex-direction:column; margin-bottom:18px; }
.accueil-marque strong { font-size:1.42rem; letter-spacing:-.03em; color:#102a43; }
.accueil-marque strong span { color:#0877d1; }
.accueil-marque small { color:#6e8498; margin-top:2px; }
.carte-analyse-accueil { padding:14px; }
.carte-analyse-accueil h2 { margin-top:5px; font-size:1.08rem; }
.ligne-badges { display:flex; gap:5px; flex-wrap:wrap; }
.actions-analyse { opacity:.86; }

/* Sélecteur achat / immeuble possédé */
.mode-analyse-card {
  background:#fff;
  border:1px solid #dce7ef;
  border-radius:20px;
  padding:16px;
  margin-bottom:14px;
  box-shadow:0 5px 16px rgba(18,67,105,.05);
}
.mode-analyse-titre { display:flex; gap:11px; align-items:flex-start; margin-bottom:13px; }
.mode-analyse-titre h2 { font-size:1rem; }
.mode-analyse-titre p { margin:3px 0 0; color:#6e8295; font-size:.79rem; }
.etape-badge { flex:none; width:30px; height:30px; border-radius:10px; display:grid; place-items:center; color:#fff; background:#0877d1; font-weight:800; }
.portfolio-toggle { margin-top:13px; padding-top:10px; border-top:1px solid #edf2f6; }
.portfolio-toggle .interrupteur { padding:2px 0; }
.adresse-optionnelle { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; padding:11px 12px; background:#f7fafc; border:1px solid #e3ebf1; border-radius:13px; margin-bottom:12px; }
.adresse-optionnelle strong { color:#294b69; }
.adresse-optionnelle span { margin-left:7px; color:#0877d1; font-size:.72rem; font-weight:700; background:#eaf4ff; padding:2px 7px; border-radius:999px; }
.adresse-optionnelle p { margin:0; max-width:65%; color:#788c9e; font-size:.74rem; }
.align-end { align-items:end; }
.champ-auto-wrap { margin-bottom:12px; }
.champ-auto { min-height:47px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; background:#eef7fc; border:1px solid #c9e1ee; border-radius:13px; }
.champ-auto strong { font-size:1.05rem; }
.champ-auto span { font-size:.68rem; color:#0877d1; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }
.lien-action { border:0; background:none; color:#0877d1; padding:5px 0; font:inherit; font-size:.73rem; font-weight:700; }
.retour-auto { grid-column:1/-1; text-align:left; }
.statut-achat { background:#f8fafc; border:1px solid #e2eaf0; padding:12px 13px; border-radius:14px; margin:3px 0 12px; }
.statut-achat > strong { display:block; color:#34516c; font-size:.8rem; margin-bottom:4px; }
.section-secondaire { border-style:dashed!important; }

/* Hypothèque */
.calcul-auto-interets { display:flex; gap:10px; align-items:flex-start; padding:11px 12px; background:#f5f9fc; border:1px solid #dde8ef; border-radius:14px; margin:2px 0 12px; }
.calcul-auto-icone { flex:none; width:30px; height:30px; display:grid; place-items:center; border-radius:9px; background:#e8f4fb; color:#0877d1; font-weight:800; }
.calcul-auto-interets strong { font-size:.82rem; color:#294b69; }
.calcul-auto-interets p { margin:2px 0 0; font-size:.73rem; color:#71869a; }
.admissibilite-30 { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px; margin:2px 0 14px; border:1px solid #e3e9ee; background:#fafbfc; border-radius:15px; }
.admissibilite-30.eligible { border-color:#c8e8dd; background:#f1fbf7; }
.admissibilite-30 strong { font-size:.84rem; color:#284e69; }
.admissibilite-30 p { margin:2px 0 0; color:#71869a; font-size:.72rem; }
.btn-30ans { width:auto; flex:none; min-width:132px; color:#0877d1!important; }

/* Portefeuille */
.portfolio-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; padding:20px 18px; margin-bottom:15px; border-radius:22px; background:linear-gradient(135deg,#0e2f4b,#135c7f); color:#fff; }
.portfolio-hero .accueil-kicker { color:#9fdaf0; }
.portfolio-hero h2 { font-size:1.5rem; }
.portfolio-hero p { margin:5px 0 0; color:#c8dbe7; font-size:.8rem; max-width:480px; }
.portfolio-compte { flex:none; min-width:68px; text-align:center; font-size:1.65rem; font-weight:800; color:#55d8ae; }
.portfolio-compte small { display:block; font-size:.64rem; color:#c4d7e4; font-weight:600; }

/* Scénarios: comparer et stress test dans un seul onglet. */
.scenarios-intro { margin-bottom:14px; padding:18px; border-radius:20px; background:#fff; border:1px solid #dce7ef; box-shadow:0 5px 16px rgba(18,67,105,.05); }
.scenarios-intro .accueil-kicker { color:#0877d1; }
.scenarios-intro h2 { font-size:1.4rem; }
.scenarios-intro p { margin:5px 0 14px; color:#6a8094; font-size:.82rem; }
.scenarios-choix { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.scenarios-choix button { min-height:76px; text-align:left; border:1px solid #dce7ef; border-radius:14px; background:#f7fafc; padding:11px; color:#234762; font:inherit; }
.scenarios-choix button[aria-pressed="true"] { border-color:#8ec9ed; background:#edf7ff; box-shadow:inset 0 0 0 1px rgba(8,119,209,.08); }
.scenarios-choix button > span { display:block; color:#0877d1; font-size:1.05rem; }
.scenarios-choix button strong { display:block; font-size:.84rem; margin-top:2px; }
.scenarios-choix button small { display:block; color:#71869a; font-size:.68rem; margin-top:2px; }

/* Or réservé à l'attention, pas à la décoration de fond. */
.avis.orange { background:#fff9e8; border-color:#f1d89b; color:#6d520b; }
.separateur-avance { background:#fffaf0; border-color:#f0d796; box-shadow:none; }
.separateur-avance-icone { background:#fff2bf; color:#a56e00; box-shadow:none; }

@media (max-width:560px) {
  .adresse-optionnelle { flex-direction:column; }
  .adresse-optionnelle p { max-width:none; }
  .admissibilite-30 { align-items:flex-start; flex-direction:column; }
  .btn-30ans { width:100%; }
}
@media (max-width:390px) {
  .scenarios-choix { grid-template-columns:1fr; }
  .portfolio-hero { align-items:flex-start; }
}

/* ========================================================================== 
   8.4.1 — Alignement visuel avec les maquettes validées
   Refactor UI seulement : aucun calcul financier.
   ========================================================================== */
:root{
  --bleu-marque:#0877d1;
  --bleu-fort:#0066ff;
  --cyan:#12c5df;
  --marine:#0b1748;
  --fond-glace:#f6fbff;
  --vert-gain:#0a966d;
  --orange-accent:#f97316;
}

h1,h2,h3{font-family:var(--sans);font-weight:800;letter-spacing:-.03em;color:var(--marine)}
body{background:linear-gradient(180deg,#f9fcff 0%,#f4faff 55%,#f8fbfd 100%)}
.contenu{max-width:900px}
.fiche-contenu{padding-top:10px}

/* Barre supérieure très légère : la vraie identité visuelle est dans le hero. */
.fiche-entete{
  min-height:54px;padding-top:calc(env(safe-area-inset-top) + 7px);padding-bottom:7px;
  background:rgba(255,255,255,.94);-webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow:0 1px 0 rgba(14,42,71,.06);border-bottom:0;
}
.fiche-entete .bouton-retour{display:flex;align-items:center;gap:4px;min-width:44px;width:auto;padding:8px 10px;background:transparent!important;border:0!important}
.fiche-entete .bouton-retour span{font-size:.74rem;font-weight:700;color:#52708c}
.mini-brand{flex:1;text-align:center;font-weight:850;font-size:.98rem;color:#0d2045;letter-spacing:-.03em}
.mini-brand span{color:var(--bleu-marque)}
.fiche-entete .btn-langue{min-height:38px;min-width:46px;border-radius:13px!important}

/* Hero projet : photo à droite, fondu blanc à gauche, comme les maquettes. */
.project-hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:310px;margin:-2px -2px 20px;padding:20px 18px 16px;
  border-radius:0 0 30px 30px;
  background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 43%,rgba(243,250,255,.84) 63%,rgba(240,249,255,.25) 100%);
}
.project-hero::after{content:"";position:absolute;inset:auto 0 0;height:115px;background:linear-gradient(180deg,transparent,#f7fbff 93%);z-index:-1;pointer-events:none}
.project-hero-photo{
  position:absolute;z-index:-2;right:-18px;top:0;width:min(52%,390px);height:220px;
  background-image:linear-gradient(90deg,rgba(255,255,255,0) 65%,rgba(255,255,255,.04)),url('icons/hero-plex.jpg');
  background-size:cover;background-position:center 35%;border-radius:0 0 0 42px;
  filter:saturate(.98) contrast(1.02);
}
.project-brand,.accueil-marque{display:flex;align-items:center;gap:10px}
.marque-icone{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.35rem;background:linear-gradient(145deg,#0877d1,#16b4e0);box-shadow:0 7px 18px rgba(8,119,209,.20)}
.project-brand{margin-bottom:26px;max-width:58%}
.project-brand strong,.accueil-marque strong{font-size:1.48rem;line-height:1;color:#0b1748;font-weight:850;letter-spacing:-.045em}
.project-brand strong span,.accueil-marque strong span{color:#0877d1}
.project-brand small,.accueil-marque small{display:block;margin-top:4px;color:#6d82a0;font-size:.69rem;line-height:1.25}
.project-copy{position:relative;z-index:1;max-width:62%;min-height:94px}
.project-copy h1{font-size:2rem;line-height:1.02;margin:0 0 7px}
.project-subtitle{font-size:.93rem;font-weight:600;color:#62789a;white-space:normal}
.location-pill{display:inline-flex;margin-top:10px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.92);box-shadow:0 4px 14px rgba(31,71,112,.12);font-size:.7rem;font-weight:700;color:#385b78}

/* KPIs blancs, grands, lisibles et sémantiques. */
.hero-kpis{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.hero-kpi{min-width:0;display:flex;align-items:center;gap:10px;padding:14px 14px;border-radius:18px;background:rgba(255,255,255,.96);border:1px solid #e3ecf3;box-shadow:0 8px 24px rgba(25,81,127,.09)}
.hero-kpi-icon{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:1.05rem;background:#eaf5ff;color:#0877d1}
.hero-kpi-cf .hero-kpi-icon{background:#e7faf3;color:#079466}
.hero-kpi-cap .hero-kpi-icon{background:#fff0e6;color:#f06b11}
.hero-kpi .cle{font-size:.68rem;letter-spacing:.02em;color:#536c91;font-weight:750;white-space:nowrap}
.hero-kpi .val{font-size:1.55rem;line-height:1.05;font-weight:850;color:#0b1748;margin-top:4px;font-family:var(--sans)}
.hero-kpi .val.pos{color:var(--vert-gain)!important}.hero-kpi .val.neg{color:#df2435!important}
.hero-provisoire{margin-top:9px;text-align:center;color:#a16d0b;font-size:.72rem;font-weight:700}

/* Accueil : grande scène claire + photo, sans carte bleue autour. */
.accueil-contenu{padding-top:calc(env(safe-area-inset-top) + 10px);max-width:900px}
.accueil-hero-compact{
  min-height:430px;margin:0 -4px 24px;padding:20px 20px 18px;border:0;border-radius:0;
  box-shadow:none;color:var(--marine);
  background:
    linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 48%,rgba(247,252,255,.80) 66%,rgba(247,252,255,.12) 100%),
    url('icons/hero-plex.jpg');
  background-size:auto 100%,auto 315px;background-position:0 0,right top;background-repeat:no-repeat;
}
.accueil-topline{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:48px}
.accueil-topline .btn-langue{color:#0e4e80!important;background:rgba(255,255,255,.88)!important;border:1px solid #dbe7f0!important}
.accueil-marque{margin:0}
.accueil-hero-compact h2{max-width:60%;font-size:2.35rem;line-height:1.03;margin:0 0 12px;color:#0b1748}
.accueil-hero-compact p{max-width:58%;font-size:1rem;line-height:1.35;color:#637a9b;margin:0 0 22px}
.accueil-hero-compact .btn-cristal{width:100%;min-height:66px;border-radius:18px;background:linear-gradient(100deg,#075dff 0%,#0b8be5 58%,#12c9d9 100%);font-size:1.12rem;box-shadow:0 8px 22px rgba(5,113,218,.17);display:flex;justify-content:center;gap:12px}
.cta-plus{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;color:#0877d1;font-size:1.35rem}
.cta-fleche{margin-left:auto;font-size:1.35rem}
.accueil-section-titre h2{font-size:1.7rem;color:#0b1748}
.accueil-section-titre>div>span{display:none}
.compteur-analyses{background:transparent;border:0;box-shadow:none;color:#0877d1}

/* Cartes Mes analyses avec vignette photo à gauche. */
.carte-analyse-accueil{border-radius:22px;padding:14px 14px 13px;margin-bottom:14px;box-shadow:0 7px 22px rgba(25,81,127,.07)}
.carte-analyse-top{display:grid;grid-template-columns:128px 1fr;gap:15px;align-items:stretch}
.photo-immeuble{min-height:108px;border-radius:17px;background:url('icons/hero-plex.jpg') center/cover no-repeat;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
.carte-analyse-meta{min-width:0;text-align:left;padding-top:2px}
.carte-analyse-meta h2{font-size:1.28rem!important;margin-top:7px!important}
.carte-analyse-meta .etiquette{font-size:.78rem;text-transform:none;letter-spacing:0;margin-top:5px}
.ligne-badges-info{margin-top:10px}.ligne-badges-info .puce{font-size:.7rem}
.kpis-liste .tuile{padding:11px 12px;background:#fbfdff;border:1px solid #e5edf4;border-radius:15px}
.kpis-liste .cle{font-size:.66rem}.kpis-liste .val{font-size:1.15rem;font-weight:820}
.actions-analyse{margin-top:10px!important}

/* Titre Données + stepper. */
.donnees-outils{background:transparent;border:0;box-shadow:none;padding:2px 4px 10px;margin-bottom:5px}
.donnees-outils strong{font-size:1.62rem;font-weight:850;color:#0b1748;letter-spacing:-.035em}
.donnees-outils .aide{font-size:.78rem;color:#7589a2}
.bouton-tout-ouvrir{border:1px solid #87bfee!important;background:#fff!important;color:#0877d1!important;border-radius:14px!important;min-height:44px}
.etapes-analyse{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto 1fr auto;align-items:start;margin:4px 8px 18px;gap:8px}
.etapes-analyse>i{height:2px;background:#dbe6ee;margin-top:16px;border-radius:4px}
.etape{text-align:center;min-width:56px;color:#7588a1}.etape span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;margin:0 auto 6px;background:#e7eef5;color:#70839b;font-weight:850}.etape strong{display:block;font-size:.69rem;font-weight:750;white-space:nowrap}.etape.active{color:#0668d9}.etape.active span{color:#fff;background:linear-gradient(145deg,#0b6ff2,#149ddf);box-shadow:0 6px 15px rgba(8,119,209,.20)}

/* Choix achat / possédé plus proche d'une étape, moins d'une carte technique. */
.mode-analyse-card{border-radius:22px;padding:14px 16px 15px;box-shadow:0 6px 18px rgba(23,73,113,.06);margin-bottom:14px}
.mode-analyse-titre{margin-bottom:10px}.mode-analyse-titre .etape-badge{display:none}.mode-analyse-titre h2{font-size:1rem}.mode-analyse-titre p{font-size:.75rem}
.portfolio-toggle{margin-top:10px}

/* Formulaire : très proche des maquettes, blanc net et contours bleu-gris fins. */
details.section{border-radius:22px;margin-bottom:12px;border-color:#e2eaf1;box-shadow:0 5px 17px rgba(25,81,127,.055)}
details.section>summary{min-height:58px;padding:16px 18px;font-size:1rem;color:#10264c}
details.section[open]>summary{font-size:1.05rem}
.section-corps{padding:15px 18px 18px}
.champ label{font-size:.8rem;color:#294b70;font-weight:700}
.champ input,.champ select,.import-form input[type=text],.import-form input[type=url],.import-form textarea{min-height:48px;background:#fff;border:1px solid #cfdde8;border-radius:12px;font-size:1rem;padding:11px 13px}
.champ input:focus,.champ select:focus{background:#fff;border-color:#168fd8;outline:3px solid rgba(18,157,218,.12)}
.adresse-optionnelle{background:#f8fbfd;border-color:#e5edf3}
.section-secondaire{border-style:solid!important;background:#fbfdff!important}
.section-secondaire .avis.info{background:#f2f9fd;border-color:#d5e8f3;color:#285874}

/* CTA semblable aux maquettes. */
.cta-resultats{background:transparent;border:0;box-shadow:none;padding:7px 0;margin:18px 0 5px}
.cta-resultats>div{display:none}
.cta-resultats .btn,.btn-cristal{background:linear-gradient(100deg,#075dff,#0b89eb 55%,#12cad8)!important;color:#fff!important;border:0!important;border-radius:18px!important;min-height:58px;font-size:1rem;font-weight:800;box-shadow:0 8px 20px rgba(8,119,209,.15)}

/* Résultats : plus de blanc, chiffres plus grands, cartes respirantes. */
.rapport-actions{margin-top:4px}
.carte{border-radius:22px;border-color:#e3ebf2;box-shadow:0 6px 20px rgba(25,81,127,.06)}
.carte-tete h2{font-size:1.28rem}
.grille .tuile,.grille-3 .tuile{border-radius:17px;background:#fff;border:1px solid #e7eef4;padding:13px}
.tuile .cle{color:#365476;font-weight:650}.tuile .val{font-family:var(--sans);font-weight:850;color:#0b1748}
.tuile.grande .val{font-size:1.85rem}

/* Barre de navigation plus proche de la maquette. */
.nav{padding:7px 8px env(safe-area-inset-bottom);background:rgba(255,255,255,.98);box-shadow:0 -5px 22px rgba(17,62,102,.08);border-top:1px solid #e6edf3}
.nav button{min-height:58px;border-radius:13px;font-size:.72rem;color:#70839c;font-weight:650}
.nav button .pic{font-size:1.35rem;color:#6a84a5}.nav button[aria-current="true"]{background:transparent;color:#0969df;font-weight:800}.nav button[aria-current="true"] .pic{color:#0969df}.nav button[aria-current="true"]::after{height:3px;width:42px;border-radius:8px;background:#0877ff}

@media(max-width:620px){
  .project-hero{min-height:300px;padding-left:12px;padding-right:12px;margin-left:-12px;margin-right:-12px}
  .project-hero-photo{right:-42px;width:58%;height:205px}
  .project-brand{max-width:60%;margin-bottom:28px}.project-brand strong{font-size:1.22rem}.project-brand small{font-size:.6rem}.marque-icone{width:36px;height:36px;border-radius:11px}
  .project-copy{max-width:65%}.project-copy h1{font-size:1.72rem}.project-subtitle{font-size:.8rem}
  .hero-kpis{gap:8px}.hero-kpi{padding:11px 9px;gap:7px}.hero-kpi-icon{width:32px;height:32px;font-size:.86rem}.hero-kpi .cle{font-size:.56rem}.hero-kpi .val{font-size:1.22rem}
  .accueil-hero-compact{min-height:405px;margin-left:-12px;margin-right:-12px;padding-left:14px;padding-right:14px;background-size:auto 100%,auto 275px}
  .accueil-topline{margin-bottom:54px}.accueil-marque strong{font-size:1.35rem}.accueil-marque small{font-size:.61rem}
  .accueil-hero-compact h2{max-width:64%;font-size:2rem}.accueil-hero-compact p{max-width:68%;font-size:.89rem}
  .carte-analyse-top{grid-template-columns:104px 1fr;gap:12px}.photo-immeuble{min-height:96px}.carte-analyse-meta h2{font-size:1.12rem!important}
  .etapes-analyse{margin-left:0;margin-right:0;gap:4px}.etape{min-width:48px}.etape strong{font-size:.61rem}.etapes-analyse>i{margin-top:15px}
}
@media(max-width:430px){
  .hero-kpi-icon{display:none}.hero-kpi{justify-content:center;text-align:center}.hero-kpi .cle{white-space:normal}
  .accueil-hero-compact h2{font-size:1.75rem}.accueil-hero-compact p{font-size:.82rem}
  .carte-analyse-top{grid-template-columns:92px 1fr}.photo-immeuble{min-height:88px}
  .kpis-liste{gap:6px}.kpis-liste .tuile{padding:9px 8px}.kpis-liste .cle{font-size:.58rem}.kpis-liste .val{font-size:1rem}
  .etapes-analyse{overflow-x:auto;grid-template-columns:58px 34px 58px 34px 58px 34px 65px 34px 82px;padding-bottom:4px}.etape strong{white-space:normal;line-height:1.1}
  .fiche-entete .bouton-retour span{display:none}
}

/* V8.4.2 — Import d'annonce visible directement dans l'écran Propriété */
.import-annonce-rapide{
  margin:2px 0 16px;padding:15px;border-radius:20px;
  background:linear-gradient(135deg,#f4faff 0%,#edf8ff 58%,#eefcf9 100%);
  border:1px solid #d7e9f5;box-shadow:0 8px 22px rgba(31,105,155,.06)
}
.import-annonce-tete{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:11px}
.import-annonce-tete>div{min-width:0}.import-annonce-tete strong{font-size:1rem;color:#102a43}.import-annonce-tete span{font-size:.78rem;color:#6e82a0;font-weight:600}
.import-annonce-tete p{margin:2px 0 0;font-size:.78rem;color:#5d7595;line-height:1.35}
.import-annonce-choix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.import-annonce-bouton{min-width:0;min-height:68px;border:1px solid #d7e5f0;border-radius:15px;background:rgba(255,255,255,.96);padding:10px 9px;display:flex;align-items:center;gap:9px;text-align:left;color:#102a43;font:inherit;box-shadow:0 2px 8px rgba(27,83,124,.04)}
.import-annonce-bouton:active{transform:scale(.985)}
.import-annonce-bouton>span:last-child{display:flex;flex-direction:column;min-width:0}
.import-annonce-bouton strong{font-size:.78rem;line-height:1.15;color:#076fe0;white-space:normal}
.import-annonce-bouton small{font-size:.65rem;color:#7186a1;margin-top:3px;line-height:1.15;white-space:normal}
.import-annonce-icone{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#e7f4ff;color:#0877d1;font-weight:900;font-size:1.15rem}
@media(max-width:430px){
  .import-annonce-rapide{padding:12px 10px}.import-annonce-choix{gap:6px}.import-annonce-bouton{padding:9px 6px;gap:5px;min-height:73px;flex-direction:column;justify-content:center;text-align:center}.import-annonce-icone{width:31px;height:31px}.import-annonce-bouton strong{font-size:.68rem}.import-annonce-bouton small{font-size:.57rem}
}

/* ======================================================================
   V8.4.3 — découvrabilité des interactions et analyse avancée à la demande
   ====================================================================== */

/* Le bouton i explique immédiatement au survol/focus sur ordinateur.
   Au toucher, le comportement existant (modale) reste disponible. */
.info-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  isolation: isolate;
}
.info-tooltip {
  position: absolute;
  z-index: 500;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translate(calc(-50% + var(--info-decalage-x, 0px)), 5px);
  width: min(320px, 78vw);
  max-width: calc(100vw - 32px);
  padding: 10px 12px;
  border-radius: 11px;
  background: #102a43;
  color: #fff;
  font-size: .78rem;
  font-weight: 500;
  line-height: 1.42;
  letter-spacing: 0;
  text-transform: none;
  text-align: left;
  box-shadow: 0 10px 28px rgba(16,42,67,.22);
  display: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.info-tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: calc(50% - var(--info-decalage-x, 0px));
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #102a43;
}
@media (hover:hover) and (pointer:fine) {
  .info-wrap:hover .info-tooltip,
  .info-wrap:focus-within .info-tooltip {
    display: block;
    opacity: 1;
    visibility: visible;
    transform: translate(calc(-50% + var(--info-decalage-x, 0px)), 0);
  }
  .btn-info:hover,
  .btn-info:focus-visible {
    background: #0877d1;
    color: #fff;
    box-shadow: 0 0 0 4px rgba(8,119,209,.13);
    transform: translateY(-1px) scale(1.05);
  }
}
/* Les anciennes sections utilisaient overflow:hidden, ce qui couperait
   l'infobulle. Les coins restent visuellement arrondis via les enfants. */
details.section { overflow: visible; }
details.section > summary { border-radius: var(--r); }
details.section[open] > summary { border-radius: var(--r) var(--r) 0 0; }
details.section[open] .section-corps { border-radius: 0 0 var(--r) var(--r); }

/* Ancien style conservé uniquement pour compatibilité visuelle des versions sauvegardées. */
.section-vacance-obligatoire {
  border-color: #c8ddea !important;
  box-shadow: 0 6px 18px rgba(25,91,132,.07) !important;
}
.section-vacance-obligatoire > summary { color:#123b61; }
.avis-zero-vacance {
  background: #eef8ff !important;
  border-color: #c8e4f5 !important;
  color: #184866 !important;
}

/* Analyse avancée : rien n'apparaît tant que la case n'est pas cochée. */
.analyse-avancee-controle {
  margin: 14px 0;
  background: #fff;
  border: 1px solid #d6e3ec;
  border-radius: 16px;
  box-shadow: 0 5px 16px rgba(18,67,105,.055);
}
.analyse-avancee-toggle {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  cursor: pointer;
  border-radius: 16px;
  transition: background .14s ease, border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
.analyse-avancee-toggle > input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.analyse-avancee-case {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  border: 2px solid #9db9cc;
  border-radius: 7px;
  background: #f7fbfd;
  position: relative;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.analyse-avancee-toggle input:checked + .analyse-avancee-case {
  background: #0877d1;
  border-color: #0877d1;
  box-shadow: 0 0 0 4px rgba(8,119,209,.10);
}
.analyse-avancee-toggle input:checked + .analyse-avancee-case::after {
  content: "✓";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 16px;
  font-weight: 900;
}
.analyse-avancee-toggle strong {
  display: block;
  color: #133b60;
  font-size: .98rem;
}
.analyse-avancee-toggle small {
  display: block;
  margin-top: 3px;
  color: #6a8193;
  font-size: .78rem;
  line-height: 1.42;
}
.analyse-avancee-menu {
  margin-top: 2px;
  animation: apparitionAvancee .16s ease-out;
}
@keyframes apparitionAvancee {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .analyse-avancee-menu { animation: none; }
}

/* Surbrillance systématique : l'utilisateur voit immédiatement ce qui est
   interactif lorsque le curseur le survole. */
button, a, details > summary, select, .interrupteur, .analyse-avancee-toggle,
.carte-plex, .lien-action, [data-liste-onglet], [data-scenario-view] {
  cursor: pointer;
}
button, a, details > summary, select, .interrupteur, .analyse-avancee-toggle,
.carte-plex, .lien-action, .import-annonce-bouton, .nav button {
  transition: background-color .14s ease, border-color .14s ease,
              color .14s ease, box-shadow .14s ease, transform .14s ease;
}
@media (hover:hover) and (pointer:fine) {
  details.section > summary:hover {
    background: #edf7fd;
    color: #075fa9;
  }
  .import-annonce-bouton:hover,
  .carte-plex:hover,
  .analyse-avancee-toggle:hover,
  .interrupteur:hover {
    background: #edf8ff;
    border-color: #9fcee9;
    box-shadow: 0 7px 20px rgba(8,119,209,.09);
  }
  .nav button:hover,
  .nav button:focus-visible {
    color: #0877d1;
    background: #eef7fd;
  }
  .segments button:hover:not([aria-pressed="true"]) {
    background: #e4f2fb;
    color: #0868b4;
  }
  .lien-action:hover,
  a:hover {
    color: #075fa9;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .btn.discret:hover,
  .btn.secondaire:hover,
  .import-annonce-bouton:hover {
    transform: translateY(-1px);
  }
  select:hover,
  .champ input:hover {
    border-color: #8fc5e2;
    background: #f8fcff;
  }
}

/* Mobile : le tooltip au survol n'existe pas, mais le i reste une cible
   tactile nette et ouvre toujours l'explication au toucher. */
@media (max-width: 560px) {
  .info-tooltip { display: none; }
  .btn-info { width: 22px; height: 22px; line-height: 22px; }
  .analyse-avancee-toggle { padding: 15px 14px; }
}

/* ======================================================================
   V8.4.4 — Responsive ordinateur/cellulaire + photo personnalisée
   ====================================================================== */
body{
  background:
    radial-gradient(circle at 88% 8%,rgba(46,168,228,.10),transparent 28rem),
    linear-gradient(180deg,#eef7fd 0%,#f4f9fd 48%,#edf6fb 100%);
}
.contenu{max-width:1180px}
.fiche-contenu{padding-left:22px;padding-right:22px}

/* Photo de profil : aucune photo générique répétée. Sans photo, fond neutre. */
.project-hero-photo,
.photo-immeuble,
.photo-profil-apercu{
  background-image:var(--photo-immeuble,linear-gradient(145deg,#dcecf7,#cbdfea 55%,#e8f4fa));
  background-size:cover;
  background-position:center;
}
.project-hero-photo::after,
.photo-immeuble::after,
.photo-profil-apercu::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(8,60,105,.08));
}
.photo-immeuble,.photo-profil-apercu{position:relative;overflow:hidden}

/* Hero : actions visibles, sans chevauchement. */
.project-hero{min-height:320px;padding-top:22px}
.project-hero-photo{
  width:min(48%,460px);height:238px;right:0;top:0;
  border-radius:0 0 0 34px;overflow:hidden;
}
.hero-actions{position:absolute;z-index:7;right:14px;top:14px;display:flex;gap:8px;align-items:center}
.hero-actions button{
  min-height:38px;border:1px solid rgba(255,255,255,.8);border-radius:12px;
  padding:8px 11px;font:700 .73rem var(--sans);cursor:pointer;
  box-shadow:0 6px 18px rgba(16,42,67,.14);-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.hero-photo-btn{background:rgba(10,43,76,.82);color:#fff}
/* 8.5.6 : bouton « Expliquer (IA) » dans l'en-tête. 8.5.7 : le bouton
   « Exporter en PDF » de l'en-tête n'existe plus (un seul bouton, dans
   Performance, voir .rapport-actions). */
.hero-ia-btn{background:rgba(255,255,255,.95);color:#0b6b4f}
.project-brand{margin-bottom:18px;max-width:50%}
.project-copy{max-width:50%;min-height:105px}
.hero-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.hero-kpi{overflow:visible;min-width:0}
.hero-kpi>div:last-child{min-width:0}
.hero-kpi .cle{white-space:normal;line-height:1.15}
.hero-kpi .val{font-size:clamp(.90rem,2.2vw,1.55rem);white-space:nowrap;overflow:visible;text-overflow:clip;letter-spacing:-.02em}

/* Tooltip : reste lisible sur fond sombre et se place près du i. */
.info-tooltip{width:min(300px,70vw);max-width:calc(100vw - 32px);background:#102a43;color:#fff;font-size:.76rem;box-shadow:0 12px 32px rgba(7,29,52,.28)}
.info-wrap{z-index:15}

/* Import plus compact : trois actions courtes, sans monopoliser l'écran. */
.import-annonce-rapide{
  display:grid;grid-template-columns:minmax(190px,.9fr) minmax(0,2.1fr);align-items:center;gap:12px;
  margin:0 0 14px;padding:10px 12px;border-radius:16px;
  background:linear-gradient(135deg,#e9f5fd,#eef8fc);
}
.import-annonce-tete{margin:0;align-items:center}
.import-annonce-tete p{font-size:.70rem;margin-top:1px}
.import-annonce-tete strong{font-size:.90rem}.import-annonce-tete span{font-size:.68rem}
.import-annonce-choix{gap:7px}
.import-annonce-bouton{min-height:50px;padding:7px 8px;border-radius:12px;gap:7px}
.import-annonce-icone{width:29px;height:29px;font-size:.95rem}
.import-annonce-bouton strong{font-size:.72rem}.import-annonce-bouton small{font-size:.58rem;margin-top:1px}

/* Titre + Tout ouvrir : petit, à droite du titre. */
.donnees-outils{padding:1px 3px 7px;align-items:flex-end;gap:8px}
.donnees-outils strong{font-size:1.48rem}
.bouton-tout-ouvrir{
  min-height:30px!important;padding:5px 9px!important;border-radius:10px!important;
  font-size:.70rem!important;font-weight:750!important;background:#edf7ff!important;
}

/* Photo à téléverser dans la fiche. */
.photo-profil-card{
  display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center;
  margin:0 0 14px;padding:12px;border:1px solid #d7e6f0;border-radius:16px;
  background:linear-gradient(135deg,#f4faff,#edf7fc);
}
.photo-profil-apercu{height:98px;border-radius:13px;border:1px dashed #a7c8dd}
.photo-profil-texte{min-width:0}.photo-profil-texte>strong{display:block;color:#123b61;font-size:.92rem}
.photo-profil-texte>span{display:block;margin-top:3px;color:#668098;font-size:.74rem;line-height:1.35}
.photo-profil-actions{display:flex;gap:7px;margin-top:9px}.photo-profil-actions .btn{width:auto;min-height:38px;padding:8px 11px}

/* Sur ordinateur : plus d'air et largeur accrue. */
@media (min-width:900px){
  .fiche-entete{padding-left:max(20px,calc((100vw - 1180px)/2));padding-right:max(20px,calc((100vw - 1180px)/2))}
  details.section>summary{min-height:54px}
  .section-corps{padding:16px 20px 20px}
  .donnees-outils{margin-top:4px}
  .nav{max-width:760px;left:50%;right:auto;transform:translateX(-50%);border:1px solid #dbe8f1;border-bottom:0;border-radius:18px 18px 0 0}
}

/* Tablette et cellulaire : la photo devient un vrai bloc, jamais sous le texte. */
@media (max-width:700px){
  .contenu,.fiche-contenu{padding-left:12px;padding-right:12px}
  .project-hero{
    min-height:0;margin:0 -4px 14px;padding:14px 10px 13px;border-radius:0 0 22px 22px;
    display:grid;grid-template-columns:minmax(0,1fr) minmax(128px,42%);gap:10px 10px;
    background:linear-gradient(180deg,#f8fcff,#edf7fd);
  }
  .project-hero::after{display:none}
  .project-brand{grid-column:1/-1;max-width:none;margin:0 0 2px}
  .project-brand strong{font-size:1.18rem}.project-brand small{font-size:.59rem}
  .project-copy{grid-column:1;grid-row:2;max-width:none;min-height:0;padding:7px 0}
  .project-copy h1{font-size:1.55rem}.project-subtitle{font-size:.76rem}.location-pill{font-size:.62rem;margin-top:7px}
  .project-hero-photo{
    position:relative;z-index:1;grid-column:2;grid-row:2;right:auto;top:auto;width:100%;height:135px;border-radius:17px;
  }
  .hero-actions{position:static;grid-column:1/-1;grid-row:3;justify-content:flex-end;gap:6px}
  .hero-actions button{min-height:34px;padding:6px 9px;font-size:.65rem}
  .hero-kpis{grid-column:1/-1;grid-row:4;gap:6px;margin-top:1px}
  .hero-kpi{padding:9px 7px;gap:5px;border-radius:14px}
  .hero-kpi-icon{width:29px;height:29px;font-size:.78rem}
  .hero-kpi .cle{font-size:.51rem}
  .hero-kpi .val{font-size:1.05rem;margin-top:2px}
  .hero-provisoire{grid-column:1/-1;font-size:.64rem;margin-top:1px}

  .import-annonce-rapide{display:block;padding:9px 9px;margin-bottom:12px}
  .import-annonce-tete{margin-bottom:7px}.import-annonce-tete p{display:none}
  .import-annonce-choix{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .import-annonce-bouton{min-height:54px;padding:6px 4px;flex-direction:column;justify-content:center;text-align:center;gap:3px}
  .import-annonce-icone{width:27px;height:27px}.import-annonce-bouton strong{font-size:.61rem}.import-annonce-bouton small{display:none}

  .donnees-outils{align-items:flex-start}.donnees-outils strong{font-size:1.34rem}.donnees-outils .aide{font-size:.68rem}
  .bouton-tout-ouvrir{margin-top:4px!important;min-height:28px!important;padding:4px 7px!important;font-size:.64rem!important}
  .photo-profil-card{grid-template-columns:105px 1fr;gap:10px;padding:9px}.photo-profil-apercu{height:82px}
  .photo-profil-texte>strong{font-size:.82rem}.photo-profil-texte>span{font-size:.65rem}.photo-profil-actions .btn{font-size:.68rem;padding:7px 8px}
  .trio-adresse{grid-template-columns:1fr 1fr}.trio-adresse>.champ:last-child{grid-column:1/-1}
}

@media (max-width:430px){
  .project-hero{grid-template-columns:minmax(0,1fr) 40%;gap:8px}
  .project-copy h1{font-size:1.35rem}.project-subtitle{font-size:.68rem}
  .project-hero-photo{height:118px}
  .hero-kpi-icon{display:none}
  .hero-kpi{justify-content:center;text-align:center;padding:8px 5px}
  .hero-kpi .cle{font-size:.47rem;line-height:1.1}.hero-kpi .val{font-size:.94rem}
  .hero-actions{justify-content:space-between}.hero-actions button{flex:1;font-size:.60rem;padding:6px 5px}
  .photo-profil-card{grid-template-columns:1fr}.photo-profil-apercu{height:128px}.photo-profil-actions{flex-wrap:wrap}
  .etapes-analyse{display:none}
  details.section>summary{padding:14px 13px;font-size:.91rem;min-height:52px}
  .section-corps{padding:13px 13px 15px}
  .nav button{font-size:.62rem}.nav button .pic{font-size:1.13rem}
}

/* ======================================================================
   V8.4.5 — correction des cartes + potentiel d’optimisation locative
   ====================================================================== */
/* Les cartes d'analyse ne sont plus des <button> englobants : cela évite
   qu'un bouton d'information imbriqué casse le DOM et fasse sortir la valeur
   du cash-flow de sa tuile. */
.carte-plex[role="button"] { cursor:pointer; border-radius:16px; outline:none; }
.carte-plex[role="button"]:focus-visible {
  box-shadow:0 0 0 3px rgba(8,119,209,.22);
}
.kpis-liste { align-items:stretch; }
.kpis-liste .tuile { min-width:0; overflow:hidden; }
.kpis-liste .cle { min-width:0; line-height:1.15; flex-wrap:wrap; }
.kpis-liste .val {
  display:block; min-width:0; max-width:100%;
  white-space:nowrap; overflow:visible; text-overflow:clip;
  font-size:clamp(.85rem,3.5vw,1.15rem);
  letter-spacing:-.02em;
}

.optimisation-locative { border-color:#cfe5f1; background:linear-gradient(145deg,#ffffff,#f3faff); }
.optimisation-locative .carte-tete { align-items:flex-start; }
.optimisation-resume {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:12px 0;
}
.optimisation-resume>div {
  min-width:0; padding:11px 12px; border:1px solid #dceaf2; border-radius:14px; background:#fff;
}
.optimisation-resume span { display:block; color:#607b93; font-size:.68rem; font-weight:700; }
.optimisation-resume strong { display:block; margin-top:4px; color:#102a43; font-size:clamp(.82rem,3.2vw,1.05rem); white-space:nowrap; overflow:visible; text-overflow:clip; letter-spacing:-.02em; }
.optimisation-resume strong.pos { color:#07966d; }
.optimisation-resume strong.neg { color:#d64545; }
.optimisation-comparaison {
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:0 0 12px;
}
.optimisation-comparaison>div {
  min-width:0; display:grid; grid-template-columns:1fr; gap:2px; padding:10px 11px;
  border:1px solid #dce9f2; border-radius:13px; background:#f8fcff;
}
.optimisation-comparaison span { color:#5b7590; font-size:.65rem; font-weight:700; }
.optimisation-comparaison strong { color:#183752; font-size:clamp(.78rem,3vw,.91rem); white-space:nowrap; overflow:visible; text-overflow:clip; letter-spacing:-.02em; }
.optimisation-comparaison b { color:#7a91a4; font-size:.72rem; }
.optimisation-comparaison .optimise { color:#0877d1; font-size:1.02rem; }
.scenarios-choix-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }

@media (max-width:700px) {
  .optimisation-resume { grid-template-columns:1fr 1fr; }
  .optimisation-resume>div:last-child { grid-column:1/-1; }
  .optimisation-comparaison { grid-template-columns:1fr 1fr; }
  .scenarios-choix-3 { grid-template-columns:1fr; }
  .scenarios-choix-3 button { min-height:64px; }
}
@media (max-width:560px) {
  .kpis-liste { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kpis-liste .tuile:nth-child(3) { grid-column:1/-1; }
  .kpis-liste .val { font-size:1.08rem; }
}


/* V8.4.6 — durées composées années + mois et écrans très étroits */
.duree-composee {
  min-width:0; margin:0 0 12px; padding:0; border:0;
}
.duree-composee legend {
  display:block; margin:0 0 7px; padding:0; color:var(--ardoise);
  font-size:.80rem; font-weight:700; line-height:1.25;
}
.duree-composee-grille {
  display:grid; grid-template-columns:1fr 1fr; gap:8px;
}
.duree-composee .champ { margin-bottom:0; }
.duree-composee .aide { margin-top:5px; }
.note-tal { border-color:#c7e3ef!important; background:#eef9fd!important; }

@media (max-width:360px) {
  .hero-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero-kpi:first-child { grid-column:1/-1; }
  .hero-kpi .val { font-size:clamp(.88rem,6vw,1.05rem); }
  .kpis-liste .val { font-size:clamp(.82rem,5.2vw,1rem); }
  .optimisation-resume strong,
  .optimisation-comparaison strong { font-size:clamp(.78rem,4.7vw,.92rem); }
  .duree-composee-grille { grid-template-columns:1fr; }
}


/* V8.4.9 — Tableau de bord novice, hypothèses avancées et graphiques interactifs */
.dashboard-vide-premium {
  position:relative; overflow:hidden; margin:4px 0 18px; padding:24px;
  border:1px solid #d6e7f2; border-radius:26px;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(235,247,255,.94));
  box-shadow:0 16px 40px rgba(20,82,127,.09);
}
.dashboard-vide-premium::after {
  content:""; position:absolute; width:210px; height:210px; right:-90px; top:-100px;
  border-radius:50%; background:radial-gradient(circle,rgba(18,201,217,.14),rgba(8,119,209,0) 68%); pointer-events:none;
}
.dashboard-vide-illustration { display:flex; align-items:flex-end; gap:7px; width:58px; height:48px; margin-bottom:16px; padding:9px; border-radius:16px; background:linear-gradient(145deg,#075dff,#12c9d9); box-shadow:0 9px 18px rgba(5,113,218,.2); }
.dashboard-vide-illustration span { display:block; flex:1; border-radius:5px 5px 2px 2px; background:#fff; opacity:.95; }
.dashboard-vide-illustration span:nth-child(1){height:38%}.dashboard-vide-illustration span:nth-child(2){height:72%}.dashboard-vide-illustration span:nth-child(3){height:100%}
.dashboard-kicker { display:block; margin-bottom:6px; color:#0877d1; font-size:.66rem; font-weight:850; letter-spacing:.14em; }
.dashboard-vide-copy h3 { margin:0; color:#0b1748; font-size:1.35rem; letter-spacing:-.025em; }
.dashboard-vide-copy p { margin:8px 0 18px; max-width:620px; color:#637a9b; line-height:1.5; }
.dashboard-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.dashboard-action { -webkit-appearance: none; appearance: none; width:100%; min-height:86px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; padding:14px; text-align:left; color:#123b61; background:#fff; border:1px solid #d7e6f0; border-radius:18px; box-shadow:0 7px 16px rgba(23,75,115,.055); cursor:pointer; transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease,background .14s ease; }
.dashboard-action:hover { transform:translateY(-2px); border-color:#76bcea; background:#fafdff; box-shadow:0 12px 24px rgba(18,94,151,.12); outline:none; }
.dashboard-action:focus-visible { transform:translateY(-2px); border-color:#76bcea; background:#fafdff; box-shadow:0 12px 24px rgba(18,94,151,.12); outline:none; }
.dashboard-action-icone { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:#eaf5ff; color:#0877d1; font-size:1.45rem; font-weight:800; }
.dashboard-action strong { display:block; color:#0b1748; font-size:.97rem; }.dashboard-action small { display:block; margin-top:3px; color:#70869c; line-height:1.3; }.dashboard-action b { color:#0877d1; font-size:1.2rem; }
.dashboard-rassurance { display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:16px; color:#55728b; font-size:.72rem; font-weight:650; }
.dashboard-rassurance span::first-letter { color:#07936d; }

.section-hypotheses-avancees { border-color:#cfe1ee!important; background:linear-gradient(180deg,#fff,#fbfdff); }
.section-hypotheses-avancees > summary { color:#123b61; }

.graphique-interactif { position:relative; margin-top:4px; padding-top:4px; }
.graphique-hit { cursor:crosshair; outline:none; }
.graphique-hit:focus-visible { outline:2px solid #12c9d9; outline-offset:1px; stroke:#12c9d9; stroke-width:2; }
.graphique-hit-colonne { touch-action:pan-y; }
.graphique-barre { transition:opacity .12s ease, filter .12s ease; pointer-events:none; }
.graphique-hit-colonne { transition:fill .12s ease; }
.graphique-hit-colonne:hover { fill:rgba(18,201,217,.10); }
.graphique-hit-colonne:focus-visible { fill:rgba(18,201,217,.10); }
.graphique-point-visuel { pointer-events:none; }
.graphique-tooltip { position:absolute; z-index:30; min-width:190px; max-width:min(280px,calc(100% - 24px)); transform:none; padding:11px 12px; color:#fff; background:rgba(7,30,72,.96); border:1px solid rgba(255,255,255,.18); border-radius:13px; box-shadow:0 10px 28px rgba(3,27,58,.25); pointer-events:none; font-size:.74rem; line-height:1.25; }
.graphique-tooltip::after { content:""; position:absolute; left:var(--fleche-x,50%); bottom:-6px; width:12px; height:12px; transform:translateX(-50%) rotate(45deg); background:rgba(7,30,72,.96); }
.graphique-tooltip-dessous::after { bottom:auto; top:-6px; }
.graphique-tooltip-titre { margin-bottom:7px; font-size:.82rem; font-weight:800; color:#fff; }
.graphique-tooltip-ligne { display:flex; justify-content:space-between; gap:14px; padding:3px 0; color:#dcecff; }
.graphique-tooltip-ligne strong { color:#fff; white-space:nowrap; font-variant-numeric:tabular-nums; }
.graphique-aide-interaction { margin:5px 0 2px; color:#71879c; font-size:.68rem; text-align:center; }
.graphique-selection .graphique-tooltip { box-shadow:0 12px 32px rgba(3,27,58,.32),0 0 0 3px rgba(18,201,217,.18); }

@media (max-width:620px) {
  .dashboard-vide-premium { padding:20px 16px; border-radius:22px; }
  .dashboard-actions { grid-template-columns:1fr; }
  .dashboard-vide-copy h3 { font-size:1.2rem; }
  .dashboard-rassurance { display:grid; gap:6px; }
  .graphique-tooltip { min-width:170px; font-size:.72rem; }
}


/* ========================================================================== 
   V8.5.0 — Expérience novice : lecture rapide et explications des KPI
   ========================================================================== */
.lecture-express {
  position: relative;
  overflow: hidden;
  border: 1px solid #dbe9f5;
  background: linear-gradient(145deg,#f7fbff 0%,#ffffff 56%,#f3fbfb 100%);
  box-shadow: 0 12px 34px rgba(25,81,127,.08);
}
.lecture-express::before {
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,#075dff,#0b89eb 58%,#12cad8);
}
.lecture-express-tete {
  display:flex;
  gap:14px;
  align-items:flex-start;
  justify-content:space-between;
  margin-bottom:14px;
}
.lecture-express-tete > div { min-width:0; }
.lecture-kicker {
  display:block;
  margin-bottom:4px;
  color:#0877d1;
  font-size:.65rem;
  font-weight:850;
  letter-spacing:.12em;
}
.lecture-express-tete h2 { color:#0b3768; font-family:var(--sans); font-size:1.12rem; font-weight:850; }
.lecture-express-tete p { margin:5px 0 0; color:#647b92; font-size:.82rem; line-height:1.42; }
.lecture-lexique { flex:none; white-space:nowrap; }
.lecture-express-grille {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.lecture-reponse {
  position:relative;
  min-width:0;
  padding:14px 12px 13px 42px;
  border:1px solid #e1ebf3;
  border-radius:16px;
  background:rgba(255,255,255,.94);
}
.lecture-numero {
  position:absolute;
  top:13px;
  left:12px;
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eaf5ff;
  color:#0877d1;
  font-size:.72rem;
  font-weight:900;
}
.lecture-question { display:block; min-height:2.4em; color:#647b92; font-size:.69rem; font-weight:720; line-height:1.2; }
.lecture-valeur { display:block; margin:7px 0 3px; color:#0b1748; font-size:1.35rem; font-weight:900; letter-spacing:-.03em; }
.lecture-reponse h3 { margin:0; color:#193b5d; font:800 .80rem/1.25 var(--sans); }
.lecture-reponse p { margin:6px 0 0; color:#536c82; font-size:.72rem; line-height:1.42; }
.lecture-surplus .lecture-valeur { color:#087c59; }
.lecture-apport .lecture-valeur { color:#b33a2d; }
.lecture-couverte .lecture-valeur { color:#0877d1; }
.lecture-hypotheses {
  margin-top:12px;
  border-top:1px solid #e2edf5;
  padding-top:10px;
}
.lecture-hypotheses summary {
  cursor:pointer;
  color:#365b7e;
  font-size:.78rem;
  font-weight:780;
}
.lecture-hypotheses-puces {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:10px;
}
.lecture-hypotheses-puces span {
  display:inline-flex;
  gap:6px;
  align-items:center;
  padding:6px 9px;
  border:1px solid #dfebf4;
  border-radius:999px;
  background:#fff;
  color:#536c82;
  font-size:.68rem;
}
.lecture-hypotheses-puces b { color:#244a6d; }
.lecture-hypotheses ul { margin:10px 0 6px 18px; padding:0; color:#536c82; font-size:.75rem; line-height:1.45; }
.lecture-hypotheses li + li { margin-top:4px; }
.sens-kpi {
  margin-top:7px;
  color:#647b92;
  font-size:.68rem;
  font-weight:560;
  line-height:1.35;
}
.tuile.etat-vert .sens-kpi,.tuile.etat-jaune .sens-kpi,.tuile.etat-rouge .sens-kpi { padding-right:2px; }

@media (max-width:680px) {
  .lecture-express-tete { display:block; }
  .lecture-lexique { margin-top:10px; }
  .lecture-express-grille { grid-template-columns:1fr; }
  .lecture-question { min-height:0; }
  .lecture-reponse { padding:13px 12px 12px 42px; }
}
@media (max-width:380px) {
  .lecture-express { padding:13px 12px; }
  .lecture-express-tete h2 { font-size:1rem; }
  .lecture-hypotheses-puces { display:grid; grid-template-columns:1fr 1fr; }
  .lecture-hypotheses-puces span { display:block; border-radius:11px; }
  .lecture-hypotheses-puces b { display:block; margin-bottom:1px; }
}
@media print {
  .lecture-lexique { display:none!important; }
  .lecture-express { box-shadow:none; break-inside:avoid; }
  .lecture-hypotheses { display:block; }
  .lecture-hypotheses > * { display:block; }
}
/* Ajustement V8.5.0 : les boutons globaux font 100% par défaut; ici le bouton
   du lexique reste compact sur bureau pour ne pas écraser le titre. */
.lecture-express-tete > div:first-child { flex:1 1 auto; }
.lecture-lexique { flex:0 0 auto; width:auto; max-width:220px; }
@media (max-width:680px) {
  .lecture-lexique { width:100%; max-width:none; }
}


/* V8.5.3 — détail de la marge, statut exclusif des logements et pages Plus intégrées */
.marge-detail { margin:12px 0; padding:13px; border:1px solid rgba(33,139,190,.18); border-radius:16px; background:linear-gradient(145deg,#f2fbff,#f4fcf9); }
.marge-detail.neutre { display:flex; flex-direction:column; gap:3px; color:#526b80; }
.marge-detail-tete { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px; }
.marge-detail-tete > div { display:flex; flex-direction:column; gap:2px; }
.marge-detail-tete span { font-size:.65rem; letter-spacing:.08em; font-weight:800; color:#39708d; }
.marge-detail-tete strong { font-size:1.18rem; color:#0b4f7c; font-variant-numeric:tabular-nums; }
.marge-detail-tete small { color:#6a7f8d; text-align:right; max-width:240px; }
.marge-detail-grille { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.marge-detail-grille > div { padding:9px 10px; border-radius:12px; background:rgba(255,255,255,.82); border:1px solid rgba(51,125,167,.10); min-width:0; }
.marge-detail-grille span { display:block; font-size:.68rem; color:#6d8292; margin-bottom:3px; }
.marge-detail-grille strong { display:block; font-size:.9rem; color:#163d59; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.marge-detail p { margin:9px 0 0; font-size:.72rem; color:#657a89; line-height:1.45; }

.statut-logement-bloc { margin:10px 0 12px; }
.statut-logement-titre { font-size:.8rem; font-weight:700; color:#36556d; margin-bottom:6px; }
.statut-logement { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; padding:4px; border-radius:13px; background:#edf3f7; border:1px solid #dfe8ef; }
.statut-logement button { min-height:42px; border:0; border-radius:10px; padding:7px 6px; background:transparent; color:#536d80; font:inherit; font-size:.76rem; }
.statut-logement button[aria-checked="true"] { background:#fff; color:#075fb3; font-weight:750; border:1px solid #bed8ed; box-shadow:0 2px 6px rgba(16,72,116,.08); }
.statut-logement button:focus-visible { outline:2px solid #12c9d9; outline-offset:2px; }

.menu-plus-danger { border-color:rgba(163,42,28,.18); background:linear-gradient(145deg,#fff,#fff7f5); }
.menu-plus-danger .menu-plus-icone { color:#a32a1c; background:#fff0ed; border-color:rgba(163,42,28,.14); }
.page-projet-interne { padding:12px; }
.page-projet-interne .carte-tete { margin-bottom:10px; }
.page-projet-frame { width:100%; min-height:65vh; height:calc(100vh - var(--hautEntete, 70px) - 230px); max-height:760px; border:0; border-radius:14px; background:#eef1f0; }

@media (max-width: 700px) {
  .marge-detail-grille { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .statut-logement { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .page-projet-frame { min-height:60vh; height:calc(100vh - var(--hautEntete, 70px) - 210px); }
}
@media (max-width: 420px) {
  .marge-detail-tete { flex-direction:column; }
  .marge-detail-tete small { text-align:left; }
}

/* V8.5.3 — détail de la marge : où va le paiement sur la durée choisie. */
.marge-detail-total { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:10px; padding-top:10px; border-top:1px solid rgba(51,125,167,.14); }
.marge-detail-total > div { padding:8px 10px; border-radius:11px; background:rgba(255,255,255,.66); min-width:0; }
.marge-detail-total span { display:block; font-size:.67rem; color:#6d8292; margin-bottom:3px; }
.marge-detail-total strong { display:block; font-size:.9rem; color:#163d59; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.marge-detail-calendrier { margin-top:10px; border-top:1px solid rgba(51,125,167,.14); padding-top:8px; }
.marge-detail-calendrier > summary { cursor:pointer; color:#0b5d85; font-size:.76rem; font-weight:800; }
.marge-detail-calendrier .tableau-defile { margin-top:8px; }
.marge-detail-calendrier table { min-width:520px; }
@media (max-width:560px) {
  .marge-detail-total { grid-template-columns:1fr; }
}


/* V8.5.4 — Réinitialisation visible directement dans l’onglet Propriété. */
.reinitialisation-propriete { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 14px; margin:8px 0 14px; border:1px solid rgba(163,42,28,.16); border-radius:16px; background:linear-gradient(145deg,#fff,#fff8f6); box-shadow:0 4px 14px rgba(58,77,91,.05); }
.reinitialisation-propriete > div { min-width:0; }
.reinitialisation-propriete strong { display:block; color:#6f241b; font-size:.86rem; margin-bottom:2px; }
.reinitialisation-propriete span { display:block; color:#7f6a66; font-size:.72rem; line-height:1.4; }
.btn-reinitialiser-propriete { flex:0 0 auto; width:auto!important; min-width:210px; min-height:44px; font-weight:800; }
.reinitialisation-propriete-bas { margin-top:20px; margin-bottom:10px; }
@media (max-width:680px) {
  .reinitialisation-propriete { flex-direction:column; align-items:stretch; }
  .btn-reinitialiser-propriete { width:100%!important; min-width:0; }
}

/* 8.5.5 : avis « Réponse simple » (vacance et mauvaises créances non
   inscrites) et son lien vers l'analyse avancée. */
.avis-hypotheses-revenus .lien-action { display:inline-block; margin-top:6px; font-size:.85rem; padding:4px 0; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.avis-hypotheses-revenus .lien-action:hover { color:#065ea8; }
.avis-hypotheses-revenus .lien-action:focus-visible { outline:2px solid #0877d1; outline-offset:2px; border-radius:4px; }
.dashboard-exemple { margin-top:10px; text-align:center; }
.dashboard-exemple .lien-action { font-size:.85rem; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
/* 8.5.5 (audit de la 8.5.4, T12) : un montant à 6 ou 7 chiffres dans une
   grande tuile dépassait l'écran à 320 px ; la valeur peut maintenant se
   couper, et elle rétrécit sur les écrans étroits. */
.tuile .val { overflow-wrap: anywhere; min-width: 0; }
.tuile { min-width: 0; }
@media (max-width: 359px) { .tuile.grande .val { font-size: 1.4rem; } .tuile .val { font-size: 1.08rem; } }

/* ==========================================================================
   8.5.7 — Palette « marine et or » (choix de Manno, 8 octobre 2026)
   Feuille posée en dernier : elle remplace les bleus vifs des couches 8.3 à
   8.5 par un bleu marine profond, avec une touche d'or (le mot
   « Rentabilité », le trait sous l'onglet actif, le bouton du rapport PDF).
   Les couleurs de sens ne changent pas : vert = favorable, jaune = vigilance,
   rouge = défavorable. Aucune formule n'est concernée.
   ========================================================================== */
:root{
  --marine:#0b1b3a;        /* encre des titres et des chiffres */
  --marine-2:#10306b;      /* primaire : boutons, éléments actifs */
  --marine-3:#1b4a9b;      /* milieu de dégradé, survol */
  --marine-4:#3473d6;      /* fin de dégradé, lueur */
  --marine-doux:#e8edf7;   /* pastilles, fonds d'icônes */
  --marine-fond:#f1f3f9;   /* fonds de blocs */
  --marine-bordure:#d3dbe8;
  --marine-sourd:#5a6b85;  /* textes secondaires */
  --or:#c9981f;            /* accent : « Rentabilité », soulignés, rapport */
  --or-vif:#e0b13a;
  --or-doux:#fbf3dc;
  --bleu-marque:#10306b; --bleu-fort:#10306b; --cyan:#3473d6;
  --bleu-cristal:#10306b; --cyan-cristal:#3473d6; --turquoise-cristal:#1b4a9b;
}
html,body{background:linear-gradient(180deg,#f3f5fa 0%,#fbfbfd 50%,#f3f5f9 100%)!important}
body{color:var(--marine)}
h1,h2,h3,.carte-tete h2,.entete h1,.mini-brand,.project-brand strong,.accueil-marque strong,.accueil-hero-compact h2,.accueil-section-titre h2,.dashboard-vide-copy h3,.donnees-outils strong,.lecture-express-tete h2,.lecture-valeur,.hero-kpi .val,.tuile .val,.lecture-reponse h3,.analyse-avancee-toggle strong,.cta-resultats strong,details.section>summary,details.section[open]>summary,.photo-profil-texte>strong,.import-annonce-tete strong,.optimisation-resume strong,.optimisation-comparaison strong,.marge-detail-grille strong,.marge-detail-total strong,.lecture-hypotheses-puces b{color:var(--marine)}
.accueil-hero-compact p,.dashboard-vide-copy p,.project-subtitle,.lecture-express-tete p,.lecture-question,.lecture-reponse p,.donnees-outils .aide,.project-brand small,.accueil-marque small,.hero-kpi .cle,.etiquette,.accueil-section-titre span,.dashboard-rassurance,.lecture-hypotheses summary,.sens-kpi{color:var(--marine-sourd)}
.project-brand strong span,.accueil-marque strong span,.mini-brand span{color:var(--or)}
.marque-icone{background:linear-gradient(145deg,var(--marine-2),var(--marine-4));box-shadow:0 7px 18px rgba(16,48,107,.22)}
.compteur-analyses,.dashboard-kicker,.lecture-kicker,.scenarios-intro .accueil-kicker,.cta-plus,.hero-kpi-icon,.lecture-numero,.lecture-couverte .lecture-valeur,.lien-action,.import-annonce-bouton strong,.import-annonce-icone,.calcul-auto-icone,.champ-auto span,.adresse-optionnelle span,.marge-detail-tete strong,.marge-detail-calendrier>summary,.etape.active,.menu-plus-icone,.scenarios-choix button>span,.optimisation-comparaison .optimise,.btn-info,.glossaire-terme>summary::after,.separateur-avance strong,.fiche-entete .bouton-retour span{color:var(--marine-2)}
.btn-30ans,.bouton-tout-ouvrir,.btn-langue,.bouton-retour,.accueil-topline .btn-langue{color:var(--marine-2)!important}
.btn-langue,.accueil-topline .btn-langue{background:#fff!important;border:1px solid var(--marine-bordure)!important}
.bouton-tout-ouvrir{border-color:#c7d3e8!important;background:var(--marine-fond)!important}
.hero-kpi-cf .hero-kpi-icon{color:#079466}
.hero-kpi-icon,.lecture-numero,.import-annonce-icone,.calcul-auto-icone,.btn-info,.adresse-optionnelle span,.dashboard-action-icone{background:var(--marine-doux)}
.menu-plus-icone{background:linear-gradient(145deg,var(--marine-doux),#f5f3ec);border-color:#dfe5ef}
.etape-badge,.btn{background:var(--marine-2)}
.btn:hover{background:var(--marine-3)}
.btn:focus-visible{background:var(--marine-3)}
.btn.secondaire,.btn.discret{background:#fff;color:var(--marine)}
.btn.secondaire{border-color:#c7d3e8}
.btn.discret{background:var(--marine-fond);color:#3a4f78;border-color:#dfe5ef}
.btn.discret:hover{background:var(--marine-doux);color:var(--marine-2)}
.btn.discret:focus-visible{background:var(--marine-doux);color:var(--marine-2)}
.btn.danger{color:var(--brique);background:#fff}
.btn-cristal,.cta-resultats .btn,.accueil-hero-compact .btn-cristal{background:linear-gradient(100deg,var(--marine-2) 0%,var(--marine-3) 58%,var(--marine-4) 100%)!important;box-shadow:0 8px 22px rgba(16,48,107,.20)}
.etape.active span,.dashboard-vide-illustration{background:linear-gradient(145deg,var(--marine-2),var(--marine-4));box-shadow:0 7px 16px rgba(16,48,107,.22)}
.interrupteur input{accent-color:var(--marine-2)}
.segments{background:#eef1f7;border-color:#dfe5ef}
.segments button[aria-pressed="true"]{color:var(--marine-2);border-color:#c7d3e8}
.statut-logement{background:#eef1f7;border-color:#dfe5ef}
.statut-logement button[aria-checked="true"]{color:var(--marine-2);border-color:#c7d3e8}
.statut-logement button:focus-visible{outline-color:var(--marine-4)}
.graphique-hit:focus-visible{outline-color:var(--marine-4)}
.graphique-hit:focus-visible{stroke:var(--marine-4)}
.graphique-hit-colonne:hover{fill:rgba(52,115,214,.10)}
.graphique-hit-colonne:focus-visible{fill:rgba(52,115,214,.10)}
.graphique-selection .graphique-tooltip{box-shadow:0 12px 32px rgba(3,27,58,.32),0 0 0 3px rgba(52,115,214,.18)}
.champ input:focus,.champ select:focus{border-color:var(--marine-3);outline:3px solid rgba(27,74,155,.14);box-shadow:none}
.analyse-avancee-controle{border-color:var(--marine-bordure)}
.analyse-avancee-case{border-color:#a9b7cf;background:#f8f9fc}
.analyse-avancee-toggle input:checked + .analyse-avancee-case{background:var(--marine-2);border-color:var(--marine-2);box-shadow:0 0 0 4px rgba(16,48,107,.10)}
.nav{border-color:#e1e6ef;border-top-color:#e1e6ef}
.nav::before{background:linear-gradient(90deg,transparent,var(--marine-4),transparent)}
.nav button[aria-current="true"],.nav button[aria-current="true"] .pic{color:var(--marine-2)}
.nav button[aria-current="true"]::after{background:var(--or)}
.carte,details.section,.lecture-reponse,.hero-kpi,.scenarios-intro,.mode-analyse-card,.analyse-avancee-controle{border-color:#e1e6ef}
.carte,.carte-analyse-accueil{box-shadow:0 6px 20px rgba(16,48,107,.06)}
.grille .tuile,.grille-3 .tuile,.kpis-liste .tuile{border-color:#e4e8f0}
.kpis-liste .tuile{background:#fbfbfd}
.puce{background:#eef1f7;color:#4a5f85}
.puce.pos{background:#e4fbf3;color:#087c67}
.puce.neg{background:var(--brique-pale);color:var(--brique)}
.avis.info{background:linear-gradient(135deg,#eef2fa,#f6f7fc);border-color:rgba(16,48,107,.16);color:#1d3461}
.section-secondaire .avis.info,.note-tal{background:var(--marine-fond)!important;border-color:var(--marine-bordure)!important;color:#2f4a73}
.section-avancee,.section-hypotheses-avancees{border-color:rgba(16,48,107,.22)!important}
.section-hypotheses-avancees{background:linear-gradient(180deg,#fff,#f8f9fc)}
.section-hypotheses-avancees>summary{color:var(--marine)}
.import-annonce-rapide{background:linear-gradient(135deg,#f3f5fa,#eef1f7 58%,#f6f4ee 100%);border-color:#dfe5ef;box-shadow:0 8px 22px rgba(16,48,107,.06)}
.import-annonce-bouton{border-color:#dfe5ef}
.photo-profil-card{background:linear-gradient(135deg,#f6f8fc,#eef1f7);border-color:var(--marine-bordure)}
.photo-profil-apercu{border-color:#a9b7cf}
.project-hero-photo,.photo-immeuble,.photo-profil-apercu{background-image:var(--photo-immeuble,linear-gradient(145deg,#dfe5f1,#cdd7e8 55%,#e9edf5))}
.adresse-optionnelle,.statut-achat,.champ-auto{background:var(--marine-fond);border-color:#dfe5ef}
.champ-auto{border-color:#c7d3e8}
.calcul-auto-interets,.admissibilite-30{background:var(--marine-fond);border-color:#dfe5ef}
.admissibilite-30.eligible{border-color:#c8e8dd;background:#f1fbf7}
.marge-detail{border-color:var(--marine-bordure);background:linear-gradient(145deg,#f6f8fc,#f6f4ee)}
.marge-detail-tete span{color:#4a5f85}
.marge-detail-grille>div{border-color:rgba(16,48,107,.10)}
.marge-detail-total,.marge-detail-calendrier{border-top-color:rgba(16,48,107,.14)}
.scenarios-choix button{border-color:#dfe5ef;background:#f8f9fc;color:#2b3f66}
.scenarios-choix button[aria-pressed="true"]{border-color:#9db3dc;background:#eef1f7;box-shadow:inset 0 0 0 1px rgba(16,48,107,.10)}
.portfolio-hero{background:linear-gradient(135deg,var(--marine),var(--marine-3))}
.portfolio-hero .accueil-kicker{color:#e3c66a}
.portfolio-hero p{color:#c9d3e6}
.portfolio-compte small{color:#c9d3e6}
.glossaire-intro{background:linear-gradient(120deg,var(--marine),var(--marine-3) 55%,var(--marine-4))}
.glossaire-kicker{color:#e3c66a}
.glossaire-terme>summary{color:var(--marine)}
.glossaire-exemple{border-left-color:var(--marine-4);background:var(--marine-fond);color:#2f4a73}
.menu-plus-intro{background:linear-gradient(135deg,#f3f5fa,#f7f5ee);border-color:#dfe5ef}
.menu-plus-item{border-color:#dfe5ef;background:linear-gradient(145deg,#fff,#f8f9fc)}
.modale-fond{background:rgba(11,27,58,.55)}
.barre-vive{background:var(--marine);border-color:#24355f}
.lecture-express{border-color:var(--marine-bordure);background:linear-gradient(145deg,#f6f8fc 0%,#fff 56%,#f9f8f3 100%);box-shadow:0 12px 34px rgba(16,48,107,.08)}
.lecture-express::before{background:linear-gradient(90deg,var(--marine-2),var(--marine-3) 58%,var(--or))}
.lecture-hypotheses{border-top-color:#e1e6ef}
.lecture-hypotheses-puces span{border-color:#e1e6ef}
.optimisation-locative{border-color:var(--marine-bordure);background:linear-gradient(145deg,#fff,#f6f8fc)}
.optimisation-resume>div,.optimisation-comparaison>div{border-color:#dfe5ef}
.optimisation-comparaison>div{background:#f8f9fc}
.carte-plex[role="button"]:focus-visible{box-shadow:0 0 0 3px rgba(16,48,107,.22)}
.avis-hypotheses-revenus .lien-action:hover{color:var(--marine-3)}
.avis-hypotheses-revenus .lien-action:focus-visible{outline-color:var(--marine-2)}
.separateur-avance{border-color:rgba(16,48,107,.14);background:radial-gradient(circle at 98% 0%,rgba(201,152,31,.18),transparent 7rem),linear-gradient(125deg,#f6f8fc,#f8f7f2)}
.dashboard-vide-premium{border-color:var(--marine-bordure);background:linear-gradient(145deg,rgba(255,255,255,.96),#f3f5fa);box-shadow:0 16px 40px rgba(16,48,107,.09)}
.dashboard-vide-premium::after{background:radial-gradient(circle,rgba(201,152,31,.16),rgba(16,48,107,0) 68%)}
.dashboard-rassurance span::first-letter{color:#07936d}
.project-hero{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 43%,rgba(243,245,250,.84) 63%,rgba(243,245,250,.25) 100%)}
.project-hero::after{background:linear-gradient(180deg,transparent,#f6f7fb 93%)}
.hero-photo-btn{background:rgba(11,27,58,.86)}
.hero-ia-btn{background:rgba(255,255,255,.95);color:var(--marine-2)}
.location-pill{color:#2f4a73}
.obligatoire{color:#b8860b}
.comparaison .comp-meilleur::after{color:var(--vert)}
.fiche-entete,.entete{box-shadow:0 1px 0 rgba(11,27,58,.07)}
.entete{border-bottom-color:#edf0f6}
.hero-provisoire{color:#a16d0b}
@media (hover:hover) and (pointer:fine){
  details.section>summary:hover{background:#f1f3f9;color:var(--marine-2)}
  .import-annonce-bouton:hover,.carte-plex:hover,.analyse-avancee-toggle:hover,.interrupteur:hover{background:#f6f8fc;border-color:#b7c5dd;box-shadow:0 7px 20px rgba(16,48,107,.08)}
  .nav button:hover{color:var(--marine-2);background:#eef1f7}
  .nav button:focus-visible{color:var(--marine-2);background:#eef1f7}
  .segments button:hover:not([aria-pressed="true"]){background:#e8edf7;color:var(--marine-2)}
  .lien-action:hover,a:hover{color:var(--marine-3)}
  select:hover,.champ input:hover{border-color:#b7c5dd;background:#fbfcfe}
  .btn-info:hover{background:var(--marine-2);color:#fff;box-shadow:0 0 0 4px rgba(16,48,107,.13)}
  .btn-info:focus-visible{background:var(--marine-2);color:#fff;box-shadow:0 0 0 4px rgba(16,48,107,.13)}
  .dashboard-action:hover{border-color:#9db3dc;background:#f8f9fc;box-shadow:0 12px 24px rgba(16,48,107,.12)}
  .dashboard-action:focus-visible{border-color:#9db3dc;background:#f8f9fc;box-shadow:0 12px 24px rgba(16,48,107,.12)}
}
@media (max-width:700px){
  .project-hero{background:linear-gradient(180deg,#fafbfd,#eef1f7)}
}

/* 8.5.8 — Accueil, Portefeuille, Plus : la barre de navigation flottante
   cachait la dernière ligne (« Vos analyses restent enregistrées sur cet
   appareil ») : depuis la 8.3.0, ces vues n'avaient que 34 px sous le
   contenu, moins que la hauteur de la barre. Même réserve que dans une fiche. */
.accueil-contenu{padding-bottom:calc(var(--hautNav) + 26px)}

/* 8.5.7 — Accueil : deux boutons dans l'en-tête (option 2 choisie par Manno),
   « Analyser un achat » et « Immeuble possédé ». La carte du bas accueille
   seulement : plus de deuxième paire de choix (pléonasme signalé). */
.hero-boutons{display:flex;gap:10px;flex-wrap:wrap}
.hero-boutons .btn{flex:1 1 150px;min-width:0;width:auto}
.hero-boutons .btn-cristal{padding-left:12px;padding-right:12px;font-size:1.02rem}
.btn-hero-second,.accueil-hero-compact .btn-hero-second{background:#fff!important;color:var(--marine)!important;border:1px solid var(--marine-bordure)!important;box-shadow:0 6px 16px rgba(16,48,107,.08)!important}
.btn-hero-second .cta-plus{background:var(--marine-doux);color:var(--marine-2);font-size:1.1rem}
@media (max-width:359px){
  .hero-boutons .btn-cristal{font-size:.92rem;min-height:58px}
}

/* 8.5.7 — « Votre situation » : premier acheteur, propriétaire occupant,
   construction neuve. Trois tuiles qu'on touche, à la place de trois cases à
   cocher que les clients ne voyaient pas (demande de Manno). Chaque tuile
   dit ce qu'elle change dans le calcul. */
.situation-card{margin:4px 0 14px;padding:14px 14px 12px;border:1px solid var(--marine-bordure);border-radius:18px;background:linear-gradient(150deg,#fff,#f6f8fc)}
.situation-tete{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
.situation-tete>div>strong{display:block;font-size:.98rem;color:var(--marine)}
.situation-tete>div>span{display:block;margin-top:2px;color:var(--marine-sourd);font-size:.74rem;line-height:1.35}
.situation-tuiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.situation-tuiles-1{grid-template-columns:minmax(0,1fr)}
.situation-tuile{-webkit-appearance:none;appearance:none;position:relative;min-height:112px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:12px 12px 11px;text-align:left;font:inherit;color:var(--marine);background:#fff;border:1.5px solid #cfd8e6;border-radius:15px;cursor:pointer;transition:border-color .14s ease,box-shadow .14s ease,background .14s ease,transform .14s ease}
.situation-tuile:active{transform:scale(.985)}
.situation-icone{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:var(--marine-doux);color:var(--marine-2);font-size:1.15rem;font-weight:800}
.situation-tuile strong{display:block;font-size:.88rem;line-height:1.2}
.situation-tuile small{display:block;color:var(--marine-sourd);font-size:.69rem;line-height:1.32}
.situation-coche{position:absolute;top:9px;right:9px;width:24px;height:24px;border-radius:50%;border:1.5px solid #cfd8e6;background:#fff;display:grid;place-items:center;color:transparent;font-size:.8rem;font-weight:900;transition:background .14s ease,border-color .14s ease,color .14s ease}
.situation-tuile[aria-pressed="true"]{border-color:var(--marine-2);background:linear-gradient(150deg,#fff,#eef2fa);box-shadow:0 0 0 3px rgba(16,48,107,.10),0 8px 18px rgba(16,48,107,.10)}
.situation-tuile[aria-pressed="true"] .situation-icone{background:var(--marine-2);color:#fff}
.situation-tuile[aria-pressed="true"] .situation-coche{background:var(--marine-2);border-color:var(--marine-2);color:#fff}
.situation-tuile[aria-pressed="true"] .situation-etat{color:var(--marine-2)}
.situation-etat{display:block;margin-top:auto;padding-top:4px;font-size:.66rem;font-weight:800;letter-spacing:.04em;color:#8a97ad;text-transform:uppercase}
.situation-tuile:focus-visible{outline:3px solid rgba(27,74,155,.35);outline-offset:2px}
.situation-note{margin-top:10px}
@media (hover:hover) and (pointer:fine){
  .situation-tuile:hover{border-color:#9db3dc;box-shadow:0 8px 18px rgba(16,48,107,.10)}
}
@media (max-width:700px){
  .situation-tuiles{grid-template-columns:1fr}
  .situation-tuile{min-height:0;flex-direction:row;align-items:center;gap:11px;padding:11px 42px 11px 12px}
  .situation-icone{flex:none}
  .situation-tuile>span:not(.situation-icone):not(.situation-coche){display:flex;flex-direction:column;min-width:0}
  .situation-etat{margin-top:3px;padding-top:0}
  .situation-coche{top:50%;transform:translateY(-50%)}
}

/* 8.5.7 — Un seul bouton pour le rapport PDF, dans Performance, après
   l'explication de l'IA (demande de Manno). Plus de bouton dans l'en-tête. */
.rapport-actions{position:relative;overflow:hidden;color:#fff;background:linear-gradient(135deg,var(--marine) 0%,#12306a 60%,#1b4a9b 100%);border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 34px rgba(11,27,58,.22)}
.rapport-actions::before{content:"";position:absolute;width:220px;height:220px;right:-80px;top:-110px;border-radius:50%;background:radial-gradient(circle,rgba(224,177,58,.28),rgba(224,177,58,0) 70%);pointer-events:none}
.rapport-actions>*{position:relative}
.rapport-kicker{display:block;margin-bottom:5px;color:#e3c66a;font-size:.65rem;font-weight:850;letter-spacing:.14em}
.rapport-actions .carte-tete{margin-bottom:6px}
.rapport-actions h2,.rapport-actions .carte-tete h2{color:#fff;font-size:1.3rem}
.rapport-actions>p{margin:0 0 14px;color:#c9d3e6;font-size:.82rem;line-height:1.45}
.btn-pdf,.rapport-actions .btn-pdf{display:flex;align-items:center;justify-content:center;gap:10px;min-height:58px;border:0;border-radius:16px;background:linear-gradient(100deg,#f1cf6a,var(--or-vif) 55%,#d39d1f);color:#2b2008;font-size:1.02rem;font-weight:850;letter-spacing:-.01em;box-shadow:0 10px 24px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.45)}
.btn-pdf:hover{background:linear-gradient(100deg,#f5d87c,#e9bd4a 55%,#dca72a)}
.btn-pdf:focus-visible{background:linear-gradient(100deg,#f5d87c,#e9bd4a 55%,#dca72a)}
.btn-pdf:active{transform:scale(.99)}
.btn-pdf .pdf-icone{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.55);font-size:1rem}
.rapport-ia-etat{display:flex;gap:9px;align-items:flex-start;margin-top:12px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#dfe6f3;font-size:.76rem;line-height:1.4}
.rapport-ia-etat b{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.72rem;background:rgba(255,255,255,.16);color:#fff}
.rapport-ia-etat.ok b{background:#1f9d6a}
.rapport-ia-etat.attention b{background:var(--or-vif);color:#2b2008}
.rapport-actions .aide{color:#aebbd3}
.rapport-actions .lien-action{color:#f1cf6a}
.portfolio-hero h2,.glossaire-intro h2{color:#fff}

/* 8.5.7 — Couleurs des repères (vert, jaune, rouge), perdues depuis la 8.4.1
   où la bordure grise des tuiles passait par-dessus. De retour à l'écran et
   dans le rapport PDF : bordure, fond léger, valeur et libellé colorés. */
.tuile.etat-vert,.grille .tuile.etat-vert,.grille-3 .tuile.etat-vert{border:2px solid #0f8a5f;background:linear-gradient(160deg,#fff,#eefaf4)}
.tuile.etat-jaune,.grille .tuile.etat-jaune,.grille-3 .tuile.etat-jaune{border:2px solid #d99a12;background:linear-gradient(160deg,#fff,#fff7e3)}
.tuile.etat-rouge,.grille .tuile.etat-rouge,.grille-3 .tuile.etat-rouge{border:2px solid #d14343;background:linear-gradient(160deg,#fff,#fff0ef)}
.tuile.etat-vert .val{color:#0b7a55!important}
.tuile.etat-jaune .val{color:#9a6300!important}
.tuile.etat-rouge .val{color:#b83232!important}
.tuile.etat-vert::after,.tuile.etat-jaune::after,.tuile.etat-rouge::after{display:inline-block;margin-top:8px;padding:3px 9px;border-radius:999px;font-size:.66rem;font-weight:800;letter-spacing:.02em}
.tuile.etat-vert::after{background:#dff5ea;color:#0b6b4f}
.tuile.etat-jaune::after{background:#fdebbd;color:#7a5200}
.tuile.etat-rouge::after{background:#fbdcdc;color:#9c2626}
@media print{
  .tuile.etat-vert,.tuile.etat-jaune,.tuile.etat-rouge,.tuile.etat-vert::after,.tuile.etat-jaune::after,.tuile.etat-rouge::after,.hero-kpi .val,.lecture-valeur,.puce{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  .rapport-actions,.hero-boutons{display:none!important}
  /* 8.5.7 : rapport plus compact. Jusqu'ici chaque carte refusait d'être
     coupée : une grande carte sautait à la page suivante et laissait une
     demi-page blanche (12 pages pour l'exemple). Une carte peut maintenant
     se couper entre deux pages ; une tuile, une ligne de tableau, un avis,
     une réponse de la lecture rapide et un titre de carte, jamais. */
  .carte{break-inside:auto}
  .carte-tete,.tuile,.lecture-reponse,.avis,tr,.lecture-express,.carte-dettes,.carte-ia,.optimisation-resume>div,.optimisation-comparaison>div,svg.graphique{break-inside:avoid}
  .carte-tete{break-after:avoid}
  .graphique-interactif{break-inside:avoid}
  /* Sans photo, l'en-tête du rapport n'affiche plus un grand cadre vide. */
  .project-hero-photo:not([style]){display:none!important}
}

/* 8.6.0 — Refinancements et immeuble possédé */
.refi-tete{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.refi-tete strong{color:var(--marine)}
.refis-resume div + div{margin-top:6px}
.carte-refinancements table.libelles td{white-space:normal;vertical-align:top;line-height:1.35}
.carte-refinancements table.libelles td:first-child{width:38%}
.carte-refinancements table.libelles td:last-child{text-align:right}
.refi-alerte{display:inline-block;margin-left:4px;color:#8a5a00;font-weight:750}

/* 8.6.2 — Depuis l'achat, année par année */
.avis.vert{background:linear-gradient(135deg,#e8f8f2,#f3fbf8);border-color:rgba(7,150,109,.28);color:#064e3b}
.cf-pos{color:var(--vert)}
.cf-neg{color:var(--brique)}
.annee-periode{font-size:.8rem;color:var(--texte-doux,#5b6475);text-align:right}
.annee-calcul{margin-top:2px;line-height:1.45}
.carte-depuis-achat .avis{margin-top:4px}
.tableau-depuis td small{color:var(--texte-doux,#5b6475);font-weight:500}
.tableau-depuis tr.ligne-refi td{text-align:left;white-space:normal;font-size:.8rem;color:var(--marine);background:rgba(16,48,107,.05)}
.carte-depuis-achat table.libelles td{white-space:normal;vertical-align:top;line-height:1.35}
.carte-depuis-achat table.libelles td:first-child{width:55%}
.carte-depuis-achat table.libelles td:last-child{text-align:right}
@media print{.tableau-depuis tr{break-inside:avoid}}

/* 8.6.2 : tableau année par année compact ; puce « non compté » vraiment cachée */
.tableau-depuis{font-size:.78rem}
.tableau-depuis th,.tableau-depuis td{padding:6px 4px}
.puce[hidden]{display:none}

/* 8.6.7 : relevé « Votre argent dans cet immeuble » et année en cours */
.carte-depuis-achat .sous-titre-releve{font-size:.92rem;margin:16px 0 6px;color:var(--marine,#10306b)}
.tableau-depuis tr.ligne-actuelle td{background:rgba(201,152,31,.08)}
.tableau-depuis tr.ligne-total td{border-top:2px solid rgba(16,48,107,.35)}
.annee-depuis.annee-actuelle{border-style:dashed}

/* 8.6.8 — Immeuble possédé : étapes, questions Oui / Non, saisie du passé, relevé */
.etapes-possede{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 14px}
.etapes-possede button{font:inherit;text-align:left;background:#fff;color:var(--marine-2,#10306b);border:1px solid var(--trait);border-radius:14px;padding:10px 8px;display:flex;flex-direction:column;gap:2px;min-height:48px;cursor:pointer}
.etapes-possede button small{font-size:.68rem;font-weight:700;color:var(--texte-doux,#5b6475);letter-spacing:.04em}
.etapes-possede button strong{font-size:.82rem;line-height:1.2}
.etapes-possede button[aria-current="step"]{background:var(--marine-2,#10306b);color:#fff;border-color:var(--marine-2,#10306b)}
.etapes-possede button[aria-current="step"] small{color:rgba(255,255,255,.8)}
.btn-suivant{display:flex;width:100%;justify-content:center;margin:6px 0 14px;min-height:50px;font-size:1rem}
.titre-etape{margin:4px 0 10px;font-size:1.25rem}
.question-card{background:var(--carte,#fff);border:1px solid var(--trait);border-radius:var(--r,18px);padding:16px;margin:0 0 14px}
details.section .question-card{padding:14px 0 4px;border:none;border-top:1px solid var(--trait);border-radius:0;margin:14px 0 0}
.question-titre{margin:0 0 6px;font-size:1.02rem;line-height:1.3}
.question-aide{margin:0 0 10px;font-size:.82rem;line-height:1.45;color:var(--texte-doux,#5b6475)}
.question-choix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:4px}
.question-choix button{font:inherit;font-size:1rem;font-weight:700;min-height:48px;border-radius:14px;border:2px solid #c6d0e0;background:#fff;color:var(--marine-2,#10306b);cursor:pointer}
.question-choix button[aria-pressed="true"]{background:var(--marine-2,#10306b);color:#fff;border-color:var(--marine-2,#10306b)}
.question-contenu{margin-top:12px}
.question-contenu .bloc-liste{background:#fbfcfe}
.question-non{margin:10px 0 0;font-size:.88rem;color:var(--texte-doux,#5b6475)}
.puce-passe{background:#e8edf7;color:var(--marine-2,#10306b)}
.puce-avenir{background:#fbf3dc;color:#7a5a0c}
.puce-attente{background:#fbf3dc;color:#7a5a0c}
.puce-pos{background:#e9f5ef;color:#0b5a40}
.puce-neg{background:#fdecea;color:#8c2417}
.refi-tete .puce{margin-left:auto;margin-right:8px}
details.sous-section{border:1px solid var(--trait);border-radius:14px;padding:0 12px;margin:8px 0 12px;background:#fbfcfe}
details.sous-section summary{cursor:pointer;padding:12px 0;font-weight:700;color:var(--marine-2,#10306b);list-style:none}
details.sous-section summary::-webkit-details-marker{display:none}
details.sous-section summary::after{content:"▾";float:right;color:var(--marine-2,#10306b)}
details.sous-section[open] summary::after{content:"▴"}
details.sous-section > :not(summary){margin-bottom:12px}
.choix-saisie{display:flex;flex-direction:column;gap:10px}
.choix-saisie button{font:inherit;text-align:left;border-radius:16px;padding:14px 16px;border:2px solid #c6d0e0;background:#fff;color:var(--marine,#0b1b3a);cursor:pointer}
.choix-saisie button strong{display:block;font-size:1rem}
.choix-saisie button span{display:block;font-size:.84rem;line-height:1.4;margin-top:4px;color:var(--texte-doux,#5b6475)}
.choix-saisie button[aria-pressed="true"]{background:var(--marine-2,#10306b);color:#fff;border-color:var(--marine-2,#10306b)}
.choix-saisie button[aria-pressed="true"] span{color:rgba(255,255,255,.85)}
details.annee-depuis{padding:0;overflow:hidden}
details.annee-depuis summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;cursor:pointer;list-style:none;min-height:60px}
details.annee-depuis summary::-webkit-details-marker{display:none}
details.annee-depuis .annee-titre{display:flex;flex-direction:column;gap:2px}
details.annee-depuis .annee-titre strong{font-size:1.1rem;color:var(--marine,#0b1b3a)}
details.annee-depuis .annee-titre .annee-periode{text-align:left}
details.annee-depuis .annee-statut{display:flex;align-items:center;gap:8px;white-space:nowrap}
details.annee-depuis .annee-statut::after{content:"▾";color:var(--marine-2,#10306b)}
details.annee-depuis[open] .annee-statut::after{content:"▴"}
details.annee-depuis .annee-statut .puce{font-size:.78rem;padding:4px 10px}
details.annee-depuis .annee-corps{padding:0 16px 16px}
.carte.annee-actuelle{border:1px dashed #c9981f;background:#fffaf0}
.releve-boite{border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.releve-debourse{background:var(--marine,#0b1b3a);color:#fff;border-top:4px solid #c9981f}
.releve-debourse .releve-etiquette{color:#f3d98a}
.releve-debourse .releve-sous{color:#d7deec}
.releve-recupere{background:#e9f5ef;color:#0b5a40}
.releve-recupere .releve-sous{color:#24453a}
.releve-etiquette{font-size:.72rem;font-weight:800;letter-spacing:.06em}
.releve-montant{font-size:2rem;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.releve-sous{font-size:.84rem;line-height:1.4}
.releve-barres{display:flex;flex-direction:column;gap:8px;margin:4px 0 12px;font-size:.78rem;color:var(--texte-doux,#5b6475)}
.releve-barres > div{display:flex;align-items:center;gap:10px}
.releve-barres > div > span:first-child{width:76px;flex:none}
.releve-barres .barre{flex:1;height:14px;background:#eef1f7;border-radius:999px;overflow:hidden;display:block}
.releve-barres .barre > span{display:block;height:100%;border-radius:999px}
.releve-barres .barre-debourse{background:var(--marine,#0b1b3a)}
.releve-barres .barre-recupere{background:#0f8a5f}
.releve-resultat{border:2px solid var(--marine-2,#10306b);border-radius:16px;padding:14px 16px;font-size:1rem;line-height:1.4;font-weight:700;color:var(--marine,#0b1b3a);margin-bottom:12px}
.releve-resultat.vert{border-color:#0f8a5f;color:#0b5a40}
details.detail-sorties{border:1px solid var(--trait);border-radius:14px;padding:0 14px;margin-bottom:8px;background:#fbfcfe}
details.detail-sorties summary{cursor:pointer;padding:12px 0;font-weight:700;color:var(--marine-2,#10306b);list-style:none;display:flex;justify-content:space-between;align-items:center}
details.detail-sorties summary::-webkit-details-marker{display:none}
details.detail-sorties summary::after{content:"▾"}
details.detail-sorties[open] summary::after{content:"▴"}
table.releve{width:100%;border-collapse:collapse;font-size:.86rem;margin-bottom:12px}
table.releve{table-layout:fixed}
table.releve td{padding:8px 0;border-bottom:1px solid #e3e8f1;vertical-align:top;line-height:1.35;white-space:normal;overflow-wrap:anywhere}
table.releve td:first-child{width:64%}
table.releve td:last-child{text-align:right;white-space:nowrap;padding-left:10px;font-variant-numeric:tabular-nums}
table.releve td small{display:block;font-size:.76rem;color:var(--texte-doux,#5b6475)}
table.releve tr.releve-info td{color:var(--texte-doux,#5b6475)}
table.releve tr.releve-groupe td{padding:12px 0 4px;border-bottom:none;font-size:.7rem;font-weight:800;letter-spacing:.05em;color:var(--texte-doux,#5b6475);text-transform:uppercase}
table.releve tr.releve-total td{font-weight:800;border-bottom:2px solid var(--marine,#0b1b3a);padding:12px 0}
table.releve tr.releve-moins td{color:#0b5a40;padding:10px 0}
table.releve tr.releve-final td{font-weight:800;font-size:.95rem;border-bottom:none;padding:12px 0 0}
.tableau-depuis-3 th:nth-child(2),.tableau-depuis-3 th:nth-child(3),.tableau-depuis-3 td:nth-child(2),.tableau-depuis-3 td:nth-child(3){text-align:right}
.tableau-depuis-3{font-size:.88rem}
.tableau-depuis-3 th,.tableau-depuis-3 td{padding:9px 6px}
@media print{.releve-debourse{background:#fff!important;color:var(--marine,#0b1b3a)!important;border:2px solid var(--marine,#0b1b3a)}.releve-debourse .releve-etiquette,.releve-debourse .releve-sous{color:var(--marine,#0b1b3a)!important}details.annee-depuis,details.detail-sorties,details.sous-section{display:block}details.annee-depuis:not([open]) .annee-corps,details.detail-sorties:not([open]) table{display:none}}
@media (max-width:520px){.carte-refinancements table.libelles td{display:block;width:auto!important;text-align:left!important;padding:2px 0 8px}.carte-refinancements table.libelles td:first-child{font-weight:650;padding:8px 0 0;border-bottom:none}.carte-refinancements table.libelles tr{display:block;border-bottom:1px solid #e3e8f1}}
/* 8.6.9 : marge de crédit, confirmation par année ; type de taux et termes */
.marge-annee{border:1px dashed #c9981f;background:#fffaf0;border-radius:14px;padding:12px 12px 2px;margin:10px 0 12px}
.marge-annee-titre{font-weight:700;font-size:.9rem;color:var(--marine,#0b1b3a);margin-bottom:8px}
/* 8.7.0 : portefeuille — valeurs d'aujourd'hui, plus-value, barre « à la banque / à vous », une carte par immeuble */
.portefeuille-hero{display:block;padding:20px 18px 18px}
.portefeuille-hero-corps{display:flex;flex-direction:column;gap:4px;min-width:0}
.portefeuille-hero-corps .cle{font-size:.82rem;color:#c9d3e6}
.portefeuille-hero-corps h2{font-size:1.35rem;color:#fff}
.portefeuille-hero-corps p{margin:4px 0 0;color:#c9d3e6;font-size:.82rem;line-height:1.45}
.portefeuille-valeur{font-size:clamp(1.6rem,8.5vw,2.3rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:#fff;white-space:nowrap;font-variant-numeric:tabular-nums}
.portefeuille-plus{font-weight:800;font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.portefeuille-plus.pos{color:#8fe0b8}.portefeuille-plus.neg{color:#ffb4a8}
.portefeuille-sous{font-size:.78rem;color:#c9d3e6;line-height:1.4}
.portefeuille-tuiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 12px}
.portefeuille-tuiles .tuile{border-radius:17px;background:#fff;border:1px solid #e7eef4;padding:12px 13px;min-width:0}
.portefeuille-tuiles .tuile .val{white-space:nowrap;overflow-wrap:normal;overflow:hidden;font-size:1.12rem}
.portefeuille-barre-carte{padding-top:16px}
.portefeuille-barre{display:flex;height:16px;border-radius:8px;overflow:hidden;background:#e3e8f1;margin:2px 0 8px}
.portefeuille-barre span{display:flex;align-items:center;justify-content:center;font-size:.66rem;font-weight:800;color:#fff;white-space:nowrap;overflow:hidden}
.portefeuille-barre .banque{background:var(--marine-2,#10306b)}.portefeuille-barre .vous{background:var(--or,#c9981f)}
.portefeuille-barre.mini{height:9px;margin:12px 0 6px}
.portefeuille-legende{display:flex;justify-content:space-between;gap:10px;font-size:.78rem;color:var(--marine-sourd,#5a6b85)}
.portefeuille-legende b{color:var(--marine,#0b1b3a);white-space:nowrap;font-variant-numeric:tabular-nums}
.portefeuille-legende .pt{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.portefeuille-legende .pt.banque{background:var(--marine-2,#10306b)}.portefeuille-legende .pt.vous{background:var(--or,#c9981f)}
.cpi-ratios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding-top:10px;margin-top:10px;border-top:1px solid #e3e8f1;text-align:center}
.cpi-ratios span{display:flex;flex-direction:column;gap:1px;min-width:0}
.cpi-ratios small{font-size:.66rem;color:var(--marine-sourd,#5a6b85);white-space:nowrap}
.cpi-ratios b{font-size:.9rem;color:var(--marine,#0b1b3a);white-space:nowrap;font-variant-numeric:tabular-nums}
.cpi-ratios span+span{border-left:1px solid #e3e8f1}
.cpi-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.cpi-tete>div{min-width:0}
.cpi-nom{display:block;font-size:1.05rem;font-weight:800;color:var(--marine,#0b1b3a);overflow-wrap:anywhere}
.cpi-tete .etiquette{display:block;margin-top:2px;text-transform:none;letter-spacing:0;font-size:.78rem}
.cpi-tete .puce{flex:none;white-space:nowrap}
.cpi-valeur{display:flex;flex-direction:column;gap:1px;margin:10px 0}
.cpi-valeur .cle{font-size:.76rem;color:var(--marine-sourd,#5a6b85)}
.cpi-valeur .val{font-size:clamp(1.35rem,6.5vw,1.75rem);font-weight:800;letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--marine,#0b1b3a)}
.cpi-plus{font-size:.9rem;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cpi-plus small{font-weight:400;color:var(--marine-sourd,#5a6b85)}
.cpi-plus.pos{color:var(--vert,#0b6b4f)}.cpi-plus.neg{color:var(--brique,#a32a1c)}
.cpi-liens{display:flex;flex-direction:column;margin-top:6px}
.cpi-lien{display:flex;justify-content:space-between;align-items:center;width:100%;background:none;border:0;border-top:1px solid #e3e8f1;padding:11px 0;font:inherit;font-size:.9rem;font-weight:700;color:var(--marine-2,#10306b);cursor:pointer;min-height:44px;text-align:left}
details.cpi-manque{border-top:1px solid #e3e8f1}
details.cpi-manque summary{display:flex;justify-content:space-between;align-items:center;padding:11px 0;font-size:.9rem;font-weight:700;cursor:pointer;list-style:none;min-height:44px;color:var(--brique,#a32a1c)}
details.cpi-manque summary::-webkit-details-marker{display:none}
details.cpi-manque summary span[aria-hidden]{color:var(--marine-2,#10306b);transition:transform .15s}
details.cpi-manque[open] summary span[aria-hidden]{transform:rotate(180deg)}
details.cpi-manque .avis{margin:0 0 12px}
details.portefeuille-argent{padding:0 16px}
details.portefeuille-argent summary{display:flex;justify-content:space-between;align-items:center;padding:14px 0;font-size:.72rem;font-weight:800;letter-spacing:.06em;color:var(--marine-sourd,#5a6b85);cursor:pointer;list-style:none;min-height:48px}
details.portefeuille-argent summary::-webkit-details-marker{display:none}
details.portefeuille-argent summary span[aria-hidden]{color:var(--marine-2,#10306b);font-size:1rem;transition:transform .15s}
details.portefeuille-argent[open] summary span[aria-hidden]{transform:rotate(180deg)}
details.portefeuille-argent>:not(summary){margin-bottom:14px}
.portefeuille-releve td:last-child{white-space:nowrap}
.carte-portefeuille-projet{border-style:dashed}
.cpp-corps{display:block;width:100%;background:none;border:0;padding:0;font:inherit;color:inherit;text-align:left;cursor:pointer}
.cpp-prix{white-space:nowrap;font-size:1rem;flex:none}
.cpp-ligne{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:8px;font-size:.8rem;color:var(--marine-sourd,#5a6b85)}
.cpp-ligne .pos{color:var(--vert,#0b6b4f);font-weight:800;white-space:nowrap}.cpp-ligne .neg{color:var(--brique,#a32a1c);font-weight:800;white-space:nowrap}
.portefeuille-projets-note{margin:-6px 2px 12px}
.portefeuille-pied{text-align:center;font-size:.76rem;color:var(--marine-sourd,#5a6b85);margin:4px 0 8px}
@media (max-width:380px){.portefeuille-tuiles .tuile .val{font-size:1rem}.cpi-ratios{font-size:.7rem}.cpp-ligne{flex-direction:column;gap:2px}}
@media print{.portefeuille-barre,.portefeuille-barre span,.portefeuille-legende .pt,.portefeuille-hero{-webkit-print-color-adjust:exact;print-color-adjust:exact}details.portefeuille-argent,details.cpi-manque{display:block}details.portefeuille-argent:not([open])>:not(summary),details.cpi-manque:not([open])>:not(summary){display:none}}
/* 8.7.1 : en bas de la fiche, retour au portefeuille (demande de Manno) */
.pied-fiche{display:flex;flex-direction:column;align-items:center;gap:6px;margin:22px 0 8px}
.pied-fiche .btn-pied-portefeuille{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:0 16px;font-size:1.02rem;text-align:left}
.pied-fiche .btn-pied-portefeuille .cta-plus{background:#fff;color:var(--marine-2,#10306b);font-size:1.1rem;flex:none}
.pied-fiche .btn.discret{min-height:44px}
@media print{.pied-fiche{display:none}}
/* 8.8.0 : projet d'achat en trois étapes — relevé « Argent nécessaire pour acheter », détails d'un logement repliés */
.releve-achat{padding:16px 16px 6px}
.releve-achat .releve-boite{margin-bottom:12px}
.releve-achat table.releve td small{display:block;font-size:.72rem;color:var(--texte-doux,#5b6475);font-weight:400}
details.logement-details{margin:2px 0 4px}
details.logement-details summary{font-size:.86rem;padding:10px 0}