@font-face{
  font-family:"Archivo"; font-style:normal; font-display:swap;
  font-weight:100 900; font-stretch:62% 125%;
  src:url(fonts/archivo.woff2) format("woff2-variations"), url(fonts/archivo.woff2) format("woff2");
}

/* Couleurs Kamase : --corail = teinte du logo, --corail-fort = boutons (texte blanc lisible) */
:root{
  --corail:#E34A38; --corail-fort:#C7361F; --corail-clair:#FDECEA; --corail-voile:rgba(227,74,56,.14);
  --fond:#F3F3F6; --carte:#FFFFFF; --carte2:#F5F5F8; --encre:#16161B; --gris:#5E6068; --gris-clair:#9A9CA5;
  --trait:#E3E4E9; --trait-fort:#C9CAD1;
  --ok:#12864A; --ok-vif:#1FB564; --ok-clair:#E3F6EB;
  --nc:#B3122E; --nc-clair:#FBE6EA;
  --so:#6B6E78; --so-clair:#ECEDF1;
  --att:#A86400; --att-clair:#FFF1DB;
  --tap:56px; --r-s:12px; --r-m:16px; --r-l:22px;
  --ombre:0 1px 2px rgba(22,22,27,.04), 0 8px 24px rgba(22,22,27,.06);
  --ombre-haute:0 2px 6px rgba(22,22,27,.06), 0 18px 48px rgba(22,22,27,.14);
  --doux:cubic-bezier(.2,.8,.2,1);
  --police:"Archivo","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none !important}
.cache{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
html,body{margin:0;padding:0}
body{background:var(--fond);color:var(--encre);font-family:var(--police);font-size:17px;line-height:1.45;
  font-variant-numeric:tabular-nums;-webkit-text-size-adjust:100%}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0;font-weight:750;letter-spacing:-.01em;font-stretch:110%}
a{color:var(--corail-fort)}
.app{max-width:1080px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}
svg.ic{width:1.25em;height:1.25em;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
:focus-visible{outline:3px solid var(--corail);outline-offset:2px}
.chargement{color:var(--gris);text-align:center;padding:60px 0}

/* ---------- barre haute ---------- */
.bar{position:sticky;top:0;z-index:30;padding-top:env(safe-area-inset-top,0px);
  background:rgba(243,243,246,.88);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);
  border-bottom:1px solid rgba(22,22,27,.06)}
.bar-l{display:flex;align-items:center;gap:6px;min-height:64px;padding:0 10px 0 12px}
.logo-lien{display:flex;align-items:center;padding:4px}
.bar .logo{height:28px;width:auto}
.titres{flex:1;min-width:0;padding:0 6px}
.titres h1{font-size:19px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.titres span{display:block;font-size:14px;color:var(--gris);font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.iconbtn{background:none;border:0;min-width:48px;height:48px;border-radius:14px;cursor:pointer;display:grid;place-items:center;color:var(--encre)}
.iconbtn svg{width:24px;height:24px}
.iconbtn:hover{background:rgba(22,22,27,.05)}

.compte{display:flex;align-items:center;gap:10px;border:0;background:var(--carte);border-radius:999px;padding:5px 14px 5px 5px;cursor:pointer;box-shadow:var(--ombre)}
.compte .avatar,.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:15px;
  background:linear-gradient(135deg,#FFB020,var(--corail));flex:0 0 auto}
.compte.admin .avatar,.avatar.admin{background:linear-gradient(135deg,#2A5CA8,#0B1730)}
.compte.lecteur .avatar,.avatar.lecteur{background:linear-gradient(135deg,#9A9CA5,#5E6068)}
.compte .qui{display:flex;flex-direction:column;text-align:left;font-weight:700;font-size:14.5px;line-height:1.15}
.compte .role{font-size:12.5px;color:var(--gris);font-weight:600}
@media (max-width:560px){ .bar .logo{height:22px} .titres h1{font-size:17px} .compte .qui{display:none} .compte{padding:4px}
  .sous-ecran .logo-lien{display:none} }

.etapes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:2px 18px 12px}
.seg{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:650;color:var(--gris-clair);text-decoration:none;cursor:pointer}
.seg b{height:6px;border-radius:6px;background:var(--trait);overflow:hidden;display:block}
.seg b i{display:block;height:100%;width:100%;border-radius:6px;background:var(--corail);transform-origin:left;transform:scaleX(var(--p,0));transition:transform .4s var(--doux)}
.seg.actif{color:var(--encre)} .seg.fait{color:var(--ok)} .seg.fait b i{background:var(--ok)}

main{flex:1;padding:18px 16px 130px}
@media (min-width:820px){ main{padding:24px 28px 140px} }
@media (prefers-reduced-motion:no-preference){ .entre{animation:entre .4s var(--doux) both;animation-delay:calc(var(--i,0) * 40ms)} }
@keyframes entre{from{opacity:0;transform:translateY(12px)}}

/* ---------- boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;
  min-height:var(--tap);padding:0 22px;border:0;border-radius:999px;background:var(--corail-fort);color:#fff;
  font-weight:700;font-stretch:106%;cursor:pointer;font-size:17px;text-decoration:none;
  box-shadow:0 6px 18px rgba(199,54,31,.25);transition:transform .12s var(--doux), background .2s, opacity .2s}
.btn:hover{background:#B82F19}
.btn:active{transform:scale(.97)}
.btn[disabled],.btn.inactif{opacity:.45;box-shadow:none}
.btn.clair{background:var(--carte);color:var(--corail-fort);box-shadow:inset 0 0 0 2px var(--corail-voile), var(--ombre)}
.btn.clair:hover{background:var(--corail-clair)}
.btn.discret{background:var(--carte2);color:var(--encre);box-shadow:none}
.btn.vert{background:var(--ok);box-shadow:0 6px 18px rgba(18,134,74,.25)}
.btn.danger{background:var(--nc);box-shadow:none}
.btn.auto{width:auto}
.mini{border:0;background:var(--carte2);border-radius:999px;padding:9px 14px;font-weight:650;cursor:pointer;font-size:14px;white-space:nowrap}
.mini:hover{background:var(--trait)}
.mini.danger{color:var(--nc)}
.actions{display:flex;flex-direction:column;gap:12px;margin-top:20px}
@media (min-width:700px){ .actions.ligne{flex-direction:row} }

/* ---------- cartes et champs ---------- */
.carte{background:var(--carte);border-radius:var(--r-l);padding:20px;box-shadow:var(--ombre);margin-bottom:16px}
.carte > h2{font-size:18px;display:flex;align-items:center;gap:10px;margin-bottom:14px}
.carte > h2 .num{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--corail-clair);color:var(--corail-fort);font-style:normal;font-size:15px}
.titre-bloc{font-size:15px;color:var(--gris);text-transform:uppercase;letter-spacing:.06em;margin:28px 4px 12px}
.champ{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.champ:last-child{margin-bottom:0}
.champ label{font-size:14.5px;font-weight:650;color:var(--gris)}
.champ label em{color:var(--corail-fort);font-style:normal}
.champ input,.champ select,.champ textarea{width:100%;min-height:52px;border:2px solid var(--trait);border-radius:var(--r-s);background:var(--carte);padding:10px 14px;font-size:17px;transition:border-color .2s}
.champ textarea{min-height:90px;resize:vertical}
.champ input:focus,.champ select:focus,.champ textarea:focus{outline:none;border-color:var(--corail);box-shadow:0 0 0 3px var(--corail-voile)}
.champ.erreur input{border-color:var(--nc);background:var(--nc-clair)}
input[readonly]{color:var(--gris);background:var(--carte2) !important}
.duo{display:grid;gap:0 14px}
@media (min-width:700px){ .duo{grid-template-columns:1fr 1fr} .trio{grid-template-columns:1fr 1fr 1fr} }
.note{color:var(--gris);font-size:14.5px;margin:6px 0 0}
.ligne{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--carte2)}
.ligne:last-child{border:0}
.ligne span:last-child{text-align:right;font-weight:650}

/* quantité */
.compteur{display:inline-flex;align-items:center;gap:6px;background:var(--carte2);border-radius:999px;padding:5px}
.compteur button{width:52px;height:52px;border-radius:50%;border:0;background:var(--carte);font-size:26px;font-weight:700;cursor:pointer;box-shadow:var(--ombre)}
.compteur input{width:90px;border:0;background:transparent;text-align:center;font-size:30px;font-weight:800;min-height:52px;-moz-appearance:textfield}
.compteur input::-webkit-outer-spin-button,.compteur input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* ---------- accueil ---------- */
.hero{position:relative;overflow:hidden;border-radius:26px;padding:26px 24px;color:#fff;margin-bottom:16px;
  background:radial-gradient(120% 140% at 100% 0%, #F2705F 0%, var(--corail) 38%, #A92A17 100%);box-shadow:0 14px 34px rgba(199,54,31,.28)}
.hero::after{content:"";position:absolute;right:-60px;top:-60px;width:260px;height:260px;border-radius:50%;
  box-shadow:0 0 0 3px rgba(255,255,255,.25),0 0 0 34px rgba(255,255,255,.06),0 0 0 37px rgba(255,255,255,.2),0 0 0 70px rgba(255,255,255,.05),0 0 0 73px rgba(255,255,255,.15)}
.hero > *{position:relative;z-index:1}
.hero::after{z-index:0}
@media (max-width:560px){ .hero::after{right:-140px;top:-120px} }
.hero h2{font-size:26px;line-height:1.15;max-width:520px;position:relative}
.hero p{margin:8px 0 18px;opacity:.92;max-width:520px;position:relative}
.hero .btn{background:#fff;color:var(--corail-fort);width:auto;box-shadow:0 8px 20px rgba(0,0,0,.15);position:relative}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:18px}
@media (min-width:760px){ .stats{grid-template-columns:repeat(4,1fr)} }
.stat{background:var(--carte);border-radius:var(--r-m);padding:14px 16px;box-shadow:var(--ombre);border:0;text-align:left;cursor:pointer}
.stat b{display:block;font-size:28px;font-weight:800;font-stretch:112%;line-height:1.1}
.stat span{font-size:14px;color:var(--gris);font-weight:600}
.stat .barre{height:6px;border-radius:6px;background:var(--trait);margin-top:8px;overflow:hidden}
.stat .barre i{display:block;height:100%;background:var(--ok-vif);border-radius:6px}
.stat.ok b{color:var(--ok)} .stat.nc b{color:var(--nc)} .stat.cours b{color:var(--att)}
.recherche{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.recherche .saisie{flex:1 1 320px;display:flex;align-items:center;gap:10px;background:var(--carte);border-radius:999px;padding:0 18px;box-shadow:var(--ombre);border:2px solid transparent}
.recherche .saisie:focus-within{border-color:var(--corail)}
.recherche .saisie svg{color:var(--gris)}
.recherche input{flex:1;border:0;background:transparent;min-height:52px;font-size:17px;outline:none;min-width:0}
.recherche select{min-height:52px;border-radius:999px;border:0;background:var(--carte);padding:0 16px;box-shadow:var(--ombre);font-weight:600}
.filtres{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px;scrollbar-width:none}
.filtre{border:0;background:var(--carte);border-radius:999px;padding:10px 16px;font-weight:650;cursor:pointer;white-space:nowrap;box-shadow:var(--ombre);font-size:15px}
.filtre em{font-style:normal;color:var(--gris);margin-left:6px;font-weight:600}
.filtre[aria-pressed="true"]{background:var(--encre);color:#fff}
.filtre[aria-pressed="true"] em{color:rgba(255,255,255,.7)}
.bloc-rapports{background:var(--carte);border-radius:var(--r-l);box-shadow:var(--ombre);padding:0 16px;margin-bottom:16px}
.bloc-rapports[open]{padding-bottom:16px}
.bloc-rapports summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:var(--tap);cursor:pointer;font-weight:750;font-size:17px;font-stretch:106%}
.bloc-rapports summary::-webkit-details-marker{display:none}
.bloc-rapports summary span{flex:1}
.bloc-rapports summary em{font-style:normal;font-size:14px;font-weight:750;color:var(--gris);background:var(--carte2);border-radius:999px;padding:3px 11px}
.bloc-rapports .chevron{width:10px;height:10px;border-right:2.5px solid var(--gris);border-bottom:2.5px solid var(--gris);transform:rotate(45deg);margin:0 6px 4px;transition:transform .2s}
.bloc-rapports[open] .chevron{transform:rotate(-135deg);margin-bottom:-4px}
.bloc-rapports .filtres{padding-top:4px}
.bloc-rapports .fiche{box-shadow:none;border:1.5px solid var(--trait)}
.compte-resultats{color:var(--gris);font-weight:600;margin:4px 4px 10px;font-size:14.5px}

.fiches{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
.fiches > *{min-width:0}
@media (min-width:900px){ .fiches{grid-template-columns:repeat(2,minmax(0,1fr))} }
.fiche{display:flex;gap:14px;align-items:stretch;background:var(--carte);border-radius:var(--r-m);padding:10px;border:0;text-align:left;cursor:pointer;box-shadow:var(--ombre);text-decoration:none;color:inherit;transition:transform .15s}
.fiche:hover{transform:translateY(-1px);box-shadow:var(--ombre-haute)}
.vign{width:84px;min-height:84px;border-radius:12px;overflow:hidden;flex:0 0 auto;background:var(--carte2);display:grid;place-items:center;color:var(--gris-clair)}
.vign img{width:100%;height:100%;object-fit:cover;display:block}
.corps{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;padding:2px 4px 2px 0}
.corps .haut{display:flex;align-items:flex-start;gap:8px}
.corps .ref{font-weight:800;font-size:17px;flex:1;min-width:0;overflow-wrap:anywhere;line-height:1.2}
.corps .meta{color:var(--gris);font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.corps .meta svg{width:15px;height:15px;vertical-align:-2px}
.corps .bas{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.puce{font-size:12.5px;font-weight:750;border-radius:999px;padding:4px 10px;white-space:nowrap}
.st-ok .puce{background:var(--ok-clair);color:var(--ok)}
.st-nc .puce{background:var(--nc-clair);color:var(--nc)}
.st-cours .puce{background:var(--att-clair);color:var(--att)}
.tag{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:600;color:var(--gris);background:var(--carte2);border-radius:8px;padding:3px 8px}
.tag svg{width:14px;height:14px}
.cadenas svg{width:16px;height:16px;color:var(--gris)}
mark{background:#FFE8A3;border-radius:3px;padding:0 1px}
.vide{text-align:center;color:var(--gris);padding:40px 20px}
.vide svg{width:90px;height:90px;color:var(--trait-fort)}

/* ---------- points de contrôle ---------- */
.resume{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.groupe{background:var(--carte);border-radius:var(--r-l);padding:6px 18px 10px;box-shadow:var(--ombre);margin-bottom:16px}
.groupe > header{display:flex;align-items:center;gap:12px;padding:12px 0 8px}
.groupe > header h2{font-size:18px;flex:1}
.groupe > header .cpt{font-weight:750;font-size:14px;color:var(--gris);background:var(--carte2);border-radius:999px;padding:4px 12px}
.groupe.complet > header .cpt{background:var(--ok-clair);color:var(--ok)}
.point{padding:14px 0;border-top:1px solid var(--carte2)}
.point .lib{font-weight:600;margin-bottom:10px}
.choix{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.choix button{min-height:var(--tap);border-radius:14px;border:2px solid var(--trait);background:var(--carte);font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font-size:15.5px;transition:all .15s}
.choix button:hover{border-color:var(--trait-fort)}
.choix button[aria-pressed="true"][data-e="C"]{background:var(--ok);border-color:var(--ok);color:#fff}
.choix button[aria-pressed="true"][data-e="NC"]{background:var(--nc);border-color:var(--nc);color:#fff}
.choix button[aria-pressed="true"][data-e="SO"]{background:var(--so);border-color:var(--so);color:#fff}
@media (max-width:480px){ .choix button span{font-size:13.5px} .choix button svg{display:none} }
.suite{margin-top:12px;padding:14px;background:var(--carte2);border-radius:14px}
.mesure{display:flex;align-items:flex-end;gap:10px}
.mesure .champ{flex:1;margin:0}
.mesure .unite{font-weight:700;padding-bottom:14px;color:var(--gris)}
.tolerance{font-size:14px;color:var(--gris);margin-top:8px}
.alerte-hors{margin-top:8px;color:var(--nc);font-weight:700;font-size:14.5px}
.photo-defaut{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.photo-defaut img{width:96px;height:72px;object-fit:cover;border-radius:10px;cursor:zoom-in}
.photo-defaut .btn{width:auto}
.enreg{font-size:13px;color:var(--gris);font-weight:600;min-height:18px;margin-top:6px}

/* barre d'action fixée en bas */
.barre-action{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));
  background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--trait)}
.barre-action .in{max-width:1080px;margin:0 auto;display:flex;align-items:center;gap:14px}
.barre-action .info{flex:1;min-width:0;font-weight:700;font-size:15px}
.barre-action .info small{display:block;color:var(--gris);font-weight:600;font-size:13px}
.barre-action .btn{width:auto;min-width:200px}
@media (max-width:520px){ .barre-action .btn{min-width:0;flex:1} .barre-action .info{display:none} }

/* ---------- photos ---------- */
.photos-grille{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (min-width:700px){ .photos-grille{grid-template-columns:repeat(4,1fr)} }
.case{position:relative;aspect-ratio:4/3;border-radius:16px;overflow:hidden;background:var(--carte);box-shadow:var(--ombre);border:0;padding:0}
.case img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.case .n{position:absolute;left:8px;top:8px;background:rgba(0,0,0,.6);color:#fff;font-weight:800;font-size:13px;border-radius:999px;padding:2px 9px}
.case .sup{position:absolute;right:6px;top:6px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--nc);display:grid;place-items:center;cursor:pointer}
.case.ajout{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;border:2px dashed var(--corail);background:var(--corail-clair);color:var(--corail-fort);font-weight:750}
.case.ajout svg{width:34px;height:34px}
.case.ajout small{font-weight:600;color:var(--gris)}
.case.vide{background:var(--carte2);box-shadow:none;border:2px dashed var(--trait)}
.case.envoi{display:grid;place-items:center;color:var(--gris);font-weight:650;font-size:14px}
.import{margin-top:14px;text-align:center}

/* ---------- signature ---------- */
.verdict-prev{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.anneau{width:110px;height:110px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;position:relative}
.anneau::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--carte)}
.anneau span{position:relative;text-align:center;font-weight:800;font-size:26px;line-height:1}
.anneau small{display:block;font-size:12px;color:var(--gris);font-weight:600}
.legende{display:flex;flex-wrap:wrap;gap:14px;font-size:14px;font-weight:600;color:var(--gris);margin-top:8px}
.legende i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
.pad-cadre{background:var(--carte);border-radius:var(--r-l);box-shadow:var(--ombre);padding:10px;position:relative}
.pad-cadre::after{content:"Signez ici";position:absolute;left:24px;bottom:22px;color:var(--gris-clair);font-weight:600;pointer-events:none}
.pad{width:100%;height:230px;display:block;touch-action:none;border-radius:14px;background:repeating-linear-gradient(0deg,transparent 0 44px,var(--carte2) 44px 46px)}

/* ---------- récapitulatif ---------- */
.verdict{border-radius:26px;padding:22px;box-shadow:var(--ombre);margin-bottom:16px;display:flex;gap:20px;flex-wrap:wrap;align-items:center;background:var(--carte)}
.verdict.v-ok{background:linear-gradient(135deg,var(--ok-clair),#fff 70%)}
.verdict.v-nc{background:linear-gradient(135deg,var(--nc-clair),#fff 70%)}
.verdict.v-cours{background:linear-gradient(135deg,var(--att-clair),#fff 70%)}
.verdict .txt{flex:1 1 260px;min-width:0}
.verdict .tampon{display:inline-block;font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:14px;border:3px solid currentColor;border-radius:10px;padding:3px 10px;transform:rotate(-3deg);margin-bottom:8px}
.v-ok .tampon{color:var(--ok)} .v-nc .tampon{color:var(--nc)} .v-cours .tampon{color:var(--att)}
.verdict .ref{font-size:24px;font-weight:850;font-stretch:112%}
.verdict .meta{color:var(--gris);margin:2px 0 10px}
.verdict .tags{display:flex;flex-wrap:wrap;gap:6px}
.verdict .acts{display:flex;flex-direction:column;gap:10px;flex:1 1 240px}
.infos{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:16px}
@media (min-width:760px){ .infos{grid-template-columns:repeat(3,1fr)} }
.infos > div{background:var(--carte);border-radius:var(--r-m);padding:12px 14px;box-shadow:var(--ombre)}
.infos span{display:block;font-size:13px;color:var(--gris);font-weight:600}
.infos b{font-size:16px;word-break:break-word}
.verrou{display:flex;align-items:center;gap:8px;color:var(--gris);font-weight:600;font-size:14.5px;margin:0 4px 16px}
.galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.galerie img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;cursor:zoom-in;display:block}
.sig-img{max-width:320px;width:100%;background:var(--carte2);border-radius:12px}
.nc-ligne{padding:10px 0;border-bottom:1px solid var(--carte2)}
.nc-ligne:last-child{border:0}
.nc-ligne b{display:block}
.nc-ligne span{color:var(--gris)}

/* ---------- connexion ---------- */
.porte{min-height:calc(100dvh - 140px);display:grid;place-items:center}
.porte .carte{width:min(440px,100%);padding:28px}
.porte .entete{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;margin-bottom:20px}
.porte .entete img{width:72px;height:72px;border-radius:18px}
.porte h2{font-size:22px}

/* ---------- administration ---------- */
.tableau{width:100%;border-collapse:collapse;font-size:15px}
.tableau th{text-align:left;color:var(--gris);font-size:13px;font-weight:650;padding:6px 8px;border-bottom:2px solid var(--trait)}
.tableau td{padding:10px 8px;border-bottom:1px solid var(--carte2);vertical-align:middle}
.tableau select{border:2px solid var(--trait);border-radius:10px;padding:6px 8px;background:var(--carte)}
.tableau .off{opacity:.5}
.defile{overflow-x:auto}
.journal{font-size:13.5px;max-height:340px;overflow:auto}
.journal div{padding:6px 0;border-bottom:1px solid var(--carte2);display:grid;grid-template-columns:130px 1fr;gap:10px}
.journal time{color:var(--gris)}

/* ---------- menus, toasts, visionneuse ---------- */
.menu-compte{position:fixed;z-index:86;top:calc(70px + env(safe-area-inset-top,0px));right:14px;width:min(290px,calc(100vw - 28px));background:var(--carte);border-radius:20px;box-shadow:var(--ombre-haute);padding:8px}
.menu-compte .tete{padding:10px 12px 12px;border-bottom:1px solid var(--carte2);margin-bottom:6px}
.menu-compte .tete b{display:block}
.menu-compte .tete span{color:var(--gris);font-size:14px;font-weight:600}
.menu-compte a,.menu-compte button{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;border-radius:12px;padding:12px;font-weight:650;cursor:pointer;text-align:left;color:var(--encre);text-decoration:none;font-size:16px}
.menu-compte a:hover,.menu-compte button:hover{background:var(--carte2)}
.menu-compte svg{width:22px;height:22px;color:var(--gris)}
.toast{position:fixed;left:50%;bottom:calc(100px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:99;background:var(--encre);color:#fff;padding:13px 20px;border-radius:14px;font-weight:600;box-shadow:var(--ombre-haute);max-width:calc(100vw - 32px);text-align:center}
@media (prefers-reduced-motion:no-preference){ .toast{animation:entre .3s var(--doux)} }
.visionneuse{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.9);display:grid;place-items:center;cursor:zoom-out;padding:16px}
.visionneuse img{max-width:100%;max-height:100%;border-radius:8px}
.modale{position:fixed;inset:0;z-index:85;display:grid;place-items:center;padding:20px;background:rgba(11,23,48,.5)}
.modale .boite{width:min(460px,100%);background:var(--carte);border-radius:24px;box-shadow:0 40px 90px rgba(0,0,0,.3);padding:24px}
.modale h2{font-size:21px;margin-bottom:6px}
.sceau{position:fixed;inset:0;z-index:88;display:grid;place-items:center;background:rgba(255,255,255,.75);cursor:pointer}
.sceau .t{font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:clamp(32px,8vw,64px);border:6px solid currentColor;border-radius:18px;padding:10px 28px;transform:rotate(-6deg);background:#fff;text-align:center}
.sceau .t small{display:block;font-size:16px;letter-spacing:0;text-transform:none;font-weight:700}
.sceau.ok .t{color:var(--ok)} .sceau.nc .t{color:var(--nc)}
@media (prefers-reduced-motion:no-preference){ .sceau .t{animation:tampon .45s cubic-bezier(.2,1.4,.4,1)} }
@keyframes tampon{from{transform:rotate(-6deg) scale(2.2);opacity:0}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* =========================================================================
   RAPPORT CLIENT IMPRIMABLE (A4)
   ========================================================================= */
#impression{display:none}
/* Mise en page du rapport : commune à l'écran (« Voir le rapport complet ») et à l'impression */
.rapport{color:#16161B}
.feuille{background:#fff;max-width:860px;margin:0 auto;padding:28px 30px;border-radius:var(--r-l);box-shadow:var(--ombre);font-size:15px}
@media (max-width:600px){ .feuille{padding:18px 14px;font-size:14px;border-radius:16px} .rapport .rp-ident{grid-template-columns:1fr} .rapport .rp-photos{grid-template-columns:1fr 1fr} .rp-tete{flex-wrap:wrap} .rp-titre{text-align:left !important;margin-left:0 !important}
  .feuille .rp-verdict{flex-direction:column;align-items:flex-start} }
.rp-tete{display:flex;align-items:center;gap:16px;border-bottom:3px solid var(--corail);padding-bottom:10px;margin-bottom:14px}
.rp-tete img{height:38px}
.rp-titre{margin-left:auto;text-align:right}
.rp-titre h1{font-size:1.5em;font-stretch:110%}
.rp-titre p{margin:2px 0 0;color:#5E6068}
.rp-verdict{display:flex;gap:14px;align-items:center;border-radius:10px;padding:10px 14px;margin-bottom:14px;break-inside:avoid}
.rp-verdict.ok{background:#E3F6EB} .rp-verdict.nc{background:#FBE6EA} .rp-verdict.cours{background:#FFF1DB}
.rp-verdict p{margin:0}
.rp-tampon{font-weight:900;text-transform:uppercase;letter-spacing:.06em;border:3px solid currentColor;border-radius:8px;padding:4px 10px;white-space:nowrap;transform:rotate(-3deg)}
.ok .rp-tampon{color:#12864A} .nc .rp-tampon{color:#B3122E} .cours .rp-tampon{color:#A86400}
.rp-ident{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;margin-bottom:14px}
.rp-ident span{color:#5E6068;margin-right:6px}
.rapport h2{font-size:1.1em;margin:16px 0 8px;color:var(--corail-fort)}
.rp-table{width:100%;border-collapse:collapse}
.rp-table th{text-align:left;font-size:.85em;color:#5E6068;border-bottom:1.5px solid #C9CAD1;padding:5px 6px}
.rp-table td{border-bottom:1px solid #E3E4E9;padding:7px 6px;vertical-align:top}
.rp-table tr{break-inside:avoid}
.rp-sec td{font-weight:800;background:#F5F5F8}
.rp-res{white-space:nowrap;font-weight:700;width:1%}
.rp-C{color:#12864A} .rp-NC{color:#B3122E} .rp-SO{color:#6B6E78} .rp-vide{color:#A86400}
.rp-obs{color:#5E6068;font-size:.88em;margin-top:2px}
.rp-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rp-photos figure{margin:0;break-inside:avoid}
.rp-photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;display:block}
.feuille .rp-photos img{cursor:zoom-in}
.rp-photos figcaption{font-size:.82em;color:#5E6068}
.rp-sig{display:flex;align-items:center;gap:18px;flex-wrap:wrap;break-inside:avoid}
.rp-sig img{height:70px}
.rp-bloc{break-inside:avoid}
.rp-pied{margin-top:18px;border-top:1px solid #C9CAD1;padding-top:6px;font-size:.8em;color:#5E6068;text-align:center}
@media print{
  @page{size:A4;margin:12mm 12mm 14mm}
  body{background:#fff;font-size:10.5pt}
  .app,.barre-action,.toast,.modale,.menu-compte,.visionneuse{display:none !important}
  #impression{display:block;color:#16161B;font-size:10.5pt}
}

/* ---------- liste des clients (création d'un contrôle) ---------- */
.combo{position:relative}
.combo input{padding-right:56px !important}
.combo-ouvrir{position:absolute;right:4px;top:4px;bottom:4px;width:46px;border:0;background:transparent;border-radius:10px;cursor:pointer;display:grid;place-items:center}
.combo-ouvrir:hover{background:var(--carte2)}
.combo .chevron{width:10px;height:10px;border-right:2.5px solid var(--gris);border-bottom:2.5px solid var(--gris);transform:rotate(45deg);margin-top:-5px}
.combo-liste{position:absolute;z-index:45;left:0;right:0;top:calc(100% + 6px);max-height:300px;overflow:auto;background:var(--carte);border-radius:14px;box-shadow:var(--ombre-haute);border:1px solid var(--trait);padding:6px}
.combo-liste button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:none;border-radius:10px;padding:12px 14px;font-size:16px;cursor:pointer;min-height:48px}
.combo-liste button:hover,.combo-liste button.actif{background:var(--carte2)}
.combo-liste .ajout-client{color:var(--corail-fort);font-weight:700;border-top:1px solid var(--trait);border-radius:0 0 10px 10px;margin-top:4px}