/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* ================================================================
   WEBFONTS — SELF-HOSTED (souveraineté : ZÉRO appel externe)
   ----------------------------------------------------------------
   RÈGLE PROJET : l'app ne fait AUCUN appel réseau externe au runtime
   (pas de Google Fonts en <link>, pas de CDN, pas de tracker). Tout
   asset tiers est vendoré dans le dépôt et servi par Propshaft
   (font-src 'self'). Cf. docs/ARCHITECTURE_CHAT_LESUR_AI.md.

   Fichiers : app/assets/fonts/*.woff2 (variable, sous-ensembles
   latin + latin-ext = couverture FR complète). Re-générables via
   le script de vendoring documenté dans l'architecture.
   Familles : Albert Sans (UI), Newsreader (titres, serif italique),
   JetBrains Mono (labels/mono).
   ================================================================ */
@font-face {
  font-family: "Albert Sans";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/albert-sans-normal-latin-ext-ef137efb.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;
}
@font-face {
  font-family: "Albert Sans";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/albert-sans-normal-latin-b7fa586f.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/assets/newsreader-normal-latin-ext-c601fd27.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;
}
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/assets/newsreader-normal-latin-fe979712.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Newsreader";
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url("/assets/newsreader-italic-latin-ext-e778c051.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;
}
@font-face {
  font-family: "Newsreader";
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url("/assets/newsreader-italic-latin-fd8d4ba4.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url("/assets/jetbrains-mono-normal-latin-ext-a2d5a95c.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;
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url("/assets/jetbrains-mono-normal-latin-77c7bd91.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --bg:          oklch(0.974 0.006 250);
  --bg-2:        oklch(0.958 0.008 250);
  --surface:     oklch(0.996 0.003 250);
  --surface-2:   oklch(0.985 0.005 250);
  --ink:         oklch(0.255 0.024 58);
  --ink-2:       oklch(0.37 0.022 58);
  --soft:        oklch(0.49 0.018 60);
  --mute:        oklch(0.61 0.014 62);
  --whisper:     oklch(0.75 0.010 64);
  --line:        oklch(0.87 0.008 250);
  --line-2:      oklch(0.925 0.006 250);

  --bleu:        oklch(0.49 0.145 256);
  --bleu-2:      oklch(0.57 0.140 256);
  --bleu-soft:   oklch(0.93 0.050 256);
  --bleu-ink:    oklch(0.40 0.10 256);
  --terre:       oklch(0.52 0.135 38);
  --terre-2:     oklch(0.58 0.13 40);
  --terre-soft:  oklch(0.93 0.045 40);
  --terre-ink:   oklch(0.44 0.11 40);
  --laiton:      oklch(0.74 0.082 84);
  --laiton-2:    oklch(0.82 0.062 86);
  --laiton-soft: oklch(0.945 0.040 88);
  --sauge:       oklch(0.56 0.045 165);
  --sauge-soft:  oklch(0.93 0.045 162);
  --prune:       oklch(0.52 0.12 312);
  --prune-soft:  oklch(0.93 0.045 312);

  --ok:          oklch(0.55 0.10 162);
  --ok-soft:     oklch(0.93 0.045 162);
  --warn:        oklch(0.62 0.13 64);
  --warn-soft:   oklch(0.945 0.040 88);
  --bad:         oklch(0.55 0.16 28);
  --bad-soft:    oklch(0.94 0.05 28);

  --acc:         var(--bleu);
  --acc-2:       var(--bleu-2);
  --acc-soft:    var(--bleu-soft);
  --acc-ink:     var(--bleu-ink);

  --radius-xs:   8px;
  --radius-sm:   12px;
  --radius:      16px;
  --radius-lg:   22px;
  --radius-xl:   28px;
  --radius-2xl:  36px;
  --shadow-sm:
    0 1px 0 oklch(0.87 0.010 250 / 0.4),
    0 1px 2px oklch(0.26 0.022 58 / 0.06);
  --shadow:
    0 1px 0 oklch(0.87 0.010 250 / 0.6),
    0 8px 24px -16px oklch(0.26 0.022 58 / 0.13);
  --shadow-lg:
    0 1px 0 oklch(0.87 0.010 250 / 0.7),
    0 14px 30px -20px oklch(0.26 0.022 58 / 0.17),
    0 32px 60px -30px oklch(0.26 0.022 58 / 0.13);

  /* Alias historiques. À conserver tant que les surfaces existantes les utilisent. */
  --brique:      var(--bleu);
  --brique-2:    var(--bleu-2);
  --brique-soft: var(--bleu-soft);
}

.ctx-team,
.ctx-acme,
.org.ctx-team,
.org.ctx-acme {
  --acc:       var(--terre);
  --acc-2:     var(--terre-2);
  --acc-soft:  var(--terre-soft);
  --acc-ink:   var(--terre-ink);
}

body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  margin: 0;
}

.portal-topbar {
  align-items: center;
  border-bottom: 1px solid #d7dce2;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 0.75rem 1rem;
}

.portal-topbar span {
  color: #4d5761;
  margin-left: 0.5rem;
}

.portal-actions,
.tenant-switch {
  align-items: center;
  display: flex;
  gap: 0.75rem;
}

.portal-main {
  padding: 1rem;
}

.flash {
  margin-bottom: 1rem;
}

.flash-alert {
  color: #b42318;
}

.flash-notice {
  color: #027a48;
}

/* ── Billing screens (P2-C2) ── */

.plans-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 0.75rem;
}

.plan-card {
  border: 1px solid #d7dce2;
  border-radius: 0.5rem;
  min-width: 220px;
  padding: 1rem;
}

.plan-card--active,
.plan-card--current {
  border-color: #0e7f56;
  background: #f0faf5;
}

.plan-name {
  font-size: 1.1rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.plan-price {
  color: #4d5761;
  margin-bottom: 0.5rem;
}

.plan-tokens {
  color: #4d5761;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
}

.plan-features {
  font-size: 0.9rem;
  list-style: none;
  margin: 0.5rem 0;
  padding: 0;
}

.plan-features li::before {
  margin-right: 0.3rem;
}

.feature-on::before  { content: "✓"; color: #027a48; }
.feature-off::before { content: "✗"; color: #b42318; }

.plan-status,
.plan-period,
.plan-cancel {
  font-size: 0.9rem;
  margin-bottom: 0.25rem;
}

.plan-cancel { color: #b42318; }

.billing-current-plan,
.billing-plans {
  margin-bottom: 2rem;
}

.status-badge {
  display: inline-block;
  border-radius: 0.25rem;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.1rem 0.4rem;
  text-transform: uppercase;
}

.status-badge--active,
.status-badge--trialing { background: #d1fae5; color: #065f46; }
.status-badge--past_due { background: #fef3c7; color: #92400e; }
.status-badge--canceled,
.status-badge--unpaid,
.status-badge--paused   { background: #fee2e2; color: #991b1b; }

.btn-primary {
  background: #0e7f56;
  border: none;
  border-radius: 0.375rem;
  color: #fff;
  cursor: pointer;
  font-size: 0.9rem;
  margin-top: 0.5rem;
  padding: 0.4rem 0.9rem;
}

.btn-primary:hover { background: #065f46; }

.btn-link {
  color: #0e7f56;
  text-decoration: underline;
}

/* Usage gauge */

.usage-quota,
.usage-detail {
  margin-bottom: 2rem;
}

.quota-gauge {
  margin: 0.75rem 0;
  max-width: 480px;
}

.quota-gauge-bar {
  background: #e5e7eb;
  border-radius: 0.5rem;
  height: 1rem;
  overflow: hidden;
}

.quota-gauge-fill {
  background: #0e7f56;
  border-radius: 0.5rem;
  height: 100%;
  transition: width 0.3s ease;
}

.quota-gauge-fill--exceeded { background: #b42318; }

.quota-gauge-labels {
  display: flex;
  font-size: 0.85rem;
  justify-content: space-between;
  margin-top: 0.25rem;
}

.quota-alert {
  color: #b42318;
  font-weight: 600;
}

.quota-stats {
  display: grid;
  font-size: 0.95rem;
  gap: 0.25rem 1.5rem;
  grid-template-columns: auto auto;
  max-width: 360px;
}

.quota-stats dt { color: #4d5761; }
.quota-stats dd { font-weight: 600; margin: 0; }

/* ── Dashboard home (P4-#73) ── */

.dashboard-header {
  margin-bottom: 1.5rem;
}

.dashboard-header h1 {
  margin-bottom: 0.25rem;
}

.dashboard-subtitle {
  color: #4d5761;
  margin: 0;
}

.dashboard-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.dash-section {
  border: 1px solid #d7dce2;
  border-radius: 0.5rem;
  min-width: 220px;
  padding: 1rem 1.25rem;
}

.dash-section h2 {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 0.75rem;
}

.dash-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dash-links li {
  margin-bottom: 0.4rem;
}

.dash-links a {
  color: #0e7f56;
  text-decoration: none;
}

.dash-links a:hover {
  text-decoration: underline;
}

/* Section "coming soon" */

.dash-section--soon {
  border-color: #e5e7eb;
  background: #f9fafb;
}

.badge-soon {
  background: #fef3c7;
  border-radius: 0.25rem;
  color: #92400e;
  font-size: 0.7rem;
  font-weight: 600;
  margin-left: 0.5rem;
  padding: 0.15rem 0.4rem;
  text-transform: uppercase;
  vertical-align: middle;
}

.soon-note {
  color: #4d5761;
  font-size: 0.875rem;
  margin: 0 0 0.75rem;
}

.dash-links--disabled li span {
  color: #9ca3af;
  cursor: not-allowed;
}

.conversation-chat-placeholder {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
}

/* ── Chat principal — fil de conversation (UX03, issue #85) ──────────────────
   Refonte organique de l'écran conversation active. S'appuie sur les tokens
   .org (shell UX02) et le controller Stimulus `chat` (états SSE A1/A3/A4/A6/A7,
   inchangé). Adapté de docs/design/chat-lesur-ai/project/organic.css
   + organic-states.css — direction française souveraine. */

/* Colonne plein-hauteur dans .org-main : barre · fil scrollable · composer */
.chat-page {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  height: 100%;
}

/* Masquage piloté par le controller (submit / stop / indice de génération). Scopé au
   conteneur du controller `chat` pour couvrir les DEUX racines : le chat standard
   (.chat-page) ET le chat privé/éphémère (.org-private-main, UX05), qui hébergent tous
   deux data-controller="chat" et togglent `.hidden` sur leurs cibles. */
[data-controller~="chat"] .hidden { display: none !important; }

/* En-tête : .org-top vient du shell ; ajustements locaux */
.chat-top-head { min-width: 0; flex: 1; }
/* Les titres peuvent aller jusqu'à 500 caractères : on tronque par ellipse pour ne
   jamais déborder sur les actions (.org-top .title est white-space:nowrap côté shell). */
.chat-top-head .title {
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Les actions de l'en-tête ne se compriment jamais sous la pression d'un long titre. */
.chat-page .org-top .actions { flex-shrink: 0; }
.chat-top-head .meta {
  display: flex; align-items: center; flex-wrap: wrap; gap: 7px;
}
.chat-top-head .meta .acme {
  background: var(--laiton-soft); color: oklch(0.45 0.080 50);
  padding: 1px 7px; border-radius: 5px; font-weight: 600;
}

/* En-tête chat : chip projet / bouton « Ranger » + dropdown */
.org-assign { position: relative; display: inline-flex; }
.org-proj-chip,
.org-assign-btn {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: "Albert Sans", system-ui, sans-serif; font-size: 11.5px; font-weight: 500;
  border-radius: 999px; cursor: pointer; transition: all 120ms; line-height: 1;
}
.org-proj-chip {
  padding: 3px 9px 3px 8px; color: var(--ink-2);
  background: var(--surface); border: 1px solid var(--line);
}
.org-proj-chip .dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.org-proj-chip .go { color: var(--mute); }
.org-proj-chip:hover,
.org-proj-chip.on {
  border-color: var(--brique); background: var(--brique-soft); color: var(--brique);
}
.org-proj-chip:hover .go,
.org-proj-chip.on .go { color: var(--brique); }
.org-assign-btn {
  padding: 3px 9px 3px 8px; color: var(--soft);
  background: transparent; border: 1px dashed var(--line);
}
.org-assign-btn .cv { color: var(--mute); }
.org-assign-btn:hover,
.org-assign-btn.on {
  border-color: var(--brique); border-style: solid; color: var(--brique); background: var(--brique-soft);
}
.org-assign-btn:hover .cv,
.org-assign-btn.on .cv { color: var(--brique); }
.org-assign-menu {
  position: absolute; top: calc(100% + 7px); left: 0; z-index: 60;
  width: 286px; max-width: calc(100vw - 32px);
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 14px; box-shadow: var(--shadow-lg); padding: 7px;
  animation: org-assign-pop 130ms ease;
}
.org-assign-menu[hidden] { display: none; }
@keyframes org-assign-pop {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: none; }
}
.org-assign-menu .srch {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; margin-bottom: 6px;
  border: 1px solid var(--line); border-radius: 10px; background: var(--bg-2); color: var(--soft);
}
.org-assign-menu .srch input {
  flex: 1; min-width: 0; border: none; background: transparent; outline: none;
  font-family: inherit; font-size: 13px; color: var(--ink);
}
.org-assign-menu .srch input::placeholder { color: var(--mute); }
.org-assign-menu .lbl {
  font-family: "JetBrains Mono", monospace; font-size: 9px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--mute); padding: 6px 10px 5px;
}
.org-assign-menu .mlist {
  display: flex; flex-direction: column; gap: 1px; max-height: 200px; overflow-y: auto;
}
.org-assign-menu .mlist::-webkit-scrollbar { width: 6px; }
.org-assign-menu .mlist::-webkit-scrollbar-thumb { background: var(--line); border-radius: 3px; }
.org-assign-menu .empty {
  font-size: 12px; color: var(--mute); padding: 8px 10px; font-style: italic;
}
.org-assign-menu .org-assign-create { display: contents; }
.org-assign-menu .mi {
  display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  padding: 8px 10px; border-radius: 9px; font-size: 13px; color: var(--ink-2);
  background: transparent; border: none; cursor: pointer; font-family: inherit;
  transition: background 110ms; text-decoration: none;
}
.org-assign-menu .mi[hidden] { display: none; }
.org-assign-menu .mi:hover { background: var(--surface-2); }
.org-assign-menu .mi .dot {
  width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0;
  box-shadow: 0 0 0 1px oklch(0.26 0.022 58 / 0.10);
}
.org-assign-menu .mi .nm { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.org-assign-menu .mi .ct {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
}
.org-assign-menu .mi .ck { color: var(--brique); display: inline-flex; }
.org-assign-menu .mi.cur { background: var(--brique-soft); color: var(--brique); font-weight: 500; }
.org-assign-menu .mi.cur:hover { background: var(--brique-soft); }
.org-assign-menu .sep { height: 1px; background: var(--line-2); margin: 6px 8px; }
.org-assign-menu .mi.create { color: var(--brique); font-weight: 500; }
.org-assign-menu .mi.create .plus {
  width: 18px; height: 18px; border-radius: 6px; background: var(--brique-soft); color: var(--brique);
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.org-assign-menu .mi.muted { color: var(--soft); }
.org-assign-menu .mi.muted .gi {
  width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center;
  color: var(--mute); flex-shrink: 0;
}

/* Pastilles d'état de la conversation (éphémère / visibilité) */
.chat-meta-badge {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
  letter-spacing: 0.06em; padding: 1px 7px; border-radius: 999px;
  background: var(--surface-2); color: var(--soft); border: 1px solid var(--line);
}
.chat-meta-badge--ephemeral {
  background: var(--laiton-soft); color: oklch(0.46 0.085 60);
  border-color: var(--laiton-2);
}

/* button_to enveloppe chaque action dans un <form> : neutraliser sa mise en page */
.chat-top-form { display: inline-flex; margin: 0; }
.org-top .actions .org-icon-btn { cursor: pointer; }
.org-top .actions .org-icon-btn.is-on {
  background: var(--brique-soft); border-color: oklch(0.86 0.060 256); color: var(--brique);
}

/* ── Fil scrollable ─────────────────────────────────────────────────────── */
.chat-scroll {
  flex: 1; min-height: 0; overflow-y: auto;
  padding: 30px 32px 10px;
  display: flex; flex-direction: column; gap: 26px;
  scroll-behavior: smooth;
}
.chat-messages-empty {
  margin: auto; max-width: 420px; text-align: center;
  font-family: "Newsreader", serif; font-style: italic;
  font-size: 15px; color: var(--whisper); line-height: 1.5;
}

/* Chaque message occupe la colonne lisible centrée (≤ 740px) */
.chat-message {
  width: 100%; max-width: 740px; margin: 0 auto;
  display: flex; gap: 14px; align-items: flex-start;
}
.chat-message--user { justify-content: flex-end; }

/* Monogramme « L » de l'assistant (whisper art déco), pseudo décoratif */
.chat-message--assistant::before {
  content: "L";
  width: 34px; height: 34px; flex-shrink: 0;
  background: var(--surface); border: 1px solid var(--line); border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic; font-size: 20px;
  color: var(--ink); box-shadow: var(--shadow-sm);
}

/* Bulles */
.chat-message-bubble {
  max-width: calc(100% - 48px); min-width: 0;
  padding: 16px 20px; font-size: 14.5px; line-height: 1.6;
}
.chat-message--user .chat-message-bubble {
  background: var(--brique-soft); color: var(--ink);
  border: 1px solid oklch(0.85 0.065 256);
  border-radius: 22px 22px 6px 22px; box-shadow: var(--shadow-sm);
}
.chat-message--assistant .chat-message-bubble {
  background: var(--surface); color: var(--ink); border: 1px solid var(--line);
  border-radius: 6px 22px 22px 22px; box-shadow: var(--shadow); padding: 16px 22px;
}

.chat-message-content {
  white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word;
}

.chat-message-content--markdown {
  white-space: normal;
}
.chat-message-content--markdown > :first-child { margin-top: 0; }
.chat-message-content--markdown > :last-child { margin-bottom: 0; }
.chat-message-content--markdown p { margin: 0 0 10px; }
.chat-message-content--markdown ul,
.chat-message-content--markdown ol {
  margin: 0 0 10px 1.2rem;
  padding: 0;
}
.chat-message-content--markdown li { margin: 2px 0; }
.chat-message-content--markdown a {
  color: var(--brique);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.chat-message-content code { font-family: "JetBrains Mono", monospace; font-size: 12.5px; }
.chat-message-content :not(pre) > code {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 1px 5px;
}
.chat-message-content pre {
  margin: 8px 0 0; padding: 12px 14px; overflow-x: auto;
  background: oklch(0.24 0.018 58); color: oklch(0.90 0.012 70);
  border-radius: 10px; line-height: 1.6;
  font-family: "JetBrains Mono", monospace; font-size: 12.5px;
}

/* Curseur de streaming (A4) — caret bleu clignotant */
.chat-cursor {
  display: inline-block; width: 7px; height: 1.05em; vertical-align: -2px;
  margin-left: 2px; border-radius: 1px; background: var(--brique);
  animation: chat-blink 1s step-end infinite;
}
@keyframes chat-blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }

/* Réflexion avant le premier token (A1) — la bulle ne porte que le caret ;
   le détail « L. rédige… » est porté par le composer (chat-gen-hint). */
.chat-message--thinking .chat-message-bubble { color: var(--soft); }

/* États chat avancés hors raisonnement (clarification, outils, deferred). */
.chat-advanced-state {
  margin-top: 12px; border-radius: 12px; padding: 12px 14px;
  border: 1px solid var(--line); background: var(--surface-2);
}
.chat-inline-key {
  width: 20px; height: 20px; border-radius: 7px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--brique-soft); color: var(--brique);
  font-family: "JetBrains Mono", monospace; font-size: 10px; font-weight: 700;
}
.chat-state-badge {
  margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 8px; border-radius: 999px;
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; font-weight: 600;
}
.chat-state-badge::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor;
}
.chat-state-badge--run { color: var(--brique); background: var(--brique-soft); }
.chat-state-badge--wait { color: oklch(0.48 0.07 60); background: var(--laiton-soft); }
.chat-state-badge--ok { color: oklch(0.42 0.06 165); background: oklch(0.94 0.035 165); }
.chat-state-badge--err { color: oklch(0.50 0.14 28); background: oklch(0.96 0.030 30); }

.chat-clarification {
  border-color: oklch(0.86 0.060 256); background: oklch(0.98 0.014 256);
}
.chat-clarification-intro {
  margin-bottom: 8px; color: var(--soft); font-size: 12.5px; line-height: 1.5;
}
.chat-clarification-question {
  color: var(--ink); font-weight: 650; font-size: 13.5px; line-height: 1.45;
}
.chat-clarification-options {
  display: flex; flex-direction: column; gap: 7px; margin-top: 11px;
}
.chat-clarification-option {
  width: 100%; display: flex; align-items: center; gap: 9px; text-align: left;
  padding: 8px 10px; border-radius: 10px; border: 1px solid var(--line);
  background: var(--surface); color: var(--ink-2); cursor: pointer;
}
.chat-clarification-option:hover {
  border-color: oklch(0.86 0.060 256); background: var(--brique-soft); color: var(--ink);
}
.chat-clarification-free {
  margin-top: 10px; color: var(--mute); font-size: 12px;
  font-family: "Newsreader", serif; font-style: italic;
}

.chat-tool-run {
  position: relative; display: grid; grid-template-columns: 1fr auto; gap: 4px 12px;
  border-color: oklch(0.88 0.05 256); background: var(--brique-soft);
}
.chat-tool-run-title { color: var(--ink); font-weight: 650; font-size: 13px; }
.chat-tool-run-meta {
  color: var(--soft); font-family: "JetBrains Mono", monospace; font-size: 10.5px;
}
.chat-tool-run .chat-state-badge { grid-row: 1 / span 2; align-self: center; }

/* Carte confirmation outil différé (P5-D1) */
.chat-tool-confirm {
  border-color: var(--laiton-2); background: var(--laiton-soft);
}
.chat-tool-confirm-header { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.chat-tool-confirm-icon {
  width: 32px; height: 32px; border-radius: 10px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--laiton-2); background: oklch(0.99 0.005 85);
  color: oklch(0.50 0.09 60); font-family: "JetBrains Mono", monospace; font-weight: 800;
}
.chat-tool-confirm-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.chat-tool-confirm-name { font-size: 13px; font-weight: 650; color: var(--ink); font-family: JetBrains Mono, monospace; }
.chat-tool-confirm-cap {
  font-size: 10.5px; padding: 1px 6px; border-radius: 6px;
  background: oklch(0.88 0.06 55); color: oklch(0.45 0.08 55); font-weight: 500;
  width: fit-content;
}
.chat-tool-confirm-body { font-size: 12.5px; color: var(--ink-2); margin-bottom: 10px; line-height: 1.5; }
.chat-tool-confirm-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.chat-tool-confirm-resolved { font-size: 12.5px; font-weight: 500; color: var(--ink-2); padding: 4px 0; }
.chat-tool-confirm-error { font-size: 11.5px; color: oklch(0.45 0.15 28); margin-top: 6px; }

.chat-tool-degraded {
  display: flex; gap: 11px; border-color: var(--laiton-2); background: oklch(0.98 0.016 75);
}
.chat-tool-degraded-icon {
  width: 26px; height: 26px; border-radius: 9px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  color: oklch(0.55 0.09 60); border: 1px solid var(--laiton-2);
  font-family: "JetBrains Mono", monospace; font-weight: 800;
}
.chat-tool-degraded-title { color: var(--ink); font-weight: 650; font-size: 13px; }
.chat-tool-degraded-sub { color: var(--soft); font-size: 12.5px; line-height: 1.5; margin-top: 3px; }
.chat-tool-degraded-fallback {
  margin-top: 7px; color: var(--mute); font-family: "JetBrains Mono", monospace; font-size: 10px;
}

.chat-tool-deferred {
  border-color: oklch(0.88 0.05 256); background: var(--surface);
}
.chat-tool-deferred-header { display: flex; align-items: center; gap: 11px; }
.chat-tool-deferred-icon {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--brique-soft); border: 1px solid oklch(0.88 0.05 256);
  color: var(--brique); font-family: "JetBrains Mono", monospace; font-weight: 800;
}
.chat-tool-deferred-info { min-width: 0; flex: 1; }
.chat-tool-deferred-title { color: var(--ink); font-size: 13.5px; font-weight: 650; }
.chat-tool-deferred-sub { color: var(--mute); font-family: "JetBrains Mono", monospace; font-size: 10px; margin-top: 2px; }
.chat-tool-deferred-progress {
  height: 6px; border-radius: 4px; overflow: hidden; background: var(--line-2); margin-top: 13px;
}
.chat-tool-deferred-progress > div { height: 100%; background: var(--brique); border-radius: 4px; }
.chat-tool-deferred-foot { margin-top: 10px; color: var(--mute); font-family: "JetBrains Mono", monospace; font-size: 10px; }

/* Réponse interrompue (A6) */
.chat-message--interrupted .chat-message-bubble { border-style: dashed; opacity: 0.92; }
.chat-message--interrupted .chat-message-bubble::after {
  content: "réponse interrompue"; display: block; margin-top: 10px;
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
  letter-spacing: 0.05em; color: var(--mute);
}

/* Erreur de génération (A7) — carte sépia/rouge sobre */
.chat-message--error .chat-message-bubble {
  background: oklch(0.96 0.030 30); border-color: oklch(0.80 0.090 28); color: oklch(0.42 0.12 28);
}
.chat-system-error {
  width: 100%; max-width: 740px; margin: 0 auto;
  padding: 13px 16px; border-radius: 14px;
  background: oklch(0.96 0.030 30); border: 1px solid oklch(0.80 0.090 28);
  color: oklch(0.45 0.10 28); font-size: 13px; text-align: center;
}

/* ── Raisonnement repliable (A2) ── */
.chat-reason {
  margin-top: 12px;
  border-left: 2px solid var(--line);
  background: var(--bg-2); border-radius: 0 12px 12px 0;
}
.chat-reason-toggle {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 14px; font-size: 12.5px; color: var(--soft);
  cursor: pointer; list-style: none; user-select: none;
}
.chat-reason-toggle::-webkit-details-marker { display: none; }
.chat-reason-toggle::before {
  content: "›"; font-size: 15px; line-height: 1;
  transition: transform 0.15s ease; color: var(--mute);
}
.chat-reason[open] > .chat-reason-toggle::before { transform: rotate(90deg); }
.chat-reason[open] > .chat-reason-toggle { color: var(--ink-2); font-weight: 500; }
.chat-reason-body {
  padding: 0 16px 14px; font-size: 13px; line-height: 1.6;
  color: var(--soft); font-family: "Newsreader", serif; white-space: pre-wrap;
}

/* ── Citations / sources (B5) ── */
.chat-sources {
  margin-top: 14px; padding-top: 12px;
  border-top: 1px dashed var(--line);
  display: flex; flex-direction: column; gap: 8px;
}
.chat-sources-head {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--mute); font-weight: 600;
}
.chat-source { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--ink-2); }
.chat-source .n {
  width: 16px; height: 16px; flex-shrink: 0; border-radius: 5px;
  background: var(--brique-soft); color: var(--brique);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; font-weight: 600;
}
.chat-source .label { color: var(--ink-2); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.chat-source .label:hover, .chat-source a.label:hover { color: var(--brique); text-decoration: underline; }
.chat-source .dom { margin-left: auto; padding-left: 8px; font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); flex-shrink: 0; }

/* ── Feedback pouce (B6) ── */
.chat-feedback {
  width: 100%; max-width: 740px; margin: 6px auto 0;
  display: flex; align-items: center; gap: 4px; padding-left: 48px;
}
.chat-feedback-btn {
  width: 30px; height: 30px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--soft); background: transparent; border: 1px solid transparent; cursor: pointer;
}
.chat-feedback-btn:hover { background: var(--surface); border-color: var(--line); color: var(--ink); }
.chat-feedback-btn.is-active { background: var(--brique-soft); border-color: oklch(0.86 0.060 256); color: var(--brique); }
.chat-feedback-thanks {
  margin-left: 8px; font-family: "Newsreader", serif; font-style: italic;
  font-size: 13px; color: var(--soft);
}

/* ── Quota atteint (D5) ── */
.chat-quota {
  width: 100%; max-width: 740px; margin: 0 auto;
  display: flex; align-items: center; gap: 14px;
  padding: 16px 18px; border-radius: 16px;
  background: var(--laiton-soft); border: 1px solid var(--laiton-2);
}
.chat-quota-ic {
  width: 36px; height: 36px; flex-shrink: 0; border-radius: 11px;
  background: oklch(0.99 0.005 85); border: 1px solid var(--laiton-2);
  display: inline-flex; align-items: center; justify-content: center; color: oklch(0.50 0.09 60);
}
.chat-quota-title { font-size: 13.5px; font-weight: 600; color: oklch(0.40 0.07 60); }
.chat-quota-sub { font-size: 12.5px; color: oklch(0.46 0.05 62); margin-top: 2px; }
.chat-quota-cta {
  margin-left: auto; flex-shrink: 0; white-space: nowrap;
  padding: 8px 14px; border-radius: 10px; text-decoration: none;
  background: var(--ink); color: oklch(0.95 0.012 72); font-size: 12.5px; font-weight: 600;
}
.chat-quota-cta:hover { background: var(--ink-2); }
.chat-trial-exhausted .chat-quota-ic { color: var(--brique); background: var(--surface); }

/* ── Composer (la coque .org-composer / .org-send / .org-reassure vient du shell) ── */
.chat-form { display: flex; flex-direction: column; }
.chat-form--access-locked .org-composer {
  opacity: 0.72;
  border-style: dashed;
}
.chat-form--access-locked .org-composer-input {
  cursor: not-allowed;
}

/* Indice de génération (A5), au-dessus de la coque */
.chat-gen-hint {
  display: flex; align-items: center; gap: 8px; margin: 0 0 8px 4px;
  font-family: "JetBrains Mono", monospace; font-size: 10.5px; color: var(--soft);
}
.chat-gen-dots { display: inline-flex; gap: 3px; }
.chat-gen-dots span {
  width: 4px; height: 4px; border-radius: 50%; background: var(--brique);
  animation: chat-bounce 1.2s infinite;
}
.chat-gen-dots span:nth-child(2) { animation-delay: 0.15s; }
.chat-gen-dots span:nth-child(3) { animation-delay: 0.3s; }
@keyframes chat-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: 0.4; }
  40% { transform: translateY(-4px); opacity: 1; }
}

/* Textarea : saisie nette (l'aspect italique reste sur le seul placeholder) */
.chat-input {
  font-family: "Albert Sans", system-ui, sans-serif; font-style: normal;
  font-weight: 400; color: var(--ink); max-height: 200px; overflow-y: auto;
}
.chat-input::placeholder { font-family: "Newsreader", serif; font-style: italic; color: var(--mute); }

/* Sélecteur de modèle : le model-picker UX04 (.chat-model-row + popover) est intégré
   dans la barre du composer organique. On neutralise son padding pour qu'il s'aligne
   avec le bouton d'envoi ; il garde position:relative pour ancrer le popover (qui
   s'ouvre vers le haut, cf. .org-popover). Les styles .org-model-pill/.org-effort-pill/
   .org-popover viennent du shell (UX04). */
.org-composer-row .chat-model-row { padding: 0; gap: 7px; }

/* ── Picker de base C1 (.mp-*) — issue #281 ──────────────────────────────── */
.mp-pop {
  box-sizing: border-box;
  position: fixed;
  top: 0;
  left: 0;
  width: min(416px, calc(100vw - 32px));
  max-height: min(520px, calc(100dvh - 120px));
  overflow-y: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 14px 14px 12px;
  z-index: 1000;
  overscroll-behavior: contain;
}
.mp-pop::after {
  content: "";
  position: absolute; bottom: -7px; left: var(--mp-arrow-left, 34px);
  width: 13px; height: 13px; background: var(--surface);
  border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  transform: rotate(45deg);
}
.mp-pop.drop-down::after {
  top: -7px;
  bottom: auto;
  border: 0;
  border-left: 1px solid var(--line);
  border-top: 1px solid var(--line);
}
.mp-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 2px 4px 12px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--line-2);
}
.mp-head .ttl {
  font-family: "Newsreader", serif; font-style: italic; font-weight: 400;
  font-size: 17px; color: var(--ink); letter-spacing: -0.01em; white-space: nowrap;
}
.mp-head .sov {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: oklch(0.42 0.13 256);
  background: var(--brique-soft);
  border: 1px solid oklch(0.86 0.060 256);
  border-radius: 999px; padding: 4px 9px 4px 7px;
}
.mp-provider-switch {
  display: inline-flex; align-items: center; gap: 7px;
  min-width: 0;
  font-family: "JetBrains Mono", monospace; font-size: 9px; font-weight: 600;
  letter-spacing: 0.10em; text-transform: uppercase; color: var(--mute);
}
.mp-provider-switch select {
  max-width: 190px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--ink-2);
  font: 500 11px "Albert Sans", system-ui, sans-serif;
  letter-spacing: 0;
  text-transform: none;
  padding: 5px 26px 5px 10px;
}
.mp-ic {
  width: 38px; height: 38px; flex-shrink: 0;
  border-radius: 11px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  color: var(--soft);
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow-sm);
}
.mp-list { display: flex; flex-direction: column; gap: 3px; }
.mp-opt {
  display: grid;
  grid-template-columns: 38px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 9px 11px 9px 9px;
  border-radius: 14px;
  border: 1px solid transparent;
  cursor: default;
  position: relative;
  width: 100%;
  background: transparent;
  text-align: left;
}
.mp-opt[hidden],
.mp-empty[hidden] { display: none !important; }
.mp-opt:hover { background: var(--surface-2); }
.mp-body { min-width: 0; }
.mp-name {
  display: flex; align-items: center; gap: 8px;
  font-family: "Albert Sans", sans-serif; font-weight: 600; font-size: 14.5px;
  color: var(--ink); line-height: 1.1;
}
.mp-use {
  font-size: 12.5px; color: var(--soft); line-height: 1.4;
  margin-top: 3px; text-wrap: pretty;
}
.mp-code {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  color: var(--mute); letter-spacing: 0.01em;
  margin-top: 6px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
}
.mp-code .prov { color: var(--whisper); white-space: nowrap; }
.mp-code .dot { color: var(--laiton); }
.mp-code .org-coc,
.mp-code .prov-dot {
  width: 10px;
  height: 10px;
}
.mp-aside { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.mp-check {
  width: 20px; height: 20px; border-radius: 50%;
  border: 1.5px solid var(--line); color: transparent;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.mp-reco {
  font-family: "JetBrains Mono", monospace; font-size: 9px; font-weight: 600;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: oklch(0.45 0.080 50);
  background: var(--laiton-soft);
  border: 1px solid var(--laiton-2);
  border-radius: 999px; padding: 2.5px 8px;
  line-height: 1;
}
.mp-opt.on, .mp-opt.sel {
  background: var(--brique-soft);
  border-color: oklch(0.86 0.060 256);
  box-shadow: inset 3px 0 0 var(--brique);
}
.mp-opt.on .mp-ic, .mp-opt.sel .mp-ic {
  background: var(--brique);
  border-color: var(--brique);
  color: oklch(0.98 0.008 250);
  box-shadow: var(--shadow-sm), 0 0 0 1px oklch(0.99 0.005 85) inset;
}
.mp-opt.on .mp-name, .mp-opt.sel .mp-name { color: oklch(0.34 0.13 256); }
.mp-opt.on .mp-use, .mp-opt.sel .mp-use { color: oklch(0.43 0.07 256); }
.mp-opt.on .mp-check, .mp-opt.sel .mp-check {
  background: var(--brique); border-color: var(--brique);
  color: oklch(0.99 0.005 85);
}
.mp-sub {
  font-family: "JetBrains Mono", monospace; font-size: 9px;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--mute);
  padding: 2px 6px 8px; display: flex; align-items: center; gap: 10px;
}
.mp-sub::after { content: ""; flex: 1; height: 1px; background: var(--line-2); }
.mp-pop.v-grouped .mp-list { gap: 3px; }
.mp-pop.v-grouped .mp-sub { padding-top: 12px; }
.mp-empty {
  padding: 12px 10px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--soft);
  font-size: 12.5px;
  background: var(--surface-2);
}
.mp-foot {
  display: flex; align-items: center; gap: 10px;
  margin-top: 12px; padding: 11px 6px 2px;
  border-top: 1px dashed var(--line);
}
.mp-foot .note {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
  color: var(--mute); letter-spacing: 0.02em; line-height: 1.5;
  flex: 1; text-wrap: pretty;
}
.mp-foot .adv {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; color: var(--soft); white-space: nowrap;
  font-family: "Albert Sans", sans-serif;
  text-decoration: none;
}
.mp-foot .adv:hover { color: var(--brique); }
@media (max-width: 480px) {
  .mp-pop { width: min(416px, calc(100vw - 32px)); }
}

.org-empty-main .mp-pop,
.mp-pop.home-context {
  max-height: min(320px, calc(100dvh - 220px));
}

.org-empty-main form:has(.model-picker-drop-down) {
  margin-bottom: calc(min(320px, 100dvh - 220px) + 20px);
}

.chat-composer-spacer { flex: 1; }

/* Bouton Stop (A5) — le send devient un carré d'arrêt encre */
.org-send.stop {
  background: var(--ink);
  box-shadow: 0 0 0 1px oklch(0.99 0.005 250) inset, 0 0 0 1px var(--ink),
              0 5px 14px -6px oklch(0.26 0.022 58 / 0.5);
}
.org-send.stop::after { display: none; }
.org-send.stop:hover { background: var(--ink-2); }
.st-stop-sq { width: 12px; height: 12px; border-radius: 3px; background: oklch(0.95 0.012 72); }

/* Notice d'archivage */
.chat-archived-notice {
  flex-shrink: 0; margin: 12px 32px 0; padding: 9px 14px;
  background: var(--laiton-soft); border: 1px solid var(--laiton-2);
  border-radius: 11px; text-align: center; font-size: 12.5px; color: oklch(0.44 0.07 60);
}

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media (max-width: 720px) {
  .chat-scroll { padding: 20px 16px 8px; gap: 20px; }
  .chat-message--assistant::before { width: 30px; height: 30px; font-size: 18px; }
  .chat-message-bubble { max-width: calc(100% - 42px); padding: 14px 16px; }
  .chat-message--user .chat-message-bubble { max-width: 88%; }
  .chat-archived-notice { margin: 12px 16px 0; }
  .chat-page .org-bottom { padding-left: 16px; padding-right: 16px; }
  .chat-page .org-reassure { flex-wrap: wrap; row-gap: 4px; }
}

/* ── Palette ⌘K organique (UX06, issues #50/#88) ── */

.org-scrim {
  position: fixed; inset: 0; z-index: 900;
  background: oklch(0.26 0.022 58 / 0.28);
  backdrop-filter: blur(2px);
  display: flex; align-items: flex-start; justify-content: center;
  padding-top: 15vh;
}
.org-scrim[hidden] { display: none; }

.org-palette {
  width: min(620px, 92vw);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.org-palette-search {
  display: flex; align-items: center; gap: 12px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line-2);
}

.org-palette-input {
  flex: 1; border: none; outline: none; background: transparent;
  font-size: 17px; color: var(--ink); font-family: inherit;
}
.org-palette-input::placeholder { color: var(--soft); }
.org-palette-input::-webkit-search-decoration,
.org-palette-input::-webkit-search-cancel-button { display: none; }

.org-palette-body { padding: 10px 12px 14px; max-height: 420px; overflow-y: auto; }

.org-palette-sh {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--mute); padding: 10px 8px 6px; font-weight: 600;
}

.org-result {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-radius: 12px; cursor: default;
  text-decoration: none; color: inherit;
}
.org-result.on { background: var(--brique-soft); }

.org-result .ic2 {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
  background: var(--surface-2); border: 1px solid var(--line);
  display: inline-flex; align-items: center; justify-content: center; color: var(--soft);
}
.org-result.on .ic2 { background: var(--surface); border-color: oklch(0.86 0.060 256); color: var(--brique); }

.org-result .t { font-size: 13.5px; color: var(--ink); font-weight: 500; }
.org-result .t mark { background: oklch(0.86 0.10 256 / 0.5); color: inherit; border-radius: 3px; padding: 0 2px; }
.org-result .s { font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); margin-top: 2px; }
.org-result .meta { margin-left: auto; font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); }

.org-palette-foot {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 18px; border-top: 1px solid var(--line-2);
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); letter-spacing: 0.04em;
}

.org-kbd {
  display: inline-block; padding: 1px 6px; border-radius: 5px;
  border: 1px solid var(--line); background: var(--surface-2);
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--soft);
}

.org-palette-empty {
  color: var(--mute); font-size: 0.9rem; padding: 1rem; text-align: center;
  font-family: "JetBrains Mono", monospace;
}

/* ================================================================
   CHAT SHELL ORGANIQUE (UX02+, issue #84)
   Adapté de docs/design/chat-lesur-ai/project/organic.css
   et organic-screens.css — direction française souveraine.
   ================================================================ */

/* --- Tokens (portée : tout élément avec class .org) --- */
.org {
  /* Accents d'espace — palette workspace switcher (#266) */
  --acc-bleu:    var(--bleu);       --acc-bleu-s:    var(--bleu-soft);
  --acc-laiton:  oklch(0.55 0.090 85); --acc-laiton-s:  var(--laiton-soft);
  --acc-sauge:   oklch(0.53 0.090 162); --acc-sauge-s:   var(--sauge-soft);
  --acc-terre:   var(--terre);      --acc-terre-s:   var(--terre-soft);
  --acc-prune:   var(--prune);      --acc-prune-s:   var(--prune-soft);

  box-sizing: border-box;
  font-family: "Albert Sans", "Inter Tight", system-ui, sans-serif;
  font-feature-settings: "ss01" 1, "cv11" 1;
  -webkit-font-smoothing: antialiased;
  background: var(--bg);
  color: var(--ink);
}

.org * { box-sizing: border-box; }

.mobile-session-actions { display: none; }

/* Body full-height pour les pages du shell chat */
body.chat-body {
  height: 100vh;
  overflow: hidden;
  margin: 0;
}

/* Grille principale sidebar + contenu */
.chat-shell {
  display: grid;
  grid-template-columns: 296px 1fr;
  height: 100vh;
  overflow: hidden;
}

/* ================================================================
   Sidebar
   ================================================================ */
.org-aside {
  background: linear-gradient(180deg, var(--bg-2) 0%, oklch(0.948 0.010 250) 100%);
  border-right: 1px solid var(--line);
  padding: 22px 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
  position: relative;
}

/* Cannelure art déco — 3 hairlines laiton en bordure droite */
.org-aside::after {
  content: "";
  position: absolute;
  top: 26px; bottom: 26px; right: -1px;
  width: 6px;
  background: linear-gradient(90deg,
    transparent 0, transparent 1px,
    var(--laiton) 1px, var(--laiton) 1.5px,
    transparent 1.5px, transparent 2.5px,
    var(--laiton) 2.5px, var(--laiton) 3px,
    transparent 3px, transparent 4px,
    var(--laiton) 4px, var(--laiton) 4.5px,
    transparent 4.5px);
  opacity: 0.55;
  pointer-events: none;
}

/* Wordmark */
.org-wordmark {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 2px 4px 14px;
  border-bottom: 1px solid var(--line-2);
  flex-shrink: 0;
}

.org-mark {
  width: 38px; height: 38px;
  background: var(--ink); color: var(--bg);
  border-radius: 13px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", "Cormorant Garamond", serif;
  font-style: italic; font-weight: 400; font-size: 24px; line-height: 1;
  letter-spacing: -0.02em;
  position: relative; padding-bottom: 2px;
  box-shadow: var(--shadow-sm), inset 0 0 0 1px oklch(0.35 0.022 58);
  flex-shrink: 0;
}

/* Whisper laiton art déco sous le mark */
.org-mark::after {
  content: "";
  position: absolute; left: 8px; right: 8px; bottom: 4px;
  height: 1px; background: var(--laiton); opacity: 0.5; border-radius: 1px;
}

.org-wordmark-text {
  font-family: "Newsreader", serif; font-weight: 400; font-style: italic;
  font-size: 22px; letter-spacing: -0.02em; color: var(--ink); line-height: 1;
}
.org-wordmark-ai { font-style: normal; }
.org-wordmark-sub {
  font-family: "JetBrains Mono", monospace; font-size: 9px; font-weight: 500;
  letter-spacing: 0.16em; color: var(--mute); text-transform: uppercase; margin-top: 3px;
}

/* Boutons d'action */
.org-actions { display: flex; flex-direction: column; gap: 3px; }

.org-sb-btn {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 11px; font-size: 13px; font-weight: 500;
  color: var(--ink-2); border-radius: 11px;
  cursor: pointer; white-space: nowrap; text-decoration: none;
  transition: background 120ms, color 120ms;
  border: none; background: transparent; width: 100%; text-align: left;
  font-family: inherit;
}
.org-sb-btn:hover { background: var(--surface-2); color: var(--ink); }
.org-sb-btn .ic { color: var(--soft); flex-shrink: 0; }

.org-sb-btn.primary {
  background: var(--ink); color: var(--bg);
  font-weight: 500; box-shadow: var(--shadow-sm); position: relative;
}
.org-sb-btn.primary .ic { color: var(--laiton-2); }
.org-sb-btn.primary:hover { background: var(--ink-2); color: var(--bg); }
.org-sb-btn.primary::after {
  content: ""; position: absolute; left: 11px; right: 11px; bottom: 3px;
  height: 1px; background: var(--laiton); opacity: 0.4;
}

.org-sb-btn.subtle {
  background: transparent; border: 1px solid var(--line); color: var(--ink-2);
}
.org-sb-btn.subtle .ic { color: var(--brique); }
.org-sb-btn.subtle:hover { background: var(--brique-soft); }
.org-sb-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.rail-nav-link.on {
  background: var(--surface);
  color: var(--ink);
  font-weight: 600;
  box-shadow: var(--shadow-sm), inset 3px 0 0 var(--acc, var(--brique));
  padding-left: 13px;
}
.rail-nav-link.on .ic { color: var(--acc, var(--brique)); }

/* Form wrapper invisible (button_to génère un <form>) */
.org-sb-form { display: contents; }

/* Titres de section */
.org-section {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 11px 3px;
  font-family: "Newsreader", serif; font-style: italic;
  font-size: 12.5px; font-weight: 400; color: var(--soft); letter-spacing: 0.01em;
  flex-shrink: 0;
}
.org-section::after { content: ""; flex: 1; height: 1px; background: var(--line-2); }

/* Éléments liste */
.org-items { display: flex; flex-direction: column; gap: 1px; overflow: hidden; }
.org-item-row,
.org-conv-row {
  display: flex;
  align-items: center;
  gap: 3px;
  min-width: 0;
  width: 100%;
  border-radius: 9px;
}
.org-item-row:hover,
.org-item-row:focus-within,
.org-conv-row:hover,
.org-conv-row:focus-within {
  background: var(--surface-2);
}
.org-item {
  padding: 7px 11px; font-size: 12.5px; color: var(--soft);
  border-radius: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  cursor: pointer; text-decoration: none; display: flex; align-items: center; gap: 8px;
  transition: background 100ms, color 100ms;
  min-width: 0; flex: 1;
}
.org-item-title { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; }
.org-item:hover { background: var(--surface-2); color: var(--ink); }
.org-item.active {
  background: var(--surface); color: var(--ink); font-weight: 500;
  box-shadow: var(--shadow-sm), inset 3px 0 0 var(--acc, var(--brique)); padding-left: 13px;
}
.org-item.working {
  color: var(--soft);
  background: transparent;
}
.org-item.working.active {
  padding-left: 11px;
  box-shadow: var(--shadow-sm);
}
.org-item.working:hover { background: var(--surface-2); color: var(--ink); }
.org-working-marker {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  min-width: 14px;
  color: var(--acc, var(--brique));
}
.org-working-marker--lead {
  animation: org-sidebar-spin 1.1s linear infinite;
}
.org-working-marker.chat-gen-dots span {
  width: 3.5px; height: 3.5px;
}
@keyframes org-sidebar-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .org-working-marker--lead { animation: none; }
}
.org-item-time {
  flex-shrink: 0;
  font-family: "JetBrains Mono", monospace;
  font-size: 9.5px;
  color: var(--mute);
  margin-left: auto;
}
.org-unread-dot {
  width: 7px;
  height: 7px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--brique);
  box-shadow: 0 0 0 3px var(--brique-soft);
}
.org-chat-mark {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: var(--mute);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.org-archive-form {
  display: none;
  flex-shrink: 0;
}
.org-item-row:hover .org-archive-form,
.org-item-row:focus-within .org-archive-form,
.org-conv-row:hover .org-archive-form,
.org-conv-row:focus-within .org-archive-form {
  display: flex;
}
.org-item-row:hover .org-item-time,
.org-item-row:focus-within .org-item-time,
.org-conv-row:hover .org-item-time,
.org-conv-row:focus-within .org-item-time {
  display: none;
}
.org-archive-action {
  width: 24px;
  height: 24px;
  border: 1px solid transparent;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--mute);
  background: transparent;
  cursor: pointer;
  opacity: 0;
  transform: translateX(2px);
  transition: opacity 100ms, transform 100ms, color 100ms, border-color 100ms, background 100ms;
}
.org-item-row:hover .org-archive-action,
.org-item-row:focus-within .org-archive-action,
.org-conv-row:hover .org-archive-action,
.org-conv-row:focus-within .org-archive-action {
  opacity: 1;
  transform: translateX(0);
}
.org-archive-action:hover {
  color: var(--brique);
  border-color: var(--brique);
  background: var(--brique-soft);
}
.org-project {
  display: flex; align-items: center; gap: 9px;
  padding: 5px 11px; font-size: 12.5px; color: var(--soft);
  text-decoration: none; border-radius: 9px;
  transition: background 100ms, color 100ms;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-project:hover { background: var(--surface-2); color: var(--ink); }
.org-project .dot {
  width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
  box-shadow: 0 0 0 1px oklch(0.26 0.022 58 / 0.08);
}

.org-spacer { flex: 1; min-height: 0; }

/* Bloc utilisateur */
.org-user-footer {
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex-shrink: 0;
}

.org-user {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 9px 9px 10px; border-radius: 13px;
  background: var(--surface); box-shadow: var(--shadow-sm);
  border: 1px solid var(--line-2); flex-shrink: 0;
  text-decoration: none; color: inherit;
}
.org-user .avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--brique); color: oklch(0.99 0.005 85);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic;
  font-size: 13px; font-weight: 500; flex-shrink: 0;
  box-shadow: inset 0 0 0 2px oklch(0.99 0.005 85), 0 0 0 1px var(--brique);
}
.org-user .name {
  font-size: 12.5px; font-weight: 600; color: var(--ink); line-height: 1.2;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-user .plan {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
  color: var(--mute); margin-top: 1px; letter-spacing: 0.04em;
}
.org-user-gear { color: var(--mute); margin-left: auto; flex-shrink: 0; text-decoration: none; }
.org-user-gear:hover { color: var(--ink); }

/* ================================================================
   Workspace Switcher — accents & composants (#266)
   ================================================================ */

/* Accent par espace de travail — pose --acc / --acc-s sur la racine sidebar */
.acc-brique { --acc: var(--brique);      --acc-s: var(--brique-soft); }
.acc-bleu   { --acc: var(--acc-bleu);   --acc-s: var(--acc-bleu-s); }
.acc-laiton { --acc: var(--acc-laiton); --acc-s: var(--acc-laiton-s); }
.acc-sauge  { --acc: var(--acc-sauge);  --acc-s: var(--acc-sauge-s); }
.acc-terre  { --acc: var(--acc-terre);  --acc-s: var(--acc-terre-s); }
.acc-prune  { --acc: var(--acc-prune);  --acc-s: var(--acc-prune-s); }

/* Monogramme d'espace */
.ws-mono {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic; font-weight: 500;
  font-size: 15px; line-height: 1; position: relative;
  background: var(--acc, var(--brique)); color: oklch(0.99 0.005 85);
  box-shadow: var(--shadow-sm), inset 0 0 0 1px oklch(1 0 0 / 0.18);
}
.ws-mono.sm { width: 24px; height: 24px; border-radius: 7px; font-size: 12px; }
.ws-mono.lg { width: 44px; height: 44px; border-radius: 13px; font-size: 22px; }
.ws-mono.perso {
  background: var(--surface); color: var(--ink);
  border: 1px solid var(--line); box-shadow: var(--shadow-sm);
}
.ws-mono::after {
  content: ""; position: absolute; left: 6px; right: 6px; bottom: 3px;
  height: 1px; background: oklch(1 0 0 / 0.5); border-radius: 1px;
}
.ws-mono.perso::after { background: var(--laiton); opacity: 0.5; }

/* Badge de rôle */
.role-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: "Albert Sans", sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: 0; text-transform: none;
  padding: 0; border: 0; border-radius: 0;
  background: none; color: var(--soft);
  white-space: nowrap;
}
.role-badge::before {
  content: "";
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--whisper); flex-shrink: 0;
}
.role-badge.owner  { color: var(--acc-ink); }
.role-badge.owner::before { background: var(--acc); }
.role-badge.admin  { color: var(--prune); }
.role-badge.admin::before { background: var(--prune); }
.role-badge.member { color: var(--soft); }
.role-badge.guest  { color: var(--mute); }
.role-badge.guest::before { background: var(--sauge); }

/* Popover workspace switcher */
.ws-pop-wrap {
  position: relative;
}
.ws-pop {
  position: absolute; bottom: calc(100% + 10px); left: 0; right: 0;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-lg, 22px); box-shadow: var(--shadow-lg);
  overflow: hidden; display: flex; flex-direction: column; z-index: 100;
}
.ws-pop-head {
  padding: 13px 15px 9px; border-bottom: 1px solid var(--line-2);
  display: flex; align-items: center; justify-content: space-between;
}
.ws-pop-head .ttl {
  font-family: "Newsreader", serif; font-style: italic; font-size: 15px; color: var(--ink);
}
.ws-pop-head .kbd {
  font-family: "JetBrains Mono", monospace; font-size: 9px; color: var(--mute);
}
.ws-pop-list { padding: 7px; display: flex; flex-direction: column; gap: 2px; max-height: 55vh; overflow-y: auto; }
.ws-pop-group {
  font-family: "JetBrains Mono", monospace; font-size: 8.5px;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--mute);
  padding: 8px 9px 4px; font-weight: 600;
}
.ws-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 9px;
  border-radius: 11px; cursor: pointer; text-decoration: none; color: inherit;
  border: none; background: transparent; width: 100%; text-align: left; font-family: inherit;
  position: relative;
}
.ws-row:hover { background: var(--surface-2); }
.ws-row.on { background: var(--acc-s, var(--brique-soft)); }
.ws-row .ws-info { min-width: 0; flex: 1; }
.ws-row .ws-name {
  font-size: 13px; font-weight: 600; color: var(--ink); line-height: 1.2;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: flex; align-items: center; gap: 7px;
}
.ws-row .ws-sub {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; color: var(--mute);
  margin-top: 2px; letter-spacing: 0.02em;
}
.ws-row .ws-check { color: var(--acc, var(--brique)); flex-shrink: 0; }
.ws-pop-foot { padding: 7px; border-top: 1px solid var(--line-2); }

/* ─────────────────────────────────────────────────────────────────────────────
   Modal system v0.6.0-alpha — Hotwire/Stimulus
   Variantes couvertes : create/edit/confirm danger/wizard/picker.
   ─────────────────────────────────────────────────────────────────────────── */
.org-modal-scrim {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: oklch(0.26 0.022 58 / 0.30);
  backdrop-filter: blur(2px);
}
.org-modal-scrim[hidden] { display: none !important; }

.org-modal-shell {
  width: min(480px, calc(100vw - 32px));
  max-height: min(90vh, 760px);
  overflow-y: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  color: var(--ink);
  position: relative;
}
.org-modal-shell--wide { width: min(560px, calc(100vw - 32px)); }
.org-modal-shell--wizard { width: min(560px, calc(100vw - 32px)); }
.org-modal-shell--picker { width: min(680px, calc(100vw - 32px)); }
.org-modal-shell--danger {
  border-color: oklch(0.82 0.08 28);
  box-shadow:
    var(--shadow-lg),
    0 0 0 1px oklch(0.94 0.05 28 / 0.75) inset;
}

.org-modal-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 22px 14px;
  border-bottom: 1px solid var(--line-2);
}
.org-modal-icon {
  width: 44px;
  height: 44px;
  border-radius: 13px;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--acc);
  color: oklch(0.99 0.005 85);
  box-shadow: inset 0 1px 0 oklch(1 0 0 / 0.25);
}
.org-modal-icon.danger {
  background: var(--bad-soft);
  border: 1px solid oklch(0.82 0.08 28);
  color: var(--bad);
}
.org-modal-title {
  font-family: "Newsreader", Georgia, serif;
  font-style: italic;
  font-size: 22px;
  line-height: 1.15;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.org-modal-subtitle {
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  color: var(--mute);
  margin-top: 3px;
}
.org-modal-body {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 18px 22px 0;
}
.org-modal-copy {
  margin: 0;
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.5;
}
.modal-action-inline {
  display: inline-flex;
  align-items: center;
}
.org-modal-foot {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px 22px 20px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.org-modal-foot form { margin: 0; }
.org-modal-shell .mclose {
  position: absolute; top: 16px; right: 16px; width: 30px; height: 30px;
  border-radius: 9px; border: 1px solid var(--line); background: var(--surface);
  color: var(--soft); display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.org-modal-shell .mclose:hover { background: var(--surface-2); }
.org-modal-shell .mtitle {
  font-family: "Newsreader", serif;
  font-size: 25px;
  letter-spacing: 0;
  color: var(--ink);
  padding: 24px 30px 0;
}
.org-modal-shell .mtitle em { font-style: italic; color: var(--brique); }
.org-modal-shell .msub {
  font-family: "JetBrains Mono", monospace;
  font-size: 10.5px;
  color: var(--mute);
  margin-top: 5px;
  letter-spacing: 0.04em;
  padding: 0 30px;
}
.org-modal-shell .mfoot {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 24px;
  padding: 0 30px 28px;
}
.org-modal-danger-panel {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: var(--radius-sm);
  border: 1px solid oklch(0.82 0.08 28);
  background: var(--bad-soft);
  color: oklch(0.44 0.13 28);
  font-size: 12.5px;
  line-height: 1.5;
}
.org-modal-danger-panel .ic { color: var(--bad); flex-shrink: 0; margin-top: 1px; }
.org-confirm-modal-root {
  position: relative;
  z-index: 1000;
}
.org-confirm-modal { width: min(440px, calc(100vw - 32px)); }
.org-confirm-title-wrap { flex: 1; min-width: 0; }
.org-confirm-message {
  margin: 0;
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.55;
}
.org-confirm-message strong { color: var(--ink); font-weight: 650; }

.org-modal-steps {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px 0;
}
.org-modal-step {
  display: flex;
  align-items: center;
  gap: 7px;
  opacity: 0.45;
}
.org-modal-step .num {
  width: 20px; height: 20px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: "JetBrains Mono", monospace; font-size: 11px;
  background: var(--surface-2); color: var(--soft); border: 1px solid var(--line);
}
.org-modal-step .lb {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--soft);
}
.org-modal-step.on { opacity: 1; }
.org-modal-step.on .num { background: var(--ink); color: var(--surface); border-color: var(--ink); }
.org-modal-step.on .lb { color: var(--ink); }
.org-modal-rule { flex: 1; height: 1px; background: var(--line-2); max-width: 60px; }

[data-controller~="modal"].is-loading .org-modal-shell,
[data-controller~="modal"] .is-loading .org-modal-shell {
  cursor: progress;
}
[data-controller~="modal"].is-loading [data-modal-loading-disable],
[data-controller~="modal"] .is-loading [data-modal-loading-disable],
[data-controller~="modal"].is-loading [data-modal-target~="loadingDisable"],
[data-controller~="modal"] .is-loading [data-modal-target~="loadingDisable"] {
  opacity: 0.58;
  pointer-events: none;
}

@media (max-width: 560px) {
  .org-modal-scrim {
    align-items: flex-end;
    padding: 0;
  }
  .org-modal-shell,
  .org-modal-shell--wide,
  .org-modal-shell--wizard,
  .org-modal-shell--picker {
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Modale création d'équipe (#267)
   ─────────────────────────────────────────────────────────────────────────── */

/* Scrim — fond estompé plein écran (position fixed ignore la hiérarchie DOM) */
.tc-scrim {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: oklch(0.26 0.022 58 / 0.30);
  backdrop-filter: blur(2px);
}

/* Carte centrale */
.tc-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  width: 440px;
  max-width: calc(100vw - 32px);
  max-height: 90vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

/* En-tête */
.tc-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 22px 14px;
  border-bottom: 1px solid var(--line-2);
}
.tc-head-text { flex: 1; min-width: 0; }
.tc-title {
  font-family: "Newsreader", Georgia, serif;
  font-style: italic;
  font-size: 22px;
  line-height: 1.2;
  color: var(--ink);
}
.tc-subtitle {
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  color: var(--mute);
  margin-top: 2px;
}

/* Erreurs */
.tc-errors {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 12px 22px 0;
  padding: 8px 12px;
  background: var(--brique-soft);
  border: 1px solid oklch(0.86 0.06 28);
  border-radius: var(--radius-sm);
  font-size: 12.5px;
  color: oklch(0.45 0.14 28);
}
.tc-errors .ic { flex-shrink: 0; color: oklch(0.52 0.16 28); }

/* Formulaire */
.tc-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px 22px 0;
}
.tc-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.tc-label {
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mute);
}

/* Champ nom — Newsreader italic */
.tc-name { font-family: "Newsreader", Georgia, serif; font-style: italic; font-size: 15px; }

/* Champ préfixe slug */
.org-prefix-field {
  display: flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-xs);
  background: var(--surface);
  overflow: hidden;
  transition: border-color 0.15s;
}
.org-prefix-field:focus-within { border-color: var(--ink); }
.org-prefix-field .prefix {
  padding: 0 8px 0 10px;
  font-family: "JetBrains Mono", monospace;
  font-size: 11.5px;
  color: var(--mute);
  white-space: nowrap;
  flex-shrink: 0;
}
.org-prefix-field .org-input {
  border: none;
  border-radius: 0;
  padding-left: 0;
  flex: 1;
  min-width: 0;
}
.org-prefix-field .org-input:focus { box-shadow: none; }

/* Accent picker */
.tc-accent-picker {
  display: flex;
  gap: 8px;
  align-items: center;
}
.tc-accent-dot {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color 0.12s, box-shadow 0.12s;
  flex-shrink: 0;
}
.tc-accent-dot:hover { opacity: 0.85; }
.tc-accent-dot.selected {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--ink);
}

/* Zone invitation */
.tc-invite-area { resize: vertical; min-height: 56px; font-size: 12.5px; }
.tc-hint {
  font-family: "JetBrains Mono", monospace;
  font-size: 9.5px;
  color: var(--mute);
}

/* Pied de modale */
.tc-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 22px 20px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.tc-actions { display: flex; gap: 8px; align-items: center; }

/* ───────── Création en 2 étapes (#312) ───────── */
/* La carte s'élargit à l'étape 2 (liste des membres + forfaits) */
.tc-card.step2 { width: 560px; }
/* Chaque panneau d'étape conserve l'espacement vertical du formulaire */
.tc-panel { display: flex; flex-direction: column; gap: 14px; }
.tc-panel[hidden] { display: none; }

/* Indicateur d'étapes */
.tc-steps { display: flex; align-items: center; gap: 10px; padding: 12px 22px 0; }
.tc-step { display: flex; align-items: center; gap: 7px; opacity: .45; }
.tc-step .num {
  width: 20px; height: 20px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: "JetBrains Mono", monospace; font-size: 11px;
  background: var(--surface-2); color: var(--soft); border: 1px solid var(--line);
}
.tc-step .lb {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  letter-spacing: .06em; text-transform: uppercase; color: var(--soft);
}
.tc-step.on .num { background: var(--ink); color: var(--surface); border-color: var(--ink); }
.tc-step.on { opacity: 1; }
.tc-step.on .lb { color: var(--ink); }
.tc-rule { flex: 1; height: 1px; background: var(--line-2); max-width: 60px; }

/* Note « aucun forfait par défaut » */
.tc-note {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 10px 12px; border-radius: var(--radius-sm);
  background: var(--surface-2); border: 1px solid var(--line-2);
  font-size: 12px; color: var(--ink-2); line-height: 1.45;
}
.tc-note .ic { flex-shrink: 0; color: var(--soft); margin-top: 1px; }
.tc-note b { color: var(--ink); font-weight: 600; }

/* Étape 2 — forfaits */
.tc-step2-lede { font-size: 13px; color: var(--ink-2); line-height: 1.5; margin: 0; }
.tc-step2-lede b { color: var(--ink); }
.tc-bundle-legend { display: flex; flex-wrap: wrap; gap: 8px; }
.tc-bundle-legend .fft-tag .pr {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; color: var(--mute);
}

.tc-members { border: 1px solid var(--line-2); border-radius: var(--radius); overflow: hidden; }
.tc-members-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 14px; border-bottom: 1px solid var(--line-2); background: var(--surface-2);
}
.tc-members-head .t { font-size: 13px; font-weight: 600; color: var(--ink); }
.tc-member-row { padding: 10px 14px; }

.tc-foot-step2 { align-items: flex-end; }
.tc-total .k {
  font-family: "JetBrains Mono", monospace; font-size: 9px;
  letter-spacing: .08em; text-transform: uppercase; color: var(--mute);
}
.tc-total .v { font-family: "Newsreader", Georgia, serif; font-size: 26px; color: var(--ink); line-height: 1.1; }
.tc-total .v .per { font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--mute); }

/* Bandeau réassurance */
.reassure {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: "JetBrains Mono", monospace;
  font-size: 9.5px;
  color: var(--mute);
}
/* Cocarde tricolore pur CSS */
.coc {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle, #002395 0%, #002395 33%, #fff 33%, #fff 67%, #ed2939 67%);
  flex-shrink: 0;
}

/* Responsive : pleine largeur sous 480px */
@media (max-width: 480px) {
  .tc-card, .tc-card.step2 { width: 100%; max-width: 100%; max-height: 100%; border-radius: 0; }
  .tc-scrim { align-items: flex-end; }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Modale création de projet (#302)
   ─────────────────────────────────────────────────────────────────────────── */
.pc-scrim {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: oklch(0.26 0.022 58 / 0.30);
  backdrop-filter: blur(2px);
}
.pc-modal-card {
  width: 480px;
  max-width: calc(100vw - 32px);
  max-height: 90vh;
  overflow-y: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}
.pc-modal-head {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  padding: 20px 22px 6px;
}
.pc-preview-icon {
  width: 44px;
  height: 44px;
  border-radius: 13px;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--acc, var(--brique));
  color: oklch(0.99 0.005 85);
  box-shadow: inset 0 1px 0 oklch(1 0 0 / 0.25);
}
.pc-preview-text { flex: 1; min-width: 0; }
.pc-modal-title {
  font-family: "Newsreader", Georgia, serif;
  font-style: italic;
  font-size: 22px;
  line-height: 1.15;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.pc-modal-subtitle {
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  color: var(--mute);
  margin-top: 3px;
}
.pc-modal-form {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 12px 22px 0;
}
.pc-name-input {
  font-family: "Newsreader", Georgia, serif;
  font-style: italic;
  font-size: 15.5px;
}
.pc-slug-preview { background: var(--surface-2); }
.pc-slug-preview .pc-slug-value {
  min-height: 40px;
  display: flex;
  align-items: center;
  color: var(--soft);
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
}
.pc-instructions {
  min-height: 72px;
  resize: vertical;
  line-height: 1.5;
}
.pc-visibility {
  max-width: 320px;
  border-radius: 12px;
}
.pc-visibility input[type="radio"] { display: none; }
.pc-modal-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 0 20px;
  flex-wrap: wrap;
}
.pc-modal-foot .reassure { margin-right: auto; }

@media (max-width: 560px) {
  .pc-scrim {
    align-items: flex-end;
    padding: 0;
  }
  .pc-modal-card {
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }
  .pc-modal-foot .tc-actions {
    width: 100%;
    justify-content: flex-end;
  }
}

/* Trigger footer avec switcher */
.org-user.ws-trigger { cursor: pointer; }
.org-user.ws-trigger:hover { background: var(--surface-2); }

.org-logout-form { margin: 0; }
.org-logout-btn {
  border: 1px solid var(--line-2);
  color: var(--soft);
  justify-content: flex-start;
}
.org-logout-btn .ic { color: var(--mute); }
.org-logout-btn:hover {
  background: var(--brique-soft);
  color: var(--ink);
}
.org-logout-btn:hover .ic { color: var(--brique); }

.mobile-session-form { margin: 0; }
.mobile-session-logout {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--soft);
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
}
.mobile-session-logout .ic {
  color: var(--mute);
  flex-shrink: 0;
}
.mobile-session-logout:hover {
  background: var(--brique-soft);
  color: var(--ink);
}
.mobile-session-logout:hover .ic { color: var(--brique); }

/* ================================================================
   Zone principale
   ================================================================ */
.org-main {
  display: flex; flex-direction: column; min-width: 0;
  background: var(--bg); position: relative; overflow: hidden;
}

/* Barre supérieure */
.org-top {
  display: flex; align-items: flex-end; justify-content: space-between;
  padding: 20px 32px 16px; border-bottom: 1px solid var(--line-2);
  flex-shrink: 0;
}
.org-top .title {
  font-family: "Newsreader", serif; font-weight: 400; font-size: 24px;
  letter-spacing: -0.02em; color: var(--ink); line-height: 1.05; white-space: nowrap;
}
.org-top .title em { font-style: italic; color: var(--brique); }
.org-top .meta {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  color: var(--mute); letter-spacing: 0.04em; margin-top: 4px;
}
.org-top .actions { display: flex; gap: 6px; align-items: flex-end; }

.org-icon-btn {
  width: 30px; height: 30px; border-radius: 9px;
  border: 1px solid var(--line); background: var(--surface); color: var(--soft);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; text-decoration: none;
  transition: background 120ms, color 120ms;
  flex-shrink: 0;
}
.org-icon-btn:hover { background: var(--surface-2); color: var(--ink); }

/* ================================================================
   État vide / Nouveau chat (UX02)
   ================================================================ */
.org-empty-main {
  display: flex; flex-direction: column; height: 100%; overflow: hidden;
}

.org-empty-scroll {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 36px 32px 8px; overflow-y: auto;
}

.org-empty-inner { width: 100%; max-width: 640px; }

.org-empty-hello { text-align: center; margin-bottom: 24px; }
.org-empty-hello .greet {
  font-family: "Newsreader", serif; font-weight: 400; font-size: 38px;
  letter-spacing: -0.02em; line-height: 1.05; color: var(--ink);
}
.org-empty-hello .greet em { font-style: italic; color: var(--brique); }
.org-empty-hello .ask {
  color: var(--soft); font-size: 15px; margin-top: 8px;
  font-family: "Newsreader", serif; font-style: italic;
}

/* Titre de section hairline */
.org-sh {
  display: flex; align-items: center; gap: 10px;
  font-family: "Newsreader", serif; font-style: italic;
  font-size: 13px; color: var(--soft);
}
.org-sh::after { content: ""; flex: 1; height: 1px; background: var(--line-2); }

/* Grille de reprise */
.org-resume-head { display: flex; align-items: center; gap: 10px; margin: 24px 0 10px; }
.org-resume-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }

.org-resume-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 13px 14px;
  box-shadow: var(--shadow-sm); position: relative;
  text-decoration: none; display: block;
  transition: box-shadow 120ms, border-color 120ms;
}
.org-resume-card:hover {
  box-shadow: var(--shadow); border-color: oklch(0.82 0.040 250);
}
.org-resume-card::before {
  content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px;
  background: var(--brique); opacity: 0.65; border-radius: 0 2px 2px 0;
}
.org-resume-card .t {
  font-size: 13px; font-weight: 600; color: var(--ink);
  margin-bottom: 7px; padding-left: 6px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-resume-card .m {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
  color: var(--mute); letter-spacing: 0.03em; padding-left: 6px;
}

.org-empty-state-hint {
  text-align: center; padding: 28px 0 0;
  font-family: "Newsreader", serif; font-style: italic;
  font-size: 14px; color: var(--whisper);
}

/* ================================================================
   Nouvel utilisateur gratuit — onboarding 3 étapes (#254)
   ================================================================ */
.nu-overlay {
  position: absolute; inset: 0; z-index: 20;
  display: flex; align-items: center; justify-content: center;
  background: oklch(0.255 0.024 58 / 0.34);
  backdrop-filter: blur(3px);
  padding: 40px;
}
.nu-modal {
  width: 100%; max-width: 468px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-lg);
  padding: 30px 32px 26px; position: relative;
}
.nu-modal .nu-kicker {
  font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: 0.16em;
  color: var(--mute); text-transform: uppercase; margin-bottom: 14px;
  display: flex; align-items: center; gap: 8px;
}
.nu-modal .nu-kicker.prio { color: var(--brique); }
.nu-modal .nu-kicker .seal {
  width: 22px; height: 22px; border-radius: 7px; background: var(--brique-soft);
  color: var(--brique); display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.nu-modal .nu-mttl {
  font-family: "Newsreader", serif; font-weight: 400; font-size: 28px;
  line-height: 1.12; letter-spacing: 0; color: var(--ink);
}
.nu-modal .nu-mttl em { font-style: italic; color: var(--brique); }
.nu-modal .nu-mbody {
  font-size: 14px; line-height: 1.5; color: var(--ink-2); margin-top: 12px;
}
.nu-modal .nu-mgauge {
  margin-top: 18px; padding: 14px 16px; border-radius: var(--radius-sm);
  background: var(--bg-2); border: 1px solid var(--line-2);
  display: flex; flex-direction: column; gap: 9px;
}
.nu-gauge {
  display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 5px;
}
.nu-gauge span {
  height: 8px; border-radius: 999px; background: var(--line);
}
.nu-gauge span.on { background: var(--brique); }
.nu-gauge-label {
  font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: 0.04em;
  color: var(--mute);
}
.nu-modal .nu-mreassure {
  display: flex; flex-wrap: wrap; gap: 6px 10px; margin-top: 18px;
}
.nu-modal .nu-mreassure .r {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11.5px; color: var(--soft);
}
.nu-modal .nu-mreassure .r .ic { color: var(--sauge); }
.nu-modal .nu-mini-stack { margin-top: 18px; display: flex; flex-direction: column; gap: 8px; }
.nu-modal .nu-mini-row {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 14px; border-radius: var(--radius-sm);
  border: 1px solid var(--line); background: var(--surface-2);
}
.nu-modal .nu-mini-row.reco {
  border-color: oklch(0.82 0.075 256);
  background: oklch(0.975 0.020 256);
}
.nu-modal .nu-mini-row .mn {
  font-family: "Newsreader", serif; font-style: italic; font-size: 17px; color: var(--ink);
}
.nu-modal .nu-mini-row .mp {
  font-family: "Newsreader", serif; font-size: 18px; color: var(--ink); margin-left: auto;
}
.nu-modal .nu-mini-row .mp .per { font-size: 12px; color: var(--mute); }
.nu-modal .nu-mini-row .mtag {
  font-family: "JetBrains Mono", monospace; font-size: 8.5px; letter-spacing: 0.1em;
  color: var(--brique); background: var(--brique-soft); border-radius: 999px; padding: 2px 7px;
  text-transform: uppercase;
}
.nu-modal .nu-actions {
  display: flex; align-items: center; gap: 12px; margin-top: 24px;
}
.nu-modal .nu-actions.stack { flex-direction: column; align-items: stretch; gap: 9px; }
.nu-modal .nu-actions .grow { flex: 1; }
.nu-modal .nu-skip {
  border: none; background: transparent; padding: 0;
  font: inherit; font-size: 13px; color: var(--mute); cursor: pointer;
}
.nu-modal .nu-skip:hover { color: var(--ink-2); }
.nu-modal .nu-skip.block { width: 100%; text-align: center; padding: 6px 0; }
.nu-dots { display: flex; gap: 6px; align-items: center; }
.nu-dots .d { width: 7px; height: 7px; border-radius: 50%; background: var(--line); }
.nu-dots .d.on { background: var(--brique); width: 22px; border-radius: 4px; }
.nu-dimmed { filter: saturate(0.85); }
.nu-dimmed .org-empty-inner { opacity: 0.5; }

@media (max-width: 720px) {
  .nu-overlay { padding: 18px; align-items: flex-start; padding-top: 92px; }
  .nu-modal { padding: 24px 22px 22px; }
  .nu-modal .nu-mttl { font-size: 24px; }
  .nu-modal .nu-actions { align-items: stretch; flex-wrap: wrap; }
  .nu-modal .nu-actions .grow { display: none; }
  .nu-modal .nu-actions > .org-btn { justify-content: center; flex: 1 1 100%; }
  .nu-modal .nu-skip { flex: 1 1 auto; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .nu-overlay, .nu-modal, .nu-dimmed .org-empty-inner { transition: none; }
}

/* ================================================================
   Pied de page / Composer
   ================================================================ */
.org-bottom { padding: 12px 32px 20px; flex-shrink: 0; }
.org-bottom-inner { max-width: 640px; margin: 0 auto; }

.org-composer {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 20px; padding: 13px 15px 11px;
  box-shadow: var(--shadow-lg); position: relative;
}

/* Cannelure art déco au-dessus du composer */
.org-composer::before {
  content: "";
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  width: 34px; height: 6px;
  background: linear-gradient(180deg,
    var(--laiton) 0, var(--laiton) 1px,
    transparent 1px, transparent 2.5px,
    var(--laiton) 2.5px, var(--laiton) 3.5px,
    transparent 3.5px, transparent 5px,
    var(--laiton) 5px, var(--laiton) 6px);
  opacity: 0.5; border-radius: 1px;
}

.org-composer-input {
  font-size: 15px; color: var(--ink);
  padding: 4px 4px 11px; min-height: 28px;
  font-family: "Newsreader", serif; font-style: italic;
  font-weight: 300; letter-spacing: -0.005em;
  width: 100%; border: none; outline: none; resize: none;
  background: transparent; line-height: 1.55;
}
.org-composer-input::placeholder { color: var(--mute); font-style: italic; }

.org-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.org-attach-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 3px 9px;
}
.org-attach-row[hidden] { display: none !important; }
.org-attach-chip {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  gap: 7px;
  padding: 5px 7px 5px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--ink-2);
  font-size: 12px;
  box-shadow: var(--shadow-sm);
}
.org-attach-chip .ic {
  color: var(--brique);
  flex-shrink: 0;
}
.org-attach-chip .nm {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.org-attach-chip .sz {
  flex-shrink: 0;
  font-family: "JetBrains Mono", monospace;
  font-size: 9.5px;
  color: var(--mute);
}
.org-attach-chip .x {
  width: 18px;
  height: 18px;
  border: 1px solid transparent;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--soft);
  cursor: pointer;
}
.org-attach-chip .x:hover {
  color: var(--brique);
  border-color: var(--line);
  background: var(--surface);
}

.org-composer-row {
  display: flex; align-items: center; gap: 7px; padding-top: 2px;
}

.org-attach, .org-mic {
  width: 32px; height: 32px; border-radius: 10px;
  border: 1px solid var(--line); color: var(--soft);
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent; cursor: pointer; flex-shrink: 0;
  transition: background 120ms;
}
.org-mic { border-radius: 50%; }
.org-attach:hover, .org-mic:hover { background: var(--surface-2); }

.org-model-pill {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 11px 6px 9px; border-radius: 999px; font-size: 12px;
  font-weight: 500; color: var(--ink); background: var(--surface-2);
  border: 1px solid var(--line); cursor: default; white-space: nowrap;
}
.org-model-pill .chev { color: var(--mute); }
.org-model-pill { cursor: pointer; }
.org-model-pill:hover { background: var(--surface-2); }
.org-composer-row .org-model-pill.active {
  border-color: var(--brique); background: var(--brique-soft); color: oklch(0.40 0.13 256);
  box-shadow: 0 0 0 3px oklch(0.49 0.145 256 / 0.10);
}

.org-effort-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 11px; border-radius: 999px;
  font-family: "JetBrains Mono", monospace; font-size: 10.5px;
  color: var(--soft); background: transparent; border: 1px solid var(--line);
}

/* =========================================================
   Sélecteur de modèle (popover UX04, issue #86)
   ========================================================= */
.org-popover {
  position: absolute;
  bottom: calc(100% + 14px); left: 0;
  width: min(430px, calc(100vw - 32px));
  max-height: min(62vh, 480px);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: 14px;
  z-index: 30;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.org-popover[hidden] { display: none; }
.org-popover::after {
  content: ""; position: absolute; bottom: -7px; left: 34px;
  width: 13px; height: 13px; background: var(--surface);
  border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  transform: rotate(45deg);
}
.org-pop-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 10px;
  flex-shrink: 0;
}
.org-pop-head .label {
  font-family: "Newsreader", serif; font-style: italic;
  font-size: 16px; color: var(--ink);
}
.org-pop-auto-label {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
}
.org-seg {
  display: flex; border: 1px solid var(--line);
  border-radius: 12px; overflow: hidden; margin-bottom: 10px;
  flex-shrink: 0;
}
.org-seg .opt {
  flex: 1; padding: 8px 10px; text-align: center;
  border-right: 1px solid var(--line); cursor: pointer;
  transition: background 100ms;
}
.org-seg .opt:last-child { border-right: none; }
.org-seg .opt .t { font-size: 12.5px; font-weight: 600; color: var(--ink); }
.org-seg .opt .s { font-family: "JetBrains Mono", monospace; font-size: 9px; color: var(--mute); margin-top: 2px; letter-spacing: 0.02em; }
.org-seg .opt.on { background: var(--ink); }
.org-seg .opt.on .t { color: oklch(0.96 0.012 72); }
.org-seg .opt.on .s { color: oklch(0.80 0.020 70); }
.org-seg .opt.disabled { opacity: 0.45; cursor: not-allowed; }
.org-model-search {
  display: grid; gap: 5px; margin: -2px 0 9px;
  flex-shrink: 0;
}
.org-model-search span {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; color: var(--mute);
  text-transform: uppercase;
}
.org-model-search input {
  width: 100%; min-height: 32px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface-2); color: var(--ink); font: inherit; font-size: 12px;
  padding: 6px 10px; outline: none;
}
.org-model-search input:focus {
  border-color: var(--laiton-2); box-shadow: 0 0 0 2px oklch(0.92 0.035 62);
}
.org-model-list {
  flex: 1 1 auto;
  display: grid; gap: 5px; overflow-y: auto;
  margin: -2px 0 10px; padding-right: 2px;
  overscroll-behavior: contain; scrollbar-gutter: stable;
  min-height: 0;
}
.org-model-option {
  width: 100%; border: 1px solid var(--line); background: var(--surface-2);
  border-radius: 10px; padding: 7px 9px; min-height: 44px; color: inherit; font: inherit;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  text-align: left; cursor: pointer;
}
.org-model-option[hidden] { display: none; }
.org-model-option.on {
  background: var(--laiton-soft); border-color: var(--laiton-2);
  box-shadow: 0 0 0 1px oklch(0.92 0.035 62) inset;
}
.org-model-option .model-main { min-width: 0; display: grid; gap: 2px; }
.org-model-option .name {
  color: var(--ink); font-size: 12px; font-weight: 650;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-model-option .code {
  color: var(--mute); font-family: "JetBrains Mono", monospace; font-size: 9px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-model-option .model-badges {
  flex-shrink: 0; display: flex; align-items: center; justify-content: flex-end;
  gap: 4px; flex-wrap: wrap;
}
.org-mini-badge {
  border: 1px solid var(--line); border-radius: 999px; padding: 1px 6px;
  background: var(--surface); color: var(--mute);
  font-family: "JetBrains Mono", monospace; font-size: 8.5px; line-height: 1.55;
}
.org-mini-badge.souverain { color: oklch(0.42 0.13 256); border-color: oklch(0.86 0.060 256); }
.org-mini-badge.byok { color: oklch(0.42 0.12 145); border-color: oklch(0.82 0.075 145); }
.org-model-empty {
  border: 1px dashed var(--line); border-radius: 10px; padding: 10px;
  color: var(--mute); font-size: 12px; line-height: 1.35;
}
.org-effort-seg {
  display: flex; border: 1px solid var(--line); border-radius: 12px; overflow: hidden;
  flex-shrink: 0;
}
.org-effort-seg .opt {
  flex: 1; text-align: center; padding: 7px 4px; font-size: 12px; color: var(--ink-2);
  border-right: 1px solid var(--line); cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 5px;
  transition: background 100ms;
}
.org-effort-seg .opt:last-child { border-right: none; }
.org-effort-seg .opt.on { background: var(--brique-soft); color: oklch(0.40 0.13 256); font-weight: 600; }
.org-pop-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line);
  font-size: 12px; color: var(--soft);
  flex-shrink: 0;
}
.org-pop-foot .mono {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--ink);
}

@media (max-width: 480px) {
  .org-popover { width: calc(100vw - 64px); }
}

/* Styles pour le sélecteur intégré dans le chat show (layout non-organique) */
.chat-model-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 12px 4px; position: relative;
}

.org-send {
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--brique); color: oklch(0.99 0.005 85);
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow:
    0 0 0 1px oklch(0.99 0.005 85) inset,
    0 0 0 1px var(--brique),
    0 5px 14px -5px oklch(0.42 0.14 256 / 0.5);
  margin-left: 4px; position: relative; flex-shrink: 0;
  border: none; cursor: pointer; transition: background 120ms;
}
/* Auréole laiton discrète */
.org-send::after {
  content: ""; position: absolute; inset: -5px;
  border-radius: 50%; border: 1px solid var(--laiton); opacity: 0.32;
  pointer-events: none;
}
.org-send:hover { background: var(--brique-2); }
.org-send:disabled { opacity: 0.5; cursor: not-allowed; }

/* Bandeau réassurance souveraineté */
.org-reassure {
  margin-top: 12px;
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  color: var(--mute); letter-spacing: 0.06em;
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
.org-reassure .sep { color: var(--laiton); }
.org-reassure .item { display: inline-flex; align-items: center; gap: 5px; }
.org-reassure .item .ic { color: var(--brique); }

/* Cocarde souveraineté (tricolore) */
.org-coc {
  width: 12px; height: 12px; border-radius: 50%;
  background: radial-gradient(circle at center,
    oklch(0.58 0.18 28) 0%, oklch(0.58 0.18 28) 22%,
    oklch(0.99 0.005 85) 22%, oklch(0.99 0.005 85) 50%,
    oklch(0.40 0.15 256) 50%, oklch(0.40 0.15 256) 100%);
  display: inline-block; flex-shrink: 0;
  box-shadow: 0 0 0 0.5px oklch(0.26 0.022 58 / 0.15);
}
.prov-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
  background: oklch(0.70 0.010 250);
  box-shadow: 0 0 0 1px var(--line) inset;
}

/* Flash styled pour les pages du shell chat */
body.chat-body .flash {
  position: fixed; top: 12px; left: 50%; transform: translateX(-50%);
  padding: 8px 16px; border-radius: 999px; font-size: 13px; z-index: 1000;
  box-shadow: var(--shadow); white-space: nowrap;
  transition: opacity 160ms ease, visibility 160ms ease;
}
body.chat-body .flash.is-hiding {
  opacity: 0; pointer-events: none; visibility: hidden;
}
body.chat-body .flash-notice {
  background: var(--brique-soft); color: oklch(0.38 0.13 256);
  border: 1px solid oklch(0.86 0.060 256);
}
body.chat-body .flash-alert {
  background: oklch(0.96 0.02 20); color: oklch(0.4 0.12 20);
  border: 1px solid oklch(0.88 0.05 20);
}

/* ================================================================
   Bouton organique générique (UX08+)
   ================================================================ */
.org-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border-radius: 12px;
  font-size: 13.5px; font-weight: 500;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
  cursor: pointer; white-space: nowrap; text-decoration: none;
}
.org-btn:hover { background: var(--surface-2); }
.org-btn.bleu {
  background: var(--brique); color: oklch(0.99 0.005 250); border-color: var(--brique);
  box-shadow: 0 6px 16px -8px oklch(0.42 0.14 256 / 0.5);
}
.org-btn.bleu:hover { background: var(--brique-2); }
.org-btn.sm { padding: 6px 11px; font-size: 12px; border-radius: 10px; }

/* ================================================================
   Projet — détail (UX08)
   ================================================================ */
.org-project-detail {
  display: flex; flex-direction: column; height: 100%; overflow: hidden;
  min-width: 0; max-width: 100%;
}
.org-project-detail .org-top {
  gap: 16px; min-width: 0; max-width: 100%; box-sizing: border-box;
}
.org-project-heading {
  display: flex; align-items: center; gap: 14px;
  min-width: 0; flex: 1 1 auto;
}
.org-project-title-block { min-width: 0; }
.org-project-title {
  display: flex; align-items: center; gap: 10px; min-width: 0;
}
.org-project-title-icon {
  width: 34px; height: 34px; border-radius: 11px;
  background: var(--brique-soft); color: var(--brique);
  border: 1px solid oklch(0.86 0.060 256);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.org-project-title-text {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.org-project-detail .meta {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.org-project-detail .org-top .actions { flex-shrink: 0; }
.org-project-detail .org-top .actions .org-btn { max-width: 100%; }

.org-tabs {
  display: flex; align-items: center; gap: 4px;
  border-bottom: 1px solid var(--line-2); padding: 0 36px; flex-shrink: 0;
  min-width: 0; max-width: 100%; overflow-x: auto; overflow-y: hidden;
  -webkit-overflow-scrolling: touch; scrollbar-width: thin;
}
.org-tab {
  padding: 13px 16px; font-size: 13.5px; color: var(--soft);
  display: inline-flex; align-items: center; gap: 8px;
  border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: default;
  user-select: none; flex: 0 0 auto; white-space: nowrap;
}
.org-tab .ic { color: var(--mute); }
.org-tab.on { color: var(--ink); font-weight: 600; border-bottom-color: var(--brique); }
.org-tab.on .ic { color: var(--brique); }
.org-tab .ct {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
}
.org-tab.unavail { opacity: 0.45; cursor: not-allowed; }
a.org-tab { cursor: pointer; text-decoration: none; color: inherit; }

.org-detail-scroll {
  flex: 1; overflow-y: auto; padding: 24px 36px;
}
.org-project-pane { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
.org-project-pane.narrow { max-width: 560px; padding: 24px 0; }
.project-section-head { align-items: center; margin-bottom: -2px; }
.project-action-row { grid-template-columns: 1fr auto; }
.project-action-row .primary { align-items: flex-start; }
.project-action-row .primary > span:last-child { min-width: 0; }
.org-detail-list { display: flex; flex-direction: column; gap: 12px; }

.org-detail-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; box-shadow: var(--shadow-sm);
  display: block; text-decoration: none;
  transition: box-shadow 120ms, border-color 120ms;
}
.org-detail-card:hover {
  box-shadow: var(--shadow); border-color: oklch(0.82 0.040 250);
}
.org-detail-card .top {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
}
.org-detail-card .t {
  font-size: 14.5px; font-weight: 600; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
.org-detail-card .m {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
  white-space: nowrap; flex-shrink: 0;
}
.org-detail-card .ex {
  color: var(--soft); font-size: 12px; margin-top: 7px; line-height: 1.55;
}

.project-accent-brique { --project-accent: var(--brique); --project-accent-soft: var(--brique-soft); --project-accent-border: oklch(0.86 0.060 256); }
.project-accent-laiton { --project-accent: var(--laiton); --project-accent-soft: var(--laiton-soft); --project-accent-border: var(--laiton-2); }
.project-accent-sauge { --project-accent: var(--sauge); --project-accent-soft: oklch(0.94 0.04 165); --project-accent-border: oklch(0.84 0.05 165); }
.project-accent-prune { --project-accent: oklch(0.52 0.110 312); --project-accent-soft: oklch(0.93 0.045 312); --project-accent-border: oklch(0.82 0.060 312); }
.project-accent-terre { --project-accent: oklch(0.55 0.120 34); --project-accent-soft: oklch(0.93 0.045 34); --project-accent-border: oklch(0.82 0.065 34); }
.org-project-title-icon[class*="project-accent-"] {
  background: var(--project-accent-soft); color: var(--project-accent);
  border-color: var(--project-accent-border);
}
.project-accent-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.project-accent-option {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); border-radius: 10px; padding: 7px 10px;
  background: var(--surface); color: var(--soft); font-size: 12px; cursor: pointer;
}
.project-accent-option.on {
  color: var(--ink); border-color: var(--project-accent-border);
  background: var(--project-accent-soft); box-shadow: inset 3px 0 0 var(--project-accent);
}
.project-accent-swatch {
  width: 14px; height: 14px; border-radius: 5px; background: var(--project-accent);
  box-shadow: inset 0 0 0 1px oklch(0.26 0.022 58 / 0.12);
}

.org-dropzone {
  display: flex; align-items: center; gap: 12px; padding: 16px 18px;
  border: 1px dashed var(--line); border-radius: var(--radius);
  background: var(--bg-2); color: var(--soft); font-size: 13px;
}
.org-dropzone .ic2 {
  width: 40px; height: 40px; border-radius: 11px; background: var(--surface);
  border: 1px solid var(--line); display: inline-flex; align-items: center;
  justify-content: center; color: var(--brique); flex-shrink: 0;
}
.project-upload-form { position: relative; }
.project-upload-copy { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.project-upload-copy b { color: var(--ink); }
.project-file-input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.org-files, .org-memory-list { display: flex; flex-direction: column; gap: 10px; }
.org-file-row {
  display: flex; align-items: center; gap: 13px; padding: 13px 16px;
  border-radius: var(--radius-sm); background: var(--surface);
  border: 1px solid var(--line); box-shadow: var(--shadow-sm);
}
.org-file-row .ic2 {
  width: 38px; height: 38px; border-radius: 10px; background: var(--brique-soft);
  border: 1px solid oklch(0.88 0.05 256); color: var(--brique);
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.org-file-row .nm { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.org-file-row .meta {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
  margin-top: 3px; line-height: 1.45;
}
.org-file-row .size {
  margin-left: auto; font-family: "JetBrains Mono", monospace; font-size: 11px;
  color: var(--mute); white-space: nowrap;
}
.project-file-main, .project-memory-main { flex: 1; min-width: 0; }

.org-instructions {
  position: relative; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 18px 20px 18px 24px;
  color: var(--ink-2); font-size: 14px; line-height: 1.65;
}
.org-instructions::before {
  content: ""; position: absolute; left: 0; top: 22px; bottom: 22px; width: 3px;
  background: var(--brique); opacity: 0.6; border-radius: 2px;
}
.org-instructions p { margin: 0 0 12px; padding-left: 8px; }
.org-instructions p:last-child { margin-bottom: 0; }
.project-instructions-form { gap: 12px; }
.project-form-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
}

.org-memory-card {
  display: flex; align-items: center; gap: 14px; padding: 15px 18px;
  border-radius: var(--radius); background: var(--surface);
  border: 1px solid var(--line); box-shadow: var(--shadow-sm);
}
.org-memory-card .ic2 {
  width: 36px; height: 36px; border-radius: 11px; background: var(--laiton-soft);
  border: 1px solid var(--laiton-2); color: oklch(0.50 0.09 60);
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.org-memory-card .t { font-size: 13.5px; color: var(--ink); line-height: 1.55; font-weight: 600; }
.org-memory-card .src {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
  margin-top: 4px; line-height: 1.45;
}
.project-members-list { margin-top: 2px; }
.project-member-row { grid-template-columns: 1.6fr 1fr auto; }
.project-member-row .primary { min-width: 0; align-items: center; }
.project-member-row .primary > span:last-child { min-width: 0; }
.org-avatar-sm {
  width: 30px; height: 30px; border-radius: 10px; background: var(--project-accent, var(--brique));
  color: oklch(0.98 0.008 250); display: inline-flex; align-items: center;
  justify-content: center; font-size: 11px; font-weight: 700; flex-shrink: 0;
}

/* Mobile — sidebar masquée sous 720px */
@media (max-width: 720px) {
  .chat-shell { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
  .org-aside { display: none; }
  .mobile-session-actions {
    display: flex;
    justify-content: flex-end;
    padding: 10px 12px 0;
    background: var(--bg);
  }
  .org-resume-grid { grid-template-columns: 1fr 1fr; }
  .org-empty-hello .greet { font-size: 30px; }
  .org-project-detail .org-top {
    align-items: flex-start; flex-wrap: wrap; gap: 12px; padding: 16px;
  }
  .org-project-heading { flex: 1 1 100%; }
  .org-project-title-block { flex: 1; }
  .org-project-detail .org-top .actions {
    width: 100%; justify-content: flex-start; padding-left: 44px; box-sizing: border-box;
  }
  .org-tabs { padding: 0 16px; }
  .org-detail-scroll { padding: 16px; }
  .org-project-pane.narrow { padding: 0; }
  .org-file-row, .org-memory-card { align-items: flex-start; }
  .org-file-row { flex-wrap: wrap; }
  .org-file-row .size { margin-left: 51px; }
  .project-member-row { grid-template-columns: 1fr; }
  .project-form-foot { align-items: stretch; flex-direction: column; }
}

/* ================================================================
   Organic primitives — partagées entre settings et autres écrans
   ================================================================ */
.org-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 11px; border-radius: 999px; font-size: 12px; font-weight: 500;
  color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line);
  white-space: nowrap;
}
.org-pill.bleu   { background: var(--brique-soft); color: oklch(0.42 0.13 256); border-color: oklch(0.86 0.060 256); }
.org-pill.laiton { background: var(--laiton-soft); color: oklch(0.45 0.080 50); border-color: var(--laiton-2); }

.org-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border-radius: 12px; font-size: 13.5px; font-weight: 500;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
  cursor: pointer; white-space: nowrap; text-decoration: none;
}
.org-btn:hover { background: var(--surface-2); }
.org-btn.solid  { background: var(--ink); color: oklch(0.96 0.012 72); border-color: var(--ink); box-shadow: var(--shadow-sm); }
.org-btn.bleu   { background: var(--brique); color: oklch(0.99 0.005 250); border-color: var(--brique); box-shadow: 0 6px 16px -8px oklch(0.42 0.14 256 / 0.5); }
.org-btn.danger { color: var(--bad); border-color: oklch(0.80 0.090 28); background: var(--bad-soft); }
.org-btn.sm     { padding: 6px 11px; font-size: 12px; border-radius: 10px; }
.org-btn.block  { width: 100%; justify-content: center; }
.org-btn.disabled,
.org-btn:disabled {
  opacity: 0.56; cursor: not-allowed; pointer-events: none;
}
.org-btn:hover.bleu { background: var(--brique-2); }
.org-btn:hover.danger { background: oklch(0.90 0.065 28); color: oklch(0.44 0.16 28); }

.org-card-h3 {
  font-family: "Newsreader", serif; font-weight: 400; font-size: 28px;
  letter-spacing: -0.02em; color: var(--ink); line-height: 1.05;
}
.org-card-h3 em { font-style: italic; color: var(--brique); }
.org-card-sub {
  font-family: "JetBrains Mono", monospace; font-size: 10.5px;
  letter-spacing: 0.05em; color: var(--mute); margin-top: 6px;
}

/* ================================================================
   Settings shell
   ================================================================ */
.settings-full { height: 100vh; overflow: hidden; font-family: "Albert Sans", sans-serif; }

.org-settings { display: grid; grid-template-columns: 280px 1fr; height: 100%; }
.settings-body { margin: 0; padding: 0; background: var(--bg); }
.org-settings-page {
  display: grid; grid-template-columns: 296px 1fr;
  height: 100dvh; overflow: hidden;
}
.settings-shell { grid-template-columns: 296px 1fr; }
.settings-shell-public {
  grid-template-columns: minmax(0, 1fr);
  height: auto;
  min-height: 100dvh;
  overflow: auto;
}
.settings-shell-public .org-set-right { min-height: 100dvh; }
.settings-shell-public .org-set-body {
  width: min(100%, 960px);
  margin: 0 auto;
  min-height: 100dvh;
}
.settings-shell .org-aside { min-height: 0; }
.settings-shell .org-set-right { min-width: 0; }
.rail-settings-nav {
  gap: 10px;
  padding-right: 2px;
}
.rail-settings-nav section {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.rail-settings-nav .org-section {
  padding-top: 2px;
}

.org-set-nav {
  border-right: 1px solid var(--line-2); background: var(--bg-2);
  padding: 24px 18px; display: flex; flex-direction: column; gap: 3px;
  overflow-y: auto;
}
.org-set-nav .head {
  display: flex; align-items: center; gap: 10px; padding: 4px 8px 16px;
}
.org-set-nav .head .back {
  width: 30px; height: 30px; border-radius: 9px; border: 1px solid var(--line);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--soft); background: var(--surface); text-decoration: none;
}
.org-set-nav .head .ttl {
  font-family: "Newsreader", serif; font-style: italic; font-size: 21px; color: var(--ink);
}
.org-set-item {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 12px; border-radius: 10px; font-size: 13.5px; color: var(--soft);
  white-space: nowrap; text-decoration: none;
}
.org-set-item .ic { color: var(--mute); }
.org-set-item:hover { background: var(--surface-2); color: var(--ink); }
.org-set-item.on {
  background: var(--surface); color: var(--ink); font-weight: 600;
  box-shadow: var(--shadow-sm), inset 3px 0 0 var(--brique); padding-left: 14px;
}
.org-set-item.on .ic { color: var(--brique); }
.org-set-spacer { flex: 1; min-height: 18px; }
.org-set-logout-form { margin: 0; }
.org-set-logout {
  width: 100%;
  border: 0;
  background: transparent;
  font: inherit;
  cursor: pointer;
}
.org-set-logout:hover {
  background: var(--brique-soft);
  color: var(--ink);
}
.org-set-logout:hover .ic { color: var(--brique); }

.org-set-body { padding: 34px 40px; overflow-y: auto; height: 100%; box-sizing: border-box; min-width: 0; }
.org-set-body .head-row {
  display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 24px;
}
.personal-settings-nav .org-set-item { white-space: normal; line-height: 1.25; }

/* Account settings */
.account-head-row { max-width: 860px; }
.org-account-id {
  max-width: 860px; display: flex; align-items: center; gap: 16px;
  padding: 16px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); margin-bottom: 22px;
}
.big-avatar {
  width: 58px; height: 58px; border-radius: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-size: 25px; color: oklch(0.98 0.006 250);
  background: linear-gradient(135deg, var(--brique), oklch(0.44 0.105 26));
  box-shadow: inset 0 1px 0 oklch(1 0 0 / 0.22), var(--shadow-sm);
  flex-shrink: 0;
}
.account-id-copy { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.account-name { font-size: 17px; font-weight: 600; color: var(--ink); }
.account-email { font-size: 12.5px; color: var(--soft); overflow-wrap: anywhere; }

.account-errors {
  max-width: 860px; border: 1px solid oklch(0.88 0.05 20);
  background: oklch(0.96 0.02 20); color: oklch(0.4 0.12 20);
  border-radius: var(--radius-sm); padding: 12px 14px; margin-bottom: 18px;
  font-size: 13px;
}
.account-errors ul { margin: 8px 0 0; padding-left: 18px; }
.account-errors li + li { margin-top: 3px; }

.org-form.account-form,
.org-form.account-security {
  max-width: 860px; padding: 16px; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm);
}
.account-form-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px; margin-top: 12px;
}
.org-field-label {
  display: block; margin-bottom: 6px; font-family: "JetBrains Mono", monospace;
  font-size: 10.5px; letter-spacing: 0.04em; color: var(--mute); text-transform: uppercase;
}
.org-field {
  display: grid; gap: 6px; margin-top: 10px;
  font-size: 12px; color: var(--mute);
}
.org-toggle-row {
  display: flex; align-items: center; gap: 9px;
  color: var(--ink); font-size: 13px; font-weight: 620;
}
.org-input {
  width: 100%; min-height: 40px; box-sizing: border-box;
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--surface-2); color: var(--ink);
  padding: 9px 11px; font: inherit; font-size: 13.5px;
}
.org-input::placeholder { color: var(--mute); }
.org-input:focus {
  outline: 2px solid oklch(0.82 0.055 256 / 0.65);
  outline-offset: 1px; background: var(--surface);
}
.account-section-gap { margin-top: 24px; }
.account-actions-row {
  display: flex; align-items: center; gap: 12px; margin-top: 18px;
}
.account-password-status {
  min-height: 40px; border: 1px dashed var(--line); border-radius: 12px;
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  color: var(--ink-2); background: var(--surface-2);
}
.account-password-status span:not(.badge) { display: block; font-size: 13px; font-weight: 600; }
.account-password-status small { display: block; color: var(--mute); font-size: 11.5px; margin-top: 2px; }
.badge {
  min-width: 28px; height: 28px; padding: 0 6px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--brique-soft); border: 1px solid oklch(0.86 0.060 256);
  color: oklch(0.42 0.13 256); font-weight: 700; font-size: 11px;
  box-sizing: border-box; flex-shrink: 0;
}
.org-conn-row {
  display: flex; align-items: center; gap: 10px; padding: 10px 0;
  border-bottom: 1px dashed var(--line-2); color: var(--ink-2); font-size: 13px;
}
.org-conn-row:last-child { border-bottom: none; }
.org-conn-row .org-pill { margin-left: auto; }
.org-conn-row.muted { color: var(--soft); }
.account-security-grid {
  max-width: 860px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px; margin-top: 14px;
}
.account-panel,
.account-danger-zone {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 15px;
}
.account-panel-head {
  display: flex; justify-content: space-between; gap: 12px; align-items: flex-start;
  margin-bottom: 12px;
}
.account-panel h2,
.account-danger-zone h2 {
  margin: 0; font-size: 14px; color: var(--ink); font-weight: 650;
}
.account-panel p,
.account-danger-zone p {
  margin: 5px 0 0; color: var(--soft); font-size: 12.5px; line-height: 1.5;
}
.account-passkeys {
  list-style: none; padding: 0; margin: 0 0 12px; display: flex; flex-direction: column; gap: 8px;
}
.account-passkeys li {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 9px 0; border-bottom: 1px dashed var(--line-2);
}
.account-passkeys strong { display: block; font-size: 13px; color: var(--ink-2); overflow-wrap: anywhere; }
.account-passkeys small { display: block; font-size: 11.5px; color: var(--mute); margin-top: 2px; overflow-wrap: anywhere; }
.account-passkey-form { margin-top: 10px; }
.account-inline-action { display: flex; align-items: center; gap: 8px; }
.account-inline-action .org-input { flex: 1; min-width: 0; }
.account-webauthn-status,
.account-muted-line {
  display: block; margin: 8px 0 0; font-size: 12px; color: var(--mute);
}
.account-danger-zone {
  max-width: 860px; margin-top: 18px; display: flex; align-items: center;
  justify-content: space-between; gap: 18px; border-color: oklch(0.86 0.04 28);
  background: oklch(0.985 0.012 42);
}
.account-delete-wizard {
  align-items: stretch;
  flex-direction: column;
}
.account-delete-copy {
  max-width: 680px;
}
.account-delete-steps,
.account-delete-banner,
.account-delete-impact,
.account-export-before-delete {
  max-width: 760px;
}
.account-delete-form {
  max-width: 760px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}
.account-delete-form .org-btn {
  justify-content: center;
  min-height: 42px;
}
.account-delete-modal-host { align-self: end; }
.account-delete-modal-host .org-btn { width: 100%; }
.account-export-before-delete {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}
.account-export-before-delete a {
  color: var(--brique);
  text-decoration: none;
  font-weight: 650;
}
.account-deletion-scheduled {
  max-width: 720px;
  margin: 0;
}
.account-deletion-scheduled-note {
  margin: 24px 0;
  text-align: left;
  width: 100%;
}

/* ================================================================
   Usage — heatmap + quotas
   ================================================================ */
.subscription-page {
  max-width: 960px;
  min-width: 0;
  margin: 0 auto;
}
.subscription-page.team-subscription-page { max-width: 1100px; }
.personal-plan-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.8fr);
  gap: 14px;
  max-width: 960px;
  margin-bottom: 24px;
}
.personal-plan-card,
.billing-empty-card,
.billing-profile-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  padding: 15px;
}
.personal-plan-card .card-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 12px;
}
.personal-plan-card .t,
.billing-empty-card .t,
.billing-profile-card .t {
  font-size: 13.5px;
  font-weight: 650;
  color: var(--ink);
}
.personal-plan-card .s,
.billing-empty-card .s,
.billing-profile-card .s {
  font-size: 12px;
  color: var(--mute);
  line-height: 1.45;
  margin-top: 3px;
}
.personal-plan-line,
.personal-price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 0;
  border-top: 1px dashed var(--line-2);
  font-size: 12.5px;
  color: var(--ink-2);
}
.personal-price-row span:first-child {
  min-width: 0;
  overflow-wrap: anywhere;
}
.personal-price-row span:last-child {
  flex-shrink: 0;
  font-family: "JetBrains Mono", monospace;
  font-size: 10.5px;
  color: var(--mute);
}
.billing-empty-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: -4px 0 18px;
}
.billing-profile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: -4px 0 18px;
}
.billing-empty-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.billing-profile-card {
  min-width: 0;
}
.billing-profile-card .card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}
.billing-line {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px dashed var(--line-2);
  min-width: 0;
}
.billing-line:first-of-type { border-top: none; }
.billing-line .rt {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  flex: 1;
}
.billing-line .a {
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 650;
  overflow-wrap: anywhere;
}
.billing-line .b {
  color: var(--mute);
  font-size: 11.5px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.billing-line .ri {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: var(--bleu-soft);
  color: var(--bleu);
}
.card-brand {
  display: inline-grid;
  min-width: 48px;
  height: 28px;
  padding: 0 8px;
  place-items: center;
  border-radius: 8px;
  background: var(--ink);
  color: white;
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.billing-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.billing-wallet-summary {
  display: grid;
  gap: 8px;
  color: var(--ink-2);
  font-size: 12.5px;
}
.billing-wallet-summary b { color: var(--ink); }
.unit-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}
.unit-field .unit {
  color: var(--mute);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  white-space: nowrap;
}
.field-hint {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 7px;
  color: var(--mute);
  font-size: 11.5px;
  line-height: 1.45;
}
.org-usage-cols { display: flex; gap: 28px; align-items: flex-start; }
.org-usage-left { flex: 1; min-width: 0; }
.org-usage-right { width: 220px; flex-shrink: 0; display: flex; flex-direction: column; gap: 0; }

.org-heatmap-wrap { display: flex; gap: 8px; }
.org-heatmap-days {
  display: grid; grid-template-rows: repeat(7, 13px); gap: 4px;
  font-family: "JetBrains Mono", monospace; font-size: 8.5px; color: var(--mute);
}
.org-heatmap-days span { line-height: 13px; height: 13px; }
.org-heatmap {
  display: grid; grid-auto-flow: column;
  grid-template-rows: repeat(7, 13px); grid-auto-columns: 13px; gap: 4px;
}
.org-heatmap .cell {
  width: 13px; height: 13px; border-radius: 3px;
  border: 1px solid oklch(0.86 0.012 250 / 0.45);
}
.org-heat-legend {
  display: flex; align-items: center; gap: 6px; margin-top: 14px;
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
}
.org-heat-legend .sw { width: 14px; height: 14px; border-radius: 4px; border: 1px solid var(--line); }

.org-quota-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-sm); padding: 13px 15px; box-shadow: var(--shadow-sm);
}
.org-quota-card .lbl {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  color: var(--mute); letter-spacing: 0.04em;
}
.org-quota-card .val {
  font-family: "Newsreader", serif; font-size: 24px; color: var(--ink); margin-top: 4px;
}
.org-quota-card .val .max { color: var(--mute); font-size: 15px; }
.org-quota-bar { height: 6px; border-radius: 4px; background: var(--line-2); overflow: hidden; margin-top: 9px; }
.org-quota-bar > div { height: 100%; background: var(--brique); border-radius: 4px; transition: width 300ms; }
.org-quota-bar > div.warn { background: var(--laiton); }
.org-quota-bar > div.exceeded { background: oklch(0.58 0.18 28); }

.org-model-line {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 0; border-bottom: 1px dashed var(--line-2);
}
.org-model-line:last-child { border-bottom: none; }
.org-model-line .n {
  font-size: 13px; color: var(--ink-2);
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; overflow: hidden;
}
.org-model-line .c { font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--mute); flex-shrink: 0; }

/* ================================================================
   Préférences — feature settings
   ================================================================ */
.org-prefs-form { max-width: 760px; }
.prefs-head-row { max-width: 760px; }
.org-prefs-stack { display: flex; flex-direction: column; gap: 12px; }

.org-pref-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden;
}
.org-pref-card.deferred { background: color-mix(in oklch, var(--surface) 82%, var(--bg-2)); }
.org-pref-head {
  display: grid; grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center; gap: 11px; padding: 14px 16px;
}
.org-pref-head .ic2 {
  width: 32px; height: 32px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--brique); background: var(--brique-soft); border: 1px solid oklch(0.86 0.060 256);
}
.org-pref-head .t {
  margin: 0; font-size: 14px; font-weight: 650; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-pref-head .s {
  margin: 3px 0 0; font-size: 12px; color: var(--mute);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-pref-body {
  border-top: 1px solid var(--line-2);
  padding: 2px 16px 10px 63px;
}
.org-pref-line {
  min-height: 46px; padding: 9px 0; border-bottom: 1px dashed var(--line-2);
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
}
.org-pref-line:last-child { border-bottom: none; }
.org-pref-line .k { color: var(--ink-2); font-size: 13px; font-weight: 560; }
.org-pref-line .hint {
  margin: 4px 0 0; color: var(--mute); font-size: 11.5px; line-height: 1.45;
}
.org-select {
  min-width: 150px; max-width: 100%;
  border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2);
  color: var(--ink); padding: 7px 30px 7px 10px; font: inherit; font-size: 12.5px;
}
.org-select.wide { min-width: 220px; }

.org-switch { position: relative; display: inline-flex; align-items: center; cursor: pointer; }
.org-switch input {
  position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none;
}
.org-switch .track {
  width: 42px; height: 24px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--line-2); position: relative; transition: background 120ms, border-color 120ms;
}
.org-switch .thumb {
  position: absolute; width: 18px; height: 18px; border-radius: 50%;
  top: 2px; left: 2px; background: var(--surface);
  box-shadow: 0 1px 3px oklch(0.25 0.02 58 / 0.16);
  transition: transform 120ms;
}
.org-switch input:checked + .track { background: var(--brique); border-color: var(--brique); }
.org-switch input:checked + .track .thumb { transform: translateX(18px); }
.org-switch input:focus-visible + .track {
  outline: 2px solid oklch(0.58 0.13 256 / 0.35); outline-offset: 2px;
}
.org-pref-reason {
  margin: 0; padding: 0 16px 15px 63px;
  color: var(--soft); font-size: 12.5px; line-height: 1.5;
}
.prefs-errors {
  max-width: 760px; margin: -6px 0 16px; padding: 12px 14px;
  border-radius: 12px; border: 1px solid oklch(0.82 0.09 28);
  background: oklch(0.97 0.018 28); color: oklch(0.38 0.11 28); font-size: 13px;
}
.prefs-errors ul { margin: 6px 0 0 18px; padding: 0; }

/* Personal settings v0.6 rows/cards */
.ps-form,
.ps-card,
.usage-head-row,
.prefs-head-row {
  max-width: 860px;
}
.ps-card { margin-bottom: 18px; }
.ps-card .card-body { padding: 0 16px; }
.ps-row,
.ps-sub-row {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line-2);
}
.ps-row:last-child,
.ps-sub-row:last-child { border-bottom: none; }
.ps-sub-row {
  margin-left: 46px;
  min-height: 50px;
  padding: 11px 0;
  border-bottom-style: dashed;
}
.ps-row .ri {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brique);
  background: var(--brique-soft);
  border: 1px solid oklch(0.86 0.060 256);
  flex-shrink: 0;
}
.ps-row .ri.danger {
  color: var(--bad);
  background: var(--bad-soft);
  border-color: oklch(0.84 0.08 28);
}
.ps-row .rt,
.ps-sub-row .rt {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.ps-row .a,
.ps-sub-row .a {
  font-size: 13.5px;
  font-weight: 650;
  color: var(--ink);
}
.ps-row .b,
.ps-sub-row .b {
  font-size: 12px;
  color: var(--mute);
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.ps-row-action {
  border: 0;
  background: transparent;
  color: var(--soft);
  font: inherit;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  cursor: pointer;
  text-align: right;
  min-width: 0;
}
.ps-row-action:hover { color: var(--ink); }
.ps-row-action.disabled {
  cursor: default;
  color: var(--mute);
  font-family: "JetBrains Mono", monospace;
  font-size: 10.5px;
}
.ps-toggle-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--mute);
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  white-space: nowrap;
}
.ps-toggle-label.on {
  background: oklch(0.94 0.04 165);
  border-color: oklch(0.84 0.05 165);
  color: oklch(0.40 0.06 165);
}
.ps-toggle-label.off {
  background: var(--line-2);
  color: var(--soft);
}
.ps-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.ps-modal-grid > :first-child:last-child,
.ps-modal-grid .org-toggle-row { grid-column: 1 / -1; }
.ps-discreet-actions {
  max-width: 860px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 14px;
}
.ps-big-id { margin-bottom: 22px; }
.account-info-card .org-modal-body,
.account-danger-card .org-modal-body { padding-top: 6px; }
.security-card .sec-webauthn-status { margin-bottom: 0; }

.ps-tiles {
  max-width: 860px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0 24px;
}
.ps-tile {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  padding: 15px;
}
.ps-tile .k,
.usage-kicker {
  font-family: "JetBrains Mono", monospace;
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}
.ps-tile .v {
  font-family: "Newsreader", serif;
  font-size: 29px;
  line-height: 1.05;
  color: var(--ink);
  margin-top: 6px;
}
.ps-tile .v small {
  font-family: "Albert Sans", sans-serif;
  font-size: 13px;
  color: var(--mute);
}
.ps-tile .sub {
  margin-top: 5px;
  font-size: 11.5px;
  color: var(--mute);
}
.usage-plan-row,
.usage-credit-head {
  display: flex;
  align-items: center;
  gap: 14px;
  justify-content: space-between;
}
.usage-plan-row { padding: 14px 0; }
.usage-credit-head {
  padding: 16px;
  border-bottom: 1px solid var(--line-2);
}
.usage-plan-row .h3,
.usage-credit-head .h3 {
  display: block;
  font-family: "Newsreader", serif;
  font-size: 20px;
  color: var(--ink);
}
.usage-plan-row .h3 em {
  font-style: italic;
  color: var(--brique);
}
.subtle-meta {
  display: block;
  margin-top: 3px;
  color: var(--mute);
  font-size: 12px;
}
.ps-plan-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ps-plan-option {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px dashed var(--line-2);
}
.ps-plan-option:last-child { border-bottom: none; }
.ps-plan-option.current { color: var(--soft); }
.ps-price span { color: var(--mute); font-weight: 400; }
.mono {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
}
.mt24 { margin-top: 24px; }
.org-coc.xs {
  width: 10px;
  height: 10px;
  flex-shrink: 0;
}
.org-modal-foot .sp { flex: 1; }
.org-modal-foot .note {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--mute);
  font-size: 12px;
}

.ps-model-picker {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ps-model-option {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  cursor: pointer;
}
.ps-model-option:hover,
.ps-model-option.on,
.ps-model-option:has(input:checked) {
  border-color: oklch(0.82 0.075 256);
  background: oklch(0.985 0.018 256);
}
.ps-model-option input { position: absolute; opacity: 0; pointer-events: none; }
.ps-model-option .mp-check {
  opacity: 0;
}
.ps-model-option.on .mp-check,
.ps-model-option:has(input:checked) .mp-check {
  opacity: 1;
  background: var(--brique);
  border-color: var(--brique);
  color: oklch(0.99 0.005 85);
}

/* États spéciaux */
.usage-no-plan {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 48px 24px; text-align: center;
}
.usage-no-plan-icon { color: var(--mute); }
.usage-no-plan-title { font-family: "Newsreader", serif; font-size: 20px; color: var(--ink); }
.usage-no-plan-sub { font-size: 13px; color: var(--soft); max-width: 340px; }

.usage-alert-banner {
  display: flex; align-items: center; gap: 8px; margin-bottom: 12px;
  padding: 9px 13px; border-radius: 10px; font-size: 12.5px;
  background: oklch(0.96 0.02 20); color: oklch(0.4 0.12 20);
  border: 1px solid oklch(0.88 0.05 20);
}
.usage-warn-banner {
  display: flex; align-items: center; gap: 8px; margin-bottom: 12px;
  padding: 9px 13px; border-radius: 10px; font-size: 12.5px;
  background: var(--laiton-soft); color: oklch(0.45 0.080 50);
  border: 1px solid var(--laiton-2);
}

.usage-empty-hint {
  font-family: "JetBrains Mono", monospace; font-size: 11px;
  color: var(--mute); padding: 12px 0;
}

/* ================================================================
   Confidentialite — UX11 categorise, controles reels seulement
   ================================================================ */
.privacy-head-row,
.org-privacy-form {
  max-width: 780px;
}
.org-privacy-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.org-privacy-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.org-privacy-card.open {
  border-color: oklch(0.86 0.060 256);
}
.org-privacy-head {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
}
.org-privacy-head .ic2 {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: var(--brique-soft);
  color: var(--brique);
  border: 1px solid oklch(0.88 0.05 256);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.org-privacy-head .t {
  margin: 0;
  font-size: 14px;
  font-weight: 650;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.org-privacy-head .s {
  margin: 3px 0 0;
  color: var(--soft);
  font-size: 12.5px;
  line-height: 1.35;
}
.org-privacy-body {
  padding: 4px 18px 18px 68px;
  border-top: 1px dashed var(--line-2);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.org-privacy-row {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.org-privacy-row.muted {
  color: var(--soft);
}
.org-privacy-row .label {
  color: var(--ink-2);
  font-size: 13.5px;
  font-weight: 560;
}
.org-privacy-row .sub {
  margin: 3px 0 0;
  color: var(--mute);
  font-size: 12px;
  line-height: 1.45;
}
.org-privacy-state {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--soft);
  font-family: "JetBrains Mono", monospace;
  font-size: 10.5px;
  white-space: nowrap;
}
.org-privacy-state.ok {
  background: var(--brique-soft);
  color: oklch(0.42 0.13 256);
  border-color: oklch(0.86 0.060 256);
}
.org-privacy-state.unavailable {
  background: var(--laiton-soft);
  color: oklch(0.45 0.080 50);
  border-color: var(--laiton-2);
}
.org-privacy-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 10px;
}
.org-privacy-gdpr-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex-wrap: wrap;
}
.org-btn.disabled,
.org-btn[aria-disabled="true"] {
  opacity: 0.58;
  cursor: not-allowed;
  background: var(--surface-2);
  color: var(--soft);
  border-color: var(--line);
  box-shadow: none;
}

/* ================================================================
   Exports RGPD + suppression programmee
   ================================================================ */
.account-export-banner,
.account-export-empty,
.account-export-list,
.account-export-reassure,
.account-export-section-title {
  max-width: 780px;
}
.account-export-banner {
  margin-bottom: 14px;
}
.account-export-empty {
  margin-bottom: 18px;
}
.account-export-list-head,
.account-export-row {
  grid-template-columns: minmax(0, 1.5fr) minmax(100px, 0.7fr) minmax(70px, 0.4fr) auto;
}
.account-export-reassure {
  justify-content: flex-start;
  margin-top: 16px;
}
.org-wizard {
  max-width: 680px;
  width: 100%;
}
.org-steps {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 20px;
}
.org-steps .step {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
  color: var(--mute);
  white-space: nowrap;
}
.org-steps .step .n {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: var(--surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  font-weight: 600;
  color: var(--mute);
  flex-shrink: 0;
}
.org-steps .step.on {
  color: var(--ink);
  font-weight: 650;
}
.org-steps .step.on .n {
  background: var(--brique);
  border-color: var(--brique);
  color: oklch(0.99 0.005 250);
}
.org-steps .step.done .n {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--bg);
}
.org-steps .bar {
  flex: 1;
  height: 1px;
  background: var(--line);
  margin: 0 12px;
  min-width: 24px;
}
.org-steps .bar.done {
  background: var(--ink);
}
.org-impact {
  display: flex;
  flex-direction: column;
  gap: 1px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.org-impact .item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line-2);
}
.org-impact .item:last-child {
  border-bottom: none;
}
.org-impact .item .ic2 {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: oklch(0.96 0.030 28);
  border: 1px solid oklch(0.84 0.07 28);
  color: oklch(0.55 0.16 28);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.org-impact .item .t {
  font-size: 13.5px;
  font-weight: 650;
  color: var(--ink);
}
.org-impact .item .s {
  font-size: 12.5px;
  color: var(--soft);
  margin-top: 2px;
}
.org-impact .item .q {
  margin-left: auto;
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--mute);
  white-space: nowrap;
}
.org-check-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.org-check {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1.5px solid var(--line);
  background: var(--surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
  color: transparent;
}
.org-check.on {
  background: var(--brique);
  border-color: var(--brique);
  color: oklch(0.99 0.005 250);
}
.org-check-row .ct {
  font-size: 13px;
  color: var(--ink-2);
  line-height: 1.5;
}
.org-scheduled {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: 520px;
}
.org-scheduled .glyph {
  width: 66px;
  height: 66px;
  border-radius: 20px;
  background: var(--laiton-soft);
  border: 1px solid var(--laiton-2);
  color: oklch(0.50 0.09 60);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}
.org-scheduled .glyph.danger {
  background: oklch(0.96 0.030 28);
  border-color: oklch(0.82 0.08 28);
  color: oklch(0.55 0.16 28);
}
.org-scheduled h2 {
  margin: 0;
  font-family: "Newsreader", serif;
  font-weight: 400;
  font-size: 30px;
  letter-spacing: 0;
}
.org-scheduled .when {
  margin: 10px 0 4px;
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  color: var(--brique);
}
.org-scheduled .desc {
  color: var(--soft);
  font-size: 13.5px;
  line-height: 1.6;
  margin-top: 8px;
}

/* Responsive settings */
@media (max-width: 900px) {
  .org-usage-cols { flex-direction: column; }
  .org-usage-right { width: 100%; }
  .personal-plan-summary,
  .billing-empty-grid,
  .billing-profile-grid { grid-template-columns: 1fr; }
  .org-privacy-actions { align-items: stretch; flex-direction: column; }
  .org-privacy-actions .org-btn.bleu { justify-content: center; }
  .account-form-grid,
  .account-security-grid { grid-template-columns: 1fr; }
  .account-delete-form { grid-template-columns: 1fr; }
  .ps-tiles,
  .ps-modal-grid { grid-template-columns: 1fr; }
  .usage-plan-row,
  .usage-credit-head { align-items: flex-start; flex-direction: column; }
  .ps-plan-option { grid-template-columns: 1fr; align-items: stretch; }
}
@media (max-width: 720px) {
  .settings-full { overflow: auto; height: auto; }
  .org-settings { grid-template-columns: 1fr; height: auto; }
  .org-set-nav { display: none; }
  .org-settings-page { grid-template-rows: auto minmax(0, 1fr); }
  .settings-body .mobile-session-actions {
    display: flex;
    justify-content: flex-end;
    padding: 10px 12px 0;
    background: var(--bg);
  }
  .org-set-body { padding: 20px; overflow: visible; height: auto; }
  .org-settings-page { grid-template-columns: minmax(0, 1fr); overflow: auto; height: auto; }
  .account-form-grid,
  .account-security-grid { grid-template-columns: 1fr; }
  .org-account-id,
  .account-danger-zone { align-items: flex-start; flex-direction: column; }
  .ps-row,
  .ps-sub-row {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .ps-sub-row { margin-left: 0; }
  .ps-row .ri { margin-top: 1px; }
  .ps-row-action {
    width: 100%;
    justify-content: space-between;
    text-align: left;
  }
  .ps-row-action:has(.org-coc.xs) { justify-content: flex-start; }
  .ps-row-action:has(.org-coc.xs) svg:last-child { margin-left: auto; }
  .ps-discreet-actions .org-btn,
  .ps-discreet-actions .org-privacy-state {
    width: 100%;
    justify-content: center;
  }
  .account-actions-row,
  .account-inline-action { flex-direction: column; align-items: stretch; }
  .account-inline-action .org-btn,
  .account-actions-row .org-btn { justify-content: center; width: 100%; }
  .org-prefs-form, .prefs-head-row { max-width: none; }
  .prefs-head-row { align-items: flex-start; gap: 14px; }
  .org-pref-head { grid-template-columns: 30px minmax(0, 1fr) auto; padding: 13px; }
  .org-pref-head .ic2 { width: 30px; height: 30px; }
  .org-pref-body { padding: 0 13px 8px; }
  .org-pref-line { align-items: stretch; flex-direction: column; gap: 8px; }
  .org-select, .org-select.wide { width: 100%; min-width: 0; }
  .org-pref-reason { padding: 0 13px 13px 54px; }
  .privacy-head-row { align-items: flex-start; gap: 14px; }
  .org-privacy-head { grid-template-columns: 32px minmax(0, 1fr); }
  .org-privacy-head .org-pill { grid-column: 2; justify-self: start; }
  .org-privacy-head .ic2 { width: 32px; height: 32px; }
  .org-privacy-body { padding: 4px 14px 16px; }
  .org-privacy-row { align-items: stretch; flex-direction: column; gap: 8px; }
  .org-privacy-row .org-switch,
  .org-privacy-row .org-select,
  .org-privacy-state { align-self: flex-start; }
  .org-privacy-gdpr-actions .org-btn { white-space: normal; }
  .account-export-list-head { display: none; }
  .account-export-row { grid-template-columns: 1fr; align-items: stretch; }
  .account-export-row .actions { justify-content: flex-start; }
  .org-steps { align-items: flex-start; flex-direction: column; gap: 8px; }
  .org-steps .bar { display: none; }
  .org-impact .item { align-items: flex-start; flex-direction: column; }
  .org-impact .item .q { margin-left: 0; }
}

/* ── Auth screens — organic design (UX01, issue #83) ── */

.auth-page {
  --bg:          oklch(0.974 0.006 250);
  --surface:     oklch(0.996 0.003 250);
  --surface-2:   oklch(0.985 0.005 250);
  --ink:         oklch(0.255 0.024 58);
  --ink-2:       oklch(0.37 0.022 58);
  --soft:        oklch(0.49 0.018 60);
  --mute:        oklch(0.61 0.014 62);
  --line:        oklch(0.87 0.008 250);
  --line-2:      oklch(0.925 0.006 250);
  --brique:      oklch(0.49 0.145 256);
  --brique-soft: oklch(0.93 0.050 256);
  --laiton:      oklch(0.74 0.082 84);
  --laiton-soft: oklch(0.945 0.040 88);
  --radius-sm:   12px;
  --radius:      16px;
  --radius-lg:   22px;
  --radius-xl:   28px;
  --shadow:      0 1px 0 oklch(0.87 0.010 250 / 0.6),
                 0 8px 24px -16px oklch(0.26 0.022 58 / 0.13);
  --shadow-lg:   0 1px 0 oklch(0.87 0.010 250 / 0.7),
                 0 14px 30px -20px oklch(0.26 0.022 58 / 0.17),
                 0 32px 60px -30px oklch(0.26 0.022 58 / 0.13);
  background: var(--bg);
  font-family: "Albert Sans", system-ui, -apple-system, sans-serif;
  color: var(--ink);
  min-height: 100dvh;
  margin: 0;
}
/* border-box pour toute la page auth : les éléments en width:100% (carte,
   bouton primaire) incluent padding+bordure et ne débordent pas le viewport
   en mobile. Même patron que `.org *` côté chat. */
.auth-page *,
.auth-page *::before,
.auth-page *::after { box-sizing: border-box; }

/* Halo bleu en haut à droite (subtil) */
.auth-page::before {
  content: "";
  position: fixed;
  top: -180px; right: -120px;
  width: 540px; height: 540px;
  background: radial-gradient(circle, oklch(0.58 0.13 256 / 0.07) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
}

/* Halo laiton bas gauche */
.auth-page::after {
  content: "";
  position: fixed;
  bottom: -140px; left: -80px;
  width: 420px; height: 420px;
  background: radial-gradient(circle, oklch(0.74 0.082 84 / 0.06) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}

.auth-wrap {
  position: relative;
  z-index: 1;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  gap: 1.5rem;
}

/* Card */
.auth-card {
  width: 100%;
  max-width: 432px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  padding: 2.75rem 2.75rem 2.25rem;
  position: relative;
}

/* Filet laiton art déco en haut */
.auth-card::before {
  content: "";
  position: absolute;
  top: 18px; left: 50%;
  transform: translateX(-50%);
  width: 44px; height: 6px;
  background: linear-gradient(
    180deg,
    var(--laiton) 0, var(--laiton) 1px,
    transparent 1px, transparent 2.5px,
    var(--laiton) 2.5px, var(--laiton) 3.5px,
    transparent 3.5px, transparent 5px,
    var(--laiton) 5px, var(--laiton) 6px
  );
  opacity: 0.5;
}

/* Brandmark */
.auth-brandmark {
  width: 60px; height: 60px;
  background: var(--ink);
  color: var(--bg);
  border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  font-family: "Newsreader", "Georgia", serif;
  font-style: italic;
  font-size: 38px;
  margin: 0.5rem auto 1.125rem;
  box-shadow: var(--shadow), inset 0 0 0 1px oklch(0.40 0.022 58);
  position: relative;
}
.auth-brandmark::after {
  content: "";
  position: absolute;
  left: 12px; right: 12px; bottom: 7px;
  height: 1px;
  background: var(--laiton);
  opacity: 0.55;
  border-radius: 1px;
}

/* Heading + subhead */
.auth-heading {
  font-family: "Newsreader", "Georgia", serif;
  font-weight: 400;
  font-size: 1.6875rem;
  text-align: center;
  margin: 0;
  letter-spacing: -0.02em;
}
.auth-heading em { font-style: italic; color: var(--brique); }
.auth-subhead {
  text-align: center;
  color: var(--soft);
  font-size: 0.875rem;
  margin: 0.375rem 0 1.625rem;
}

.auth-deterrent {
  display: grid;
  gap: 0.375rem;
  margin: -0.75rem 0 1.25rem;
  padding: 0.75rem 0.875rem;
  border: 1px solid oklch(0.86 0.055 84);
  border-radius: var(--radius-sm);
  background: var(--laiton-soft);
  color: var(--ink-2);
  font-size: 0.8125rem;
  line-height: 1.35;
  text-align: center;
}
.auth-deterrent strong {
  color: var(--ink);
  font-weight: 650;
}
.auth-deterrent-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  margin-top: 0.125rem;
  padding: 0.35rem 0.7rem;
  border: 1px solid oklch(0.80 0.070 256);
  border-radius: 999px;
  background: var(--surface);
  color: var(--brique);
  font-weight: 650;
  text-decoration: none;
}
.auth-deterrent-link:hover {
  border-color: oklch(0.70 0.090 256);
  color: oklch(0.43 0.140 256);
}

/* Field label */
.auth-field-label {
  font-family: "JetBrains Mono", "Courier New", monospace;
  font-size: 0.625rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 0.4375rem;
  display: block;
}

/* Input */
.auth-input {
  width: 100%;
  padding: 0.6875rem 0.875rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  background: var(--surface);
  font-size: 0.875rem;
  color: var(--ink);
  font-family: "Albert Sans", system-ui, sans-serif;
  box-shadow: inset 0 1px 2px oklch(0.26 0.022 58 / 0.04);
  transition: border-color 120ms, box-shadow 120ms;
  box-sizing: border-box;
}
.auth-input:focus {
  outline: none;
  border-color: var(--brique);
  box-shadow: 0 0 0 3px oklch(0.49 0.145 256 / 0.12),
              inset 0 1px 2px oklch(0.26 0.022 58 / 0.04);
}
.auth-input:disabled,
.auth-input[readonly] {
  color: var(--soft);
  background: var(--surface-2);
  border-color: var(--line);
  box-shadow: none;
  opacity: 1;
}

/* Password row with forgot link */
.auth-pw-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.4375rem;
}
.auth-pw-row .auth-field-label { margin-bottom: 0; }
.auth-forgot {
  font-size: 0.75rem;
  color: var(--mute);
  text-decoration: underline;
  text-decoration-color: var(--line);
}
.auth-forgot:hover { color: var(--ink-2); }

/* Primary button (bleu) */
.auth-btn-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.625rem 1rem;
  margin-top: 0.625rem;
  background: var(--brique);
  color: oklch(0.99 0.005 250);
  border: 1px solid var(--brique);
  border-radius: var(--radius-sm);
  font-family: "Albert Sans", system-ui, sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: 0 6px 16px -8px oklch(0.42 0.14 256 / 0.5);
  cursor: pointer;
  transition: background 120ms, box-shadow 120ms;
}
.auth-btn-primary:hover {
  background: oklch(0.43 0.140 256);
  box-shadow: 0 8px 20px -8px oklch(0.42 0.14 256 / 0.6);
}

/* Ghost button (OIDC, magic link, secondary) */
.auth-btn-ghost {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  padding: 0.6875rem 1rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  font-family: "Albert Sans", system-ui, sans-serif;
  font-size: 0.84375rem;
  font-weight: 500;
  color: var(--ink-2);
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms;
  box-sizing: border-box;
}
.auth-btn-ghost:hover { background: var(--surface-2); }
.auth-btn-ghost[aria-disabled="true"] {
  opacity: 0.42;
  cursor: not-allowed;
  pointer-events: none;
}

/* OIDC badge (provider icon placeholder) */
.auth-oidc-badge {
  width: 22px; height: 22px;
  border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif;
  font-style: italic;
  font-size: 13px;
  background: var(--laiton-soft);
  border: 1px solid oklch(0.87 0.040 88);
  flex-shrink: 0;
}
.auth-oidc-badge--sso {
  background: var(--brique-soft);
  border-color: oklch(0.80 0.070 256);
  color: var(--brique);
}

/* OR divider */
.auth-or {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 1.25rem 0;
  font-family: "JetBrains Mono", monospace;
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mute);
}
.auth-or::before,
.auth-or::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line-2);
}

/* OIDC group */
.auth-oidc { display: flex; flex-direction: column; gap: 0.5rem; }

/* Coming soon pill */
.auth-soon {
  margin-left: auto;
  font-family: "JetBrains Mono", monospace;
  font-size: 0.5625rem;
  letter-spacing: 0.08em;
  color: var(--mute);
  background: var(--laiton-soft);
  border: 1px solid oklch(0.87 0.040 88);
  border-radius: 999px;
  padding: 0.1rem 0.45rem;
  white-space: nowrap;
}

/* Legal / CGU */
.auth-legal {
  text-align: center;
  font-size: 0.6875rem;
  color: var(--mute);
  margin-top: 1.375rem;
  line-height: 1.6;
}
.auth-legal a,
.auth-legal .auth-legal-ref {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--line);
}
.auth-legal a:hover { color: var(--ink-2); }
/* Référence légale non encore cliquable (pages à livrer) : souligné mais inerte. */
.auth-legal .auth-legal-ref { cursor: default; }

/* Alt link row below card */
.auth-alt {
  text-align: center;
  font-size: 0.8125rem;
  color: var(--soft);
}
.auth-alt a {
  color: var(--ink-2);
  text-decoration: underline;
  text-decoration-color: var(--line);
}
.auth-alt a:hover { color: var(--ink); }

/* Flash messages inside card */
.auth-flash {
  border-radius: var(--radius-sm);
  padding: 0.625rem 0.875rem;
  font-size: 0.8125rem;
  margin-bottom: 1rem;
}
.auth-flash-alert {
  background: oklch(0.96 0.030 28);
  border: 1px solid oklch(0.85 0.080 28);
  color: oklch(0.38 0.13 28);
}
.auth-flash-notice {
  background: oklch(0.96 0.025 165);
  border: 1px solid oklch(0.82 0.060 165);
  color: oklch(0.38 0.09 165);
}

/* Error list */
.auth-errors {
  background: oklch(0.96 0.030 28);
  border: 1px solid oklch(0.85 0.080 28);
  border-radius: var(--radius-sm);
  padding: 0.625rem 0.875rem;
  margin-bottom: 1rem;
}
.auth-errors ul {
  margin: 0; padding: 0 0 0 1rem;
  font-size: 0.8125rem;
  color: oklch(0.38 0.13 28);
}

/* Fieldset spacing */
.auth-field { margin-bottom: 0.75rem; }
.auth-field:last-of-type { margin-bottom: 0; }

/* Sovereignty footer */
.auth-foot {
  flex-shrink: 0;
}
.auth-reassure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  font-family: "JetBrains Mono", monospace;
  font-size: 0.65625rem;
  color: var(--mute);
  letter-spacing: 0.06em;
}
.auth-reassure-item {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
.auth-reassure-sep { color: var(--laiton); }
.auth-reassure-ic {
  width: 11px; height: 11px;
  color: var(--brique);
  flex-shrink: 0;
}

/* 2FA extra spacing */
.auth-2fa-method { margin-bottom: 1.25rem; }
.auth-2fa-summary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--soft);
  cursor: pointer;
  margin-bottom: 0.75rem;
}
.auth-2fa-details { margin-bottom: 0; }
.auth-2fa-details[open] .auth-2fa-summary { color: var(--ink-2); }

/* Responsive */
@media (max-width: 500px) {
  .auth-card {
    border-radius: var(--radius-lg);
    padding: 2rem 1.25rem 1.75rem;
  }
  .auth-card::before { display: none; }
}

/* ================================================================
   PROJETS (UX07, issue #89)
   Adapté de docs/design/chat-lesur-ai/project/organic-screens.css
   org-btn / org-pill sont définis dans la section primitives ci-dessus.
   ================================================================ */

/* Page projets — conteneur principal */
.org-proj-page {
  display: flex; flex-direction: column; height: 100%; overflow: hidden;
}
.org-proj-page .org-top { flex-shrink: 0; }

.org-proj-scroll {
  flex: 1 1 auto; overflow-y: auto; padding: 26px 36px;
}
.org-proj-grid-shell {
  max-width: 980px; margin: 0 auto; display: flex; flex-direction: column; gap: 18px;
}
.org-proj-tools {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
}
.org-proj-tools .org-search-field {
  width: min(420px, 100%);
}
.org-proj-count {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
  letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap;
}
.org-pcards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px;
}
.org-proj-cards {
  align-items: stretch;
}

/* Champ recherche / filtre */
.org-search-field {
  display: flex; align-items: center; gap: 9px;
  padding: 9px 13px; border-radius: 12px;
  border: 1px solid var(--line); background: var(--surface);
  color: var(--mute); font-size: 13px; flex-shrink: 0;
}
.org-search-input {
  border: none; outline: none; background: transparent;
  font-size: 13px; color: var(--ink); font-family: inherit; width: 100%;
}
.org-search-input::placeholder { color: var(--mute); }

.org-proj-card {
  min-height: 240px; display: flex; flex-direction: column; gap: 11px;
}
.org-proj-card .pc-head { align-items: flex-start; }
.org-proj-card .pc-title-link {
  min-width: 0; flex: 1; text-decoration: none;
}
.org-proj-card .pc-title-link:hover .pc-name { color: var(--acc, var(--brique)); }
.org-proj-card .pc-name {
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.org-proj-card .pc-ct {
  display: inline-flex; align-items: center; gap: 4px; padding-top: 2px;
}
.org-proj-card .pc-ct svg { color: var(--mute); }
.org-proj-card .pc-badges {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.org-proj-card .pc-badge {
  display: inline-flex; align-items: center; gap: 5px;
  border: 1px solid var(--line); border-radius: 999px; padding: 3px 8px;
  background: var(--surface-2); color: var(--soft);
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
}
.org-proj-card .pc-badge svg { color: var(--acc, var(--brique)); }
.org-proj-card .pc-desc {
  min-height: 38px;
}
.org-proj-card .pc-desc.muted {
  color: var(--whisper); font-style: italic;
}
.org-proj-card .pc-chats {
  display: flex; flex-direction: column; gap: 6px; min-height: 86px; flex: 1 1 auto;
}
.org-proj-card .pc-chat {
  min-width: 0; display: flex; align-items: center; gap: 8px;
  padding: 7px 9px; border-radius: 10px;
  color: var(--ink-2); text-decoration: none; background: var(--surface-2);
  font-size: 12px;
}
.org-proj-card a.pc-chat:hover {
  background: var(--acc-s, var(--brique-soft)); color: var(--ink);
}
.org-proj-card .pc-chat .ic { color: var(--mute); flex-shrink: 0; }
.org-proj-card .pc-chat .t {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.org-proj-card .pc-chat.empty {
  color: var(--whisper); background: transparent; border: 1px dashed var(--line);
}
.org-proj-card .pc-foot {
  display: flex; align-items: center; gap: 8px; padding-top: 2px;
}
.org-card-action-form { margin: 0; }
.org-proj-card .pc-act {
  min-height: 30px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border-radius: 10px; border: 1px solid var(--line);
  padding: 6px 10px; font: inherit; font-size: 12px; font-weight: 600;
  text-decoration: none; cursor: pointer; white-space: nowrap;
}
.org-proj-card .pc-act.primary {
  background: var(--acc, var(--brique)); color: oklch(0.99 0.005 85);
  border-color: var(--acc, var(--brique));
}
.org-proj-card .pc-act.ghost {
  background: var(--surface-2); color: var(--ink-2);
}
.org-proj-card .pc-act:hover,
.org-proj-card .pc-icon-action:hover {
  box-shadow: var(--shadow-sm);
}
.org-proj-card .pc-icon-action {
  width: 30px; height: 30px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); background: var(--surface-2); color: var(--soft);
  text-decoration: none; margin-left: auto; flex-shrink: 0;
}
.org-proj-card .pc-icon-action:hover { color: var(--acc, var(--brique)); }
.org-project-card--hidden { display: none; }
.org-proj-no-results {
  border: 1px dashed var(--line); border-radius: var(--radius);
  padding: 18px; color: var(--mute); text-align: center; font-size: 13px;
}

/* État vide — aucun projet du tout */
.org-proj-empty {
  flex: 1; display: flex; align-items: center; justify-content: center;
  padding: 40px 32px;
}
.org-proj-empty-inner {
  text-align: center; max-width: 360px;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
}
.org-proj-empty-icon { color: var(--whisper); }
.org-proj-empty-title {
  font-family: "Newsreader", serif; font-size: 20px; font-weight: 400;
  color: var(--ink-2);
}
.org-proj-empty-hint { font-size: 14px; color: var(--soft); line-height: 1.5; }

/* Mobile */
@media (max-width: 720px) {
  .org-proj-scroll { padding: 16px; }
  .org-proj-tools { align-items: stretch; flex-direction: column; }
  .org-proj-tools .org-search-field { width: 100%; box-sizing: border-box; }
  .org-pcards { grid-template-columns: 1fr; }
  .org-proj-card .pc-foot { flex-wrap: wrap; }
}

/* ================================================================
   CHAT PRIVÉ ORGANIQUE (UX05, issue #87)
   Mode éphémère : thème sombre distinctif (impossible à confondre
   avec un chat normal) + banner de confidentialité (P4-A6).
   Adapté de docs/design/chat-lesur-ai/project/organic-screens.css.
   Le flag `.private-mode` est posé sur `.chat-shell.org` (layout "chat")
   et cascade sur tout le shell.
   ================================================================ */

/* --- Pills génériques (réutilisables) --- */
.org-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 11px; border-radius: 999px;
  font-size: 12px; font-weight: 500;
  color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line);
  white-space: nowrap;
}
.org-pill.bleu {
  background: var(--brique-soft); color: oklch(0.42 0.13 256); border-color: oklch(0.86 0.060 256);
}

/* --- Fond sombre du shell + zone principale --- */
.chat-shell.private-mode { background: oklch(0.26 0.018 58); }
.private-mode .org-main { background: oklch(0.26 0.018 58); }

/* --- Sidebar sombre --- */
.private-mode .org-aside {
  background: linear-gradient(180deg, oklch(0.24 0.016 58) 0%, oklch(0.21 0.014 58) 100%);
  border-right-color: oklch(0.34 0.014 58);
}
.private-mode .org-aside::after { opacity: 0.4; }
.private-mode .org-wordmark { border-bottom-color: oklch(0.34 0.014 58); }
.private-mode .org-wordmark-text { color: oklch(0.94 0.010 70); }
.private-mode .org-wordmark-sub { color: oklch(0.66 0.012 70); }
.private-mode .org-mark {
  background: oklch(0.94 0.010 70); color: oklch(0.24 0.016 58);
  box-shadow: var(--shadow-sm), inset 0 0 0 1px oklch(0.80 0.010 70);
}

.private-mode .org-sb-btn { color: oklch(0.80 0.012 70); }
.private-mode .org-sb-btn:hover { background: oklch(0.30 0.014 58); color: oklch(0.94 0.010 70); }
.private-mode .org-sb-btn .ic { color: oklch(0.66 0.012 70); }
.private-mode .org-sb-btn.primary { background: oklch(0.94 0.010 70); color: oklch(0.24 0.016 58); }
.private-mode .org-sb-btn.primary .ic { color: var(--brique); }
.private-mode .org-sb-btn.primary:hover { background: oklch(0.88 0.010 70); color: oklch(0.20 0.016 58); }
/* « Chat privé » : mis en avant (actif) dans le thème privé */
.private-mode .org-sb-btn.subtle {
  border-color: var(--brique); color: oklch(0.84 0.08 256);
  background: oklch(0.34 0.06 256 / 0.45);
}
.private-mode .org-sb-btn.subtle .ic { color: oklch(0.78 0.10 256); }
.private-mode .org-sb-btn.subtle:hover { background: oklch(0.38 0.07 256 / 0.55); }

.private-mode .mobile-session-actions { background: oklch(0.26 0.018 58); }
.private-mode .mobile-session-logout {
  background: oklch(0.30 0.014 58);
  border-color: oklch(0.36 0.014 58);
  color: oklch(0.80 0.012 70);
}
.private-mode .mobile-session-logout .ic { color: oklch(0.66 0.012 70); }
.private-mode .mobile-session-logout:hover {
  background: oklch(0.38 0.07 256 / 0.55);
  color: oklch(0.94 0.010 70);
}
.private-mode .mobile-session-logout:hover .ic { color: oklch(0.78 0.10 256); }

.private-mode .org-section { color: oklch(0.66 0.012 70); }
.private-mode .org-section::after { background: oklch(0.34 0.014 58); }
.private-mode .org-item { color: oklch(0.74 0.012 70); }
.private-mode .org-item:hover { background: oklch(0.30 0.014 58); color: oklch(0.94 0.010 70); }
.private-mode .org-item.active {
  background: oklch(0.30 0.014 58); color: oklch(0.95 0.010 70);
  box-shadow: var(--shadow-sm), inset 3px 0 0 var(--brique);
}
.private-mode .org-project { color: oklch(0.74 0.012 70); }
.private-mode .org-project:hover { background: oklch(0.30 0.014 58); color: oklch(0.94 0.010 70); }

.private-mode .org-user { background: oklch(0.30 0.014 58); border-color: oklch(0.36 0.014 58); }
.private-mode .org-user .name { color: oklch(0.94 0.010 70); }
.private-mode .org-user .plan { color: oklch(0.66 0.012 70); }
.private-mode .org-user-gear { color: oklch(0.66 0.012 70); }
.private-mode .org-user-gear:hover { color: oklch(0.92 0.010 70); }

/* --- Zone principale privée (colonne flex) --- */
.org-private-main { display: flex; flex-direction: column; height: 100%; overflow: hidden; }

.private-mode .org-top { border-bottom-color: oklch(0.34 0.014 58); }
.org-top--private { border-bottom: none; padding-top: 12px; }
.private-mode .org-top .title { color: oklch(0.95 0.010 70); }
.private-mode .org-top .meta { color: oklch(0.66 0.012 70); }
.private-mode .org-pill.bleu {
  background: oklch(0.34 0.06 256 / 0.5); color: oklch(0.88 0.06 256); border-color: oklch(0.50 0.10 256);
}

/* --- Banner de confidentialité (P4-A6) — <details> natif, accessible --- */
.org-private-banner {
  margin: 18px 36px 0; padding: 12px 18px;
  background: oklch(0.30 0.06 256 / 0.5); border: 1px solid oklch(0.50 0.10 256);
  border-radius: var(--radius); color: oklch(0.90 0.04 256); font-size: 13px;
  flex-shrink: 0;
}
.org-private-banner > summary {
  display: flex; align-items: center; gap: 12px;
  list-style: none; cursor: pointer; line-height: 1.4;
}
.org-private-banner > summary::-webkit-details-marker { display: none; }
.org-private-banner .ic { color: oklch(0.78 0.10 256); flex-shrink: 0; }
.org-private-banner b { font-weight: 600; }
.org-private-banner .more {
  margin-left: auto; font-size: 12px; opacity: 0.85;
  display: inline-flex; align-items: center; gap: 4px; white-space: nowrap;
}
.org-private-banner[open] .more { opacity: 1; }
.org-private-banner .more svg { transition: transform 140ms; }
.org-private-banner[open] .more svg { transform: rotate(90deg); }
.org-private-more {
  margin: 12px 0 2px; padding: 4px 0 0 44px;
  font-size: 12.5px; color: oklch(0.86 0.03 256); line-height: 1.5;
}
.org-private-more li { margin-bottom: 6px; }
.org-private-more li:last-child { margin-bottom: 0; }

/* --- Fil de discussion privé : scroll + colonne centrée --- */
.org-private-scroll { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
/* La refonte UX03 a retiré l'ancien `.chat-messages` partagé : on restaure la zone
   scrollable sur le conteneur des messages privés. Le wrapper .org-private-scroll est
   overflow:hidden ; c'est .chat-messages.org-private-conv (cible data-chat-target="messages")
   qui défile, et son display:flex/column active l'align-items+gap ci-dessous. */
.org-private-conv { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; }
.private-mode .chat-messages.org-private-conv {
  align-items: center; padding: 22px 32px; gap: 14px; scrollbar-width: thin;
}
.private-mode .org-private-conv .chat-message { width: 100%; max-width: 720px; }
/* Le monogramme « L » de l'assistant (::before introduit par UX03) thémé pour le fond sombre. */
.private-mode .org-private-conv .chat-message--assistant::before {
  background: oklch(0.34 0.016 58); border-color: oklch(0.42 0.014 58); color: oklch(0.92 0.010 70);
}
.private-mode .org-private-conv .chat-messages-empty {
  color: oklch(0.66 0.012 70); font-family: "Newsreader", serif; font-style: italic;
  font-size: 14px; line-height: 1.6; max-width: 100%;
}
.private-mode .org-private-conv .chat-message-bubble { border-radius: var(--radius); max-width: 100%; }
.private-mode .org-private-conv .chat-message--user .chat-message-bubble {
  background: oklch(0.42 0.08 256); color: oklch(0.96 0.02 256);
}
.private-mode .org-private-conv .chat-message--assistant .chat-message-bubble {
  background: oklch(0.30 0.014 58); color: oklch(0.92 0.010 70); border: 1px solid oklch(0.36 0.014 58);
}
.private-mode .org-private-conv .chat-message--error .chat-message-bubble {
  background: oklch(0.32 0.06 20); border-color: oklch(0.50 0.10 20); color: oklch(0.90 0.05 20);
}
.private-mode .org-private-conv .chat-tool-indicator { color: oklch(0.70 0.012 70); }
.private-mode .org-private-conv .chat-system-error {
  background: oklch(0.32 0.06 20); border: 1px solid oklch(0.50 0.10 20); color: oklch(0.90 0.05 20);
}

/* Enrichissements en mode privé/sombre (citations B5 · raisonnement A2 · quota D5).
   Le feedback B6 n'apparaît pas en éphémère (aucun message persisté → pas d'id). */
.private-mode .org-private-conv .chat-reason {
  background: oklch(0.27 0.014 58); border-left-color: oklch(0.40 0.014 58);
}
.private-mode .org-private-conv .chat-reason-toggle { color: oklch(0.74 0.012 70); }
.private-mode .org-private-conv .chat-reason[open] > .chat-reason-toggle { color: oklch(0.90 0.010 70); }
.private-mode .org-private-conv .chat-reason-body { color: oklch(0.80 0.012 70); }
.private-mode .org-private-conv .chat-sources { border-top-color: oklch(0.40 0.014 58); }
.private-mode .org-private-conv .chat-source { color: oklch(0.82 0.012 70); }
.private-mode .org-private-conv .chat-source .label { color: oklch(0.82 0.012 70); }
.private-mode .org-private-conv .chat-quota {
  background: oklch(0.32 0.03 60); border-color: oklch(0.44 0.05 62);
}
.private-mode .org-private-conv .chat-quota-title { color: oklch(0.92 0.03 70); }
.private-mode .org-private-conv .chat-quota-sub { color: oklch(0.80 0.02 70); }

/* --- Composer privé (sombre) --- */
.private-mode .org-composer {
  background: oklch(0.30 0.014 58); border-color: oklch(0.40 0.06 256);
  box-shadow: 0 14px 30px -20px oklch(0.10 0.02 256 / 0.6);
}
.private-mode .org-composer::before { opacity: 0.4; }
.private-mode .org-composer-input { color: oklch(0.86 0.010 70); }
.private-mode .org-composer-input::placeholder { color: oklch(0.62 0.012 70); }
.private-mode .org-model-pill {
  background: oklch(0.34 0.014 58); border-color: oklch(0.42 0.014 58); color: oklch(0.90 0.010 70);
}
.private-mode .org-model-pill .chev { color: oklch(0.66 0.012 70); }
.private-mode .org-effort-pill { border-color: oklch(0.40 0.014 58); color: oklch(0.74 0.012 70); }
.private-mode .org-attach, .private-mode .org-mic { border-color: oklch(0.40 0.014 58); color: oklch(0.74 0.012 70); }
.private-mode .org-attach:hover, .private-mode .org-mic:hover { background: oklch(0.34 0.014 58); }

/* Bouton Stop (apparait pendant le streaming, piloté par chat_controller.js) */
.org-stop {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 13px; border-radius: 999px; font-size: 12px; font-weight: 500;
  font-family: inherit; cursor: pointer; white-space: nowrap;
  background: oklch(0.34 0.06 20 / 0.5); color: oklch(0.90 0.05 20); border: 1px solid oklch(0.52 0.10 20);
}
.org-stop:hover { background: oklch(0.40 0.07 20 / 0.6); }
.org-stop.hidden { display: none; }
.org-stop-glyph { width: 9px; height: 9px; border-radius: 2px; background: currentColor; display: inline-block; }

/* Indicateur de réflexion (privé) */
.org-private-thinking { justify-content: center; margin-bottom: 8px; color: oklch(0.70 0.012 70); }
.private-mode .chat-thinking-dot { background: oklch(0.62 0.06 256); }

/* Réassurance en thème privé */
.private-mode .org-reassure { color: oklch(0.62 0.012 70); }
.private-mode .org-reassure .sep { color: oklch(0.62 0.08 256); }
.private-mode .org-reassure .item .ic { color: oklch(0.74 0.08 256); }

/* Responsive privé */
@media (max-width: 720px) {
  /* Empêche le contenu large (texte banner/état vide) de faire déborder la piste grille
     (1fr = minmax(auto,1fr) → blowout). minmax(0,1fr) autorise la piste à descendre sous
     la taille min-content du contenu. */
  .chat-shell.private-mode { grid-template-columns: minmax(0, 1fr); }
  .org-private-main { overflow-x: hidden; }
  .org-private-banner { margin: 14px 16px 0; padding: 11px 14px; }
  .org-private-banner > summary { flex-wrap: wrap; row-gap: 6px; }
  .org-private-banner > summary > span:not(.more) { flex: 1 1 100%; min-width: 0; }
  .org-private-banner .more { margin-left: 0; }
  .org-private-more { padding-left: 28px; }
  .org-top--private { padding-left: 16px; padding-right: 16px; }
  .org-top--private .title { white-space: normal; }
  .private-mode .org-bottom { padding-left: 16px; padding-right: 16px; }
  .private-mode .org-reassure { flex-wrap: wrap; row-gap: 4px; }
  .private-mode .chat-messages.org-private-conv { padding: 16px; }
}

/* ================================================================
   Abonnement / Plans (UX13)
   ================================================================ */
.org-plan-tabs {
  display: inline-flex; border: 1px solid var(--line); border-radius: 14px;
  overflow: hidden; background: var(--surface); box-shadow: var(--shadow-sm);
  margin-bottom: 20px;
}
.org-plan-tabs .t {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 20px; font-size: 13px; font-weight: 500; color: var(--soft);
  border-right: 1px solid var(--line); cursor: pointer; white-space: nowrap;
  transition: background 120ms; background: none; border-top: none; border-bottom: none; border-left: none;
}
.org-plan-tabs .t:last-child { border-right: none; }
.org-plan-tabs .t svg { color: var(--mute); }
.org-plan-tabs .t:hover { background: var(--surface-2); }
.org-plan-tabs .t.on { background: var(--ink); color: oklch(0.96 0.012 72); }
.org-plan-tabs .t.on svg { color: oklch(0.80 0.10 256); }

.org-plan-context {
  display: flex; align-items: center; gap: 8px;
  font-family: "JetBrains Mono", monospace; font-size: 10.5px; letter-spacing: 0.04em;
  color: var(--soft); margin-bottom: 14px;
}
.org-plan-context svg { color: var(--brique); }
.org-plan-context.team svg { color: var(--laiton); }

.org-plan-section { margin-bottom: 18px; }
.org-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

.org-plan-card {
  position: relative; border: 1px solid var(--line); border-radius: var(--radius-lg);
  background: var(--surface); box-shadow: var(--shadow-sm);
  padding: 18px 20px; display: flex; flex-direction: column;
}
.org-plan-card.current {
  border-color: var(--brique);
  box-shadow: var(--shadow-sm), 0 0 0 3px oklch(0.49 0.145 256 / 0.10);
}
.org-plan-card.team { background: var(--bg-2); }
.org-plan-card.fft-mega { --fc: var(--acc-sauge); --fc-s: var(--acc-sauge-s); }
.org-plan-card.fft-giga { --fc: var(--acc-bleu); --fc-s: var(--acc-bleu-s); }
.org-plan-card.fft-peta { --fc: var(--acc-prune); --fc-s: var(--acc-prune-s); }
.org-plan-card .tier-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: var(--fc, var(--brique)); margin-right: 8px; vertical-align: middle;
}
.org-plan-card .cur-tag {
  position: absolute; top: 14px; right: 16px;
  font-family: "JetBrains Mono", monospace; font-size: 9px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--brique);
  background: var(--brique-soft); border: 1px solid oklch(0.86 0.060 256);
  padding: 2px 7px; border-radius: 999px;
}
.org-plan-card .pn { font-family: "Newsreader", serif; font-style: italic; font-size: 22px; color: var(--ink); letter-spacing: -0.01em; }
.org-plan-card .pp { font-family: "Newsreader", serif; font-size: 30px; color: var(--ink); margin: 6px 0 2px; letter-spacing: -0.01em; }
.org-plan-card .pp .per { font-family: "Albert Sans", sans-serif; font-size: 13px; color: var(--mute); }
.org-plan-card .pnote { font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); letter-spacing: 0.03em; margin-bottom: 13px; }
.org-plan-card .pfeats { display: flex; flex-direction: column; gap: 8px; font-size: 12.5px; color: var(--ink-2); flex: 1; }
.org-plan-card .pfeats .f { display: flex; gap: 8px; align-items: flex-start; line-height: 1.4; }
.org-plan-card .pfeats .f svg { color: var(--brique); flex-shrink: 0; margin-top: 2px; }
.org-plan-card.team .pfeats .f svg { color: var(--laiton); }
.org-plan-card .pcta { margin-top: 16px; }

.org-plan-foot {
  display: flex; align-items: center; gap: 12px; margin-top: 4px;
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); letter-spacing: 0.04em;
}
.org-plan-foot .sep { color: var(--laiton); }
.org-plan-foot .plan-foot-sparkle { color: var(--laiton); vertical-align: -2px; }
.org-plan-empty { font-size: 13.5px; color: var(--soft); padding: 20px 0; }

.team-billing-grid { display: grid; grid-template-columns: 1fr 260px; gap: 18px; align-items: start; margin-top: 16px; }
.team-billing-aside { display: flex; flex-direction: column; gap: 14px; }
.team-bundle-list { display: flex; flex-direction: column; gap: 8px; }
.bundle-line { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--soft); }

.fft-mega { --fc: var(--acc-sauge); --fc-s: var(--acc-sauge-s); }
.fft-giga { --fc: var(--acc-bleu); --fc-s: var(--acc-bleu-s); }
.fft-peta { --fc: var(--acc-prune); --fc-s: var(--acc-prune-s); }
.fft-tag {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid color-mix(in oklch, var(--fc, var(--line)) 30%, var(--line));
  background: var(--fc-s, var(--surface)); border-radius: 999px; padding: 4px 8px 4px 9px; white-space: nowrap;
}
.fft-tag .dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--fc, var(--mute));
  flex-shrink: 0; box-shadow: 0 0 0 2px color-mix(in oklch, var(--fc, var(--mute)) 22%, white);
}
.fft-tag .nm { font-size: 12px; font-weight: 600; color: color-mix(in oklch, var(--fc, var(--soft)) 70%, black); }
.fft-tag.ghost { background: var(--surface); border-style: dashed; border-color: var(--line); }
.fft-tag.ghost .nm { color: var(--soft); font-weight: 500; }

.team-paywall {
  display: flex; align-items: center; gap: 16px; padding: 16px 18px; border-radius: var(--radius);
  background: linear-gradient(180deg, var(--surface), oklch(0.975 0.020 256));
  border: 1px solid oklch(0.84 0.06 256); box-shadow: var(--shadow-sm);
}
.team-paywall .seal {
  width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  background: var(--brique-soft); color: var(--brique);
}
.team-paywall .pw-copy { flex: 1; min-width: 0; }
.team-paywall .pw-ttl { font-family: "Newsreader", serif; font-style: italic; font-size: 19px; color: var(--ink); line-height: 1.15; }
.team-paywall .pw-sub { font-size: 12.5px; color: var(--ink-2); margin-top: 4px; line-height: 1.45; text-wrap: pretty; }

.team-bill { display: flex; flex-direction: column; }
.team-bill .tb-h {
  font-family: "JetBrains Mono", monospace; font-size: 9px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--mute); margin-bottom: 12px;
}
.team-bill .br { display: flex; align-items: center; gap: 9px; padding: 7px 0; border-bottom: 1px dashed var(--line-2); }
.team-bill .br .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--fc); flex-shrink: 0; }
.team-bill .br .lbl { flex: 1; font-size: 12.5px; color: var(--ink-2); }
.team-bill .br .lbl b { color: var(--ink); font-weight: 600; }
.team-bill .br .amt { font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--soft); }
.team-bill .tb-total { display: flex; align-items: baseline; justify-content: space-between; margin-top: 13px; }
.team-bill .tb-total .k { font-size: 13px; font-weight: 600; color: var(--ink); }
.team-bill .tb-total .k .per { font-family: "JetBrains Mono", monospace; font-size: 9.5px; font-weight: 400; color: var(--mute); display: block; margin-top: 2px; }
.team-bill .tb-total .v { font-family: "Newsreader", serif; font-size: 30px; color: var(--ink); letter-spacing: -0.01em; }
.team-bill .tb-total .v .cur { font-size: 18px; }
.team-bill .tb-note { font-family: "JetBrains Mono", monospace; font-size: 9px; color: var(--mute); margin-top: 12px; line-height: 1.5; display: flex; align-items: flex-start; gap: 6px; }
.team-bill .tb-note .ic { color: var(--sauge); flex-shrink: 0; margin-top: 1px; }
.team-bill-empty { font-size: 12.5px; color: var(--mute); padding: 14px 0; text-align: center; font-style: italic; font-family: "Newsreader", serif; }

/* Usage & Abonnement équipe — AdminBilling v0.6.0 (#370) */
.team-billing-admin {
  width: 100%;
  max-width: 1100px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.team-billing-note {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: oklch(0.975 0.010 40);
  color: var(--ink-2);
  font-size: 13.5px;
  line-height: 1.5;
}
.team-billing-note span { min-width: 0; overflow-wrap: anywhere; }
.team-billing-note svg { color: var(--acc-ink); flex-shrink: 0; margin-top: 2px; }
.team-billing-note strong { color: var(--ink); }
.team-billing-summary-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.92fr);
  gap: 16px;
  align-items: start;
}
.team-billing-summary-card { padding: 16px; }
.team-credit-head {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border-bottom: 1px solid var(--line-2);
}
.team-credit-head > div:first-child { flex: 1; min-width: 0; }
.team-credit-kicker {
  font-family: "JetBrains Mono", monospace;
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
}
.team-credit-balance {
  font-family: "Newsreader", serif;
  font-size: 30px;
  line-height: 1.1;
  color: var(--ink);
  margin-top: 4px;
}
.subtle-meta { color: var(--mute); font-size: 11.5px; margin-top: 3px; }
.subtle-meta b { color: var(--ink-2); }
.team-credit-body { padding: 0; }
.billing-row-line {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px dashed var(--line-2);
}
.billing-row-line:last-child { border-bottom: none; }
.billing-row-icon {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface-2);
  color: var(--acc);
  flex-shrink: 0;
}
.billing-row-copy { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.billing-row-copy .a,
.billing-row-copy .b { overflow-wrap: anywhere; }
.billing-row-copy .a { font-size: 13px; font-weight: 650; color: var(--ink); }
.billing-row-copy .b { font-size: 11.8px; color: var(--mute); line-height: 1.45; }
.billing-switch {
  width: 42px;
  height: 24px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--line-2);
  padding: 2px;
  cursor: pointer;
  flex-shrink: 0;
}
.billing-switch .knob {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--surface);
  box-shadow: 0 1px 3px oklch(0.25 0.02 58 / 0.16);
  transition: transform 120ms;
}
.billing-switch.on { background: var(--brique); border-color: var(--brique); }
.billing-switch.on .knob { transform: translateX(18px); }
.billing-modal-form {
  padding: 16px 22px 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.billing-preset-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.unit-field {
  display: flex;
  align-items: stretch;
  gap: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  background: var(--surface-2);
}
.unit-field .org-input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.unit-field .org-input:focus {
  outline: none;
  box-shadow: none;
  background: var(--surface);
}
.unit-field:focus-within {
  border-color: var(--acc, var(--brique));
  box-shadow: 0 0 0 3px var(--acc-s, var(--brique-soft));
}
.unit-field .unit {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  padding: 0 13px;
  border-left: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--mute);
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  white-space: nowrap;
}
.field-hint {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  color: var(--mute);
  font-size: 11.5px;
  line-height: 1.45;
}
.field-hint svg { color: var(--acc); flex-shrink: 0; margin-top: 1px; }
.billing-inline-switch {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 620;
}
.team-budget-card { overflow: hidden; }
.team-budget-table-wrap { overflow-x: auto; }
.team-budget-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}
.team-budget-table th {
  text-align: left;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-2);
  font-family: "JetBrains Mono", monospace;
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mute);
  white-space: nowrap;
}
.team-budget-table td {
  padding: 13px 14px;
  border-bottom: 1px dashed var(--line-2);
  vertical-align: middle;
}
.team-budget-table tbody tr:last-child td { border-bottom: none; }
.team-member-cell { display: flex; align-items: center; gap: 10px; min-width: 230px; }
.team-member-id { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.team-member-id .nm {
  font-size: 13.5px;
  font-weight: 650;
  color: var(--ink);
  white-space: nowrap;
}
.team-member-id .ml {
  font-size: 11.5px;
  color: var(--mute);
  white-space: nowrap;
}
.team-edit-chip,
.budget-cell {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--ink-2);
  font: inherit;
  cursor: pointer;
}
.team-table-modal-host { display: inline-flex; align-items: center; }
.team-edit-chip svg,
.budget-cell svg { color: var(--mute); flex-shrink: 0; }
.team-edit-chip:hover svg,
.budget-cell:hover svg { color: var(--acc); }
.budget-cell {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 9px;
  background: var(--surface-2);
  font-size: 12px;
  white-space: nowrap;
}
.budget-cell b { color: var(--ink); }
.budget-readonly { font-size: 12px; color: var(--soft); white-space: nowrap; }
.keys-cell {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--ink-2);
}
.keys-cell svg { color: var(--acc); }
.muted-dash {
  color: var(--mute);
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
}
.team-budget-action { text-align: right; width: 52px; }

.org-dedie-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.org-dedie-card {
  border: 1px solid var(--line); border-radius: var(--radius-xl);
  background: var(--surface); box-shadow: var(--shadow); padding: 28px 30px;
  display: flex; flex-direction: column;
}
.org-dedie-card.accent { background: var(--brique-soft); border-color: oklch(0.86 0.060 256); }
.org-dedie-card.dark { background: var(--ink); color: oklch(0.92 0.012 72); border-color: var(--ink); }
.org-dedie-card .dn { font-family: "Newsreader", serif; font-style: italic; font-size: 27px; color: var(--ink); letter-spacing: -0.01em; }
.org-dedie-card.dark .dn { color: oklch(0.96 0.012 72); }
.org-dedie-card .dp { font-family: "Newsreader", serif; font-size: 32px; color: var(--ink); margin: 8px 0 2px; letter-spacing: -0.01em; }
.org-dedie-card.dark .dp { color: oklch(0.96 0.012 72); }
.org-dedie-card .dp .per { font-family: "Albert Sans", sans-serif; font-size: 14px; color: var(--mute); }
.org-dedie-card .dnote { font-family: "JetBrains Mono", monospace; font-size: 10.5px; color: var(--mute); letter-spacing: 0.03em; margin-bottom: 18px; }
.org-dedie-card.dark .dnote { color: oklch(0.74 0.04 70); }
.org-dedie-card .dfeats { display: flex; flex-direction: column; gap: 10px; font-size: 13px; color: var(--ink-2); flex: 1; }
.org-dedie-card.dark .dfeats { color: oklch(0.85 0.012 72); }
.org-dedie-card .dfeats .f { display: flex; gap: 9px; align-items: flex-start; line-height: 1.4; }
.org-dedie-card .dfeats .f svg { color: var(--brique); flex-shrink: 0; margin-top: 2px; }
.org-dedie-card.dark .dfeats .f svg { color: oklch(0.80 0.10 256); }
.org-dedie-card .dcta { margin-top: 22px; }

@media (max-width: 900px) {
  .org-plan-grid { grid-template-columns: 1fr; }
  .org-dedie-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .org-settings-page { grid-template-columns: minmax(0, 1fr); }
  .org-set-nav { display: none; }
  .org-plan-tabs { display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ── Inférence (P5-A4, issue #117) ──────────────────────────── */
.org-pill.sm   { padding: 2px 8px; font-size: 10.5px; gap: 4px; }
.org-pill.rouge { background: oklch(0.95 0.025 28); color: oklch(0.42 0.14 28); border-color: oklch(0.86 0.060 28); }

.inference-head-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }

.inference-empty {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 32px 20px; border: 1px dashed var(--line); border-radius: var(--radius-xl);
  color: var(--mute); font-size: 13px; text-align: center; margin-bottom: 24px;
}
.inference-empty p { margin: 0; line-height: 1.5; }

.inference-catalogue {
  border: 1px solid var(--line); border-radius: var(--radius-xl);
  background: var(--surface); overflow: hidden; margin-bottom: 24px;
  box-shadow: var(--shadow-sm);
}
.inference-model-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 18px; border-bottom: 1px solid var(--line-2);
}
.inference-model-row:last-child { border-bottom: none; }
.inference-model-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.inference-model-name { font-size: 13.5px; font-weight: 500; color: var(--ink); }
.inference-model-code {
  font-family: "JetBrains Mono", monospace; font-size: 10.5px;
  color: var(--soft); letter-spacing: 0.02em;
}
.inference-model-meta { font-size: 11.5px; color: var(--mute); }
.inference-model-badges { display: flex; gap: 5px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }

.inference-credentials {
  border: 1px solid var(--line); border-radius: var(--radius-xl);
  background: var(--surface); overflow: hidden; margin-bottom: 24px;
  box-shadow: var(--shadow-sm);
}
.inference-cred-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 14px 18px; border-bottom: 1px solid var(--line-2);
}
.inference-cred-row:last-child { border-bottom: none; }
.inference-cred-row.disabled { opacity: 0.6; }
.inference-cred-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.inference-cred-label { font-size: 13.5px; font-weight: 500; color: var(--ink); }
.inference-cred-meta {
  font-family: "JetBrains Mono", monospace; font-size: 10.5px;
  color: var(--soft); letter-spacing: 0.02em;
}
.inference-cred-url {
  font-size: 10px; color: var(--mute);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px; display: inline-block;
  vertical-align: bottom;
}
.inference-cred-actions {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end;
}
.inference-label-form { display: flex; align-items: center; gap: 6px; }
.inference-label-form .org-input.sm { padding: 5px 9px; font-size: 12px; height: auto; width: 150px; }

.inference-add-card {
  border: 1px solid var(--line); border-radius: var(--radius-xl);
  background: var(--surface); box-shadow: var(--shadow-sm);
  padding: 22px 24px; margin-bottom: 24px;
}
.inference-form-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 18px;
}
.inference-form-actions { display: flex; justify-content: flex-end; }
.org-field-hint { font-size: 11.5px; color: var(--mute); margin: 4px 0 0; }

@media (max-width: 700px) {
  .inference-form-grid { grid-template-columns: 1fr; }
  .inference-cred-row { flex-direction: column; align-items: flex-start; }
  .inference-model-row { flex-direction: column; align-items: flex-start; }
  .inference-model-badges { justify-content: flex-start; }
}

/* =========================================================
   Outils & MCP — écrans v4 organique (#124)
   ========================================================= */
.tooling-head-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.tooling-empty {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 32px 20px; color: var(--soft); font-size: 13px; text-align: center;
  border: 1px dashed var(--line-2); border-radius: var(--radius); margin-bottom: 12px;
}
.tooling-empty p { margin: 0; line-height: 1.5; }
.tooling-connections { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; margin-bottom: 12px; }
.tooling-conn-row {
  display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 14px;
  padding: 12px 16px; border-bottom: 1px solid var(--line-2); background: var(--surface);
}
.tooling-conn-row:last-child { border-bottom: none; }
.tooling-conn-row.disabled { opacity: 0.6; }
.tooling-conn-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tooling-conn-name { display: flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 500; color: var(--ink); }
.tooling-conn-meta { font-size: 11.5px; color: var(--mute); font-family: JetBrains Mono, monospace; }
.tooling-conn-badges { flex-shrink: 0; }
.tooling-conn-actions { display: flex; gap: 6px; flex-shrink: 0; }
.tooling-add-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; margin-bottom: 12px; }
.tooling-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; margin-bottom: 14px; }
.tooling-form-actions { display: flex; justify-content: flex-end; }
.tooling-catalog { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; margin-bottom: 12px; }
.tooling-catalog-head {
  display: grid; grid-template-columns: 1.5fr 0.9fr 1fr auto; gap: 12px;
  padding: 8px 16px; font-size: 11.5px; font-weight: 600; color: var(--soft);
  background: var(--bg-2); border-bottom: 1px solid var(--line);
  text-transform: uppercase; letter-spacing: 0.04em;
}
.tooling-catalog-row {
  display: grid; grid-template-columns: 1.5fr 0.9fr 1fr auto; align-items: center;
  gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--line-2);
  background: var(--surface);
}
.tooling-catalog-row:last-child { border-bottom: none; }
.tooling-catalog-row.disabled { opacity: 0.6; }
.tooling-tool-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tooling-tool-name { font-size: 13px; font-weight: 500; color: var(--ink); }
.tooling-tool-key { font-size: 11px; font-family: JetBrains Mono, monospace; color: var(--mute); background: none; padding: 0; }
.tooling-tool-source { font-size: 11px; color: var(--soft); }
.tooling-tool-actions { display: flex; justify-content: flex-end; }
.tooling-governance-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
  margin-bottom: 12px;
}
.tooling-budget-list,
.tooling-rule-list { display: flex; flex-direction: column; gap: 11px; }
.tooling-budget .top,
.tooling-rule {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.tooling-budget .k,
.tooling-rule span:first-child { font-size: 12.5px; color: var(--ink-2); }
.tooling-budget .v { font-size: 12px; color: var(--soft); white-space: nowrap; }
.tooling-audit {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  overflow: hidden;
  margin-bottom: 12px;
}
.tooling-audit-row {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--line-2);
}
.tooling-audit-row:last-child { border-bottom: none; }
.tooling-audit-row .time { font-size: 11.5px; color: var(--soft); font-family: JetBrains Mono, monospace; }
.tooling-audit-row .ev { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 0; }
.tooling-audit-row code {
  font-size: 12px;
  font-family: JetBrains Mono, monospace;
  color: var(--ink);
  background: none;
  padding: 0;
}
.tooling-audit-row .sub { font-size: 11.5px; color: var(--soft); }
@media (max-width: 680px) {
  .tooling-form-grid { grid-template-columns: 1fr; }
  .tooling-conn-row { grid-template-columns: 1fr auto; }
  .tooling-catalog-head, .tooling-catalog-row { grid-template-columns: 1fr auto; }
  .tooling-governance-grid { grid-template-columns: 1fr; }
  .tooling-audit-row { grid-template-columns: 1fr; align-items: flex-start; }
}

/* =========================================================
   Sécurité 2FA — écrans v4 organique (#143)
   Vocabulaire vendoré depuis docs/design/.../organic-extra.css.
   ========================================================= */
@keyframes st-blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }

/* Cartes "réglage" génériques (titre + corps) */
.org-panel {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); padding: 20px 22px;
}
.org-panel .ph { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.org-panel .ph .ic2 {
  width: 38px; height: 38px; border-radius: 11px;
  background: var(--brique-soft); border: 1px solid oklch(0.88 0.05 256); color: var(--brique);
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.org-panel .ph .ic2.laiton {
  background: var(--laiton-soft); border-color: var(--laiton-2); color: oklch(0.50 0.09 60);
}
.org-panel .ph .t { font-size: 15px; font-weight: 600; color: var(--ink); }
.org-panel .ph .s { font-size: 12.5px; color: var(--soft); margin-top: 2px; }
.org-panel .ph .org-pill, .org-panel .ph .org-status { margin-left: auto; }

.org-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.org-grid-2.wide { grid-template-columns: 1.3fr 1fr; }

/* Statuts (puce + pastille) */
.org-status { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 500; color: var(--ink-2); white-space: nowrap; }
.org-status .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.org-status.ok    .dot { background: var(--sauge); box-shadow: 0 0 0 3px oklch(0.56 0.045 165 / 0.16); }
.org-status.ok    { color: oklch(0.42 0.06 165); }
.org-status.muted .dot { background: var(--whisper); }
.org-status.err   .dot { background: oklch(0.60 0.18 28); }
.org-status.err   { color: oklch(0.45 0.15 28); }

/* Pastilles d'état (vert / rouge) */
.org-pill.green { background: oklch(0.94 0.04 165); color: oklch(0.40 0.06 165); border-color: oklch(0.84 0.05 165); }
.org-pill.red   { background: oklch(0.96 0.035 28); color: oklch(0.50 0.15 28); border-color: oklch(0.84 0.08 28); }

/* Bandeaux (info / danger / succès) */
.org-banner { display: flex; align-items: flex-start; gap: 13px; padding: 14px 18px; border-radius: var(--radius); font-size: 13px; line-height: 1.5; }
.org-banner .ic { flex-shrink: 0; margin-top: 1px; }
.org-banner .t { font-weight: 600; }
.org-banner .s { margin-top: 3px; }
.org-banner.info   { background: var(--brique-soft); border: 1px solid oklch(0.86 0.060 256); color: oklch(0.36 0.10 256); }
.org-banner.info .ic { color: var(--brique); }
.org-banner.warn   { background: var(--laiton-soft); border: 1px solid var(--laiton-2); color: oklch(0.42 0.07 60); }
.org-banner.warn .ic { color: oklch(0.55 0.09 60); }
.org-banner.danger { background: oklch(0.96 0.030 28); border: 1px solid oklch(0.82 0.08 28); color: oklch(0.44 0.13 28); }
.org-banner.danger .ic { color: oklch(0.55 0.16 28); }

/* Listes / lignes mid-fi */
.org-list { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); overflow: hidden; }
.org-row { display: grid; align-items: center; gap: 14px; padding: 13px 18px; border-bottom: 1px solid var(--line-2); }
.org-row:last-child { border-bottom: none; }
.org-row:hover { background: var(--surface-2); }
.org-row .primary { font-size: 13.5px; font-weight: 600; color: var(--ink); display: flex; align-items: center; gap: 10px; }
.org-row .sub { font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); margin-top: 3px; letter-spacing: 0.02em; font-weight: 400; }
.org-row .actions { display: flex; gap: 6px; justify-content: flex-end; }

.org-ic-circle {
  width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--surface-2); border: 1px solid var(--line); color: var(--soft);
}
.org-ic-circle.bleu { background: var(--brique-soft); border-color: oklch(0.88 0.05 256); color: var(--brique); }
.org-ic-circle.laiton { background: var(--laiton-soft); border-color: var(--laiton-2); color: oklch(0.50 0.09 60); }

/* QR / TOTP setup */
.org-totp { display: grid; grid-template-columns: auto 1fr; gap: 28px; align-items: start; }
.org-totp-steps { display: flex; flex-direction: column; gap: 14px; }
.org-totp-step { display: flex; gap: 12px; align-items: flex-start; }
.org-totp-step .n {
  width: 22px; height: 22px; border-radius: 50%; background: var(--ink); color: var(--bg);
  font-family: "JetBrains Mono", monospace; font-size: 11px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.org-totp-step .tx { font-size: 13.5px; color: var(--ink-2); line-height: 1.5; }
.org-totp-step .tx b { color: var(--ink); }

.org-secret-key {
  font-family: "JetBrains Mono", monospace; font-size: 13px; letter-spacing: 0.18em; color: var(--ink);
  background: var(--surface-2); border: 1px solid var(--line); border-radius: 9px; padding: 9px 13px;
  display: inline-flex; align-items: center; gap: 10px; margin-top: 8px; overflow-wrap: anywhere;
}

/* Codes de récupération */
.org-codes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 22px; }
.org-codes .c {
  font-family: "JetBrains Mono", monospace; font-size: 13.5px; color: var(--ink); letter-spacing: 0.06em;
  padding: 9px 12px; background: var(--bg-2); border: 1px solid var(--line-2); border-radius: 9px;
  display: flex; align-items: center; gap: 10px;
}
.org-codes .c .i { font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); }
.org-codes .c.used { color: var(--whisper); text-decoration: line-through; }

.org-onetime {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: oklch(0.50 0.09 60);
  letter-spacing: 0.04em; margin-top: 10px;
}

/* Écrans Sécurité — agencement spécifique */
.sec-grid { align-items: start; margin-bottom: 16px; }
.org-panel .sec-panel-text,
.sec-panel-text { font-size: 13px; color: var(--soft); line-height: 1.55; margin: 0; }
.sec-muted { color: var(--mute); }
.sec-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 16px; }
.sec-actions form { margin: 0; }

.sec-passkeys-head { margin: 24px 0 10px; align-items: center; }
.sec-empty-passkeys { padding: 4px 0 0; }
.sec-passkey-add { margin-top: 12px; }
.sec-passkey-add .account-inline-action { display: flex; gap: 10px; align-items: center; margin-top: 8px; }
.sec-passkey-add .account-inline-action .org-input { flex: 1; min-width: 0; }
.sec-webauthn-status { font-size: 12px; color: var(--soft); margin: 10px 0 0; min-height: 1em; }

/* Setup TOTP */
.sec-totp-panel { max-width: 720px; }
.sec-qr-frame {
  width: 188px; height: 188px; border-radius: 14px; padding: 12px;
  background: oklch(0.99 0.004 250); border: 1px solid var(--line); box-shadow: var(--shadow-sm);
  display: inline-flex; align-items: center; justify-content: center;
}
.sec-qr-frame img { width: 100%; height: 100%; display: block; }
.sec-totp-form { margin-top: 24px; border-top: 1px solid var(--line-2); padding-top: 20px; }
.sec-totp-confirm { display: flex; gap: 12px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.sec-code-input { width: 180px; letter-spacing: 0.2em; font-size: 1.1rem; text-align: center; font-family: "JetBrains Mono", monospace; }

/* Codes de récupération — écran dédié */
.sec-recovery-panel { max-width: 640px; }
.sec-recovery-banner { margin-bottom: 18px; }
.sec-recovery-codes { margin-bottom: 4px; }

/* Challenge 2FA (layout auth) */
.auth-2fa-lede { font-size: 13px; color: var(--soft); line-height: 1.5; margin: 0 0 18px; text-align: center; }
.auth-2fa-lede strong { color: var(--ink); font-weight: 600; }
.auth-2fa-banner { margin-bottom: 18px; text-align: left; }

@media (max-width: 720px) {
  .org-grid-2, .org-grid-2.wide { grid-template-columns: 1fr; }
  .org-codes { grid-template-columns: 1fr; }
  .org-totp { grid-template-columns: 1fr; gap: 18px; }
  .sec-qr-frame { margin: 0 auto; }
  .sec-code-input { width: 100%; }
  .sec-totp-confirm .org-btn { width: 100%; justify-content: center; }
}

/* ================================================================
   Écran Développeurs / Jetons d'API — vocabulaire organique
   Adapté de docs/design/chat-lesur-ai/project/organic-extra.css.
   ================================================================ */

/* Tête de colonne de liste */
.org-list-head {
  background: var(--bg-2); border-bottom: 1px solid var(--line-2);
  font-family: "JetBrains Mono", monospace; font-size: 9.5px;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--mute); font-weight: 600;
}
.org-list-head, .org-list-head + .org-row {
  display: grid; align-items: center; gap: 14px; padding: 11px 18px;
}

/* Secret one-time */
.org-secret {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px; border-radius: 13px;
  background: oklch(0.24 0.018 58); border: 1px solid oklch(0.36 0.014 58);
}
.org-secret .val {
  flex: 1; font-family: "JetBrains Mono", monospace; font-size: 12.5px;
  color: oklch(0.90 0.04 140); letter-spacing: 0.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.org-secret .cp {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px;
  border-radius: 9px; background: oklch(0.32 0.014 58);
  border: 1px solid oklch(0.42 0.014 58); color: oklch(0.88 0.012 70);
  font-size: 12px; font-weight: 500; cursor: pointer; white-space: nowrap;
}
.org-secret .cp:hover { background: oklch(0.37 0.014 58); }

/* Scope chips */
.org-scope-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px;
  border-radius: 8px; font-family: "JetBrains Mono", monospace; font-size: 10.5px;
  color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line);
  user-select: none;
}
.org-scope-chip.on {
  background: var(--brique-soft); color: oklch(0.40 0.13 256);
  border-color: oklch(0.86 0.060 256);
}

/* Empty state */
.org-empty-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 60px 30px;
  border: 1px dashed var(--line); border-radius: var(--radius-lg); background: var(--bg-2);
  margin-top: 4px;
}
.org-empty-state .glyph {
  width: 60px; height: 60px; border-radius: 18px;
  background: var(--surface); border: 1px solid var(--line);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--soft); box-shadow: var(--shadow-sm); margin-bottom: 16px;
}
.org-empty-state .t { font-family: "Newsreader", serif; font-size: 21px; color: var(--ink); }
.org-empty-state .s { font-size: 13px; color: var(--soft); margin-top: 6px; max-width: 380px; line-height: 1.55; }
.org-empty-state .cta { margin-top: 18px; }

/* Modal centré (réutilise .org-scrim) */
.org-modal {
  width: 460px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-xl); box-shadow: var(--shadow-lg);
  padding: 28px 30px; position: relative;
}
.org-modal.wide { width: min(560px, 94vw); }
.org-modal .mclose {
  position: absolute; top: 18px; right: 18px; width: 30px; height: 30px;
  border-radius: 9px; border: 1px solid var(--line); background: var(--surface);
  color: var(--soft); display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.org-modal .mclose:hover { background: var(--surface-2); }
.org-modal .mtitle { font-family: "Newsreader", serif; font-size: 25px; letter-spacing: -0.02em; color: var(--ink); }
.org-modal .mtitle em { font-style: italic; color: var(--brique); }
.org-modal .msub { font-family: "JetBrains Mono", monospace; font-size: 10.5px; color: var(--mute); margin-top: 5px; letter-spacing: 0.04em; }
.org-modal .mfoot { display: flex; gap: 10px; justify-content: flex-end; margin-top: 24px; }

/* Page-specific layout */
.api-tokens-page { width: 100%; max-width: 900px; min-width: 0; margin: 0 auto; }
.api-tokens-head-row { max-width: 900px; }
.api-tokens-head-copy { min-width: 0; }
.api-tokens-banner { margin-bottom: 16px; max-width: 900px; }
.api-tokens-banner > div { min-width: 0; }
.api-token-endpoint {
  font-family: "JetBrains Mono", monospace;
  font-size: 11.5px;
  margin-top: 4px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.api-tokens-list { max-width: 900px; min-width: 0; }
.api-tokens-list .primary > span:last-child { min-width: 0; }
.api-tokens-list .primary,
.api-tokens-list .sub,
.api-token-scopes,
.api-token-budget,
.api-token-usage { min-width: 0; }
.api-token-scopes { display: flex; gap: 5px; flex-wrap: wrap; }
.api-token-budget { font-size: 12px; color: var(--mute); }
.api-token-budget .budget-main {
  display: block;
  color: var(--ink);
  font-size: 12.5px;
  font-weight: 650;
}
.api-token-team-note { max-width: 900px; margin-top: 16px; }

/* Team member account surfaces */
.team-account-page {
  width: 100%;
  max-width: 760px;
  min-width: 0;
  margin: 0 auto;
}
.team-account-head-row {
  max-width: 760px;
}
.team-member-id {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  margin-bottom: 22px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}
.team-member-id .ws-mono { flex-shrink: 0; }
.team-member-id-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.team-member-name {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--ink);
  font-size: 17px;
  font-weight: 650;
}
.team-member-meta {
  color: var(--soft);
  font-size: 12.5px;
  overflow-wrap: anywhere;
}
.team-account-section + .team-account-section { margin-top: 24px; }
.team-account-card-body {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
}
.team-account-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 13px 16px;
  border-bottom: 1px dashed var(--line-2);
}
.team-account-row:last-child { border-bottom: none; }
.team-account-row .ri {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brique);
  background: var(--brique-soft);
  border: 1px solid oklch(0.86 0.060 256);
  flex-shrink: 0;
}
.team-account-row .ri.danger {
  color: var(--bad);
  background: oklch(0.97 0.018 28);
  border-color: oklch(0.84 0.075 28);
}
.team-account-row .rt {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}
.team-account-row .a {
  color: var(--ink);
  font-size: 13.5px;
  font-weight: 620;
}
.team-account-row .b {
  color: var(--mute);
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.team-account-actions {
  display: flex;
  justify-content: flex-end;
  padding: 2px 16px 14px;
}
.team-row-reset {
  all: unset;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  cursor: pointer;
}
.team-row-reset:focus-visible {
  outline: 2px solid oklch(0.58 0.13 256 / 0.35);
  outline-offset: -2px;
  border-radius: var(--radius-sm);
}
.team-account-row-button { padding: 0; }
.team-row-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--soft);
  font-size: 13px;
  white-space: nowrap;
}
.team-tools-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}
.team-tool-chip {
  cursor: pointer;
}
.team-tool-chip input {
  margin: 0 0 0 1px;
  accent-color: var(--brique);
}
.team-account-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 16px 0 0;
  color: var(--soft);
  font-size: 12.5px;
  line-height: 1.6;
}
.team-account-note.compact {
  margin: 12px 0 0;
  padding: 0;
}
.team-account-note .ic {
  flex-shrink: 0;
  margin-top: 2px;
}
.team-account-note b { color: var(--ink); font-weight: 600; }
.team-model-modal {
  position: relative;
  padding: 6px 20px 0;
}
.team-model-modal .org-model-pill {
  width: 100%;
  justify-content: center;
}

@media (max-width: 720px) {
  .org-modal { padding: 22px 18px; }
  .team-account-page,
  .api-tokens-page { max-width: none; width: 100%; }
  .team-account-head-row,
  .api-tokens-head-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
    max-width: none;
  }
  .team-account-head-row .org-btn,
  .api-tokens-head-row .org-btn { justify-content: center; width: 100%; }
  .api-tokens-head-copy,
  .api-tokens-head-copy .org-card-sub { width: 100%; }
  .api-tokens-head-copy .org-card-sub {
    line-height: 1.45;
    overflow-wrap: anywhere;
  }
  .api-tokens-banner {
    gap: 10px;
    padding: 13px 14px;
    max-width: none;
  }
  .api-tokens-banner .ic { margin-top: 2px; }
  .api-token-endpoint { font-size: 11px; line-height: 1.55; }
  .api-tokens-list {
    border-radius: 14px;
    box-shadow: none;
  }
  .api-tokens-list .org-list-head { display: none; }
  .api-tokens-list .org-row {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: stretch;
    gap: 12px;
    padding: 14px;
  }
  .api-tokens-list .org-row .primary {
    align-items: flex-start;
    gap: 12px;
  }
  .api-tokens-list .org-row .sub {
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  .api-token-scopes,
  .api-token-budget,
  .api-token-usage {
    padding-left: 46px;
  }
  .api-token-scopes::before,
  .api-token-budget::before,
  .api-token-usage::before {
    display: block;
    flex: 0 0 100%;
    margin-bottom: 5px;
    font-family: "JetBrains Mono", monospace;
    font-size: 9.5px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mute);
  }
  .api-token-scopes::before { content: "Portée"; }
  .api-token-budget::before { content: "Budget"; }
  .api-token-usage::before { content: "État"; }
  .api-token-actions {
    justify-content: stretch;
    padding-left: 46px;
  }
  .api-token-actions form,
  .api-token-actions .org-btn {
    width: 100%;
  }
  .api-token-actions .org-btn { justify-content: center; }
  .team-member-id {
    align-items: flex-start;
  }
  .team-account-row {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .team-account-row .org-btn,
  .team-account-row .org-select,
  .team-account-actions .org-btn {
    width: 100%;
    justify-content: center;
  }
  .team-account-actions {
    padding: 2px 16px 16px;
  }
  .team-row-reset {
    align-items: flex-start;
    flex-direction: column;
  }
  .team-tools-grid {
    justify-content: flex-start;
    width: 100%;
  }
}

@media (max-width: 420px) {
  .api-tokens-banner { flex-direction: column; }
  .unit-field {
    gap: 0;
  }
  .unit-field .unit { min-width: 58px; padding: 0 10px; }
  .api-token-scopes,
  .api-token-budget,
  .api-token-usage,
  .api-token-actions { padding-left: 0; }
  .api-tokens-list .org-row .primary { flex-direction: column; }
}

/* ── CHAT SHELL — Sidebar états + projets groupés repliables ─────────────── */

/* Sidebar : zone scrollable (remplace .org-spacer) */
.org-nav {
  flex: 1; min-height: 0; overflow-y: auto;
  display: flex; flex-direction: column; gap: 6px;
  margin: 0 -6px; padding: 0 6px;
}
.org-nav::-webkit-scrollbar { width: 6px; }
.org-nav::-webkit-scrollbar-thumb { background: var(--line); border-radius: 3px; }
.org-nav section { display: flex; flex-direction: column; }

/* compteur de section */
.org-count {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; font-weight: 600;
  color: var(--brique); background: var(--brique-soft);
  border-radius: 999px; padding: 1px 7px; margin-left: 2px;
}
.org-count.attn { color: oklch(0.46 0.085 55); background: var(--laiton-soft); }
.org-count.soft {
  color: var(--soft);
  background: var(--surface-2);
  border: 1px solid var(--line-2);
}

/* État : Attention requise (ambre) */
.org-item--attn { color: var(--ink-2); }
.org-item--attn:hover { background: var(--laiton-soft); }
.org-attn-mark {
  position: relative; width: 8px; height: 8px; flex-shrink: 0;
}
.org-attn-mark::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: var(--laiton); box-shadow: 0 0 0 1px oklch(0.45 0.08 55 / 0.30);
}
.org-attn-mark::after {
  content: ""; position: absolute; inset: -3px; border-radius: 50%;
  border: 1px solid var(--laiton); opacity: 0.5;
  animation: org-attn-pulse 1.9s infinite ease-out;
}
@keyframes org-attn-pulse {
  0% { transform: scale(0.55); opacity: 0.6; }
  70% { transform: scale(1.35); opacity: 0; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .org-attn-mark::after { animation: none; } }
.org-attn-badge {
  font-family: "JetBrains Mono", monospace; font-size: 9px; letter-spacing: 0.02em;
  color: oklch(0.46 0.085 55); background: var(--laiton-soft);
  border: 1px solid oklch(0.86 0.05 84); border-radius: 999px; padding: 1px 7px; flex-shrink: 0;
}

/* Projets : en-tête de section cliquable + bouton créer */
.org-section--proj { gap: 4px; }
.org-section-link {
  display: flex; align-items: center; gap: 8px; flex: 1;
  text-decoration: none; color: inherit; border-radius: 8px; padding: 1px 0;
}
.org-section-link .org-section-label { color: var(--soft); }
.org-section-link .go { color: var(--mute); transition: transform 120ms, color 120ms; }
.org-section-link:hover .org-section-label { color: var(--ink); }
.org-section-link:hover .go { color: var(--brique); transform: translateX(1px); }
.org-section-add {
  width: 22px; height: 22px; border-radius: 7px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--soft); border: 1px solid var(--line); background: var(--surface);
  text-decoration: none;
}
.org-section-add:hover { color: var(--brique); border-color: var(--brique); background: var(--brique-soft); }

/* Projets : groupes repliables avec conversations imbriquées */
.org-group { display: flex; flex-direction: column; }
.org-group-head {
  display: flex; align-items: center; gap: 9px;
  padding: 6px 11px; width: 100%; border-radius: 9px;
  font-size: 12.5px; font-weight: 500; color: var(--ink-2);
  background: transparent; border: none; cursor: pointer; text-align: left;
  font-family: inherit; transition: background 120ms;
}
.org-group-head:hover { background: var(--surface-2); }
.org-group-head .chev { color: var(--mute); display: inline-flex; transition: transform 160ms; flex-shrink: 0; }
.org-group-head.collapsed .chev { transform: rotate(-90deg); }
.org-group-icon { color: var(--mute); display: inline-flex; flex-shrink: 0; }
.org-group-head .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; box-shadow: 0 0 0 1px oklch(0.26 0.022 58 / 0.10); }
.org-group-head .nm { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.org-group-head .ct {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
  background: var(--surface); border: 1px solid var(--line-2); border-radius: 999px;
  padding: 1px 7px; min-width: 20px; text-align: center;
}
.org-group-body {
  display: flex; flex-direction: column; gap: 1px;
  padding: 1px 0 5px; margin-left: 15px; border-left: 1px solid var(--line-2);
}
.org-conv {
  padding: 6px 11px 6px 15px; font-size: 12px; color: var(--soft);
  border-radius: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  text-decoration: none; display: flex; align-items: center; gap: 7px;
  min-width: 0; flex: 1; transition: background 100ms, color 100ms;
}
.org-conv:hover { background: var(--surface-2); color: var(--ink); }
.org-conv.active {
  background: var(--surface); color: var(--ink); font-weight: 500;
  box-shadow: var(--shadow-sm), inset 2px 0 0 var(--brique);
}
.org-conv--empty { color: var(--whisper); cursor: default; pointer-events: none; font-style: italic; }
.org-item--muted { color: var(--whisper); cursor: default; pointer-events: none; }
.org-empty-link {
  display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px;
  font-size: 12.5px; color: var(--brique); text-decoration: none; border-radius: 9px;
}
.org-empty-link:hover { background: var(--brique-soft); }

/* Rail replie (#336/#334): garder les signaux d'etat lisibles quand le shell
   applique une classe de collapse, sans imposer encore le controle de repli. */
.chat-shell.rail-folded,
.chat-shell.is-rail-folded,
.chat-shell[data-rail-collapsed="true"] {
  grid-template-columns: 72px 1fr;
}
.chat-shell.rail-folded .org-aside,
.chat-shell.is-rail-folded .org-aside,
.chat-shell[data-rail-collapsed="true"] .org-aside {
  padding-inline: 12px;
  align-items: stretch;
}
.chat-shell.rail-folded .org-wordmark > div:not(.org-mark),
.chat-shell.rail-folded .org-sb-btn:not(.primary),
.chat-shell.rail-folded .org-section-label,
.chat-shell.rail-folded .org-item-title,
.chat-shell.rail-folded .org-item-time,
.chat-shell.rail-folded .org-attn-badge,
.chat-shell.rail-folded .org-group-head .nm,
.chat-shell.rail-folded .org-group-head .ct,
.chat-shell.rail-folded .org-conv,
.chat-shell.is-rail-folded .org-wordmark > div:not(.org-mark),
.chat-shell.is-rail-folded .org-sb-btn:not(.primary),
.chat-shell.is-rail-folded .org-section-label,
.chat-shell.is-rail-folded .org-item-title,
.chat-shell.is-rail-folded .org-item-time,
.chat-shell.is-rail-folded .org-attn-badge,
.chat-shell.is-rail-folded .org-group-head .nm,
.chat-shell.is-rail-folded .org-group-head .ct,
.chat-shell.is-rail-folded .org-conv,
.chat-shell[data-rail-collapsed="true"] .org-wordmark > div:not(.org-mark),
.chat-shell[data-rail-collapsed="true"] .org-sb-btn:not(.primary),
.chat-shell[data-rail-collapsed="true"] .org-section-label,
.chat-shell[data-rail-collapsed="true"] .org-item-title,
.chat-shell[data-rail-collapsed="true"] .org-item-time,
.chat-shell[data-rail-collapsed="true"] .org-attn-badge,
.chat-shell[data-rail-collapsed="true"] .org-group-head .nm,
.chat-shell[data-rail-collapsed="true"] .org-group-head .ct,
.chat-shell[data-rail-collapsed="true"] .org-conv {
  display: none;
}
.chat-shell.rail-folded .org-item,
.chat-shell.is-rail-folded .org-item,
.chat-shell[data-rail-collapsed="true"] .org-item {
  justify-content: center;
  min-height: 32px;
  padding-inline: 8px;
}
.chat-shell.rail-folded .org-item--attn .org-attn-mark,
.chat-shell.is-rail-folded .org-item--attn .org-attn-mark,
.chat-shell[data-rail-collapsed="true"] .org-item--attn .org-attn-mark,
.chat-shell.rail-folded .org-item.working .org-working-marker,
.chat-shell.is-rail-folded .org-item.working .org-working-marker,
.chat-shell[data-rail-collapsed="true"] .org-item.working .org-working-marker {
  display: inline-flex;
}

/* ── Accueil B : projets en avant (deux colonnes) ───────────────────────── */
.org-home-hub { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 30px; align-items: start; margin-top: 30px; }
.org-hub-head { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; }
.org-hub-head .h { font-family: "Newsreader", serif; font-style: italic; font-size: 19px; color: var(--ink); }
.org-hub-head .rule { flex: 1; height: 1px; background: var(--line-2); }
.org-hub-head .link { font-size: 12.5px; font-weight: 500; color: var(--brique); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.org-hub-head .link:hover { text-decoration: underline; }
.org-hub-col { display: flex; flex-direction: column; gap: 10px; }

.org-pcard {
  display: block; text-decoration: none; color: inherit; position: relative; overflow: hidden;
  background: var(--surface); border: 1px solid var(--line); border-radius: 16px;
  padding: 14px 16px; box-shadow: var(--shadow-sm); transition: all 150ms;
}
.org-pcard:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
.org-pcard .accent {
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--acc, var(--brique));
}
.org-pcard .pc-head { display: flex; align-items: center; gap: 9px; }
.org-pcard .pc-dot {
  width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;
  background: var(--acc, var(--brique));
  box-shadow: 0 0 0 1px oklch(0.26 0.022 58 / 0.10);
}
.org-pcard .pc-name { font-family: "Newsreader", serif; font-size: 17px; letter-spacing: -0.01em; color: var(--ink); line-height: 1.15; flex: 1; }
.org-pcard .pc-ct { font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--soft); white-space: nowrap; }
.org-pcard .pc-desc { font-size: 12.5px; color: var(--soft); line-height: 1.5; margin-top: 8px; }
.org-pcard--new {
  display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 160px;
  border-style: dashed; background: transparent; box-shadow: none; color: var(--soft);
}
.org-pcard--new .ring {
  width: 34px; height: 34px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); color: var(--brique); background: var(--surface);
}
.org-pcard--new:hover { border-color: var(--brique); color: var(--brique); background: var(--brique-soft); transform: none; }

.org-resume { display: flex; flex-direction: column; gap: 2px; }
.org-resume-item {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 11px;
  text-decoration: none; color: inherit; transition: all 120ms;
}
.org-resume-item:hover { background: var(--surface); box-shadow: var(--shadow-sm); }
.org-resume-item .ic { color: var(--mute); flex-shrink: 0; }
.org-resume-item .t { flex: 1; font-size: 13.5px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.org-resume-item .m { font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); white-space: nowrap; }

@media (max-width: 1080px) { .org-home-hub { grid-template-columns: 1fr; gap: 18px; } }

.org-empty-scroll:has(.org-home-hub) {
  justify-content: center;
  padding-top: clamp(78px, 11vh, 136px);
  padding-bottom: 28px;
}

/* ── Accueil essai actif (#255) — chip, sidebar vierge, mini-cartes formule ─ */

/* Jeton d'essai compact (top bar) */
.nu-trial-chip {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: "JetBrains Mono", monospace; font-size: 10.5px;
  letter-spacing: 0.03em; color: oklch(0.42 0.13 256);
  background: var(--brique-soft); border: 1px solid oklch(0.86 0.060 256);
  padding: 4px 10px; border-radius: 999px;
}
.nu-trial-chip .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brique); }
.nu-trial-chip.spent { color: oklch(0.50 0.10 50); background: var(--laiton-soft); border-color: var(--laiton-2); }
.nu-trial-chip.spent .dot { background: var(--laiton); }

/* Plan chip trial dans le footer sidebar */
.org-user .plan.trial { color: oklch(0.45 0.12 256); }
.org-user .plan.trial.spent { color: oklch(0.50 0.10 50); }

/* Hint vide dans la sidebar (compte vierge) */
.nu-empty-hint {
  font-size: 12px; color: var(--whisper); font-style: italic;
  font-family: "Newsreader", serif; padding: 4px 2px 2px;
  line-height: 1.4;
}

/* En-tête formules sous le composer */
.nu-plans-head {
  display: flex; align-items: baseline; gap: 10px; margin: 28px 0 13px;
}
.nu-plans-head .t {
  font-family: "Newsreader", serif; font-size: 17px; color: var(--ink);
}
.nu-plans-head .t em { font-style: italic; color: var(--brique); }
.nu-plans-head .s {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  color: var(--mute); letter-spacing: 0.04em; margin-left: auto;
}

/* Mini-cartes formule */
.nu-miniplans { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.nu-miniplan {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius-sm); padding: 16px 16px 15px;
  box-shadow: var(--shadow-sm); display: flex; flex-direction: column;
  position: relative;
}
.nu-miniplan.reco { border-color: oklch(0.82 0.075 256); background: linear-gradient(180deg, var(--surface), oklch(0.975 0.018 256)); }
.nu-miniplan .badge {
  position: absolute; top: -9px; left: 16px;
  font-family: "JetBrains Mono", monospace; font-size: 8.5px; letter-spacing: 0.12em;
  background: var(--brique); color: oklch(0.99 0.005 250);
  padding: 3px 8px; border-radius: 999px; text-transform: uppercase;
}
.nu-miniplan .pn {
  font-family: "Newsreader", serif; font-style: italic; font-size: 19px; color: var(--ink);
}
.nu-miniplan .pp {
  font-family: "Newsreader", serif; font-size: 24px; color: var(--ink); margin: 2px 0 1px;
}
.nu-miniplan .pp .per { font-size: 13px; color: var(--mute); }
.nu-miniplan .pnote {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; color: var(--mute);
  letter-spacing: 0.03em; margin-bottom: 11px;
}
.nu-miniplan .pf {
  font-size: 12px; color: var(--ink-2); display: flex; align-items: center; gap: 6px;
  padding: 3px 0; line-height: 1.3;
}
.nu-miniplan .pf .ic { color: var(--brique); flex-shrink: 0; }
.nu-miniplan .pcta { margin-top: 13px; }

/* Composer verrouillé — état bloqué (#256) */
.nu-lock-composer {
  display: flex; align-items: center; gap: 14px;
  background: var(--surface); border: 1.5px dashed oklch(0.80 0.05 256);
  border-radius: var(--radius); padding: 16px 18px;
}
.nu-lock-composer .lk {
  width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0;
  background: var(--brique-soft); color: var(--brique);
  display: flex; align-items: center; justify-content: center;
}
.nu-lock-composer .lc { flex: 1; min-width: 0; }
.nu-lock-composer .lt { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.nu-lock-composer .ls { font-size: 12px; color: var(--soft); margin-top: 2px; }

/* En-tête + pied paywall (#256) */
.nu-paywall-head { text-align: center; margin-bottom: 20px; }
.nu-paywall-head .nu-mgauge {
  max-width: 360px; margin: 18px auto 0; padding: 13px 15px;
  border-radius: var(--radius-sm); background: var(--bg-2);
  border: 1px solid var(--line-2); display: flex; flex-direction: column; gap: 9px;
}
.nu-paywall-head .nu-mgauge--spent .nu-gauge span { background: var(--line); }
.nu-paywall-head .nu-kicker {
  font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: 0.16em;
  color: var(--laiton); text-transform: uppercase; margin-bottom: 10px;
}
.nu-paywall-head .nu-ph-ttl {
  font-family: "Newsreader", serif; font-weight: 400; font-size: 32px;
  line-height: 1.08; letter-spacing: -0.02em; color: var(--ink);
}
.nu-paywall-head .nu-ph-ttl em { font-style: italic; color: var(--brique); }
.nu-paywall-head .nu-ph-sub {
  font-size: 14px; color: var(--ink-2); margin-top: 10px; font-style: italic;
  font-family: "Newsreader", serif;
}
.nu-paywall-foot {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin-top: 18px; font-size: 11.5px; color: var(--mute);
}
.nu-paywall-foot .ic { color: var(--sauge); }

@media (max-width: 900px) { .nu-miniplans { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .nu-lock-composer { align-items: flex-start; flex-wrap: wrap; }
  .nu-lock-composer .org-btn { width: 100%; justify-content: center; }
}

.org-empty-scroll:has(.nu-miniplans) { justify-content: flex-start; }

/* ─────────────────────────────────────────────────────────────────────────────
   Cards & membres (écrans équipe — invitations #269, membres #268)
   ─────────────────────────────────────────────────────────────────────────── */
.card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden;
}
.card-head {
  padding: 14px 16px; border-bottom: 1px solid var(--line-2);
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.card-head .t { font-size: 14px; font-weight: 650; color: var(--ink); }
.card-head .s { font-size: 12px; color: var(--mute); margin-top: 2px; }
.card-body { padding: 6px 16px 10px; }
.card-body-form { padding: 14px 16px; }

/* Ligne membre */
.member-row {
  display: flex; align-items: center; gap: 12px; padding: 11px 0;
  border-bottom: 1px dashed var(--line-2);
}
.member-row:last-child { border-bottom: none; }
.member-av {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic; font-size: 14px;
  background: var(--acc, var(--brique));
  box-shadow: inset 0 0 0 2px oklch(0.99 0.005 85), 0 0 0 1px var(--acc, var(--brique));
}
.member-info { min-width: 0; flex: 1; }
.member-name {
  font-size: 13.5px; font-weight: 600; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.member-you { font-family: "JetBrains Mono", monospace; font-size: 9px; color: var(--mute); font-weight: 400; margin-left: 4px; }
.member-mail {
  font-size: 11.5px; color: var(--mute);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: flex; align-items: center; gap: 4px; margin-top: 2px;
}
.member-mail .ic { flex-shrink: 0; }
.member-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.member-pending { opacity: 0.78; }
.member-pending .member-av {
  background: var(--surface-2); color: var(--mute);
  border: 1px dashed var(--line); box-shadow: none;
}
.membership-role-form { margin: 0; }
.org-icon-btn.danger { color: oklch(0.52 0.16 28); }
.org-icon-btn.danger:hover { background: oklch(0.96 0.04 28); color: oklch(0.45 0.17 28); }

/* ─────────────────────────────────────────────────────────────────────────────
   Page Invitations (#269)
   ─────────────────────────────────────────────────────────────────────────── */
.inv-page {
  max-width: 760px; width: 100%; margin: 0 auto; padding: 32px 20px;
  display: flex; flex-direction: column; gap: 22px;
}
.inv-page-head {
  display: flex; align-items: center; gap: 14px; padding-bottom: 4px;
}
.inv-page-title {
  font-family: "Newsreader", serif; font-style: italic;
  font-size: 24px; font-weight: 400; color: var(--ink); line-height: 1.2; margin: 0;
}
.inv-page-sub {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  color: var(--mute); letter-spacing: 0.04em; margin: 3px 0 0;
}
.inv-errors {
  display: flex; align-items: center; gap: 8px; padding: 10px 14px;
  background: var(--brique-soft); border: 1px solid oklch(0.86 0.06 28);
  border-radius: var(--radius-sm); font-size: 13px; color: oklch(0.45 0.14 28);
}
.inv-errors .ic { flex-shrink: 0; color: oklch(0.52 0.16 28); }
.inv-form-row {
  display: grid; grid-template-columns: minmax(180px, 1fr) 130px 170px auto;
  gap: 10px; align-items: end;
}
.inv-submit-col { display: flex; flex-direction: column; }
.inv-submit-col .org-btn { height: 40px; }
.inv-link-hint {
  font-family: "JetBrains Mono", monospace; font-size: 10px;
  color: var(--mute); display: flex; align-items: center; gap: 6px;
  margin: 10px 0 0; letter-spacing: 0.02em;
}
.inv-link-hint .ic { color: var(--sauge); flex-shrink: 0; }
.member-actions .fft-tag { white-space: nowrap; }
.member-modal-root { display: inline-flex; align-items: center; }
.member-forfait-button {
  appearance: none;
  font: inherit;
  cursor: pointer;
}
.member-forfait-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 5px 14px oklch(0.42 0.07 70 / 0.10);
}
.member-plan-form { display: contents; }
.member-plan-options {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.fft-menu-row {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 13px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  background: var(--surface);
  cursor: pointer;
}
.fft-menu-row:hover {
  border-color: color-mix(in oklch, var(--fc, var(--acc)) 34%, var(--line));
  background: color-mix(in oklch, var(--fc-s, var(--surface-2)) 54%, var(--surface));
}
.fft-menu-row.on {
  border-color: color-mix(in oklch, var(--fc, var(--acc)) 54%, var(--line));
  background: var(--fc-s, var(--surface-2));
}
.fft-menu-radio {
  width: 16px;
  height: 16px;
  accent-color: var(--fc, var(--acc));
}
.fft-menu-row .info { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fft-menu-row .a { font-size: 13px; font-weight: 650; color: var(--ink); }
.fft-menu-row .b {
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  color: var(--mute);
  letter-spacing: 0.03em;
}
.fft-menu-row .pr {
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  color: var(--ink-2);
  white-space: nowrap;
}
.fft-menu-row .per { color: var(--mute); }
.member-actions .org-icon-btn:disabled {
  cursor: not-allowed; opacity: 0.45; background: var(--surface-2);
}
.inv-cancel-btn { color: oklch(0.52 0.16 28); border-color: oklch(0.86 0.06 28); }
.inv-cancel-btn:hover { background: oklch(0.97 0.02 28); color: oklch(0.45 0.14 28); }
.inv-empty {
  padding: 20px 0; text-align: center;
  font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--mute);
  letter-spacing: 0.04em;
}

/* ===== Forfait tags (fft-*) — issue #305 / v5-additions.css ===== */
.fft-mega { --fc: var(--acc-sauge); --fc-s: var(--acc-sauge-s); }
.fft-giga { --fc: var(--acc-bleu);  --fc-s: var(--acc-bleu-s); }
.fft-peta { --fc: var(--acc-prune); --fc-s: var(--acc-prune-s); }

.fft-tag {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid color-mix(in oklch, var(--fc, var(--mute)) 30%, var(--line));
  background: var(--fc-s, var(--surface-2)); border-radius: 999px;
  padding: 4px 8px 4px 9px; white-space: nowrap;
}
.fft-tag .dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--fc, var(--mute));
  flex-shrink: 0; box-shadow: 0 0 0 2px color-mix(in oklch, var(--fc, var(--mute)) 22%, white);
}
.fft-tag .nm { font-size: 12px; font-weight: 600; color: color-mix(in oklch, var(--fc, var(--ink)) 70%, black); }
.fft-tag.ghost { background: var(--surface); border-style: dashed; border-color: var(--line); }
.fft-tag.ghost .nm { color: var(--soft); font-weight: 500; }

/* ===== Page acceptation d'invitation v5 (#305) ===== */
.inv-accept-avatar { display: flex; margin: 0 auto 8px; }
.inv-accept-avatar--muted { background: var(--surface-2); color: var(--mute); border: 1px solid var(--line); }

.inv-accept-lede {
  font-size: 13.5px; color: var(--soft); line-height: 1.55; text-align: center; margin: 0 0 16px;
}
.inv-accept-lede strong { color: var(--ink-2); }
.inv-accept-lede--muted { color: var(--mute); }

.inv-accept-team-card {
  display: flex; align-items: center; gap: 12px;
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 12px 14px; margin: 0 0 10px;
  box-shadow: var(--shadow-sm); background: var(--surface);
}
.inv-accept-team-info { flex: 1; min-width: 0; text-align: left; }
.inv-accept-team-name { font-size: 14px; font-weight: 600; color: var(--ink); }
.inv-accept-team-meta {
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute); margin-top: 2px;
}

.inv-accept-plan-note {
  display: flex; align-items: center; gap: 6px; justify-content: center;
  font-family: "JetBrains Mono", monospace; font-size: 10px; color: var(--mute);
  margin: 0 0 18px; letter-spacing: 0.03em;
}

.inv-accept-step {
  margin: 0 0 12px;
  text-align: center;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--soft);
}

.inv-accept-form {
  display: grid;
  gap: 12px;
}
.inv-accept-form .auth-field { margin-bottom: 0; }
.inv-accept-email-lock { cursor: default; }

.inv-accept-existing {
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface-2);
  color: var(--soft);
  font-size: 13px;
  line-height: 1.45;
  text-align: center;
}
.inv-accept-existing strong {
  display: block;
  margin-bottom: 3px;
  color: var(--ink-2);
  font-weight: 650;
}

.inv-accept-cta { width: 100%; justify-content: center; }
.inv-accept-cta svg { flex-shrink: 0; }

.inv-accept-legal {
  margin-top: 14px; text-align: center; font-size: 12px; color: var(--mute); line-height: 1.7;
}
.inv-accept-legal strong { color: var(--ink-2); }
.inv-accept-refuse { color: var(--soft); text-decoration: underline; }
.inv-accept-refuse:hover { color: var(--ink-2); }

/* Quota mini */
.quota-bar { height: 6px; border-radius: 4px; background: var(--line-2); overflow: hidden; }
.quota-bar > div { height: 100%; background: var(--acc, var(--brique)); border-radius: 4px; }
.quota-bar > div.warn { background: var(--laiton); }

/* Réassurance souveraineté */
.reassure {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; color: var(--mute);
  letter-spacing: 0.04em; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.reassure .coc {
  width: 11px; height: 11px; border-radius: 50%; display: inline-block; flex-shrink: 0;
  background: radial-gradient(circle at center,
    oklch(0.58 0.18 28) 0 22%, oklch(0.99 0.005 85) 22% 50%, oklch(0.40 0.15 256) 50% 100%);
  box-shadow: 0 0 0 0.5px oklch(0.26 0.022 58 / 0.15);
}

/* Layout page réglages équipe (#268) */
.team-set-wrap { width: 100%; max-width: 860px; margin: 0 auto; }
.team-set-head-row { margin-bottom: 24px; align-items: flex-start; }
.team-set-hinfo { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.team-set-hid { display: flex; align-items: center; gap: 14px; }
.team-set-name { font-family: "Newsreader", serif; font-size: 24px; font-weight: 400; letter-spacing: -0.02em; color: var(--ink); }
.team-set-sub {
  font-family: "JetBrains Mono", monospace; font-size: 10px; letter-spacing: 0.04em;
  color: var(--mute); margin-top: 4px;
}
.team-set-counts { color: var(--whisper); }
.team-set-grid { display: grid; grid-template-columns: 1fr 232px; gap: 18px; align-items: start; }
.team-set-main { min-width: 0; }
.team-set-aside { display: flex; flex-direction: column; gap: 12px; }
.team-set-paywall { margin-bottom: 14px; }
.members-colhead { display: flex; align-items: center; justify-content: flex-end; padding: 2px 0 4px; gap: 8px; }
.members-colhead .ch-forfait {
  width: 168px; font-family: "JetBrains Mono", monospace; font-size: 8.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--mute); text-align: left;
}
.member-row .member-forfait { flex-shrink: 0; }
.membership-plan-form { margin: 0; }
.team-plan-trigger {
  cursor: pointer;
  font: inherit;
}
.team-plan-trigger:hover {
  filter: saturate(1.06);
  border-color: color-mix(in oklch, var(--fc, var(--line)) 46%, var(--line));
}
.team-plan-select { width: 168px; min-height: 34px; border-color: color-mix(in oklch, var(--fc, var(--line)) 26%, var(--line)); background: var(--fc-s, var(--surface)); }
.team-set-scope { display: flex; flex-direction: column; gap: 8px; }
.team-set-scope-line {
  display: flex; align-items: center; gap: 8px; margin: 0;
  font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--soft);
}
.team-set-scope-line svg { color: var(--acc, var(--brique)); flex-shrink: 0; }

@media (max-width: 720px) {
  .team-billing-grid,
  .team-billing-summary-grid,
  .team-set-grid { grid-template-columns: 1fr; }
  .team-credit-head,
  .billing-row-line { align-items: flex-start; flex-wrap: wrap; }
  .team-credit-head > div:first-child { flex-basis: 100%; }
  .billing-row-copy { flex-basis: calc(100% - 42px); }
  .billing-preset-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-set-aside { display: none; }
  .members-colhead { display: none; }
  .member-actions { flex-wrap: wrap; justify-content: flex-start; }
  .team-plan-select { width: 100%; }
  .membership-plan-form { width: 100%; }
}
@media (max-width: 600px) {
  .inv-form-row { grid-template-columns: 1fr; }
  .inv-page { padding: 20px 16px; }
}

/* ================================================================
   v0.6.0-alpha — Master switch, rail repliable, CtxBanner, rail-me
   (issue #334)
   ================================================================ */

/* ---- MASTER SWITCH ---- */
.ms {
  position: relative;
  flex-shrink: 0;
}

.ms-btn {
  width: 100%; display: flex; align-items: center; gap: 11px;
  padding: 9px 10px; border-radius: 14px; border: 1px solid var(--line);
  background: var(--surface); box-shadow: var(--shadow-sm); text-align: left;
  cursor: pointer; font-family: inherit;
  transition: border-color 140ms, box-shadow 140ms;
}
.ms-btn:hover { border-color: color-mix(in oklch, var(--acc) 40%, var(--line)); }

.ms-seal {
  width: 36px; height: 36px; border-radius: 11px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic; font-size: 19px; color: #fff;
  background: var(--acc);
  box-shadow: inset 0 0 0 2px oklch(0.99 0.005 85 / 0.6), 0 0 0 1px var(--acc);
  position: relative;
}
.ms-seal.perso { border-radius: 50%; }
.ms-seal::after {
  content: ""; position: absolute; left: 8px; right: 8px; bottom: 4px;
  height: 1px; background: oklch(1 0 0 / 0.4);
}

.ms-info { flex: 1; min-width: 0; }
.ms-ctx {
  font-family: "JetBrains Mono", monospace; font-size: 8.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--acc-ink); font-weight: 600; margin-bottom: 2px;
  display: flex; align-items: center; gap: 5px;
}
.ms-ctx .dot { width: 5px; height: 5px; border-radius: 50%; background: var(--acc); }
.ms-name {
  font-size: 13.5px; font-weight: 600; color: var(--ink); line-height: 1.15;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ms-chev { color: var(--mute); flex-shrink: 0; }

/* Popover master switch — flex column pour empiler header, groupes, rows, footer */
.ms-pop {
  position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 60;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg); padding: 8px;
  animation: msPop 160ms ease;
  display: flex; flex-direction: column;
}
@keyframes msPop { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

.ms-pop-h {
  display: flex; align-items: center; justify-content: space-between;
  padding: 4px 8px 8px; border-bottom: 1px solid var(--line-2); margin-bottom: 6px;
}
.ms-pop-h .t { font-family: "Newsreader", serif; font-style: italic; font-size: 15px; color: var(--ink); }
.ms-pop-h .kbd {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; color: var(--mute);
  background: var(--bg-2); border: 1px solid var(--line-2); border-radius: 5px; padding: 1px 5px;
}

.ms-pop-group {
  font-family: "JetBrains Mono", monospace; font-size: 8px; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--mute); padding: 6px 9px 3px; margin-top: 4px;
}

.ms-row {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 8px 9px; border-radius: 11px; cursor: pointer; text-align: left;
  border: none; background: transparent; font-family: inherit;
  transition: background 100ms;
}
.ms-row:hover { background: var(--surface-2); }
.ms-row.on { background: var(--acc-soft); }
.ms-row .seal {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic; font-size: 15px; color: #fff;
  background: var(--acc);
}
.ms-row .seal.perso { border-radius: 50%; background: var(--bleu); }
.ms-row .nm { flex: 1; min-width: 0; }
.ms-row .nm .n1 {
  font-size: 13px; font-weight: 600; color: var(--ink);
  display: flex; align-items: center; gap: 7px;
}
.ms-row .nm .n2 {
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; color: var(--mute); margin-top: 1px;
}
.ms-row .ck { color: var(--acc); }
.ms-switch-form { display: contents; }

.ms-pop-foot { border-top: 1px solid var(--line-2); margin-top: 6px; padding-top: 6px; }

/* ---- RAIL FOOT ---- */
.rail-foot {
  flex-shrink: 0;
  border-top: 1px solid var(--line-2);
  padding-top: 10px;
  display: flex; flex-direction: column; gap: 3px;
}

.rail-quota {
  padding: 9px 10px;
  margin-bottom: 5px;
  border-radius: 12px;
  border: 1px solid var(--line-2);
  background: color-mix(in oklch, var(--surface) 86%, var(--acc-soft));
  box-shadow: var(--shadow-sm);
}
.rail-quota .qh {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-family: "JetBrains Mono", monospace; font-size: 8.5px; color: var(--mute);
  letter-spacing: 0.06em; text-transform: uppercase;
}
.rail-quota .qh span:first-child {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rail-quota .bar {
  height: 5px; border-radius: 999px; background: var(--line-2);
  overflow: hidden; margin-top: 7px;
}
.rail-quota .bar span {
  display: block; height: 100%; border-radius: inherit;
}
.rail-quota .q-extra {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: 7px;
  font-family: "JetBrains Mono", monospace; font-size: 9px; color: var(--mute);
}
.rail-quota .q-extra .lbl {
  display: inline-flex; align-items: center; gap: 4px; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rail-quota .q-extra .lbl svg { color: var(--acc, var(--bleu)); flex-shrink: 0; }
.rail-quota .q-extra .val {
  color: var(--ink-2);
  font-weight: 600;
  white-space: nowrap;
}

/* ---- CHIP IDENTITÉ PERSONNELLE (rail-me) — équipe uniquement ---- */
.rail-me {
  width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 9px; margin-bottom: 5px;
  border-radius: 12px; border: 1px solid var(--line-2); background: var(--surface);
  text-decoration: none; cursor: pointer;
}
.rail-me:hover { border-color: var(--line); background: var(--surface-2); }
.rail-me .me-av {
  width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
  background: var(--bleu); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic; font-size: 16px;
}
.rail-me .me-info { flex: 1; min-width: 0; }
.rail-me .me-nm {
  font-size: 12.5px; font-weight: 600; color: var(--ink); line-height: 1.15;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rail-me .me-sub {
  font-family: "JetBrains Mono", monospace; font-size: 8.5px; color: var(--mute); margin-top: 1px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rail-me .me-go { color: var(--mute); flex-shrink: 0; }

/* ---- BOUTON REPLIER ---- */
.fold-btn {
  width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  margin-top: 4px; padding: 7px; border-radius: 10px; border: 1px solid var(--line-2);
  background: var(--surface); color: var(--mute); cursor: pointer; font-family: inherit;
  transition: background 100ms, color 100ms;
}
.fold-btn:hover { background: var(--surface-2); color: var(--ink); }
.fold-btn svg { transition: transform 200ms; }

/* ---- RAIL FOLDÉ — icônes seules ---- */
.org-aside.folded {
  padding: 22px 10px 16px;
  align-items: center;
  width: 72px !important;
  overflow: visible; /* permet au ms-pop de déborder du rail foldé */
}
.org-aside.folded::after { display: none; }

/* Masquer les labels en mode foldé */
.org-aside.folded .rail-label { display: none; }
.org-aside.folded .org-actions { align-items: center; }
.org-aside.folded .org-sb-btn {
  justify-content: center; padding: 9px; width: 44px; border-radius: 11px;
}
.org-aside.folded .org-wordmark-text,
.org-aside.folded .org-wordmark-sub { display: none; }
.org-aside.folded .org-mark { margin: 0 auto; }
.org-aside.folded .org-wordmark { justify-content: center; gap: 0; padding-bottom: 10px; }

/* Master switch en mode foldé — sceau seul.
   Le popover garde une largeur min usable (250px) même si .ms ne fait que 44px. */
.org-aside.folded .ms-btn {
  width: 44px; padding: 6px; justify-content: center; border-radius: 12px;
}
.org-aside.folded .ms-info,
.org-aside.folded .ms-chev { display: none; }
.org-aside.folded .ms-pop {
  left: 0; right: auto; min-width: 250px;
}

/* Nav en mode foldé — icônes seules, en gardant les signaux d'état visibles */
.org-aside.folded .org-nav {
  display: flex;
  align-items: center;
  width: 100%;
  margin: 2px 0;
  padding: 0;
  gap: 7px;
  overflow-y: auto;
  overflow-x: visible;
}
.org-aside.folded .org-nav section {
  align-items: center;
  width: 100%;
  gap: 3px;
}
.org-aside.folded .org-section {
  width: 44px;
  justify-content: center;
  padding: 3px 0 1px;
  gap: 0;
  font-size: 0;
}
.org-aside.folded .org-section::after,
.org-aside.folded .org-section-label {
  display: none;
}
.org-aside.folded .org-count {
  min-width: 18px;
  margin: 0;
  padding: 1px 5px;
  font-size: 9.5px;
  text-align: center;
}
.org-aside.folded .org-items {
  width: 100%;
  align-items: center;
  gap: 4px;
}
.org-aside.folded .org-item-row,
.org-aside.folded .org-conv-row {
  width: 44px;
  justify-content: center;
  border-radius: 11px;
}
.org-aside.folded .org-item,
.org-aside.folded .org-conv {
  width: 44px;
  height: 36px;
  flex: none;
  justify-content: center;
  padding: 0;
  border-radius: 11px;
}
.org-aside.folded .org-item.active,
.org-aside.folded .org-conv.active {
  box-shadow: var(--shadow-sm), inset 0 -2px 0 var(--acc, var(--brique));
  padding-left: 0;
}
.org-aside.folded .org-item-title,
.org-aside.folded .org-item-time,
.org-aside.folded .org-attn-badge,
.org-aside.folded .org-archive-form {
  display: none;
}
.org-aside.folded .org-chat-mark,
.org-aside.folded .org-unread-dot,
.org-aside.folded .org-attn-mark,
.org-aside.folded .org-working-marker {
  display: inline-flex;
}
.org-aside.folded .org-group {
  width: 44px;
  align-items: center;
}
.org-aside.folded .org-group-head {
  width: 44px;
  height: 36px;
  justify-content: center;
  padding: 0;
  border-radius: 11px;
  position: relative;
}
.org-aside.folded .org-group-head .chev,
.org-aside.folded .org-group-head .nm {
  display: none;
}
.org-aside.folded .org-group-head .dot {
  position: absolute;
  right: 9px;
  bottom: 7px;
  width: 6px;
  height: 6px;
}
.org-aside.folded .org-group-head .ct {
  position: absolute;
  right: 4px;
  top: 3px;
  min-width: 15px;
  padding: 0 4px;
  font-size: 8.5px;
  line-height: 14px;
  background: var(--surface);
}
.org-aside.folded .org-group-body {
  display: none !important;
}
.org-aside.folded .org-empty-link,
.org-aside.folded .org-item--muted,
.org-aside.folded .nu-empty-hint {
  display: none;
}

/* Rail foot en mode foldé */
.org-aside.folded .rail-foot { align-items: center; border-top: none; }
.org-aside.folded .rail-me { width: 44px; padding: 6px; justify-content: center; border-color: transparent; background: transparent; margin-bottom: 2px; }
.org-aside.folded .rail-me .me-info,
.org-aside.folded .rail-me .me-go { display: none; }
.org-aside.folded .rail-quota { display: none; }
.org-aside.folded .fold-btn { width: 44px; }
.org-aside.folded .fold-btn svg { transform: rotate(180deg); }

/* Tooltips pour le mode foldé (via title attribute, natifs navigateur) */
.org-aside.folded [title] { cursor: pointer; }

/* ---- CTX BANNER ---- */
.ctx-banner {
  display: flex; align-items: center; gap: 12px; padding: 10px 24px;
  background: var(--acc-soft); border-bottom: 1px solid color-mix(in oklch, var(--acc) 22%, white);
  flex-shrink: 0;
}
.ctx-banner .ic { color: var(--acc-ink); display: inline-flex; flex-shrink: 0; }
.ctx-banner .tx { font-size: 12.5px; color: var(--acc-ink); }
.ctx-banner .tx b { font-weight: 600; }
.ctx-banner .sp { flex: 1; }
.ctx-banner .back {
  font-family: "JetBrains Mono", monospace; font-size: 10.5px; color: var(--acc-ink);
  display: inline-flex; align-items: center; gap: 6px; font-weight: 600;
  text-decoration: none; flex-shrink: 0;
}
.ctx-banner .back:hover { text-decoration: underline; }

@media (max-width: 720px) {
  .ctx-banner { flex-wrap: wrap; padding: 10px 16px; }
  .ctx-banner .tx { min-width: 0; overflow-wrap: anywhere; }
  .ctx-banner .sp { display: none; }
}

/* Intégration org-set-body : ctx-banner sort du flux principal */
.org-set-body {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.org-set-body > * {
  width: 100%;
  min-width: 0;
}
.org-set-body > .org-sh { max-width: 860px; }

/* ---- ORG-SETTINGS-PAGE restructuration pour CtxBanner (#334) ---- */
/* La colonne droite devient un flex column pour positionner le banner
   en dehors du padding de org-set-body.
   Pas de redéclaration de grid-template-columns : la règle existante (.2911) suffit. */
.org-set-right {
  display: flex; flex-direction: column; overflow: hidden; min-width: 0; min-height: 0;
}
.org-set-right .org-set-body { flex: 1; height: auto; }

/* Adaptation mobile : overflow visible, pas de colonne droite contrainte */
@media (max-width: 860px) {
  .org-set-right { overflow: visible; }
}

/* ---- CHAT-SHELL foldable (#334) ---- */
/* :has() supporte tous les navigateurs modernes (Chrome 105+, Safari 15.4+, FF 121+).
   Scoped desktop only : sur mobile la sidebar est cachée, pas de 2 colonnes. */
@media (min-width: 769px) {
  .chat-shell:has(.org-aside.folded) {
    grid-template-columns: 72px 1fr;
  }
}

/* ---- Correction org-set-item active avec --acc en contexte équipe ---- */
.ctx-team .org-set-item.on {
  box-shadow: var(--shadow-sm), inset 3px 0 0 var(--acc);
}
.ctx-team .org-set-item.on .ic { color: var(--acc); }
.ctx-team .org-set-logout:hover { background: var(--acc-soft); }
.ctx-team .org-set-logout:hover .ic { color: var(--acc); }

/* =====  v0.6.0-alpha — Accueil composer-first + conversation slim topbar (issue #335)  ===== */

/* ---- Accueil v0.6 : pas de topbar doublon, composer centré ---- */
.org-home-v06 { display: flex; flex-direction: column; height: 100%; }
.org-home-v06 .org-empty-scroll { flex: 1; overflow-y: auto; }
.org-home-v06-inner {
  max-width: 760px; margin: 0 auto; padding: 40px 24px 32px;
  display: flex; flex-direction: column; gap: 0;
}
/* Salutation plus aérée dans le contexte v0.6 */
.org-home-v06 .org-empty-hello { margin-bottom: 28px; }
/* Composer v0.6 : légèrement plus large que le hub */
.org-home-v06 .org-composer { margin-bottom: 12px; }

/* ---- Toolbar MCP chips ---- */
.org-mcp-toolbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-bottom: 28px;
}
.org-mcp-lead {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px 4px 2px;
  font-family: "JetBrains Mono", monospace; font-size: 9.5px; font-weight: 600;
  letter-spacing: 0.13em; text-transform: uppercase; color: var(--mute);
}
.org-mcp-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px;
  background: var(--surface-2); border: 1px solid var(--line-2);
  font-family: "JetBrains Mono", monospace; font-size: 10.5px; color: var(--soft);
  white-space: nowrap; cursor: default; user-select: none;
  text-decoration: none;
}
.org-mcp-chip .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--mute); flex-shrink: 0;
}
button.org-mcp-chip {
  cursor: pointer;
}
.org-mcp-chip.on {
  color: oklch(0.34 0.12 256);
  background: var(--brique-soft);
  border-color: oklch(0.86 0.060 256);
}
.org-mcp-chip.on .dot {
  background: oklch(0.52 0.14 142);
}
.org-mcp-chip.muted {
  opacity: 0.72;
}
.org-mcp-chip.add {
  background: transparent;
  color: var(--brique);
  border-style: dashed;
}
.org-mcp-chip.add:hover {
  background: var(--brique-soft);
  border-style: solid;
}

/* ---- Topbar conversation slim v0.6 ---- */
.chat-topbar-slim { gap: 10px; }
.chat-topbar-head { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }

/* Titre éditable in-place */
.chat-title-input {
  width: 100%; background: transparent; border: none; outline: none;
  font-size: var(--fz-title, 15px); font-weight: 600; color: var(--ink);
  letter-spacing: -0.01em; line-height: 1.3;
  padding: 0; margin: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chat-title-input::placeholder { color: var(--mute); font-weight: 400; }
.chat-title-input:focus {
  background: var(--surface-2); border-radius: 4px;
  padding: 1px 5px; margin: -1px -5px;
  outline: 2px solid color-mix(in oklch, var(--brique) 40%, transparent);
  outline-offset: 0;
}
.chat-title-static {
  font-size: var(--fz-title, 15px); font-weight: 600; color: var(--ink);
  letter-spacing: -0.01em; line-height: 1.3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Meta sous le titre (identique à l'ancien .chat-top-head .meta) */
.chat-topbar-meta {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-family: "JetBrains Mono", monospace; font-size: 10.5px; color: var(--soft);
}

/* Actions topbar slim */
.chat-topbar-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }

/* ---- Menu « plus » (details/summary) ---- */
.chat-more-menu { position: relative; }
.chat-more-menu > summary {
  list-style: none; cursor: pointer;
}
.chat-more-menu > summary::-webkit-details-marker { display: none; }
.chat-more-pop {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 400;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 10px; box-shadow: var(--shadow);
  min-width: 210px; padding: 5px;
  display: flex; flex-direction: column; gap: 1px;
}
.chat-more-assign {
  padding: 4px;
  border-bottom: 1px solid var(--line-2);
  margin-bottom: 3px;
}
.chat-more-assign .org-assign {
  display: block;
  position: relative;
}
.chat-more-assign .org-assign-btn,
.chat-more-assign .org-proj-chip {
  width: 100%;
  justify-content: flex-start;
}
.chat-more-item {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 10px; border-radius: 6px;
  font-size: 13px; color: var(--ink-2); text-decoration: none;
  background: transparent; border: none; cursor: pointer; width: 100%; text-align: left;
}
.chat-more-item:hover { background: var(--surface-2); }
.chat-more-item .ic { color: var(--mute); flex-shrink: 0; }
.chat-more-form { display: contents; }

@media (max-width: 600px) {
  .org-home-v06-inner { padding: 24px 16px 24px; }
  .chat-topbar-slim .chat-title-input,
  .chat-topbar-slim .chat-title-static { font-size: 14px; }
}

/* ============== Administration équipe & compte membre (#338) ============== */

/* Nav réglages scindée : titres de section (Administration / Mon compte · équipe) */
.org-set-section-title {
  font-family: "JetBrains Mono", monospace;
  font-size: 9.5px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--mute); padding: 14px 12px 5px;
}
.org-set-section-title:first-of-type { padding-top: 4px; }

/* CtxBanner variante membre (compte membre équipe) — ton neutre, distinct de l'admin (accentué) */
.ctx-banner-member {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
}
.ctx-banner-member .ic,
.ctx-banner-member .tx,
.ctx-banner-member .back { color: var(--ink-2); }

/* Vue d'ensemble equipe — dashboard AdminOverview v0.6 */
.ov-tiles {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 16px;
}
.ov-tile {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 15px 16px; box-shadow: var(--shadow-sm); text-decoration: none; color: inherit;
  min-width: 0; transition: box-shadow .15s, transform .15s; overflow: hidden;
}
a.ov-tile:hover { box-shadow: var(--shadow-lg); transform: translateY(-1px); }
.ov-tile-k {
  font-family: "JetBrains Mono", monospace; font-size: 9px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ov-tile-v { font-family: "Newsreader", serif; font-size: 30px; line-height: 1.1; color: var(--ink); margin-top: 6px; }
.ov-tile-v small { font-family: "JetBrains Mono", monospace; font-size: 11px; color: var(--mute); }
.ov-tile-sub { font-size: 11px; color: var(--soft); margin-top: 3px; line-height: 1.35; }
.ov-flag-lock { color: var(--acc-ink); margin-left: 6px; display: inline-flex; align-items: center; gap: 3px; }
.ov-dashboard-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 16px; align-items: start; margin-top: 24px;
}
.ov-consumers-card .card-head { padding: 15px 18px; }
.ov-consumers { padding: 2px 18px 6px; }
.ov-consumer { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px dashed var(--line-2); }
.ov-consumer:last-child { border-bottom: none; }
.ov-consumer-avatar {
  width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Newsreader", serif; font-style: italic; font-size: 15px; background: var(--acc);
}
.ov-consumer-info { flex: 1; min-width: 0; }
.ov-consumer-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ov-consumer-name { font-size: 13px; font-weight: 600; color: var(--ink); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-consumer-metrics { display: flex; align-items: center; gap: 16px; margin-top: 4px; flex-wrap: wrap; }
.ov-consumer-metric { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--soft); }
.ov-consumer-metric .ic { color: var(--mute); }
.ov-consumer-metric b { color: var(--ink-2); font-family: "JetBrains Mono", monospace; font-size: 11.5px; font-weight: 600; }
.ov-consumer-metric span { font-size: 10.5px; color: var(--mute); }
.ov-side-col { display: flex; flex-direction: column; gap: 16px; }
.ov-scope-card { padding: 18px; }
.ov-scope-title { font-size: 12px; font-weight: 650; color: var(--ink); margin-bottom: 13px; }
.ov-scope { display: flex; flex-direction: column; gap: 7px; }
.ov-scope-line { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-2); }
.ov-scope-line .ic { color: var(--acc); }
.ov-invite-cta { justify-content: center; width: 100%; }
.ov-empty { padding: 12px 0; color: var(--mute); font-size: 12.5px; }
.ov-actions { margin-top: 16px; display: flex; gap: 10px; }

/* Modale de gestion membre / paramètres / invitation */
.tm-modal, .ts-modal, .inv-modal { width: min(480px, 92vw); }
.tm-modal-head { display: flex; align-items: center; gap: 12px; padding: 18px 20px 6px; }
.tm-modal-head .member-av, .tm-modal-head .ws-mono { flex-shrink: 0; }
.tm-modal-id { flex: 1; min-width: 0; }
.tm-modal-name { font-weight: 600; color: var(--ink); }
.tm-modal-mail { font-family: "JetBrains Mono", monospace; font-size: 10.5px; color: var(--mute); }
.tm-modal-section { padding: 12px 20px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 7px; }
.tm-modal-section:first-of-type { border-top: none; }
.tm-modal-control { display: flex; gap: 8px; align-items: center; }
.tm-modal-control .org-select { flex: 1; }
.tm-modal-fixed { display: flex; align-items: center; gap: 8px; }
.tm-modal-hint { font-size: 11.5px; color: var(--mute); }
.tm-modal-danger { padding-bottom: 18px; }

/* Lectures (paramètres équipe + mon profil) */
.ts-readout { display: flex; flex-direction: column; gap: 14px; padding: 16px; }
.ts-field { display: flex; flex-direction: column; gap: 5px; }
.ts-value { font-size: 13.5px; color: var(--ink); }
.ts-value-mono { font-family: "JetBrains Mono", monospace; font-size: 12.5px; }
.ts-accent-readout { display: flex; align-items: center; gap: 8px; }
.ts-accent-dot { width: 14px; height: 14px; border-radius: 50%; display: inline-block; }
.ts-personal-note { display: flex; align-items: flex-start; gap: 8px; font-size: 11.5px; color: var(--mute); line-height: 1.45; margin: 4px 0 0; }
.ts-personal-note .ic { flex-shrink: 0; margin-top: 1px; }

/* Formulaires en modale (paramètres / invitation) */
.ts-form, .inv-modal-form { padding: 18px 22px 0; display: flex; flex-direction: column; gap: 14px; }
.inv-modal-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.inv-modal-foot { padding-top: 6px; }
.ts-modal-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 20px 20px; }

.team-danger-card { border-color: oklch(0.86 0.06 28); }
.team-danger-card .org-pill.danger {
  background: oklch(0.96 0.035 28);
  color: oklch(0.50 0.15 28);
  border-color: oklch(0.84 0.08 28);
}
.team-danger-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 16px;
}
.team-danger-copy {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  min-width: 0;
}
.team-danger-copy .org-ic-circle.danger {
  color: var(--bad);
  background: var(--bad-soft);
  border-color: oklch(0.84 0.08 28);
  flex-shrink: 0;
}
.team-danger-title {
  font-size: 13.5px;
  font-weight: 650;
  color: var(--ink);
  margin-bottom: 3px;
}
.team-danger-copy p {
  margin: 0;
  color: var(--ink-2);
  font-size: 12.5px;
  line-height: 1.45;
}

/* Sélecteur d'accent (radios stylés en pastilles, sans JS) */
.ts-accent-picker { display: flex; gap: 12px; flex-wrap: wrap; }
.ts-accent-swatch { position: relative; display: inline-flex; flex-direction: column; align-items: center; gap: 4px; cursor: pointer; }
.ts-accent-radio { position: absolute; opacity: 0; pointer-events: none; }
.ts-accent-chip { width: 26px; height: 26px; border-radius: 50%; background: var(--sw); box-shadow: inset 0 0 0 2px var(--surface), 0 0 0 1px var(--line); }
.ts-accent-radio:checked + .ts-accent-chip { box-shadow: inset 0 0 0 2px var(--surface), 0 0 0 2px var(--sw); }
.ts-accent-radio:focus-visible + .ts-accent-chip { outline: 2px solid var(--acc); outline-offset: 2px; }
.ts-accent-name { font-size: 10.5px; color: var(--mute); }
.ts-accent-radio:checked ~ .ts-accent-name { color: var(--ink); }

@media (max-width: 720px) {
  .ov-tiles, .ov-dashboard-grid { grid-template-columns: 1fr; }
  .ov-consumer-top { align-items: flex-start; }
  .ov-consumer-name { white-space: normal; }
  .member-row {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .member-actions {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding-left: 46px;
  }
  .fft-menu-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .fft-menu-row .fft-tag {
    grid-column: 2;
  }
  .fft-menu-row .info {
    grid-column: 2 / 4;
  }
  .fft-menu-row .pr {
    grid-column: 2 / 4;
  }
  .team-danger-body {
    align-items: flex-start;
    flex-direction: column;
  }
  .inv-modal-cols { grid-template-columns: 1fr; }
}

/* ── #339 Administration équipe · Modèles & MCP ───────────────────────── */
.mm-wrap { display: flex; flex-direction: column; gap: 18px; }

/* Lignes fournisseurs / MCP : primary à gauche, actions à droite. */
.mm-prov-row, .mm-mcp-row, .mm-model-row { grid-template-columns: 1fr auto; }
.mm-prov-row .sub, .mm-mcp-row .sub {
  font-family: "Albert Sans", sans-serif; font-size: 11.5px; letter-spacing: 0;
  text-transform: none; color: var(--mute); display: flex; align-items: center; gap: 5px;
}
.mm-prov-row .actions, .mm-mcp-row .actions { align-items: center; gap: 10px; }
.mm-mcp-row.off { opacity: 0.66; }

/* Avatars fournisseurs (org-avatar-sm + couleur de marque). */
.prov-av { color: oklch(0.98 0.008 250); }
.prov-cloudtemple { background: oklch(0.52 0.130 256); }
.prov-openai      { background: oklch(0.30 0.020 200); }
.prov-anthropic   { background: oklch(0.55 0.120 34); }
.prov-gemini      { background: oklch(0.50 0.130 256); }
.prov-mcp         { background: oklch(0.93 0.040 34); color: oklch(0.55 0.13 34); }

/* Toggle d'action (button_to) réutilisant le visuel du switch organique. */
.org-switch-btn {
  background: none; border: 0; padding: 0; cursor: pointer; display: inline-flex; align-items: center;
}
.org-switch-btn .track {
  width: 42px; height: 24px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--line-2); position: relative; transition: background 120ms, border-color 120ms;
}
.org-switch-btn .thumb {
  position: absolute; width: 18px; height: 18px; border-radius: 50%; top: 2px; left: 2px;
  background: var(--surface); box-shadow: 0 1px 3px oklch(0.25 0.02 58 / 0.16); transition: transform 120ms;
}
.org-switch-btn.on .track { background: var(--brique); border-color: var(--brique); }
.org-switch-btn.on .track .thumb { transform: translateX(18px); }
.org-switch-btn:focus-visible .track { outline: 2px solid oklch(0.58 0.13 256 / 0.35); outline-offset: 2px; }
.mm-toggle-form { margin: 0; display: inline-flex; }

/* Journal d'audit. */
.mm-audit {
  font-family: "JetBrains Mono", monospace; font-size: 12px; color: var(--mute);
  padding: 15px 18px; line-height: 1.6;
}

/* Modale manage-models. */
.mm-modal { width: min(560px, calc(100vw - 32px)); }
.mm-modal-list { max-height: 60vh; overflow-y: auto; }
.mm-model-row { padding: 11px 18px; }
.mm-model-row.off { opacity: 0.5; }
.mm-model-badges { display: flex; align-items: center; gap: 10px; }
.mm-empty { padding: 26px 18px; color: var(--mute); font-size: 13px; text-align: center; }

/* Formulaires de connexion en modale. */
.mm-connect-form .org-field-label { display: flex; flex-direction: column; gap: 5px; }
.tm-modal-actions { display: flex; gap: 8px; padding: 4px 20px 16px; }