/* RENOSAFE — styles propres à l'application (jetons : tokens.css ; composants : ui.css, issus de la charte). Aucun style en ligne (CSP). */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.mu{color:var(--mu)}.petit{font-size:13px}.nowrap{white-space:nowrap}.droite{text-align:right}.centre{text-align:center}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:root{--panneau:var(--nuit)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--panneau:var(--nuit-d)}}
:root[data-theme="dark"]{--panneau:var(--nuit-d)}
.racine[data-etat="chargement"]:not(:has(noscript)){min-height:100vh}

/* champs et petits composants complémentaires */
.check{align-items:flex-start;cursor:pointer}
.check input[type=checkbox]{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin:1px 0 0;border:1.5px solid var(--ctrl);border-radius:var(--r-s);background:var(--surface);display:grid;place-items:center;cursor:pointer}
.check input[type=checkbox]:checked{background:var(--action);border-color:var(--action)}
.check input[type=checkbox]:checked::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}
.input select,.input textarea{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--tx);font:400 16px/1.3 RS,sans-serif;min-height:44px}
.field textarea{width:100%;min-height:96px;padding:12px 14px;border:1.5px solid var(--ctrl);border-radius:var(--r);background:var(--surface);color:var(--tx);font:400 16px/1.5 RS,sans-serif;resize:vertical}
.field textarea:focus{outline:0;border-color:var(--action);box-shadow:0 0 0 3px color-mix(in srgb,var(--action) 28%,transparent)}
.input input[type=search]{-webkit-appearance:none}
.saisie-code{font:700 26px/1 RSC,sans-serif!important;letter-spacing:.35em}
.err-zone:empty{display:none}
.err-zone .err{padding:2px 0}
.lien{border:0;background:transparent;color:var(--link);font:500 16px/1.4 RS,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:8px 0;min-height:44px}
.lien:disabled{color:var(--mu);text-decoration:none;cursor:default}
.deux{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
progress{width:100%;height:8px;accent-color:var(--action)}
input[type=range]{width:100%;accent-color:var(--action);min-height:32px}

/* écrans d'accès : panneau Nuit à gauche (le bouclier fermé cadre la page, geste porteur), formulaire à droite */
.cx{display:grid;grid-template-columns:5fr 6fr;min-height:100vh}
.cx-marque{position:relative;overflow:hidden;background:var(--panneau);padding:56px}
.cx-marque .logo{display:block;height:auto}
.cx-marque .logo-clair{display:none}
.cx-marque .accroche{position:relative;z-index:1;max-width:340px;margin-top:56px}
.cx-marque .rep{margin:0;color:var(--clair)}
.cx-marque h2{margin:14px 0 0;color:#fff;font-size:30px;line-height:1.2}
.cx-marque .bouclier{position:absolute;left:-60px;bottom:-120px;width:560px;pointer-events:none}
.cx-marque .bouclier svg{width:100%;height:auto;display:block}
.cx-form{display:grid;place-items:center;padding:48px 24px;background:var(--papier)}
.cx-form .contenu{width:min(440px,100%)}
.cx-form h1{font-size:30px}
.cx-form .sous{margin-top:8px;color:var(--mu)}
.cx-form .banner{margin-top:24px}
.formulaire{display:grid;gap:20px;margin-top:32px}
.formulaire.etroit{max-width:560px}
@media (max-width:900px){
  .cx{grid-template-columns:1fr}
  .cx-marque{padding:20px 24px;background:var(--papier)}
  .cx-marque .logo-blanc,.cx-marque .accroche,.cx-marque .bouclier{display:none}
  .cx-marque .logo-clair{display:block}
  .cx-form{place-items:start center;padding-top:16px}
}

/* le bouclier vivant : une seule animation (280 ms, transform + opacité) — la pièce de l'entaille se retire à l'ouverture */
.bouclier-svg .corps,.bouclier-svg .frag{fill:var(--marque)}
.bouclier-svg .frag{transform-box:fill-box;transition:transform 280ms var(--ease-out),opacity 200ms var(--ease-out)}
.bouclier-svg.ouvert .frag{transform:translate(14.4px,-16.6px);opacity:0}
@media (prefers-reduced-motion:reduce){.bouclier-svg .frag{transition:none}}

/* le coffre */
.coffre{display:grid;grid-template-columns:288px minmax(0,1fr);min-height:100vh}
.coffre .nav{position:sticky;top:0;height:100vh;overflow-y:auto}
.nav-logo{padding:8px 12px 20px}.nav-logo img{display:block;height:auto}
.nav a{text-decoration:none}
.nav .lib{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-ajout,.nav-bouton{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;border:0;border-radius:var(--r);background:transparent;color:#C9D6D5;font:500 15px/1 RS,sans-serif;cursor:pointer;width:100%;text-align:left}
.nav-ajout:hover,.nav-bouton:hover{background:#182928;color:#fff}
.nav-vide{padding:6px 12px;font-size:14px;color:#A8B4B3}
.nav-pied{margin-top:auto;display:grid;gap:4px;padding-top:16px}
.etat-verrou{display:flex;gap:10px;align-items:flex-start;padding:8px 12px;color:#E2EAE9;font-size:14px;line-height:1.4}
.nav-actions{display:grid;gap:2px}
.principal{display:flex;flex-direction:column;min-width:0;background:var(--surface)}
.barre{display:flex;align-items:center;gap:12px;padding:12px 24px;border-bottom:1px solid var(--ln);background:var(--surface);position:sticky;top:0;z-index:5}
.barre .recherche{flex:1;max-width:460px;padding-left:12px}
.barre .recherche svg{color:var(--mu)}
.menu-nav{display:none}
.ressort{flex:1}
.zone{display:grid;grid-template-columns:minmax(0,1fr) 420px;flex:1;min-height:0}
.zone.solo{grid-template-columns:minmax(0,1fr)}
.liste{min-width:0;padding-bottom:48px}
.liste-tete{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:20px 16px 12px}
.liste-tete h1{font-size:24px}
.row .cell{flex:1;min-width:0}
.row .t,.row .s{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.code-controle{font-size:28px;font-weight:700;letter-spacing:.12em;text-align:center;padding:16px;margin:16px 0;border:1px solid var(--ln);border-radius:var(--r,8px);background:var(--brume);color:var(--tx)}
.row.sans-clic{cursor:default;flex-wrap:wrap}
.row.sans-clic .cell{flex:1 1 220px}
.row.sans-clic:hover{background:transparent}
.ligne-recherche{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin:16px 0}
.ligne-recherche .field{flex:1 1 260px}
.onglets .badge{display:inline-block;vertical-align:middle;min-width:20px;margin-left:8px;padding:0 6px;border-radius:10px;background:var(--action);color:#fff;font-size:12px;line-height:20px;text-align:center}
.acces{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:0 16px 32px;max-width:780px}
.acces .liste-tete{padding-left:0}
.acces h2.rep{margin:8px 0 0}
.row .alertes{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.row:focus-visible{outline-offset:-3px}
.detail{border-left:1px solid var(--ln);padding:24px;background:var(--surface);align-content:start;display:grid;gap:16px;min-width:0}
.detail-tete{display:flex;gap:14px;align-items:center}
.detail-tete h2{font-size:20px;word-break:break-word}
.detail-tete .rep{margin-top:4px}
.retour-liste{display:none}
.champ-ligne{display:grid;grid-template-columns:1fr auto;gap:4px 8px;padding:12px 0;border-bottom:1px solid var(--ln);align-items:center}
.champ-lib{grid-column:1/-1;font:700 12px/1.3 RS,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--mu)}
.champ-val{min-width:0;word-break:break-word}
.champ-act{display:flex;gap:2px}
.notes{white-space:pre-wrap}
.meta{font-size:13px;color:var(--mu)}
.detail-actions{display:flex;gap:8px;flex-wrap:wrap}
.vide-liste{display:grid;justify-items:center;gap:8px;padding:48px 24px;text-align:center;color:var(--mu)}
.vide-liste h3{color:var(--tx)}
.pw .d{color:var(--link)}.pw .s{color:var(--alerte)}

/* fenêtres modales (dialog natif : piège de focus, Échap) */
.modale{border:1px solid var(--ln);border-radius:var(--r);padding:0;width:min(560px,calc(100vw - 24px));max-height:calc(100vh - 24px);background:var(--surface);color:var(--tx)}
.modale.large{width:min(720px,calc(100vw - 24px))}
.modale::backdrop{background:rgba(7,14,13,.62)}
.modale-tete{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 16px 8px 24px}
.modale-tete h2{font-size:20px}
.modale-corps{padding:8px 24px 24px;display:grid;gap:16px;overflow-y:auto;max-height:calc(100vh - 110px)}
.modale-corps h3{margin-top:8px}
.actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap;padding-top:8px}
.actions.gauche{justify-content:flex-start}
.apercu-mdp{padding:18px;border-radius:var(--r);background:var(--brume);font-size:20px;word-break:break-all;line-height:1.5}
.cases{display:grid;gap:10px}
.toasts{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:100;max-width:calc(100vw - 32px)}
.jauge{display:grid;gap:6px}
.jauge-ligne{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* tableaux (comptes, accès, journal) */
.tableau{width:100%;border-collapse:collapse;font-size:15px}
.tableau td,.tableau th{padding:10px 12px;text-align:left;vertical-align:middle;border-bottom:1px solid var(--ln)}
.tableau th{font:700 12px/1.3 RS,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--mu)}
.tableau td:last-child{text-align:right}
.tableau select{min-height:40px;border:1.5px solid var(--ctrl);border-radius:var(--r);background:var(--surface);color:var(--tx);padding:0 8px;font:400 15px RS,sans-serif}
.card.flush{padding:0;overflow:hidden}
.pad{padding:16px}
.admin-corps{display:grid;gap:16px;padding:0 16px}
.onglets{display:flex;gap:4px;padding:16px 16px 0;border-bottom:1px solid var(--ln);overflow-x:auto}
.onglets button{min-height:44px;padding:0 14px;white-space:nowrap;flex:0 0 auto;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--mu);font:700 13px/1 RS,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.onglets button.actif{color:var(--tx);border-bottom-color:var(--marque)}
.filtres{display:flex;gap:12px;flex-wrap:wrap}.filtres .input{min-width:220px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.kpi{display:grid;gap:8px;padding:20px}
.num.grand{font-size:44px;line-height:1}
.sante{display:grid;gap:16px;padding:0 16px}
.sante .liste-tete{padding-left:0}
.menu{position:relative;display:inline-block;text-align:left}
.menu summary{list-style:none;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;padding:0 12px;border-radius:var(--r);font:700 12px/1 RS,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--link)}
.menu summary:hover{background:var(--brume)}
.menu summary::-webkit-details-marker{display:none}
.menu-liste{position:absolute;right:0;top:100%;z-index:20;min-width:260px;padding:6px;border:1px solid var(--ln);border-radius:var(--r);background:var(--surface);display:grid}
.menu-item{min-height:44px;padding:0 12px;border:0;border-radius:var(--r-s);background:transparent;color:var(--tx);font:400 15px RS,sans-serif;text-align:left;cursor:pointer}
.menu-item:hover{background:var(--brume)}.menu-item.danger{color:var(--danger)}
.lien-invitation{padding:14px;border-radius:var(--r);background:var(--brume);word-break:break-all}

/* page vide / 404 */
.vide{min-height:100vh;display:grid;place-content:center;justify-items:center;gap:16px;padding:32px 16px;text-align:center}
.vide p{color:var(--mu);max-width:48ch}

/* petits écrans : navigation en tiroir, détail à la place de la liste */
@media (max-width:1100px){.zone{grid-template-columns:minmax(0,1fr) 360px}}
@media (max-width:900px){
  .coffre{grid-template-columns:1fr}
  .coffre .nav{position:fixed;inset:0 auto 0 0;width:min(320px,88vw);z-index:30;transform:translateX(-102%);transition:transform 200ms var(--ease-out)}
  .coffre .nav.ouvert{transform:none}
  .menu-nav{display:inline-grid}
  .barre{padding:8px 12px;flex-wrap:wrap}
  .barre .recherche{order:5;flex-basis:100%;max-width:none}
  .zone{grid-template-columns:1fr}
  .zone .detail{display:none;border-left:0}
  .principal.avec-detail .zone .liste{display:none}
  .principal.avec-detail .zone .detail{display:grid}
  .retour-liste{display:inline-grid;justify-self:start}
  .kpis{grid-template-columns:1fr}
  .tableau.large thead{display:none}
}
@media (prefers-reduced-motion:reduce){.coffre .nav{transition:none}}