/* ============================================================================
   ██  COQUILLE ATLAS SOURCE — v1 (référence : Cockpit, validée Raphaël 07/07)  ██
   ----------------------------------------------------------------------------
   SOURCE UNIQUE à DUPLIQUER VERBATIM dans chaque brique (Travaux, CR/Réunion,
   Comm, Pilotage, Dashboard). NE PAS forker : seuls le nom de brique + les vrais
   onglets varient (via AtlasShell.init), le reste est identique partout.
   Ce fichier + atlas-shell.js forment le BLOC réutilisable. Manifeste + règles :
   assets/coquille/COQUILLE-ATLAS-SOURCE.md
   ============================================================================ */
/* ============================================================================
   Atlas Shell — coquille transverse de l'univers Dentego
   Feuille de style AUTONOME et RÉUTILISABLE. À inclure telle quelle dans chaque
   brique (Cockpit, Travaux, Pilotage, Réunion, Dashboard, Communication…) et
   dans le portail Atlas lui-même.

   Contrat d'isolation : TOUT est préfixé `.atlas-` et vit sous `.atlas-shell`.
   Aucune règle ne cible d'élément global (pas de reset, pas de `body{}`), donc
   la coquille ne peut pas déteindre sur le front de la brique hôte.

   Palette Dentego (charte opposable) : bleu foncé #005FA0 · bleu clair #0091FF
   · corail #FF7864 · turquoise #00DCB4 · or #E6BE6E. Définie UNIQUEMENT dans les
   variables --a-* ci-dessous (jamais en dur dans une brique).
   Police AUTO-HÉBERGÉE (Plus Jakarta Sans, @font-face ci-dessous, servie par la
   brique en UE) — aucun chargement depuis Google/CDN américain → CSP stricte.
   ========================================================================== */

/* --- Police auto-hébergée : variable (poids 200..800), latin + latin-ext.
   url() relative au CSS → voyage avec la coquille, servie même origine (UE). --- */
@font-face{
  font-family:'Plus Jakarta Sans';font-style:normal;font-weight:200 800;font-display:swap;
  src:url(fonts/pjs-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Plus Jakarta Sans';font-style:normal;font-weight:200 800;font-display:swap;
  src:url(fonts/pjs-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* Jetons PUBLICS, poses sur :root pour etre lisibles AUSSI hors de .atlas-shell —
   une brique en a besoin pour habiller un element a elle (ex. le panneau de bascule
   de profil du mode demo, qui vit dans la page et non dans la coquille).
   Le violet du mode demo vit ICI et NULLE PART AILLEURS : c'est la meme teinte pour
   la pastille du dock, le panneau et la banniere, sur Travaux comme sur Pilotage.
   Regle « une chose = un seul endroit » : aucune brique ne redefinit ces valeurs. */
:root{
  --a-demo:#7C3AED;             /* violet mode demo — pastille du dock, banniere */
  --a-demo-2:#9F67F5;           /* violet clair — degrade de la pastille */
  --a-demo-ink:#5B21B6;         /* texte sur fond violet clair */
  --a-demo-tint:#F5F0FF;        /* fond tres clair — survol des profils */
}

.atlas-shell{
  /* Jetons — surchargables par la brique en redéfinissant ces variables. */
  --a-bleu:#005FA0;             /* Dentego bleu foncé — Pantone 2384 C (charte) */
  --a-bleu-2:#0091FF;           /* Dentego bleu clair — Pantone 2192 C (charte) */
  --a-corail:#FF7864;           /* accent corail — Pantone 2345 C (à doser) */
  --a-turquoise:#00DCB4;        /* accent turquoise — Pantone 3385 C (à doser) */
  --a-or:#E6BE6E;               /* accent or/sable — Pantone 7508 C (à doser) */
  --a-ink:#122536;
  --a-ink-2:#5A6B7E;
  --a-line:#E2EAF2;
  --a-surface:#ffffff;
  --a-surface-2:#F3F7FB;
  --a-alert:#E24A3F;
  --a-amber:#EE9207;
  --a-ok:#12A05C;
  --a-radius:16px;
  --a-radius-sm:11px;
  --a-h-h:58px;                 /* hauteur de l'en-tête (référence de calage) */
  --a-shadow:0 1px 2px rgba(16,40,70,.06), 0 18px 44px rgba(16,40,70,.16);
  --a-shadow-sm:0 1px 2px rgba(16,40,70,.05), 0 8px 22px rgba(16,40,70,.10);
  --a-z:2147480000;
  --a-font:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  font-family:var(--a-font);
  color:var(--a-ink);
}
.atlas-shell *{box-sizing:border-box}
.atlas-shell button{font-family:inherit;cursor:pointer}
.atlas-shell input,.atlas-shell textarea,.atlas-shell select{font-family:inherit}
.atlas-shell :focus-visible{outline:2px solid var(--a-bleu-2);outline-offset:2px;border-radius:6px}

/* ============================= EN-TÊTE ==================================== */
/* Le conteneur du header ne doit PAS generer de boite : sinon il limite la hauteur
   dans laquelle le sticky du header tient -> le header scrollait avec lui. display:contents
   fait du header un enfant direct du body -> son sticky top:0 tient sur toute la page. */
[data-atlas-shell="header"]{display:contents}
.atlas-topbar{
  position:sticky;top:0;left:0;right:0;
  z-index:calc(var(--a-z) - 5);
  display:flex;align-items:center;gap:12px;
  min-height:var(--a-h-h);
  /* Encoche iPhone : on réserve les zones sûres (notch en haut, coins arrondis
     gauche/droite). Le bas garde son padding normal (le header n'y touche pas). */
  padding:max(9px,env(safe-area-inset-top)) max(clamp(10px,2.4vw,20px),env(safe-area-inset-right)) 9px max(clamp(10px,2.4vw,20px),env(safe-area-inset-left));
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,255,255,.92));
  backdrop-filter:saturate(1.4) blur(8px);
  -webkit-backdrop-filter:saturate(1.4) blur(8px);
  border-bottom:1px solid var(--a-line);
}

/* -------- Switcher (logo + marque + brique + chevron) = app-switcher ----- */
.atlas-switcher{
  display:flex;align-items:center;gap:9px;flex:0 0 auto;
  padding:6px 9px 6px 6px;border:1px solid transparent;border-radius:12px;
  background:transparent;color:inherit;transition:background .14s,border-color .14s;
}
.atlas-switcher:hover{background:var(--a-surface-2);border-color:var(--a-line)}
.atlas-switcher[aria-expanded="true"]{background:var(--a-surface-2);border-color:var(--a-line)}
.atlas-switcher .a-logo{
  width:30px;height:30px;border-radius:9px;flex:0 0 auto;
  background:linear-gradient(135deg,var(--a-bleu),var(--a-bleu-2));
  display:grid;place-items:center;color:#fff;font-weight:800;font-size:15px;
  box-shadow:0 4px 12px rgba(0,95,160,.28);
}
.atlas-switcher .a-logo--img{object-fit:cover;box-shadow:none}
/* Monogramme Atlas (le pic dessine) rendu DANS le carre bleu — remplace la lettre A */
.atlas-switcher .a-logo--mono svg,.atlas-mi .a-mi-brandtile--mono svg{width:76%;height:76%;display:block}
.atlas-switcher .a-brand{font-weight:800;font-size:15px;letter-spacing:-.01em}
.atlas-switcher .a-sw-sep{width:1px;height:18px;background:var(--a-line);flex:0 0 auto}
.atlas-switcher .a-brique{font-weight:600;font-size:14px;color:var(--a-ink-2);white-space:nowrap;max-width:24ch;overflow:hidden;text-overflow:ellipsis}
.atlas-switcher .a-chevron{display:grid;place-items:center;flex:0 0 auto}
.atlas-switcher .a-chevron svg{width:15px;height:15px;stroke:var(--a-ink-2);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.atlas-switcher[aria-expanded="true"] .a-chevron svg{transform:rotate(180deg)}

/* -------- Espaceur central (l'en-tête est sobre : switcher · avatar) ----- */
.atlas-topbar-spacer{flex:1 1 auto;min-width:0}

/* Avatar — ouvre le menu (compte/paramètres). */
.atlas-avatar{position:relative;flex:0 0 auto;width:38px;height:38px;border:1px solid var(--a-line);border-radius:50%;padding:0;overflow:hidden;background:var(--a-surface)}
.atlas-avatar .a-av-ini{width:100%;height:100%;display:grid;place-items:center;font-weight:800;font-size:13.5px;color:#fff;background:linear-gradient(135deg,#2C3E52,#4A6076)}
.atlas-avatar .a-av-img{width:100%;height:100%;object-fit:cover;display:block}
.atlas-avatar[aria-expanded="true"]{box-shadow:0 0 0 3px rgba(0,145,255,.28)}

/* ======================= DOCK FLOTTANT (déplaçable) ==================== */
/* Actions fréquentes, UNIFORME partout, en surimpression (aucune page touchée).
   Barre de VERRE compacte, HORIZONTALE par défaut. DÉPLAÇABLE (grip ⠿) : se
   pose sur un bord — gauche/droite → colonne verticale, haut/bas → rangée.
   RÉTRACTABLE (poignée ⌄) : repliée → un seul bouton lanceur. */
.atlas-dock{
  position:fixed;z-index:calc(var(--a-z) - 3);
  display:flex;align-items:center;gap:8px;padding:0;
  /* PLAN TRANSPARENT : le conteneur du dock n'a AUCUN fond, bordure ni ombre.
     La barre de verre est supprimée → on ne voit QUE les pastilles (boutons
     ronds), qui flottent librement. Chaque pastille garde sa propre ombre. */
  border:none;background:none;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  transition:opacity .2s ease, transform .2s ease;
  touch-action:none;
}
.atlas-dock.is-horizontal{flex-direction:row}
.atlas-dock.is-vertical{flex-direction:column}
/* En cours de déplacement : pas de barre non plus — le conteneur reste transparent. */
.atlas-dock.is-dragging{transition:none;cursor:grabbing}
/* Masqué (non interactif) quand un panneau/palette occupe l'écran. */
.atlas-dock.a-hidden{opacity:0;transform:translateY(10px) scale(.96);pointer-events:none}

.atlas-dock-actions{display:flex;align-items:center;gap:6px}
.atlas-dock.is-horizontal .atlas-dock-actions{flex-direction:row}
.atlas-dock.is-vertical .atlas-dock-actions{flex-direction:column}
.atlas-dock.is-collapsed .atlas-dock-actions{display:none}

/* Grip de déplacement (⠿). */
.atlas-dock-grip{
  flex:0 0 auto;width:18px;height:34px;border:none;border-radius:9px;
  background:transparent;color:var(--a-ink-2);display:grid;place-items:center;
  cursor:grab;transition:background .14s,color .14s;touch-action:none;
}
.atlas-dock.is-vertical .atlas-dock-grip{width:34px;height:18px}
.atlas-dock-grip:hover{background:var(--a-surface-2);color:var(--a-ink)}
.atlas-dock-grip:active{cursor:grabbing}
.atlas-dock-grip svg{width:16px;height:16px;fill:currentColor;stroke:none}
.atlas-dock.is-vertical .atlas-dock-grip svg{transform:rotate(90deg)}
.atlas-dock.is-collapsed .atlas-dock-grip{display:none}

/* Boutons compacts (~34px). */
.atlas-dock-btn{
  position:relative;width:34px;height:34px;flex:0 0 auto;
  border:none;border-radius:50%;display:grid;place-items:center;
  font-size:16px;color:#fff;
  /* Ombre douce à deux couches : contact rapproché + halo d'ombre porté.
     Le conteneur étant transparent, cette ombre seule détache la pastille
     du fond — lisible aussi bien sur clair que sur foncé (pas de glow). */
  box-shadow:0 1px 3px rgba(8,26,44,.24),0 6px 16px rgba(8,26,44,.20);
  transition:transform .12s, box-shadow .16s, filter .16s;
}
.atlas-dock-btn .a-db-sym{line-height:1}
.atlas-dock-btn:hover{transform:translateY(-2px);box-shadow:0 2px 5px rgba(8,26,44,.26),0 10px 22px rgba(8,26,44,.26)}
.atlas-dock.is-vertical .atlas-dock-btn:hover{transform:translateX(-2px)}
.atlas-dock-btn:active{transform:scale(.92)}
.atlas-dock-btn--search{background:#fff;color:var(--a-bleu);border:1px solid #cfe6f8;box-shadow:0 3px 10px rgba(0,40,90,.14)}
.atlas-dock-btn--ai{background:linear-gradient(135deg,var(--a-bleu),var(--a-bleu-2))}
/* Gabarit du glyphe IA (SVG) figé : la pastille IA a EXACTEMENT le même poids optique
   que 🔍/💬/💡. Remonté de la brique Comm dans la source le 02/08 (fin du fork local). */
.atlas-dock-btn--ai .a-db-sym{display:grid;place-items:center;width:16px;height:16px}
.atlas-dock-btn--ai .a-db-sym svg{width:16px;height:16px;fill:#fff;stroke:none;display:block}
.atlas-dock-btn--chat{background:linear-gradient(135deg,var(--a-bleu-2),#5CBBFF)}
.atlas-dock-btn--feedback{background:linear-gradient(135deg,#F5A623,#EE9207)}
/* AGIR (cockpit) = « + » blanc sur pastille verte. MÊME dimension que les autres
   boutons du dock (aucun width/height override) — seul le fond et l'icône changent. */
.atlas-dock-btn--agir{background:linear-gradient(135deg,#12A05C,#1FB874)}
.atlas-dock-btn--agir .a-db-plus{display:grid;place-items:center}
.atlas-dock-btn--agir .a-db-plus svg{width:19px;height:19px;stroke:#fff;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
/* REC = micro blanc sur fond rouge pulsant (caméra qui enregistre). */
.atlas-dock-btn--rec{background:linear-gradient(135deg,#F0584C,#E24A3F);animation:atlas-rec-glow 1.7s ease-out infinite}
.atlas-dock-btn--rec .a-db-mic{display:grid;place-items:center}
.atlas-dock-btn--rec .a-db-mic svg{width:17px;height:17px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* DÉMO (travaux, pilotage) = 🎭 sur pastille violette. MÊME dimension que les autres
   (aucun override width/height) — seul le fond change. Violet = code couleur déjà
   utilisé par le mode démo de Travaux, donc reconnaissable sans apprentissage. */
.atlas-dock-btn--demo{background:linear-gradient(135deg,var(--a-demo),var(--a-demo-2))}

/* Présence + pastille de compteur (Conversations). */
.atlas-dock-btn .a-db-presence{position:absolute;top:1px;right:1px;width:8px;height:8px;border-radius:50%;background:var(--a-ok);border:2px solid #fff}
.atlas-dock-badge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--a-alert);color:#fff;font-size:10px;font-weight:800;display:none;align-items:center;justify-content:center;border:1.5px solid #fff}
.atlas-dock-badge.a-show{display:flex}

/* Poignée de repli (⌄). */
.atlas-dock-handle{
  position:relative;flex:0 0 auto;width:26px;height:34px;
  border:none;border-radius:9px;background:transparent;color:var(--a-ink-2);
  display:grid;place-items:center;transition:background .14s,color .14s,transform .12s;
}
.atlas-dock.is-vertical .atlas-dock-handle{width:34px;height:26px}
.atlas-dock-handle:hover{background:var(--a-surface-2);color:var(--a-ink)}
.atlas-dock-handle .a-dh-chev{display:grid;place-items:center}
.atlas-dock-handle .a-dh-chev svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.atlas-dock.is-vertical .atlas-dock-handle .a-dh-chev svg{transform:rotate(-90deg)}
/* Replié = un SEUL bouton lanceur rond (pastille de marque). */
.atlas-dock.is-collapsed{padding:0;background:none;border:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;gap:0}
.atlas-dock.is-collapsed .atlas-dock-handle{
  width:48px;height:48px;border-radius:50%;color:#fff;
  background:linear-gradient(135deg,var(--a-bleu),var(--a-bleu-2));
  box-shadow:0 8px 20px rgba(0,95,160,.34);
}
.atlas-dock.is-collapsed .atlas-dock-handle:hover{box-shadow:0 11px 26px rgba(0,95,160,.42);transform:translateY(-2px)}
.atlas-dock.is-collapsed .atlas-dock-handle .a-dh-chev{display:none}
.atlas-dock-handle .a-dh-launcher{display:grid;place-items:center}
.atlas-dock-handle .a-dh-launcher svg{width:22px;height:22px;fill:currentColor;stroke:none}
/* Point d'alerte sur le lanceur replié quand un compteur > 0. */
.atlas-dock.is-collapsed .atlas-dock-handle.has-alert::after{
  content:"";position:absolute;top:3px;right:3px;width:11px;height:11px;
  border-radius:50%;background:var(--a-alert);border:2px solid #fff;
}

/* Infobulle du dock — orientée selon le bord d'ancrage. */
.atlas-dock-tip{
  position:absolute;white-space:nowrap;background:var(--a-ink);color:#fff;
  font-size:12px;font-weight:600;padding:5px 10px;border-radius:8px;
  box-shadow:var(--a-shadow-sm);opacity:0;pointer-events:none;transition:opacity .14s;z-index:2;
}
.atlas-dock.on-bottom .atlas-dock-tip{bottom:calc(100% + 9px);left:50%;transform:translateX(-50%)}
.atlas-dock.on-top    .atlas-dock-tip{top:calc(100% + 9px);left:50%;transform:translateX(-50%)}
.atlas-dock.on-right  .atlas-dock-tip{right:calc(100% + 10px);top:50%;transform:translateY(-50%)}
.atlas-dock.on-left   .atlas-dock-tip{left:calc(100% + 10px);top:50%;transform:translateY(-50%)}
/* Aux DEUX EXTREMITES d'un dock horizontal, une infobulle centree deborde de l'ecran
   (le dock est pose pres du bord droit par defaut) : on l'accroche alors au bord du
   bouton au lieu de la centrer. Vu sur le bouton Demo, dernier du dock, le 02/08. */
.atlas-dock.is-horizontal .atlas-dock-actions>.atlas-dock-btn:last-child .atlas-dock-tip{left:auto;right:0;transform:none}
.atlas-dock.is-horizontal .atlas-dock-actions>.atlas-dock-btn:first-child .atlas-dock-tip{left:0;right:auto;transform:none}
.atlas-dock-btn:hover .atlas-dock-tip,.atlas-dock-btn:focus-visible .atlas-dock-tip{opacity:1}
@media (hover:none){.atlas-dock-tip{display:none}}

/* ====================== PALETTE DE RECHERCHE (🔍 / Cmd-K) =============== */
.atlas-palette-ov{
  position:fixed;inset:0;z-index:calc(var(--a-z) + 2);
  background:rgba(8,26,44,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  display:none;align-items:flex-start;justify-content:center;padding:13vh 16px 16px;
}
.atlas-palette-ov.a-open{display:flex;animation:a-fade .16s ease both}
.atlas-palette{
  width:min(600px,100%);max-height:72vh;display:flex;flex-direction:column;overflow:hidden;
  background:var(--a-surface);border:1px solid var(--a-line);
  border-radius:18px;box-shadow:var(--a-shadow);animation:a-pop .18s ease both;
}
.atlas-palette-search{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--a-line)}
.atlas-palette-search .a-p-spark{font-size:18px;line-height:1;filter:saturate(1.2)}
.atlas-palette-input{flex:1 1 auto;min-width:0;border:none;outline:none;background:transparent;font-size:16px;color:var(--a-ink)}
.atlas-palette-input::placeholder{color:var(--a-ink-2)}
.atlas-palette-input::-webkit-search-cancel-button{-webkit-appearance:none}
.atlas-palette-kbd{flex:0 0 auto;font-size:10.5px;font-weight:800;color:var(--a-ink-2);border:1px solid var(--a-line);border-radius:6px;padding:2px 7px}
.atlas-palette-close{flex:0 0 auto;width:32px;height:32px;border:none;border-radius:9px;background:transparent;display:grid;place-items:center;color:var(--a-ink-2);transition:background .14s,color .14s}
.atlas-palette-close:hover{background:var(--a-surface-2);color:var(--a-ink)}
.atlas-palette-close svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round}
.atlas-palette-body{flex:1 1 auto;overflow:auto;padding:8px}

/* États + résultats (partagés par la palette). */
.atlas-search-state{padding:26px 18px;text-align:center;color:var(--a-ink-2);font-size:13.5px;line-height:1.5}
.atlas-search-state .a-state-title{display:block;color:var(--a-ink);font-weight:800;font-size:14.5px;margin-bottom:5px}
.atlas-result{display:flex;gap:11px;align-items:flex-start;padding:11px 12px;border-radius:11px;text-decoration:none;color:inherit}
.atlas-result:hover{background:var(--a-surface-2)}
.atlas-result .a-r-ico{width:30px;height:30px;border-radius:8px;flex:0 0 auto;background:#EAF4FC;display:grid;place-items:center;font-size:14px}
.atlas-result .a-r-txt{min-width:0}
.atlas-result .a-r-title{font-weight:700;font-size:13.5px;margin:0 0 2px;display:block}
.atlas-result .a-r-desc{font-size:12px;color:var(--a-ink-2);margin:0;line-height:1.4;display:block}
.atlas-result .a-r-tag{margin-left:auto;flex:0 0 auto;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--a-bleu);background:#EAF4FC;border:1px solid #cfe6f8;padding:2px 7px;border-radius:999px}

/* ===================== MENU DÉROULANT (app-switcher) ==================== */
.atlas-menu{
  position:fixed;z-index:var(--a-z);
  width:min(320px,calc(100vw - 16px));
  background:var(--a-surface);border:1px solid var(--a-line);
  border-radius:var(--a-radius);box-shadow:var(--a-shadow);
  padding:7px;max-height:min(78dvh,640px);overflow:auto;display:none;
}
.atlas-menu.a-open{display:block;animation:a-pop .16s ease both}
.atlas-menu-sec{display:flex;flex-direction:column;gap:1px}
.atlas-menu-h{margin:6px 8px 4px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--a-ink-2)}
.atlas-menu-div{height:1px;background:var(--a-line);margin:7px 4px}

.atlas-mi{
  display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  padding:9px 10px;border:1px solid transparent;border-radius:11px;
  background:transparent;color:var(--a-ink);text-decoration:none;
  font-size:14px;font-weight:600;transition:background .12s,border-color .12s;
}
.atlas-mi:hover,.atlas-mi:focus-visible{background:var(--a-surface-2)}
.atlas-mi .a-mi-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Icône briques (emoji, tuile chaude) */
.atlas-mi .a-mi-emoji{width:30px;height:30px;flex:0 0 auto;display:grid;place-items:center;font-size:17px;border-radius:9px;background:var(--a-surface-2)}
/* Tuile de marque « Retour à Atlas » */
.atlas-mi .a-mi-brandtile{width:30px;height:30px;flex:0 0 auto;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;border-radius:9px;background:linear-gradient(135deg,var(--a-bleu),var(--a-bleu-2))}
/* Icône transverse (SVG mono, jeu disjoint des emoji → aucun doublon) */
.atlas-mi .a-mi-ico{width:30px;height:30px;flex:0 0 auto;display:grid;place-items:center;color:var(--a-ink-2)}
.atlas-mi .a-mi-ico svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* Brique courante : marquée, non cliquable */
.atlas-mi.is-current{background:#EAF4FC;border-color:#cfe6f8;cursor:default}
.atlas-mi.is-current .a-mi-label{color:var(--a-bleu);font-weight:800}
.atlas-mi .a-mi-here{margin-left:auto;flex:0 0 auto;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--a-bleu);background:#fff;border:1px solid #cfe6f8;padding:2px 7px;border-radius:999px}

/* Danger (Quitter) */
.atlas-mi.is-danger .a-mi-ico{color:var(--a-alert)}
.atlas-mi.is-danger:hover{background:#fbe9e7}
.atlas-mi.is-danger:hover .a-mi-label{color:var(--a-alert)}

/* Paramètres : entrée expansible + sous-entrées indentées */
.atlas-mi.has-sub .a-mi-caret{margin-left:auto;flex:0 0 auto;display:grid;place-items:center}
.atlas-mi.has-sub .a-mi-caret svg{width:15px;height:15px;stroke:var(--a-ink-2);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.atlas-mi-group.is-open > .has-sub .a-mi-caret svg{transform:rotate(180deg)}
.atlas-mi-sub{display:flex;flex-direction:column;gap:1px;padding:2px 0 2px 20px;margin:1px 0}
.atlas-mi-sub .atlas-mi{font-weight:600;font-size:13.5px}
.atlas-mi-sub .a-mi-ico svg{width:17px;height:17px}

/* ========================= PANNEAUX (sheets) ============================= */
.atlas-backdrop{position:fixed;inset:0;z-index:calc(var(--a-z) - 1);background:rgba(16,40,70,.28);backdrop-filter:blur(1px);display:none}
.atlas-backdrop.a-open{display:block;animation:a-fade .2s ease both}

.atlas-sheet{
  position:fixed;z-index:var(--a-z);
  right:clamp(12px,2.6vw,22px);top:calc(var(--a-h-h) + 12px);
  width:min(384px,calc(100vw - 24px));
  max-height:calc(100dvh - var(--a-h-h) - 28px);
  background:var(--a-surface);border:1px solid var(--a-line);
  border-radius:var(--a-radius);box-shadow:var(--a-shadow);
  display:none;flex-direction:column;overflow:hidden;
}
.atlas-sheet.a-open{display:flex;animation:a-slide .22s cubic-bezier(.2,.8,.2,1) both}
.atlas-sheet-head{display:flex;align-items:center;gap:10px;padding:14px 14px 13px;border-bottom:1px solid var(--a-line)}
.atlas-sheet-head .a-h-sym{width:34px;height:34px;border-radius:10px;flex:0 0 auto;display:grid;place-items:center;font-size:17px;background:var(--a-surface-2);border:1px solid var(--a-line)}
.atlas-sheet--ai .a-h-sym{background:linear-gradient(135deg,var(--a-bleu),var(--a-bleu-2));border-color:transparent}
.atlas-sheet-head .a-h-avatar{width:26px;height:26px;border-radius:50%;object-fit:cover}
.atlas-sheet-head .a-h-txt{min-width:0;flex:1 1 auto;line-height:1.25}
.atlas-sheet-head .a-h-title{font-weight:800;font-size:15px;letter-spacing:-.01em;display:block}
.atlas-sheet-head .a-h-sub{font-size:11.5px;color:var(--a-ink-2);display:block}
.atlas-sheet-close{width:32px;height:32px;border:none;border-radius:9px;background:transparent;flex:0 0 auto;display:grid;place-items:center;color:var(--a-ink-2);transition:background .14s,color .14s}
.atlas-sheet-close:hover{background:var(--a-surface-2);color:var(--a-ink)}
.atlas-sheet-close svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round}
.atlas-sheet-body{flex:1 1 auto;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.atlas-sheet-foot{border-top:1px solid var(--a-line);padding:10px 12px}

/* Chat (IA + Conversations partagent la mécanique) */
.atlas-msg{max-width:86%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word}
.atlas-msg--bot{align-self:flex-start;background:var(--a-surface-2);border:1px solid var(--a-line);border-bottom-left-radius:5px;color:var(--a-ink)}
.atlas-msg--me{align-self:flex-end;background:var(--a-bleu);color:#fff;border-bottom-right-radius:5px}
.atlas-msg--sys{align-self:center;background:transparent;color:var(--a-ink-2);font-size:12px;text-align:center;max-width:100%}
.atlas-msg--err{align-self:flex-start;background:#fbe9e7;border:1px solid #f4c9c2;color:#a5342b}
.atlas-typing{align-self:flex-start;display:inline-flex;gap:4px;padding:12px 14px;background:var(--a-surface-2);border:1px solid var(--a-line);border-radius:14px;border-bottom-left-radius:5px}
.atlas-typing span{width:6px;height:6px;border-radius:50%;background:var(--a-ink-2);opacity:.5;animation:a-blink 1.2s infinite}
.atlas-typing span:nth-child(2){animation-delay:.2s}
.atlas-typing span:nth-child(3){animation-delay:.4s}
.atlas-composer{display:flex;align-items:flex-end;gap:8px}
.atlas-composer textarea{flex:1 1 auto;resize:none;max-height:120px;padding:10px 12px;border:1px solid var(--a-line);border-radius:12px;font-size:14px;line-height:1.4;color:var(--a-ink);background:var(--a-surface-2)}
.atlas-composer textarea:focus{outline:none;background:#fff;border-color:var(--a-bleu-2);box-shadow:0 0 0 3px rgba(0,145,255,.14)}
.atlas-send{width:40px;height:40px;flex:0 0 auto;border:none;border-radius:12px;background:var(--a-bleu);color:#fff;display:grid;place-items:center;transition:filter .15s,transform .1s}
.atlas-send:hover{filter:brightness(1.08)}
.atlas-send:active{transform:scale(.95)}
.atlas-send[disabled]{opacity:.5;cursor:not-allowed;filter:none}
.atlas-send svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* Conversations : liste de fils (stub) */
.atlas-thread{display:flex;gap:11px;align-items:center;padding:11px 12px;border-radius:12px;text-decoration:none;color:inherit;border:1px solid transparent;cursor:pointer;text-align:left;background:none;width:100%}
.atlas-thread:hover{background:var(--a-surface-2)}
.atlas-thread .a-t-av{width:36px;height:36px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;background:linear-gradient(135deg,var(--a-bleu),var(--a-bleu-2))}
.atlas-thread .a-t-main{min-width:0;flex:1 1 auto}
.atlas-thread .a-t-name{font-weight:700;font-size:13.5px;margin:0;display:block}
.atlas-thread .a-t-last{font-size:12px;color:var(--a-ink-2);margin:1px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.atlas-thread .a-t-meta{margin-left:auto;flex:0 0 auto;text-align:right}
.atlas-thread .a-t-time{font-size:10.5px;color:var(--a-ink-2);display:block}
.atlas-thread .a-t-unread{display:inline-flex;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--a-bleu-2);color:#fff;font-size:10.5px;font-weight:800;align-items:center;justify-content:center;margin-top:3px}

/* Bug & Idée : formulaire */
.atlas-form{display:flex;flex-direction:column;gap:14px}
.atlas-field{display:flex;flex-direction:column;gap:7px}
.atlas-field > .a-label{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--a-ink-2)}
.atlas-segmented{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.atlas-seg{display:flex;align-items:center;justify-content:center;gap:8px;padding:11px;border:1px solid var(--a-line);border-radius:12px;background:var(--a-surface-2);font-weight:700;font-size:13.5px;color:var(--a-ink-2);transition:border-color .14s, background .14s, color .14s}
.atlas-seg .a-seg-sym{font-size:16px}
.atlas-seg[aria-pressed="true"]{background:#EAF4FC;border-color:var(--a-bleu-2);color:var(--a-bleu)}
.atlas-form textarea{min-height:110px;resize:vertical;padding:11px 12px;border:1px solid var(--a-line);border-radius:12px;font-size:14px;line-height:1.5;color:var(--a-ink);background:var(--a-surface-2)}
.atlas-form textarea:focus{outline:none;background:#fff;border-color:var(--a-bleu-2);box-shadow:0 0 0 3px rgba(0,145,255,.14)}
.atlas-submit{padding:12px;border:none;border-radius:12px;background:var(--a-bleu);color:#fff;font-weight:700;font-size:14.5px;transition:filter .15s,transform .1s}
.atlas-submit:hover{filter:brightness(1.08)}
.atlas-submit:active{transform:translateY(1px)}
.atlas-submit[disabled]{opacity:.6;cursor:progress}
.atlas-formmsg{font-size:13px;line-height:1.45;min-height:16px;margin:0}
.atlas-formmsg.a-ok{color:var(--a-ok);font-weight:600}
.atlas-formmsg.a-no{color:var(--a-alert);font-weight:600}
.atlas-formmsg.a-info{color:var(--a-amber);font-weight:600}
.atlas-note{font-size:11px;color:var(--a-ink-2);line-height:1.4;margin:2px 0 0}

/* ============================== TOAST ==================================== */
.atlas-toast{
  position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(10px);
  z-index:var(--a-z);background:var(--a-ink);color:#fff;
  font-size:13px;font-weight:600;padding:11px 16px;border-radius:12px;
  box-shadow:var(--a-shadow);max-width:min(90vw,420px);text-align:center;
  opacity:0;pointer-events:none;transition:opacity .18s, transform .18s;
}
.atlas-toast.a-show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ============================ ANIMATIONS ================================ */
@keyframes a-pop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes a-fade{from{opacity:0}to{opacity:1}}
@keyframes a-slide{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes a-blink{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}
@keyframes a-sheet-up{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}
/* REC : halo rouge pulsant « caméra qui enregistre » (micro blanc sur rouge). */
@keyframes atlas-rec-glow{0%{box-shadow:0 3px 10px rgba(226,74,63,.30),0 0 0 0 rgba(226,74,63,.55)}70%{box-shadow:0 3px 10px rgba(226,74,63,.30),0 0 0 8px rgba(226,74,63,0)}100%{box-shadow:0 3px 10px rgba(226,74,63,.30),0 0 0 0 rgba(226,74,63,0)}}

/* ===================== RESPONSIVE (mobile) ============================== */
@media (max-width:600px){
  .atlas-switcher .a-brand,.atlas-switcher .a-sw-sep{display:none}
}
@media (max-width:430px){
  .atlas-switcher .a-brique{display:none}
}
/* Panneaux = feuilles de bas de page sur mobile. */
@media (max-width:520px){
  .atlas-sheet{left:0;right:0;bottom:0;top:auto;width:100%;max-height:88dvh;border-radius:18px 18px 0 0;border-bottom:none}
  /* Barre du bas d'iPhone (home indicator) : on rembourre le pied de feuille. */
  .atlas-sheet-foot{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  .atlas-sheet-body{padding-bottom:calc(14px + env(safe-area-inset-bottom))}
  .atlas-sheet.a-open{animation:a-sheet-up .24s cubic-bezier(.2,.8,.2,1) both}
}
/* Palette = plein écran sur mobile (seul moyen de recherche sur iPhone). */
@media (max-width:560px){
  .atlas-palette-ov{padding:0}
  .atlas-palette{width:100%;max-width:none;height:100dvh;height:100svh;max-height:none;border-radius:0;border:none}
  /* Encoche : la barre de recherche ne passe pas sous le notch. */
  .atlas-palette-search{padding-top:calc(13px + env(safe-area-inset-top))}
  .atlas-palette-kbd{display:none}
}

/* ======================================================================
   Atlas AI — lockup de marque (monogramme + « Atlas AI ») + mascotte animée.
   La mascotte (tooth-robot Dentego) vit dans l'emplacement symbole de l'en-tête.
   3 états pilotés par classe : .is-idle / .is-thinking / .is-done.
   ==================================================================== */
.atlas-sheet--ai .a-h-sym{
  width:44px;height:44px;border-radius:50%;padding:0;overflow:visible;
  background:none;border:none;box-shadow:none
}
.a-ai-av{position:relative;display:block;width:44px;height:44px;transform-origin:50% 85%}
.a-ai-clip{position:absolute;inset:0;border-radius:50%;overflow:hidden;
  background:radial-gradient(120% 120% at 50% 22%,#3b3e48,#22232a);
  border:1.5px solid var(--a-line);box-shadow:inset 0 0 0 2px rgba(255,255,255,.05)}
.a-ai-face{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%;opacity:0;transition:opacity .3s ease}
.a-ai-av.is-idle    .a-ai-face--idle {opacity:1}
.a-ai-av.is-thinking .a-ai-face--think{opacity:1}
.a-ai-av.is-done    .a-ai-face--happy{opacity:1}
/* micro-vie : respiration au repos, dandinement en réflexion, rebond « content ». */
.a-ai-av.is-idle{animation:a-ai-breathe 4.6s ease-in-out infinite}
.a-ai-av.is-thinking{animation:a-ai-think-bob .95s ease-in-out infinite}
.a-ai-av.is-done{animation:a-ai-pop .5s cubic-bezier(.2,1.5,.4,1) 1}
/* petite bulle de points de réflexion, visible seulement en état thinking. */
.a-ai-think{position:absolute;top:-4px;right:-5px;z-index:2;display:none;gap:2.5px;padding:2.5px 4px;border-radius:8px;background:var(--a-bleu);box-shadow:0 2px 6px rgba(0,40,90,.35)}
.a-ai-av.is-thinking .a-ai-think{display:inline-flex}
.a-ai-think i{width:3.5px;height:3.5px;border-radius:50%;background:#fff;opacity:.6;animation:a-blink 1.2s infinite}
.a-ai-think i:nth-child(2){animation-delay:.2s}
.a-ai-think i:nth-child(3){animation-delay:.4s}
/* Wordmark Atlas COMPLET « Atlas by Dentego » (asset canonique) dans l'en-tête IA,
   à droite de l'avatar mascotte. currentColor = bleu Atlas ; point corail fixe. */
.a-ai-wordmark{display:inline-block;height:24px;color:#245E97;line-height:0}
.a-ai-wordmark svg{height:100%;width:auto;display:block}
@keyframes a-ai-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes a-ai-think-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-2px) rotate(2deg)}}
@keyframes a-ai-pop{0%{transform:scale(.9)}55%{transform:scale(1.13)}100%{transform:scale(1)}}

@media (prefers-reduced-motion:reduce){
  .atlas-shell *,
  .atlas-sheet.a-open,.atlas-backdrop.a-open,.atlas-palette-ov.a-open,.atlas-palette,.atlas-menu.a-open,
  .atlas-toast,.atlas-switcher .a-chevron svg,.atlas-mi-caret svg,
  .atlas-dock,.atlas-dock-btn,.atlas-dock-handle,
  .atlas-dock-btn--rec{animation:none!important;transition:none!important}
  /* REC sans mouvement : garde une lisibilité forte (halo rouge net, fixe). */
  .atlas-dock-btn--rec{box-shadow:0 3px 10px rgba(226,74,63,.30),0 0 0 3px rgba(226,74,63,.5)!important}
  /* Mascotte : pas d'animation, mais l'état reste lisible (bascule de visage nette). */
  .a-ai-av,.a-ai-face,.a-ai-think i{animation:none!important;transition:none!important}
}