/* La coquille de l'application (refonte, lot 1, 24/10/2026) : barre latérale de la maquette D2-bureau (src/coquille.js).
 * Jetons : src/jetons.css (classe .jt). Bureau (900 px et plus) : barre persistante de 244 px, 70 px repliée ; la page de
 * la carte (body.page-app, en position fixe) glisse à sa droite, et avec elle tout ce qu'elle contient. Téléphone : tiroir
 * par-dessus le contenu, 0,64 × l'écran entre 240 et 300 px, 0,18 s, voile blanc 58 % (clair) ou noir 45 % (sombre),
 * mesuré sur l'app ChatGPT d'Henri. Textes à taille fixe, aucun agrandissement au survol.
 */
:root { --coq-l: 244px; --coq-courbe: cubic-bezier(.32, .72, 0, 1); }
:root.coq-replie { --coq-l: 70px; }
@media (max-width: 899px) { :root, :root.coq-replie { --coq-l: 0px; } }

/* La place de la barre est tenue dès le premier rendu (avant que le module ne la monte) : pas de saut de la carte */
@media (min-width: 900px) {
  html:has(> body.page-app)::before { content: ""; position: fixed; z-index: 0; left: 0; top: 0; bottom: 0; width: var(--coq-l); background: var(--sidebar-fond); }
  html body.page-app { left: var(--coq-l); transition: left .25s var(--coq-courbe); }
  html body.page-app > .pg, html body.page-app > .rapport { left: var(--coq-l); }
}

/* ── La barre ── */
.coq { position: fixed; z-index: 90; left: 0; top: 0; bottom: 0; width: var(--coq-l); display: flex; flex-direction: column; overflow: hidden;
  background: var(--sidebar-fond); border-right: 1px solid var(--filet); color: var(--texte);
  font: 400 var(--t-13)/var(--interligne) var(--police); letter-spacing: 0; -webkit-font-smoothing: antialiased; transition: width .25s var(--coq-courbe); }
.coq *, .coq-menu *, .coq-ecran * { box-sizing: border-box; }
.coq button, .coq-menu button, .coq-ecran button { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; }
.coq-i { width: 15px; height: 15px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.coq-tete { height: 52px; flex: none; display: flex; align-items: center; padding: 0 10px 0 18px; }
.coq-marque { flex: 1; min-width: 0; white-space: nowrap; font-size: var(--t-13); color: var(--encre); text-decoration: none; }
.coq-marque b { font-weight: 600; letter-spacing: .01em; }
.coq-marque span { color: var(--attenue); margin-left: 4px; }
.coq-btn { width: 28px; height: 28px; display: grid; place-items: center; flex: none; border-radius: var(--r-bouton); color: var(--attenue) !important; }
.coq-btn:hover { background: var(--survol) !important; color: var(--encre) !important; }
.coq-corps { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 4px 10px 12px; scrollbar-width: none; }
.coq-corps::-webkit-scrollbar { display: none; }
.coq-titre { height: var(--h-ligne); display: flex; align-items: center; padding: 0 8px; margin-top: 14px; font-size: var(--t-12); font-weight: 500; color: var(--attenue); white-space: nowrap; }
.coq-item { min-height: var(--h-ligne); display: flex; align-items: center; gap: 9px; padding: 0 8px; margin: 1px 0; border-radius: var(--r-bouton);
  color: var(--texte) !important; text-decoration: none !important; font-size: var(--t-13); font-weight: 400; white-space: nowrap; outline-offset: -2px; }
.coq-item .coq-i { color: var(--attenue); }
.coq-item:hover { background: var(--survol); }
.coq-item[aria-current="page"] { background: var(--actif); color: var(--encre) !important; font-weight: 500; }
.coq-item[aria-current="page"] .coq-i { color: var(--encre); }
.coq-lib { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.coq kbd { font: 400 var(--t-11)/1 var(--police); color: var(--discret); padding: 3px 5px; border-radius: var(--r-pastille); background: var(--champ); box-shadow: none; border: 0; }
.coq-pied { flex: none; display: flex; align-items: center; gap: 4px; padding: 10px; border-top: 1px solid var(--filet); white-space: nowrap; }
.coq-qui-btn { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 2px 4px 2px 0 !important; border-radius: var(--r-bouton); text-align: left; }
.coq-avatar { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--actif); color: var(--encre); font-size: var(--t-11); font-weight: 500; }
.coq-qui { flex: 1; min-width: 0; line-height: 1.25; }
.coq-qui b { display: block; overflow: hidden; text-overflow: ellipsis; font-weight: 400; font-size: var(--t-13); color: var(--encre); }
.coq-qui span { display: block; overflow: hidden; text-overflow: ellipsis; font-size: var(--t-12); color: var(--attenue); }

/* repliée : les pictogrammes seuls */
@media (min-width: 900px) {
  .coq-replie .coq-marque, .coq-replie .coq-lib, .coq-replie .coq kbd, .coq-replie .coq-qui, .coq-replie .coq-pied > .coq-btn { display: none; }
  .coq-replie .coq-tete { padding: 0; justify-content: center; }
  .coq-replie .coq-titre { font-size: 0; height: 1px; margin: 10px 8px; padding: 0; background: var(--filet); }
  .coq-replie .coq-item { justify-content: center; padding: 0; height: 32px; }
  .coq-replie .coq-corps { padding: 4px 13px 12px; }
  .coq-replie .coq-pied { justify-content: center; }
  .coq-replie .coq-qui-btn { flex: none; padding: 0 !important; }
}

/* ── Le menu ⋯ ── */
.coq-menu { position: fixed; z-index: 2200; min-width: 240px; padding: 6px; border-radius: var(--r-carte); background: var(--verre-plein); color: var(--texte);
  box-shadow: var(--menu-ombre), var(--verre-filet); font: 400 var(--t-13)/var(--interligne) var(--police); -webkit-backdrop-filter: var(--verre-flou); backdrop-filter: var(--verre-flou); }
.coq-mi { min-height: 30px; width: 100%; display: flex; align-items: center; gap: 9px; padding: 0 8px !important; border-radius: var(--r-bouton); color: var(--texte) !important; text-decoration: none !important; text-align: left; font-size: var(--t-13); }
.coq-mi:hover { background: var(--actif) !important; }
.coq-mi .coq-i { color: var(--attenue); }
.coq-mt { padding: 8px 8px 4px; font-size: var(--t-11); font-weight: 500; color: var(--attenue); }
.coq-menu hr { border: 0; border-top: 1px solid var(--filet); margin: 5px 4px; }
.coq-menu .coq-seg { margin: 2px 4px 6px; }
.coq-repere { position: fixed; top: 8px; width: 1px; height: 0; pointer-events: none; }

/* ── Les écrans de la coquille (Réglages, « bientôt ») : dans la zone de contenu, à droite de la barre ── */
.coq-ecran { position: fixed; z-index: 65; left: var(--coq-l); right: 0; top: 0; bottom: 0; background: var(--fond-app); color: var(--encre);
  font: 400 var(--t-13)/var(--interligne) var(--police); -webkit-font-smoothing: antialiased; transition: left .25s var(--coq-courbe); }
.coq-panneau { position: absolute; inset: 8px; display: flex; flex-direction: column; overflow: hidden; border-radius: var(--r-carte); background: var(--panneau); box-shadow: 0 0 0 1px var(--filet); }
.coq-barre { height: 44px; flex: none; display: flex; align-items: center; gap: 10px; padding: 0 12px 0 16px; border-bottom: 1px solid var(--filet); }
.coq-barre h1 { margin: 0; font-size: var(--t-15); font-weight: 600; color: var(--encre); letter-spacing: 0; }
.coq-reg { flex: 1; overflow-y: auto; padding: 24px 0 48px; }
.coq-reg-col { max-width: 720px; margin: 0 auto; padding: 0 24px; }
.coq-reg-tete h2 { margin: 6px 4px 0; font-size: var(--t-17); font-weight: 600; color: var(--encre); }
.coq-reg-tete p { margin: 4px 4px 22px; font-size: var(--t-13); color: var(--attenue); }
.coq-reg h3 { margin: 24px 0 8px 4px; font-size: var(--t-13); font-weight: 600; color: var(--encre); }
.coq-groupe { border-radius: var(--r-carte); box-shadow: 0 0 0 1px var(--filet); overflow: hidden; }
.coq-rg { display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 8px 16px; font-size: var(--t-13); }
.coq-rg + .coq-rg { border-top: 1px solid var(--filet); }
.coq-t { flex: 1; min-width: 0; }
.coq-t b { display: block; font-weight: 400; color: var(--encre); }
.coq-t span { font-size: var(--t-12); color: var(--attenue); }
.coq-rg .coq-seg { min-width: 300px; }
.coq-bt { min-height: var(--h-bouton); display: inline-flex; align-items: center; justify-content: center; padding: 0 10px !important; border-radius: var(--r-bouton); font-size: var(--t-13); color: var(--texte) !important; text-decoration: none !important; white-space: nowrap; box-shadow: 0 0 0 1px var(--filet-fort); }
.coq-bt:hover { background: var(--survol) !important; color: var(--encre) !important; }
.coq-note { margin: 12px 4px 0; font-size: var(--t-12); line-height: 1.45; color: var(--discret); }
.coq-vide { flex: 1; display: grid; place-items: center; padding: 24px; text-align: center; color: var(--attenue); }
.coq-vide > div { max-width: 420px; }
.coq-vide b { display: block; margin-bottom: 6px; font-size: var(--t-15); font-weight: 500; color: var(--encre); }
.coq-vide p { margin: 0 0 14px; font-size: var(--t-13); line-height: var(--interligne-texte); }
.coq-bientot { display: inline-block; padding: 3px 8px; border-radius: var(--r-pastille); background: var(--champ); font-size: var(--t-11); font-weight: 500; color: var(--attenue); }

/* ── Les doublons que la barre remplace : cachés, leur code reste (rail : Accueil, Thème, Compte, Projets, Outils, MCP ;
   logo de la recherche ; dans le menu du compte, les entrées Projets, Études et Recherche foncière) ── */
html[data-theme] .page-app :is(.commandes, .commandes-tiroir) > :is([data-lien-accueil], [data-theme-bascule], [data-compte], [data-ent-ouvrir], [data-lien-outils], [data-lien-mcp]) { display: none !important; }
html[data-theme] .page-app .haut .marque-mini { display: none !important; }
html[data-theme] .page-app .compte-menu :is([data-ouvrir-projets], [data-ouvrir-etudes], [data-ouvrir-foncier]),
html[data-theme] .page-app .compte-menu .menu-titre:is(:has(+ [data-ouvrir-projets]), :has(+ [data-ouvrir-foncier])) { display: none !important; }

/* ── ≡ et tiroir (téléphone) ── */
.coq-ouvrir-tiroir { display: none !important; }
.coq-voile { display: none; }
@media (max-width: 899px) {
  .coq { width: clamp(240px, 64vw, 300px); z-index: 2100; transform: translateX(-100%); visibility: hidden; border-right: 0;
    transition: transform .18s cubic-bezier(.2, .8, .2, 1), visibility 0s linear .18s; padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
  .coq-tiroir .coq { transform: none; visibility: visible; transition: transform .18s cubic-bezier(.2, .8, .2, 1), visibility 0s; }
  .coq-tete [data-coq-replier] { display: none; }
  .coq-item { min-height: 40px; font-size: var(--t-15); gap: 12px; }
  .coq-item .coq-i { width: 18px; height: 18px; }
  .coq-titre { font-size: var(--t-13); }
  .coq kbd { display: none; }
  .coq-voile { display: block; position: fixed; inset: 0; z-index: 2090; background: var(--voile-tiroir); opacity: 0; pointer-events: none; transition: opacity .18s cubic-bezier(.2, .8, .2, 1); }
  .coq-tiroir .coq-voile { opacity: 1; pointer-events: auto; }
  .coq-ouvrir-tiroir { display: grid !important; place-items: center; width: 32px; height: 32px; flex: none; padding: 0; margin: 0; border: 0; border-radius: var(--r-bouton); background: none; color: var(--encre); cursor: pointer; }
  .coq-ouvrir-tiroir .coq-i { width: 20px; height: 20px; }
  .page-app .haut .coq-tiroir-carte { margin-left: 2px; color: var(--encre); }
  .coq-ecran { left: 0; }
  .coq-panneau { inset: 0; border-radius: 0; box-shadow: none; padding-top: env(safe-area-inset-top); }
  .coq-barre { padding-left: 8px; }
  .coq-rg { flex-wrap: wrap; }
  .coq-rg .coq-seg { min-width: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .coq, .coq-voile, .coq-ecran, html body.page-app { transition: none !important; }
}
