/* ════════════════════════════════════════════════════════════════════════
   ESPACE PARTENAIRE — mise en page, sur fond papier.

   FOND PAPIER DEPUIS LE 11/08/2026, sur décision de Vanessa. La charte v3
   §9 posait « fond --nuit sur l'espace partenaire, qui est un écran de
   résultat », et la spec paiement le redisait au §11 pour l'écran Paiements.
   Les deux documents sont à corriger sur ce point : le code fait foi ici.

   L'espace a donc exactement l'allure de la plateforme éditeur — colonne de
   navigation sombre, contenu sur papier — et c'est mieux ainsi : ce sont deux
   vues du même objet, regardées à dix minutes d'intervalle par deux personnes
   qui se parlent au téléphone. Deux fonds différents leur faisaient décrire
   deux écrans qui ne se ressemblaient pas.

   CE QUI RESTE DANS CETTE FEUILLE, ET RIEN D'AUTRE : la mise en page et les
   couleurs SÉMANTIQUES propres à l'espace — les trois états de disponibilité,
   le compte à rebours, les issues d'historique, le récapitulatif de
   déblocage. Tout ce qui repeignait simplement interne.css pour le fond
   sombre a été retiré : interne.css peint déjà juste pour le papier, et une
   surcharge qui redit la même chose est une surcharge qui divergera.

   L'AMBRE RESTE RÉSERVÉ À LA DONNÉE — un montant, un solde, un temps restant ;
   jamais un bouton, jamais un élément de navigation. Sur papier c'est
   --ambre-texte qui porte le texte, pas --ambre-vif : le vif est calibré pour
   être lu sur fond sombre, et il tombe à moins de 2:1 sur du blanc. Même
   règle, deux jetons, parce que le contraste n'est pas une préférence.

   Aucune ombre portée, aucun dégradé : filet 1 px --trait, rayon 12 px.
   ════════════════════════════════════════════════════════════════════════ */

/* ── Les trois états de disponibilité (§3) ────────────────────────────
   Trois pastilles distinctes, parce que trois états qui se ressemblent à
   l'écran finissent par se confondre dans la conversation — et Complète
   appartient à la conciergerie quand Suspendue appartient à la plateforme.
   La brique reste réservée à ce qui disqualifie : elle ne colore que
   Suspendue. */
.pastille-disponible{background:var(--voile);border-color:var(--cadastre);color:var(--cadastre)}
.pastille-complete{background:#FBF1DA;border-color:var(--ambre);color:var(--ambre-texte)}
.pastille-suspendue{background:var(--brique-voile);border-color:var(--brique);color:var(--brique)}

/* ── Compteurs d'en-tête ──────────────────────────────────────────────
   Quatre cartes sur tous les écrans. La quatrième porte du TEXTE — une
   tranche de délai, pas un nombre — et doit rester lisible à côté de trois
   chiffres de 28 px sans les écraser. */
.compteurs .n-texte{font-size:17px;line-height:1.25;padding-top:5px}
.compteurs .n-ambre{color:var(--ambre-texte)}
.compteur .d{font-size:11.5px;color:var(--encre-2);margin-top:3px}

/* ── Compte à rebours (§9) ────────────────────────────────────────────
   Il ne s'anime PAS : il est calculé au rendu et arrondi à l'heure ou à la
   minute. Aucune règle d'animation dans cette feuille, et c'est délibéré —
   une seconde qui défile sur une décision qu'on a deux jours pour prendre
   fabrique une urgence fausse, et l'urgence fausse fait acheter des demandes
   qu'on ne servira pas.

   L'ambre est ici à sa place : le temps restant EST une donnée. */
.demande-rebours{margin:10px 0 0;font-weight:600;color:var(--ambre-texte);
  font-variant-numeric:tabular-nums}
.demande-rebours .secondaire{font-weight:400;margin-left:8px;display:inline}
/* Sous quatre heures, la brique : ce n'est plus une donnée, c'est une
   contrainte. C'est la seule exception à « la brique pour la contrainte
   réglementaire locale », et elle est assumée — au même titre que le bandeau
   d'observation de l'éditeur. */
.demande-rebours-urgent{color:var(--brique)}
.demande-urgente{border-color:var(--brique)}

/* La preuve de consentement, à gauche du bouton d'achat : c'est ce qui est
   vendu. La conciergerie qui appellera doit pouvoir dire qui a consenti, quand
   et sous quel nom — le lui rappeler au moment de payer vaut mieux que de le
   ranger dans un dépliant. */
.demande-consenti{margin:0;font-size:13px;color:var(--encre-2);max-width:44ch}

/* `flex-start` et non `center` depuis que le déblocage se déplie : centré,
   « Passer » remontait au milieu du récapitulatif ouvert et se lisait comme
   une ligne de ce tableau. Les deux gestes restent côte à côte, alignés sur
   leur haut, quelle que soit la hauteur du bloc de confirmation. */
.demande-actions{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
.demande-actions form{margin:0}
.demande-passer summary{cursor:pointer;font-size:14px;color:var(--encre-2);
  padding:9px 0;list-style:none}
.demande-passer summary::-webkit-details-marker{display:none}
.demande-passer summary::before{content:'↩ '}
.demande-passer summary:hover{color:var(--encre)}
.demande-passer[open]{border:1px solid var(--trait);border-radius:var(--r-s);
  padding:10px 14px;max-width:46ch}
.demande-passer p{margin:6px 0 10px}

/* ── Issues de l'historique ───────────────────────────────────────────
   Trois issues, trois teintes sobres. Aucune ne « punit » : passer vite est
   un bon comportement, et une demande passée ne doit pas s'afficher comme un
   échec. Seule l'expiration porte la brique, parce qu'elle est la seule qui
   fait attendre quelqu'un pour rien. */
.issue{font-size:12.5px;padding:2px 9px;border-radius:999px;
  border:1px solid var(--trait);white-space:nowrap}
.issue-debloque{border-color:var(--cadastre);color:var(--cadastre)}
.issue-refuse{color:var(--encre-2)}
.issue-expire{border-color:var(--brique);color:var(--brique)}

.col-montant{text-align:right;white-space:nowrap}
.montant-negatif{color:var(--encre-2)}

/* ── Disponibilité et absence ─────────────────────────────────────── */
.dispo-choix{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 6px}
.dispo-retour{margin:10px 0 0;font-size:14px}
.dispo-tranche{font-family:var(--titre);font-size:22px;margin:0 0 8px;color:var(--ambre-texte)}

/* ── Recommandations ──────────────────────────────────────────────── */
.apport-lien code{display:inline-block;background:var(--voile);border:1px solid var(--trait);
  border-radius:var(--r-s);padding:10px 14px;font-size:15px;word-break:break-all;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.apport-message{margin:0 0 16px}
.apport-message-titre{font-weight:600;font-size:13.5px;margin:0 0 5px}
.apport-message textarea{font-size:14px;line-height:1.5}
.apport-message .bouton{margin-top:7px}
.apport-note{max-width:80ch;margin:-8px 0 18px}

/* La mention de non-influence : VISIBLE, PAS EN PETIT. Elle est la
   contrepartie de tout l'écran, elle a donc le corps d'un paragraphe et un
   cadre à elle. */
.mention-non-influence{border:1px solid var(--trait);border-left:3px solid var(--cadastre);
  border-radius:0 var(--r-s) var(--r-s) 0;padding:14px 18px;margin:0 0 18px;
  font-size:15px;max-width:80ch}

/* ── Valeur dans la navigation latérale ───────────────────────────────
   Le solde de crédits, à côté de Recommandations. Ce n'est PAS une pastille :
   une pastille dit « il y a du travail ici », un solde dit un montant. Il est
   donc discret, en ambre parce que c'est un chiffre, et sans fond plein qui
   le mettrait au rang des compteurs de demandes (§6.1). */
.nav-valeur{font-size:12px;color:var(--nav-actif);font-variant-numeric:tabular-nums;
  flex:0 0 auto;opacity:.9}

/* ── Paiements ────────────────────────────────────────────────────────
   §11 de la spec paiement du 11/08/2026.

   L'AMBRE EST RÉSERVÉ À LA DONNÉE. Les montants le portent ; jamais un bouton,
   jamais un élément de navigation. Le bouton du portail et celui du déblocage
   sont en --cadastre, comme toutes les actions de l'espace — une action qui
   change de couleur selon l'écran cesse d'être reconnaissable comme une
   action.

   Aucune ombre portée, aucun dégradé : filet 1 px --trait, rayon 12 px. */
.montant-ambre{color:var(--ambre-texte);font-variant-numeric:tabular-nums;font-weight:600}

/* Une transaction remboursée reste lisible mais cesse d'être un fait courant :
   elle s'efface d'un cran plutôt que de disparaître. Un historique dont on
   retire les lignes annulées est un historique qu'on ne peut pas rapprocher
   d'un relevé bancaire. */
.ligne-remboursee td{color:var(--encre-2)}

/* ── Confirmation de déblocage ────────────────────────────────────────
   Le <details> porte le bouton dans son <summary> : ouvert, il montre le
   détail du calcul ; fermé, il ressemble exactement au bouton d'avant. Le
   partenaire ne découvre donc pas un écran de plus, il déplie un montant.

   AUCUNE URGENCE ARTIFICIELLE : pas de compte à rebours ici, pas de « plus
   que 2 h ». Le minuteur reste factuel, dans la ligne de la demande. */
.demande-confirmer{display:inline-block}
.demande-confirmer > summary{list-style:none;cursor:pointer;display:inline-block}
.demande-confirmer > summary::-webkit-details-marker{display:none}
.demande-confirmer[open] > summary{opacity:.55}
.recap-deblocage{border-collapse:collapse;margin:14px 0 4px;min-width:min(320px,100%)}
.recap-deblocage th{text-align:left;font-weight:500;padding:5px 18px 5px 0;
  font-size:14.5px;color:var(--encre-2)}
.recap-deblocage td{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;
  padding:5px 0;white-space:nowrap}
.recap-deblocage .recap-total th{color:var(--encre)}
.recap-deblocage .recap-total th,.recap-deblocage .recap-total td{
  border-top:1px solid var(--trait);padding-top:9px}
.demande-confirmer form{margin-top:12px}

/* ── Chiffres ─────────────────────────────────────────────────────────
   Charte : tous les chiffres en Inter 600, chasse fixe. La règle est déjà
   tenue au cas par cas dans interne.css ; elle est redite ici pour les
   tableaux ajoutés par les deux specs, où une colonne de montants qui ne
   s'aligne pas se relit trois fois.

   Elle vivait sous `body.espace-nuit` avant le passage au fond papier, et
   elle est tombée avec lui alors qu'elle ne devait rien à la couleur du
   fond. C'est le seul morceau de cette feuille qui a été remis. */
.registre td.nb,
.fiches-faits dd.nb{font-variant-numeric:tabular-nums;font-weight:600}
.registre td.secondaire{font-weight:400}
.fiches-faits dd.montant-ambre{font-weight:600}

/* ══════════════════════════════════════════════════════════════════════
   MISE EN ROUTE — le bloc de premier jour, en haut de l'écran Demandes.

   IL A L'AIR D'UNE CARTE, PAS D'UNE ALERTE. Le premier réflexe serait de le
   peindre en brique : il porte un blocage, la fiche n'est pas en ligne. Mais
   il reste affiché plusieurs jours, et une alerte qu'on voit tous les jours
   cesse d'être une alerte — elle devient du décor rouge qu'on apprend à
   sauter. Seule la LIGNE bloquante porte la brique, et seulement tant qu'elle
   est bloquante.

   Il disparaît de lui-même quand les quatre étapes sont faites. Aucune règle
   ici ne le masque : le masquage se décide en PHP, sur l'état réel, jamais
   sur une préférence d'affichage.
   ══════════════════════════════════════════════════════════════════════ */
.mise-en-route{background:var(--carte);border:1px solid var(--trait);
    border-radius:var(--r);padding:20px 22px;margin:0 0 18px}
.mise-en-route-tete{display:flex;align-items:baseline;justify-content:space-between;
    gap:14px;flex-wrap:wrap;margin-bottom:6px}
.mise-en-route-tete h2{margin:0}
.mise-en-route-compte{margin:0;font-size:13px;color:var(--encre-2)}
.mise-en-route-intro{color:var(--encre-2);max-width:74ch;margin:0 0 16px}

.mise-en-route-etapes{list-style:none;margin:0;padding:0;
    counter-reset:none}   /* la marque remplace la numérotation d'un <ol> */
.mise-en-route-etape{display:flex;gap:14px;align-items:flex-start;
    padding:14px 0;border-top:1px solid var(--trait)}
.mise-en-route-etape:first-child{border-top:0;padding-top:4px}

/* La marque : un caractère, jamais une image. Elle doit rester lisible en
   mode contraste élevé et chez qui bloque les polices d'icônes. */
.mise-en-route-marque{flex:0 0 auto;width:24px;height:24px;border-radius:999px;
    display:inline-flex;align-items:center;justify-content:center;
    font-size:14px;line-height:1;border:1px solid var(--trait);
    color:var(--encre-2);background:var(--papier);margin-top:2px}

.mise-en-route-corps{min-width:0}
.mise-en-route-corps h3{font-size:15.5px;margin:0 0 4px}
.mise-en-route-corps p{margin:0;color:var(--encre-2);max-width:74ch}
.mise-en-route-action{margin-top:10px !important}

/* Faite : la ligne s'efface sans disparaître. Elle reste lisible — une étape
   franchie qu'on ne peut plus relire laisse douter de l'avoir franchie. */
.mise-en-route-etape.est-faite .mise-en-route-marque{
    border-color:var(--cadastre);color:var(--cadastre);background:var(--voile)}
.mise-en-route-etape.est-faite h3{color:var(--encre-2);font-weight:500}

/* Bloquante : la seule ligne en brique de tout le bloc. Elle dit ce qui
   empêche de recevoir des demandes, et rien d'autre ne le dit. */
.mise-en-route-etape.est-bloquante .mise-en-route-marque{
    border-color:var(--brique);color:var(--brique);background:var(--brique-voile)}
.mise-en-route-etape.est-bloquante h3{color:var(--brique)}

@media (max-width:640px){
  .mise-en-route{padding:18px 16px}
  .mise-en-route-action .bouton{width:100%;text-align:center}
}

/* Suivi ne porte plus que DEUX cartes — transformation et coût par mandat.
   Les deux autres doublaient l'en-tête. Sans cette règle, la grille
   `auto-fit` les étirait chacune sur une demi-largeur d'écran, et deux
   chiffres de 28 px perdus dans 600 px se lisent comme une erreur de mise
   en page. */
.compteurs-duo{grid-template-columns:repeat(auto-fit,minmax(200px,340px))}