/* ═══════════════════════════════════════════════════════════════════
   MTCPatient — Habillage de l'application praticien (v0.13.0)

   Reprise de la direction de NutriPatient : un rail sombre à gauche, du
   papier chaud à droite, un cartouche patient en tête de dossier, et un
   serif éditorial réservé aux noms. La 0.11.0 avait tenté la même chose
   en redéfinissant une douzaine de variables de l'ancienne charte ; le
   résultat était du rouge sombre sur du brun sombre. Deux leçons en sont
   tirées ici.

   PREMIÈRE : LE ROUGE NE SERT PLUS DE COULEUR DE TEXTE. Il marque la
   marque, l'état actif et les boutons primaires. Partout ailleurs —
   libellés, chinois, valeurs — ce sont des encres neutres. Deux rouges
   qui se croisent sur un même écran (le bordeaux des libellés chinois,
   le vermillon des boutons) se lisaient comme une erreur d'impression.

   DEUXIÈME : LE CHINOIS EST SECONDAIRE, PAS DÉCORATIF. Il accompagne le
   français en gris tiède, un demi-point plus petit. Il doit se lire sans
   happer l'œil, y compris sur le document que le patient relit avant de
   signer.

   NOM DE FICHIER. Cette feuille remplace mtc-tokens.css. Le changement
   de nom est délibéré : sur SwissCenter, l'opcache sert volontiers un
   CSS périmé, et une nouvelle URL est la seule garantie de voir la
   nouvelle version du premier coup.
   ═══════════════════════════════════════════════════════════════════ */

:root, body {
  /* ── Rouge de marque ──
     Le #9B1C1C historique reste le degré 600. Un cran plus clair (500)
     est ajouté pour les fonds sombres, où le bordeaux disparaît. */
  --mtc-r900: #3A100E;
  --mtc-r800: #571613;
  --mtc-r700: #7A1D18;
  --mtc-r600: #9B1C1C;
  --mtc-r500: #B4322A;
  --mtc-r400: #C9564C;
  --mtc-r300: #E0958D;
  --mtc-r200: #F0C6C1;
  --mtc-r100: #F8E4E1;
  --mtc-r50:  #FDF5F4;

  --mtc-gold:     #A8802B;
  --mtc-gold-bg:  #FAF4E6;
  --mtc-gold-line:#E6D5AC;

  /* ── Surfaces — papier chaud, jamais rose ── */
  --mtc-paper:   #FAF9F6;
  --mtc-surface: #FFFFFF;
  --mtc-sunken:  #F2F0EC;
  --mtc-line:    #E7E3DC;
  --mtc-line2:   #D2CDC4;

  /* ── Encres neutres ── */
  --mtc-ink:  #1F1D1A;
  --mtc-ink2: #46423C;
  --mtc-ink3: #6B655D;
  /* #8A847B ne donnait que 3,71:1 sur blanc : c'était l'encre des
     libellés « FR », des en-têtes de tableau, des mentions « facultatif »
     et des heures de l'agenda — donc partout, et partout sous le seuil.
     #726C63 reste la plus pâle des quatre encres et passe à 5,20:1. */
  --mtc-ink4: #726C63;

  /* ── États ── */
  --mtc-jade:     #2E6B52;  --mtc-jade-bg: #EAF3EE;  --mtc-jade-line: #C3DCCE;
  --mtc-amber:    #8A5A12;  --mtc-amber-bg:#FBF3E3;  --mtc-amber-line:#E8D6AE;
  --mtc-rose:     #A33227;  --mtc-rose-bg: #FBEAE8;  --mtc-rose-line: #F0C8C3;
  --mtc-sky:      #2A6280;  --mtc-sky-bg:  #E9F1F5;  --mtc-sky-line:  #C4DAE4;

  /* ── Rail sombre ──
     Un charbon tiède, presque neutre. Le brun-rouge de la 0.11.0 entrait
     en conflit avec tout ce qu'on posait dessus. */
  --mtc-rail:      #211E1B;
  --mtc-rail-2:    #171513;
  --mtc-rail-card: #2C2825;
  --mtc-rail-line: rgba(255,255,255,.08);
  --mtc-rail-ink:  #F2EFEB;
  --mtc-rail-ink2: #BDB6AD;
  --mtc-rail-ink3: #948C83;
  --mtc-rail-hover:rgba(255,255,255,.06);
  --mtc-rail-act:  rgba(255,255,255,.10);

  --mtc-sh1: 0 1px 2px rgba(31,29,26,.06);
  --mtc-sh2: 0 8px 24px -10px rgba(31,29,26,.18), 0 2px 5px rgba(31,29,26,.05);
  --mtc-sh3: 0 22px 48px -18px rgba(31,29,26,.28), 0 4px 10px rgba(31,29,26,.06);

  --mtc-r-sm: 7px;  --mtc-r-md: 11px;  --mtc-r-lg: 15px;  --mtc-r-pill: 999px;

  --mtc-sans:  -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mtc-serif: ui-serif, Georgia, "Iowan Old Style", "Times New Roman", serif;
  --mtc-zh:    "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --mtc-mono:  ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --mtc-s1: 4px;  --mtc-s2: 8px;  --mtc-s3: 12px; --mtc-s4: 16px;
  --mtc-s5: 20px; --mtc-s6: 24px; --mtc-s8: 32px; --mtc-s10: 40px;

  /* ═══ Remappage de l'ancienne charte ═══
     praticien-frontend.css consomme ces noms sur 3 700 lignes, et se
     termine par une section « OVERRIDE FINAL AGRESSIF » qui les redéfinit
     en !important. Un !important antérieur bat une déclaration normale
     postérieure : sans le !important ci-dessous, ce remappage perdait en
     silence, et c'est très exactement ce qui a produit du quasi-noir sur
     fond sombre dans les versions 0.11.0 et 0.11.1.

     LE SÉLECTEUR EST `:root, body`, PAS `:root`. La feuille historique
     déclare ces mêmes variables sur `body`. Une variable posée sur body
     est héritée par tout ce qu'il contient, et cette valeur héritée bat
     celle de :root quelle que soit la spécificité — l'héritage se résout
     au plus près de l'élément. Un remappage sur :root seul ne pouvait donc
     pas gagner. Vérifié au navigateur, pas déduit. */
  --mtc-pra-red: var(--mtc-r600) !important;
  --mtc-pra-red-dark: var(--mtc-r700) !important;
  --mtc-pra-red-light: var(--mtc-r100) !important;
  --mtc-pra-gold: var(--mtc-gold) !important;
  --mtc-pra-gold-soft: var(--mtc-gold-line) !important;
  --mtc-pra-ivory: var(--mtc-paper) !important;
  --mtc-pra-paper: var(--mtc-sunken) !important;
  --mtc-pra-cream: var(--mtc-sunken) !important;
  --mtc-pra-cream-alt: transparent !important;
  --mtc-pra-ink: var(--mtc-ink) !important;
  --mtc-pra-ink-soft: var(--mtc-ink2) !important;
  --mtc-pra-ink-mute: var(--mtc-ink3) !important;
  --mtc-pra-ink-faint: var(--mtc-ink4) !important;
  --mtc-pra-line: var(--mtc-line) !important;
  --mtc-pra-line-soft: #F0EDE7 !important;
  --mtc-pra-line-strong: var(--mtc-line2) !important;
  /* Le chinois n'est plus bordeaux : c'est un gris tiède secondaire. */
  --mtc-pra-zh: var(--mtc-ink4) !important;
  --mtc-pra-radius: var(--mtc-r-md) !important;
  --mtc-pra-radius-lg: var(--mtc-r-lg) !important;
  --mtc-pra-shadow-sm: var(--mtc-sh1) !important;
  --mtc-pra-shadow-md: var(--mtc-sh2) !important;
  --mtc-pra-shadow-lg: var(--mtc-sh3) !important;
  --mtc-pra-sidebar-w: 262px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   SOCLE
   ═══════════════════════════════════════════════════════════════════ */

body.mtc-pra-app-body { background: var(--mtc-paper); }
.mtc-pra, .mtc-pra-main { background: var(--mtc-paper); font-family: var(--mtc-sans); color: var(--mtc-ink); }
.mtc-pra :is(h1,h2,h3) { font-family: var(--mtc-serif); font-weight: 600; letter-spacing: -.012em; }
.mtc-pra-main { padding: var(--mtc-s6) var(--mtc-s8) var(--mtc-s10); }
.mtc-pra-main > * { max-width: 1180px; }

/* Le chinois, partout : gris tiède, léger, jamais rouge. */
.mtc-pra .mtc-zh-label,
.mtc-pra [lang="zh"] {
  font-family: var(--mtc-zh);
  color: var(--mtc-ink4);
  font-weight: 400;
  font-size: .94em;
  opacity: 1;
}

/* ═══════════════════════════════════════════════════════════════════
   RAIL
   Les sélecteurs sont préfixés .mtc-pra-sidebar pour dépasser la
   spécificité (0,2,0) de la feuille historique, qui cible le rail de la
   même façon. Une règle à un seul niveau y perdait en silence.
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra-sidebar {
  background: linear-gradient(180deg, var(--mtc-rail) 0%, var(--mtc-rail-2) 100%) !important;
  border-right: none !important;
  color: var(--mtc-rail-ink);
}

/* Toute étiquette du rail suit la couleur de son parent. Sans cette
   règle, .mtc-zh-label garde sa teinte de page claire et disparaît. */
.mtc-pra-sidebar .mtc-fr-label,
.mtc-pra-sidebar .mtc-zh-label,
.mtc-pra-sidebar [lang="zh"] { color: inherit !important; opacity: 1 !important; }
.mtc-pra-sidebar .mtc-zh-label { font-size: .92em; opacity: .72 !important; }

.mtc-pra-sidebar-brand {
  border-bottom: 1px solid var(--mtc-rail-line) !important;
  padding: var(--mtc-s5) var(--mtc-s4) !important;
}
.mtc-pra-sidebar .mtc-pra-brand { color: var(--mtc-rail-ink); gap: var(--mtc-s3); }
.mtc-pra-sidebar .mtc-pra-brand-text strong {
  color: var(--mtc-rail-ink) !important;
  font-family: var(--mtc-serif);
  font-size: 1.08rem !important;
  font-weight: 600;
  letter-spacing: -.01em;
}
.mtc-pra-sidebar .mtc-pra-brand-text small {
  color: var(--mtc-rail-ink3) !important;
  font-size: .62rem !important;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.mtc-pra-sidebar .mtc-pra-brand-glyph {
  background: var(--mtc-r600);
  color: #fff;
  width: 34px; height: 34px;
  border-radius: var(--mtc-r-sm);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--mtc-zh);
  font-size: 1.1rem;
  flex-shrink: 0;
}

.mtc-pra-sidebar .mtc-pra-nav-group { margin-bottom: var(--mtc-s4) !important; }
.mtc-pra-sidebar .mtc-pra-nav-group-label {
  color: var(--mtc-rail-ink3) !important;
  font-size: .63rem !important;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: var(--mtc-s3) var(--mtc-s4) var(--mtc-s2) !important;
}

.mtc-pra-sidebar .mtc-pra-side-link {
  color: var(--mtc-rail-ink2) !important;
  background: transparent;
  border-left: 0 !important;
  border-radius: var(--mtc-r-sm);
  margin: 1px var(--mtc-s2);
  padding: .44rem .6rem !important;
  gap: .6rem !important;
  font-size: .875rem;
  font-weight: 500;
  position: relative;
}
.mtc-pra-sidebar .mtc-pra-side-link:hover {
  background: var(--mtc-rail-hover) !important;
  color: var(--mtc-rail-ink) !important;
}
.mtc-pra-sidebar .mtc-pra-side-link.is-active {
  background: var(--mtc-rail-act) !important;
  color: #fff !important;
  font-weight: 600;
}
.mtc-pra-sidebar .mtc-pra-side-link.is-active::before {
  content: '';
  position: absolute; left: -var(--mtc-s2); top: 20%; bottom: 20%; left: -6px;
  width: 3px; border-radius: 3px;
  background: var(--mtc-r500);
}
.mtc-pra-sidebar .mtc-pra-side-label {
  flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mtc-pra-sidebar .mtc-pra-side-glyph {
  color: inherit !important;
  opacity: .62;
  font-family: var(--mtc-zh);
  width: 20px !important;
  font-size: .95rem !important;
}
.mtc-pra-sidebar .mtc-pra-side-link.is-active .mtc-pra-side-glyph { opacity: 1; color: var(--mtc-r400) !important; }
.mtc-pra-sidebar .mtc-pra-side-badge {
  background: var(--mtc-r600); color: #fff;
  border-radius: var(--mtc-r-pill);
  font-size: .66rem; padding: 1px 7px;
}

/* Pied du rail — la feuille historique le force en crème. */
.mtc-pra-sidebar-footer,
.mtc-pra-sidebar .mtc-pra-sidebar-footer {
  background: rgba(0,0,0,.20) !important;
  border-top: 1px solid var(--mtc-rail-line) !important;
  padding: var(--mtc-s3) var(--mtc-s3) !important;
  gap: var(--mtc-s3) !important;
}
.mtc-pra-sidebar-footer .mtc-pra-side-user { background: transparent !important; padding: 0 !important; }
.mtc-pra-sidebar-footer .mtc-pra-side-user-info strong { color: var(--mtc-rail-ink); font-size: .82rem; }
.mtc-pra-sidebar-footer .mtc-pra-side-user-info small,
.mtc-pra-sidebar-footer .mtc-pra-side-user small { color: var(--mtc-rail-ink3); font-size: .7rem; }
.mtc-pra-sidebar .mtc-pra-avatar--sm {
  background: var(--mtc-r700); color: #fff;
  width: 30px; height: 30px; border-radius: var(--mtc-r-pill);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .72rem; font-weight: 600;
}
.mtc-pra-sidebar .mtc-pra-side-action {
  color: var(--mtc-rail-ink2); background: transparent;
  border-radius: var(--mtc-r-sm);
}
.mtc-pra-sidebar .mtc-pra-side-action:hover { background: var(--mtc-rail-hover); color: #fff; }

.mtc-pra-sidebar .mtc-pra-lang-toggle {
  background: rgba(0,0,0,.28);
  border: 1px solid var(--mtc-rail-line);
  border-radius: var(--mtc-r-pill);
  padding: 2px !important;
}
.mtc-pra-sidebar .mtc-pra-lang-btn {
  color: var(--mtc-rail-ink3) !important;
  background: transparent; border: 0;
  border-radius: var(--mtc-r-pill) !important;
  font-size: .74rem !important;
}
.mtc-pra-sidebar .mtc-pra-lang-btn:hover { color: var(--mtc-rail-ink); }
.mtc-pra-sidebar .mtc-pra-lang-btn.is-active { background: var(--mtc-r600) !important; color: #fff !important; }
.mtc-pra-sidebar .mtc-pra-sidebar-close { color: var(--mtc-rail-ink2); }

/* Barre mobile */
.mtc-pra-topbar {
  background: var(--mtc-rail);
  border-bottom: 1px solid var(--mtc-rail-line);
  color: var(--mtc-rail-ink);
}
.mtc-pra-topbar .mtc-pra-topbar-brand,
.mtc-pra-topbar .mtc-pra-topbar-brand strong { color: var(--mtc-rail-ink); }
.mtc-pra-topbar .mtc-pra-burger span { background: var(--mtc-rail-ink); }
.mtc-pra-topbar .mtc-pra-search-input {
  background: rgba(255,255,255,.08);
  border: 1px solid var(--mtc-rail-line);
  color: var(--mtc-rail-ink);
  border-radius: var(--mtc-r-pill);
}
.mtc-pra-topbar .mtc-pra-search-input::placeholder { color: var(--mtc-rail-ink3); }

/* ═══════════════════════════════════════════════════════════════════
   CARTOUCHE PATIENT
   Le bandeau sombre qui ouvre tout écran rattaché à un dossier. On y
   lit qui est la personne sans descendre dans la page, et il reste
   identique d'un écran à l'autre : c'est ce qui dit « tu es toujours
   dans le même dossier » quand on passe de la fiche à l'anamnèse.
   ═══════════════════════════════════════════════════════════════════ */

.mtc-cartouche {
  background: linear-gradient(135deg, var(--mtc-rail-card) 0%, var(--mtc-rail) 100%);
  color: var(--mtc-rail-ink);
  border-radius: var(--mtc-r-lg);
  padding: var(--mtc-s5) var(--mtc-s6);
  margin-bottom: var(--mtc-s5);
  display: flex;
  gap: var(--mtc-s6);
  align-items: flex-start;
  box-shadow: var(--mtc-sh2);
}
.mtc-cartouche-corps { flex: 1; min-width: 0; }

.mtc-cartouche-nom {
  font-family: var(--mtc-serif);
  font-size: 1.85rem;
  font-weight: 600;
  line-height: 1.1;
  margin: 0 0 var(--mtc-s2);
  color: #fff;
  letter-spacing: -.02em;
  display: flex; align-items: baseline; gap: var(--mtc-s3); flex-wrap: wrap;
}
.mtc-cartouche-nom .mtc-cartouche-zh {
  font-family: var(--mtc-zh);
  font-size: .58em;
  color: var(--mtc-rail-ink2);
  font-weight: 400;
  letter-spacing: 0;
}
.mtc-cartouche-code {
  font-family: var(--mtc-mono);
  font-size: .62rem;
  letter-spacing: .06em;
  background: rgba(255,255,255,.10);
  border: 1px solid var(--mtc-rail-line);
  border-radius: var(--mtc-r-pill);
  padding: .2em .7em;
  color: var(--mtc-rail-ink2);
  white-space: nowrap;
  align-self: center;
}

.mtc-cartouche-faits {
  font-size: .88rem;
  color: var(--mtc-rail-ink2);
  margin: 0 0 var(--mtc-s2);
  line-height: 1.6;
}
.mtc-cartouche-faits strong { color: var(--mtc-rail-ink); font-weight: 600; }
/* Le séparateur restait la dernière opacité posée sur du texte (2,15:1).
   Une encre propre dit la même chose. */
.mtc-cartouche-faits .sep { color: var(--mtc-rail-ink3); opacity: 1; margin: 0 .45em; }

.mtc-cartouche-contact { font-size: .84rem; color: var(--mtc-rail-ink2); margin: 0; }
.mtc-cartouche-contact a { color: var(--mtc-rail-ink2); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.18); }
.mtc-cartouche-contact a:hover { color: #fff; border-bottom-color: rgba(255,255,255,.5); }

.mtc-cartouche-chips { display: flex; flex-wrap: wrap; gap: var(--mtc-s2); margin-top: var(--mtc-s3); }
.mtc-chip {
  font-size: .76rem;
  padding: .22em .7em;
  border-radius: var(--mtc-r-pill);
  border: 1px solid transparent;
  white-space: nowrap;
}
.mtc-chip--alerte { background: rgba(224,149,141,.16); border-color: rgba(224,149,141,.4); color: #F0C6C1; }
.mtc-chip--info   { background: rgba(255,255,255,.08); border-color: var(--mtc-rail-line); color: var(--mtc-rail-ink2); }

.mtc-cartouche-avatar {
  width: 56px; height: 56px; flex-shrink: 0;
  border-radius: var(--mtc-r-md);
  background: linear-gradient(145deg, var(--mtc-r600), var(--mtc-r800));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mtc-serif);
  font-size: 1.25rem; font-weight: 600;
}

/* Panneau de droite : prochain rendez-vous, état de la fiche… */
.mtc-cartouche-panneau {
  flex-shrink: 0;
  min-width: 190px;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--mtc-rail-line);
  border-radius: var(--mtc-r-md);
  padding: var(--mtc-s3) var(--mtc-s4);
}
.mtc-cartouche-panneau + .mtc-cartouche-panneau { margin-top: var(--mtc-s2); }
.mtc-cartouche-panneau-lib {
  font-size: .62rem; text-transform: uppercase; letter-spacing: .12em;
  color: var(--mtc-rail-ink3); display: block; margin-bottom: 3px;
}
.mtc-cartouche-panneau-val { font-size: .95rem; color: #fff; font-weight: 600; display: block; }
.mtc-cartouche-panneau-sub { font-size: .76rem; color: var(--mtc-rail-ink2); display: block; margin-top: 2px; }
.mtc-cartouche-cols { display: flex; flex-direction: column; gap: var(--mtc-s2); flex-shrink: 0; }

.mtc-cartouche-actions { display: flex; gap: var(--mtc-s2); flex-wrap: wrap; margin-top: var(--mtc-s4); }
.mtc-cartouche .mtc-pra-btn--ghost {
  background: rgba(255,255,255,.08);
  border-color: var(--mtc-rail-line);
  color: var(--mtc-rail-ink);
}
.mtc-cartouche .mtc-pra-btn--ghost:hover { background: rgba(255,255,255,.14); color: #fff; }

@media (max-width: 900px) {
  .mtc-cartouche { flex-direction: column; gap: var(--mtc-s4); }
  .mtc-cartouche-cols { flex-direction: row; flex-wrap: wrap; width: 100%; }
  .mtc-cartouche-panneau { flex: 1; min-width: 150px; }
}

/* ═══════════════════════════════════════════════════════════════════
   CARTES ET TITRES
   La feuille historique les fige en `section.mtc-pra-card, .mtc-pra-card
   { … !important }` — spécificité (0,1,1). Les sélecteurs ci-dessous
   l'égalent et arrivent après.
   ═══════════════════════════════════════════════════════════════════ */

section.mtc-pra-card,
.mtc-pra .mtc-pra-card,
.mtc-pra-card {
  padding: var(--mtc-s6) !important;
  margin-bottom: var(--mtc-s4) !important;
  background: var(--mtc-surface) !important;
  border: 1px solid var(--mtc-line) !important;
  border-radius: var(--mtc-r-lg) !important;
  box-shadow: var(--mtc-sh1);
}

section.mtc-pra-card .mtc-pra-card-title,
.mtc-pra .mtc-pra-card-title,
.mtc-pra-card-title {
  font-family: var(--mtc-serif) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--mtc-ink) !important;
  margin: 0 0 var(--mtc-s4) !important;
  padding-bottom: var(--mtc-s3) !important;
  border-bottom: 1px solid var(--mtc-line) !important;
}

main.mtc-pra-main,
.mtc-pra .mtc-pra-main,
.mtc-pra-main {
  padding: var(--mtc-s6) var(--mtc-s8) var(--mtc-s10) !important;
  background: var(--mtc-paper) !important;
}
.mtc-pra-main > * { max-width: 1240px !important; }

.mtc-pra-card-ancien {
  background: var(--mtc-surface);
  border: 1px solid var(--mtc-line);
  border-radius: var(--mtc-r-lg);
  box-shadow: var(--mtc-sh1);
  padding: var(--mtc-s6);
  margin-bottom: var(--mtc-s4);
}
/* Aucun liseré de couleur sur les cartes : c'est la hiérarchie
   typographique qui distingue les sections, pas un code couleur qui
   finit par en compter six. */
.mtc-pra-card--diagnostic,
.mtc-pra-card--visites,
.mtc-pra-card--consent,
.mtc-pra-card--document,
.mtc-pra-card--saisie { border-left: 1px solid var(--mtc-line); background: var(--mtc-surface); }
.mtc-pra-card--saisie { background: var(--mtc-sunken); }

.mtc-pra-card-title {
  display: flex; align-items: baseline; gap: var(--mtc-s2); flex-wrap: wrap;
  font-size: 1rem; color: var(--mtc-ink);
  margin: 0 0 var(--mtc-s4);
  padding-bottom: var(--mtc-s3);
  border-bottom: 1px solid var(--mtc-line);
}
.mtc-pra-card-title-meta { color: var(--mtc-ink4); font-weight: 400; font-family: var(--mtc-sans); font-size: .76rem; }

.mtc-pra-page-header {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--mtc-s4); flex-wrap: wrap; margin-bottom: var(--mtc-s5);
}
.mtc-pra-h1 { font-size: 1.5rem; margin: 0; }
.mtc-pra-page-meta { font-size: .82rem; color: var(--mtc-ink3); margin: 0; }
.mtc-pra-section-zh { color: var(--mtc-ink4); font-size: .7em; margin-left: .35em; font-family: var(--mtc-zh); }

.mtc-pra-back { display: inline-block; font-size: .82rem; color: var(--mtc-ink3); text-decoration: none; margin-bottom: var(--mtc-s3); }
.mtc-pra-back:hover { color: var(--mtc-r600); }

/* ═══════════════════════════════════════════════════════════════════
   DIAGNOSTIC, VISITES
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra-diag-text {
  font-family: var(--mtc-serif);
  font-size: 1.04rem; line-height: 1.62; color: var(--mtc-ink);
  margin: 0 0 var(--mtc-s3);
}
.mtc-pra-diag-text--zh {
  font-family: var(--mtc-zh); color: var(--mtc-ink3); font-size: .95rem;
  padding-top: var(--mtc-s3); border-top: 1px solid var(--mtc-line);
}
.mtc-pra-diag-sources { display: flex; gap: var(--mtc-s4); font-size: .8rem; margin: var(--mtc-s3) 0 0; }
.mtc-pra-diag-sources a { color: var(--mtc-ink3); text-decoration: none; border-bottom: 1px dotted var(--mtc-line2); }
.mtc-pra-diag-sources a:hover { color: var(--mtc-r600); }
.mtc-pra-diag-edit { margin-top: var(--mtc-s5); border-top: 1px solid var(--mtc-line); padding-top: var(--mtc-s3); }
.mtc-pra-diag-edit summary { cursor: pointer; font-size: .82rem; color: var(--mtc-ink3); }
.mtc-pra-diag-edit summary:hover { color: var(--mtc-r600); }

.mtc-pra-visites { list-style: none; margin: 0; padding: 0; }
.mtc-pra-visite {
  display: grid; grid-template-columns: 92px 1fr auto 20px;
  align-items: baseline; gap: var(--mtc-s3);
  padding: var(--mtc-s3) var(--mtc-s2);
  border-bottom: 1px solid var(--mtc-line);
  font-size: .88rem;
  border-radius: var(--mtc-r-sm);
}
.mtc-pra-visite:last-child { border-bottom: 0; }
.mtc-pra-visite:hover { background: var(--mtc-sunken); }
.mtc-pra-visite-date { font-family: var(--mtc-mono); font-size: .76rem; color: var(--mtc-ink4); white-space: nowrap; }
.mtc-pra-visite-corps { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mtc-pra-visite-titre { color: var(--mtc-ink); font-weight: 500; }
.mtc-pra-visite-num { font-family: var(--mtc-mono); font-size: .72rem; color: var(--mtc-ink4); margin-right: .3em; }
.mtc-pra-visite-detail { color: var(--mtc-ink3); font-size: .82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mtc-pra-visite-zh { color: var(--mtc-ink4); font-size: .82rem; font-family: var(--mtc-zh); }
.mtc-pra-visite-lien { text-decoration: none; color: var(--mtc-ink4); font-size: 1rem; text-align: right; }
.mtc-pra-visite-lien:hover { color: var(--mtc-r600); }
.mtc-pra-visite.is-premiere .mtc-pra-visite-date::before { content: '◆'; color: var(--mtc-gold); margin-right: .35em; font-size: .7em; }

@media (max-width: 640px) {
  .mtc-pra-visite { grid-template-columns: 1fr auto; row-gap: 2px; }
  .mtc-pra-visite-date { grid-column: 1 / -1; }
}

/* ═══════════════════════════════════════════════════════════════════
   AGENDA
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra-agenda-toolbar { display: flex; align-items: center; justify-content: space-between; gap: var(--mtc-s4); flex-wrap: wrap; margin-bottom: var(--mtc-s3); }
.mtc-pra-agenda-week-label { font-family: var(--mtc-serif); font-size: 1.02rem; color: var(--mtc-ink2); }
.mtc-pra-agenda-legend { display: flex; gap: var(--mtc-s5); flex-wrap: wrap; font-size: .76rem; color: var(--mtc-ink3); margin-bottom: var(--mtc-s3); }
.mtc-pra-agenda-dot { width: 9px; height: 9px; border-radius: 3px; display: inline-block; margin-right: .35em; }
.mtc-pra-agenda-dot--mtc { background: var(--mtc-r600); }
.mtc-pra-agenda-dot--onedoc { background: var(--mtc-amber); }
.mtc-pra-agenda-dot--gcal { background: var(--mtc-sky); }

.mtc-pra-agenda-grid { background: var(--mtc-surface); border: 1px solid var(--mtc-line); border-radius: var(--mtc-r-lg); box-shadow: var(--mtc-sh1); overflow: hidden; }
.mtc-pra-agenda-col-header { background: var(--mtc-sunken); border-bottom: 1px solid var(--mtc-line); color: var(--mtc-ink2); }
.mtc-pra-agenda-col.is-today .mtc-pra-agenda-col-header { background: var(--mtc-r50); color: var(--mtc-r700); box-shadow: inset 0 -2px 0 var(--mtc-r600); }
.mtc-pra-agenda-hour-line { border-top: 1px solid var(--mtc-line); }
.mtc-pra-agenda-hour-label { color: var(--mtc-ink4); font-family: var(--mtc-mono); font-size: .72rem; }

.mtc-pra-agenda-event {
  position: absolute; left: 3px; right: 3px;
  display: flex; flex-direction: column; gap: 1px;
  padding: 3px 6px; border: 0; border-left: 3px solid currentColor;
  border-radius: var(--mtc-r-sm);
  font: inherit; font-size: .74rem; text-align: left; cursor: pointer; overflow: hidden;
  transition: transform .08s ease, box-shadow .12s ease;
}
.mtc-pra-agenda-event:hover { transform: translateX(1px); box-shadow: var(--mtc-sh2); z-index: 5; }
.mtc-pra-agenda-event strong { font-family: var(--mtc-mono); font-size: .7rem; opacity: .85; }
.mtc-pra-agenda-event-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mtc-pra-agenda-event small { opacity: .75; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mtc-pra-agenda-event--mtc { background: var(--mtc-r100); color: var(--mtc-r700); }
.mtc-pra-agenda-event--onedoc { background: var(--mtc-amber-bg); color: var(--mtc-amber); }
.mtc-pra-agenda-event--gcal { background: var(--mtc-sky-bg); color: var(--mtc-sky); }
.mtc-pra-agenda-event.is-orphelin { border-left-style: dashed; box-shadow: inset 0 0 0 1px var(--mtc-amber-line); }
.mtc-pra-agenda-event.is-cancelled { opacity: .45; text-decoration: line-through; }
.mtc-pra-agenda-event.is-done { opacity: .72; }
.mtc-pra-agenda-event-flag { position: absolute; top: 2px; right: 4px; font-size: .62rem; opacity: .6; }
.mtc-pra-agenda-slot-hover {
  position: absolute; left: 3px; right: 3px;
  background: var(--mtc-r50); border: 1px dashed var(--mtc-r300);
  border-radius: var(--mtc-r-sm); color: var(--mtc-r600);
  font-size: .7rem; font-family: var(--mtc-mono); padding-left: 5px; pointer-events: none;
}
.mtc-pra-agenda-footnote { display: flex; align-items: center; gap: var(--mtc-s3); margin-top: var(--mtc-s4); }
.mtc-pra-agenda-hint { font-size: .78rem; color: var(--mtc-ink4); }
.mtc-pra-linkbtn { background: none; border: 0; padding: 0; color: var(--mtc-r600); cursor: pointer; font: inherit; font-size: .82rem; }
.mtc-pra-linkbtn:hover { color: var(--mtc-r700); text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════════════
   PANNEAU LATÉRAL
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra-drawer-backdrop { position: fixed; inset: 0; background: rgba(23,21,19,.42); opacity: 0; transition: opacity .2s ease; z-index: 900; }
.mtc-pra-drawer-backdrop.is-open { opacity: 1; }
.mtc-pra-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(470px, 100vw);
  background: var(--mtc-surface); border-left: 1px solid var(--mtc-line);
  box-shadow: var(--mtc-sh3); display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform .22s cubic-bezier(.32,.72,0,1); z-index: 950;
}
.mtc-pra-drawer.is-open { transform: translateX(0); }
.mtc-pra-drawer-header {
  display: flex; align-items: center; justify-content: space-between; gap: var(--mtc-s3);
  padding: var(--mtc-s4) var(--mtc-s5); border-bottom: 1px solid var(--mtc-line);
  background: var(--mtc-sunken); flex-shrink: 0;
}
.mtc-pra-drawer-title { font-size: 1rem; margin: 0; color: var(--mtc-ink); }
.mtc-pra-drawer-body { flex: 1; overflow-y: auto; padding: var(--mtc-s5); }
.mtc-pra-drawer-patient { display: flex; gap: var(--mtc-s4); align-items: flex-start; margin-bottom: var(--mtc-s5); }
.mtc-pra-drawer-name { font-size: 1.2rem; margin: 0 0 .15rem; }
.mtc-pra-drawer-name-zh { color: var(--mtc-ink4); font-size: .82em; margin-left: .4em; font-family: var(--mtc-zh); }
.mtc-pra-drawer-meta { font-size: .8rem; color: var(--mtc-ink3); margin: 0; }
.mtc-pra-drawer-actions { display: flex; gap: var(--mtc-s2); flex-wrap: wrap; margin: var(--mtc-s3) 0 0; }
.mtc-pra-drawer-section { margin-bottom: var(--mtc-s6); }
.mtc-pra-drawer-section--form { background: var(--mtc-sunken); border: 1px solid var(--mtc-line); border-radius: var(--mtc-r-md); padding: var(--mtc-s4); }
.mtc-pra-drawer-h4 {
  display: flex; align-items: baseline; gap: var(--mtc-s2); flex-wrap: wrap;
  font-family: var(--mtc-serif); font-size: .94rem; color: var(--mtc-ink2);
  margin: 0 0 var(--mtc-s3); padding-bottom: var(--mtc-s2); border-bottom: 1px solid var(--mtc-line);
}
.mtc-pra-drawer-h4 small { font-family: var(--mtc-mono); font-size: .7rem; color: var(--mtc-ink4); font-weight: 400; }
.mtc-pra-drawer-sep { border: 0; border-top: 1px solid var(--mtc-line); margin: var(--mtc-s5) 0; }
.mtc-pra-drawer-submit { display: flex; align-items: center; gap: var(--mtc-s3); margin-top: var(--mtc-s4); }
.mtc-pra-drawer-sync { font-size: .76rem; color: var(--mtc-jade); margin: var(--mtc-s3) 0 0; }
.mtc-pra-drawer-sync--error { color: var(--mtc-rose); }
.mtc-pra-avatar--ext { background: linear-gradient(145deg, var(--mtc-amber), #6B4408); }
@media (max-width: 520px) { .mtc-pra-drawer { width: 100vw; } }

/* ═══════════════════════════════════════════════════════════════════
   FORMULAIRES
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra-field-label { font-size: .78rem; color: var(--mtc-ink3); display: block; margin-bottom: 4px; line-height: 1.35; }
.mtc-pra-field-label abbr { color: var(--mtc-r600); text-decoration: none; margin-left: .15em; }

.mtc-pra-adm-grille { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--mtc-s4); align-items: start; }
.mtc-pra-adm-w1 { grid-column: span 1; } .mtc-pra-adm-w2 { grid-column: span 2; }
.mtc-pra-adm-w3 { grid-column: span 3; } .mtc-pra-adm-w4 { grid-column: span 4; }
.mtc-pra-adm-w5 { grid-column: span 5; } .mtc-pra-adm-w6 { grid-column: 1 / -1; }
.mtc-pra-adm-champ { min-width: 0; display: flex; flex-direction: column; gap: 3px; }

.mtc-pra-adm-champ > input,
.mtc-pra-bilingue-pair textarea,
.mtc-pra-adm-lignes input,
.mtc-pra-field input,
.mtc-pra-field select,
.mtc-pra-field textarea {
  width: 100%; font: inherit; font-size: .9rem;
  padding: .42em .6em;
  border: 1px solid var(--mtc-line2);
  border-radius: var(--mtc-r-sm);
  background: var(--mtc-surface);
  color: var(--mtc-ink);
}
.mtc-pra-adm-champ > input:focus,
.mtc-pra-bilingue-pair textarea:focus,
.mtc-pra-adm-lignes input:focus,
.mtc-pra-field input:focus,
.mtc-pra-field select:focus,
.mtc-pra-field textarea:focus {
  outline: none; border-color: var(--mtc-r400);
  box-shadow: 0 0 0 3px var(--mtc-r100);
}
.mtc-pra-adm-champ > input[lang="zh"],
.mtc-pra-field--zh textarea { font-family: var(--mtc-zh); background: var(--mtc-sunken); }

.mtc-pra-adm-radios { display: flex; flex-wrap: wrap; gap: .3rem .9rem; align-items: center; padding-top: .2rem; }
.mtc-pra-checkbox { display: inline-flex; align-items: center; gap: .35em; font-size: .85rem; margin: 0; }
.mtc-pra-adm-clear { font-size: .7rem; color: var(--mtc-ink4); }

.mtc-pra-adm-lignes { width: 100%; border-collapse: collapse; }
.mtc-pra-adm-lignes th { text-align: left; font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: var(--mtc-ink4); font-weight: 500; padding: 0 0 2px; }
.mtc-pra-adm-lignes td { padding: 2px 4px 2px 0; }

.mtc-pra-bilingue-pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--mtc-s3); position: relative; }
.mtc-pra-bilingue-pair .mtc-pra-field { margin: 0; }
.mtc-pra-field-lang { display: inline-block; font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; color: var(--mtc-ink4); margin-bottom: 2px; }
.mtc-pra-bilingue-pair textarea.is-translating {
  background-image: linear-gradient(90deg, transparent 0%, var(--mtc-sunken) 50%, transparent 100%);
  background-size: 200% 100%; animation: mtc-shimmer 1.1s linear infinite;
}
@keyframes mtc-shimmer { to { background-position: -200% 0; } }
.mtc-pra-trad-status { grid-column: 1 / -1; font-size: .7rem; color: var(--mtc-ink4); min-height: 1em; }
.mtc-pra-trad-status.is-ok { color: var(--mtc-jade); }
.mtc-pra-trad-status.is-error { color: var(--mtc-rose); }

.mtc-pra-question { padding: var(--mtc-s3) 0; border-bottom: 1px solid var(--mtc-line); }
.mtc-pra-question:last-child { border-bottom: 0; }
.mtc-pra-question-label { display: flex; gap: var(--mtc-s3); flex-wrap: wrap; align-items: baseline; font-size: .87rem; color: var(--mtc-ink2); margin-bottom: var(--mtc-s2); }

.mtc-pra-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--mtc-s4); }
.mtc-pra-form-submit {
  display: flex; align-items: center; justify-content: flex-end; gap: var(--mtc-s3); flex-wrap: wrap;
  padding: var(--mtc-s4) 0 var(--mtc-s8);
  background: transparent;
}

@media (max-width: 860px) {
  .mtc-pra-adm-grille { grid-template-columns: repeat(2, 1fr); }
  .mtc-pra-adm-w3, .mtc-pra-adm-w4, .mtc-pra-adm-w5 { grid-column: 1 / -1; }
}
@media (max-width: 720px) { .mtc-pra-bilingue-pair { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .mtc-pra-adm-grille { grid-template-columns: 1fr; }
  .mtc-pra-adm-champ { grid-column: 1 / -1 !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   CONSENTEMENTS ET PARCOURS
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra-consent {
  display: grid; grid-template-columns: 1.4rem 1fr; gap: .6rem; align-items: start;
  padding: var(--mtc-s3) 0; border-bottom: 1px solid var(--mtc-line);
}
.mtc-pra-consent:last-of-type { border-bottom: 0; }
.mtc-pra-consent input[type="checkbox"] { margin-top: .2rem; width: 1rem; height: 1rem; }
.mtc-pra-consent strong { font-size: .9rem; color: var(--mtc-ink); }
.mtc-pra-consent-opt { font-size: .72rem; color: var(--mtc-ink4); margin-left: .4em; font-style: italic; }
.mtc-pra-consent-texte { display: block; margin-top: .3rem; font-size: .8rem; line-height: 1.55; color: var(--mtc-ink3); }

.mtc-pra-etapes { margin: 0; padding-left: 1.3rem; }
.mtc-pra-etapes li { padding: var(--mtc-s3) 0; border-bottom: 1px solid var(--mtc-line); font-size: .87rem; color: var(--mtc-ink2); }
.mtc-pra-etapes li:last-child { border-bottom: 0; }
.mtc-pra-etapes li::marker { color: var(--mtc-ink4); font-weight: 600; }
.mtc-pra-etapes input[type="file"] { font-size: .8rem; max-width: 100%; }

/* ═══════════════════════════════════════════════════════════════════
   NOTICES, BADGES, BOUTONS
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra-notice { border-radius: var(--mtc-r-md); padding: var(--mtc-s3) var(--mtc-s4); font-size: .86rem; margin-bottom: var(--mtc-s4); border: 1px solid transparent; }
.mtc-pra-notice--success { background: var(--mtc-jade-bg); border-color: var(--mtc-jade-line); color: var(--mtc-jade); }
.mtc-pra-notice--error   { background: var(--mtc-rose-bg); border-color: var(--mtc-rose-line); color: var(--mtc-rose); }
.mtc-pra-notice--warn    { background: var(--mtc-amber-bg); border-color: var(--mtc-amber-line); color: var(--mtc-amber); }
.mtc-pra-notice--info    { background: var(--mtc-sky-bg); border-color: var(--mtc-sky-line); color: var(--mtc-sky); }
.mtc-pra-notice a { color: inherit; }

.mtc-pra-badge {
  display: inline-block; font-size: .68rem; padding: .16em .6em;
  border-radius: var(--mtc-r-pill); background: var(--mtc-sunken); color: var(--mtc-ink3);
  font-family: var(--mtc-sans); font-weight: 500; white-space: nowrap;
  border: 1px solid var(--mtc-line);
}
.mtc-pra-badge--ongoing   { background: var(--mtc-sky-bg);  color: var(--mtc-sky);   border-color: var(--mtc-sky-line); }
.mtc-pra-badge--closed    { background: var(--mtc-jade-bg); color: var(--mtc-jade);  border-color: var(--mtc-jade-line); }
.mtc-pra-badge--scheduled { background: var(--mtc-amber-bg);color: var(--mtc-amber); border-color: var(--mtc-amber-line); }
.mtc-pra-badge--cancelled { background: var(--mtc-rose-bg); color: var(--mtc-rose);  border-color: var(--mtc-rose-line); }
.mtc-pra-badge--ext       { background: var(--mtc-sky-bg);  color: var(--mtc-sky);   border-color: var(--mtc-sky-line); }

.mtc-pra-inline-status { font-size: .78rem; color: var(--mtc-ink4); margin-left: var(--mtc-s2); }
.mtc-pra-inline-status.is-ok { color: var(--mtc-jade); }
.mtc-pra-inline-status.is-error { color: var(--mtc-rose); }
.mtc-pra-empty-soft { color: var(--mtc-ink4); font-size: .86rem; font-style: italic; margin: 0; }
.mtc-pra-help-text { color: var(--mtc-ink3); font-size: .8rem; margin: var(--mtc-s2) 0 0; }

.mtc-pra-btn {
  display: inline-flex; align-items: center; gap: .4em;
  border-radius: var(--mtc-r-sm); font-family: var(--mtc-sans);
  font-size: .86rem; font-weight: 500; padding: .48em 1em;
  border: 1px solid transparent; cursor: pointer; text-decoration: none !important;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.mtc-pra-btn--primary { background: var(--mtc-r600); color: #fff; border-color: var(--mtc-r700); }
.mtc-pra-btn--primary:hover { background: var(--mtc-r700); color: #fff; }
.mtc-pra-btn--ghost { background: var(--mtc-surface); color: var(--mtc-ink2); border-color: var(--mtc-line2); }
.mtc-pra-btn--ghost:hover { background: var(--mtc-sunken); color: var(--mtc-ink); }
.mtc-pra-btn--small { font-size: .78rem; padding: .36em .75em; }
.mtc-pra-btn[disabled] { opacity: .5; cursor: not-allowed; }
.mtc-pra-btn .mtc-zh-label { opacity: .62; }
.mtc-pra-btn--primary .mtc-zh-label { color: rgba(255,255,255,.72) !important; }

.mtc-pra-dialog {
  border: 1px solid var(--mtc-line); border-radius: var(--mtc-r-lg);
  box-shadow: var(--mtc-sh3); padding: var(--mtc-s5);
  max-width: 640px; width: calc(100vw - 2rem);
  background: var(--mtc-surface); color: var(--mtc-ink);
}
.mtc-pra-dialog::backdrop { background: rgba(23,21,19,.42); }
.mtc-pra-dialog-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--mtc-s4); padding-bottom: var(--mtc-s3); border-bottom: 1px solid var(--mtc-line); }
.mtc-pra-dialog-header h2 { font-size: 1.05rem; margin: 0; }
.mtc-pra-dialog-close { background: none; border: 0; font-size: 1.4rem; line-height: 1; color: var(--mtc-ink4); cursor: pointer; }
.mtc-pra-dialog-close:hover { color: var(--mtc-r600); }

.mtc-pra-ac-dropdown {
  list-style: none; margin: 0; padding: var(--mtc-s1);
  background: var(--mtc-surface); border: 1px solid var(--mtc-line2);
  border-radius: var(--mtc-r-md); box-shadow: var(--mtc-sh2);
  max-height: 280px; overflow-y: auto;
}
.mtc-pra-ac-item { padding: var(--mtc-s2) var(--mtc-s3); border-radius: var(--mtc-r-sm); cursor: pointer; font-size: .84rem; }
.mtc-pra-ac-item:hover, .mtc-pra-ac-item.is-active { background: var(--mtc-sunken); }
.mtc-pra-ac-item small { color: var(--mtc-ink4); }
.mtc-pra-ac-fr { color: var(--mtc-ink3); font-size: .78rem; }
.mtc-pra-ac-dropdown--empty { padding: var(--mtc-s3); color: var(--mtc-ink4); font-size: .82rem; font-style: italic; }
.mtc-pra-field--ac { position: relative; }

.mtc-pra-dl { display: grid; grid-template-columns: minmax(120px, 200px) 1fr; gap: var(--mtc-s2) var(--mtc-s4); margin: 0; font-size: .87rem; }
.mtc-pra-dl dt { color: var(--mtc-ink3); }
.mtc-pra-dl dd { margin: 0; color: var(--mtc-ink); }
@media (max-width: 560px) { .mtc-pra-dl { grid-template-columns: 1fr; } .mtc-pra-dl dd { margin-bottom: var(--mtc-s3); } }

.mtc-pra-actions-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: var(--mtc-s3); }
.mtc-pra-action {
  display: flex; align-items: center; gap: var(--mtc-s3);
  padding: var(--mtc-s3) var(--mtc-s4);
  border: 1px solid var(--mtc-line); border-radius: var(--mtc-r-md);
  background: var(--mtc-surface); color: var(--mtc-ink2);
  text-decoration: none; font-size: .86rem;
  transition: border-color .12s ease, background .12s ease;
}
.mtc-pra-action:hover { border-color: var(--mtc-r300); background: var(--mtc-r50); color: var(--mtc-ink); }
.mtc-pra-action-icon { font-family: var(--mtc-zh); font-size: 1.1rem; color: var(--mtc-r600); flex-shrink: 0; }

@media (prefers-reduced-motion: reduce) {
  .mtc-pra-drawer, .mtc-pra-drawer-backdrop, .mtc-pra-agenda-event, .mtc-pra-btn { transition: none; }
  .mtc-pra-bilingue-pair textarea.is-translating { animation: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   GÉNÉRALISATION — v0.14.0

   La 0.13.0 avait refait l'accueil, le rail, le cartouche et la fiche
   de renseignements. Le reste de l'application — agenda, listes,
   séance, référentiels, réglages — vivait encore sur l'ancienne
   charte. Cette section applique la même règle partout, et corrige
   trois mécanismes qui cassaient la lisibilité sur TOUS les écrans à
   la fois. Chacun a été constaté au navigateur, pas déduit.

   ── 1. L'OPACITÉ SE MULTIPLIE ────────────────────────────────────
   Le chinois était rendu discret avec `opacity`. La feuille historique
   pose `.mtc-zh-label { opacity: .85 }` ; la 0.13.0 ajoutait .72 dans
   le rail et .62 dans les boutons. Les couches se composent : .85 × .62
   = .53. Mesuré, le chinois des boutons tombait à 2,69:1 et celui du
   rail à 3,26:1, là où le minimum lisible est 4,5:1.
   Règle désormais : LE CHINOIS EST SECONDAIRE PAR LA TAILLE ET LA
   GRAISSE, JAMAIS PAR L'OPACITÉ. Une couleur explicite par surface —
   page claire, rail sombre, bouton plein — et plus aucune opacité sur
   du texte.

   ── 2. LE GRIS DU CHINOIS ÉTAIT TROP CLAIR ───────────────────────
   #8A847B donne 3,71:1 sur blanc : discret au point d'être illisible.
   #6F6960 donne 5,16:1 sur le papier et reste nettement en retrait du
   noir du français. C'est la teinte retenue.

   ── 3. LES LIENS N'AVAIENT PAS DE COULEUR D'APPLICATION ──────────
   Aucune règle ne définissait la couleur d'un `a` : le lien vers le
   patient, dans la séance, s'affichait en bleu souligné du navigateur.
   Pire, `.mtc-pra-dl a { color: red }` (spécificité 0,1,1) l'emportait
   sur `.mtc-pra-btn--primary` (0,1,0) : un bouton primaire placé dans
   une liste de définitions devenait rouge sur rouge — donc invisible.
   Constaté dans les Réglages, sur « Installer la police chinoise ».
   ═══════════════════════════════════════════════════════════════════ */

:root, body {
  /* Le chinois : gris tiède, lisible, et toujours en retrait. */
  --mtc-zh-ink:      #6F6960;
  --mtc-zh-on-rail:  #A29A91;
  --mtc-zh-on-fill:  rgba(255,255,255,.86);
  /* Le rouge en tant que TEXTE est plus sombre que le rouge de fond :
     #9B1C1C sur papier ne donne que 3,3:1 quand il porte une opacité,
     et reste fragile sur les fonds rosés. */
  --mtc-ink-red:     #7A1D18;
  --mtc-pra-zh: var(--mtc-zh-ink) !important;
}

/* ── 1. Plus une seule opacité sur du texte ───────────────────────── */
.mtc-pra .mtc-zh-label,
.mtc-pra [lang="zh"],
.mtc-pra .mtc-pra-tab-glyph,
.mtc-pra .mtc-pra-coming-glyph,
.mtc-pra .mtc-pra-tech-block,
.mtc-pra .mtc-pra-agenda-event small,
.mtc-pra .mtc-pra-agenda-event strong,
.mtc-pra .mtc-pra-rdv-item--past { opacity: 1 !important; }

.mtc-pra .mtc-zh-label,
.mtc-pra [lang="zh"],
.mtc-pra-main [lang="zh"] {
  color: var(--mtc-zh-ink) !important;
  font-family: var(--mtc-zh);
  font-weight: 400;
  font-size: .93em;
}

/* Le rail et le cartouche sont sombres : le chinois y est clair. */
.mtc-pra-sidebar .mtc-zh-label,
.mtc-pra-sidebar [lang="zh"],
.mtc-pra-bandeau .mtc-zh-label,
.mtc-pra-bandeau [lang="zh"],
.mtc-pra-topbar .mtc-zh-label,
.mtc-cartouche .mtc-zh-label,
.mtc-cartouche [lang="zh"] {
  color: var(--mtc-zh-on-rail) !important;
  opacity: 1 !important;
}
.mtc-pra-sidebar .mtc-pra-side-link.is-active .mtc-zh-label { color: #D8D2CA !important; }
.mtc-pra-sidebar .mtc-pra-side-glyph { opacity: 1 !important; color: var(--mtc-rail-ink3) !important; }
.mtc-pra-sidebar .mtc-pra-side-link:hover .mtc-pra-side-glyph { color: var(--mtc-rail-ink2) !important; }

/* Sur un aplat de couleur — bouton primaire, puce active, badge plein —
   le chinois suit la couleur du texte, en légèrement atténué. */
.mtc-pra .mtc-pra-btn .mtc-zh-label,
.mtc-pra .mtc-pra-btn .mtc-fr-label { color: inherit !important; opacity: 1 !important; }
.mtc-pra .mtc-pra-btn--primary .mtc-zh-label,
.mtc-pra .mtc-pra-lang-btn.is-active .mtc-zh-label,
.mtc-pra .mtc-pra-pbadge--active .mtc-zh-label { color: var(--mtc-zh-on-fill) !important; }

/* ── 2. Liens ─────────────────────────────────────────────────────── */
.mtc-pra a { color: var(--mtc-ink-red); }
.mtc-pra a:hover { color: var(--mtc-r800); }
.mtc-pra-main a:not(.mtc-pra-btn):not(.mtc-pra-action):not(.mtc-pra-side-link) {
  text-decoration-color: var(--mtc-r200);
  text-underline-offset: .18em;
}
/* Un bouton reste un bouton, où qu'il soit posé — y compris dans une
   liste de définitions, dont la règle `a { color: red }` le rendait
   rouge sur rouge. */
.mtc-pra a.mtc-pra-btn--primary,
.mtc-pra .mtc-pra-btn--primary,
.mtc-pra-dl a.mtc-pra-btn--primary { color: #fff !important; }
.mtc-pra a.mtc-pra-btn--ghost,
.mtc-pra .mtc-pra-btn--ghost,
.mtc-pra-dl a.mtc-pra-btn--ghost { color: var(--mtc-ink2) !important; }
.mtc-pra a.mtc-pra-action, .mtc-pra-dl a.mtc-pra-action { color: var(--mtc-ink2) !important; }

/* ── 3. Le rouge comme texte ──────────────────────────────────────── */
.mtc-pra .mtc-pra-red,
.mtc-pra .mtc-pra-code,
.mtc-pra .mtc-pra-pcode,
.mtc-pra .mtc-pra-section-num,
.mtc-pra .mtc-pra-stat-num,
.mtc-pra .mtc-pra-pstat-num { color: var(--mtc-ink-red) !important; }

/* Les compteurs d'onglets étaient posés en opacity: .6 dans le gabarit.
   Une couleur dédiée dit la même chose sans l'illisibilité. */
.mtc-pra .mtc-pra-count,
.mtc-pra .mtc-pra-tab [style*="opacity"],
.mtc-pra .mtc-pra-tabs [style*="opacity"] {
  opacity: 1 !important;
  color: var(--mtc-ink3) !important;
  font-weight: 400;
}

/* ═══════════════════════════════════════════════════════════════════
   ICONOGRAPHIE
   Les écrans mélangeaient des émojis en couleurs (💾 🌐 🤖 📞 ⚙) et des
   idéogrammes monochromes (辨 历 医 针 方 药). Deux systèmes de signes
   sur un même écran, dont l'un apporte ses propres couleurs — c'est ce
   qui donnait l'impression de bariolage. Un seul système désormais :
   l'idéogramme, dans le rouge de marque, à taille fixe.
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra .mtc-glyphe,
.mtc-pra .mtc-pra-action-icon,
.mtc-pra .mtc-pra-tab-glyph,
.mtc-pra .mtc-pra-card-glyph,
.mtc-pra .mtc-pra-section-glyph {
  font-family: var(--mtc-zh);
  font-weight: 400;
  color: var(--mtc-ink-red);
  font-size: 1.02em;
  line-height: 1;
  flex-shrink: 0;
  font-variant-emoji: text;
}
.mtc-pra .mtc-pra-btn .mtc-glyphe { color: inherit; opacity: 1; margin-right: .1em; }
.mtc-pra .mtc-pra-card-title .mtc-glyphe { margin-right: .35em; color: var(--mtc-r600); }

/* ═══════════════════════════════════════════════════════════════════
   LISTES ET TABLEAUX
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra .mtc-pra-table-wrap,
.mtc-pra .mtc-pra-refs-tablewrap { overflow-x: auto; border-radius: var(--mtc-r-md); }
.mtc-pra .mtc-pra-table,
.mtc-pra .mtc-pra-refs-table {
  width: 100%; border-collapse: collapse; font-size: .87rem; background: var(--mtc-surface);
}
.mtc-pra .mtc-pra-table thead th,
.mtc-pra .mtc-pra-refs-table thead th {
  background: var(--mtc-sunken) !important;
  color: var(--mtc-ink3) !important;
  font-size: .68rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase;
  text-align: left; padding: .6rem .8rem;
  border-bottom: 1px solid var(--mtc-line2) !important;
  white-space: nowrap;
}
.mtc-pra .mtc-pra-table tbody td,
.mtc-pra .mtc-pra-refs-table tbody td {
  padding: .68rem .8rem; border-bottom: 1px solid var(--mtc-line) !important;
  color: var(--mtc-ink2); vertical-align: middle;
}
.mtc-pra .mtc-pra-table tbody tr:last-child td { border-bottom: 0 !important; }
.mtc-pra .mtc-pra-table tbody tr:hover { background: var(--mtc-r50); }
.mtc-pra .mtc-pra-td-name strong { color: var(--mtc-ink); font-weight: 600; }
.mtc-pra .mtc-pra-td-name { display: flex; align-items: center; gap: var(--mtc-s3); text-decoration: none; }
.mtc-pra .mtc-pra-td-name-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.mtc-pra .mtc-pra-zh-inline { font-family: var(--mtc-zh); font-size: .78rem; color: var(--mtc-zh-ink); }
.mtc-pra .mtc-pra-tel { color: var(--mtc-ink2) !important; font-variant-numeric: tabular-nums; text-decoration: none; }
.mtc-pra .mtc-pra-tel:hover { color: var(--mtc-ink-red) !important; }

/* La pastille « patient sinophone » était bordeaux sur bordeaux. */
.mtc-pra .mtc-pra-lang-pill {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--mtc-zh); font-size: .7rem; line-height: 1;
  padding: .18em .45em; border-radius: var(--mtc-r-sm);
  background: var(--mtc-r100) !important; color: var(--mtc-r800) !important;
  border: 1px solid var(--mtc-r200) !important;
  width: auto !important; height: auto !important;
}

.mtc-pra .mtc-pra-code, .mtc-pra .mtc-pra-pcode {
  font-family: var(--mtc-mono); font-size: .76rem;
  background: var(--mtc-r50) !important; border: 1px solid var(--mtc-r100) !important;
  padding: .12em .5em; border-radius: var(--mtc-r-sm); white-space: nowrap;
}

.mtc-pra .mtc-pra-avatar,
.mtc-pra .mtc-pra-avatar--xs, .mtc-pra .mtc-pra-avatar--lg {
  background: var(--mtc-r100) !important; color: var(--mtc-r800) !important;
  border: 1px solid var(--mtc-r200) !important;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--mtc-serif); font-weight: 600; flex-shrink: 0;
  border-radius: var(--mtc-r-pill);
}
.mtc-pra .mtc-pra-avatar--xs { width: 28px; height: 28px; font-size: .7rem; }
.mtc-pra .mtc-pra-avatar { width: 40px; height: 40px; font-size: .85rem; }
.mtc-pra .mtc-pra-avatar--lg { width: 62px; height: 62px; font-size: 1.15rem; }

.mtc-pra .mtc-pra-pbadge {
  font-size: .68rem; padding: .18em .65em; border-radius: var(--mtc-r-pill);
  border: 1px solid var(--mtc-line); background: var(--mtc-sunken); color: var(--mtc-ink3);
  white-space: nowrap; font-weight: 500;
}
.mtc-pra .mtc-pra-pbadge--active  { background: var(--mtc-jade-bg) !important; color: var(--mtc-jade) !important;  border-color: var(--mtc-jade-line) !important; }
.mtc-pra .mtc-pra-pbadge--new     { background: var(--mtc-amber-bg) !important; color: var(--mtc-amber) !important; border-color: var(--mtc-amber-line) !important; }
.mtc-pra .mtc-pra-pbadge--dormant { background: var(--mtc-sunken) !important; color: var(--mtc-ink3) !important;   border-color: var(--mtc-line2) !important; }

/* ═══════════════════════════════════════════════════════════════════
   ONGLETS
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra .mtc-pra-tabs, .mtc-pra .mtc-pra-seance-tabs {
  display: flex; gap: var(--mtc-s1); flex-wrap: wrap;
  border-bottom: 1px solid var(--mtc-line) !important;
  margin-bottom: var(--mtc-s5); background: transparent !important;
}
.mtc-pra .mtc-pra-tab {
  display: inline-flex; align-items: baseline; gap: .4em;
  padding: .55rem .9rem; border: 0 !important; background: transparent !important;
  color: var(--mtc-ink3) !important; font-size: .87rem; font-weight: 500;
  border-bottom: 2px solid transparent !important; margin-bottom: -1px;
  text-decoration: none; cursor: pointer; border-radius: 0 !important;
}
.mtc-pra .mtc-pra-tab:hover { color: var(--mtc-ink) !important; background: var(--mtc-sunken) !important; }
.mtc-pra .mtc-pra-tab.is-active {
  color: var(--mtc-ink) !important; font-weight: 600;
  border-bottom-color: var(--mtc-r600) !important; background: transparent !important;
}
.mtc-pra .mtc-pra-tab.is-active .mtc-pra-tab-glyph { color: var(--mtc-r600) !important; }

/* ═══════════════════════════════════════════════════════════════════
   AGENDA — en-tête de colonne
   Le jour courant était peint en rose pâle avec un libellé blanc :
   1,06:1, c'est-à-dire rien du tout. C'est la marque du jour qui doit
   changer, pas la couleur du texte.
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra .mtc-pra-agenda-col-day,
.mtc-pra .mtc-pra-agenda-col-date { color: var(--mtc-ink2) !important; }
.mtc-pra .mtc-pra-agenda-col-day {
  font-size: .68rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--mtc-ink3) !important; font-weight: 600;
}
.mtc-pra .mtc-pra-agenda-col-date { font-family: var(--mtc-serif); font-size: .96rem; font-weight: 600; }
.mtc-pra .mtc-pra-agenda-col-head.is-today,
.mtc-pra .is-today .mtc-pra-agenda-col-date {
  background: transparent !important;
  color: var(--mtc-ink-red) !important;
}
.mtc-pra .mtc-pra-agenda-col-head.is-today { box-shadow: inset 0 -2px 0 var(--mtc-r600); }
.mtc-pra .is-today .mtc-pra-agenda-col-day { color: var(--mtc-r700) !important; }

.mtc-pra .mtc-pra-agenda-event { color: var(--mtc-ink) !important; }
.mtc-pra .mtc-pra-agenda-event strong { color: var(--mtc-ink) !important; font-weight: 600; }
.mtc-pra .mtc-pra-agenda-event small { color: var(--mtc-ink3) !important; }
.mtc-pra .mtc-pra-agenda-event time,
.mtc-pra .mtc-pra-agenda-event .mtc-pra-agenda-time { color: var(--mtc-ink-red) !important; font-family: var(--mtc-mono); font-size: .7rem; }

/* ═══════════════════════════════════════════════════════════════════
   CHAMPS, PAGINATION, DIVERS
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra input[type="text"], .mtc-pra input[type="search"], .mtc-pra input[type="email"],
.mtc-pra input[type="tel"], .mtc-pra input[type="date"], .mtc-pra input[type="number"],
.mtc-pra input[type="datetime-local"], .mtc-pra select, .mtc-pra textarea {
  font-family: var(--mtc-sans); font-size: .88rem;
  color: var(--mtc-ink) !important;
  background: var(--mtc-surface) !important;
  border: 1px solid var(--mtc-line2) !important;
  border-radius: var(--mtc-r-sm) !important;
  padding: .48em .7em;
}
.mtc-pra textarea { line-height: 1.55; }
.mtc-pra :is(input,select,textarea):focus {
  outline: 2px solid var(--mtc-r300); outline-offset: 1px;
  border-color: var(--mtc-r400) !important;
}
.mtc-pra ::placeholder { color: var(--mtc-ink4) !important; opacity: 1; }
.mtc-pra .mtc-pra-field-lang { color: var(--mtc-ink4); font-size: .7rem; }

.mtc-pra .mtc-pra-pagination { display: flex; gap: var(--mtc-s2); align-items: center; justify-content: center; margin-top: var(--mtc-s5); flex-wrap: wrap; }
.mtc-pra .mtc-pra-pag-link {
  padding: .3em .7em; border-radius: var(--mtc-r-sm); font-size: .82rem;
  border: 1px solid var(--mtc-line2) !important; background: var(--mtc-surface) !important;
  color: var(--mtc-ink2) !important; text-decoration: none;
}
.mtc-pra .mtc-pra-pag-link:hover { background: var(--mtc-sunken) !important; }
.mtc-pra .mtc-pra-pag-link.is-current { background: var(--mtc-r600) !important; color: #fff !important; border-color: var(--mtc-r700) !important; }
.mtc-pra .mtc-pra-pag-link.is-disabled { opacity: 1 !important; color: var(--mtc-ink4) !important; background: var(--mtc-sunken) !important; }

.mtc-pra .mtc-pra-filterbar { display: flex; gap: var(--mtc-s2); flex-wrap: wrap; align-items: center; margin-bottom: var(--mtc-s4); }
.mtc-pra .mtc-pra-filterbar input[type="search"], .mtc-pra .mtc-pra-filterbar input[type="text"] { flex: 1 1 260px; }
.mtc-pra .mtc-pra-result-count { color: var(--mtc-ink3); font-size: .8rem; }

.mtc-pra .mtc-pra-back {
  display: inline-flex; align-items: center; gap: .35em;
  color: var(--mtc-ink3) !important; font-size: .82rem; text-decoration: none;
  margin-bottom: var(--mtc-s3);
}
.mtc-pra .mtc-pra-back:hover { color: var(--mtc-ink-red) !important; }

.mtc-pra .mtc-pra-seance-card {
  border: 1px solid var(--mtc-line) !important; border-radius: var(--mtc-r-md) !important;
  background: var(--mtc-surface) !important; padding: var(--mtc-s4) !important;
  margin-bottom: var(--mtc-s3) !important;
}
.mtc-pra .mtc-pra-seance-num { color: var(--mtc-ink-red) !important; font-family: var(--mtc-serif); font-weight: 600; }
.mtc-pra .mtc-pra-seance-date { font-family: var(--mtc-mono); font-size: .78rem; color: var(--mtc-ink3) !important; }
.mtc-pra .mtc-pra-seance-diag { color: var(--mtc-ink2) !important; font-size: .87rem; }

.mtc-pra .mtc-pra-tech-block { border-left: 3px solid var(--mtc-line2) !important; }
.mtc-pra .mtc-pra-tech-block.is-active { border-left-color: var(--mtc-r600) !important; }
.mtc-pra .mtc-pra-tech-label-zh { color: var(--mtc-zh-ink) !important; }
.mtc-pra .mtc-pra-tech-pinyin { color: var(--mtc-ink3) !important; font-style: italic; }

.mtc-pra .mtc-pra-stat, .mtc-pra .mtc-pra-pstat {
  background: var(--mtc-surface) !important; border: 1px solid var(--mtc-line) !important;
  border-radius: var(--mtc-r-md) !important; padding: var(--mtc-s4) var(--mtc-s5) !important;
}
.mtc-pra .mtc-pra-stat--warning { background: var(--mtc-amber-bg) !important; border-color: var(--mtc-amber-line) !important; }
.mtc-pra .mtc-pra-stat--warning .mtc-pra-stat-num { color: var(--mtc-amber) !important; }
.mtc-pra .mtc-pra-stat-label, .mtc-pra .mtc-pra-pstat-label {
  color: var(--mtc-ink3) !important; font-size: .68rem !important;
  letter-spacing: .09em; text-transform: uppercase; font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   LE CARTOUCHE EST SOMBRE — il reprend la main après les règles
   génériques ci-dessus.

   Généraliser une couleur de lien à toute l'application (« un lien est
   bordeaux ») casse la seule zone claire-sur-sombre de l'interface : le
   raccourci « Dossier » y devenait encre sur charbon (1,19:1) et le
   numéro de téléphone bordeaux sur charbon (1,43:1). Les règles
   suivantes viennent après, à spécificité au moins égale, et rendent au
   cartouche ses encres de rail.
   ═══════════════════════════════════════════════════════════════════ */

.mtc-cartouche, .mtc-cartouche * { border-color: rgba(255,255,255,.14); }

.mtc-cartouche a,
.mtc-pra .mtc-cartouche a,
.mtc-pra .mtc-cartouche a.mtc-pra-btn--ghost,
.mtc-pra .mtc-cartouche .mtc-pra-btn--ghost,
.mtc-cartouche-contact a,
.mtc-cartouche-liens a,
.mtc-cartouche-actions a { color: var(--mtc-rail-ink) !important; }
.mtc-cartouche a:hover,
.mtc-pra .mtc-cartouche a:hover { color: #fff !important; }

.mtc-pra .mtc-cartouche .mtc-fr-label,
.mtc-pra .mtc-cartouche strong,
.mtc-pra .mtc-cartouche .mtc-cartouche-panneau-val { color: var(--mtc-rail-ink) !important; }
.mtc-pra .mtc-cartouche .mtc-zh-label,
.mtc-pra .mtc-cartouche [lang="zh"] { color: var(--mtc-zh-on-rail) !important; }
.mtc-pra .mtc-cartouche .mtc-glyphe { color: var(--mtc-r300) !important; }

/* Les intitulés des panneaux étaient à 9,9 px et 4,09:1 : trop petits
   ET trop pâles à la fois, ce qui se cumule à l'usage. */
.mtc-cartouche-panneau-lib,
.mtc-pra .mtc-cartouche-panneau-lib {
  color: var(--mtc-rail-ink2) !important;
  font-size: .68rem !important;
  letter-spacing: .1em; text-transform: uppercase;
}
.mtc-cartouche-panneau-sub,
.mtc-pra .mtc-cartouche-panneau-sub { color: var(--mtc-zh-on-rail) !important; }
.mtc-cartouche-faits, .mtc-pra .mtc-cartouche-faits { color: var(--mtc-rail-ink2) !important; }

/* ═══════════════════════════════════════════════════════════════════
   DERNIERS ÉCARTS MESURÉS
   ═══════════════════════════════════════════════════════════════════ */

/* L'or de marque tient comme filet ou comme fond, pas comme texte :
   #A8802B sur papier ne donne que 3,45:1. */
.mtc-pra .mtc-pra-eyebrow,
.mtc-pra .mtc-pra-greeting-sub { color: #7C5D17 !important; letter-spacing: .12em; }

/* Les dates secondaires étaient en ink4 (3,71:1 sur blanc). Elles
   restent discrètes en ink3, qui passe à 5,76:1. */
.mtc-pra .mtc-pra-card-title-meta,
.mtc-pra .mtc-pra-visite-date,
.mtc-pra .mtc-pra-seance-meta,
.mtc-pra .mtc-pra-patient-when,
.mtc-pra .mtc-pra-refs-meta,
.mtc-pra .mtc-pra-page-meta,
.mtc-pra .mtc-pra-snippet-zh,
/* `small` est restreint à la zone claire : la même règle appliquée à
   toute l'application repeignait l'adresse e-mail du pied de rail en
   encre sombre sur charbon (3,29:1). Une couleur « de page » n'a rien à
   faire sur une surface sombre. */
.mtc-pra-main small { color: var(--mtc-ink3) !important; }

/* Dans une pastille colorée, le chinois suit la couleur de la pastille.
   La feuille historique le forçait en blanc : illisible sur un fond
   jade clair (1,11:1). */
.mtc-pra .mtc-pra-badge .mtc-zh-label,
.mtc-pra .mtc-pra-badge .mtc-fr-label,
.mtc-pra .mtc-pra-pbadge .mtc-zh-label,
.mtc-pra .mtc-pra-pbadge .mtc-fr-label { color: inherit !important; opacity: 1 !important; }

/* Les puces de raccourci du cartouche sont posées sur un charbon plus
   clair que le rail : le chinois y retombait à 4,33:1. Il lui faut une
   encre propre, pas celle du rail. */
.mtc-pra .mtc-cartouche-liens .mtc-zh-label,
.mtc-pra .mtc-cartouche-liens [lang="zh"],
.mtc-pra .mtc-cartouche-lien .mtc-zh-label,
.mtc-pra .mtc-cartouche-actions .mtc-zh-label,
.mtc-pra .mtc-cartouche-actions [lang="zh"] { color: #C6BFB6 !important; }
.mtc-pra-main .mtc-cartouche small,
.mtc-cartouche small { color: var(--mtc-zh-on-rail) !important; }

/* Le filet or à gauche des snippets et le fond crème venaient de la
   charte précédente : deux accents de plus sur un écran qui n'en demande
   pas. Fond blanc, filet neutre, et le rouge réservé à l'état actif. */
.mtc-pra .mtc-pra-snippet-item {
  background: var(--mtc-surface) !important;
  border: 1px solid var(--mtc-line) !important;
  border-left: 3px solid var(--mtc-line2) !important;
  border-radius: var(--mtc-r-md) !important;
}
.mtc-pra .mtc-pra-snippet-item:hover { border-left-color: var(--mtc-r400) !important; }
.mtc-pra .mtc-pra-snippet-title { color: var(--mtc-ink) !important; }
.mtc-pra .mtc-pra-snippet-content {
  background: var(--mtc-sunken) !important;
  border: 1px solid var(--mtc-line) !important;
  color: var(--mtc-ink2) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   RENVOI ADMINISTRATIF
   Une bande sobre, pas une carte : ce qu'elle porte n'appartient pas au
   dossier clinique, elle en indique seulement la porte. Assez visible
   pour qu'on la trouve, assez discrète pour ne pas se lire comme la
   suite du diagnostic.
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra .mtc-pra-renvoi {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--mtc-s4); flex-wrap: wrap;
  background: var(--mtc-sunken);
  border: 1px solid var(--mtc-line);
  border-radius: var(--mtc-r-md);
  padding: var(--mtc-s3) var(--mtc-s4);
  margin-bottom: var(--mtc-s4);
}
.mtc-pra .mtc-pra-renvoi-corps { display: flex; align-items: flex-start; gap: var(--mtc-s3); min-width: 0; }
.mtc-pra .mtc-pra-renvoi-corps .mtc-glyphe { font-size: 1.2rem; margin-top: .05em; }
.mtc-pra .mtc-pra-renvoi strong { display: block; font-size: .88rem; color: var(--mtc-ink); font-weight: 600; }
.mtc-pra .mtc-pra-renvoi-sub { display: block; margin-top: 2px; font-size: .78rem; color: var(--mtc-ink3); }

/* ═══════════════════════════════════════════════════════════════════
   BANDEAU — la barre sombre en tête de toutes les pages

   Il est en `position: fixed` et non dans le flux : la feuille
   historique fixe le rail en `height: 100vh !important; position:
   sticky; top: 0 !important`, et tout élément glissé au-dessus de lui
   dans le flux l'aurait poussé hors de l'écran, le pied du rail passant
   sous la ligne de flottaison. On réserve donc la hauteur du bandeau en
   padding sur le conteneur, et on raccourcit le rail d'autant.
   ═══════════════════════════════════════════════════════════════════ */

:root, body { --mtc-bandeau-h: 54px; }

.mtc-pra .mtc-pra-bandeau {
  position: fixed; top: 0; left: 0; right: 0;
  height: var(--mtc-bandeau-h);
  display: flex !important; align-items: center; gap: var(--mtc-s4);
  padding: 0 var(--mtc-s4);
  background: var(--mtc-rail-2) !important;
  border-bottom: 1px solid rgba(0,0,0,.5) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.05) inset;
  color: var(--mtc-rail-ink);
  z-index: 100;
}

/* La hauteur du bandeau est prise sur le conteneur, pas ajoutée à lui :
   `.mtc-pra--app` est en `height: 100vh; overflow: hidden`, et sans
   box-sizing la page dépasserait de 54 px par le bas. */
.mtc-pra.mtc-pra--app {
  box-sizing: border-box;
  padding-top: var(--mtc-bandeau-h);
}
.mtc-pra-sidebar,
.mtc-pra .mtc-pra-sidebar {
  height: calc(100vh - var(--mtc-bandeau-h)) !important;
  top: var(--mtc-bandeau-h) !important;
}
.mtc-pra .mtc-pra-main-wrap { min-height: 0; }

.mtc-pra .mtc-pra-bandeau-marque {
  display: flex; align-items: center; gap: .55rem;
  text-decoration: none; color: var(--mtc-rail-ink) !important;
  flex-shrink: 0;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-brand-glyph {
  background: var(--mtc-r600); color: #fff !important;
  width: 30px; height: 30px; border-radius: var(--mtc-r-sm);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--mtc-zh); font-size: 1rem; line-height: 1;
}
.mtc-pra .mtc-pra-bandeau-marque-texte { display: flex; flex-direction: column; line-height: 1.12; }
.mtc-pra .mtc-pra-bandeau-marque-texte strong {
  font-family: var(--mtc-serif); font-size: 1rem; font-weight: 600;
  color: var(--mtc-rail-ink) !important;
}
.mtc-pra .mtc-pra-bandeau-marque-texte small {
  font-size: .6rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--mtc-rail-ink3) !important;
}

/* La recherche globale — absente du poste de travail jusqu'ici. */
.mtc-pra .mtc-pra-bandeau .mtc-pra-search {
  flex: 1 1 auto; max-width: 520px; position: relative; margin: 0 auto;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-search-input {
  width: 100%;
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: var(--mtc-rail-ink) !important;
  border-radius: var(--mtc-r-pill) !important;
  padding: .38em 2.2em .38em .9em !important;
  font-size: .84rem;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-search-input::placeholder { color: var(--mtc-rail-ink3) !important; opacity: 1; }
.mtc-pra .mtc-pra-bandeau .mtc-pra-search-input:focus {
  background: rgba(255,255,255,.12) !important;
  border-color: var(--mtc-r400) !important;
  outline: 2px solid rgba(201,86,76,.35); outline-offset: 0;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-search-btn {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  background: transparent !important; border: 0 !important;
  color: var(--mtc-rail-ink2) !important; cursor: pointer;
  padding: .2em .45em; line-height: 1;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-search-btn .mtc-glyphe { color: inherit !important; }
.mtc-pra .mtc-pra-bandeau .mtc-pra-search-btn:hover { color: #fff !important; }
.mtc-pra .mtc-pra-bandeau .mtc-pra-search-suggest {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px);
  background: var(--mtc-surface); border: 1px solid var(--mtc-line2);
  border-radius: var(--mtc-r-md); box-shadow: var(--mtc-sh3);
  max-height: 320px; overflow-y: auto; z-index: 110;
}

.mtc-pra .mtc-pra-bandeau-droite { display: flex; align-items: center; gap: var(--mtc-s3); margin-left: auto; flex-shrink: 0; }
.mtc-pra .mtc-pra-bandeau-user { display: flex; align-items: center; gap: .45rem; }
.mtc-pra .mtc-pra-bandeau-user-nom { font-size: .82rem; color: var(--mtc-rail-ink2); }
.mtc-pra .mtc-pra-bandeau .mtc-pra-avatar--sm {
  width: 28px; height: 28px; font-size: .68rem;
  background: var(--mtc-r700) !important; color: #fff !important; border: 0 !important;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--mtc-r-pill); font-weight: 600;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-side-action {
  color: var(--mtc-rail-ink2) !important; background: transparent;
  border-radius: var(--mtc-r-sm); padding: 0 .45em; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; text-decoration: none;
  height: 28px; min-width: 28px; box-sizing: border-box; margin: 0;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-side-action:hover { background: rgba(255,255,255,.08); color: #fff !important; }
.mtc-pra .mtc-pra-bandeau .mtc-pra-side-action .mtc-glyphe { color: inherit !important; }

.mtc-pra .mtc-pra-bandeau .mtc-pra-lang-toggle {
  display: inline-flex; align-items: center; background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.1); border-radius: var(--mtc-r-pill); padding: 2px !important;
  /* La feuille historique lui donne un margin-bottom (il vivait dans le
     rail, au-dessus d'autre chose) : dans le bandeau, centré verticalement,
     cette marge le faisait remonter de quelques pixels. */
  margin: 0 !important; height: 28px; box-sizing: border-box;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-lang-btn {
  color: var(--mtc-rail-ink3) !important; background: transparent; border: 0;
  border-radius: var(--mtc-r-pill) !important; font-size: .72rem !important;
  padding: 0 .6em !important; cursor: pointer; margin: 0;
  height: 22px; line-height: 22px; display: inline-flex; align-items: center;
}
.mtc-pra .mtc-pra-bandeau .mtc-pra-lang-btn [lang="zh"] { font-size: inherit !important; line-height: inherit; }
.mtc-pra .mtc-pra-bandeau .mtc-pra-lang-btn.is-active { background: var(--mtc-r600) !important; color: #fff !important; }

/* Le rail n'a plus de cartouche de marque : seule reste la croix de
   fermeture, et elle ne sert que sur petit écran. */
.mtc-pra .mtc-pra-sidebar-tete { display: none; padding: var(--mtc-s2) var(--mtc-s3); justify-content: flex-end; flex: 0 0 auto; }
.mtc-pra .mtc-pra-sidebar-nav { padding-top: var(--mtc-s3); }

.mtc-pra .mtc-pra-burger { display: none; background: transparent; border: 0; cursor: pointer; flex-direction: column; gap: 4px; padding: .35em; }
.mtc-pra .mtc-pra-burger span { display: block; width: 18px; height: 2px; background: var(--mtc-rail-ink) !important; border-radius: 2px; }

/* Le seuil est celui de la feuille historique (900 px) : en prendre un
   autre ouvrait une bande où le menu burger s'affichait alors que le rail
   était encore ancré. */
@media (max-width: 900px) {
  .mtc-pra .mtc-pra-burger { display: inline-flex; }
  .mtc-pra .mtc-pra-sidebar-tete { display: flex; }
  .mtc-pra .mtc-pra-bandeau-marque-texte,
  .mtc-pra .mtc-pra-bandeau-user-nom { display: none; }
  /* Le bloc de marque ne peut plus occuper la colonne du rail : le rail
     n'est plus là, et 262 px prendraient les deux tiers de la barre. */
  .mtc-pra .mtc-pra-bandeau-marque { width: auto; padding-left: 0; }
  .mtc-pra .mtc-pra-bandeau { padding-left: var(--mtc-s3); }
  .mtc-pra .mtc-pra-bandeau { gap: var(--mtc-s2); padding: 0 var(--mtc-s3); }

  /* LE RAIL DOIT SORTIR DU FLUX SUR PETIT ÉCRAN.
     La règle mobile de la feuille historique le passe bien en
     `position: fixed`, mais sa section « OVERRIDE FINAL AGRESSIF »
     redéclare plus loin `position: sticky !important` — sans media query,
     donc valable ici aussi, et un !important bat une déclaration normale
     même dans une requête média. Le rail gardait donc sa place dans la
     grille : il occupait une première rangée pleine hauteur, et le
     contenu commençait un écran plus bas. Sur téléphone, toute page
     s'ouvrait sur du vide. */
  .mtc-pra .mtc-pra-sidebar,
  .mtc-pra-sidebar {
    position: fixed !important;
    top: var(--mtc-bandeau-h) !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 280px !important;
    height: auto !important;
    z-index: 90 !important;
    transform: translateX(-100%);
    transition: transform .25s cubic-bezier(.4, 0, .2, 1);
  }
  body.mtc-pra-sidebar-open .mtc-pra-sidebar { transform: translateX(0); }

  /* La recherche plein format ne tient pas : le champ se réduisait à une
     pastille où l'on ne pouvait rien lire ni rien taper. */
  .mtc-pra .mtc-pra-bandeau .mtc-pra-search { display: none; }
  .mtc-pra .mtc-pra-bandeau-droite { gap: var(--mtc-s2); }
}

/* En dessous de 480 px, le sélecteur de langue passe aussi à la trappe :
   il reste accessible depuis les Réglages. */
@media (max-width: 480px) {
  .mtc-pra .mtc-pra-bandeau .mtc-pra-lang-toggle { display: none; }
}

/* Le bandeau est sombre au même titre que le rail. */
.mtc-pra .mtc-pra-bandeau .mtc-zh-label,
.mtc-pra .mtc-pra-bandeau [lang="zh"] { color: var(--mtc-zh-on-rail) !important; }
.mtc-pra .mtc-pra-bandeau .mtc-fr-label { color: inherit !important; }

/* ═══════════════════════════════════════════════════════════════════
   ALIGNEMENT — v0.16.0

   Mesuré au navigateur, en insérant dans chaque libellé un témoin de
   hauteur nulle calé sur la ligne de base : le haut de son rectangle EST
   la ligne de base. Deux familles de défauts en sont ressorties.

   ── LES COLONNES NE SE RÉPONDAIENT PAS ───────────────────────────
   Le rail occupe 0→262 px et le contenu commence à 294 px. Dans le
   bandeau, la marque allait de 16 à 198 px, la recherche flottait à
   332 px et le bloc de droite s'arrêtait à 1424 px là où le contenu
   s'arrête à 1408. Aucune des lignes verticales du bandeau ne tombait
   sur une ligne de la page : le haut de l'écran paraissait posé de
   travers sur le reste.

   Le bandeau adopte donc la grille : bloc de marque large comme le
   rail, tout le reste aligné sur la colonne de contenu, et la même
   marge à droite.

   ── LES PASTILLES FLOTTAIENT AU-DESSUS DU TEXTE ──────────────────
   Un `inline-block` aligne le bas de sa BOÎTE sur la ligne de base
   voisine, pas le bas de son texte. Dans le cartouche, la pastille du
   code patient était donc 7,2 px plus haut que le nom. En passant le
   titre en flex avec `align-items: baseline`, chaque élément aligne sa
   propre ligne de base — pastilles comprises.
   ═══════════════════════════════════════════════════════════════════ */

:root, body {
  --mtc-rail-w:    262px;   /* largeur du rail, partagée par le bandeau */
  --mtc-gouttiere:  32px;   /* marge intérieure de la colonne de contenu */
}

.mtc-pra .mtc-pra-bandeau {
  padding: 0 var(--mtc-gouttiere) 0 0;
  gap: 0;
}
/* Le bloc de marque occupe exactement la colonne du rail : la couture
   entre les deux devient une seule ligne verticale, de haut en bas. */
.mtc-pra .mtc-pra-bandeau-marque {
  width: var(--mtc-rail-w);
  box-sizing: border-box;
  padding-left: 20px;   /* aligne le sigle sur les glyphes du rail */
  padding-right: var(--mtc-s3);
  gap: .6rem;
  flex: 0 0 auto;
}
/* Tout ce qui suit commence là où commence le contenu. */
.mtc-pra .mtc-pra-bandeau .mtc-pra-search {
  margin: 0 0 0 var(--mtc-gouttiere);
  max-width: 460px;
  flex: 0 1 460px;
}
.mtc-pra .mtc-pra-bandeau-droite { margin-left: auto; gap: var(--mtc-s3); }

/* ── Les lignes de base ───────────────────────────────────────────── */

/* Titre du cartouche : nom, nom chinois et pastille de code sur une
   seule ligne de base. */
.mtc-pra .mtc-cartouche-nom {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 .55rem;
}

/* Un bouton centre ses enfants comme des boîtes : avec trois tailles de
   police différentes (idéogramme, français, chinois), les trois textes
   retombaient à 1,2 px les uns des autres. On aligne sur la base et on
   rend la hauteur au padding. */
.mtc-pra .mtc-pra-btn {
  align-items: baseline;
  line-height: 1.25;
}
.mtc-pra .mtc-pra-btn > .mtc-glyphe,
.mtc-pra .mtc-pra-btn > .mtc-fr-label,
.mtc-pra .mtc-pra-btn > .mtc-zh-label { line-height: inherit; }
/* Un bouton sans texte (icône seule) n'a pas de base à suivre. */
.mtc-pra .mtc-pra-btn:not(:has(.mtc-fr-label)):not(:has(.mtc-pra-btn-texte)) { align-items: center; }

/* Les pastilles posées au fil du texte : code patient, badges d'état. */
.mtc-pra .mtc-pra-code,
.mtc-pra .mtc-pra-pcode,
.mtc-pra .mtc-pra-badge,
.mtc-pra .mtc-pra-pbadge,
.mtc-pra .mtc-pra-lang-pill { vertical-align: baseline; }

/* Les rangées icône + libellé : même base, pas un centrage de boîtes. */
.mtc-pra .mtc-pra-card-title,
.mtc-pra .mtc-pra-section-h,
.mtc-pra .mtc-pra-tab {
  display: flex;
  align-items: baseline;
  gap: .4em;
  flex-wrap: wrap;
}
.mtc-pra .mtc-pra-card-title .mtc-glyphe { align-self: baseline; }

/* ═══════════════════════════════════════════════════════════════════
   CARTOUCHE DE PAGE — la bande sombre en tête de chaque écran

   Tous les écrans ouvrent déjà sur `<header class="mtc-pra-page-header">`
   contenant leur titre et leur méta. Il suffit de lui donner le
   traitement du cartouche patient, en plus mince : aucune vue n'a besoin
   d'être réécrite, et les deux bandes appartiennent visiblement à la
   même famille.
   ═══════════════════════════════════════════════════════════════════ */

.mtc-pra .mtc-pra-page-header,
.mtc-pra .mtc-pra-greeting {
  background: linear-gradient(135deg, var(--mtc-rail-card) 0%, var(--mtc-rail) 100%);
  color: var(--mtc-rail-ink);
  border-radius: var(--mtc-r-lg);
  padding: var(--mtc-s3) var(--mtc-s5);
  margin-bottom: var(--mtc-s4);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--mtc-s4);
  flex-wrap: wrap;
  min-height: 0;
}

.mtc-pra .mtc-pra-page-header .mtc-pra-h1,
.mtc-pra .mtc-pra-greeting .mtc-pra-h1 {
  color: var(--mtc-rail-ink) !important;
  font-size: 1.32rem !important;
  margin: 0 !important;
  display: flex; align-items: baseline; gap: .45em; flex-wrap: wrap;
}
.mtc-pra .mtc-pra-page-header .mtc-zh-label,
.mtc-pra .mtc-pra-page-header .mtc-pra-section-zh,
.mtc-pra .mtc-pra-page-header [lang="zh"],
.mtc-pra .mtc-pra-greeting .mtc-zh-label,
.mtc-pra .mtc-pra-greeting [lang="zh"] {
  color: var(--mtc-zh-on-rail) !important;
  font-size: .82em !important;
}
.mtc-pra .mtc-pra-page-header .mtc-pra-page-meta,
.mtc-pra .mtc-pra-greeting .mtc-pra-greeting-sub {
  color: var(--mtc-rail-ink2) !important;
  font-size: .82rem; margin: 0;
  display: flex; align-items: baseline; gap: var(--mtc-s2); flex-wrap: wrap;
}
.mtc-pra .mtc-pra-page-header .mtc-pra-page-meta strong { color: var(--mtc-rail-ink) !important; }
.mtc-pra .mtc-pra-page-header a,
.mtc-pra .mtc-pra-page-header .mtc-pra-linkbtn,
.mtc-pra .mtc-pra-greeting a { color: var(--mtc-rail-ink) !important; }
.mtc-pra .mtc-pra-page-header .mtc-pra-linkbtn {
  background: transparent; border: 0; cursor: pointer; font-size: .82rem; padding: 0;
}
.mtc-pra .mtc-pra-page-header .mtc-pra-badge {
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.18) !important;
  color: var(--mtc-rail-ink) !important;
}
.mtc-pra .mtc-pra-page-header .mtc-glyphe { color: var(--mtc-r300) !important; }

/* L'accueil : la salutation devient la bande, le prénom son titre.
   En flex, ses trois enfants (« Bonjour », le prénom, la date) devenaient
   trois colonnes et le prénom se retrouvait au milieu de la bande. Une
   grille remet l'accroche et le nom l'un sous l'autre à gauche, la date
   à droite. */
.mtc-pra .mtc-pra-greeting {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  align-items: baseline;
  column-gap: var(--mtc-s4);
  row-gap: 0;
}
.mtc-pra .mtc-pra-greeting .mtc-pra-eyebrow { grid-column: 1; grid-row: 1; }
.mtc-pra .mtc-pra-greeting .mtc-pra-h1 { grid-column: 1; grid-row: 2; }
.mtc-pra .mtc-pra-greeting .mtc-pra-greeting-sub {
  grid-column: 2; grid-row: 1 / span 2;
  align-self: center; justify-self: end;
}
.mtc-pra .mtc-pra-greeting .mtc-pra-eyebrow {
  color: var(--mtc-r300) !important;
  font-size: .66rem; letter-spacing: .14em; text-transform: uppercase;
  display: block; margin-bottom: 2px;
}
.mtc-pra .mtc-pra-greeting > * { margin: 0; }

/* Quand la page porte DÉJÀ le cartouche patient, sa bande de titre se
   fait plus discrète : deux blocs sombres pleins l'un sur l'autre
   pèsent, et c'est le patient qui doit primer. */
.mtc-pra .mtc-cartouche + .mtc-pra-page-header,
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header {
  background: transparent;
  border: 1px solid var(--mtc-line);
  color: var(--mtc-ink);
  padding: var(--mtc-s2) var(--mtc-s4);
}
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header .mtc-pra-h1 { color: var(--mtc-ink) !important; }
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header .mtc-zh-label,
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header .mtc-pra-section-zh,
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header [lang="zh"] { color: var(--mtc-zh-ink) !important; }
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header .mtc-pra-page-meta { color: var(--mtc-ink3) !important; }
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header .mtc-pra-page-meta strong { color: var(--mtc-ink) !important; }
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header a { color: var(--mtc-ink-red) !important; }
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header .mtc-pra-badge {
  background: var(--mtc-sunken) !important; border-color: var(--mtc-line) !important; color: var(--mtc-ink3) !important;
}

/* Une pastille posée à côté d'un nom de 30 px : on la centre sur la
   hauteur du nom plutôt que de la caler sur sa ligne de base, où elle
   paraîtrait tomber. Le choix est explicite, pour qu'une relecture ne le
   prenne pas pour l'oubli qu'il n'est pas — c'est le seul endroit où
   l'alignement n'est pas sur la base. */
.mtc-pra .mtc-cartouche-nom > .mtc-cartouche-code,
.mtc-pra .mtc-cartouche-nom > .mtc-pra-code,
.mtc-pra .mtc-pra-h1 > .mtc-pra-badge { align-self: center; }

/* L'en-tête de page est désormais une surface sombre : le `small` de la
   zone claire (encre #6B655D) y tombait à 2,85:1. */
.mtc-pra .mtc-pra-page-header small,
.mtc-pra .mtc-pra-greeting small,
.mtc-pra-main .mtc-pra-page-header small,
.mtc-pra-main .mtc-pra-greeting small { color: var(--mtc-rail-ink2) !important; }
.mtc-pra .mtc-cartouche ~ .mtc-pra-page-header small { color: var(--mtc-ink3) !important; }

/* La pastille « patient sinophone » est posée dans une colonne flex : à
   défaut d'alignement propre elle s'étirait sur toute la largeur de la
   cellule, devenant une barre rose avec un idéogramme perdu dedans. */
.mtc-pra .mtc-pra-td-name-text { align-items: flex-start; }
.mtc-pra .mtc-pra-lang-pill { align-self: flex-start; flex: 0 0 auto; }

/* ═══════════════════════════════════════════════════════════════
   SNIPPETS — gestion dans l'espace praticien (0.17.0)
   ═══════════════════════════════════════════════════════════════ */
.mtc-pra-snippet-actions { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.mtc-pra-inline-form { display: inline; margin: 0; }
.mtc-pra-btn--danger { color: var(--mtc-ink-red) !important; border-color: var(--mtc-line, #DAD3C8) !important; }
.mtc-pra-btn--danger:hover { background: #F6ECEA !important; }
.mtc-pra-snippet-edit { display: grid; gap: 10px; margin-top: 10px; padding: 12px; border: 1px solid var(--mtc-line, #DAD3C8); border-radius: 8px; background: #FBF9F5; }
.mtc-pra-snippet-edit textarea { width: 100%; font: inherit; }
.mtc-pra-form-actions { display: flex; gap: 8px; align-items: baseline; }
.mtc-pra-required { color: var(--mtc-ink-red); font-weight: 600; }
.mtc-pra-form-hint { color: var(--mtc-ink4); }

/* ═══════════════════════════════════════════════════════════════
   PARCOURS DU DOSSIER — quatre jalons dans le cartouche (0.17.0)
   Fait · en cours (le prochain à faire) · à faire. Tout est cliquable.
   ═══════════════════════════════════════════════════════════════ */
.mtc-cartouche { flex-wrap: wrap; }
.mtc-parcours {
  list-style: none; margin: 0; padding: var(--mtc-s3) 0 0; width: 100%; flex-basis: 100%;
  border-top: 1px solid rgba(255,255,255,.1);
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px;
}
.mtc-parcours-jalon a {
  display: grid; grid-template-columns: 18px 1fr; grid-template-rows: auto auto; column-gap: 8px;
  padding: 8px 10px; border-radius: var(--mtc-r-md, 8px);
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08);
  color: var(--mtc-rail-ink) !important; text-decoration: none !important;
  min-height: 52px;
}
.mtc-parcours-jalon a:hover { background: rgba(255,255,255,.11); }
.mtc-parcours-puce {
  grid-row: 1 / span 2; align-self: start; margin-top: 1px;
  width: 18px; height: 18px; border-radius: 50%;
  border: 1.5px solid var(--mtc-rail-ink3);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; line-height: 1; font-weight: 700;
}
.mtc-parcours-jalon--fait .mtc-parcours-puce { background: #fff; border-color: #fff; color: var(--mtc-rail); }
.mtc-parcours-jalon--en-cours .mtc-parcours-puce { border-color: var(--mtc-red-bright, #E2493E); box-shadow: inset 0 0 0 3px var(--mtc-rail); background: var(--mtc-red-bright, #E2493E); }
.mtc-parcours-jalon--en-cours a { border-color: rgba(226,73,62,.55); }
.mtc-parcours-jalon--a-faire a { opacity: 1; }
.mtc-parcours-jalon--a-faire .mtc-parcours-lib .mtc-fr-label { color: var(--mtc-rail-ink2); }
.mtc-parcours-lib { font-size: .82rem; font-weight: 600; color: #fff; line-height: 1.25; display: flex; gap: 6px; align-items: baseline; flex-wrap: wrap; }
.mtc-parcours-lib .mtc-zh-label { font-size: .74rem; font-weight: 400; color: var(--mtc-zh-on-rail) !important; }
.mtc-parcours-sub { font-size: .72rem; color: var(--mtc-rail-ink2); margin-top: 2px; }
.mtc-parcours-jalon.is-ici a { outline: 1px solid rgba(255,255,255,.35); outline-offset: 1px; }
@media (max-width: 720px) {
  .mtc-parcours { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.mtc-pra-page-header-actions { display: flex; gap: 8px; align-items: baseline; margin-left: auto; }
.mtc-pra-badge--demo { background: #EFE9DD !important; color: var(--mtc-ink4) !important; border-color: var(--mtc-line2) !important; font-size: .68rem; margin-left: 6px; }
.mtc-chip--demo { background: rgba(255,255,255,.12); color: var(--mtc-rail-ink2); border: 1px dashed var(--mtc-rail-line); }
/* Formulaires courts dans une carte : pas de zone de soumission collante
   ni de grande marge basse — c'est réservé aux longs formulaires de dossier. */
.mtc-pra-form-submit--carte { position: static !important; padding: var(--mtc-s3) 0 0 !important; }
.mtc-pra-form-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; margin-top: var(--mtc-s3); }
.mtc-pra-form-grid--3 + .mtc-pra-form-grid--3 { margin-top: var(--mtc-s2); }
.mtc-pra-card .mtc-pra-help-text + form > .mtc-pra-form-grid:first-child { margin-top: var(--mtc-s3); }
.mtc-pra-card form > .mtc-pra-field { margin-top: var(--mtc-s2); }
@media (max-width: 720px) { .mtc-pra-form-grid--3 { grid-template-columns: 1fr !important; } }
.mtc-pra-nowrap { white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════════
   DOCUMENTS DU DOSSIER (0.18.0) — liste, dépôt, visionneuse
   ═══════════════════════════════════════════════════════════════ */
.mtc-pra-doc-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.mtc-pra-doc { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--mtc-line); border-radius: var(--mtc-r-md, 8px); background: #fff; }
.mtc-pra-doc--archive-papier { background: #FBF8F1; border-color: #E6DCC6; }
.mtc-pra-doc--dossier { background: #F8F7F4; }
.mtc-pra-doc-lien { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; text-decoration: none !important; color: var(--mtc-ink) !important; }
.mtc-pra-doc-lien:hover strong { text-decoration: underline; }
.mtc-pra-doc-glyphe { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: var(--mtc-rail); color: #fff; font-family: var(--mtc-zh); font-size: 1.05rem; }
.mtc-pra-doc--archive-papier .mtc-pra-doc-glyphe { background: #8A6D3B; }
.mtc-pra-doc--fiche-signee .mtc-pra-doc-glyphe { background: var(--mtc-r700); }
.mtc-pra-doc-corps { display: flex; flex-direction: column; min-width: 0; }
.mtc-pra-doc-corps strong { font-size: .92rem; line-height: 1.25; }
.mtc-pra-doc-corps small { font-size: .76rem; color: var(--mtc-ink3); line-height: 1.35; }
.mtc-pra-doc-actions { display: inline-flex; gap: 6px; align-items: center; flex-shrink: 0; }
.mtc-pra-ink-red { color: var(--mtc-ink-red); }
.mtc-pra-doc-outils { display: flex; gap: 10px; align-items: flex-start; flex-wrap: wrap; margin-top: var(--mtc-s3); }
.mtc-pra-doc-depot { flex: 1 1 100%; }
.mtc-pra-doc-depot > summary { list-style: none; cursor: pointer; display: inline-flex; }
.mtc-pra-doc-depot > summary::-webkit-details-marker { display: none; }
.mtc-pra-doc-depot[open] > summary { background: var(--mtc-r100) !important; border-color: var(--mtc-r200) !important; }
.mtc-pra-doc-depot-form { margin-top: 10px; padding: 12px; border: 1px dashed #E6DCC6; border-radius: 8px; background: #FBF8F1; }
.mtc-pra-doc-depot-form input[type="file"] { font: inherit; font-size: .84rem; }
.mtc-pra-visionneuse { border: 1px solid var(--mtc-line); border-radius: var(--mtc-r-lg); overflow: hidden; background: #55524E; }
.mtc-pra-visionneuse--pdf iframe { display: block; width: 100%; height: calc(100vh - var(--mtc-bandeau-h) - 330px); min-height: 560px; border: 0; background: #fff; }
.mtc-pra-visionneuse--image { text-align: center; padding: 12px; }
.mtc-pra-visionneuse--image img { max-width: 100%; height: auto; box-shadow: 0 2px 12px rgba(0,0,0,.35); background: #fff; }
@media (max-width: 720px) {
  .mtc-pra-doc { flex-wrap: wrap; }
  .mtc-pra-visionneuse--pdf iframe { height: 70vh; min-height: 420px; }
}

/* ── Lecture d'une pièce : visionneuse + relevé (0.18.0) ── */
.mtc-pra-lecture { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--mtc-s4); align-items: start; }
.mtc-pra-lecture-releve { background: #fff; border: 1px solid var(--mtc-line); border-radius: var(--mtc-r-lg); padding: var(--mtc-s4); position: sticky; top: calc(var(--mtc-bandeau-h) + 12px); }
.mtc-pra-lecture-releve textarea { width: 100%; font: inherit; }
.mtc-pra-lecture-releve textarea[lang="zh"] { font-family: var(--mtc-zh); font-size: 1rem; }
.mtc-pra-releve-texte { white-space: pre-wrap; font-size: .92rem; line-height: 1.55; padding: 8px 10px; background: #FBF8F1; border-left: 3px solid #8A6D3B; border-radius: 4px; margin-top: 8px; }
.mtc-pra-releve-texte[lang="zh"] { font-family: var(--mtc-zh); font-size: 1rem; }
.mtc-pra-visionneuse--image { padding: 0; display: flex; flex-direction: column; }
.mtc-pra-visionneuse-outils { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; padding: 6px 8px; background: var(--mtc-rail); color: var(--mtc-rail-ink); }
.mtc-pra-visionneuse-outils button { height: 28px; min-width: 28px; padding: 0 8px; border: 1px solid var(--mtc-rail-line); border-radius: 6px; background: rgba(255,255,255,.08); color: #fff; cursor: pointer; font: inherit; font-size: .82rem; }
.mtc-pra-visionneuse-outils button:hover { background: rgba(255,255,255,.16); }
.mtc-pra-visionneuse-outils button.is-cache { display: none; }
.mtc-pra-visionneuse-outils button .mtc-zh-label { color: var(--mtc-zh-on-rail) !important; margin-left: 4px; }
.mtc-pra-visionneuse-zoom { min-width: 48px; text-align: center; font-variant-numeric: tabular-nums; font-size: .8rem; color: var(--mtc-rail-ink2); }
.mtc-pra-visionneuse-sep { width: 1px; height: 20px; background: var(--mtc-rail-line); margin: 0 4px; }
.mtc-pra-visionneuse-aide { margin-left: auto; font-size: .7rem; color: var(--mtc-rail-ink2); }
.mtc-pra-visionneuse-aide .mtc-fr-label { color: var(--mtc-rail-ink2) !important; }
.mtc-pra-visionneuse-scene { position: relative; height: calc(100vh - var(--mtc-bandeau-h) - 360px); min-height: 520px; overflow: hidden; display: flex; align-items: center; justify-content: center; cursor: grab; touch-action: none; background: #55524E; }
.mtc-pra-visionneuse-scene.is-drag { cursor: grabbing; }
.mtc-pra-visionneuse-scene img { max-width: none; transform-origin: center center; box-shadow: 0 2px 14px rgba(0,0,0,.4); background: #fff; user-select: none; will-change: transform; }
.mtc-pra-visionneuse:fullscreen { background: #55524E; }
.mtc-pra-visionneuse:fullscreen .mtc-pra-visionneuse-scene { height: calc(100vh - 44px); }
.mtc-pra-archive-etat { font-size: .82rem; margin: 6px 0 0; padding: 6px 10px; border-radius: 6px; border: 1px solid var(--mtc-line); }
.mtc-pra-archive-etat--ok { background: #EEF5EC; border-color: #BFD8B8; color: #2F5E2A; }
.mtc-pra-archive-etat--ko { background: #F9ECEA; border-color: #E4B8B3; color: var(--mtc-ink-red); }
.mtc-pra-archive-etat--vide { background: #F6F4EF; color: var(--mtc-ink3); }
@media (max-width: 1100px) { .mtc-pra-lecture { grid-template-columns: 1fr; } .mtc-pra-lecture-releve { position: static; } }
@media (max-width: 720px) { .mtc-pra-visionneuse-scene { height: 60vh; min-height: 360px; } .mtc-pra-visionneuse-aide { display: none; } }
/* ── Import Onedoc (0.19.0) ── */
.mtc-pra-progression { height: 10px; background: var(--mtc-line); border-radius: 999px; overflow: hidden; margin: 8px 0 12px; }
.mtc-pra-progression span { display: block; height: 100%; background: var(--mtc-r600); transition: width .3s; }
.mtc-pra-stats .mtc-pra-stat-label .mtc-zh-label { margin-left: 4px; }
.mtc-pra-case { display: flex !important; flex-direction: row !important; gap: .6rem; align-items: flex-start; justify-content: flex-start; max-width: 760px; margin-top: 8px; cursor: pointer; }
.mtc-pra-case input[type="checkbox"] { margin-top: .3em; flex: 0 0 auto; }