/* TWIIN 0.4 : rose (le client, l'action), menthe (le jumeau : ce que fait l'IA), sur un fond clair ou sombre.
   Toutes les couleurs sont des jetons définis ici (thème clair dans :root, sombre selon le système ou le choix
   explicite) ; aucune couleur n'est écrite en dur ailleurs. Contrastes vérifiés par calcul : texte ≥ 4,5:1 sur
   chaque fond où il est posé, bordures de champ ≥ 3:1. Unbounded reste réservée au nom TWIIN et aux titres d'écran. */
@font-face{font-family:'Unbounded';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/unbounded-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Unbounded';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/unbounded-latin-600-normal.woff2) format('woff2')}
:root{
  --win:#FFFFFF;--side:#F4F2F6;--bar:#FBFAFC;--sunk:#F3F1F5;--card:#FFFFFF;--hover:#F7F5F9;
  --fg:#1C1B1F;--fg2:#5B5963;--fg3:#6B6973;--sep:#E4E1E8;--sep2:#ECEAEF;--field:#8A8792;
  --accent:#B0185A;--accent-fg:#FFFFFF;--accent-soft:#FCE9F1;--accent-line:#F1BCD2;
  --twin:#0F7A62;--twin-bg:#E1F4EE;
  --ok:#1E7B3C;--ok-bg:#E3F4E8;--warn:#8F5200;--warn-bg:#FFF1DB;--err:#B3261E;--err-bg:#FDE7E5;--info:#1F5FAD;--info-bg:#E5EEFA;
  --idee:#5B5963;--idee-bg:#EFEDF2;
  /* Séries des graphiques (répartition par IA, monogrammes) : ≥ 3:1 sur le fond des cartes. */
  --serie-1:#6D5BD0;--serie-2:#B0185A;--serie-3:#0F7F72;--serie-4:#B4561A;--serie-5:#1F6FB0;--serie-6:#8A6A00;--serie-7:#4A7A2A;--serie-8:#C2413E;--serie-9:#6E6862;--serie-10:#167C96;
  /* Fonds qui ne suivent pas le thème : vidéos (bandes noires), aperçu d'un site, QR code. */
  --media-bg:#000000;--papier:#FFFFFF;
  --scrim:rgba(20,10,25,.32);
  --shadow-card:0 1px 2px rgba(40,20,50,.06),0 4px 14px rgba(40,20,50,.05);
  --shadow-pop:0 18px 48px rgba(40,20,50,.22),0 2px 6px rgba(40,20,50,.1);
  --font:"Segoe UI Variable Text","Segoe UI",-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;
  --display:'Unbounded',"Segoe UI Variable Display","Segoe UI",-apple-system,system-ui,sans-serif;
  --mono-font:ui-monospace,"Cascadia Mono",Consolas,"SF Mono",Menlo,monospace;
  --r-s:7px;--r-m:12px;--r-l:16px;
  /* Anciens noms, gardés pour les écrans qui les utilisent encore. */
  --bg:var(--win);--txt:var(--fg);--muted:var(--fg2);--line:var(--sep);--line2:var(--sep2);--card2:var(--sunk);--accent-ink:var(--accent-fg);--accent-bg:var(--accent-soft);
  color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --win:#1C1C1F;--side:#232326;--bar:#212124;--sunk:#29292D;--card:#242428;--hover:#2C2C31;
  --fg:#F3F2F5;--fg2:#B6B4BD;--fg3:#A4A2AB;--sep:#36353B;--sep2:#2F2E34;--field:#86848D;
  --accent:#FF7EB0;--accent-fg:#1A0F14;--accent-soft:#3A2030;--accent-line:#6B3550;
  --twin:#6FDDBE;--twin-bg:#16302A;
  --ok:#7FD69C;--ok-bg:#1B3323;--warn:#FFC46B;--warn-bg:#3A2C15;--err:#FF9DA8;--err-bg:#3D1C21;--info:#8CC2FF;--info-bg:#1C2A3D;
  --idee:#C4C2CA;--idee-bg:#323136;
  --serie-1:#A99BFA;--serie-2:#FF7EB0;--serie-3:#5ED3C5;--serie-4:#F4A261;--serie-5:#6FB6E8;--serie-6:#E9C46A;--serie-7:#A3CF7F;--serie-8:#F28B88;--serie-9:#C9C2B8;--serie-10:#7FD1E8;
  --scrim:rgba(0,0,0,.55);
  --shadow-card:0 1px 2px rgba(0,0,0,.3);--shadow-pop:0 18px 48px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.4);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --win:#1C1C1F;--side:#232326;--bar:#212124;--sunk:#29292D;--card:#242428;--hover:#2C2C31;
  --fg:#F3F2F5;--fg2:#B6B4BD;--fg3:#A4A2AB;--sep:#36353B;--sep2:#2F2E34;--field:#86848D;
  --accent:#FF7EB0;--accent-fg:#1A0F14;--accent-soft:#3A2030;--accent-line:#6B3550;
  --twin:#6FDDBE;--twin-bg:#16302A;
  --ok:#7FD69C;--ok-bg:#1B3323;--warn:#FFC46B;--warn-bg:#3A2C15;--err:#FF9DA8;--err-bg:#3D1C21;--info:#8CC2FF;--info-bg:#1C2A3D;
  --idee:#C4C2CA;--idee-bg:#323136;
  --serie-1:#A99BFA;--serie-2:#FF7EB0;--serie-3:#5ED3C5;--serie-4:#F4A261;--serie-5:#6FB6E8;--serie-6:#E9C46A;--serie-7:#A3CF7F;--serie-8:#F28B88;--serie-9:#C9C2B8;--serie-10:#7FD1E8;
  --scrim:rgba(0,0,0,.55);
  --shadow-card:0 1px 2px rgba(0,0,0,.3);--shadow-pop:0 18px 48px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.4);
  color-scheme:dark}
*{box-sizing:border-box}
html{color-scheme:light dark}
body{margin:0;background:var(--win);color:var(--fg);font:14px/1.5 var(--font);-webkit-font-smoothing:antialiased}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* Images, vidéos et aperçus : jamais inversés ni teintés par le thème. */
img,video,canvas,iframe{color-scheme:normal}

/* ---------- Coquille : barre latérale, barre d'outils, zone principale ---------- */
/* La barre latérale reste collée en haut (défilement propre) ; le fond de sa colonne court sur toute la hauteur de la
   page, même quand celle-ci dépasse la fenêtre (captures pleine page, impression, longs écrans). */
#app{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh;background:linear-gradient(to right,var(--side) 0 231px,var(--sep) 231px 232px,transparent 232px)}
#nav{position:sticky;top:0;height:100vh;overflow-y:auto;background:var(--side);border-right:1px solid var(--sep);padding:12px 10px;display:flex;flex-direction:column;gap:2px;z-index:25}
#zone{display:flex;flex-direction:column;min-width:0}
#barre{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:8px 20px;min-height:54px;background:var(--bar);border-bottom:1px solid var(--sep);flex-wrap:wrap}
#barre:empty{display:none}
#main{min-width:0;padding:26px 32px 48px;max-width:1180px;width:100%}
#main:focus{outline:none}
h1{margin:0 0 6px;font-family:var(--display);font-size:24px;font-weight:600;letter-spacing:-.01em;text-wrap:balance}
h2{margin:0;font-size:17px;font-weight:600}
h3{margin:0;font-size:16px;font-weight:600}
a{color:var(--accent)}
.muted{color:var(--fg2)}.small{font-size:12.5px}.lab{font-size:11px;font-weight:600;color:var(--fg3);letter-spacing:.05em;text-transform:uppercase}
.brand{display:flex;align-items:center;gap:10px;padding:4px 8px 14px}
.brand img.wordmark{height:20px;width:auto}
.logo{width:28px;height:28px;border-radius:8px;display:block;flex:none}
/* Logo : version claire ou sombre selon le thème affiché. */
.si-sombre{display:none!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .si-clair{display:none!important}:root:not([data-theme="light"]) .si-sombre{display:block!important}}
:root[data-theme="dark"] .si-clair{display:none!important}:root[data-theme="dark"] .si-sombre{display:block!important}

.navbtn{display:flex;align-items:center;gap:11px;min-height:36px;padding:6px 10px;border:0;border-radius:8px;background:transparent;color:var(--fg);text-align:left;font:inherit;font-size:14px;font-weight:400;cursor:pointer;width:100%;height:auto}
.navbtn:hover{background:var(--hover)}
.ico{display:inline-grid;place-items:center;flex:none;line-height:0}
.navbtn svg{width:18px;height:18px;flex:none;stroke:var(--fg2);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.navbtn .nav-lib{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.navbtn.on,.navbtn[aria-current="page"]{background:var(--card);font-weight:600;box-shadow:var(--shadow-card)}
.navbtn.on svg{stroke:var(--accent)}
.navbtn.contient svg{stroke:var(--accent)}
.navbtn .chev{font-size:10px;color:var(--fg3);transition:transform .12s}
.navbtn[aria-expanded="true"] .chev{transform:rotate(90deg)}
.navsec{padding:12px 10px 4px}
.nav-outils{display:flex;flex-direction:column;gap:1px;padding-left:6px}
.nav-ligne{display:flex;align-items:center;gap:2px}
.nav-ligne .navbtn{flex:1;min-width:0}
.nav-pied{margin-top:auto;padding-top:10px;border-top:1px solid var(--sep);display:flex;flex-direction:column;gap:2px}
.compte-btn{gap:10px}
.avatar{width:26px;height:26px;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;font-weight:700;background:var(--accent-soft);color:var(--accent);flex:none}
.compte-menu{position:fixed;z-index:60;background:var(--win);border:1px solid var(--sep);border-radius:var(--r-l);box-shadow:var(--shadow-pop);width:260px;padding:8px;display:flex;flex-direction:column;gap:2px}
.compte-menu[hidden]{display:none}
.compte-menu .qui{padding:6px 10px 8px;border-bottom:1px solid var(--sep2);margin-bottom:4px;display:flex;flex-direction:column}
.compte-menu .navbtn{min-height:34px}
.compte-menu .lab{padding:8px 10px 4px}
.compte-menu .segment{margin:0 8px 6px}

/* Barre d'outils : client actif, recherche, idée */
.clientsw{display:flex;align-items:center;gap:9px;border:1px solid var(--sep);background:var(--card);border-radius:10px;padding:4px 12px 4px 4px;cursor:pointer;min-height:38px;height:auto;box-shadow:var(--shadow-card);color:var(--fg);max-width:min(360px,100%)}
.clientsw:hover{background:var(--hover)}
.clientsw b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clientsw .chev{color:var(--fg3);font-size:10px}
.monogramme{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-weight:700;font-size:13px;flex:none;color:var(--fg);background:color-mix(in srgb,var(--mono-c,var(--accent)) 24%,var(--card));border:1px solid color-mix(in srgb,var(--mono-c,var(--accent)) 55%,var(--card))}
.compteur{margin-left:auto;min-width:20px;font-size:12px;font-weight:700;background:var(--accent);color:var(--accent-fg);border-radius:10px;padding:0 7px;line-height:19px;text-align:center}
.barre-espace{flex:1}
.barre-recherche{display:flex;flex-direction:row;align-items:center;gap:6px;font-size:13px;border:1px solid var(--field);border-radius:8px;padding:0 10px;min-height:34px;background:var(--win);color:var(--fg3);min-width:200px;flex:0 1 280px}
.barre-recherche svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.barre-recherche input{border:0;background:transparent;min-height:32px;height:32px;padding:0;color:var(--fg);flex:1;min-width:0}
.barre-recherche[hidden]{display:none}
.barre-recherche input:focus{outline:none}
.barre-recherche:focus-within{outline:3px solid var(--accent);outline-offset:1px}


/* Choix segmenté (thème) */
.segment{display:inline-flex;gap:3px;border:1px solid var(--sep);border-radius:9px;padding:3px;background:var(--sunk);flex-wrap:wrap}
.segment-choix{flex-direction:row;align-items:center;gap:0;font-size:13px;color:var(--fg);cursor:pointer}
.segment-choix input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.segment-choix span{display:block;border-radius:7px;padding:4px 13px;min-height:28px;line-height:20px}
.segment-choix input:checked+span{background:var(--win);box-shadow:var(--shadow-card);font-weight:600}
.segment-choix input:focus-visible+span{outline:3px solid var(--accent);outline-offset:1px}

/* Pastille de statut : point plus libellé, jamais la couleur seule */
.pastille{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:650;border-radius:20px;padding:2px 9px 2px 8px;line-height:18px;white-space:nowrap}
.pastille i{width:7px;height:7px;border-radius:50%;background:currentColor;display:block}
.p-idee{background:var(--idee-bg);color:var(--idee)}.p-info{background:var(--info-bg);color:var(--info)}.p-warn{background:var(--warn-bg);color:var(--warn)}
.p-acc{background:var(--accent-soft);color:var(--accent)}.p-ok{background:var(--ok-bg);color:var(--ok)}.p-err{background:var(--err-bg);color:var(--err)}.p-twin{background:var(--twin-bg);color:var(--twin)}

/* Bandeau persistant : ce qui s'est passé, ce que ça change, à faire ; détail technique replié */
.bandeau{border-radius:var(--r-m);padding:12px 14px;display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;border:1px solid;margin-bottom:16px;color:var(--fg)}
.bandeau-texte{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:2px}
.bandeau-afaire{font-weight:600}
.b-erreur{background:var(--err-bg);border-color:var(--err)}.b-erreur>.bandeau-texte>b{color:var(--err)}
.b-attention{background:var(--warn-bg);border-color:var(--warn)}.b-attention>.bandeau-texte>b{color:var(--warn)}
.b-info{background:var(--info-bg);border-color:var(--info)}.b-info>.bandeau-texte>b{color:var(--info)}
.b-succes{background:var(--ok-bg);border-color:var(--ok)}.b-succes>.bandeau-texte>b{color:var(--ok)}
details.tech{font-size:12.5px;color:var(--fg2)}details.tech summary{cursor:pointer}details.tech code{font-family:var(--mono-font);font-size:12px;overflow-wrap:anywhere}
.bandeau-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* État vide (ce qui apparaîtra ici, et l'action qui le remplit) et chargement d'une zone */
.etat-vide{background:var(--card);border:1px dashed var(--sep2);border-radius:var(--r-l);padding:22px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.etat-vide h2{margin:0}.etat-vide p{margin:0}
.card .etat-vide{border:0;background:none;padding:6px 0}
.squelette{display:flex;flex-direction:column;gap:10px}
.squelette-ligne{height:46px;border-radius:var(--r-m);background:var(--sunk)}

/* Feuille (fenêtre de décision) et champ */
dialog.feuille{max-width:540px}
.feuille-corps{display:flex;flex-direction:column;gap:12px}
.feuille-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:4px}
.champ{display:flex;flex-direction:column;gap:4px}
.champ>label{display:block;font-size:13px;color:var(--fg2)}
.champ-erreur{color:var(--err)}
input[aria-invalid]{border-color:var(--err)}

.badge{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--accent);color:var(--accent-fg);font-size:12px;font-weight:700;display:inline-grid;place-items:center;margin-left:auto}
.card{background:var(--card);border:1px solid var(--sep);box-shadow:var(--shadow-card);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.between{justify-content:space-between}
.grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
div.grid{margin-bottom:16px}
.sub{background:var(--sunk);border:1px solid var(--line2);border-radius:10px;padding:12px}
button,.btn{font:inherit;cursor:pointer;height:38px;padding:0 14px;border-radius:9px;border:1px solid var(--line);background:var(--card);color:var(--fg);font-weight:550;display:inline-flex;align-items:center;gap:6px;text-decoration:none}
button:not(.navbtn):hover:not(:disabled){background:var(--hover)}
button:disabled{color:var(--fg3);background:var(--sunk);border-color:var(--sep);cursor:not-allowed}
.primary,button.primary:hover:not(:disabled){background:var(--accent);color:var(--accent-fg);border:1px solid var(--accent);font-weight:600}
button.primary:hover:not(:disabled){filter:brightness(1.06)}
button.primary:disabled{background:var(--sunk);color:var(--fg3);border-color:var(--sep)}
.destructif,button.destructif:hover:not(:disabled){background:var(--err);color:var(--win);border:1px solid var(--err);font-weight:600}
.ghost,button.ghost:hover:not(:disabled){background:transparent;border-color:transparent;color:var(--accent)}
button.ghost:hover:not(:disabled){text-decoration:underline}
.danger{color:var(--err)}
input,select,textarea{font:inherit;color:var(--fg);background:var(--win);border:1px solid var(--field);border-radius:9px;padding:8px 10px;min-height:38px;width:100%}
textarea{resize:vertical;min-height:70px}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.chip{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:12px;background:var(--sunk);color:var(--fg);font-size:12px;font-weight:500}
.c-ok{background:var(--ok-bg);color:var(--ok)}.c-warn{background:var(--warn-bg);color:var(--warn)}.c-err{background:var(--err-bg);color:var(--err)}.c-info{background:var(--info-bg);color:var(--info)}.c-acc{background:var(--accent-bg);color:var(--accent)}
.banner{border-radius:12px;padding:12px 14px;font-size:13px}
.pill{min-height:34px;padding:6px 14px;border-radius:9px;border:1px solid var(--sep);background:var(--card);color:var(--fg);font-weight:600}
.pill.on,.pill.on:hover:not(:disabled){border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px}
.col{flex:0 0 220px;background:var(--side);border:1px solid var(--line2);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px}
.item{text-align:left;height:auto;padding:10px;display:flex;flex-direction:column;gap:3px;align-items:flex-start;width:100%}
.scene{display:flex;flex-wrap:wrap;gap:16px}
.thumb{flex:0 0 110px;height:180px;border-radius:12px;background:var(--sunk);border:1px solid var(--sep);display:grid;place-items:center;text-align:center;padding:8px;font-size:12px;overflow:hidden}
.kv{display:grid;grid-template-columns:110px minmax(0,1fr);gap:6px 12px;font-size:13px;flex:1 1 360px;min-width:0}
.player{flex:0 0 280px}.player video,.player img{width:100%;border-radius:14px;background:var(--media-bg);display:block}
.sticky{position:sticky;bottom:12px;background:var(--card);border:1px solid var(--sep);border-radius:14px;padding:12px 16px;box-shadow:var(--shadow-pop);display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;z-index:5}
table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;color:var(--muted);font-weight:500;padding:8px 6px}td{padding:9px 6px;border-top:1px solid var(--line2)}
.scroll{overflow-x:auto}
pre{white-space:pre-wrap;background:var(--sunk);border:1px solid var(--line2);border-radius:10px;padding:12px;font-size:12px;margin:0}
#toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);max-width:90%;padding:12px 18px;border-radius:12px;background:var(--fg);color:var(--win);font-weight:500;box-shadow:var(--shadow-pop);opacity:0;pointer-events:none;transition:opacity .2s;z-index:20}
#toast.show{opacity:1}
dialog{background:var(--win);color:var(--fg);border:1px solid var(--sep);border-radius:14px;padding:22px;max-width:520px;width:92%;box-shadow:var(--shadow-pop)}
dialog::backdrop{background:var(--scrim)}
.tabs{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--line2);padding-bottom:10px;margin-bottom:14px}
@media (max-width:700px){#main{padding:16px}.kv{grid-template-columns:1fr}}
.card.scene{flex-direction:row;align-items:flex-start}
.kv{align-content:start}
label .chip,.card>.chip{align-self:flex-start}

/* Bible guidée, entretiens, assistant */
.stack{display:flex;flex-direction:column;gap:10px}
.field{display:flex;flex-direction:column;gap:6px;padding:14px 0;border-top:1px solid var(--line2)}
.field:first-of-type{border-top:0}
.subcard{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--card2)}
label.check{flex-direction:row;align-items:center;gap:8px;color:var(--txt)}
label.check input{width:auto;min-height:0}
label.option{align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
label.option input{margin-top:4px}
label.mini{flex:0 1 160px}
.pill .badge{margin-left:6px}
.prop{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--card2)}
.prop.accepte{border-color:var(--ok)}
.prop.rejete{opacity:.55}
.quote{margin:0;padding:8px 12px;border-left:3px solid var(--accent);background:var(--accent-bg);border-radius:0 8px 8px 0;font-style:italic;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.steps{margin:4px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:4px}

.dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:22px 16px;border:1.5px dashed var(--line);border-radius:12px;background:var(--card2);text-align:center;cursor:pointer;color:var(--txt);transition:border-color .15s,background .15s}
.dropzone:hover,.dropzone:focus-visible{border-color:var(--accent);outline:none}
.dropzone.over{border-color:var(--accent);background:var(--accent-bg)}
.dropzone.busy{opacity:.6;pointer-events:none}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:reduce){.dropzone{transition:none}}

.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;align-items:stretch}
.grid2.stats-groupes{grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr))}
.recbox{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--card2)}
.recbox.on{border-color:var(--err)}
.recdot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--err);margin-right:8px;animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}
.recnav{color:var(--err)}
.mono{font-family:var(--mono-font)}
@media (prefers-reduced-motion:reduce){.recdot{animation:none}}

/* Fenêtre étroite (≤ 900 px, la largeur minimale de l'application) : la barre latérale se replie en icônes ; elle se
   déplie par-dessus l'écran au survol ou au clavier. Aucun défilement horizontal. */
#bottombar{display:none}
@media (max-width:900px){
  #app{grid-template-columns:60px minmax(0,1fr);background:linear-gradient(to right,var(--side) 0 59px,var(--sep) 59px 60px,transparent 60px)}
  #nav{position:fixed;left:0;top:0;bottom:0;width:60px;overflow-x:hidden;transition:width .12s;padding:12px 8px}
  #nav .nav-lib,#nav .navsec,#nav .brand .wordmark,#nav .chev,#nav .badge{display:none}
  /* Le logo du thème sombre est forcé visible (.si-sombre !important) : on le masque aussi, barre repliée. */
  body:not(.menu-ouvert) #nav:not(:hover):not(:has(:focus-visible)) .brand .wordmark{display:none!important}
  #nav .navbtn{justify-content:center;padding:6px 0}
  #nav .brand{justify-content:center;padding:4px 0 14px}
  #nav .nav-outils{padding-left:0}
  #nav:hover,#nav:has(:focus-visible){width:232px;box-shadow:var(--shadow-pop);padding:12px 10px}
  #nav:hover .nav-lib,#nav:has(:focus-visible) .nav-lib,#nav:hover .navsec,#nav:has(:focus-visible) .navsec,#nav:hover .brand .wordmark,#nav:has(:focus-visible) .brand .wordmark,#nav:hover .chev,#nav:has(:focus-visible) .chev,#nav:hover .badge,#nav:has(:focus-visible) .badge{display:revert}
  #nav:hover .navbtn,#nav:has(:focus-visible) .navbtn{justify-content:flex-start;padding:6px 10px}
  #nav:hover .brand,#nav:has(:focus-visible) .brand{justify-content:flex-start;padding:4px 8px 14px}
  #nav:hover .nav-outils,#nav:has(:focus-visible) .nav-outils{padding-left:6px}
  #zone{grid-column:2}
  #barre{padding:8px 14px}
  .barre-recherche{min-width:0;flex:1 1 160px}
  #main{padding:20px 20px 40px}
}
/* Téléphone (studio ouvert dans un navigateur) : barre basse de 4 entrées, menu complet derrière « Plus ». */
@media (max-width:640px){
  #app{display:block;background:none}
  #nav{display:none}
  body.menu-ouvert #nav{display:flex;position:fixed;inset:0 0 56px 0;width:auto;z-index:40}
  body.menu-ouvert #nav .nav-lib,body.menu-ouvert #nav .navsec,body.menu-ouvert #nav .brand .wordmark,body.menu-ouvert #nav .chev,body.menu-ouvert #nav .badge{display:revert}
  body.menu-ouvert #nav .navbtn{justify-content:flex-start;padding:6px 10px}
  #main{padding:16px 16px 84px}
  #bottombar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--side);border-top:1px solid var(--sep);padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px))}
  #bottombar button{flex:1 1 0;min-height:44px;white-space:nowrap;font-size:13px;padding:0 4px;background:none;border:0;color:var(--fg2);font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px}
  #bottombar button.on{color:var(--accent)}
  .sticky{bottom:68px}
  .row.between{flex-wrap:wrap}
  .player{flex:1 1 100%}
  .player video,.player img{max-height:60vh;object-fit:contain}
  .kanban{flex-direction:column;overflow-x:visible}
  .kanban .col{flex:1 1 auto}
  .kanban .col.folded{flex-direction:row;writing-mode:horizontal-tb;min-height:0;padding:8px 12px}
}


/* Panneau des anciennes versions, ouvert à côté du formulaire */
.versions{position:fixed;top:0;right:0;bottom:0;width:min(520px,100vw);z-index:40;background:var(--side);border-left:1px solid var(--line);box-shadow:var(--shadow-pop);padding:20px max(16px,env(safe-area-inset-right,0px)) 24px 20px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}
.verlist{display:flex;flex-wrap:wrap;gap:6px}
.verfield{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--line2);border-radius:10px;background:var(--card)}
.verfield.changed{border-color:var(--warn)}
.pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}
@media (min-width:1300px){body:has(.versions) #main{margin-right:520px}}

.savebar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.savebar.dirty{border-color:var(--warn)}
.savebar.dirty > span{color:var(--warn)}

/* Boîte À faire, bandeau Claude, tri, tableau replié, premiers pas */
.claudebar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;margin-bottom:16px;border-radius:12px;background:var(--twin-bg);border:1px solid var(--twin);color:var(--txt);font-size:13.5px}
.claudebar.done{background:var(--twin-bg);border-color:var(--twin);box-shadow:0 0 0 3px color-mix(in srgb,var(--twin) 18%,transparent)}
.c-twin{background:var(--twin-bg);color:var(--twin)}
.card.pick{cursor:pointer}
.card.pick.off{opacity:.55}
.card.compact{padding:12px 16px}
.card.conflict{border-color:var(--warn)}
.kanban .col{flex:1 1 140px;min-width:140px}
.kanban .col.folded{flex:0 0 40px;min-width:40px;padding:10px 6px;align-items:center;justify-content:flex-start;gap:8px;writing-mode:vertical-rl;cursor:pointer;color:var(--muted);height:auto;min-height:160px}
.tick{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;margin-right:8px;font-size:12px;font-weight:700;background:var(--warn-bg);color:var(--warn)}
.tick.ok{background:var(--ok-bg);color:var(--ok)}
.tick.info{background:var(--info-bg);color:var(--info)}
@media (max-width:760px){
  .kanban .col{flex:1 1 auto;min-width:0}
  .kanban .col.folded{flex:1 1 auto;flex-direction:row;writing-mode:horizontal-tb;min-height:0;padding:8px 12px;justify-content:space-between}
}

/* Calendrier en grille */
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.calhead{font-size:12px;color:var(--muted);text-align:center;padding:4px 0;font-weight:600}
.calday{min-height:96px;background:var(--card);border:1px solid var(--line2);border-radius:8px;padding:4px;display:flex;flex-direction:column;gap:3px;min-width:0}
.calday.out{background:transparent;border-style:dashed}.calday.out .calnum{color:var(--fg3)}
.calday.today{border-color:var(--accent)}
.calnum{font-size:12px;color:var(--muted)}
.calitem{all:unset;cursor:pointer;font-size:11px;line-height:1.3;padding:2px 5px;border-radius:5px;background:var(--card2);border-left:3px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.calitem:focus-visible{outline:2px solid var(--accent)}
.calitem.b-toi{border-color:var(--accent)}.calitem.b-claude{border-color:var(--twin)}.calitem.b-studio{border-color:var(--info)}.calitem.b-client{border-color:var(--warn)}.calitem.b-prevu{border-color:var(--ok)}.calitem.b-publie{border-color:var(--fg3);color:var(--fg2)}
.calitem.dotted{border-left-style:dotted;background:transparent;outline:1px dashed var(--line);outline-offset:-1px}
.calitem.late{box-shadow:inset 0 0 0 1px var(--err)}
.calsub{display:block;font-size:10.5px;color:var(--muted)}
.calday{cursor:pointer}.calday.past:not(.today){background:var(--side)}
.calfree{font-size:10.5px;color:var(--muted);border:1px dashed var(--line);border-radius:5px;padding:1px 5px;align-self:flex-start;cursor:pointer}
.cal.week{grid-template-columns:repeat(7,minmax(0,1fr))}.cal.week .calday{min-height:260px}.cal.week .calitem{white-space:normal}
.agenda{display:none;flex-direction:column;gap:8px}
.agday{background:var(--card);border:1px solid var(--line2);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px}.agday.today{border-color:var(--accent)}
.agday .calitem{white-space:normal;font-size:13px;padding:6px 8px}
.legend{gap:8px;flex-wrap:wrap}
@media (max-width:760px){.cal{display:none}.agenda{display:flex}}

.tabgroup{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.tabgroup .tabs{margin:0}

.card.stat{gap:2px;padding:14px 16px;margin:0}

/* Aide : questions fréquentes */
.wikihead{gap:10px}
.wikihead input[type=search]{width:100%}
.wikicat{gap:0;padding-bottom:6px}
.wikicat h2{margin-bottom:6px}
.wikicat details{border-top:1px solid var(--sep);padding:10px 0}
.wikicat summary{cursor:pointer;font-weight:600;list-style-position:outside}
.wikirep{padding:8px 0 2px 2px;max-width:72ch}
.wikirep p{margin:0 0 8px}
.wikios{border-left:3px solid var(--accent);padding:4px 0 2px 12px;margin:4px 0 8px}
.wikios .lab{display:block;margin-bottom:4px}

/* Vidéos du client et post texte */
.transcript{max-height:360px;overflow:auto;display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:10px;padding:6px}
.tline{justify-content:flex-start;text-align:left;height:auto;padding:6px 8px;font-weight:400;white-space:normal;line-height:1.45}
.postpreview{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:18px;max-width:560px;display:flex;flex-direction:column;gap:8px}
.scene .player{max-height:320px;margin-top:6px}

/* À faire */
.card.urgent{border-color:var(--err);box-shadow:inset 3px 0 0 var(--err)}
.urgent-tag{color:var(--warn);font-weight:600}
.linkish{background:none;border:0;padding:0;margin:0;height:auto;min-height:0;text-align:left;color:inherit;font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;gap:2px;flex:1 1 320px;min-width:0}
.linkish:hover b{text-decoration:underline}
.linkish.inline{display:inline;color:var(--accent);text-decoration:underline}
.todoline{align-items:center}
button.chip{cursor:pointer;border:0}

/* Contenus : liste filtrable */
.filters{gap:10px}.filters .row{gap:8px}.filters input[type=search]{flex:1 1 260px}
.filters select{flex:0 1 auto;width:auto;min-width:150px}
.seg{display:flex;gap:6px}
.ctable td,.ctable th{vertical-align:top}
.ctable tr.grp td{background:var(--card2);font-weight:600;font-size:12.5px;letter-spacing:.03em;color:var(--muted);text-transform:uppercase}
.ctable tr.clickable{cursor:pointer}.ctable tr.clickable:hover td{background:var(--hover)}
.ctable tr.clickable:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.nowrap{white-space:nowrap}
th.sortable{cursor:pointer}
.late{color:var(--warn);font-weight:600}
@media (max-width:700px){.ctable thead{display:none}.ctable,.ctable tbody,.ctable tr,.ctable td{display:block;width:100%}.ctable tr.clickable{border-bottom:1px solid var(--line);padding:8px 0}.ctable td{border:0;padding:2px 10px}.ctable{min-width:0}}

/* Statistiques */
.gauge{height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:6px}.gauge span{display:block;height:100%;background:var(--ok)}.gauge span.warn{background:var(--warn)}.gauge span.over{background:var(--err)}
.chartbox{overflow-x:auto}.chart{width:100%;max-width:820px;min-width:520px;height:auto;display:block}
.chart .grid{stroke:var(--line);stroke-width:1}.chart .ax{fill:var(--muted);font-size:11px;font-family:inherit}
.chart .line{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linejoin:round}.chart .area{fill:var(--accent);opacity:.12}.chart .dot{fill:var(--accent)}

#toast.withaction{pointer-events:auto;display:flex;align-items:center;gap:12px}
#toast.withaction button{background:transparent;color:inherit;border:1px solid currentColor;height:30px}
.ctable td.nowrap .ghost.small{padding-top:0;height:auto;min-height:0}
.chip{white-space:nowrap}
input[type=radio],input[type=checkbox]{width:auto;min-height:0;height:auto;accent-color:var(--accent)}
.row>select{width:auto;flex:0 1 auto}
.agday .linkish{flex:none}
.navbtn.quit{margin-top:auto;color:var(--muted)}
.quitscreen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px}
.quitscreen p{max-width:46ch}

/* Planifier : genres et continuité */
.genres{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:8px}
.genre{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line2);border-radius:10px;background:var(--card2)}
.genre.on{border-color:var(--accent)}
.genre button{min-height:30px;height:30px;padding:0 10px}
.thumb{padding:0;width:64px;height:64px;border-radius:8px;overflow:hidden;border:2px solid transparent;background:var(--card2)}
.thumb.on{border-color:var(--accent)}.thumb img{width:100%;height:100%;object-fit:cover;display:block}
/* Agence : tuiles de synthèse et tableau des clients */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:4px}
.tile b{font-family:var(--display);font-size:22px;font-weight:600}
.tile.acc{border-color:var(--accent)}.tile.acc b{color:var(--accent)}.tile.warn{border-color:var(--warn)}.tile.warn b{color:var(--warn)}
table.agence tr.clic{cursor:pointer}table.agence tr.clic:hover td{background:var(--card2)}table.agence td{vertical-align:top}
/* Assistant : liste des conversations à gauche, fil et saisie à droite */
.chat{display:grid;grid-template-columns:220px 1fr;gap:14px;min-height:420px}
.chatlist{display:flex;flex-direction:column;gap:6px;max-height:640px;overflow-y:auto}
.chatitem{display:grid;grid-template-columns:1fr auto;gap:2px 6px;padding:8px 10px;border-radius:10px;border:1px solid var(--line2);cursor:pointer}
.chatitem>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.chatitem>span.small{grid-column:1}.chatitem>button{grid-column:2;grid-row:1/span 2;height:28px;padding:0 8px;align-self:center}
.chatitem.on{border-color:var(--accent);background:var(--accent-bg)}.chatitem:hover{background:var(--card2)}
.chatmain{display:flex;flex-direction:column;gap:10px;min-width:0}
.chatfil{flex:1;display:flex;flex-direction:column;gap:12px;max-height:560px;min-height:300px;overflow-y:auto;padding:4px 2px}
.msg{display:flex;flex-direction:column;gap:4px;max-width:85%}.msg.moi{align-self:flex-end;align-items:flex-end}
.msg .bul{white-space:pre-wrap;line-height:1.5;padding:10px 12px;border-radius:12px;background:var(--card2);font-size:14px;overflow-wrap:anywhere}
.msg.moi .bul{background:var(--accent-bg)}.msg.err .bul{background:var(--err-bg);color:var(--err)}
.chatin{display:flex;gap:8px;align-items:flex-end}.chatin textarea{min-height:60px}.chatin button{flex:none}
@media (max-width:760px){.chat{grid-template-columns:1fr}.chatlist{max-height:180px}.msg{max-width:100%}}
/* Modifications de la Bible proposées par Claude : ce qui serait retiré et ajouté */
.modif{border:1px solid var(--accent);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;background:var(--card);max-width:85%}
.chatfil .modif{align-self:flex-start}.card .modif{max-width:none}
.modif.appliquee{border-color:var(--line)}.modif.refusee{border-color:var(--line);opacity:.75}
.diff ul{margin:4px 0 0;padding-left:18px;font-size:13px;line-height:1.5}
.diff.moins li{color:var(--err);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--err) 50%,transparent)}.diff.plus li{color:var(--ok)}

/* HighLevel intégré : la vue de l'application se pose sur cette zone */
.ghlbar { gap: 6px; margin-bottom: 8px; align-items: center; flex-wrap: wrap; }
.ghlzone { width: 100%; min-height: 300px; border-radius: 10px; background: var(--card); border: 1px solid var(--sep); }

/* Relevé des coûts : répartition par IA */
.releve-nav { gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 10px; }
.releve-titre { min-width: 0; text-transform: capitalize; }
.iabar { display: flex; height: 12px; min-width: 140px; border-radius: 6px; overflow: hidden; background: var(--sunk); gap: 2px; }
.iabar span { display: block; height: 100%; min-width: 2px; }
.iacell { width: 30%; }
.iapuce { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.iadetail { display: flex; flex-direction: column; gap: 4px; padding: 4px 0 6px 18px; max-width: 640px; }
.ialegende { gap: 14px; flex-wrap: wrap; margin: 10px 0 6px; }
table.releve tr.totalrow td { border-top: 2px solid var(--sep); }

/* Case à cocher ou bouton radio à gauche de son texte */
label.coche { display: flex; flex-direction: row; align-items: flex-start; gap: 10px; font-weight: inherit; }
label.coche input[type=checkbox], label.coche input[type=radio] { width: auto; height: auto; margin: 3px 0 0; flex: 0 0 auto; }
.chatitem>.chatactions{grid-column:2;grid-row:1/span 2;display:flex;align-items:center;gap:2px}
.chatitem>.chatactions>button{height:28px;padding:0 7px}
.grid2col{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px 14px}
pre.apercu{white-space:pre-wrap;background:var(--sunk);border:1px solid var(--line2);border-radius:10px;padding:10px 12px;margin:0;font:inherit;font-size:12.5px;color:var(--fg)}
.medgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.meditem{display:flex;flex-direction:column;gap:4px;background:var(--card);border:1px solid var(--line2);border-radius:10px;padding:8px}
.meditem img,.meditem .medvide{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:7px;background:var(--card2)}
.meditem .medvide{display:grid;place-items:center;color:var(--muted);font-size:12px}
.meditem.clic{cursor:pointer}.meditem.clic:hover{border-color:var(--accent)}

/* Prix fal.ai (fenêtre de la vérification hebdomadaire) */
dialog.large{max-width:900px}
.prixfal h1{margin-top:10px}.prixfal .tag{padding:4px 12px;border-radius:999px;font-weight:600;font-size:13px}
.tablewrap{overflow-x:auto}table.prixtab td{vertical-align:middle}.spark svg{display:block}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:14px 0}
.kpi{background:var(--card2);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:4px}
.kpi b{font-family:var(--display);font-size:20px;font-weight:600}

/* Agence : tuiles cliquables */
button.tile{font:inherit;color:inherit;text-align:left;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;height:auto;padding:14px;border-radius:14px;background:var(--card);font-weight:400}
button.tile:hover{border-color:var(--accent)}button.tile.on{border-color:var(--accent);background:var(--accent-bg)}
.tile .tilelien{color:var(--accent);margin-top:auto;padding-top:6px}
.agligne{padding:8px 0;border-top:1px solid var(--line2)}.sub>.agligne:first-of-type{border-top:0}
/* Client courant, en haut des écrans propres à un client */
.clientpastille{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;height:24px;padding:0 10px;margin-bottom:10px;border-radius:12px;background:var(--accent-bg);color:var(--accent);font-size:12px}
/* ---- Phase 2 : logiciels pro (jetons d'intégration, Final Cut) et déclinaisons ---- */
.integ-jeton{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.integ-jeton input{width:100%}
.integ-pro .row{flex-wrap:wrap}
.decl-groupe{margin-top:10px}
.decl-item img,.decl-item video{width:100%;aspect-ratio:1/1;object-fit:contain;border-radius:7px;background:var(--card2)}

/* ---- Phase 2 : versions de créa, ouvrir dans, retouche scène par scène ---- */
.p2-versions{display:flex;flex-direction:column;gap:8px}
.p2-version{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px;padding:6px 8px;border:1px solid var(--line2);border-radius:10px}
.p2-version.on{border-color:var(--accent);background:var(--accent-bg)}
.p2-depot{display:flex;flex-direction:column;gap:4px;padding:14px;border:2px dashed var(--line2);border-radius:12px;cursor:pointer;text-align:center}
.p2-depot:hover,.p2-depot:focus,.p2-depot.survol{border-color:var(--accent);background:var(--accent-bg)}
.p2-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-height:70vh;overflow:auto}
.p2-col{display:flex;flex-direction:column;gap:6px;min-width:0}
.p2-cartes{display:flex;flex-direction:column;gap:6px}.p2-cartes img{width:100%;border-radius:8px}
.p2-scene{padding:6px 0;border-top:1px solid var(--line2)}.p2-scene summary{cursor:pointer}
.p2-scene textarea{width:100%;margin:6px 0}
@media (max-width:640px){.p2-compare{grid-template-columns:1fr}}

/* ===== Phase 1 — comptes : connexion, premier administrateur, invitation, équipe ===== */
body.connexion #nav,body.connexion #bottombar,body.connexion #barre{display:none}
body.connexion #app{display:block;background:none}
body.connexion #main{max-width:none}
.connexion-page{min-height:90vh;display:grid;place-items:center;padding:24px 0}
.connexion-carte{width:min(400px,92vw);margin:0}
.connexion-carte h1{margin:0}
.connexion-logo{height:28px;align-self:flex-start;margin-bottom:4px}
table.equipe td{vertical-align:middle}
table.equipe select,table.equipe input{height:32px}

/* ===== Phase 6 : réponses aux commentaires, publicité, Meta ===== */
.p6-msg{cursor:pointer}
.p6-msg.sel{border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent)}
.p6-msg textarea{width:100%}
.p6-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.p6-grille label{display:flex;flex-direction:column;gap:4px}
.p6-variantes{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.p6-variantes .card{margin:0}
.p6-visuel{width:100%;max-height:220px;object-fit:contain;border-radius:8px;background:var(--card2)}
.p6-fiche{white-space:pre-wrap;font-size:12px;background:var(--card2);border-radius:8px;padding:10px;margin:0}

/* Phase 5 — Site et espace client (écran du studio) */
.site-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:10px 0}
.site-champ{display:flex;flex-direction:column;gap:4px}
.site-lien{display:block;word-break:break-all;color:var(--fg2);margin-top:4px}
.site-msg{white-space:pre-line;margin:4px 0 0}

/* ===== Phase 7 : site internet du client (ui/sites.js) ===== */
.site-editeur{display:grid;gap:16px;grid-template-columns:minmax(300px,380px) 1fr;align-items:start}
@media(max-width:1000px){.site-editeur{grid-template-columns:1fr}}
.site-panneau{display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 120px);overflow:auto;padding-right:4px}
.site-vue{display:flex;flex-direction:column;gap:8px;position:sticky;top:12px}
.site-apercu{width:100%;height:calc(100vh - 160px);min-height:480px;border:1px solid var(--line);border-radius:12px;background:var(--papier);margin:0 auto;display:block;transition:max-width .2s}
.site-bloc.on{border-color:var(--accent)}
.site-form,.site-champs,.site-liste{display:flex;flex-direction:column;gap:8px}
.site-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;max-height:55vh;overflow:auto}
.site-photo{height:auto;flex-direction:column;align-items:stretch;padding:6px;gap:4px}.site-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px}
.site-nonlu{border-left:3px solid var(--accent)}
.ghost.small.on{color:var(--accent)}

/* ---------- Corrections fonctionnelles du studio (phases 1 à 3) ---------- */
/* Une barre « Enregistrer » collée en bas de l’écran : le message s’affiche au-dessus, sans la cacher. */
body:has(#main .sticky) #toast{bottom:96px}
@media (max-width:760px){body:has(#main .sticky) #toast{bottom:150px}}

/* ---------- Comptes : double authentification et mots de passe (sécurité des comptes) ---------- */
/* QR code sur fond blanc (lisible même en thème sombre), clé et codes de secours en chasse fixe. */
.qr-a2f{align-self:center;width:220px;height:220px;background:var(--papier);border-radius:8px;padding:6px;image-rendering:pixelated}
.cle-a2f{font-size:15px;letter-spacing:.06em;word-break:break-all;user-select:all}
.code-a2f{font-size:20px;letter-spacing:.2em;text-align:center;font-variant-numeric:tabular-nums}
.codes-secours{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px;margin:4px 0;padding-left:20px;font-size:15px}
.codes-secours code{user-select:all}

/* === Lot 2 : plan-du-post et proposer === */

/* Plan du post (variante A : aperçu à gauche ; coût, vérifications et scènes à droite ; actions en bas) */
.pdp{display:flex;flex-direction:column;gap:14px;min-width:0}
.pdp .bandeau{margin-bottom:0}
.pdp-nav{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.pdp-retour{padding-left:0}
.pdp-tete{display:flex;flex-direction:column;gap:6px;min-width:0}
.pdp-titre{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.pdp-titre h1{margin:0;overflow-wrap:anywhere}
.pdp-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--fg2);font-size:14px}
.pdp-date{height:28px;padding:0 10px;border-radius:14px;background:var(--sunk);border:1px solid var(--sep);color:var(--fg)}
.pdp-etiq{height:24px;display:inline-flex;align-items:center;padding:0 9px;border-radius:12px;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:600}
.pdp-split{display:grid;grid-template-columns:minmax(220px,320px) minmax(0,1fr);gap:28px;align-items:start}
.pdp-droite{display:flex;flex-direction:column;gap:18px;min-width:0}
.pdp-apercu{position:sticky;top:12px}
.pdp-tel{width:100%;max-width:300px;margin-inline:auto;border-radius:30px;padding:10px;background:var(--fg);box-shadow:var(--shadow-pop)}
.pdp-ecran{border-radius:22px;overflow:hidden;background:var(--card)}
.pdp-tel.r916 .pdp-ecran{aspect-ratio:9/16}.pdp-tel.r45 .pdp-ecran{aspect-ratio:4/5}.pdp-tel.rtexte .pdp-ecran{min-height:280px}
.pdp-texte{padding:18px;white-space:pre-line;color:var(--fg);font-size:14px;line-height:1.5;max-height:520px;overflow:auto}
.pdp-legende-apercu{text-align:center;font-size:12px;color:var(--fg3);margin:8px 0 0}
.pdp-tuile{width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;gap:8px;padding:30px 12px 12px;min-height:100%}
.pdp-tuile.voile .pdp-tuile-type,.pdp-tuile.voile .pdp-tuile-txt{background:var(--card);color:var(--fg);border-radius:var(--r-s);padding:2px 6px;align-self:flex-start}
.pdp-tuile.sans-charte.t0{background:var(--accent-soft);color:var(--fg)}.pdp-tuile.sans-charte.t1{background:var(--twin-bg);color:var(--fg)}.pdp-tuile.sans-charte.t2{background:var(--sunk);color:var(--fg)}
.pdp-tuile-type{font-size:11px;font-weight:600;opacity:.85;text-transform:uppercase;letter-spacing:.05em}
.pdp-tuile-txt{font-weight:600;font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.pdp-panneau{background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:16px 18px;display:flex;flex-direction:column;gap:8px;min-width:0;box-shadow:var(--shadow-card)}
.pdp-doux{color:var(--fg2)}
.pdp-gros{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}.pdp-gros b{font-size:30px;line-height:1;font-weight:700;font-variant-numeric:tabular-nums}
.pdp-jauge{height:8px;border-radius:5px;background:var(--sunk);overflow:hidden;border:1px solid var(--sep)}.pdp-jauge i{display:block;height:100%;background:var(--accent);border-radius:5px}
.pdp-detail summary{cursor:pointer;color:var(--fg2)}
.pdp-ligne{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--fg2);font-variant-numeric:tabular-nums}
.pdp-verifs{display:flex;flex-direction:column;gap:6px;font-size:13px}.pdp-verifs>div{display:flex;gap:8px;align-items:flex-start}
.pdp-ic{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;flex:none}
.pdp-ic.ok{background:var(--ok-bg);color:var(--ok)}.pdp-ic.warn{background:var(--warn-bg);color:var(--warn)}.pdp-ic.err{background:var(--err-bg);color:var(--err)}
.pdp .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pdp-section{display:flex;flex-direction:column;gap:10px;min-width:0}.pdp-section h2{margin:0}
.pdp-bande{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.pdp-scene{border:1px solid var(--sep);border-radius:var(--r-m);overflow:hidden;background:var(--card);display:flex;flex-direction:column;min-width:0}
.pdp-im{aspect-ratio:3/4;position:relative}
.pdp-plage{position:absolute;left:8px;top:8px;background:var(--card);color:var(--fg);font-size:11.5px;font-weight:600;border-radius:6px;padding:0 6px;font-variant-numeric:tabular-nums}
.pdp-tx{padding:9px 10px 11px;display:flex;flex-direction:column;gap:4px;font-size:12.5px;overflow-wrap:anywhere}.pdp-tx b{font-size:13px}
.pdp-num{font-variant-numeric:tabular-nums}
.pdp-tx video{width:100%;border-radius:var(--r-s)}
.pdp-dapres{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.pdp-dapres img{width:40px;height:40px;object-fit:cover;border-radius:var(--r-s)}
.pdp-pre{white-space:pre-line}
.pdp-barre{position:sticky;bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:12px 14px;box-shadow:var(--shadow-pop);z-index:5}
.pdp-btns{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pdp-creer{height:44px;padding:0 18px;font-size:15px}
.pdp-raison{color:var(--warn);font-weight:600}
@media (max-width:1000px){.pdp-split{grid-template-columns:minmax(0,1fr)}.pdp-apercu{position:static}.pdp-tel{max-width:240px}}

/* Proposer des idées (ex-Planifier) : trois réglages visibles, le reste sous « Plus d'options » */
.pid{display:flex;flex-direction:column;gap:14px;min-width:0}
.pid-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}.pid-tete h1{margin:0 0 4px}.pid-tete p{margin:0}
.pid-doux{color:var(--fg2)}
.pid-carte{background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:16px 18px;display:flex;flex-direction:column;gap:10px;min-width:0;box-shadow:var(--shadow-card)}
.pid-carte h2{margin:0}
.pid-compte{font-size:20px;min-width:24px;text-align:center;font-variant-numeric:tabular-nums}
.pid-gauche{align-self:flex-start}
.pid-replie>summary{cursor:pointer;font-weight:600;min-height:36px;display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.pid-lien{color:var(--accent);font-weight:600}
.pid-corps{display:flex;flex-direction:column;gap:10px;padding-top:8px}
.pid-options>summary{background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:10px 18px}
.pid-options[open]>summary{margin-bottom:4px}
.pid-format{flex-direction:row;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--sep);border-radius:var(--r-m);background:var(--field);color:var(--fg);cursor:pointer}
.pid-format input{width:auto;min-height:0;margin-top:3px}
.pid-format.on{border-color:var(--accent-line);background:var(--accent-soft)}
.pid-requis.ok{color:var(--ok);font-weight:600}.pid-requis.warn{color:var(--warn);font-weight:600}
.pid-bloc{background:var(--sunk);border:1px solid var(--sep2);border-radius:var(--r-m);padding:12px;display:flex;flex-direction:column;gap:8px}
.pid-pas{flex-wrap:nowrap;gap:4px}.pid-pas b{min-width:18px;text-align:center}
.pid-barre{position:sticky;bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:12px 14px;box-shadow:var(--shadow-pop);z-index:5}
.pid-resume{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:2px}
.pid-demande>summary{min-height:24px;font-weight:500;color:var(--fg2)}
.pid-raison{color:var(--warn);font-weight:600}
/* === Lot 2 : réglages === */
/* Fenêtre Réglages en onglets (ui/ecrans/reglages.js). Couleurs : variables du lot 1 seulement. */
.regl-tete{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.regl-onglets{display:inline-flex;flex-wrap:wrap;gap:3px;border:1px solid var(--sep);border-radius:var(--r-m);padding:3px;background:var(--sunk);margin:4px 0 16px;max-width:100%}
.regl-onglets button{border:0;background:transparent;color:var(--fg2);border-radius:var(--r-s);padding:4px 13px;height:auto;min-height:30px;font-size:13px}
.regl-onglets button:hover{background:var(--hover);color:var(--fg)}
.regl-onglets button[aria-selected="true"]{background:var(--win);color:var(--fg);font-weight:600;box-shadow:var(--shadow-card)}
.regl-onglets button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.regl-zone{display:flex;flex-direction:column;gap:16px;min-width:0}
.regl-zone:focus{outline:none}
.regl-svc{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--sep2)}
.regl-services .regl-svc:first-of-type,.card>.regl-svc:first-child{border-top:0}
.regl-svc-tx{flex:1 1 260px;min-width:0;display:flex;flex-direction:column;gap:2px}
.regl-svc-etat{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.regl-svc .regl-tech{flex:1 1 100%}
.regl-tech summary{cursor:pointer;color:var(--fg3)}
.regl-tech[open]{display:flex;flex-direction:column;gap:4px}
.regl-tech code{font-size:12px;color:var(--fg2)}
.regl-etapes{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:14px}
.regl-etapes li{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.regl-etapes li::marker{color:var(--accent);font-weight:700}
.regl-etapes input{width:100%}
@media (max-width:900px){.regl-onglets{display:flex}.regl-onglets button{flex:1 1 auto}.regl-zone .scroll{overflow-x:auto;max-width:100%}}
/* === Lot 2 : aujourdhui === */
/* Écran « Aujourd'hui » (ui/ecrans/aujourdhui.js) : une seule colonne de lecture, triée par urgence ; couleurs du lot 1. */
.auj-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.auj-hero h1{margin:2px 0 0}
.auj-eyebrow{font-size:13px;color:var(--fg2);font-weight:500}
.auj-meta{color:var(--fg2)}
.auj-budget{min-width:220px;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--fg2)}
.auj-budget b{color:var(--fg)}
.auj-jauge{height:8px;border-radius:5px;background:var(--sunk);border:1px solid var(--sep);overflow:hidden}
.auj-jauge i{display:block;height:100%;background:var(--accent);border-radius:5px}
.auj-taches:empty{display:none}
.auj-taches,.auj-hero~.bandeau{margin-bottom:14px}
.auj-sect{display:flex;flex-direction:column;gap:12px;margin:8px 0 26px;min-width:0}
.auj-secthead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.auj-secthead h2{display:flex;align-items:baseline;gap:8px}
.auj-n{color:var(--fg3);font-weight:500;font-size:15px}
.auj-liste{display:flex;flex-direction:column;border:1px solid var(--sep);border-radius:var(--r-l);background:var(--card);box-shadow:var(--shadow-card);overflow:hidden;min-width:0}
.auj-ligne{display:flex;gap:14px;align-items:center;padding:12px 16px;border-top:1px solid var(--sep2);flex-wrap:wrap;min-width:0}
.auj-ligne:first-child{border-top:0}
.auj-tx{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;gap:2px;overflow-wrap:anywhere}
.auj-tx b{font-weight:600;color:var(--fg)}
.auj-urgent{color:var(--warn);font-weight:600}
.auj-actions{margin-left:auto}
.auj-th{flex:none;width:56px;height:70px;padding:0;border:1px solid var(--sep);border-radius:var(--r-s);overflow:hidden;background:var(--sunk);cursor:pointer}
.auj-img{position:relative;width:100%;height:100%;background:var(--sunk);overflow:hidden}
.auj-img img{width:100%;height:100%;object-fit:cover;display:block}
.auj-texte{display:flex;flex-direction:column;justify-content:flex-end;gap:2px;padding:5px;text-align:left}
.auj-texte q{font-size:9.5px;line-height:1.2;font-weight:600;color:var(--fg);quotes:"« " " »";display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.auj-lbl{font-size:8px;font-weight:600;color:var(--fg3);text-transform:uppercase;letter-spacing:.04em}
.auj-duree{position:absolute;right:3px;bottom:3px;background:var(--fg);color:var(--win);font-size:10px;font-weight:600;border-radius:4px;padding:0 4px}
.auj-bandeau{display:block;padding:10px 12px}
.auj-bandeau>.bandeau{margin:0}
.auj-lot{flex-direction:column;align-items:stretch;gap:10px}
.auj-lot-tete{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.auj-idees{display:flex;flex-direction:column;border:1px solid var(--sep2);border-radius:var(--r-m);overflow:hidden}
.auj-idee{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 12px;border-top:1px solid var(--sep2);background:var(--card)}
.auj-idee:first-child{border-top:0}
.auj-idee.off{background:var(--sunk)}
.auj-idee.off .auj-tx b{color:var(--fg2);text-decoration:line-through}
.auj-lot>.auj-idee{border:0;padding:0;background:transparent}
.auj-choix{display:inline-flex;gap:3px;border:1px solid var(--sep);border-radius:var(--r-s);padding:3px;background:var(--sunk);margin-left:auto}
.auj-seg{height:auto;min-height:30px;padding:3px 12px;border:0;border-radius:6px;background:transparent;color:var(--fg2);font-size:13px;font-weight:500}
.auj-seg.on{background:var(--card);color:var(--fg);font-weight:600;box-shadow:var(--shadow-card)}
.auj-voix{gap:4px;align-items:center;margin-top:4px}
.auj-voix>span{color:var(--fg2);margin-right:4px}
.auj-voix .auj-seg{border:1px solid var(--sep)}
.auj-voix .auj-seg.on{border-color:var(--accent);color:var(--accent)}
.auj-lot-pied{justify-content:flex-start}
.auj-plus{border-radius:0;border-top:1px solid var(--sep2);min-height:40px;width:100%;justify-content:center;background:var(--card)}
.auj-pp-replie>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;cursor:pointer;min-height:48px;padding:10px 16px;border:1px solid var(--sep);border-radius:var(--r-l);background:var(--card);box-shadow:var(--shadow-card);list-style:none}
.auj-pp-replie>summary::-webkit-details-marker{display:none}
.auj-pp-replie>summary:hover{background:var(--hover)}
.auj-pp-tete{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0}
.auj-pp-tete b{font-size:15px}
.auj-pp-voir{color:var(--accent);font-weight:600}
.auj-pp-voir::after{content:" ▾"}
.auj-pp-replie[open] .auj-pp-voir::after{content:" ▴"}
.auj-pp-replie{display:block}
.auj-pp-replie[open]>summary{margin-bottom:12px}
.auj-pp-replie>.auj-meta{display:block;margin-top:12px}
.auj-semaine{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.auj-jour{border:1px solid var(--sep);background:var(--card);border-radius:var(--r-m);padding:8px;display:flex;flex-direction:column;gap:6px;min-height:120px;min-width:0}
.auj-jour.auj-ajd{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.auj-dn{font-size:12px;color:var(--fg2);display:flex;justify-content:space-between;gap:4px}
.auj-dn b{color:var(--fg);font-size:15px}
.auj-mini{display:flex;flex-direction:column;align-items:stretch;gap:4px;height:auto;padding:0 0 5px;border:0;border-radius:var(--r-s);background:var(--sunk);overflow:hidden;text-align:left;min-width:0;position:relative}
.auj-mini .auj-img{aspect-ratio:1;height:auto}
.auj-mini .pastille{position:absolute;left:4px;top:4px;font-size:10.5px;max-width:calc(100% - 8px);overflow:hidden}
.auj-lb{font-size:11.5px;font-weight:600;padding:0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--fg)}
.auj-libre{font-size:12px;color:var(--fg3);border:1px dashed var(--sep);border-radius:var(--r-s);padding:6px;text-align:center;margin-top:auto}
.auj-ailleurs{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:24px}
.auj-chip{height:auto;min-height:32px;border:1px solid var(--sep);background:var(--card);color:var(--fg);border-radius:20px;padding:4px 12px 4px 4px;font-size:13px}
.auj-mono{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;font-weight:700;background:var(--accent-soft);color:var(--accent);flex:none}
.auj-pas{flex-wrap:nowrap}
.auj-tick{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;flex:none;background:var(--warn-bg);color:var(--warn)}
.auj-tick.ok{background:var(--ok-bg);color:var(--ok)}
.auj-tick.info{background:var(--info-bg);color:var(--info)}
.auj-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.auj-vide{border:1px solid var(--sep);border-radius:var(--r-l);background:var(--card);box-shadow:var(--shadow-card);padding:22px;margin-bottom:26px}
.auj-vide h2{margin-bottom:6px}
.auj-vide p{color:var(--fg2);margin:0 0 12px}
.auj-objectifs{border:1px solid var(--sep);border-radius:var(--r-m);background:var(--card);padding:10px 14px;margin-bottom:14px}
.auj-barre{position:sticky;bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:12px 14px;box-shadow:var(--shadow-pop);margin-top:16px;z-index:3}
@media (max-width:900px){.auj-semaine{grid-template-columns:repeat(4,minmax(0,1fr))}.auj-actions{margin-left:0}.auj-choix{margin-left:0}}
@media (max-width:560px){.auj-semaine{grid-template-columns:repeat(2,minmax(0,1fr))}.auj-ligne{padding:12px}}
/* === Lot 2 : Marque (Bible · Entretiens · Stratégie · Images) — ui/ecrans/marque.js === */
.mq{display:flex;flex-direction:column;gap:14px;min-width:0}
.mq-eyebrow{font-size:12.5px;color:var(--fg2);font-weight:500}
.mq-tete{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.mq-tete h1{margin:0}
.mq-completude{color:var(--fg2);display:inline-flex;align-items:center;gap:8px}
.mq-onglets{display:inline-flex;align-self:flex-start;gap:3px;border:1px solid var(--sep);border-radius:var(--r-s);padding:3px;background:var(--sunk);flex-wrap:wrap;max-width:100%}
.mq-onglets button{border:0;background:transparent;color:var(--fg2);border-radius:var(--r-s);padding:4px 13px;font-size:13px;min-height:28px;cursor:pointer}
.mq-onglets button:hover{background:var(--hover);color:var(--fg)}
.mq-onglets button.on{background:var(--win);color:var(--fg);font-weight:600;box-shadow:var(--shadow-card)}
.mq-onglets button:focus-visible,.mq-rub-titre:focus-visible{outline:3px solid var(--accent-line);outline-offset:1px}
.mq-corps{display:flex;flex-direction:column;gap:14px;min-width:0}
.mq-corps h2{margin:0}
.mq-panneau{display:flex;flex-direction:column;gap:6px;padding:14px 16px;background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);box-shadow:var(--shadow-card);min-width:0}
.mq-barre-outils{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mq-rubriques{display:flex;flex-direction:column;border:1px solid var(--sep);border-radius:var(--r-l);overflow:hidden;background:var(--card);box-shadow:var(--shadow-card)}
.mq-rub,.mq-ent{border-top:1px solid var(--sep2)}
.mq-rub:first-child,.mq-ent:first-child{border-top:0}
.mq-rub-tete,.mq-ent{display:flex;align-items:center;gap:12px;padding:10px 14px;flex-wrap:wrap}
.mq-rub-titre{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:none;border:0;padding:0;color:var(--fg);text-align:left;cursor:pointer;font:inherit;min-height:0;height:auto}
.mq-rub-titre .muted,.mq-ent-tx .muted{color:var(--fg2);overflow-wrap:anywhere}
.mq-rub-titre:hover b{text-decoration:underline}
.mq-rub.ouverte{background:var(--sunk)}
.mq-rub-corps{display:flex;flex-direction:column;gap:12px;padding:4px 14px 16px}
.mq-ent-tx{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:2px}
.mq-ent-tx a{color:var(--accent)}
.mq-plus{align-self:flex-start}
.mq-centre{justify-content:center}
.mq-depot{display:flex;flex-direction:column;align-items:center;gap:6px;padding:22px 16px;border:1.5px dashed var(--field);border-radius:var(--r-l);background:var(--sunk);text-align:center;color:var(--fg)}
.mq-depot.grand{padding:40px 20px}
.mq-depot.over{border-color:var(--accent);background:var(--accent-soft)}
.mq-depot.busy{pointer-events:none;opacity:.7}
.mq-entretien-depot{align-items:stretch}
.mq-retour{margin-bottom:-6px}
.mq-lecteur{background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:10px}
.mq-lecteur .player{width:100%;max-height:360px}
.mq-groupe{display:flex;flex-direction:column;gap:10px}
.mq-groupe h3{margin:6px 0 0;font-size:14px;color:var(--fg2)}
.mq-prop{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--sep);border-radius:var(--r-m);background:var(--card);box-shadow:var(--shadow-card)}
.mq-prop.accepte{border-color:var(--ok)}
.mq-prop.rejete{background:var(--sunk)}
.mq-citation{margin:0;padding:8px 12px;border-left:3px solid var(--accent);background:var(--accent-soft);color:var(--fg);border-radius:0 var(--r-s) var(--r-s) 0;font-style:italic;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.mq-citation button{font-style:normal}
.mq-valeur{display:flex;flex-direction:column;gap:2px;overflow-wrap:anywhere}
.mq-remarque{color:var(--warn)}
.mq-barre{margin-top:4px}
.mq-nuancier{gap:10px}
.mq-nuance{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--fg2)}
.mq-nuance i{width:18px;height:18px;border-radius:var(--r-s);border:1px solid var(--sep);display:block}
.mq-ligne{display:flex;flex-direction:column;gap:1px;overflow-wrap:anywhere}
.mq-consentement{border:1px solid var(--sep);border-radius:var(--r-m);padding:10px 12px;background:var(--card)}
@media (max-width:900px){.mq-rub-tete,.mq-ent{padding:10px}.mq-onglets{align-self:stretch}.mq-onglets button{flex:1 1 auto}}
/* === Lot 2 : Posts et Calendrier (ui/ecrans/posts.js, ui/ecrans/calendrier.js) === */
/* Couleurs : uniquement les variables du lot 1 (clair et sombre). Pastilles et bandeaux : composants du lot 1. */
.pst-surtitre{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--fg3)}
.pst-tete,.calp-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.pst-tete h1,.calp-tete h1{margin:2px 0 4px}
.pst-tete p,.calp-tete p{margin:0}
.pst-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pst-onglets{display:inline-flex;gap:3px;border:1px solid var(--sep);border-radius:var(--r-m);padding:3px;background:var(--sunk);flex-wrap:wrap}
.pst-onglets button{border:0;background:transparent;color:var(--fg2);border-radius:var(--r-s);padding:4px 13px;height:auto;min-height:30px;font-size:13px;font-weight:500}
.pst-onglets button[aria-selected="true"]{background:var(--card);color:var(--fg);box-shadow:var(--shadow-card);font-weight:600}
.pst-onglets button:focus-visible,.pst-carte:focus-visible,.pst-mini:focus-visible,.calp-jour:focus-visible,.calp-ev:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Filtres */
.pst-filtres{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.pst-filtres input[type=search]{flex:1 1 260px;width:auto;min-width:0;background:var(--win);color:var(--fg);border:1px solid var(--field);border-radius:var(--r-s)}
.pst-filtres select{flex:0 1 auto;width:auto;min-width:0;max-width:100%;background:var(--win);color:var(--fg);border:1px solid var(--field);border-radius:var(--r-s)}
.pst-pied{display:flex;gap:10px;align-items:center;justify-content:space-between;min-height:34px;margin-bottom:8px}
.pst-pied p{margin:0}

/* Cartes : image du post et pastille d'état */
.pst-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:16px}
.pst-carte{background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-card);min-width:0;cursor:pointer}
.pst-carte:hover{background:var(--hover)}
.pst-media{position:relative;aspect-ratio:4/5;background:var(--sunk);overflow:hidden}
.pst-media>img,.pst-mini-im>img,.calp-th>img,.calp-lth>img{width:100%;height:100%;object-fit:cover;display:block}
.pst-media>.pastille{position:absolute;left:10px;top:10px;box-shadow:var(--shadow-card)}
.pst-info{padding:12px 14px 14px;display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.pst-info b{font-size:15px;line-height:1.3;overflow-wrap:anywhere}
.pst-meta{font-size:12.5px;color:var(--fg2)}
.pst-erreur{font-size:12.5px;color:var(--err)}
.pst-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:8px}
/* Avant la création : une tuile (première scène du plan, accroche de l'idée, début du post texte) */
.pst-tuile{width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;gap:6px;padding:40px 12px 12px;background:var(--sunk);color:var(--fg);border-bottom:1px dashed var(--sep)}
.pst-tuile.pst-idee{background:var(--idee-bg);color:var(--idee)}
.pst-lab{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--fg3)}
.pst-idee .pst-lab{color:inherit;opacity:.85}
.pst-txt,.pst-texte q{font-size:15px;font-weight:600;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical}
.pst-texte q{quotes:"« " " »"}

/* Vue par étape : colonnes qui passent à la ligne (jamais de défilement horizontal) */
.pst-colonnes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:12px;align-items:start}
.pst-col{background:var(--sunk);border:1px solid var(--sep2);border-radius:var(--r-l);padding:10px;display:flex;flex-direction:column;gap:8px;min-width:0}
.pst-col-tete{display:flex;justify-content:space-between;align-items:center;gap:8px}
.pst-mini{display:flex;gap:10px;align-items:center;background:var(--card);border:1px solid var(--sep);border-radius:var(--r-m);padding:6px;cursor:pointer;min-width:0}
.pst-mini:hover{background:var(--hover)}
.pst-mini-im{width:44px;height:55px;border-radius:var(--r-s);overflow:hidden;flex:none;background:var(--sunk)}
.pst-mini-im .pst-tuile,.calp-th .pst-tuile,.calp-lth .pst-tuile{padding:3px;border:0}
.pst-mini-im .pst-lab,.calp-th .pst-lab,.calp-lth .pst-lab{display:none}
.pst-mini-im .pst-txt,.pst-mini-im .pst-texte q,.calp-th .pst-txt,.calp-th .pst-texte q,.calp-lth .pst-txt,.calp-lth .pst-texte q{font-size:7px;-webkit-line-clamp:4}
.pst-mini-tx{display:flex;flex-direction:column;gap:1px;min-width:0}
.pst-mini-tx b{font-size:13px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pst-mini-tx .pst-meta{font-size:11.5px}

/* Calendrier : grille du mois ou de la semaine */
.calp-grille{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.calp-h{font-size:12px;color:var(--fg3);font-weight:600;padding:0 4px}
.calp-jour{min-height:118px;border:1px solid var(--sep2);border-radius:var(--r-m);padding:6px;display:flex;flex-direction:column;gap:5px;background:var(--card);min-width:0;cursor:pointer}
.calp-jour:hover{background:var(--hover)}
.calp-jour.hors{background:transparent;border-style:dashed}
.calp-jour.passe .calp-num{color:var(--fg3)}
.calp-jour.today{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.calp-jour.today .calp-num{color:var(--accent)}
.calp-num{font-size:12px;color:var(--fg2);font-weight:600}
.calp-grille.semaine .calp-jour{min-height:260px}
.calp-ev{display:flex;gap:6px;align-items:center;border:0;border-radius:var(--r-s);padding:3px;background:var(--sunk);color:var(--fg);min-width:0;height:auto;width:100%;text-align:left;font-weight:400;cursor:pointer}
.calp-ev:hover{background:var(--hover);box-shadow:inset 0 0 0 1px var(--sep)}
.calp-ev.alerte{box-shadow:inset 0 0 0 1px var(--err)}
.calp-th{width:28px;height:34px;border-radius:5px;overflow:hidden;flex:none;background:var(--sunk)}
.calp-tt{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:11.5px;line-height:1.25;align-items:flex-start}
.calp-tt b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.calp-tt .pastille{font-size:10.5px;padding:0 6px;line-height:15px;max-width:100%;white-space:normal;align-items:baseline}
.calp-ev.grand{flex-direction:column;align-items:stretch;padding:5px}
.calp-ev.grand .calp-th{width:100%;height:auto;aspect-ratio:4/5}
.calp-ev.grand .calp-th .pst-tuile{padding:24px 8px 8px}
.calp-ev.grand .calp-th .pst-lab{display:block}
.calp-ev.grand .calp-th .pst-txt{font-size:12px}
.calp-meta{font-size:11.5px;color:var(--fg2)}
.calp-alerte{font-size:11.5px;color:var(--err);font-weight:600}
.calp-libre{font-size:12px;color:var(--fg3);border:1px dashed var(--sep);border-radius:var(--r-s);padding:4px 6px;text-align:center;margin-top:auto;background:transparent;height:auto;font-weight:400;justify-content:center}
.calp-legende{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px}

/* Calendrier : vue liste (et grille remplacée par la liste sur écran étroit) */
.calp-liste{display:flex;flex-direction:column;gap:10px}
.calp-liste.etroit{display:none}
.calp-ljour{background:var(--card);border:1px solid var(--sep);border-radius:var(--r-l);padding:10px 12px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow-card)}
.calp-ljour.today{border-color:var(--accent)}
.calp-ljour-tete{align-self:flex-start;font-weight:600;color:var(--fg);background:transparent;border:0;padding:0;height:auto}
.calp-liste .calp-ev.grand{flex-direction:row;align-items:center;padding:6px}
.calp-liste .calp-ev.grand .calp-th{width:44px;height:55px;aspect-ratio:auto}
.calp-liste .calp-ev.grand .calp-th .pst-tuile{padding:3px}
.calp-liste .calp-ev.grand .calp-th .pst-lab{display:none}
.calp-liste .calp-ev.grand .calp-th .pst-txt{font-size:7px}
.calp-liste .calp-tt{font-size:13px}
.calp-ligne{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:8px 0;border-top:1px solid var(--sep2)}
.calp-lth{width:44px;height:55px;border-radius:var(--r-s);overflow:hidden;flex:none;background:var(--sunk)}
.calp-ltx{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:3px;align-items:flex-start}
/* Case étroite (fenêtre de 900 px, barre latérale ouverte) : le titre et la pastille, sans la vignette. */
.calp-jour{container-type:inline-size}
@container (max-width:120px){.calp-ev:not(.grand) .calp-th{display:none}.calp-ev:not(.grand) .calp-tt .pastille{font-size:10px;padding:0 4px}}
@media (max-width:760px){.calp-grille{display:none}.calp-liste.etroit{display:flex}}
/* === Lot 2 : erreurs === */
/* Message d'erreur d'une action (ui/erreurs.js) : persistant au moins 8 s, en pause au survol et au focus, fermable,
   « Détail technique » replié. Bandeau « Hors ligne » en haut de la fenêtre. Couleurs : variables du thème seulement. */
#erreur-action{position:fixed;right:22px;bottom:22px;z-index:40;display:none;align-items:flex-start;gap:10px;max-width:min(460px,calc(100% - 32px));padding:14px 12px 14px 16px;border-radius:var(--r-m,12px);border:1px solid var(--err);border-left-width:4px;background:var(--err-bg);color:var(--fg,var(--txt));box-shadow:var(--shadow-pop,none)}
#erreur-action.show{display:flex}
/* EX-9.11 : bandeau persistant « modifié par quelqu'un d'autre » (aucune fermeture automatique). */
#conflit-modif{position:fixed;left:50%;top:14px;transform:translateX(-50%);z-index:45;width:min(620px,calc(100% - 32px));padding:14px 16px;border-radius:var(--r-m,12px);border:1px solid var(--warn);border-left-width:4px;background:var(--warn-bg);color:var(--fg);box-shadow:var(--shadow-pop,none)}
#conflit-modif .cm-corps{display:flex;flex-direction:column;gap:8px}
#conflit-modif .cm-texte{width:100%;font:inherit;background:var(--card);color:var(--fg);border:1px solid var(--field);border-radius:var(--r-s,7px);padding:8px}
#conflit-modif .cm-actions{display:flex;gap:8px;flex-wrap:wrap}
#erreur-action.ton-warn{border-color:var(--warn);background:var(--warn-bg)}
#erreur-action .err-corps{display:flex;flex-direction:column;gap:4px;min-width:0;font-size:13.5px}
#erreur-action .err-titre{font-size:14.5px}
#erreur-action .err-change{color:var(--fg2,var(--muted))}
#erreur-action .err-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px}
#erreur-action .err-detail{flex-basis:100%;font-size:12.5px;color:var(--fg2,var(--muted))}
#erreur-action .err-detail summary{cursor:pointer;width:max-content}
#erreur-action .err-detail code{display:block;margin-top:4px;padding:6px 8px;border-radius:var(--r-s,6px);background:var(--sunk,var(--card));white-space:pre-wrap;word-break:break-word;max-height:160px;overflow:auto;user-select:all}
#erreur-action .err-fermer{flex:none;width:30px;height:30px;padding:0;justify-content:center;font-size:18px;line-height:1}
#hors-ligne{position:sticky;top:0;z-index:35;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;padding:8px 16px;background:var(--warn-bg);color:var(--fg,var(--txt));border-bottom:1px solid var(--warn);font-size:13.5px}
#hors-ligne[hidden]{display:none}
#hors-ligne b{color:var(--warn)}
@media (max-width:760px){#erreur-action{right:16px;left:16px;bottom:16px;max-width:none}}

/* ---------- Refonte 0.4 : hub agence, deux espaces (agence, client), sélecteur d'espace ---------- */
/* Logo TWIIN : un bouton qui ramène à l'accueil agence. */
button.brand{border:0;background:transparent;height:auto;min-height:0;padding:4px 8px 14px;border-radius:10px;width:100%;justify-content:flex-start;font-weight:400}
button.brand:hover:not(:disabled){background:var(--hover)}
/* Nom du client sous « Accueil », dans la barre latérale d'un client. */
.nav-client{display:flex;align-items:center;gap:10px;padding:10px 10px 6px;margin-top:4px;border-top:1px solid var(--sep);font-weight:600;font-size:13px;color:var(--fg);min-width:0}
.nav-client .nav-lib{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-client .monogramme{width:24px;height:24px;font-size:12px;border-radius:7px}
.nav-retour{color:var(--accent);font-weight:600}
.nav-retour svg{stroke:var(--accent)}
/* Liseré de l'espace, en haut de la zone principale : accent dans l'agence, couleur du client dans un client. */
#barre{border-top:3px solid var(--espace-c,var(--accent))}
.barre-espace-zone{gap:10px;align-items:center;min-width:0}
.espace-nom{font-size:13px;color:var(--fg2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mono-agence{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;flex:none;font-size:14px;color:var(--accent-fg);background:var(--accent)}
.clientsw[aria-expanded="true"]{border-color:var(--accent)}
.barre-recherche button{height:28px;padding:0 8px;flex:none}
/* Menu du sélecteur d'espace. */
.espace-menu{position:fixed;z-index:60;background:var(--win);border:1px solid var(--sep);border-radius:var(--r-l);box-shadow:var(--shadow-pop);padding:6px;display:flex;flex-direction:column;gap:2px;max-height:min(70vh,560px);overflow-y:auto}
.espace-menu[hidden]{display:none}
.espace-opt{display:flex;align-items:center;gap:10px;width:100%;height:auto;min-height:44px;padding:6px 10px;border:0;border-radius:9px;background:transparent;text-align:left;font-weight:400;color:var(--fg)}
.espace-opt.courant{background:var(--accent-soft)}
.espace-lib{display:flex;flex-direction:column;min-width:0;flex:1}
.espace-lib b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.espace-n{font-size:12px;font-weight:600;color:var(--accent);white-space:nowrap}
.espace-n.muted{color:var(--fg3);font-weight:400}
.espace-groupe{padding:8px 10px 2px}
.espace-nouveau{border-top:1px solid var(--sep2);border-radius:0 0 9px 9px;margin-top:4px;color:var(--accent)}
.espace-plus{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;border:1px dashed var(--accent-line);font-weight:700;flex:none}
/* Accueil agence. */
.hub-cartes{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.hub-client{display:flex;flex-direction:column;align-items:stretch;gap:6px;height:auto;padding:14px 16px;border:1px solid var(--sep);border-radius:var(--r-l);background:var(--card);box-shadow:var(--shadow-card);text-align:left;font-weight:400;color:var(--fg);min-width:0}
.hub-client.a-faire{box-shadow:inset 3px 0 0 var(--accent),var(--shadow-card)}
.hub-client:hover:not(:disabled){border-color:var(--accent);background:var(--card)}
.hub-client-tete{display:flex;align-items:center;gap:10px;min-width:0}
.hub-client-tete b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hub-client-resume{font-size:13.5px;font-weight:600;color:var(--fg)}
.hub-client-resume.muted{color:var(--fg2);font-weight:400}
.hub-entrer{color:var(--accent);font-weight:600;margin-top:auto}
.hub-deux{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.hub-deux .card{margin:0}
.hub-skel{height:96px;border-radius:var(--r-l);background:var(--sunk);border:1px solid var(--sep2)}
.hub-skel.long{height:160px;margin-top:16px}
.hub .auj-ligne .monogramme{width:26px;height:26px;font-size:12px}
/* Barre basse du téléphone : Accueil, espace courant, Menu. */
#bottombar .ico svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#bottombar .monogramme,#bottombar .mono-agence{width:22px;height:22px;font-size:11px;border-radius:6px}
#bottombar .bb-nom{overflow:hidden;text-overflow:ellipsis;max-width:110px}
@media (max-width:900px){
  .espace-nom{display:none}
  #nav .nav-client{justify-content:center;padding:10px 0 6px}
  #nav:hover .nav-client,#nav:has(:focus-visible) .nav-client{justify-content:flex-start;padding:10px 10px 6px}
  button.brand{justify-content:center}
}
@media (max-width:640px){
  .hub-cartes{grid-template-columns:1fr}
  .barre-recherche{display:none}
}

/* ---------- Serveur — lot 1 : bandeaux du mode essai et de la maintenance (ui/serveur.js) ---------- */
.serveur-bandeau{position:sticky;top:0;z-index:60;padding:8px 16px;font-size:13px;text-align:center;border-bottom:1px solid;color:var(--fg)}
.serveur-bandeau.essai{background:var(--warn-bg);border-color:var(--warn)}
.serveur-bandeau.essai>b{color:var(--warn)}
.serveur-bandeau.maintenance{background:var(--info-bg);border-color:var(--info)}
.serveur-bandeau.maintenance>b{color:var(--info)}
/* ---- Serveur — lot 2 (comptes de l’équipe : installation, secours) ---- */
.code-installation{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:17px;letter-spacing:.08em;text-transform:uppercase;text-align:center}
/* === Serveur — lot 5 : console d'administration (ui/admin/*.js) === */
/* Jetons du thème seulement (clair et sombre) ; tableau en lignes de grille, en cartes sous 900 px. */
.adm-tete{display:flex;flex-direction:column;gap:2px;margin-bottom:6px}
.adm-tete h1{margin:0}.adm-tete p{margin:2px 0 0}
.adm-onglets{margin-top:8px}
.adm-panneau{display:flex;flex-direction:column;gap:14px;min-width:0}
.adm-zone{display:flex;flex-direction:column;gap:10px;min-width:0}
.adm-zone .stack>button{align-self:flex-start}
.adm-entete{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.adm-entete p{margin:0;flex:1 1 320px}
.adm-entete h2{margin:0}
.adm-compte{margin:0}
.adm-deux{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:14px;align-items:start}
.adm-deux .card{margin:0}
.adm-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.adm-tx b{overflow-wrap:anywhere}.adm-tx small{color:var(--fg2);font-size:12.5px;overflow-wrap:anywhere}
.adm-nom{display:flex;align-items:center;gap:10px;min-width:0}
.adm-act{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;align-items:center}
.adm-lbl{display:none}
.adm-sceau{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:650;color:var(--fg2);background:var(--sunk);border:1px solid var(--sep);border-radius:20px;padding:1px 8px 1px 6px;white-space:nowrap}
.adm-sceau .ico svg{width:12px;height:12px;display:block;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.adm-table{background:var(--card);border:1px solid var(--sep);border-radius:14px;box-shadow:var(--shadow-card);overflow:hidden}
.adm-tr{display:grid;grid-template-columns:minmax(200px,2.2fr) 1.2fr 1fr 1fr 1.2fr 1.3fr auto;gap:10px;align-items:center;padding:10px 14px;border-top:1px solid var(--sep2)}
.adm-tr:first-child{border-top:0}
.adm-th{font-size:12px;color:var(--fg2);font-weight:550;background:var(--sunk)}
.adm-ligne{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--sep2)}
.card>.adm-ligne:first-of-type,.adm-regles>.adm-ligne:first-child,.adm-zone>.stack>.adm-ligne:first-child{border-top:0}
.adm-ligne>.adm-tx{flex:1 1 260px}
.adm-groupe,.adm-client{margin:0}
.adm-avatar-client{background:var(--sunk);color:var(--fg)}
.adm-avatar-l{width:48px;height:48px;font-size:16px}
.adm-fiche-tete{display:flex;align-items:center;gap:12px}
.adm-fiche-tete .adm-tx b{font-size:16px}
.adm-details{gap:4px}
.adm-actions{gap:8px}
.adm-feuille-champs{display:flex;flex-direction:column;gap:12px}
.adm-feuille-champs .bandeau{margin-bottom:0}
.adm-lien{display:block;word-break:break-all;background:var(--sunk);border:1px solid var(--sep);border-radius:var(--r-s);padding:8px 10px;font-family:var(--mono-font);font-size:12.5px}
.adm-choix{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;min-width:0}
.adm-choix legend{font-weight:600;font-size:13px;margin-bottom:4px;padding:0}
.adm-opt{display:flex;flex-direction:row;gap:10px;align-items:flex-start;color:var(--fg);font-size:13.5px;border:1px solid var(--sep);border-radius:var(--r-m);padding:10px 12px;cursor:pointer;background:var(--card)}
.adm-opt:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.adm-opt input{margin-top:3px}
.adm-case{display:flex;flex-direction:row;gap:8px;align-items:center;cursor:pointer;font-size:13.5px;color:var(--fg)}
.adm-case input[type=number]{width:110px}
.adm-quota-nom{flex:1 1 auto;min-width:0}
.adm-nombre{width:110px}
.adm-filtre{display:flex;flex-direction:row;align-items:center;gap:6px}
.adm-filtre select{width:auto}
.adm-filtres{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;align-items:end;background:var(--card);border:1px solid var(--sep);border-radius:14px;padding:12px 14px}
.adm-filtres .champ{margin:0}
.adm-filtres-actions{grid-column:1/-1}
.adm-integrite:empty{display:none}
.adm-integrite .bandeau{margin-bottom:0}
.adm-journal{background:var(--card);border:1px solid var(--sep);border-radius:14px;box-shadow:var(--shadow-card)}
.adm-journal-ligne{display:grid;grid-template-columns:150px 1fr auto;gap:12px;align-items:center;padding:9px 14px;border-top:1px solid var(--sep2)}
.adm-journal-ligne:first-child{border-top:0}
.adm-journal-ligne time{font-size:12.5px;color:var(--fg2);font-variant-numeric:tabular-nums}
.adm-switch{width:44px;height:26px;padding:0;border-radius:13px;background:var(--sunk);border:1px solid var(--field);position:relative;flex:none}
.adm-switch::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--fg2);transition:left .15s}
.adm-switch[aria-checked="true"]{background:var(--accent);border-color:var(--accent)}
.adm-switch[aria-checked="true"]::after{left:21px;background:var(--accent-fg)}
button.adm-switch:hover:not(:disabled){background:var(--hover)}
button.adm-switch[aria-checked="true"]:hover:not(:disabled){background:var(--accent)}
.adm-dl{display:flex;flex-direction:column;gap:3px}
.adm-jauge{display:flex;flex-direction:column;gap:5px}
.adm-barre{height:8px;border-radius:4px;background:var(--sunk);border:1px solid var(--sep2);overflow:hidden}
.adm-barre i{display:block;height:100%;background:var(--ok)}
.adm-barre.moyen i{background:var(--warn)}.adm-barre.haut i{background:var(--err)}
.adm-nettoyage{display:flex;flex-direction:column;gap:8px;max-height:46vh;overflow:auto}
@media (max-width:900px){
  .adm-th{display:none}
  .adm-tr{grid-template-columns:1fr 1fr;row-gap:6px}
  .adm-tr>.adm-nom,.adm-tr>.adm-act{grid-column:1/-1}
  .adm-tr>.adm-act{justify-content:flex-start}
  .adm-lbl{display:block;font-size:11px;color:var(--fg3);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
  .adm-journal-ligne{grid-template-columns:1fr auto}
  .adm-journal-ligne time{grid-column:1/-1}
}