/* Le Conseil — fondations d'interface (planche « 00 · Fondations du site »). */
:root {
  --fond: #FFF7F0;
  --surface: #FFFFFF;
  --surface-alt: #F5EADF;
  --bordure: #E6D5C6;
  --texte: #302827;
  --texte-attenue: #6B5F5D;
  --accent: #A95139;
  --accent-hover: #954631;
  --accent-texte: #A95139;
  --accent-doux: #F3DDD3;
  --sur-accent: #FFF7F0;
  --succes: #64785D;
  --succes-doux: #E3E9DF;
  --alerte: #D99A43;
  --alerte-doux: #F8E9D2;
  --alerte-texte: #8A5A17;
  --ombre: 0 1px 2px rgba(48, 40, 39, .05);

  --terracotta: #A95139; --sauge: #64785D; --or: #D99A43; --parchemin: #E6D5C6; --encre: #302827; --creme: #FFF7F0;

  --discord-salon: #313338; --discord-embed: #2B2D31; --discord-texte: #DBDEE1; --discord-titre: #F2F3F5;
  --discord-discret: #949BA4; --discord-bouton: #4E5058; --discord-mention: rgba(88, 101, 242, .3);

  --r-controle: 8px; --r-carte: 12px; --r-panneau: 16px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fond: #1A1514; --surface: #241E1D; --surface-alt: #2E2726; --bordure: #3D3433;
    --texte: #FFF7F0; --texte-attenue: #B8AAA4; --accent: #A95139; --accent-hover: #B85E45; --accent-texte: #E39579;
    --accent-doux: #3A2520; --succes: #8FA585; --succes-doux: #26301F; --alerte: #D99A43; --alerte-doux: #3A2D18; --alerte-texte: #E9B66C;
    --ombre: none; color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --fond: #1A1514; --surface: #241E1D; --surface-alt: #2E2726; --bordure: #3D3433;
  --texte: #FFF7F0; --texte-attenue: #B8AAA4; --accent: #A95139; --accent-hover: #B85E45; --accent-texte: #E39579;
  --accent-doux: #3A2520; --succes: #8FA585; --succes-doux: #26301F; --alerte: #D99A43; --alerte-doux: #3A2D18; --alerte-texte: #E9B66C;
  --ombre: none; color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font-family: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 15px; line-height: 1.45;
  background: var(--fond); color: var(--texte);
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; color: inherit; }
a { color: var(--accent-texte); text-decoration: none; }
a:hover { text-decoration: underline; }
svg.i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: square; stroke-linejoin: miter; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--accent-texte); outline-offset: 2px; }

/* ─── Typographie ─────────────────────────────────────────── */
.h-page { font-size: 32px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; margin: 0; }
.h-section { font-size: 20px; font-weight: 700; letter-spacing: -0.01em; margin: 0; }
.libelle { font-size: 13px; font-weight: 600; }
.rubrique { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--texte-attenue); }
.attenue { color: var(--texte-attenue); }
.petit { font-size: 13px; }

/* ─── Connexion ───────────────────────────────────────────── */
.login { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 620fr) minmax(0, 820fr); }
.login-brand { position: relative; overflow: hidden; background: var(--terracotta); color: var(--creme); padding: 0 48px; display: flex; flex-direction: column; justify-content: center; min-height: 100vh; }
.login-brand .piliers { position: absolute; top: 0; left: 48px; }
.login-brand .rubrique { color: var(--creme); opacity: .9; }
.login-brand h1 { font-size: 68px; font-weight: 700; letter-spacing: -0.04em; margin: 12px 0 8px; line-height: 1; }
.login-brand p { font-size: 22px; margin: 0; position: relative; z-index: 1; }
.login-brand .grand-signe { position: absolute; width: 560px; left: 220px; top: 420px; fill: var(--creme); }
.login-side { display: grid; place-items: center; padding: 24px; }
.login-card { width: 100%; max-width: 440px; background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--r-panneau); padding: 40px; box-shadow: var(--ombre); }
.login-card .signe { width: 56px; fill: var(--accent); display: block; }
.login-card h2 { font-size: 32px; margin: 20px 0 8px; letter-spacing: -0.02em; }
.login-card .sep { height: 1px; background: var(--bordure); margin: 20px 0; }
.login-erreur { background: var(--accent-doux); color: var(--accent-texte); padding: 10px 12px; border-radius: var(--r-controle); margin-top: 16px; font-size: 14px; }

/* ─── Boutons, champs, badges ─────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 0 18px; border-radius: var(--r-controle); border: 1px solid transparent; font-weight: 600; font-size: 15px; cursor: pointer; white-space: nowrap; text-decoration: none !important; transition: background .15s, border-color .15s; }
.btn-primaire { background: var(--accent); color: var(--sur-accent); }
.btn-primaire:hover { background: var(--accent-hover); }
.btn-secondaire { background: var(--surface); border-color: var(--bordure); color: var(--texte); }
.btn-secondaire:hover { background: var(--surface-alt); }
.btn-fantome { background: transparent; color: var(--accent-texte); padding: 0 10px; }
.btn-fantome:hover { background: var(--accent-doux); }
.btn-petit { min-height: 34px; padding: 0 12px; font-size: 14px; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-bloc { width: 100%; }

.champ { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.champ > label, .champ > .libelle { font-size: 13px; font-weight: 600; }
.champ .aide { font-size: 13px; color: var(--texte-attenue); }
.saisie, select.saisie, textarea.saisie {
  width: 100%; min-height: 44px; padding: 10px 12px; background: var(--surface); border: 1px solid var(--bordure);
  border-radius: var(--r-controle); outline: none; font-size: 15px;
}
textarea.saisie { min-height: 94px; resize: vertical; line-height: 1.5; }
select.saisie { appearance: none; padding-right: 38px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B5F5D' stroke-width='2.4'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; }
.saisie:focus { border-color: var(--accent-texte); box-shadow: 0 0 0 3px var(--accent-doux); }
.saisie-num { max-width: 160px; }
.avec-suffixe { display: flex; align-items: center; gap: 8px; }

.interrupteur { position: relative; width: 44px; height: 26px; flex: none; border-radius: 13px; border: 0; padding: 0; cursor: pointer; background: var(--surface-alt); box-shadow: inset 0 0 0 1px var(--bordure); transition: background .15s; }
.interrupteur::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--creme); box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform .15s; }
.interrupteur[aria-checked="true"] { background: var(--succes); box-shadow: none; }
.interrupteur[aria-checked="true"]::after { transform: translateX(18px); }

.badge { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.badge-succes { background: var(--succes-doux); color: var(--succes); }
.badge-alerte { background: var(--alerte-doux); color: var(--alerte-texte); }
.badge-accent { background: var(--accent-doux); color: var(--accent-texte); }
.badge-neutre { background: var(--surface-alt); color: var(--texte-attenue); }

.puces { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.puce { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 6px 0 12px; border-radius: 16px; background: var(--surface-alt); border: 1px solid var(--bordure); font-size: 14px; }
.puce button { border: 0; background: none; cursor: pointer; width: 22px; height: 22px; border-radius: 11px; display: grid; place-items: center; color: var(--texte-attenue); }
.puce button:hover { background: var(--bordure); color: var(--texte); }
.puce .pastille-role { width: 10px; height: 10px; border-radius: 50%; }
.puces select.saisie { width: auto; min-height: 32px; padding: 4px 34px 4px 10px; font-size: 14px; }
.puces input.saisie { width: 200px; min-height: 32px; padding: 4px 10px; font-size: 14px; }

.choix-couleurs { display: flex; flex-wrap: wrap; gap: 12px; }
.choix-couleur { display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 16px 0 12px; border-radius: var(--r-controle); border: 1px solid var(--bordure); background: var(--surface); cursor: pointer; font-weight: 500; }
.choix-couleur .rond { width: 20px; height: 20px; border-radius: 50%; }
.choix-couleur[aria-pressed="true"] { border: 2px solid var(--accent-texte); background: var(--accent-doux); color: var(--accent-texte); padding: 0 15px 0 11px; }

/* ─── Squelette de l'application ──────────────────────────── */
.app { display: grid; grid-template-columns: 264px minmax(0, 1fr); min-height: 100vh; }
.barre { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 24px 16px; border-right: 1px solid var(--bordure); background: var(--fond); overflow-y: auto; }
.marque { display: flex; align-items: center; gap: 10px; padding: 0 12px; margin-bottom: 20px; font-weight: 700; font-size: 18px; color: var(--texte); text-decoration: none !important; }
.marque svg { width: 30px; fill: var(--accent); }
.serveur { position: relative; display: flex; align-items: center; gap: 10px; padding: 11px 10px; border-radius: var(--r-carte); background: var(--surface-alt); margin-bottom: 20px; }
.serveur .ico { width: 32px; height: 32px; border-radius: 8px; background: var(--encre); color: var(--creme); display: grid; place-items: center; font-weight: 700; overflow: hidden; flex: none; }
:root[data-theme="dark"] .serveur .ico { background: #3D3433; }
.serveur .ico img { width: 100%; height: 100%; object-fit: cover; }
.serveur .noms { min-width: 0; flex: 1; }
.serveur .noms b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.serveur .noms span { font-size: 12px; color: var(--texte-attenue); }
.serveur select { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.nav { display: flex; flex-direction: column; gap: 4px; }
.nav a { display: flex; align-items: center; gap: 12px; height: 40px; padding: 0 12px; border-radius: var(--r-controle); color: var(--texte); font-size: 15px; text-decoration: none !important; }
.nav a svg { color: var(--texte-attenue); }
.nav a:hover { background: var(--surface-alt); }
.nav a[aria-current="page"] { background: var(--accent-doux); color: var(--accent-texte); font-weight: 600; }
.nav a[aria-current="page"] svg { color: var(--accent-texte); }
.nav .rubrique { padding: 20px 12px 8px; }
.nav-bas { margin-top: auto; padding-top: 24px; }
.nav button.lien { display: flex; align-items: center; gap: 12px; height: 40px; padding: 0 12px; border-radius: var(--r-controle); border: 0; background: none; cursor: pointer; font-size: 15px; width: 100%; text-align: left; }
.nav button.lien svg { color: var(--texte-attenue); }
.nav button.lien:hover { background: var(--surface-alt); }

.contenu { padding: 32px 40px 48px; min-width: 0; }
.entete { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 32px; }
.entete .sous { margin-top: 4px; color: var(--texte-attenue); }
.entete-droite { display: flex; align-items: center; gap: 16px; flex: none; padding-top: 10px; }
.compte { width: 40px; height: 40px; border-radius: 50%; background: var(--accent-doux); color: var(--accent-texte); display: grid; place-items: center; font-weight: 600; overflow: hidden; }
.compte img { width: 100%; height: 100%; }

.barre-mobile { display: none; }
.voile { display: none; }

/* ─── Vue d'ensemble ──────────────────────────────────────── */
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 32px; }
.carte { background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--r-carte); box-shadow: var(--ombre); }
.stat { padding: 24px 20px 20px; }
.stat .valeur { font-size: 32px; font-weight: 700; letter-spacing: -0.02em; margin: 10px 0 6px; line-height: 1.1; }
.stat .detail { font-size: 13px; color: var(--texte-attenue); }
.stat .detail .hausse { color: var(--succes); font-weight: 600; }
.stat .detail .baisse { color: var(--accent-texte); font-weight: 600; }

.colonnes { display: grid; grid-template-columns: minmax(0, 696fr) minmax(0, 376fr); gap: 24px; align-items: start; }
.colonnes-module { display: grid; grid-template-columns: minmax(0, 632fr) minmax(0, 440fr); gap: 24px; align-items: start; }
.titre-ligne { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }

.grille-modules { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.module-etat { display: flex; align-items: center; gap: 14px; padding: 14px 16px; text-decoration: none !important; color: inherit; }
.module-etat:hover { border-color: var(--texte-attenue); }
.module-etat .noms { flex: 1; min-width: 0; }
.module-etat b { display: block; font-size: 16px; }
.module-etat span { font-size: 13px; color: var(--texte-attenue); }
.tuile { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; flex: none; color: var(--creme); }
.tuile svg { width: 20px; height: 20px; }
.tuile.grande { width: 56px; height: 56px; border-radius: 12px; }
.tuile.grande svg { width: 28px; height: 28px; }
.t-terracotta { background: var(--terracotta); } .t-sauge { background: var(--sauge); } .t-or { background: var(--or); }
.t-parchemin { background: var(--parchemin); color: var(--encre); }

.activite .entete-carte { display: flex; justify-content: space-between; align-items: center; padding: 18px 20px; border-bottom: 1px solid var(--bordure); }
.ligne-journal { display: flex; align-items: center; gap: 12px; padding: 14px 20px; border-bottom: 1px solid var(--bordure); }
.ligne-journal:last-child { border-bottom: 0; }
.ligne-journal .texte { flex: 1; min-width: 0; font-size: 15px; }
.ligne-journal time { font-size: 13px; color: var(--texte-attenue); white-space: nowrap; }
.vide { padding: 24px 20px; color: var(--texte-attenue); font-size: 14px; }

/* ─── Page module ─────────────────────────────────────────── */
.ariane { font-size: 14px; color: var(--texte-attenue); margin-bottom: 28px; display: flex; gap: 8px; }
.ariane b { color: var(--texte); font-weight: 600; }
.ariane a { color: var(--texte-attenue); }
.entete-module { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 28px; }
.entete-module .titre { flex: 1; min-width: 0; }
.entete-module .nom { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.entete-module .actions { display: flex; gap: 16px; padding-top: 6px; }
.modifs { font-size: 13px; color: var(--alerte-texte); align-self: center; }

.panneau { background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--r-panneau); overflow: hidden; }
.section { padding: 24px; border-bottom: 1px solid var(--bordure); display: flex; flex-direction: column; gap: 18px; }
.section:last-child { border-bottom: 0; }
.section .entete-section p { margin: 4px 0 0; font-size: 14px; color: var(--texte-attenue); }
.deux { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.option { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.option .texte b { display: block; font-weight: 600; font-size: 15px; }
.option .texte span { font-size: 13px; color: var(--texte-attenue); }

.repeteur { display: flex; flex-direction: column; gap: 10px; }
.repeteur .item { display: grid; gap: 10px; align-items: end; padding: 12px; border-radius: var(--r-carte); background: var(--surface-alt); }
.repeteur .item .suppr { border: 0; background: none; cursor: pointer; width: 44px; height: 44px; border-radius: var(--r-controle); color: var(--texte-attenue); display: grid; place-items: center; }
.repeteur .item .suppr:hover { background: var(--bordure); color: var(--texte); }
.repeteur .item .champ > label { font-size: 12px; }

.cote { display: flex; flex-direction: column; gap: 24px; position: sticky; top: 24px; }
.bloc-cote .titre-ligne { margin-bottom: 12px; }

/* ─── Aperçu Discord ──────────────────────────────────────── */
.discord { background: var(--discord-salon); border-radius: var(--r-carte); padding: 20px; color: var(--discord-texte); font-size: 15px; }
.msg { display: flex; gap: 14px; }
.msg + .msg { margin-top: 20px; }
.msg .avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--terracotta); display: grid; place-items: center; flex: none; }
.msg .avatar svg { width: 26px; fill: var(--creme); }
.msg .corps { flex: 1; min-width: 0; }
.msg .tete { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.msg .tete b { color: var(--discord-titre); font-weight: 600; font-size: 16px; }
.msg .tete .etiquette-app { background: var(--terracotta); color: var(--creme); font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 3px; }
.msg .tete time { color: var(--discord-discret); font-size: 12px; }
.msg .contenu-msg { margin-bottom: 4px; }
.embed { background: var(--discord-embed); border-left: 4px solid var(--terracotta); border-radius: 4px; padding: 12px 16px 14px; display: flex; flex-direction: column; gap: 8px; max-width: 520px; }
.embed .auteur { font-size: 12px; font-weight: 600; }
.embed .titre-embed { color: var(--discord-titre); font-weight: 700; font-size: 16px; }
.embed .desc { font-size: 14px; line-height: 1.5; white-space: pre-wrap; word-wrap: break-word; }
.embed .champs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 12px; }
.embed .champs div b { display: block; color: var(--discord-titre); font-size: 12px; }
.embed .champs div { font-size: 14px; }
.embed .pied { font-size: 12px; color: var(--discord-discret); }
.mention { background: var(--discord-mention); color: #C9CDFB; border-radius: 3px; padding: 0 2px; font-weight: 500; }
.boutons-discord { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.bd { height: 34px; padding: 0 14px; border-radius: 4px; display: inline-flex; align-items: center; font-size: 14px; font-weight: 600; background: var(--discord-bouton); color: var(--discord-titre); }
.bd.primaire { background: var(--terracotta); color: var(--creme); }
.carte-accueil { position: relative; overflow: hidden; height: 110px; border-radius: 6px; display: flex; align-items: center; gap: 14px; padding-left: 18px; }
.carte-accueil .initiale { width: 60px; height: 60px; border-radius: 50%; background: var(--creme); display: grid; place-items: center; font-weight: 700; font-size: 26px; }
.carte-accueil .kicker { font-size: 9px; letter-spacing: .14em; font-weight: 600; color: var(--creme); opacity: .85; }
.carte-accueil .pseudo { font-size: 24px; font-weight: 700; color: var(--creme); letter-spacing: -0.02em; }
.carte-accueil svg { position: absolute; right: -30px; bottom: -40px; width: 150px; fill: var(--creme); opacity: .18; }
.barre-xp { height: 8px; background: #111214; border-radius: 2px; overflow: hidden; }
.barre-xp i { display: block; height: 100%; background: var(--or); }

/* ─── Tableaux ────────────────────────────────────────────── */
.tableau-conteneur { overflow-x: auto; }
table.tableau { width: 100%; border-collapse: collapse; font-size: 14px; }
.tableau th { text-align: left; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--texte-attenue); padding: 12px 16px; border-bottom: 1px solid var(--bordure); background: var(--surface-alt); white-space: nowrap; }
.tableau td { padding: 12px 16px; border-bottom: 1px solid var(--bordure); vertical-align: top; }
.tableau tr:last-child td { border-bottom: 0; }
.tableau .actions-ligne { white-space: nowrap; text-align: right; }
.donnees { margin-top: 32px; }

.filtres { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.filtre { height: 34px; padding: 0 14px; border-radius: 17px; border: 1px solid var(--bordure); background: var(--surface); cursor: pointer; font-size: 14px; }
.filtre[aria-pressed="true"] { background: var(--accent-doux); color: var(--accent-texte); border-color: transparent; font-weight: 600; }

/* ─── Notifications ───────────────────────────────────────── */
.toasts { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; gap: 8px; z-index: 100; width: max-content; max-width: calc(100vw - 32px); }
.toast { background: var(--encre); color: var(--creme); padding: 12px 18px; border-radius: var(--r-controle); font-size: 14px; box-shadow: 0 6px 24px rgba(0,0,0,.2); display: flex; align-items: center; gap: 10px; animation: monte .2s ease-out; }
:root[data-theme="dark"] .toast { background: #3D3433; }
.toast.erreur::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--terracotta); }
.toast.ok::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #8FA585; }
@keyframes monte { from { opacity: 0; transform: translateY(8px); } }

.chargement { padding: 80px 0; text-align: center; color: var(--texte-attenue); }
.bandeau-demo { background: var(--alerte-doux); color: var(--alerte-texte); font-size: 13px; padding: 8px 12px; border-radius: var(--r-controle); margin-bottom: 24px; }

/* ─── Adaptations ─────────────────────────────────────────── */
@media (max-width: 1180px) {
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .colonnes, .colonnes-module { grid-template-columns: minmax(0, 1fr); }
  .cote { position: static; }
}
@media (max-width: 900px) {
  .login { grid-template-columns: 1fr; }
  .login-brand { min-height: 300px; padding: 64px 24px 32px; justify-content: flex-end; }
  .login-brand .piliers { left: 24px; transform: scale(.7); transform-origin: top left; }
  .login-brand h1 { font-size: 48px; }
  .login-brand p { font-size: 18px; }
  .login-brand .grand-signe { width: 260px; left: auto; right: -60px; top: 40px; opacity: .25; }
  .login-side { padding: 32px 16px 48px; align-items: start; }
  .login-card { padding: 28px 24px; }
}
@media (max-width: 860px) {
  .app { grid-template-columns: 1fr; }
  .barre { position: fixed; z-index: 50; left: 0; top: 0; width: 280px; transform: translateX(-100%); transition: transform .2s; visibility: hidden; }
  body.menu-ouvert .barre { transform: none; visibility: visible; box-shadow: 0 0 40px rgba(0,0,0,.2); }
  body.menu-ouvert .voile { display: block; position: fixed; inset: 0; background: rgba(48,40,39,.4); z-index: 40; }
  .barre-mobile { display: flex; align-items: center; gap: 10px; padding: 16px; position: sticky; top: 0; background: var(--fond); z-index: 30; border-bottom: 1px solid var(--bordure); }
  .barre-mobile .marque { margin: 0; padding: 0; flex: 1; }
  .barre-mobile .marque svg { width: 28px; }
  .menu-btn { width: 44px; height: 44px; border: 0; background: none; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 4px; border-radius: var(--r-controle); }
  .menu-btn i { width: 4px; height: 16px; background: var(--texte); clip-path: polygon(0 0, 100% 0, 100% 75%, 50% 100%, 0 75%); }
  .contenu { padding: 24px 16px 40px; }
  .h-page { font-size: 28px; }
  .entete { flex-direction: column; margin-bottom: 24px; }
  .entete .compte { display: none; }
  .entete-droite { padding-top: 0; }
  .stats { gap: 12px; }
  .stat { padding: 16px 14px; }
  .stat .valeur { font-size: 26px; }
  .grille-modules { grid-template-columns: 1fr; gap: 12px; }
  .entete-module { flex-wrap: wrap; }
  .entete-module .actions { width: 100%; padding-top: 0; }
  .entete-module .actions .btn { flex: 1; }
  .deux { grid-template-columns: 1fr; }
  .section { padding: 20px 16px; }
  .embed .champs { grid-template-columns: 1fr 1fr; }
  .ligne-journal { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }