/* Douvissie — Les Terres Brumeuses
   Thème unique « nuit » : fond noir pur (pixels éteints sur OLED). */

@font-face {
  font-family: "Cinzel";
  src: url("../fonts/cinzel-latin-400-normal.woff2") format("woff2");
  font-weight: 400; font-display: swap;
}
@font-face {
  font-family: "Cinzel";
  src: url("../fonts/cinzel-latin-700-normal.woff2") format("woff2");
  font-weight: 700; font-display: swap;
}
/* v1.10.0 : l'écriture du Barde sur le parchemin (Almendra, SIL OFL 1.1) */
@font-face {
  font-family: "Almendra";
  src: url("../fonts/almendra-latin-400-normal.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Almendra";
  src: url("../fonts/almendra-latin-400-italic.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Almendra";
  src: url("../fonts/almendra-latin-ext-400-normal.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Almendra";
  src: url("../fonts/almendra-latin-ext-400-italic.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* v0.23.0 : les lettres accentuées d'Europe centrale (le polonais : ą ę ł ś ż…), chargées seulement si la page en contient */
@font-face {
  font-family: "Cinzel";
  src: url("../fonts/cinzel-latin-ext-400-normal.woff2") format("woff2");
  font-weight: 400; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Cinzel";
  src: url("../fonts/cinzel-latin-ext-700-normal.woff2") format("woff2");
  font-weight: 700; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --nuit: #000;
  --encre: #0b0910;
  --surface: #110e18;
  --surface-2: #1a1524;
  --trait: #2c2440;
  --trait-fort: #463a63;
  --texte: #ece4d0;
  --texte-doux: #a69db8;
  --texte-faible: #6f6782;
  --or: #d4ad5a;
  --or-clair: #f0d48f;
  --or-sombre: #8a6d2e;
  --brume: #8a6cc9;
  --brume-sombre: #3a2a5e;
  --succes: #7dbb88;
  --danger: #e07a6e;
  --parchemin: #e8dbbd;
  --parchemin-encre: #3b2a17;
  --rayon: 14px;
  --titre: "Cinzel", "Trajan Pro", Georgia, serif;
  --corps: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100dvh;
  background: var(--nuit);
  color: var(--texte);
  font: 16px/1.5 var(--corps);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  overscroll-behavior-y: none;
}

/* ---------------------------------------------------------------- Brume de fond */
.brume-fond {
  position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none;
}
.brume-fond::before, .brume-fond::after {
  content: ""; position: absolute; width: 140vmax; height: 140vmax; left: -20vmax; border-radius: 50%;
  background: radial-gradient(circle, rgba(138,108,201,.16) 0%, rgba(58,42,94,.08) 35%, transparent 65%);
  animation: derive 38s ease-in-out infinite alternate;
}
.brume-fond::before { top: 35vh; }
.brume-fond::after  { top: 60vh; left: -60vmax; animation-duration: 52s; animation-direction: alternate-reverse; opacity: .7; }
@keyframes derive { from { transform: translateX(-8vw) scale(1); } to { transform: translateX(14vw) scale(1.12); } }
@media (prefers-reduced-motion: reduce) { .brume-fond::before, .brume-fond::after { animation: none; } }

/* ---------------------------------------------------------------- Mise en page */
.app {
  max-width: 480px; margin: 0 auto;
  padding: max(16px, env(safe-area-inset-top)) 16px calc(96px + env(safe-area-inset-bottom));
}
.app.sans-nav { padding-bottom: max(24px, env(safe-area-inset-bottom)); }

h1, h2, h3 { font-family: var(--titre); font-weight: 700; letter-spacing: .04em; margin: 0; }
h1 { font-size: 1.9rem; line-height: 1.15; color: var(--or-clair); }
h2 { font-size: 1.15rem; color: var(--or); }
h3 { font-size: .95rem; color: var(--texte); letter-spacing: .06em; }
p { margin: 0; }
a { color: var(--or-clair); }

.pile > * + * { margin-top: 16px; }
.pile-serree > * + * { margin-top: 8px; }
.doux { color: var(--texte-doux); }
.faible { color: var(--texte-faible); font-size: .875rem; }
.centre { text-align: center; }

/* ---------------------------------------------------------------- Accueil */
.blason { display: grid; place-items: center; padding: 6vh 0 8px; }
.blason svg { width: 112px; height: 112px; filter: drop-shadow(0 0 24px rgba(212,173,90,.25)); }
.titre-jeu { text-align: center; }
.titre-jeu h1 { font-size: 2.4rem; letter-spacing: .14em; }
.titre-jeu .sous-titre {
  font-family: var(--titre); color: var(--brume); letter-spacing: .3em; font-size: .78rem;
  text-transform: uppercase; margin-top: 4px;
}
.lore { text-align: center; color: var(--texte-doux); max-width: 34ch; margin: 20px auto 0; font-style: italic; }

/* ---------------------------------------------------------------- En-tête des vues */
.entete { display: flex; align-items: center; gap: 12px; margin: 4px 0 20px; }
.entete .retour {
  flex: none; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--trait);
  background: transparent; color: var(--texte-doux); display: grid; place-items: center; cursor: pointer;
}
.entete .retour:active { background: var(--surface); }
.entete h1 { font-size: 1.45rem; }
.entete .sur-titre { font-family: var(--titre); color: var(--brume); font-size: .72rem; letter-spacing: .24em; text-transform: uppercase; }

/* ---------------------------------------------------------------- Cartes */
.carte {
  background: linear-gradient(180deg, var(--surface) 0%, var(--encre) 100%);
  border: 1px solid var(--trait); border-radius: var(--rayon); padding: 18px;
  position: relative;
}
.carte.doree { border-color: var(--or-sombre); box-shadow: inset 0 1px 0 rgba(240,212,143,.08); }
.carte.alerte { border-color: #6b5226; background: linear-gradient(180deg, #1d1609 0%, var(--encre) 100%); }
.carte.danger { border-color: #5a2722; }
.carte h2 + p, .carte h2 + .doux { margin-top: 6px; }
.carte-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

/* ---------------------------------------------------------------- Formulaires */
form { margin: 0; }
.champ { display: block; }
.champ + .champ { margin-top: 14px; }
.champ > span { display: block; font-size: .85rem; color: var(--texte-doux); margin-bottom: 6px; }
.champ > span em { font-style: normal; color: var(--texte-faible); }
.saisie { position: relative; }
input[type=text], input[type=password], input[type=email], textarea {
  width: 100%; font: inherit; font-size: 16px; /* 16px : pas de zoom auto sur iPhone */
  color: var(--texte); background: var(--nuit);
  border: 1px solid var(--trait-fort); border-radius: 10px; padding: 12px 14px; outline: none;
  transition: border-color .15s, box-shadow .15s;
}
textarea { min-height: 96px; resize: vertical; }
.saisie input { padding-right: 52px; }
input:focus, textarea:focus { border-color: var(--or); box-shadow: 0 0 0 3px rgba(212,173,90,.18); }
.champ.en-erreur input, .champ.en-erreur textarea { border-color: var(--danger); }
.erreur-champ { color: var(--danger); font-size: .85rem; margin-top: 6px; }
.oeil {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border: 0; background: transparent; color: var(--texte-faible); cursor: pointer;
  display: grid; place-items: center; border-radius: 8px;
}
.oeil[aria-pressed=true] { color: var(--or); }

.aide { font-size: .82rem; color: var(--texte-faible); margin-top: 6px; }

/* ---------------------------------------------------------------- Boutons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 20px; border-radius: 12px; border: 1px solid transparent;
  font-family: var(--titre); font-weight: 700; font-size: .92rem; letter-spacing: .08em;
  cursor: pointer; text-decoration: none; transition: transform .08s, filter .15s, background .15s;
  -webkit-user-select: none; user-select: none;
}
.btn:active { transform: scale(.98); }
.btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; }
.btn.plein { width: 100%; }
.btn-or {
  color: #1b1307; background: linear-gradient(180deg, var(--or-clair) 0%, var(--or) 55%, #b48c3c 100%);
  box-shadow: 0 6px 24px -10px rgba(212,173,90,.6), inset 0 1px 0 rgba(255,255,255,.35);
}
.btn-contour { color: var(--or-clair); background: transparent; border-color: var(--or-sombre); }
.btn-discret { color: var(--texte-doux); background: var(--surface-2); border-color: var(--trait); font-family: var(--corps); font-weight: 600; letter-spacing: 0; }
.btn-danger { color: #fff1ee; background: #8f342b; border-color: #b4483d; }
.btn-petit { min-height: 38px; padding: 0 14px; font-size: .82rem; border-radius: 10px; }
.btn.charge { position: relative; color: transparent !important; }
.btn.charge::after {
  content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid #1b1307; border-right-color: transparent; animation: tourne .7s linear infinite;
}
.btn-contour.charge::after, .btn-discret.charge::after { border-color: var(--or); border-right-color: transparent; }
@keyframes tourne { to { transform: rotate(360deg); } }
.rangee { display: flex; gap: 10px; flex-wrap: wrap; }
.rangee > .btn { flex: 1 1 auto; }

.lien {
  background: none; border: 0; padding: 8px 0; color: var(--or-clair); font: inherit; font-size: .92rem;
  cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--or-sombre);
}

/* ---------------------------------------------------------------- Onglets */
.onglets { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; padding: 4px; background: var(--surface); border: 1px solid var(--trait); border-radius: 12px; }
.onglets button {
  min-height: 40px; border: 0; border-radius: 9px; background: transparent; color: var(--texte-doux);
  font: 600 .86rem var(--corps); cursor: pointer;
}
.onglets button[aria-selected=true] { background: var(--surface-2); color: var(--or-clair); box-shadow: inset 0 0 0 1px var(--trait-fort); }

/* ---------------------------------------------------------------- Pastilles */
.pastille { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 600; padding: 3px 10px; border-radius: 99px; border: 1px solid var(--trait-fort); color: var(--texte-doux); white-space: nowrap; }
.pastille.ok { color: var(--succes); border-color: #2f5a37; }
.pastille.attente { color: var(--or); border-color: var(--or-sombre); }
.pastille.ko { color: var(--danger); border-color: #5a2722; }
.pastille.admin { color: var(--brume); border-color: var(--brume-sombre); }

/* ---------------------------------------------------------------- Parchemin */
.parchemin {
  background:
    radial-gradient(ellipse at 20% 0%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(ellipse at 100% 100%, rgba(120,80,30,.25), transparent 55%),
    var(--parchemin);
  color: var(--parchemin-encre); border-radius: 6px; padding: 22px 18px 18px;
  box-shadow: 0 0 0 1px #c8b48a, 0 0 0 5px #000, 0 0 0 6px var(--or-sombre), 0 20px 40px -20px rgba(212,173,90,.35);
}
.parchemin .titre-parchemin { font-family: var(--titre); text-align: center; letter-spacing: .2em; font-size: .78rem; text-transform: uppercase; color: #7a5a2b; }
.mots { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; counter-reset: mot; }
.mots li { counter-increment: mot; font-family: var(--titre); font-weight: 700; font-size: 1.15rem; letter-spacing: .04em; display: flex; align-items: baseline; gap: 8px; border-bottom: 1px dashed rgba(59,42,23,.3); padding-bottom: 6px; }
.mots li::before { content: counter(mot); font-family: var(--corps); font-size: .75rem; color: #8b6c3d; min-width: 1em; }
.parchemin .pied { margin-top: 14px; font-size: .8rem; color: #6b5233; text-align: center; }

.coche { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; padding: 12px; border: 1px solid var(--trait); border-radius: 12px; background: var(--encre); }
.coche input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--or); flex: none; }

/* ---------------------------------------------------------------- Listes */
.liste { list-style: none; margin: 0; padding: 0; }
.liste > li { padding: 14px 0; border-top: 1px solid var(--trait); }
.liste > li:first-child { border-top: 0; padding-top: 4px; }
.joueur-tete { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.joueur-tete strong { font-size: 1.02rem; }
.joueur-actions { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }

.diag li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; }
.diag .etat { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: .85rem; font-weight: 700; border: 1px solid var(--trait-fort); color: var(--texte-faible); }
.diag .etat.ok { color: #0b1a0e; background: var(--succes); border-color: var(--succes); }
.diag .etat.ko { color: #200a07; background: var(--danger); border-color: var(--danger); }
.diag .etat.attente { color: var(--or); border-color: var(--or-sombre); }
.diag .quoi { font-weight: 600; }
.diag .detail { font-size: .85rem; color: var(--texte-doux); }

.mail { border: 1px solid var(--trait); border-radius: 12px; padding: 12px; background: var(--nuit); }
.mail + .mail { margin-top: 10px; }
.mail summary { cursor: pointer; list-style: none; }
.mail summary::-webkit-details-marker { display: none; }
.mail pre { white-space: pre-wrap; word-break: break-word; font: .85rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--texte-doux); margin: 10px 0 0; }

.code-geant { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 2rem; letter-spacing: .14em; color: var(--or-clair); text-align: center; padding: 14px; border: 1px dashed var(--or-sombre); border-radius: 12px; background: var(--nuit); }

/* ---------------------------------------------------------------- Citadelle (aperçu) */
.citadelle-illu { display: grid; place-items: center; padding: 8px 0 4px; }
.citadelle-illu svg { width: 100%; max-width: 300px; height: auto; }

/* ---------------------------------------------------------------- Navigation basse */
.nav {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 10;
  background: rgba(0,0,0,.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-top: 1px solid var(--trait);
  padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
}
.nav ul { list-style: none; margin: 0 auto; padding: 0; max-width: 480px; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; }
.nav a {
  display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 0; min-height: 52px; justify-content: center;
  color: var(--texte-faible); text-decoration: none; font-size: .72rem; font-weight: 600; letter-spacing: .02em; border-radius: 10px;
}
.nav a svg { width: 24px; height: 24px; }
.nav a[aria-current=page] { color: var(--or-clair); }

/* ---------------------------------------------------------------- Notifications */
.toasts { position: fixed; left: 0; right: 0; top: max(12px, env(safe-area-inset-top)); z-index: 50; display: grid; justify-items: center; gap: 8px; pointer-events: none; padding: 0 16px; }
.toast {
  pointer-events: auto; max-width: 448px; width: 100%;
  background: var(--surface-2); color: var(--texte); border: 1px solid var(--trait-fort); border-left: 4px solid var(--or);
  border-radius: 12px; padding: 12px 14px; font-size: .92rem; box-shadow: 0 12px 30px -10px #000;
  animation: entre .25s ease-out;
}
.toast.ok { border-left-color: var(--succes); }
.toast.ko { border-left-color: var(--danger); }
.toast.info { border-left-color: var(--brume); }
@keyframes entre { from { opacity: 0; transform: translateY(-8px); } }

/* ---------------------------------------------------------------- Test du Veilleur */
.veilleur {
  position: fixed; inset: 0; z-index: 100; background: #000; color: #2a2238;
  display: grid; place-items: center; text-align: center; padding: 24px;
  -webkit-user-select: none; user-select: none; touch-action: none;
}
.veilleur .compte { font-family: var(--titre); font-size: 1rem; letter-spacing: .2em; }
.veilleur .indice { font-size: .78rem; margin-top: 8px; }

/* ---------------------------------------------------------------- Divers */
.separateur { display: flex; align-items: center; gap: 12px; color: var(--texte-faible); font-size: .8rem; margin: 20px 0; }
.separateur::before, .separateur::after { content: ""; flex: 1; height: 1px; background: var(--trait); }
.version { text-align: center; color: var(--texte-faible); font-size: .75rem; margin-top: 28px; }
.cache { display: none !important; }
:focus-visible { outline: 2px solid var(--or); outline-offset: 2px; }

/* ================================================================ Lots 2-3 : carte et expédition */
.stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 12px; }
.stats > div { display: flex; flex-direction: column; }
.stats .v, .butin-chiffres .v { font-family: var(--titre); font-weight: 700; color: var(--or-clair); font-size: 1.35rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stats .l, .butin-chiffres .l { font-size: .78rem; color: var(--texte-faible); letter-spacing: .02em; }
.butin-chiffres { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; text-align: center; }
.butin-chiffres .grand .v { font-size: 2.6rem; display: block; }
.butin-chiffres .grand + .grand .v { color: var(--brume); }

.vue-carte { position: fixed; inset: 0; background: #000; z-index: 1; }
.vue-carte.avec-nav { bottom: calc(66px + env(safe-area-inset-bottom)); }
.carte-plein, .vue-carte .carte-plein.maplibregl-map { position: absolute; inset: 0; width: 100%; height: 100%; }
.mini-carte { height: 240px; border-radius: var(--rayon); overflow: hidden; border: 1px solid var(--trait); background: #000; }

.hud-haut {
  position: absolute; left: 12px; right: 12px; top: max(12px, env(safe-area-inset-top)); z-index: 3;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; pointer-events: none;
}
.hud-haut.hud-royaume { display: flex; justify-content: space-between; align-items: center; pointer-events: auto; }
.hud-stat, .pastille-carte {
  background: rgba(0,0,0,.78); border: 1px solid var(--trait-fort); border-radius: 12px; padding: 8px 10px;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); text-align: center;
}
.hud-stat .v { display: block; font-family: var(--titre); font-weight: 700; color: var(--or-clair); font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.hud-stat .l { font-size: .7rem; color: var(--texte-faible); text-transform: uppercase; letter-spacing: .08em; }
.pastille-carte { font-size: .88rem; color: var(--texte-doux); }
.pastille-carte span { font-family: var(--titre); color: var(--or-clair); font-weight: 700; }

.hud-gps {
  position: absolute; left: 50%; transform: translateX(-50%); top: calc(max(12px, env(safe-area-inset-top)) + 70px); z-index: 3;
  background: rgba(0,0,0,.78); border: 1px solid var(--trait); border-radius: 99px; padding: 4px 12px;
  font-size: .78rem; color: var(--or); white-space: nowrap; max-width: calc(100% - 24px); overflow: hidden; text-overflow: ellipsis;
}
.hud-gps.ok { color: var(--succes); }
.hud-gps.ko { color: var(--danger); border-color: #5a2722; }

.hud-bas {
  position: absolute; left: 12px; right: 12px; bottom: max(16px, env(safe-area-inset-bottom)); z-index: 3;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.hud-bas .maintenir { flex: 1; }
.hud-bas-droite { position: absolute; left: 12px; bottom: 16px; z-index: 3; }
.vue-carte.avec-nav .maplibregl-ctrl-bottom-right { bottom: 0; }
.rond {
  width: 52px; height: 52px; border-radius: 50%; flex: none; display: grid; place-items: center; cursor: pointer;
  background: rgba(0,0,0,.85); color: var(--texte-doux); border: 1px solid var(--trait-fort);
}
.rond.actif { color: var(--or-clair); border-color: var(--or-sombre); }

.bandeau-carte {
  position: absolute; left: 12px; right: 12px; top: calc(max(12px, env(safe-area-inset-top)) + 60px); z-index: 3;
  background: rgba(17,14,24,.92); border: 1px solid var(--trait-fort); border-radius: 12px; padding: 10px 12px;
  font-size: .85rem; color: var(--texte-doux);
}

/* Bouton à maintenir : jauge qui se remplit */
.maintenir { position: relative; overflow: hidden; touch-action: none; }
.maintenir span { position: relative; z-index: 1; }
.maintenir::before {
  content: ""; position: absolute; inset: 0; background: rgba(255,255,255,.35);
  transform: scaleX(0); transform-origin: left; transition: transform 120ms linear;
}
.maintenir.appui::before { transform: scaleX(1); transition-duration: var(--duree-appui, 1200ms); }

/* Mode Veilleur pendant l'expédition */
.vue-carte .veilleur { z-index: 10; }
.veilleur .v-flash { margin-top: 18px; font-family: var(--titre); letter-spacing: .12em; color: #4b3a6b; opacity: 0; transition: opacity .4s; }
.veilleur .v-flash.visible { opacity: 1; }

.marqueur-fief { filter: drop-shadow(0 0 6px rgba(240,212,143,.6)); pointer-events: none; }

/* MapLibre en thème nuit */
.maplibregl-ctrl-attrib, .maplibregl-ctrl-attrib.maplibregl-compact { background: rgba(0,0,0,.7) !important; color: var(--texte-faible); }
.maplibregl-ctrl-attrib a, .maplibregl-ctrl-attrib-inner { color: var(--texte-doux) !important; }
.maplibregl-ctrl-attrib-button { filter: invert(1) opacity(.6); }
.vue-carte .maplibregl-ctrl-bottom-right { bottom: 76px; }
details.carte > summary { list-style: none; }
details.carte > summary::-webkit-details-marker { display: none; }
details.carte[open] > summary .faible { display: none; }

/* ================================================================ Croisade, Retour de voyage, serment */
.hud-gps.croisade { color: var(--brume); border-color: var(--brume-sombre); }
.modale {
  position: fixed; inset: 0; z-index: 60; background: rgba(0,0,0,.82);
  display: grid; place-items: center; padding: 16px; overflow-y: auto;
  animation: entre .2s ease-out;
}
.modale > .carte { width: 100%; max-width: 448px; }
.sur-titre-modale { font-family: var(--titre); color: var(--brume); font-size: .72rem; letter-spacing: .24em; text-transform: uppercase; }
.choix-trajet {
  display: flex; flex-direction: column; gap: 2px; text-align: left; width: 100%; cursor: pointer;
  background: var(--nuit); color: var(--texte); border: 1px solid var(--trait-fort); border-radius: 12px; padding: 12px 14px;
  font: inherit;
}
.choix-trajet:hover, .choix-trajet:focus-visible { border-color: var(--or); }
.choix-trajet strong { font-size: 1rem; }
.choix-trajet span { font-size: .82rem; color: var(--texte-doux); }
.stats { grid-template-columns: repeat(2, 1fr); }

/* ================================================================ Lot 4 : Citadelle, chroniques, grimoire */
.maquette { position: relative; height: 300px; border-radius: var(--rayon); overflow: hidden; border: 1px solid var(--or-sombre);
  background: radial-gradient(ellipse at 50% 70%, #1a1230 0%, #000 70%); box-shadow: 0 20px 50px -30px rgba(212,173,90,.5); }
.maquette-carte { position: absolute; inset: 0; }
.maquette-carte.maplibregl-map { position: absolute; }
.maquette-hud { position: absolute; left: 10px; right: 10px; top: 10px; display: flex; gap: 6px; flex-wrap: wrap; pointer-events: none; z-index: 2; }
.maquette .maplibregl-ctrl-bottom-right { display: none; }
.jeton { font-family: var(--titre); font-weight: 700; font-size: .8rem; letter-spacing: .04em; padding: 5px 10px; border-radius: 99px;
  background: rgba(0,0,0,.72); border: 1px solid var(--trait-fort); color: var(--texte-doux); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.jeton.or { color: var(--or-clair); border-color: var(--or-sombre); }
.jeton.brume { color: #cbb8ff; border-color: var(--brume-sombre); }

.presage { margin: 12px 0 0; padding: 10px 14px; border-left: 3px solid var(--brume); background: rgba(138,108,201,.08);
  border-radius: 0 10px 10px 0; font-style: italic; color: var(--texte); }
.chronique h3 { margin-top: 18px; color: var(--or); font-size: .82rem; letter-spacing: .14em; text-transform: uppercase; }
.chronique { max-height: calc(100dvh - 32px); overflow-y: auto; }
.intro-chronique { font-style: italic; color: var(--texte-doux); margin-top: 8px; }
.recit { margin: 8px 0 0; padding-left: 18px; }
.recit li { margin: 6px 0; color: var(--texte); }
.recit li::marker { color: var(--or); content: "✦  "; }
.recit .ev-siege, .recit .ev-perdue, .recit .ev-evasion { color: #f0b3aa; }
.recit .ev-capture { color: #ffd2a0; }
.alerte-chronique { margin-top: 10px; padding: 8px 12px; border-radius: 10px; background: rgba(224,122,110,.12); border: 1px solid #5a2722; color: #f5c2bb; font-size: .9rem; }
.rouge { color: #ff8a70; }

.defi { padding: 12px; border: 1px solid var(--trait-fort); border-radius: 12px; background: var(--nuit); margin-top: 8px; }
.defi.reussi { border-color: #2f5a37; background: rgba(125,187,136,.07); }
.defi-tete { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.defi-tete span { font-family: var(--titre); color: var(--or-clair); white-space: nowrap; }
.defi.reussi .defi-tete span { color: var(--succes); }
.jauge { height: 8px; border-radius: 99px; background: var(--surface-2); overflow: hidden; margin: 8px 0 6px; border: 1px solid var(--trait); }
.jauge span { display: block; height: 100%; background: linear-gradient(90deg, var(--or-sombre), var(--or-clair)); border-radius: 99px; transition: width .6s; }

.batiments li { padding: 12px 0; }
.bat-tete { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; }
.bat-icone { width: 38px; height: 38px; flex: none; display: grid; place-items: center; font-size: 1.2rem; color: var(--or-clair);
  border: 1px solid var(--or-sombre); border-radius: 10px; background: radial-gradient(circle at 50% 30%, #2a2040, #0b0910);
  clip-path: polygon(25% 3%, 75% 3%, 100% 50%, 75% 97%, 25% 97%, 0 50%); }
.pips { display: flex; gap: 4px; margin-top: 4px; }
.pips i { width: 12px; height: 6px; border-radius: 2px; background: var(--surface-2); border: 1px solid var(--trait-fort); }
.pips i.plein { background: var(--or); border-color: var(--or-clair); box-shadow: 0 0 6px rgba(240,212,143,.4); }

.choix-trajet.rune.active { border-color: var(--brume); background: rgba(138,108,201,.12); }
.choix-trajet[disabled] { opacity: .5; cursor: not-allowed; }
.semaine-haltes { margin-top: 10px; font-family: var(--titre); font-size: .85rem; color: var(--or-clair); letter-spacing: .02em; }
.types-halte { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.types-halte .choix-trajet { padding: 8px 10px; }
.types-halte .choix-trajet strong { font-size: .92rem; line-height: 1.2; }
.types-halte .choix-trajet span { font-size: .75rem; }

.fragments { display: flex; gap: 8px; margin: 12px 0 8px; }
.fragments span { width: 44px; height: 56px; border-radius: 4px; border: 1px dashed var(--trait-fort); background: var(--nuit); transform: rotate(-3deg); }
.fragments span:nth-child(2n) { transform: rotate(4deg); }
.fragments span.trouve { border: 1px solid #c8b48a; background: linear-gradient(135deg, #e8dbbd, #b99c6a); box-shadow: 0 4px 14px -6px rgba(212,173,90,.8); }

/* Cartes à retourner (3D) */
.grille-cartes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.carte-objet { position: relative; height: 210px; perspective: 900px; background: none; border: 0; padding: 0; cursor: pointer; font: inherit; color: inherit; text-align: center; }
.carte-objet .face, .carte-objet .dos {
  position: absolute; inset: 0; border-radius: 14px; backface-visibility: hidden; -webkit-backface-visibility: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 14px;
  transition: transform .7s cubic-bezier(.2,.8,.2,1); border: 1px solid var(--trait-fort);
}
.carte-objet .face { background: radial-gradient(circle at 50% 25%, #2a2040 0%, #0b0910 75%); }
.carte-objet .dos { background: var(--parchemin); color: var(--parchemin-encre); transform: rotateY(180deg); justify-content: space-between; }
.carte-objet.retournee .face { transform: rotateY(-180deg); }
.carte-objet.retournee .dos { transform: rotateY(0deg); }
.carte-objet .sigle { font-size: 2rem; color: var(--or-clair); text-shadow: 0 0 18px rgba(240,212,143,.6); }
.carte-objet strong { font-family: var(--titre); font-size: .95rem; line-height: 1.25; }
.carte-objet em { font-style: normal; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--texte-faible); }
.carte-objet .dos em { color: #7a5a2b; }
.carte-objet .histoire { font-size: .8rem; line-height: 1.4; overflow-y: auto; }
.carte-objet.rare .face { border-color: #6b5aa8; box-shadow: inset 0 0 30px rgba(138,108,201,.25); }
.carte-objet.rare em { color: #b7a3ef; }
.carte-objet.legendaire .face { border-color: var(--or); box-shadow: inset 0 0 40px rgba(240,212,143,.25), 0 0 20px -6px rgba(240,212,143,.6); }
.carte-objet.legendaire em { color: var(--or-clair); }
.carte-objet.inconnu { cursor: default; }
.carte-objet.inconnu .face { opacity: .45; }
.carte-objet.inconnu .sigle { color: var(--texte-faible); text-shadow: none; }
.modale .carte-objet { width: 100%; height: 300px; }
.modale .carte-objet .histoire { font-size: .95rem; }
@media (prefers-reduced-motion: reduce) { .carte-objet .face, .carte-objet .dos { transition: none; } }

/* Bandeau de trouvaille pendant la marche : discret, ne bloque rien */
.bandeau-trouvaille {
  position: absolute; left: 12px; right: 12px; bottom: calc(max(16px, env(safe-area-inset-bottom)) + 70px); z-index: 4;
  display: flex; align-items: center; gap: 12px; text-align: left; cursor: pointer; font: inherit; color: var(--texte);
  background: rgba(17,14,24,.95); border: 1px solid var(--or-sombre); border-radius: 14px; padding: 10px 14px;
  box-shadow: 0 0 30px -8px rgba(240,212,143,.6); animation: entre .4s ease-out;
}
.bandeau-trouvaille .sigle { font-size: 1.5rem; color: var(--or-clair); text-shadow: 0 0 14px rgba(240,212,143,.8); animation: scintille 1.6s ease-in-out infinite; }
.bandeau-trouvaille strong { display: block; font-family: var(--titre); }
.bandeau-trouvaille em { font-style: normal; font-size: .78rem; color: var(--texte-doux); }
.bandeau-trouvaille.legendaire { border-color: var(--or); }
@keyframes scintille { 50% { opacity: .5; transform: scale(.85) rotate(20deg); } }

/* Feuille d'actions de la carte */
.modale.feuille { align-items: end; }
.hud-bas-droite { display: flex; flex-direction: column; gap: 10px; }
#b-3d { font-family: var(--titre); font-weight: 700; font-size: .8rem; color: var(--or-clair); }

/* ================================================================ Lot 5 : le Fief vivant, Compagnons, jour et nuit */
.or { color: var(--or-clair); }
.maquette { height: 340px; cursor: pointer; }
.maquette-carte canvas, .scene-fief canvas { display: block; touch-action: none; }
.maquette-bas { position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px; z-index: 2; }
.maquette-bas .faible { background: rgba(0,0,0,.6); padding: 4px 8px; border-radius: 8px; font-size: .78rem; }
.scene-fief { position: relative; height: min(62dvh, 560px); margin: 0 -16px; overflow: hidden;
  background: radial-gradient(ellipse at 50% 70%, #1a1230 0%, #000 75%); border-block: 1px solid var(--or-sombre); }
.scene-fief > canvas { position: absolute; inset: 0; }
.scene-aide { position: absolute; left: 0; right: 0; bottom: 10px; text-align: center; font-size: .78rem; color: var(--texte-faible);
  pointer-events: none; text-shadow: 0 1px 3px #000; }
.bat-tete h2 { margin: 0; }
.hud-compagnie { position: absolute; left: 50%; transform: translateX(-50%); top: calc(max(12px, env(safe-area-inset-top)) + 104px); z-index: 4;
  background: rgba(20,12,40,.88); border: 1px solid var(--brume); color: #e3d8ff; padding: 6px 14px; border-radius: 99px;
  font-size: .85rem; font-weight: 600; white-space: nowrap; box-shadow: 0 0 18px rgba(138,108,201,.45); }
.hud-lien { top: calc(max(12px, env(safe-area-inset-top)) + 140px); border-color: #e8a0c8; color: #ffe0f0; }
.recit-noces { font-style: italic; border-left: 3px solid var(--or-sombre); padding-left: 10px; }
.fiche-lignes { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 8px; }
.fiche-lignes li { display: flex; justify-content: space-between; gap: 12px; font-size: .92rem; color: var(--texte-doux);
  border-bottom: 1px dashed var(--trait); padding-bottom: 6px; }
.fiche-lignes li strong { color: var(--texte); text-align: right; }
.meteo-carte { font-size: .78rem; color: var(--texte-faible); margin-top: 2px; }
.meteo-carte:empty { display: none; }
.choix-animal { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.choix-animal .coche { margin: 0; }
/* ================================================================ Lot 6 : la Cour */
.carte.fete { border-color: var(--or); background: linear-gradient(160deg, rgba(212,173,90,.18), rgba(138,108,201,.14)); }
select { background: var(--encre); color: var(--texte); border: 1px solid var(--trait-fort); border-radius: 12px; padding: 10px; font: inherit; }
.btn-danger:disabled { opacity: .45; }
/* ================================================================ Lot 6 : la Cour */
.carte.fete { border-color: var(--or); background: linear-gradient(160deg, rgba(212,173,90,.18), rgba(138,108,201,.14)); }
select { background: var(--encre); color: var(--texte); border: 1px solid var(--trait-fort); border-radius: 12px; padding: 10px; font: inherit; }
.btn-danger:disabled { opacity: .45; }

/* ================================================================ Arpenteurs croisés (v0.7.1) */
hr.filet { border: 0; border-top: 1px solid rgba(255,255,255,.08); margin: 10px 0; }
.croise select { flex: 0 0 9.5rem; min-width: 9.5rem; }
.croise .rangee .btn { flex: 1; }
.choix-maison { border: 1px solid var(--or-sombre, #8a6d2c); border-radius: 14px; padding: 12px; margin-top: 12px; }

/* ================================================================ Thème « jour » (v0.7.5)
   Le jour (soleil levé à l'endroit du royaume), l'appli passe en tons clairs : parchemin, encre et or.
   La nuit, retour au noir pur. Réglable dans Profil (automatique, toujours clair, toujours sombre).
   Le Mode Veilleur (écran noir pendant la marche) reste noir. */
html[data-theme="jour"] {
  --nuit: #f5efe2;
  --encre: #fffaf0;
  --surface: #fbf5e8;
  --surface-2: #efe5d0;
  --trait: #e0d3b6;
  --trait-fort: #c8b48a;
  --texte: #2b2233;
  --texte-doux: #574b63;
  --texte-faible: #857a8e;
  --or: #9b7424;
  --or-clair: #7d5a12;
  --or-sombre: #cdb27a;
  --brume: #6a4fb3;
  --brume-sombre: #d8ccf0;
  --succes: #2e7a3f;
  --danger: #b43c2f;
  color-scheme: light;
}
html[data-theme="jour"] body { transition: background-color .6s, color .6s; }
html[data-theme="jour"] .brume-fond::before, html[data-theme="jour"] .brume-fond::after {
  background: radial-gradient(circle, rgba(212,173,90,.16) 0%, rgba(138,108,201,.06) 35%, transparent 65%); }
html[data-theme="jour"] .btn-or { background: linear-gradient(180deg, #f0d48f 0%, #d4ad5a 55%, #b48c3c 100%); color: #1b1307;
  box-shadow: 0 6px 18px -10px rgba(155,116,36,.7), inset 0 1px 0 rgba(255,255,255,.5); }
html[data-theme="jour"] .nav { background: rgba(255,250,240,.94); }
html[data-theme="jour"] .toast { box-shadow: 0 12px 30px -14px rgba(60,40,10,.45); }
html[data-theme="jour"] .carte.alerte { border-color: #d9b26a; background: linear-gradient(180deg, #fbeccb 0%, var(--encre) 100%); }
html[data-theme="jour"] .carte.danger, html[data-theme="jour"] .pastille.ko { border-color: #e3a79f; }
html[data-theme="jour"] .pastille.ok, html[data-theme="jour"] .defi.reussi { border-color: #9fd0a9; }
html[data-theme="jour"] .vue-carte, html[data-theme="jour"] .mini-carte { background: #f5efe2; }
html[data-theme="jour"] .hud-stat, html[data-theme="jour"] .pastille-carte, html[data-theme="jour"] .hud-gps,
html[data-theme="jour"] .rond, html[data-theme="jour"] .bandeau-carte, html[data-theme="jour"] .bandeau-trouvaille,
html[data-theme="jour"] .jeton, html[data-theme="jour"] .maquette-bas .faible { background: rgba(255,250,240,.9); }
html[data-theme="jour"] .maplibregl-ctrl-attrib, html[data-theme="jour"] .maplibregl-ctrl-attrib.maplibregl-compact { background: rgba(255,250,240,.8) !important; }
html[data-theme="jour"] .modale { background: rgba(40,30,20,.45); }
html[data-theme="jour"] .maquette, html[data-theme="jour"] .scene-fief { background: radial-gradient(ellipse at 50% 70%, #fff8e6 0%, #e9dcc0 75%); }
html[data-theme="jour"] .scene-aide { text-shadow: 0 1px 3px #fff; }
html[data-theme="jour"] .jeton.brume, html[data-theme="jour"] .carte-objet.rare em { color: #5a3fa8; }
html[data-theme="jour"] .bat-icone, html[data-theme="jour"] .carte-objet .face { background: radial-gradient(circle at 50% 30%, #fff6dd, #ead9b0); }
html[data-theme="jour"] .recit .ev-siege, html[data-theme="jour"] .recit .ev-perdue, html[data-theme="jour"] .recit .ev-evasion,
html[data-theme="jour"] .rouge { color: #a8392c; }
html[data-theme="jour"] .recit .ev-capture { color: #9a5a10; }
html[data-theme="jour"] .alerte-chronique { color: #8f2f24; border-color: #e3a79f; }
html[data-theme="jour"] hr.filet { border-top-color: rgba(0,0,0,.1); }
html[data-theme="jour"] .carte.doree { box-shadow: 0 10px 30px -22px rgba(155,116,36,.6); }

/* ================================================================ Boussole et lieux de métier (v0.8.0) */
.rond.boussole .aiguille { transition: transform .12s linear; color: var(--texte-doux); }
.rond.boussole.actif { border-color: var(--or); box-shadow: 0 0 0 2px rgba(212,173,90,.35); }
.rond.boussole.indispo { opacity: .45; }
.grille-metiers { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.grille-metiers .metier { display: grid; gap: 2px; text-align: left; padding: 10px; border-radius: 12px; cursor: pointer; font: inherit;
  background: var(--surface); color: var(--texte); border: 1px solid var(--trait-fort); }
.grille-metiers .metier .ic { font-size: 1.3rem; }
.grille-metiers .metier .faible { font-size: .75rem; }
.grille-metiers .metier.choisi, .grille-metiers .metier:hover { border-color: var(--or); }

/* v0.11.0 — pluie, neige, vent et éclairs au-dessus de la carte (brume.js) */
.ciel-meteo { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }

/* v0.12.0 — Les Étoiles tombées : Reliques, Tour des Reliques, Échos */
.carte-lien { display: block; text-decoration: none; color: inherit; }
.carte-lien h2 { color: var(--or-clair); }
.relique { --teinte: #bfd8ff; position: relative; padding: 12px 14px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--teinte) 45%, transparent);
  background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--teinte) 14%, transparent), transparent 60%), rgba(255,255,255,.02); }
.relique.rare { --teinte: #7fb0ff; }
.relique.epique { --teinte: #c08aff; }
.relique.legendaire { --teinte: #ffd27a; box-shadow: 0 0 22px -8px var(--teinte); }
.relique.exposee { outline: 1px dashed color-mix(in srgb, var(--teinte) 70%, transparent); outline-offset: 2px; }
.relique-tete { display: flex; gap: 10px; align-items: flex-start; }
.relique-tete strong { display: block; font-family: var(--titre); line-height: 1.25; }
.relique-astre { font-size: 1.4rem; color: var(--teinte); text-shadow: 0 0 12px var(--teinte); animation: scintille 2.4s ease-in-out infinite; }
.relique-rarete { display: block; font-size: .78rem; color: var(--teinte); letter-spacing: .04em; margin-top: 2px; }
.relique-pouvoir { margin-top: 8px; font-size: .9rem; }
.relique-texte { margin-top: 6px; font-size: .86rem; font-style: italic; color: var(--texte-doux); line-height: 1.5; }
.relique-charges { margin-top: 8px; display: flex; gap: 5px; align-items: center; }
.relique-charges i { width: 9px; height: 9px; border-radius: 50%; border: 1px solid var(--teinte); display: inline-block; }
.relique-charges i.plein { background: var(--teinte); box-shadow: 0 0 6px var(--teinte); }
.relique-apparition .relique { animation: apparition-relique 1.4s ease-out both; }
@keyframes apparition-relique { from { opacity: 0; transform: translateY(18px) scale(.94); filter: brightness(2.2) blur(2px); } to { opacity: 1; transform: none; filter: none; } }
.bandeau-trouvaille.epique { border-color: #c08aff; }
.echo { border-top: 1px solid rgba(255,255,255,.06); padding: 8px 0; }
.echo summary { cursor: pointer; }
.troc { border-top: 1px solid rgba(255,255,255,.06); padding-top: 6px; margin-top: 8px; }
html[data-theme="jour"] .relique { background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--teinte) 22%, transparent), transparent 60%), rgba(0,0,0,.02); }
html[data-theme="jour"] .relique.commune { --teinte: #4a6fa8; }
html[data-theme="jour"] .relique.rare { --teinte: #2f5fbf; }
html[data-theme="jour"] .relique.epique { --teinte: #7a3fc0; }
html[data-theme="jour"] .relique.legendaire { --teinte: #a77a12; }
@media (prefers-reduced-motion: reduce) { .relique-astre, .relique-apparition .relique { animation: none; } }

/* v0.12.1 — La Volière (corbeaux messagers) */
.corbeau { border-top: 1px solid rgba(255,255,255,.07); padding: 10px 0; margin-top: 6px; }
.corbeau.nouveau { border-left: 3px solid var(--or); padding-left: 10px; }
.parchemin-message { margin-top: 6px; padding: 10px 12px; border-radius: 10px; background: var(--parchemin); color: var(--parchemin-encre);
  font-family: Georgia, serif; line-height: 1.5; box-shadow: inset 0 0 18px rgba(120,80,30,.25); }
#f-corbeau textarea { width: 100%; min-height: 96px; resize: vertical; }

/* Tableau de bord du Conseil (v0.14.1) */
.tuiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; margin-top: 4px; }
.tuile { padding: 10px 12px; border: 1px solid var(--trait); border-radius: 12px; background: var(--nuit); }
.tuile-v { font-family: var(--titre); font-size: 1.45rem; color: var(--or-clair); line-height: 1.15; font-variant-numeric: tabular-nums; }
.tuile-v small { font-size: .7em; color: var(--texte-doux); }
.tuile-l { font-size: .8rem; color: var(--texte); margin-top: 2px; }
.tuile-s { font-size: .72rem; color: var(--texte-faible); }
.tuiles.petites .tuile-v { font-size: 1.15rem; }
.tdb-titre { font-family: var(--titre); font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; color: var(--texte-doux); margin-top: 10px; }
.barres { width: 100%; height: auto; display: block; overflow: visible; }
.barres .axe { stroke: var(--trait-fort); stroke-width: 1; }
.barres .axe-t { font-size: 8px; fill: var(--texte-faible); }
.barres .barre path { fill: var(--or); }
.barres .barre.active path, .barres .barre:hover path { fill: var(--or-clair); }
.barres .barre.active .cible { fill: var(--trait); fill-opacity: .35; }
.tdb-info { min-height: 1.2em; }
.tableau-defile { overflow-x: auto; margin-top: 8px; }
.tdb-table { width: 100%; border-collapse: collapse; font-size: .82rem; font-variant-numeric: tabular-nums; }
.tdb-table th { text-align: left; font-weight: 600; color: var(--texte-doux); padding: 6px 8px; border-bottom: 1px solid var(--trait-fort); white-space: nowrap; }
.tdb-table td { padding: 6px 8px; border-bottom: 1px solid var(--trait); white-space: nowrap; }
.tdb-table td:not(:first-child), .tdb-table th:not(:first-child) { text-align: right; }

/* OwnTracks : on guette la première position (v0.14.2) */
.point-guet { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--or); margin-right: 6px; vertical-align: middle; animation: guet 1.2s ease-in-out infinite; }
@keyframes guet { 50% { opacity: .25; transform: scale(.7); } }
@media (prefers-reduced-motion: reduce) { .point-guet { animation: none; } }

/* Le Sceau du Royaume (v0.15.0) : la clé de secours, lisible et recopiable */
.cle-secours { margin-top: 12px; padding: 12px 14px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--trait-fort); color: var(--texte);
  font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: .95rem; letter-spacing: .06em; line-height: 1.7;
  word-break: break-word; user-select: all; text-align: center; }

/* La Terre vue de loin (v0.15.0) : autour du globe, la nuit de l'espace et quelques étoiles (dans les deux thèmes) */
.maplibregl-map.espace {
  background-color: #02030a;
  background-image:
    radial-gradient(1px 1px at 12% 18%, #fff9 50%, transparent 51%), radial-gradient(1px 1px at 78% 12%, #fffc 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 33% 72%, #cfe0ff 50%, transparent 51%), radial-gradient(1px 1px at 88% 64%, #fff8 50%, transparent 51%),
    radial-gradient(1px 1px at 56% 34%, #fff7 50%, transparent 51%), radial-gradient(1.5px 1.5px at 8% 86%, #ffe9c9 50%, transparent 51%),
    radial-gradient(1px 1px at 66% 90%, #fff9 50%, transparent 51%), radial-gradient(1px 1px at 22% 44%, #fff6 50%, transparent 51%),
    radial-gradient(1px 1px at 94% 30%, #fff8 50%, transparent 51%), radial-gradient(1px 1px at 46% 8%, #fffa 50%, transparent 51%),
    radial-gradient(120% 90% at 50% 50%, #0a1030 0%, #02030a 70%);
  background-size: 230px 260px, 310px 270px, 270px 330px, 350px 290px, 190px 240px, 330px 310px, 260px 220px, 210px 280px, 300px 250px, 240px 300px, 100% 100%;
  transition: background-color .6s;
}

/* Les Chantiers du Château (v0.16.0) : fiche d'un bâtiment, jauges d'état, chantiers, nuancier du château */
.batiments details > summary { list-style: none; cursor: pointer; }
.batiments details > summary::-webkit-details-marker { display: none; }
.batiments details[open] > summary { margin-bottom: 8px; }
.batiments .fiche-ouverte { border-top: 1px dashed var(--trait-fort); padding-top: 10px; }
.fiche-bat { display: grid; grid-template-columns: minmax(90px, auto) 1fr; gap: 6px 12px; margin-top: 10px; }
.fiche-bat dt { color: var(--texte-faible); font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; padding-top: 2px; }
.fiche-bat dd { margin: 0; }
@media (max-width: 380px) { .fiche-bat { grid-template-columns: 1fr; } .fiche-bat dt { padding-top: 6px; } }
.jauge.ok span { background: linear-gradient(90deg, #4f8f5c, var(--succes)); }
.jauge.attente span { background: linear-gradient(90deg, var(--or-sombre), var(--or)); }
.jauge.ko span { background: linear-gradient(90deg, #8a3a32, var(--danger)); }
.chantier-en-cours { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--trait); }
.amenagements > summary { cursor: pointer; color: var(--or); font-weight: 600; }
.titre-section { font-family: var(--titre); font-size: 1rem; color: var(--or); margin: 18px 0 4px; letter-spacing: .03em; }
.nuancier { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.nuancier .teinte { width: 34px; height: 34px; border-radius: 50%; background: var(--t); border: 2px solid var(--trait-fort); cursor: pointer;
  box-shadow: inset 0 -6px 10px rgba(0,0,0,.25); padding: 0; }
.nuancier .teinte.choisie { border-color: var(--or-clair); box-shadow: 0 0 0 3px rgba(240,212,143,.35), inset 0 -6px 10px rgba(0,0,0,.25); }
.nuancier .teinte:disabled { opacity: .35; cursor: not-allowed; }
.nuancier .teinte:focus-visible { outline: 2px solid var(--or-clair); outline-offset: 2px; }

/* Voir en vrai (v0.17.0) : la caméra en plein écran, la 3D par-dessus */
body.avec-vue-reelle { overflow: hidden; }
.vue-reelle { position: fixed; inset: 0; z-index: 9000; background: #000; color: #fff; }
.vue-reelle.xr { background: transparent; }
.vue-reelle .vr-video, .vue-reelle .vr-toile { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.vue-reelle .vr-haut { position: absolute; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: calc(env(safe-area-inset-top) + 12px) 16px 12px; background: linear-gradient(rgba(5,4,12,.75), transparent); font-family: var(--titre); }
.vue-reelle .vr-aide { position: absolute; top: calc(env(safe-area-inset-top) + 64px); left: 16px; right: 16px; text-align: center; font-size: .92rem;
  background: rgba(10,8,18,.6); border-radius: 12px; padding: 8px 12px; backdrop-filter: blur(6px); }
.vue-reelle .vr-aide:empty { display: none; }
.vue-reelle .vr-bas { position: absolute; bottom: 0; left: 0; right: 0; padding: 12px 16px calc(env(safe-area-inset-bottom) + 16px);
  background: linear-gradient(transparent, rgba(5,4,12,.8)); display: grid; gap: 10px; }
.vue-reelle .vr-etat { font-size: .78rem; opacity: .8; text-align: center; }
.vue-reelle .vr-rangee { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.vue-reelle .vr-btn { min-width: 48px; height: 48px; border-radius: 24px; border: 1px solid rgba(240,212,143,.6); background: rgba(20,16,32,.75);
  color: #f0d48f; font-size: 1.2rem; padding: 0 14px; backdrop-filter: blur(6px); cursor: pointer; }
.vue-reelle .vr-btn.large { font-size: .95rem; font-weight: 600; }
.vue-reelle .vr-btn.charge { opacity: .5; }
.voir-en-vrai { margin-top: 10px; justify-content: center; }
.rond[hidden] { display: none !important; }

/* v0.23.0 : le choix de la langue au premier lancement */
.choix-langue h2 { margin-bottom: 4px; }
.choix-langue .langues { display: grid; gap: 10px; margin-top: 18px; }
.choix-langue .langues .btn { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 14px; }
.choix-langue .langue-nom { font-size: 1.05rem; }
.choix-langue .langue-accueil { font-family: var(--corps); font-weight: 400; font-size: .8rem; letter-spacing: 0; opacity: .75; text-transform: none; }

/* v0.25.0 : le Monde — les sorties selon l'heure du jour */
.heures { display: grid; grid-template-columns: repeat(24, 1fr); gap: 2px; align-items: end; height: 56px; margin-top: 14px; }
.heures i { display: block; background: var(--or); border-radius: 3px 3px 0 0; opacity: .85; min-height: 2px; }
.heures-axe { display: flex; justify-content: space-between; font-size: .7rem; color: var(--texte-faible, #8a8296); margin-top: 3px; }
.liste-pays li { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }

/* v1.0.3 : le champ piège du formulaire d inscription (invisible pour un humain, rempli par beaucoup de robots) */
.piege { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* v1.2.0 : le Guide de l'Arpenteur dans le jeu */
.guide-recherche { position: sticky; top: 0; z-index: 5; padding: 8px 0 10px; background: linear-gradient(var(--nuit) 75%, transparent); }
.guide-recherche input { width: 100%; box-sizing: border-box; font: inherit; font-size: 1rem; padding: 12px 14px; border-radius: 12px;
  border: 1px solid var(--trait-fort); background: var(--surface); color: var(--texte); }
.guide-section { scroll-margin-top: 78px; }
.guide-chapitre { display: flex; gap: 12px; align-items: flex-start; text-align: left; width: 100%; border: 0; cursor: pointer; font: inherit; color: inherit; }
.guide-num { font-family: var(--titre, serif); font-size: 1.5rem; line-height: 1; color: var(--or-sombre, #8a5a00); min-width: 1.6em; }
.guide-section h2 { margin-bottom: 6px; }
.guide-section p, .guide-section .guide-liste, .guide-section .guide-boite, .guide-section .guide-tableau, .guide-section figure { margin-top: 8px; }
.guide-liste { padding-left: 1.2em; }
.guide-liste li { margin: 4px 0; line-height: 1.45; }
.guide-tableau { overflow-x: auto; }
.guide-tableau table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.guide-tableau th, .guide-tableau td { border: 1px solid var(--trait); padding: 5px 6px; vertical-align: top; text-align: left; }
.guide-tableau th { background: var(--surface-2); }
.guide-boite { border-left: 3px solid var(--or-sombre, #8a5a00); background: var(--surface-2); border-radius: 10px; padding: 10px 12px; }
.guide-boite.prudence { border-left-color: #b03a3a; }
.guide-boite.encadre { border-left-color: #6a4fb0; }
.guide-boite p { margin-top: 6px; }
.guide-fig { margin: 10px auto 0; max-width: 260px; text-align: center; }
.guide-fig img { width: 100%; height: auto; border-radius: 10px; border: 1px solid var(--trait); }
.guide-fig figcaption { font-size: .78rem; color: var(--texte-faible); margin-top: 4px; }
.guide-figs { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.guide-figs .guide-fig { flex: 1 1 140px; max-width: 200px; }
.guide-coches { margin-top: 8px; }
.terme { cursor: pointer; text-decoration: underline dotted; text-underline-offset: 3px; }
.guide-resultat { display: block; width: 100%; }
mark { background: rgba(226, 184, 90, .45); color: inherit; border-radius: 3px; padding: 0 1px; }
.guide-eclat { box-shadow: 0 0 0 3px rgba(226, 184, 90, .8); transition: box-shadow .6s; }

/* v1.3.0 : dédommagements du Conseil (barème) */
.puce-choix { position: relative; cursor: pointer; }
.puce-choix input { position: absolute; opacity: 0; pointer-events: none; }
.puce-choix span { display: inline-block; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--trait-fort); font-size: .85rem; }
.puce-choix input:checked + span { background: var(--or, #d4ad5a); color: #1a1408; border-color: transparent; font-weight: 600; }
.puce-choix input:focus-visible + span { outline: 2px solid var(--brume); outline-offset: 2px; }
.puce-choix input:disabled + span { opacity: .35; cursor: not-allowed; }

/* ---------------------------------------------------------------- v1.9.0 — La Gazette des corbeaux et les cinématiques */
.gaz-parchemin { position: relative; margin-top: 12px; padding: 14px 14px 10px; border-radius: 8px; color: var(--parchemin-encre); font-family: Georgia, serif;
  background: radial-gradient(ellipse at 20% 0%, rgba(255,255,255,.35), transparent 60%), radial-gradient(ellipse at 100% 100%, rgba(120,80,30,.28), transparent 55%), var(--parchemin);
  box-shadow: inset 0 0 22px rgba(120,80,30,.3), 0 6px 18px -10px rgba(0,0,0,.7); transform-origin: top center; }
.gaz-parchemin.nouveau { outline: 2px solid var(--or); outline-offset: 2px; }
.gaz-parchemin.deroule { animation: gaz-deroule .9s cubic-bezier(.2,.8,.2,1) both; }
@keyframes gaz-deroule { from { transform: scaleY(.15); opacity: 0; } 60% { opacity: 1; } to { transform: scaleY(1); opacity: 1; } }
.gaz-tete { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; font-family: var(--titre); letter-spacing: .05em; }
.gaz-tete .faible { margin-left: auto; color: #7a5a2b; font-size: .78rem; }
.gaz-intro { margin: 6px 0 4px; font-style: italic; color: #5c4528; }
.gaz-article { padding: 8px 0; border-top: 1px dashed rgba(59,42,23,.3); }
.gaz-rub { font: 700 .66rem var(--corps); letter-spacing: .14em; text-transform: uppercase; color: #8b6c3d; }
.gaz-titre { margin: 2px 0 4px; font-size: 1.02rem; line-height: 1.38; }
.gaz-lire { font-size: .82rem; color: #6b3d12; text-decoration: underline; }
.gaz-perdu, .gaz-abime { font-size: .8rem; color: #8b5a2b; font-style: italic; }
.gaz-abime { margin: 6px 0; }
.gaz-rumeur { margin: 8px 0; font-size: 1.02rem; line-height: 1.45; }
.gaz-parchemin .btn-discret { color: #6b5233; }
.efface { color: transparent; border-radius: 3px; background: rgba(59,42,23,.55); letter-spacing: -.1em; user-select: none; }
.efface.mouille { background: radial-gradient(ellipse, rgba(70,90,130,.5), rgba(70,90,130,.12)); filter: blur(1.2px); }
.efface.tache { background: radial-gradient(ellipse, #1a1209, #2b2013); }
.efface.dechire { background: transparent; color: #8b6c3d; }
/* le parchemin abîmé se voit aussi sur le papier */
.gaz-parchemin.tache::after { content: ''; position: absolute; right: 14%; top: 22%; width: 74px; height: 62px; border-radius: 50% 40% 55% 45%; pointer-events: none;
  background: radial-gradient(circle at 40% 40%, rgba(20,12,4,.5), rgba(20,12,4,.18) 55%, transparent 72%); }
.gaz-parchemin.mouille { background: radial-gradient(ellipse at 30% 20%, rgba(90,120,170,.22), transparent 50%), radial-gradient(ellipse at 80% 70%, rgba(90,120,170,.18), transparent 45%),
  radial-gradient(ellipse at 20% 0%, rgba(255,255,255,.3), transparent 60%), var(--parchemin); }
.gaz-parchemin.dechire { clip-path: polygon(0 0, 100% 0, 100% 91%, 93% 93%, 88% 91.5%, 80% 95%, 71% 93%, 62% 97%, 52% 94.5%, 40% 98%, 28% 95.5%, 15% 99%, 6% 96.5%, 0 98.5%); padding-bottom: 28px; }
.gaz-rubriques { display: flex; flex-wrap: wrap; gap: 8px; }
.gaz-puce { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 1px solid var(--trait); border-radius: 999px; background: var(--encre); cursor: pointer; }
.gaz-puce input { accent-color: var(--or); }
.gaz-puce:has(input:checked) { border-color: var(--or-sombre); color: var(--or-clair); }
.recit-ecrit li { animation: gaz-plume .7s ease-out both; animation-delay: calc(.5s + var(--i, 0) * .4s); }
@keyframes gaz-plume { from { opacity: 0; transform: translateY(6px); filter: blur(3px); } to { opacity: 1; transform: none; filter: none; } }

.cine { position: fixed; inset: 0; z-index: 9000; background: #05060c; opacity: 0; transition: opacity .35s; touch-action: manipulation; }
.cine.visible { opacity: 1; }
.cine canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cine-legende { position: absolute; left: 0; right: 0; bottom: max(28px, env(safe-area-inset-bottom)); text-align: center; margin: 0; padding: 0 24px; color: #f1e6c8; font: italic 1.05rem Georgia, serif; text-shadow: 0 2px 8px #000; }
.cine-passer { position: absolute; top: max(14px, env(safe-area-inset-top)); right: 14px; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.3); background: rgba(0,0,0,.4); color: #eee; font: inherit; font-size: .85rem; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .gaz-parchemin.deroule, .recit-ecrit li { animation: none; } .cine { display: none; } }

/* v1.9.1 — résumé des parchemins et lecteur d'articles entiers */
.gaz-resume { margin: 0 0 6px; font-size: .9rem; line-height: 1.45; color: #4a3720; }
.gaz-lecteur { margin: 2px 0 4px; }
.lecteur { position: fixed; inset: 0; z-index: 8000; background: rgba(5,6,12,.86); overflow-y: auto; -webkit-overflow-scrolling: touch; padding: max(14px, env(safe-area-inset-top)) 12px 28px; }
.lecteur-page { position: relative; max-width: 640px; margin: 0 auto; padding: 22px 18px 18px; border-radius: 10px; color: var(--parchemin-encre); font-family: Georgia, serif; line-height: 1.62;
  background: radial-gradient(ellipse at 20% 0%, rgba(255,255,255,.35), transparent 60%), var(--parchemin); box-shadow: inset 0 0 26px rgba(120,80,30,.3), 0 14px 40px -10px #000; }
.lecteur-page h2 { font-family: var(--titre); font-size: 1.35rem; line-height: 1.25; margin: 4px 36px 8px 0; color: #2b1d0d; }
.lecteur-page h3 { font-size: 1.05rem; margin: 18px 0 4px; color: #3b2a17; }
.lecteur-page p { margin: 0 0 12px; }
.lecteur-page p.li { margin: 0 0 6px 6px; }
.lecteur-page blockquote { margin: 10px 0 12px; padding: 4px 0 4px 12px; border-left: 3px solid #b48d52; font-style: italic; }
.lecteur-page .faible { color: #6b5233; font-size: .85rem; }
.lecteur-page a { color: #6b3d12; }
.lecteur-pied { margin-top: 18px; padding-top: 10px; border-top: 1px dashed rgba(59,42,23,.35); }
.lecteur-fermer { position: absolute; top: 8px; right: 8px; width: 36px; height: 36px; border-radius: 50%; border: 1px solid #b48d52; background: rgba(255,255,255,.4); color: #3b2a17; font-size: 1.4rem; line-height: 1; cursor: pointer; }
body.lecteur-ouvert { overflow: hidden; }

/* v1.10.0 — cinématiques en 3D */
.cine3d canvas { touch-action: none; }
.cine3d .cine-voile { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 50% 45%, rgba(0,0,0,0) 45%, rgba(2,3,10,.55) 100%); }
.cine3d .cine-legende { transition: opacity .6s; }
.cine-continuer { position: absolute; left: 50%; bottom: max(64px, calc(env(safe-area-inset-bottom) + 56px)); transform: translateX(-50%) translateY(10px); opacity: 0; pointer-events: none; padding: 12px 30px; border-radius: 999px; border: 1px solid #d8b96a; background: linear-gradient(#5a3d12, #2e1e08); color: #f6e7bd; font: 600 1rem Georgia, serif; letter-spacing: .04em; cursor: pointer; box-shadow: 0 4px 18px rgba(0,0,0,.6), 0 0 22px rgba(240,190,90,.35); transition: opacity .6s .5s, transform .6s .5s; }
.cine.fini .cine-continuer { opacity: 1; transform: translateX(-50%); pointer-events: auto; }
.cine.fini .cine-passer { opacity: 0; pointer-events: none; }
.cine-continuer:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ================================================================ v1.12.0 : les Sentinelles */
.sent-gros { font-size: 3.4rem; text-align: center; line-height: 1.1; filter: drop-shadow(0 0 14px rgba(126,240,255,.45)); }
.sent-tuto h2 { text-align: center; }
.sent-tuto .doux { text-align: center; }
.sent-feuille { max-height: 86vh; overflow-y: auto; }
.sent-fiche { padding: 10px 0; border-bottom: 1px solid var(--trait); display: grid; gap: 4px; list-style: none; }
.carte-interne { border: 1px solid var(--trait-fort); border-radius: 12px; padding: 10px 12px; display: grid; gap: 6px; background: var(--nuit); }
.rond.avec-pastille { position: relative; }
.rond.avec-pastille::after { content: ''; position: absolute; top: 4px; right: 4px; width: 12px; height: 12px; border-radius: 50%; background: #58f0ff; box-shadow: 0 0 10px #58f0ff; animation: scintille 1.6s infinite; }

/* ================================================================ v1.13.0 Sentinelles
   Personnalités, repères 2D sur la carte, feuille détaillée, carte et rapports de la Cour. --c = la couleur de la personnalité. */
#b-sent-ou { font-size: 1.35rem; }
.sent-badge {
  flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; font-size: 1.35rem; line-height: 1;
  background: var(--nuit); border: 2px solid var(--c, #58f0ff); box-shadow: 0 0 12px -2px var(--c, #58f0ff);
}
.sent-fiche { --c: #58f0ff; }
.sent-tete { display: flex; align-items: center; gap: 10px; }
.sent-id { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; }
.sent-id strong { font-size: 1.02rem; }
.sent-tete .sent-dist { margin-left: auto; }
.sent-devise { font-style: italic; color: var(--texte-doux); font-size: .88rem; }
.sent-act { color: var(--texte); }
.sent-lieu { color: var(--texte-doux); font-size: .88rem; }
button.sent-lieu { padding: 2px 0; text-align: left; font-size: .88rem; }
.sent-dist { color: var(--or-clair); border-color: var(--or-sombre); }

/* Les repères de la carte : visibles à tout zoom, ils s'estompent de près (--sent-k : 1 de loin, 0 à partir du zoom 16,5) */
.sent-repere { --c: #58f0ff; position: relative; width: 34px; height: 34px; cursor: pointer; opacity: calc(.32 + .68 * var(--sent-k, 1)); z-index: 2; }
.sent-repere.choisie { z-index: 3; opacity: 1; }
.sent-pastille {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font-size: 18px; line-height: 1;
  background: rgba(8, 6, 14, .9); border: 2.5px solid var(--c);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .55), 0 0 16px -1px var(--c);
  transform: scale(calc(.55 + .45 * var(--sent-k, 1))); transition: transform .15s;
}
.sent-repere.choisie .sent-pastille { border-color: #fff; box-shadow: 0 0 0 2px var(--c), 0 0 20px 2px var(--c); transform: scale(calc(.8 + .3 * var(--sent-k, 1))); }
.sent-etiq {
  position: absolute; left: 50%; top: calc(100% + 3px); transform: translateX(-50%); white-space: nowrap; max-width: 130px; overflow: hidden; text-overflow: ellipsis;
  padding: 1px 8px; border-radius: 99px; font: 700 11px/1.5 var(--corps); letter-spacing: .02em; color: #fff;
  background: rgba(8, 6, 14, .86); border: 1px solid var(--c); pointer-events: none;
  opacity: calc(var(--sent-k, 1) * 1.6 - .6);
}
.sent-proche .sent-repere:not(.choisie) { pointer-events: none; }
.sent-repere:focus-visible { outline: 2px solid #fff; outline-offset: 3px; border-radius: 50%; }
html[data-theme="jour"] .sent-pastille { background: rgba(255, 250, 240, .95); }
html[data-theme="jour"] .sent-etiq { background: rgba(255, 250, 240, .94); color: #3b2a17; }

/* Les rapports (journal) : feuille des Sentinelles et écran de la Cour */
.sent-rapports { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 2px; }
.sent-rapport { display: flex; gap: 10px; padding: 8px 0; border-top: 1px solid var(--trait); }
.sent-rapport:first-child { border-top: 0; }
.sent-r-ico { flex: none; width: 28px; text-align: center; font-size: 1.15rem; line-height: 1.35; }
.sent-r-corps { min-width: 0; display: grid; gap: 2px; }
.sent-rapport.nouveau { background: linear-gradient(90deg, rgba(88, 240, 255, .09), transparent 70%); box-shadow: inset 3px 0 0 #58f0ff; padding-left: 8px; margin-left: -8px; }
.sent-neuf { color: #58f0ff; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }
.sent-titre-rapports { margin: 14px 0 0; font-family: var(--titre); font-size: .9rem; letter-spacing: .12em; text-transform: uppercase; color: var(--or-clair); }

/* La carte « Sentinelles » de la Cour */
.sent-cour { display: grid; gap: 8px; }
.sent-liste { list-style: none; margin: 4px 0 0; padding: 0; }
.sent-ligne { --c: #58f0ff; display: flex; gap: 12px; padding: 12px 0; border-top: 1px solid var(--trait); }
.sent-ligne:first-child { border-top: 0; }
.sent-corps { min-width: 0; display: grid; gap: 3px; flex: 1; }
.sent-corps .btn { margin-top: 4px; }

/* v1.14.0 : voir par ses yeux — la caméra est dans la tête de la Sentinelle */
.sent-yeux-pave { position: absolute; inset: 0; z-index: 4; touch-action: none; cursor: grab; }
.sent-yeux-hud { --c: #58f0ff; position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(86px + env(safe-area-inset-bottom, 0px)); width: min(94vw, 460px); z-index: 60; display: grid; gap: 6px; pointer-events: none; }
.sent-yeux-tete { display: flex; align-items: center; gap: 10px; padding: 8px 10px 8px 12px; border-radius: 16px; pointer-events: auto;
  background: rgba(8, 6, 14, .84); border: 1px solid var(--c); box-shadow: 0 0 18px -4px var(--c); color: #fff; backdrop-filter: blur(6px); }
.sent-yeux-oeil { font-size: 1.4rem; }
.sent-yeux-texte { min-width: 0; flex: 1; display: grid; gap: 1px; }
.sent-yeux-texte strong { font-family: var(--titre); letter-spacing: .04em; }
.sent-yeux-texte .faible { font-size: .78rem; line-height: 1.3; color: #d9d2ee; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.sent-yeux-aide { text-align: center; font-size: .76rem; color: #fff; text-shadow: 0 1px 4px #000; opacity: .85; }
html[data-theme="jour"] .sent-yeux-tete { background: rgba(255, 250, 240, .94); color: #3b2a17; }
html[data-theme="jour"] .sent-yeux-texte .faible { color: #6a5a45; }

/* v1.15.0 vue de rue */
.rue { background: #10131c; }
.rue-canvas { outline: none; }
.rue-credit { position: absolute; left: 50%; transform: translateX(-50%); bottom: var(--rue-bas, 8px); max-width: calc(100% - 24px); padding: 3px 10px; border-radius: 999px;
  font-size: .68rem; line-height: 1.35; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none; touch-action: manipulation;
  color: #f1ecff; background: rgba(8, 6, 14, .55); backdrop-filter: blur(4px); text-shadow: 0 1px 2px rgba(0, 0, 0, .7); }
.rue-credit:hover, .rue-credit:focus-visible { background: rgba(8, 6, 14, .8); text-decoration: underline; }
.rue-credit[hidden] { display: none; }

/* v1.15.0 : la vue par ses yeux a deux modes (photo de rue / monde reconstruit) */
.sent-yeux-bas { display: grid; justify-items: center; gap: 6px; }
.sent-yeux-bas .btn { pointer-events: auto; background: rgba(8, 6, 14, .84); color: #fff; }
html[data-theme="jour"] .sent-yeux-bas .btn { background: rgba(255, 250, 240, .94); color: #3b2a17; }
.sent-yeux-hud { z-index: 70; }
.rue.rue-haut .rue-credit { top: 104px; bottom: auto; }

/* ================================================================ v1.15.0 : Chronique du Barde */
.chron { display: flex; flex-direction: column; gap: 12px; }
.chron-honneurs { display: flex; flex-wrap: wrap; gap: 6px; }
.chron-honneurs .pastille { font-size: .8rem; }
.chron-stats { grid-template-columns: repeat(2, 1fr); }
.chron-stats .v { font-size: 1.15rem; }
.chron-dessins { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: end; }
.chron-dessins figure { margin: 0; text-align: center; color: var(--texte-faible); }
.chron-dessins svg { width: 100%; max-width: 150px; height: auto; display: block; margin: 0 auto; }
.chron-dessins figure.large { grid-column: 1 / -1; }
.chron-dessins figure.large svg { max-width: none; height: 64px; }
.chron-dessins figcaption { font-size: .72rem; letter-spacing: .04em; margin-top: 2px; }
.chron-recit p { margin: 0 0 .7em; line-height: 1.5; }
.chron-recit p:last-child { font-style: italic; color: var(--or-clair); margin-bottom: 0; }
.chron-item { padding: 0; }
.chron-ligne { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; padding: 14px 16px; background: none; border: 0; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.chron-titre { font-family: var(--titre); font-weight: 700; color: var(--or-clair); font-size: 1.05rem; }
.chron-corps { padding: 0 16px 16px; }
.chron-corps[hidden] { display: none; }
.chron-oubli { margin-top: 12px; }