/* Espace client et écran d'Ethan — direction « Plaque » (comme le site) : fond gris clair, feuilles blanches, bleu émail,
   rouge seulement pour les impayés et les erreurs. Young Serif (titres), Source Sans 3 (texte), Barlow Condensed (chiffres).
   Toujours en clair (pas de thème sombre). Mobile d'abord. */
@font-face{font-family:"Young Serif";src:url("polices/young-serif-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("polices/source-sans-3-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("polices/source-sans-3-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("polices/source-sans-3-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("polices/barlow-condensed-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("polices/barlow-condensed-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  --fond:#F3F4F6;--feuille:#FFFFFF;--encre:#1C2433;--encre-douce:#2E3646;--gris:#5B6474;--filet:#D3D8E0;--bord:#8E98A8;
  --email:#1B3F8B;--email-fonce:#132E66;--email-clair:#E7ECF6;--email-pale:#8DA2C9;
  --rouge:#B42318;--rouge-clair:#FDECEA;
  --titre:"Young Serif",Georgia,"Times New Roman",serif;
  --texte:"Source Sans 3","Segoe UI",Arial,sans-serif;
  --plaque:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
body{margin:0;background:var(--fond);color:var(--encre);font:400 1.0625rem/1.5 var(--texte);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overflow-wrap:break-word;min-height:100vh}
img,svg{max-width:100%;display:block}
a{color:var(--email);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--email);outline-offset:3px}
h1,h2,h3{margin:0;text-wrap:balance}
h1{font:400 clamp(2rem,6.4vw,2.75rem)/1.08 var(--titre);letter-spacing:-.01em}
h2{font:400 1.5rem/1.15 var(--titre)}
h3{font:700 1.06rem/1.3 var(--texte)}
p{margin:0 0 .8em}
.visuellement-cache{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.evitement{position:absolute;left:16px;top:-120px;z-index:80;background:var(--encre);color:#fff;padding:12px 16px}
.evitement:focus{top:12px}
.page{width:min(1180px,100% - 32px);margin-inline:auto}
.etroit{width:min(600px,100% - 32px);margin-inline:auto}
@media (min-width:900px){.page{width:min(1180px,100% - 64px)}}
[hidden]{display:none!important}

/* Bandeau de maquette (démonstration seulement) */
.bandeau-maquette{background:var(--encre);color:#fff;font-size:.85rem;line-height:1.35;text-align:center;padding:7px 16px;margin:0}

/* En-tête : blanc côté client, bleu émail sur l'écran d'Ethan */
.barre{position:sticky;top:0;z-index:30;background:var(--feuille);border-bottom:1px solid var(--filet)}
.barre .page{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px}
.logo{display:inline-flex;align-items:center;gap:12px;color:var(--encre);text-decoration:none;min-height:44px;min-width:0}
.mini-plaque{display:inline-block;flex:none;background:var(--email);color:#fff;border-radius:5px;padding:3px}
.mini-plaque>span{display:block;border:1.5px solid #fff;border-radius:3px;font:600 16px/1 var(--plaque);letter-spacing:.02em;padding:5px 6px 4px}
.logo-mot{font:400 1.25rem/1.05 var(--titre);white-space:nowrap}
.logo-mot small{display:block;font:400 .82rem/1.2 var(--texte);color:var(--gris);margin-top:2px}
.barre-email{background:var(--email);border-bottom-color:var(--email-fonce)}
.barre-email .logo{color:#fff}
.barre-email .mini-plaque{background:transparent;padding:0}
.barre-email .lien-barre{color:#fff;font-weight:600}
.barre-droite{display:flex;align-items:center;gap:8px}
.lien-barre{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--encre);font-weight:600;font-size:.97rem}
.pastille-compte{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;min-width:44px;padding:0 4px;color:var(--encre);text-decoration:none;font-weight:600;font-size:.97rem}
.pastille-compte .initiale{display:grid;place-items:center;width:34px;height:34px;border-radius:4px;background:var(--email);color:#fff;font:600 1.05rem/1 var(--plaque)}
.pastille-compte .nom{max-width:16ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pastille-compte:hover .nom{text-decoration:underline}
.pastille-compte.texte{text-decoration:underline;text-underline-offset:3px}
@media (max-width:480px){.pastille-compte .nom{display:none}.logo-mot small{display:none}}
.icone-bouton{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:4px;border:1px solid var(--filet);background:var(--feuille);color:var(--encre);cursor:pointer;position:relative;text-decoration:none}
.icone-bouton svg{width:22px;height:22px}
.icone-bouton .compteur{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:3px;background:var(--email);color:#fff;font:600 .8rem/20px var(--plaque);text-align:center}

main{padding:8px 0 120px}
main:focus{outline:none}

/* Boutons : un geste, un bouton */
.bouton{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:4px;border:2px solid transparent;font:700 1.0625rem/1.2 var(--texte);text-decoration:none;cursor:pointer;transition:background-color .15s ease;text-align:center}
.bouton svg{width:20px;height:20px;flex:none}
.bouton-plein,.bouton-sapin{background:var(--email);color:#fff}
.bouton-plein:hover,.bouton-sapin:hover{background:var(--email-fonce)}
.bouton-contour{border-color:var(--email);color:var(--email);background:var(--feuille)}
.bouton-discret{background:var(--feuille);color:var(--encre);border:1px solid var(--bord)}
.bouton-discret:hover,.bouton-contour:hover{background:var(--email-clair)}
.bouton-large{width:100%}
.bouton[disabled],.bouton[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.bouton.charge{position:relative;color:transparent!important}
.bouton.charge::after{content:"";position:absolute;width:20px;height:20px;border-radius:50%;border:3px solid #fff;border-right-color:transparent;animation:tourne .7s linear infinite}
.bouton-discret.charge::after,.bouton-contour.charge::after,.mini-bouton.charge::after{border-color:var(--email);border-right-color:transparent}
@keyframes tourne{to{transform:rotate(360deg)}}
.boutons{display:flex;flex-wrap:wrap;gap:10px}
.lien-bouton{background:none;border:0;padding:0 2px;min-height:44px;font:inherit;color:var(--email);text-decoration:underline;text-underline-offset:3px;cursor:pointer;display:inline-flex;align-items:center}

/* Retour + titres de page */
.retour{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--encre);text-decoration:none;font-weight:600;margin:8px 0 0 -4px;padding:0 4px}
.retour:hover{text-decoration:underline}
.retour svg{width:18px;height:18px}
.tete-page{padding:26px 0 20px}
.tete-page p{color:var(--gris);margin:6px 0 0;font-size:1.06rem}
.tete-page .petit{margin:0 0 4px}

/* Feuilles blanches sur fond gris (pas de bordure, pas d'arrondi, pas d'ombre) */
.carte{background:var(--feuille);padding:20px 18px}
.carte + .carte{margin-top:20px}
.carte h2{margin-bottom:12px}
.pile{display:grid;gap:20px}
.deux-colonnes{display:grid;gap:20px}
@media (min-width:600px){.carte{padding:22px 24px}}
@media (min-width:900px){.deux-colonnes{grid-template-columns:1fr 1fr;align-items:start;gap:28px}.deux-colonnes.large-etroit{grid-template-columns:1.4fr 1fr}.pile{gap:28px}}

/* États : un mot, un petit carré de couleur (rouge = impayé) */
.statut{display:inline-flex;align-items:center;gap:8px;font-family:var(--texte);font-size:.95rem;font-weight:400;line-height:1.3;white-space:nowrap;color:var(--encre)}
.statut::before{content:"";flex:none;width:9px;height:9px;background:var(--filet)}
.ton-ok::before{background:var(--email)}
.ton-attente::before{background:var(--email-pale)}
.ton-alerte{color:var(--rouge);font-weight:700}
.ton-alerte::before{background:var(--rouge)}
.ton-neutre::before{background:var(--filet)}
h2 .statut,h1 .statut{margin-left:10px;vertical-align:4px}

/* Chiffres clés : une ligne, séparés par des filets */
.tuiles{display:grid;grid-template-columns:1fr 1fr;background:var(--feuille);border-top:4px solid var(--email);margin:0 0 24px}
.tuile{display:flex;flex-direction:column;gap:2px;min-height:108px;padding:16px 16px 14px;background:var(--feuille);color:var(--encre);text-decoration:none;border:0}
.tuile:nth-child(even){border-left:1px solid var(--filet)}
.tuile:nth-child(n+3){border-top:1px solid var(--filet)}
@media (min-width:900px){.tuiles{grid-template-columns:repeat(4,1fr)}.tuile{padding:18px 22px}.tuile+.tuile{border-left:1px solid var(--filet)}.tuile:nth-child(n+3){border-top:0}}
.tuile:hover{background:#F8F9FB}
.tuile .t-valeur{order:1;font:600 2.25rem/1.05 var(--plaque);letter-spacing:.01em}
.tuile .t-titre{order:2;font-size:.97rem;color:var(--encre)}
.tuile .t-titre svg{display:none}
.tuile .t-detail{order:3;font-size:.88rem;color:var(--gris)}
.tuile.t-alerte .t-valeur{color:var(--rouge)}

/* Liste de liens (le reste du tableau de bord) */
.liste-liens{list-style:none;margin:0;padding:0 18px;background:var(--feuille)}
@media (min-width:600px){.liste-liens{padding:0 24px}}
.liste-liens li + li{border-top:1px solid var(--filet)}
.liste-liens a,.liste-liens button{display:flex;align-items:center;gap:14px;width:100%;min-height:62px;padding:12px 0;color:var(--encre);text-decoration:none;background:none;border:0;font:inherit;text-align:left;cursor:pointer}
.liste-liens a:hover strong{text-decoration:underline}
.liste-liens .ic{display:none}
.liste-liens .txt{flex:1;min-width:0}
.liste-liens .txt strong{display:block;font-weight:600}
.liste-liens .txt span{display:block;font-size:.92rem;color:var(--gris)}
.liste-liens .chevron{flex:none;width:18px;height:18px;color:var(--email)}
.section-titre{font:400 1.5rem/1.15 var(--titre);margin:32px 0 12px}

/* Alertes : impayé (rouge), information (bleu) */
.alerte{background:var(--feuille);border-left:4px solid var(--rouge);padding:18px 18px 20px;margin:0 0 20px}
.alerte h2{font:700 1.15rem/1.3 var(--texte);margin-bottom:8px;color:var(--rouge)}
.alerte h2 svg{display:none}
.alerte-info{border-left-color:var(--email)}
.alerte-info h2{color:var(--encre)}
p.alerte{font-size:.97rem}
.frise{list-style:none;margin:12px 0 16px;padding:0;display:grid;gap:0}
.frise li{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:baseline;padding:8px 0;border-top:1px solid var(--filet);font-size:.97rem}
.frise .quand{font-weight:700;color:var(--gris)}
.frise li.passe .quand{color:var(--encre)}
.alerte .frise li.passe .quand{color:var(--rouge)}

/* Formulaires */
.champ{display:grid;gap:6px;margin:0 0 16px}
.champ label,.champ .etiquette{font-weight:600;font-size:.97rem}
.champ .aide{font-size:.88rem;color:var(--gris);margin:0}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=number],input[type=time],input[type=search],input[type=url],textarea{width:100%;min-height:48px;padding:11px 14px;border-radius:4px;border:1px solid var(--bord);background:var(--feuille);color:var(--encre);font:inherit;font-size:1.0625rem}
textarea{min-height:110px;resize:vertical;line-height:1.45}
input:focus-visible,textarea:focus-visible{outline:3px solid var(--email);outline-offset:1px;border-color:var(--email)}
input[aria-invalid=true],textarea[aria-invalid=true]{border:2px solid var(--rouge)}
.erreur{color:var(--rouge);background:var(--rouge-clair);border-left:4px solid var(--rouge);padding:9px 12px;font-size:.95rem;font-weight:600;margin:0 0 12px}
.reussite{color:var(--encre);background:var(--email-clair);border-left:4px solid var(--email);padding:9px 12px;font-size:.95rem;font-weight:600;margin:0 0 12px}
.case{display:flex;gap:12px;align-items:flex-start;min-height:44px;padding:8px 0;cursor:pointer;font-size:1rem}
.case input{width:22px;height:22px;flex:none;margin:1px 0 0;accent-color:var(--email)}
fieldset{border:0;margin:0 0 16px;padding:0;min-width:0}
legend{font-weight:600;padding:0;margin:0 0 8px}

/* Onglets (texte souligné, jamais de menu déroulant) */
.segments{display:flex;gap:4px;border-bottom:1px solid var(--filet);margin:0 0 20px}
.segments button{min-height:46px;padding:0 12px;margin-bottom:-1px;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--gris);font:600 1rem var(--texte);cursor:pointer}
.segments button:first-child{padding-left:0}
.segments button[aria-selected=true]{color:var(--email);border-bottom-color:var(--email)}

/* Choix en lignes (domaines, moyens de paiement) */
.choix{display:grid;border:1px solid var(--bord);border-radius:4px;background:var(--feuille)}
.choix label{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:2px 12px;align-items:center;padding:14px 16px;cursor:pointer;min-height:60px}
.choix label+label{border-top:1px solid var(--filet)}
.choix label:has(input:checked){background:var(--email-clair);box-shadow:inset 4px 0 0 var(--email)}
.choix label:has(input:focus-visible){outline:3px solid var(--email);outline-offset:-3px}
.choix label:has(input:disabled){cursor:not-allowed;color:var(--gris)}
.choix input{width:20px;height:20px;margin:0;accent-color:var(--email)}
.choix .c-nom{font-weight:600}
.choix .c-prix{text-align:right;white-space:nowrap}
.choix .c-detail{grid-column:2 / 4;font-size:.9rem;color:var(--gris)}
.choix .badge-offre{margin-left:6px;font-size:.9rem;font-weight:600;color:var(--email)}

/* Boutons côte à côte (une seule réponse ou plusieurs) : remplacent les pastilles */
.puces{display:flex;flex-wrap:wrap;gap:1px;background:var(--bord);border:1px solid var(--bord);border-radius:4px;overflow:hidden}
.puce{position:relative;flex:1 1 auto;display:flex;align-items:center;justify-content:center;min-height:48px;padding:8px 14px;background:var(--feuille);color:var(--encre);cursor:pointer;font-weight:600;font-size:.97rem;text-align:center;user-select:none;-webkit-user-select:none}
.puce input{position:absolute;opacity:0;width:1px;height:1px}
.puce:hover{background:#F8F9FB}
.puce:has(input:checked){background:var(--email);color:#fff}
.puce:has(input:focus-visible){outline:3px solid var(--email);outline-offset:-5px;box-shadow:inset 0 0 0 5px #fff}
/* Filtres de l'écran d'Ethan : texte souligné */
.filtres{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:0 2px;border-bottom:1px solid var(--filet);margin:0 0 4px}
.filtres .puce{flex:none;min-height:44px;padding:0 8px;font-size:.95rem;background:none;border-bottom:3px solid transparent;margin-bottom:-1px;color:var(--gris)}
.filtres .puce:first-child{padding-left:0}
.filtres .puce:hover{background:none;color:var(--encre)}
.filtres .puce:has(input:checked){background:none;color:var(--email);border-bottom-color:var(--email)}
.filtres .puce:has(input:focus-visible){outline:3px solid var(--email);outline-offset:-3px;box-shadow:none}

/* Interrupteurs */
.interrupteur{display:flex;align-items:center;gap:12px;min-height:48px;width:100%;padding:8px 0;background:none;border:0;color:var(--encre);font:inherit;text-align:left;cursor:pointer}
.interrupteur .piste{flex:none;width:50px;height:30px;border-radius:15px;background:var(--bord);position:relative;transition:background-color .15s}
.interrupteur .piste::after{content:"";position:absolute;top:4px;left:4px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .15s}
.interrupteur[aria-checked=true] .piste{background:var(--email)}
.interrupteur[aria-checked=true] .piste::after{transform:translateX(20px)}
.interrupteur .lib{flex:1}
.interrupteur .lib small{display:block;color:var(--gris);font-size:.88rem}

/* Récapitulatif du devis */
.recap{list-style:none;margin:0;padding:0}
.recap li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--filet)}
.recap li span:last-child{font-weight:600;white-space:nowrap;text-align:right}
.total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:16px 0 6px}
.total strong{font:600 2.5rem/1 var(--plaque);color:var(--encre)}
.petit{font-size:.9rem;color:var(--gris)}
.mot-ethan{background:var(--feuille);border-left:4px solid var(--email);padding:14px 18px;margin:0 0 20px;font-size:1.06rem;color:var(--encre-douce)}
.mot-ethan p{margin:0}
.mot-ethan p::before{content:"Ethan : ";font-weight:700;color:var(--encre)}
.avatar-e{display:none}

/* Progression */
.progression{height:8px;background:var(--fond);overflow:hidden}
.progression span{display:block;height:100%;background:var(--email);transition:width .3s ease}
.etapes-demarrage{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--filet)}
.etapes-demarrage li{border-bottom:1px solid var(--filet)}
.etapes-demarrage a,.etapes-demarrage .verrouille{display:flex;align-items:center;gap:14px;min-height:66px;padding:10px 0;color:var(--encre);text-decoration:none}
.etapes-demarrage a:hover strong{text-decoration:underline}
.etapes-demarrage .prochaine a{box-shadow:inset 4px 0 0 var(--email);padding-left:14px}
.puce-etape{flex:none;display:grid;place-items:center;width:34px;height:34px;border:1.5px solid var(--bord);border-radius:4px;font:600 1.15rem/1 var(--plaque)}
.fait .puce-etape{background:var(--email);border-color:var(--email);color:#fff}
.puce-etape svg{width:18px;height:18px}
.etapes-demarrage .txt{flex:1;min-width:0}
.etapes-demarrage .txt strong{display:block;font-weight:600}
.etapes-demarrage .txt span{display:block}
.etapes-demarrage .verrouille{color:var(--gris)}
.etapes-demarrage .verrouille svg:last-child{width:18px;height:18px;flex:none;color:var(--gris)}

/* Photos */
.depot{position:relative;display:grid;place-items:center;gap:4px;min-height:130px;padding:18px;border:1.5px dashed var(--bord);border-radius:4px;background:var(--fond);text-align:center;cursor:pointer}
.depot:hover{border-color:var(--email)}
.depot:has(input:focus-visible){outline:3px solid var(--email);outline-offset:3px}
.depot input{position:absolute;opacity:0;width:1px;height:1px}
.depot svg{width:28px;height:28px;color:var(--email)}
.vignettes{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;list-style:none;margin:12px 0 0;padding:0}
.vignettes li{position:relative;aspect-ratio:1;overflow:hidden;background:var(--fond);display:grid;place-items:center;font-size:.75rem;color:var(--gris);text-align:center;padding:4px}
.vignettes img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vignettes .retirer{position:absolute;top:4px;right:4px;width:44px;height:44px;border-radius:4px;border:0;background:rgba(28,36,51,.75);color:#fff;cursor:pointer;display:grid;place-items:center}
.vignettes .retirer svg{width:18px;height:18px}

/* Horaires */
.semaine{list-style:none;margin:0;padding:0 18px;background:var(--feuille)}
@media (min-width:600px){.semaine{padding:0 24px}}
.jour-ligne{display:grid;gap:8px;padding:12px 0}
.jour-ligne+.jour-ligne{border-top:1px solid var(--filet)}
.jour-ligne .entete-jour{display:flex;align-items:center;justify-content:space-between;gap:10px}
.jour-ligne .entete-jour strong{min-width:90px;font-weight:600}
.plages{display:grid;gap:8px}
.plage{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.plage input[type=time]{width:auto;min-width:118px;flex:1}
.plage .a{color:var(--gris)}
.mini-bouton{position:relative;min-height:44px;min-width:44px;padding:0 12px;border-radius:4px;border:1px solid var(--bord);background:var(--feuille);color:var(--encre);font:600 .95rem var(--texte);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;white-space:nowrap}
.mini-bouton:hover{background:var(--email-clair)}
.mini-bouton svg{width:16px;height:16px}
.mini-bouton.danger{color:var(--rouge);border-color:var(--rouge)}
.apercu-horaires{list-style:none;margin:0;padding:0;font-size:.97rem}
.apercu-horaires li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px dotted var(--filet)}
.apercu-horaires li.auj{font-weight:700}

/* Fils de messages */
.fil{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:10px}
.bulle{max-width:85%;padding:10px 14px;border-radius:6px;background:var(--feuille);border:1px solid var(--filet);font-size:1rem}
.bulle .quand{display:block;font-size:.8rem;color:var(--gris);margin-top:4px}
.bulle.moi{justify-self:end;background:var(--email);border-color:var(--email);color:#fff}
.bulle.moi .quand{color:#fff;opacity:1}
.bulle.lui{background:var(--fond);border-color:var(--fond)}
.bulle.systeme{justify-self:center;background:none;border:0;font-size:.88rem;color:var(--gris);text-align:center;padding:2px 8px}
.saisie{display:flex;gap:8px;align-items:flex-end}
.saisie textarea{min-height:52px;height:52px}

/* Demandes */
.demandes{list-style:none;margin:0;padding:0 18px;background:var(--feuille)}
@media (min-width:600px){.demandes{padding:0 24px}}
.demandes li+li{border-top:1px solid var(--filet)}
.demandes a{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;padding:14px 0;color:var(--encre);text-decoration:none;min-height:62px}
.demandes a:hover strong{text-decoration:underline}
.demandes strong{font-weight:600}
.demandes .petit{grid-column:1 / -1}
.suivi{list-style:none;display:flex;margin:6px 0 18px;padding:0;gap:0}
.suivi li{flex:1;text-align:center;font-size:.9rem;font-weight:600;color:var(--gris);position:relative;padding-top:24px}
.suivi li::before{content:"";position:absolute;top:4px;left:50%;transform:translateX(-50%);width:14px;height:14px;border:2px solid var(--bord);background:var(--feuille);z-index:1}
.suivi li::after{content:"";position:absolute;top:10px;left:-50%;width:100%;height:2px;background:var(--filet)}
.suivi li:first-child::after{display:none}
.suivi li.atteint{color:var(--encre)}
.suivi li.atteint::before{background:var(--email);border-color:var(--email)}
.suivi li.atteint::after{background:var(--email)}

/* Aperçu du site */
.apercu-site{display:grid;gap:20px;align-items:start}
@media (min-width:760px){.apercu-site{grid-template-columns:260px 1fr}}
.cadre-tel{width:min(240px,70vw);margin-inline:auto;border-radius:28px;border:8px solid var(--encre);overflow:hidden;background:#000;position:relative}
.cadre-tel img{width:100%}
.cadre-tel.suspendu img{filter:grayscale(1) opacity(.35)}
.cadre-tel .voile{position:absolute;inset:0;display:grid;place-items:center;padding:16px;text-align:center;color:#fff;font-weight:700;background:rgba(28,36,51,.6)}
.chiffres{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);margin:0 0 14px}
.chiffres div{padding:12px 12px 10px}
.chiffres div:first-child{padding-left:0}
.chiffres div+div{border-left:1px solid var(--filet)}
.chiffres strong{display:block;font:600 2rem/1.05 var(--plaque)}
.chiffres span{font-size:.88rem;color:var(--gris)}
.barres{display:flex;align-items:flex-end;gap:3px;height:110px;padding:0 0 4px;border-bottom:1px solid var(--filet)}
.barres span{flex:1;background:var(--email-pale);min-height:2px}
.barres span.auj{background:var(--email)}
.axe-barres{display:flex;justify-content:space-between;font-size:.8rem;color:var(--gris);margin-top:4px}
/* Avis Google : scans par mois, écart entre deux relevés */
.barres-mois{gap:12px;height:90px}
.axe-mois{display:flex;gap:12px;font-size:.82rem;line-height:1.25;color:var(--gris);margin-top:4px}
.axe-mois span{flex:1;text-align:center}
.lignes .ecart{flex:none;font:600 1.15rem/1 var(--plaque);color:var(--email)}
/* Changement express : aperçu du bloc tel que le portier l'ajoute en haut du site (même HTML : BV.blocExpress) */
.apercu-express{border:1px solid var(--filet);background:var(--feuille);margin:10px 0 4px}
.apercu-express .bv-express-in{padding:14px 16px;display:grid;gap:12px}
.apercu-express .bv-express-ligne{margin:0;display:grid;gap:2px;font-size:1.05rem;line-height:1.4}
.apercu-express .bv-express-ligne strong{font:600 .9rem/1.1 var(--plaque);letter-spacing:.08em;text-transform:uppercase;color:var(--email)}
.apercu-express .bv-express-ligne small{font-size:.9rem;color:var(--gris)}
.apercu-vide{margin:0;padding:14px 16px;color:var(--gris)}
.apercu-bandeau{margin:8px 0;padding:10px 12px;text-align:center;font-weight:700;background:var(--encre);color:#fff}

/* Listes simples */
.lignes{list-style:none;margin:0;padding:0}
.lignes li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--filet);min-height:56px}
.lignes li:last-child{border-bottom:0}
.lignes .gauche{min-width:0}
.lignes .gauche strong{display:block;font-weight:600}
.lignes .gauche span{font-size:.92rem;color:var(--gris)}
.coches{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.coches li{display:flex;gap:10px;align-items:flex-start}
.coches svg{flex:none;width:20px;height:20px;margin-top:2px}
.coches .oui svg{color:var(--email)} .coches .non svg{color:var(--gris)}

/* Rendez-vous et appels */
.ruban{display:flex;gap:6px;overflow-x:auto;padding:2px 2px 8px;margin:0 0 12px;scrollbar-width:thin}
.ruban button{flex:none;display:grid;justify-items:center;min-width:56px;min-height:64px;padding:6px 8px;border-radius:4px;border:1px solid var(--bord);background:var(--feuille);color:var(--encre);font:inherit;cursor:pointer}
.ruban button small{font-size:.78rem;color:var(--gris)}
.ruban button strong{font:600 1.3rem/1.1 var(--plaque)}
.ruban button[aria-pressed=true]{border-color:var(--email);background:var(--email);color:#fff}
.ruban button[aria-pressed=true] small,.ruban button[aria-pressed=true] .nb{color:#fff}
.ruban button .nb{font-size:.72rem;color:var(--gris)}
.rdv{list-style:none;margin:0;padding:0 18px;background:var(--feuille)}
.rdv li{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:12px 0}
.rdv li+li{border-top:1px solid var(--filet)}
.rdv .heure{font:600 1.3rem/1.1 var(--plaque)}
.rdv .heure small{display:block;font:400 .8rem var(--texte);color:var(--gris)}
.rdv .meta{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:6px;align-items:center}
.rdv li.annule{opacity:.6}
.rdv li.annule .quoi{text-decoration:line-through}
.transcription{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px;font-size:.95rem}
.transcription li{padding:8px 10px;background:var(--fond)}
.transcription li.ia{background:var(--email-clair)}
details.depliant{border-top:1px solid var(--filet);margin-top:10px}
details.depliant summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600;color:var(--email)}
details.carte.depliant{border-top:0;margin-top:0}
details.carte.depliant summary{font:400 1.25rem/1.2 var(--titre);color:var(--encre)}
.pile>details.carte.depliant,.pile>.carte,.deux-colonnes>.carte{margin-top:0}

/* Factures */
.facture-feuille{background:#fff;color:var(--encre);padding:28px;max-width:720px}
.facture-feuille table{width:100%;border-collapse:collapse;margin:16px 0}
.facture-feuille th,.facture-feuille td{text-align:left;padding:8px;border-bottom:1px solid var(--filet)}
.facture-feuille td:last-child,.facture-feuille th:last-child{text-align:right}
.facture-feuille .petit{color:var(--gris)}
@media print{.bandeau-maquette,.barre,.ne-pas-imprimer,.bouton-demo{display:none!important}body{background:#fff}main{padding:0}}

/* Écran « Stripe » simulé (démonstration) */
.stripe-simule{background:var(--feuille)}
.stripe-simule .s-tete{background:#635bff;color:#fff;padding:12px 16px;font-weight:700;display:flex;justify-content:space-between;gap:8px;font-size:.95rem}
.stripe-simule .s-corps{padding:18px}
.moyens{margin:0 0 14px}

/* E-mails simulés (démonstration) */
.boite{margin-top:20px;border:1.5px dashed var(--bord);padding:14px;background:var(--feuille)}
.boite h2{font:700 1rem var(--texte);display:flex;align-items:center;gap:8px}
.boite h2 svg{display:none}
.courriel{background:var(--fond);padding:14px;margin-top:10px}
.courriel .de{font-size:.85rem;color:var(--gris)}
.courriel h3{margin:4px 0 8px}

/* Notification */
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);opacity:0;pointer-events:none;z-index:90;max-width:min(520px,calc(100% - 32px));background:var(--encre);color:#fff;padding:12px 18px;border-radius:4px;font-weight:600;transition:opacity .2s,transform .2s}
.toast.visible{opacity:1;transform:translate(-50%,0)}

/* Fenêtres (dialog natif, jamais alert/confirm) */
dialog{border:0;border-top:4px solid var(--email);border-radius:0;padding:0;max-width:min(480px,calc(100% - 32px));width:100%;background:var(--feuille);color:var(--encre);box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
dialog::backdrop{background:rgba(28,36,51,.55)}
dialog .d-corps{padding:22px}
dialog h2{margin-bottom:10px}

/* Bouton et panneau de démonstration */
.bouton-demo{position:fixed;left:12px;bottom:12px;z-index:70;min-height:44px;padding:8px 14px;border-radius:4px;border:0;background:var(--encre);color:#fff;font:600 .9rem var(--texte);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.bouton-demo svg{width:18px;height:18px}
.scenarios{display:grid;border-top:1px solid var(--filet)}
.scenarios button{display:block;width:100%;text-align:left;min-height:52px;padding:10px 0;border:0;border-bottom:1px solid var(--filet);background:none;color:var(--encre);font:inherit;cursor:pointer}
.scenarios button:hover strong{text-decoration:underline}
.scenarios button small{display:block;color:var(--gris);font-size:.88rem}

/* Écran d'Ethan */
.admin-grille{display:grid;gap:20px}
@media (min-width:1000px){.admin-grille{grid-template-columns:440px 1fr;align-items:start;gap:28px}.admin-grille .bloc-clients{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow:auto}}
.liste-clients{list-style:none;margin:0;padding:0}
.liste-clients li+li{border-top:1px solid var(--filet)}
.liste-clients a{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center;padding:12px 0;color:var(--encre);text-decoration:none;min-height:62px}
.liste-clients a strong{font-weight:600;font-size:1.06rem}
.liste-clients a:hover strong{text-decoration:underline}
.liste-clients a[aria-current=true]{box-shadow:inset 4px 0 0 var(--email);padding-left:14px;background:var(--email-clair);margin:0 -18px;padding-right:18px}
.liste-clients .petit{grid-column:1 / -1}
.liste-clients .vide{padding:14px 0;color:var(--gris)}
.code{font-family:ui-monospace,Consolas,monospace;font-size:.85rem;background:var(--fond);padding:12px;overflow:auto;max-height:320px;white-space:pre-wrap}
.calcul{list-style:none;margin:0;padding:0}
.calcul li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--filet);font-size:.97rem}
.calcul li:last-child{border-bottom:0}
.marge-haut{margin-top:16px}
.marge-bas{margin-bottom:16px}
.interrupteur-court{width:auto;min-width:44px;flex:none}
.interrupteur-court .lib{font-weight:600;font-size:.95rem;text-align:right}
button.tuile{font:inherit;text-align:left;cursor:pointer;width:100%}
.chevron{width:18px;height:18px;flex:none;color:var(--email)}
h1:focus,[tabindex="-1"]:focus{outline:none}
.admin-grille > *,.pile > *,.deux-colonnes > *{min-width:0}
.export{margin:28px 0 0;font-size:.92rem;color:var(--gris)}
.export .lien-bouton{color:var(--gris);font-size:.92rem}

/* ===== Vrai service (reel.js, admin-reel.js) ===== */
.progression .indetermine{width:35%;animation:bv-va-vient 1.4s ease-in-out infinite alternate}
@keyframes bv-va-vient{from{transform:translateX(-10%)}to{transform:translateX(200%)}}
@media (prefers-reduced-motion:reduce){.progression .indetermine{animation:none;width:100%;opacity:.5}}
.lignes-simples{list-style:none;margin:0;padding:0}
.lignes-simples>li{padding:14px 0;border-bottom:1px solid var(--filet)}
.lignes-simples>li:last-child{border-bottom:0}
.lignes-simples p{margin-bottom:4px}
code{overflow-wrap:anywhere}

/* « À faire » de l'écran d'Ethan */
.lignes-liens{list-style:none;margin:0;padding:0}
.lignes-liens li+li{border-top:1px solid var(--filet)}
.lignes-liens a{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:60px;padding:11px 0;color:var(--encre);text-decoration:none}
.lignes-liens .txt{min-width:0}
.lignes-liens strong{display:block;font-weight:600}
.lignes-liens .txt span{display:block;font-size:.95rem;color:var(--gris)}
.lignes-liens .urgent .txt span{color:var(--rouge);font-weight:600}
.lignes-liens .ouvrir{flex:none;font-weight:700;font-size:.95rem;color:var(--email);text-decoration:underline;text-underline-offset:3px}
.lignes-liens a:hover .ouvrir{text-decoration-thickness:2px}
@media (max-width:999px){.admin-grille>.pile{order:-1}}

/* Réponses du 2e écran « Pour un devis juste » (écran d'Ethan) : liste question / réponse, sans décor */
.precisions{margin-top:6px}
.lignes .gauche .precisions summary{font-size:.92rem}
.reponses{display:grid;gap:0;margin:8px 0 0;border-top:1px solid var(--filet)}
.reponses div{display:grid;grid-template-columns:minmax(9rem,1fr) 1.4fr;gap:4px 12px;padding:7px 0;border-bottom:1px solid var(--filet);font-size:.94rem}
.reponses dt{color:var(--gris)}
.reponses dd{margin:0;font-weight:600;color:var(--encre);overflow-wrap:anywhere}
@media (max-width:480px){.reponses div{grid-template-columns:1fr}}

/* Calendrier de rendez-vous (page du commerçant, écran d'Ethan) : jours et heures en boutons côte à côte */
.jours-rdv .puce{flex:1 1 7.5rem}
.heures-rdv .puce{flex:1 1 5rem}
.rdv-quand{font-size:1.5rem;margin:0}
.rdv-carte p{margin:8px 0 0}
.squelette{color:var(--gris)}
.dispo-jours{display:grid;border-top:1px solid var(--filet)}
.dispo-jour{display:grid;grid-template-columns:7rem 1fr;gap:8px 12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--filet)}
.dispo-jour .plages{display:flex;flex-wrap:wrap;gap:8px 18px}
.dispo-jour .plage{display:flex;align-items:center;gap:6px}
.dispo-jour input[type=time],.ligne-ajout input{min-height:44px;padding:6px 8px;border:1px solid var(--bord);border-radius:4px;font:inherit;background:var(--feuille);color:var(--encre)}
@media (max-width:520px){.dispo-jour{grid-template-columns:1fr}}
.ligne-ajout{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end}
.ligne-ajout label{display:grid;gap:4px;font-weight:600;font-size:.92rem}
.lignes .gauche .rdv-ligne{display:block;color:var(--email);font-weight:600}

/* Lien privé de la maquette (maquette.html) : barre fine, la maquette prend tout le reste ; téléphone = plein écran */
.visionneuse{display:flex;flex-direction:column;height:100vh;height:100dvh;min-height:0;overflow:hidden}
.vis-barre{display:flex;align-items:center;gap:12px 16px;padding:8px 16px;background:var(--feuille);border-bottom:1px solid var(--filet);flex:none}
.vis-titre{margin:0;min-width:0;flex:1 1 auto;line-height:1.25}
.vis-titre h1{display:block;margin:0;font:400 1.15rem/1.2 var(--titre);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vis-titre span{display:block;font-size:.88rem;color:var(--gris)}
.vis-actions{display:flex;align-items:center;gap:12px;flex:none}
.vis-bascule{border:0;margin:0;padding:0;min-width:0}
.vis-bascule .puce{min-height:44px;padding:6px 14px}
.vis-scene{position:relative;flex:1 1 auto;min-height:0;display:flex;background:var(--fond)}
.vis-scene:focus{outline:none}
.vis-attente{margin:auto;color:var(--gris)}
.vis-cadre{position:absolute;inset:0;display:flex;justify-content:center}
.vis-cadre iframe{display:block;border:0;width:100%;height:100%;background:#fff}
.vis-scene[data-vue=telephone] .vis-cadre{padding:24px 16px;overflow:auto}
.vis-scene[data-vue=telephone] iframe{width:390px;max-width:100%;height:min(844px,100%);border:1px solid var(--bord);flex:none}
.visionneuse.vis-erreur{display:block;overflow:auto}
.visionneuse.vis-erreur .vis-scene{display:block;padding:32px 16px}
@media (max-width:699px){
  .vis-barre{padding:6px 12px;gap:10px}
  .vis-barre .mini-plaque,.vis-bascule{display:none}
  .vis-titre h1{font-size:1rem}
  .vis-titre span{font-size:.8rem}
  .vis-actions .bouton{min-height:44px;padding:8px 14px;font-size:.95rem}
}
/* Inscription libre : champ piège hors de l'écran (les robots le remplissent, les personnes ne le voient pas) */
.piege{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
/* Écran d'Ethan : lien privé de la maquette (bouton « dossier », lien neuf à copier une fois) */
.boutons-ligne{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;flex:none}
.bouton-fichier{cursor:pointer}
.bouton-fichier:has(input:focus-visible){outline:3px solid var(--email);outline-offset:3px}
.lien-neuf{border-left:4px solid var(--email);background:var(--email-clair);padding:12px 14px;margin:0 0 12px}
.lien-neuf p{margin:0}
.lien-neuf .petit{margin-top:4px}
.ligne-lien{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:8px!important}
.ligne-lien code{flex:1 1 16rem;min-width:0;background:var(--feuille);border:1px solid var(--filet);padding:8px 10px;font-size:.85rem}
@media (max-width:520px){.lignes li:has(.boutons-ligne){flex-wrap:wrap}.boutons-ligne{justify-content:flex-start}}
/* Signature du devis sur place (signer.html, téléphone d'Ethan tendu au commerçant) : cadre blanc, trait d'encre, ligne de base */
.signer .logo{cursor:default}
.cadre-signature{position:relative;background:var(--feuille);border:1px solid var(--bord);border-top:4px solid var(--email)}
.cadre-signature canvas{display:block;width:100%;height:210px;touch-action:none;cursor:crosshair}
.cadre-signature canvas:focus-visible{outline:3px solid var(--email);outline-offset:2px}
.ligne-signature{position:absolute;left:18px;right:18px;bottom:44px;border-bottom:1px solid var(--filet);pointer-events:none}
.sous-cadre{display:flex;align-items:center;justify-content:space-between;gap:12px}
.signer .rendre{margin-top:20px;background:transparent;padding-inline:0}
.signer .rendre h2{font:600 1rem/1.3 var(--texte);color:var(--gris);margin-bottom:8px}
@media (min-width:900px){.cadre-signature canvas{height:240px}}
/* Écran d'Ethan : code de retour du mode signature, en gros chiffres */
.code-retour{font:600 3rem/1 var(--plaque);letter-spacing:.35em;margin:8px 0 12px}
/* Bilan mensuel (#/bilan) : la comparaison au mois d'avant, sous chaque chiffre */
.chiffres .evolution{display:block;margin-top:4px;font-size:.82rem;color:var(--encre-douce)}

/* « Ma carte », « Mes prestations »… (metier-ecran.js) : listes éditables, téléphone d'abord. Filets, pas de cartes arrondies. */
.me-page{padding-bottom:8px}
.me-etat{margin:0 0 16px;color:var(--gris);font-size:.95rem}
.me-cat{border-top:2px solid var(--encre);padding-top:12px;margin-top:20px}
.me-cat:first-of-type{margin-top:8px}
.me-cat-tete,.me-ligne-tete{display:flex;align-items:flex-end;gap:8px}
.me-nom{flex:1 1 auto;min-width:0;margin:0}
.me-cat-nom{font:400 1.2rem/1.2 var(--titre)}
.me-outils{display:inline-flex;gap:4px;flex:none}
.me-outils .mini-bouton{padding:0 10px}
.me-outils .mini-bouton[disabled]{opacity:.35;cursor:default;background:var(--feuille)}
.me-lignes{list-style:none;margin:8px 0 0;padding:0}
.me-ligne{padding:14px 0;border-bottom:1px solid var(--filet)}
.me-ligne .champ{margin:0}
.me-ligne label{font-size:.88rem}
.me-chiffres{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:8px}
.me-chiffres .champ{flex:1 1 180px}
.me-chiffres .me-court{flex:1 1 96px;max-width:150px}
.me-court input{font-variant-numeric:tabular-nums}
.me-plus{margin-top:6px}
.me-plus summary{min-height:44px;display:flex;align-items:center;gap:4px;cursor:pointer;font-weight:600;color:var(--email);font-size:.95rem}
.me-plus[open] summary{margin-bottom:6px}
.me-plus .champ{margin:0 0 10px}
.me-groupe{border:0;margin:10px 0 0;padding:0;min-width:0}
.me-groupe legend{font-weight:600;font-size:.95rem;padding:0;margin-bottom:2px}
.me-cases{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0 12px}
.me-cases .case{padding:6px 0;font-size:.97rem}
.me-ajout{margin-top:10px}
.me-nouvelle{margin-top:24px;padding-top:14px;border-top:1px solid var(--filet)}
.me-nouvelle .etiquette{font-weight:600;margin:0 0 8px}
.me-suggestions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.me-libre{display:flex;gap:8px}
.me-libre input{flex:1 1 auto;min-width:0}
.me-court-texte{min-height:88px}
.me-petites .me-ligne{padding:10px 0}
.carte > .champ + .case,.carte > .case + .case,.carte > .case + .champ{margin-top:2px}
.me-erreurs{margin:16px 0 0;padding:12px 16px;list-style:none;background:var(--rouge-clair);border-left:4px solid var(--rouge)}
.me-barre{position:sticky;bottom:0;z-index:5;margin-top:20px;padding:12px 0 calc(12px + env(safe-area-inset-bottom));background:var(--fond);border-top:1px solid var(--filet);display:grid;gap:8px}
.me-barre p{margin:0}
.me-barre .boutons{margin:0}
@media (min-width:600px){.me-barre{grid-template-columns:1fr auto;align-items:center}.me-barre .bouton-large{width:auto}}.me-depot{min-height:84px;padding:12px}
/* Site multilingue (fiche d'Ethan) : les 3 étapes */
.etapes-courtes{margin:8px 0 0;padding-left:1.4em}
.etapes-courtes li{margin:6px 0}
/* Bilan annuel : la proposition, filet bleu en tête (pas une carte arrondie de plus) */
.carte-proposition{border-top:3px solid var(--email)}
.surtitre-plaque{margin:0 0 6px;font:600 .95rem/1 var(--plaque);letter-spacing:.08em;text-transform:uppercase;color:var(--email)}

/* Carte de suivi (écran d'Ethan, #/carte, carte-suivi.js) : MapLibre + OpenFreeMap repeint aux couleurs B. La couleur d'un point dit
   son statut (légende = filtres) ; rien d'autre de décoratif. Téléphone : carte sur toute la largeur, fiche en bas de l'écran. */
:root{--st-gris:#8E98A8;--st-jaune:#E9B200;--st-bleu-clair:#7FA3E6;--st-orange:#E5770F;--st-vert:#2E9C50;--st-vert-fonce:#14532D;--st-rouge-pale:#F3B9B3}
@media (max-width:480px){.lien-secondaire{display:none}}
.carte-page{width:min(1400px,100% - 32px);margin-inline:auto}
@media (min-width:900px){.carte-page{width:min(1400px,100% - 64px)}}
.carte-tete{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 20px;padding:18px 0 14px}
.carte-tete h1{font-size:clamp(1.7rem,4vw,2.35rem)}
.carte-resume{margin:4px 0 0;color:var(--gris);font-size:.97rem}
.carte-tete .bouton{flex:none}
.legende{display:flex;flex-wrap:wrap;background:var(--feuille);border-top:4px solid var(--email);border-bottom:1px solid var(--filet)}
.leg{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:0;border-right:1px solid var(--filet);background:var(--feuille);color:var(--encre);font:600 .93rem/1.2 var(--texte);cursor:pointer;white-space:nowrap}
.leg:hover{background:#F8F9FB}
.leg:focus-visible{outline:3px solid var(--email);outline-offset:-3px}
.leg[aria-pressed=false]{color:var(--gris);font-weight:400}
.leg[aria-pressed=false] .pt-rond{opacity:.3}
.leg-n{font:600 1rem/1 var(--plaque);color:var(--gris)}
.carte-grille{display:grid;gap:20px}
@media (min-width:900px){.carte-grille{grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start}}
.carte-zone{position:relative}
.carte-hote{position:relative;height:calc(100vh - 240px);height:calc(100dvh - 240px);min-height:520px;background:#F4F5F7;overflow:hidden}
.carte-hote>.carte-fond{position:absolute;inset:0;width:100%;height:100%} /* plus fort que .maplibregl-map{position:relative} */
.carte-attente{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:24px;color:var(--gris);text-align:center}
.carte-attente.erreur{position:static;margin:24px}
.carte-info{position:absolute;left:12px;top:12px;right:68px;z-index:3;max-width:30rem;margin:0;background:var(--feuille);border-left:4px solid var(--email);padding:10px 12px;font-size:.95rem;font-weight:600}
.carte-cote{display:grid;gap:20px;align-content:start}
.carte-bloc{background:var(--feuille);padding:18px}
.carte-bloc h2{font-size:1.3rem;margin-bottom:8px}
details.carte-bloc.depliant{border-top:0;margin-top:0}
details.carte-bloc.depliant summary{font:400 1.2rem/1.2 var(--titre);color:var(--encre)}
/* Points (boutons de 44 px, pastille ronde au centre) */
.pt{position:relative;display:grid;place-items:center;width:44px;height:44px;padding:0;margin:0;border:0;background:transparent;cursor:pointer}
.pt:focus-visible{outline:3px solid var(--email);outline-offset:-8px}
.pt:hover .pt-rond{width:20px;height:20px}
.pt-rond{position:relative;display:inline-block;flex:none;box-sizing:border-box;width:16px;height:16px;border-radius:50%;background:var(--c,var(--st-gris));border:2px solid #fff;box-shadow:0 0 0 1px rgba(28,36,51,.55)}
.leg .pt-rond,.action-ligne .pt-rond,.fiche-statut .pt-rond{width:14px;height:14px}
.st-a_contacter{--c:var(--st-gris)}.st-contacte{--c:var(--st-jaune)}.st-plus_tard{--c:#FFFFFF}.st-rdv{--c:var(--st-bleu-clair)}.st-rencontre{--c:var(--email)}
.st-devis{--c:var(--st-orange)}.st-signe{--c:var(--st-vert)}.st-en_ligne{--c:var(--st-vert-fonce)}.st-impaye{--c:var(--rouge)}.st-refuse{--c:var(--st-rouge-pale)}
.pt-rond.st-plus_tard,.st-plus_tard .pt-rond{border:3px solid var(--gris);box-shadow:0 0 0 1px #fff}
.pt-rond.st-refuse::after,.st-refuse .pt-rond::after{content:"";position:absolute;left:-5px;right:-5px;top:calc(50% - 1px);height:2px;background:var(--rouge);transform:rotate(-45deg)}
.pt-sel{z-index:5}
.pt-sel .pt-rond,.pt-sel:hover .pt-rond{width:24px;height:24px;box-shadow:0 0 0 3px var(--email),0 0 0 5px #fff}
.pt-approx .pt-rond{outline:2px dashed var(--encre);outline-offset:3px}
.pt-compte{position:absolute;left:36px;top:50%;transform:translateY(-50%);background:var(--rouge);color:#fff;font:600 .82rem/1 var(--plaque);letter-spacing:.02em;padding:3px 5px;white-space:nowrap;pointer-events:none}
.pt-depart{display:block;width:16px;height:16px;background:var(--encre);border:3px solid #fff;box-shadow:0 0 0 1px var(--encre)}
.carte-hote .maplibregl-ctrl-group{border-radius:0;box-shadow:0 0 0 1px var(--filet)}
.carte-hote .maplibregl-ctrl-group button{width:44px;height:44px}
.carte-hote .maplibregl-ctrl.maplibregl-ctrl-attrib{font:400 .72rem/1.35 var(--texte);background:var(--feuille)} /* plus fort que la feuille de MapLibre, chargée après */
.carte-hote .maplibregl-ctrl-attrib a{color:var(--encre-douce)}
/* Fiche d'un point */
.fiche-point{background:var(--feuille);border-top:4px solid var(--email);padding:14px 18px 18px}
.fiche-point:focus{outline:none}
.fiche-tete{display:flex;align-items:center;justify-content:space-between;gap:12px}
.fiche-statut{display:flex;align-items:center;gap:10px;margin:0;font-weight:700}
.fiche-fermer{flex:none;display:grid;place-items:center;width:44px;height:44px;margin-right:-10px;border:0;background:none;color:var(--encre);cursor:pointer}
.fiche-fermer svg{width:22px;height:22px}
.fiche-point h2{margin:2px 0 4px}
.fiche-point>.petit{margin:0 0 6px}
.fiche-alerte{margin:8px 0 0;border-left:4px solid var(--rouge);background:var(--rouge-clair);padding:8px 12px;font-size:.95rem}
.fiche-place{margin:8px 0 0;border-left:4px solid var(--email);background:var(--email-clair);padding:8px 12px;font-size:.95rem;font-weight:600} /* placé par le commerçant (/localiser) */
.fiche-place .petit{font-weight:400;color:var(--encre-douce)}
.fiche-lignes{margin:10px 0 0;border-top:1px solid var(--filet)}
.fiche-lignes div{display:grid;grid-template-columns:8.5rem 1fr;gap:2px 12px;padding:8px 0;border-bottom:1px solid var(--filet);font-size:.96rem}
.fiche-lignes dt{color:var(--gris)}
.fiche-lignes dd{margin:0}
.fiche-rouge dd{color:var(--rouge);font-weight:700}
.route-res{margin:12px 0 0;font-size:1rem}
.route-res strong{font:600 1.4rem/1 var(--plaque)}
.route-res .petit{display:block;margin-top:2px}
#cs-route .erreur,#cs-route>.petit{margin:12px 0 0}
.fiche-boutons{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.fiche-boutons .bouton{flex:1 1 auto;padding:10px 16px;font-size:1rem}
.fiche-liens{display:flex;flex-wrap:wrap;gap:0 18px;margin:8px 0 0}
.fiche-liens a{display:inline-flex;align-items:center;min-height:44px}
.fiche-statuts{margin-top:10px}
.choix-statut{display:flex;flex-wrap:wrap;border-top:1px solid var(--filet);border-left:1px solid var(--filet);margin-top:8px}
.choix-statut .leg{flex:1 1 auto;border-bottom:1px solid var(--filet)}
.choix-statut .leg[aria-pressed=true]{background:var(--email);color:#fff}
.choix-statut .leg.charge{opacity:.6}
.plus-tard{margin-top:14px}
/* Prochaines actions */
.actions-titre{font:700 .9rem/1.3 var(--texte);color:var(--gris);margin:10px 0 0}
.actions-liste{list-style:none;margin:0;padding:0}
.action-ligne{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:8px 4px;border:0;border-bottom:1px solid var(--filet);background:none;color:var(--encre);font:inherit;text-align:left;cursor:pointer}
.action-ligne:hover strong{text-decoration:underline}
.action-ligne[aria-current=true]{background:var(--email-clair)}
.action-ligne .txt{flex:1;min-width:0;display:grid}
.action-ligne .txt strong{font-weight:600}
.action-ligne .txt span{font-size:.92rem;color:var(--gris)}
.action-ligne .quand{flex:none;font:600 1rem/1 var(--plaque);color:var(--encre)}
.action-ligne .quand.retard{color:var(--rouge)}
@media (max-width:899px){
  body.page-carte main{padding-top:0;padding-bottom:48px}
  .carte-page{width:100%}
  .carte-tete{align-items:center;padding:8px 16px}
  .carte-tete h1{font-size:1.5rem}
  .carte-resume{font-size:.86rem;line-height:1.3}
  .carte-tete .bouton{min-height:44px;padding:8px 12px;font-size:.95rem}
  .legende{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .legende::-webkit-scrollbar{display:none}
  .carte-hote{height:calc(100vh - 64px - 48px);height:calc(100dvh - 64px - 48px);min-height:420px}
  .carte-cote{padding:0 16px}
  .fiche-point{position:fixed;left:0;right:0;bottom:0;z-index:40;max-height:52vh;max-height:52dvh;overflow-y:auto;overscroll-behavior:contain;padding:6px 16px calc(14px + env(safe-area-inset-bottom));box-shadow:0 -1px 0 var(--filet)}
  .fiche-point h2{font-size:1.3rem}
  .fiche-lignes div{grid-template-columns:7.5rem 1fr;padding:6px 0;font-size:.93rem}
  .fiche-boutons{margin-top:10px;gap:8px}
  .fiche-boutons .bouton{flex:1 1 40%;min-height:46px;padding:8px 12px;font-size:.95rem}
  .route-res{margin-top:8px}
  body.fiche-ouverte .toast{bottom:auto;top:76px}
}

/* ===== Écran d'Ethan : application de gestion (09/11/2026) =====
   Ordinateur : colonne bleu émail à gauche (la plaque), la section active en plaque blanche. Téléphone : barre bleue en haut
   (logo + « Nouveau client »), barre blanche en bas (5 sections, texte seul). Pas d'icônes, pas de pastilles : des mots et
   des nombres (Barlow Condensed). Une page = une question ; feuilles blanches sans arrondi ni ombre. */
body.admin{--rail:236px;--onglets:62px}
.rail,.onglets-bas{display:none}
body.admin.hors-session .raccourci-nouveau{display:none}
.raccourci-nouveau{border:1.5px solid #fff;border-radius:4px;padding:0 12px!important}
.raccourci-nouveau:hover{background:var(--email-fonce)}
.nav-n{font:600 1.08rem/1 var(--plaque);letter-spacing:.02em;margin-left:auto;padding-left:10px}
.nav-n[hidden]{display:none}
@media (min-width:1000px){
  body.admin:not(.hors-session){padding-left:var(--rail)}
  body.admin:not(.hors-session) .barre{display:none}
  body.admin:not(.hors-session) .rail{display:flex}
  body.admin:not(.hors-session) .page{width:auto;max-width:1240px;margin-inline:clamp(24px,3.2vw,48px)}
  .rail{position:fixed;top:0;bottom:0;left:0;z-index:35;width:var(--rail);flex-direction:column;background:var(--email);color:#fff;padding:18px 14px 14px;overflow-y:auto;overscroll-behavior:contain}
  .rail a{color:#fff;text-decoration:none}
  .rail a:focus-visible{outline:3px solid #fff;outline-offset:2px}
  .rail-logo{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 6px;margin:0 0 22px}
  .rail-logo .mini-plaque{background:transparent;padding:0}
  .rail-nom{font:400 1.2rem/1.1 var(--titre)}
  .rail-nom small{display:block;font:400 .84rem/1.3 var(--texte);color:#C9D3E8;margin-top:3px}
  .rail-nouveau{display:flex;align-items:center;justify-content:center;min-height:46px;border:2px solid #fff;border-radius:4px;font-weight:700;margin:0 0 20px}
  .rail-nouveau:hover{background:var(--email-fonce)}
  .rail-nouveau[aria-current=page]{background:#fff;color:var(--email)!important}
  .rail-liste{list-style:none;margin:0;padding:0;display:grid;gap:2px}
  .rail-liste a{display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:4px;font-weight:600;font-size:1.03rem;color:#E4E9F4}
  .rail-liste a:hover{background:var(--email-fonce);color:#fff}
  .rail-liste a[aria-current=page]{background:#fff;color:var(--email)}
  .rail-liste a[aria-current=page]:hover{background:#fff}
  .rail-pied{margin-top:auto;display:flex;align-items:center;min-height:44px;padding:0 12px;font-size:.95rem;color:#C9D3E8!important;text-decoration:underline!important;text-underline-offset:3px}
}
@media (max-width:999px){
  body.admin:not(.hors-session) .onglets-bas{display:grid}
  .onglets-bas{position:fixed;left:0;right:0;bottom:0;z-index:35;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--feuille);border-top:1px solid var(--filet);padding-bottom:env(safe-area-inset-bottom)}
  .onglets-bas a{position:relative;display:flex;align-items:center;justify-content:center;min-height:var(--onglets);padding:0 2px;color:var(--gris);font:600 .97rem/1.1 var(--texte);text-decoration:none}
  .onglets-bas a[aria-current=page]{color:var(--email)}
  .onglets-bas a[aria-current=page]::before{content:"";position:absolute;left:16%;right:16%;top:-1px;height:3px;background:var(--email)}
  .onglets-bas a:focus-visible{outline-offset:-4px}
  .onglets-bas .nav-n{margin-left:0;padding-left:5px;color:var(--email)}
  body.admin:not(.hors-session) main{padding-bottom:calc(var(--onglets) + 56px)}
  body.admin:not(.hors-session) .toast{bottom:calc(var(--onglets) + 16px + env(safe-area-inset-bottom))}
  body.admin.page-carte:not(.hors-session) main{padding-bottom:var(--onglets)}
}
@media (max-width:899px){body.admin .carte-hote{height:calc(100vh - 64px - 48px - var(--onglets));height:calc(100dvh - 64px - 48px - var(--onglets))}}
@media print{.rail,.onglets-bas{display:none!important}body.admin{padding-left:0!important}}

/* Pages */
body.admin .feuille{background:var(--feuille);padding:20px 18px}
@media (min-width:600px){body.admin .feuille{padding:22px 24px}}
body.admin .feuille h2{margin-bottom:12px}
body.admin .pile>.feuille,body.admin .pile>.alerte,body.admin .pile>p{margin:0}
.tete-app{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 20px;flex-wrap:wrap}
.tete-app .bouton{flex:none}
.page-colonne{max-width:900px}
.page-colonne.etroite{max-width:640px}
.accueil-grille,.admin-deux{display:grid;gap:20px}
@media (min-width:1100px){.accueil-grille{grid-template-columns:minmax(0,1fr) minmax(320px,400px);gap:28px;align-items:start}.admin-deux{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:28px;align-items:start}}
.vide-action{padding:2px 0}
.vide-action p{color:var(--encre-douce);margin:0 0 12px;max-width:52ch}
.vide-action .boutons{margin-top:4px}
.texte-alerte{color:var(--rouge);font-weight:700}
.sous-titre-onglet{color:var(--gris);margin:-6px 0 16px}

/* Agenda : l'heure en chiffres de plaque, puis qui et où */
.agenda{list-style:none;margin:0;padding:0}
.agenda li+li{border-top:1px solid var(--filet)}
.ligne-agenda{display:grid;grid-template-columns:5.4rem minmax(0,1fr) auto;gap:4px 14px;align-items:center;min-height:62px;padding:10px 0;color:var(--encre);text-decoration:none}
a.ligne-agenda{grid-template-columns:5.4rem minmax(0,1fr)}
a.ligne-agenda:hover strong{text-decoration:underline}
.ligne-agenda .heure{font:600 1.5rem/1 var(--plaque);letter-spacing:.01em;color:var(--email);white-space:nowrap}
.ligne-agenda .heure small{display:block;font:500 .95rem/1.2 var(--plaque);color:var(--gris);margin-bottom:3px}
.ligne-agenda .txt{display:grid;min-width:0}
.ligne-agenda .txt strong{font-weight:600}
.ligne-agenda .txt span{font-size:.92rem;color:var(--gris)}
.ligne-agenda .txt a{justify-self:start;display:inline-flex;align-items:center;min-height:44px;font-size:.95rem;font-weight:600}
.jour-agenda{font:700 .97rem/1.3 var(--texte);color:var(--gris);margin:20px 0 0;padding-bottom:4px;border-bottom:1px solid var(--filet)}
.jour-agenda:first-of-type{margin-top:0}
.agenda.squelettes li{height:62px;display:flex;align-items:center}
.agenda.squelettes li::before{content:"";display:block;width:62%;height:14px;background:var(--fond)}
@media (max-width:420px){.ligne-agenda{grid-template-columns:4.6rem minmax(0,1fr)}.ligne-agenda .mini-bouton{grid-column:2;justify-self:start}}

/* Sous-navigation (agenda) et sommaire de la fiche : texte souligné */
.sous-nav{display:flex;flex-wrap:wrap;gap:0 22px;border-bottom:1px solid var(--filet);margin:0 0 20px}
.sous-nav a{display:inline-flex;align-items:center;min-height:46px;margin-bottom:-1px;border-bottom:3px solid transparent;color:var(--gris);font-weight:600;text-decoration:none}
.sous-nav a:hover{color:var(--encre)}
.sous-nav a[aria-current=page]{color:var(--email);border-bottom-color:var(--email)}
.tete-fiche{padding-bottom:6px}
.tete-fiche h1{margin-top:2px}
.tete-fiche>p{margin:6px 0 0}
.sommaire{display:flex;flex-wrap:wrap;gap:0 18px;margin-top:10px;border-top:1px solid var(--filet)}
.sommaire .lien-bouton{font-weight:600;font-size:.97rem;text-decoration:none;color:var(--email)}
.sommaire .lien-bouton:hover{text-decoration:underline}

/* Clients : liste (en colonnes sur la page Clients, colonne étroite à côté d'une fiche) */
.liste-clients .lc-detail{grid-column:1 / -1}
.liste-clients .lc-prix::before{content:" · "}
@media (min-width:820px){
  .vue-clients .liste-clients a{grid-template-columns:minmax(0,1.2fr) minmax(0,1.5fr) 10rem 11rem;gap:4px 20px}
  .vue-clients .liste-clients .lc-detail{display:contents}
  .vue-clients .liste-clients strong{order:1}
  .vue-clients .liste-clients .lc-lieu{order:2}
  .vue-clients .liste-clients .statut{order:3}
  .vue-clients .liste-clients .lc-prix{order:4;text-align:right;color:var(--encre);font-variant-numeric:tabular-nums}
  .vue-clients .liste-clients .lc-prix::before{content:none}
}
@media (min-width:1000px){body.admin .admin-grille .bloc-clients{top:24px;max-height:calc(100vh - 48px)}}
@media (max-width:1199px){.vue-client .bloc-clients{display:none}}
@media (min-width:1200px){.vue-client .admin-grille{grid-template-columns:330px minmax(0,1fr)}.tete-fiche .retour{display:none}}
@media (min-width:600px){body.admin .liste-clients a[aria-current=true]{margin:0 -24px;padding-left:20px;padding-right:24px}}

/* Tableaux (facturation, avis) : en lignes empilées sur téléphone */
.tableau{width:100%;border-collapse:collapse;font-size:.98rem}
.tableau th,.tableau td{text-align:left;padding:10px 14px 10px 0;border-bottom:1px solid var(--filet);vertical-align:middle}
.tableau thead th{font-size:.9rem;font-weight:600;color:var(--gris);padding-top:0}
.tableau tbody th{font-weight:600}
.tableau .nombre{text-align:right;font:600 1.12rem/1 var(--plaque);letter-spacing:.01em;font-variant-numeric:tabular-nums}
.tableau thead .nombre{font:600 .9rem/1.3 var(--texte)}
.tableau tfoot th,.tableau tfoot td{border-bottom:0;font-weight:700}
.tableau a{display:inline-flex;align-items:center;min-height:44px;color:var(--encre)}
.tableau a:hover{color:var(--email)}
@media (max-width:640px){
  .tableau thead{display:none}
  .tableau tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 12px;padding:6px 0 10px;border-bottom:1px solid var(--filet)}
  .tableau th,.tableau td{border:0;padding:0}
  .tableau tbody th,.tableau tfoot th{flex:1 1 100%}
  .tableau td{font-size:.93rem;color:var(--encre-douce)}
  .tableau td[data-l]::before{content:attr(data-l) " ";color:var(--gris);font:400 .9rem var(--texte)}
  .tableau .nombre{text-align:left}
  .tableau td:empty{display:none}
}

/* Aperçu de la carte (accueil) : les points sur un fond uni, un clic ouvre la carte */
.apercu-carte{display:block;aspect-ratio:400 / 240;background:#F7F8FA;border:1px solid var(--filet)}
.apercu-carte:hover{border-color:var(--email)}
.apercu-carte svg{width:100%;height:100%}
.apercu-attente{margin-bottom:8px}
.ap-grille{stroke:#E5E8EE;stroke-width:1}
.ap-pt{fill:var(--c,var(--st-gris));stroke:#fff;stroke-width:2.5}
.ap-pt.st-plus_tard{stroke:var(--gris);stroke-width:3}
.ap-depart{fill:var(--encre);stroke:#fff;stroke-width:2}
.apercu-resume{margin:12px 0 6px;font-size:.97rem}
.apercu-resume strong{font:600 1.25rem/1 var(--plaque)}
.apercu-legende{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 16px;font-size:.92rem;color:var(--encre-douce)}
.apercu-legende li{display:inline-flex;align-items:center;gap:7px}
.apercu-legende li span:last-child{font:600 1rem/1 var(--plaque);color:var(--gris)}
.apercu-legende .pt-rond{width:12px;height:12px}
@media (max-width:1099px){.accueil-grille .bloc-apercu{order:2}}
.tableau td.nombre+td,.tableau th.nombre+th{padding-left:28px}
@media (max-width:640px){.tableau td.nombre+td{padding-left:0}}
.sommaire .lien-bouton{min-width:44px;justify-content:center}
.lien-ligne{display:inline-flex;align-items:center;min-height:44px;color:var(--encre)}
.lien-ligne:hover{color:var(--email)}
/* Tableau de bord du futur client (compte créé, pas encore payé : #/devis) — feuilles blanches à plat, deux colonnes à partir
   de 960 px (maquette et préparation à gauche, offre, suite et messages à droite), une seule colonne sur téléphone. */
.tdb .tete-page{padding-bottom:16px}
.tdb-grille{display:grid;gap:20px;align-items:start;margin-bottom:32px}
.tdb-principal,.tdb-cote{min-width:0}
@media (min-width:960px){.tdb-grille{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px}}
.tdb .frise li.passe .quand{color:var(--email)}
.apercu-outils{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px}
.apercu-outils .puces{flex:0 1 auto}
.apercu-outils .puce{min-width:120px}
.apercu{position:relative;overflow:hidden;background:var(--fond);border:1px solid var(--filet)}
.apercu iframe{display:block;border:0;background:#fff;transform-origin:0 0}
.apercu[data-mode="telephone"] iframe{box-shadow:0 0 0 1px var(--filet)}
.prep-compte{margin:6px 0 0}
.preparer{margin-top:8px;border-top:1px solid var(--filet)}
.preparer .prep-ligne{flex-wrap:wrap;justify-content:flex-start;gap:12px}
.preparer .prep-ligne .gauche{flex:1 1 0}
.preparer .prep-ligne .gauche span{display:block}
.preparer .prep-ligne>.mini-bouton{flex:none}
.prep-plus{flex:1 0 100%;padding-left:46px}
.prep-plus .vignettes{margin-top:0}
.offre-prix{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:0 0 6px}
.offre-prix .etiquette{flex-basis:100%;font-weight:600;font-size:.97rem}
.offre-prix strong{font:600 2.75rem/1 var(--plaque);letter-spacing:.01em}
.offre-prix span:last-child{color:var(--gris)}
.options-tdb{margin-bottom:6px}
.option-case{border-top:1px solid var(--filet);padding:12px 0;margin:0}
.option-case>span{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.option-prix{font:600 1.15rem/1.2 var(--plaque);color:var(--email)}
.option-court,.option-conseil{flex-basis:100%;font-size:.92rem;color:var(--gris)}
.option-conseil{color:var(--email);font-weight:600}
.offre-total{font:600 1.35rem/1.2 var(--plaque);margin:4px 0 2px}
.offre-total:empty,#tdb-pack:empty,#tdb-options-etat:empty{display:none}
.marge-gauche{margin-left:8px}
#tdb-messages .fil{margin-top:4px}
.tdb .saisie textarea{flex:1;min-width:0}
/* Accroches du tableau de bord (09/11) : diagnostic en bref (va bien / manque, 3 au plus de chaque), conditions en une ligne */
.tdb-diag{display:grid;gap:4px 20px;margin-top:4px}
@media (min-width:600px){.tdb-diag{grid-template-columns:1fr 1fr}}
.tdb-diag h3{font-size:1rem;margin:10px 0 0}
.tdb-diag .constats>li{padding:8px 0}
.tdb-diag .constats>li.petit{display:block;color:var(--gris)}
#tdb-conditions .conditions-texte{white-space:normal;margin:6px 0 0}
/* Mes conditions et demandes particulières (09/11) : texte du commerçant tel qu'il l'a écrit ; écran d'Ethan : AVANT / APRÈS. */
.conditions-texte{white-space:pre-wrap;overflow-wrap:anywhere;padding:12px 14px;border:1px solid var(--filet);border-radius:4px;background:var(--fond);line-height:1.55}
.compte-car{text-align:right;margin-top:6px;font-variant-numeric:tabular-nums}
.carte.a-lire{box-shadow:inset 4px 0 0 var(--email)}
.avant-apres{display:grid;gap:12px;margin-top:10px}
.avant-apres .etiquette{font-weight:600;font-size:.9rem;margin:0 0 6px;color:var(--encre-douce)}
.avant-apres del{background:var(--filet);color:var(--encre-douce);text-decoration:line-through;text-decoration-thickness:2px;border-radius:2px} /* pas de rouge : réservé aux impayés et aux erreurs */
.avant-apres ins{background:var(--email-clair);color:var(--email-fonce);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;border-radius:2px;font-weight:600}
@media (min-width:760px){.avant-apres{grid-template-columns:1fr 1fr}}
/* Diagnostic de la présence en ligne (#/diagnostic, reel.js ; fiche d'Ethan) : constats vérifiés, chacun avec sa source. Bleu = va bien,
   trait = manque (le rouge reste aux impayés et aux erreurs). */
.chiffres-deux{grid-template-columns:repeat(2,1fr)}
.constats{list-style:none;margin:0;padding:0}
.constats>li{display:grid;grid-template-columns:22px 1fr;gap:10px;padding:12px 0;border-bottom:1px solid var(--filet)}
.constats>li:last-child{border-bottom:0}
.constats strong{display:block;font-weight:600}
.constats p{margin:2px 0 0;font-size:.95rem;color:var(--encre-douce)}
.constats .source{font-size:.85rem;color:var(--gris)}
.constats .marque{width:18px;height:18px;margin-top:3px;display:grid;place-items:center}
.constats .marque svg{width:18px;height:18px}
.constat-ok .marque{color:var(--email)}
.constat-manque .marque{color:var(--encre-douce)}
.constat-info .marque{color:var(--gris)}
.ligne-squelette{display:block;height:14px;margin:4px 0 8px;background:var(--filet);border-radius:2px}
.ligne-squelette.courte{width:60%}