/* =====================================================================
   AEGIS — feuille de style commune
   Deux thèmes (sombre / clair) entièrement pilotés par variables CSS.
   Aucune police externe : pile système, chiffres en monospace.
   ===================================================================== */

:root {
    --police: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --police-mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas, "Liberation Mono", monospace;
    --rayon: 6px;
    --rayon-petit: 4px;
    --espace: 1rem;
    --transition: 120ms ease;

    /* Couleurs par service (surchargées par /s/{slug}/styles.css) */
    --svc-pompiers: #d0342c;
    --svc-samu: #1f9d6b;
    --svc-police: #2f6fd6;
    --svc-gendarmerie: #5363b8;
    --svc-police-municipale: #d99a1e;

    /* Priorités et états */
    --etat-ok: #2e9d5b;
    --etat-alerte: #d99a1e;
    --etat-danger: #d0342c;
    --etat-info: #2f6fd6;
}

/* Thème sombre (par défaut) : bleu nuit du logo */
:root,
[data-theme="sombre"] {
    color-scheme: dark;
    --fond: #07101c;
    --surface: #0d1828;
    --surface-2: #122034;
    --surface-3: #1a2b44;
    --bordure: #213551;
    --bordure-forte: #304a6e;
    --texte: #dce5f1;
    --texte-doux: #8b9db6;
    --accent: #2f6fd6;
    --accent-texte: #ffffff;
    --danger: #e0443b;
    --focus: #6aa2ff;
    --ombre: 0 1px 2px rgb(0 0 0 / 0.4);
}

[data-theme="clair"] {
    color-scheme: light;
    --fond: #edf1f6;
    --surface: #ffffff;
    --surface-2: #f4f7fb;
    --surface-3: #e5ebf3;
    --bordure: #d1dae6;
    --bordure-forte: #aab8cb;
    --texte: #0f1b2c;
    --texte-doux: #56667c;
    --accent: #1d56b8;
    --accent-texte: #ffffff;
    --danger: #c22a22;
    --focus: #1d56b8;
    --ombre: 0 1px 2px rgb(15 27 44 / 0.08);
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--fond);
    color: var(--texte);
    font: 15px/1.5 var(--police);
}

a { color: var(--accent); text-underline-offset: 2px; }
[data-theme="sombre"] a { color: #7fb0ff; }
img { max-width: 100%; height: auto; }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .6em; }
h1 { font-size: 1.6rem; font-weight: 650; letter-spacing: -0.01em; }
h2 { font-size: 1.15rem; font-weight: 600; }
h3 { font-size: 1rem; font-weight: 600; }
p { margin: 0 0 .8em; }
code, .mono { font-family: var(--police-mono); font-size: .9em; }
code { background: var(--surface-3); padding: .05em .35em; border-radius: var(--rayon-petit); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

[hidden] { display: none !important; }
.texte-doux { color: var(--texte-doux); }
.visuellement-cache {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.lien-evitement { position: absolute; left: -9999px; }
.lien-evitement:focus { left: 1rem; top: 1rem; z-index: 100; background: var(--surface); padding: .5rem 1rem; }

/* ---------- Boutons ---------- */
.bouton {
    display: inline-flex; align-items: center; justify-content: center; gap: .4em;
    min-height: 36px; padding: .4em .95em;
    border: 1px solid var(--bordure-forte); border-radius: var(--rayon);
    background: var(--surface-2); color: var(--texte);
    font: inherit; font-weight: 550; text-decoration: none; cursor: pointer;
    transition: background var(--transition), border-color var(--transition);
}
.bouton:hover { background: var(--surface-3); }
[data-theme] a.bouton { color: var(--texte); }
.bouton--principal, [data-theme] a.bouton--principal { background: var(--accent); border-color: var(--accent); color: var(--accent-texte); }
.bouton--principal:hover { filter: brightness(1.08); background: var(--accent); }
.bouton--danger { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 55%, transparent); background: transparent; }
.bouton--danger:hover { background: color-mix(in srgb, var(--danger) 12%, transparent); }
.bouton--discret { background: transparent; border-color: transparent; color: var(--texte-doux); }
.bouton--discret:hover { color: var(--texte); background: var(--surface-2); }
.bouton--discord, [data-theme] a.bouton--discord { background: #5865f2; border-color: #5865f2; color: #fff; }
.bouton--petit { min-height: 28px; padding: .15em .6em; font-size: .85rem; }
.bouton--grand { min-height: 46px; padding: .6em 1.4em; font-size: 1.02rem; }
.bouton--large { width: 100%; }
.bouton--icone { width: 36px; padding: 0; }
.bouton:disabled { opacity: .5; cursor: not-allowed; }

/* Icône du thème : lune / soleil dessinés en CSS */
.icone-theme { width: 16px; height: 16px; border-radius: 50%; display: inline-block; }
[data-theme="sombre"] .icone-theme { box-shadow: inset -5px -3px 0 0 var(--texte); }
[data-theme="clair"] .icone-theme { background: var(--etat-alerte); box-shadow: 0 0 0 3px color-mix(in srgb, var(--etat-alerte) 35%, transparent); }

/* ---------- Formulaires ---------- */
.formulaire { display: grid; gap: .9rem; }
.formulaire label { display: grid; gap: .3rem; font-weight: 550; font-size: .92rem; }
.formulaire label small { font-weight: 400; color: var(--texte-doux); }
input[type="text"], input[type="email"], input[type="password"], input[type="url"], input[type="number"],
input[type="search"], input[type="file"], select, textarea {
    width: 100%; min-height: 38px; padding: .45em .65em;
    border: 1px solid var(--bordure-forte); border-radius: var(--rayon);
    background: var(--surface-2); color: var(--texte); font: inherit;
}
input[type="color"] { width: 48px; height: 34px; padding: 2px; border: 1px solid var(--bordure-forte); border-radius: var(--rayon); background: var(--surface-2); }
input:focus, select:focus, textarea:focus { border-color: var(--focus); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 25%, transparent); }
.formulaire label.case { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400; }
.case input { margin-top: .25em; width: 18px; height: 18px; flex: none; accent-color: var(--accent); }
.champ-court { max-width: 7.5rem; }
.champ-prefixe { display: flex; align-items: stretch; }
.champ-prefixe > span {
    display: flex; align-items: center; padding: 0 .6em; font-family: var(--police-mono); font-size: .85rem;
    color: var(--texte-doux); background: var(--surface-3); border: 1px solid var(--bordure-forte); border-right: 0;
    border-radius: var(--rayon) 0 0 var(--rayon); white-space: nowrap;
}
.champ-prefixe input { border-radius: 0 var(--rayon) var(--rayon) 0; }
.formulaire--ligne { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); align-items: end; }
.formulaire-ligne { display: flex; gap: .4rem; align-items: center; }
.actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.bloc-code { font-family: var(--police-mono); font-size: .85rem; }
.copie { display: flex; gap: .5rem; }
.copie input { font-family: var(--police-mono); font-size: .9rem; }

/* ---------- Messages flash ---------- */
.flashs { display: grid; gap: .5rem; margin-bottom: 1.2rem; }
.flash {
    display: flex; justify-content: space-between; gap: 1rem; align-items: center;
    padding: .65rem .9rem; border-radius: var(--rayon); border: 1px solid; border-left-width: 4px;
    background: var(--surface);
}
.flash--succes { border-color: var(--etat-ok); }
.flash--erreur { border-color: var(--etat-danger); }
.flash--alerte { border-color: var(--etat-alerte); }
.flash--info { border-color: var(--etat-info); }
.flash__fermer { background: none; border: 0; color: var(--texte-doux); font-size: 1.3rem; line-height: 1; cursor: pointer; }

/* ---------- Structure des pages publiques ---------- */
.entete, .barre-app {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: .6rem clamp(1rem, 3vw, 2rem);
    background: var(--surface); border-bottom: 1px solid var(--bordure);
}
.marque { display: flex; align-items: center; gap: .6rem; font-weight: 750; letter-spacing: .08em; text-decoration: none; }
[data-theme] .marque { color: var(--texte); }
.marque img { border-radius: 50%; }
.entete__nav, .barre-app__nav, .barre-app__compte { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.entete__nav > a:not(.bouton), .barre-app__nav a { color: var(--texte-doux); text-decoration: none; font-weight: 550; }
.entete__nav > a[aria-current], .barre-app__nav a[aria-current], .entete__nav > a:not(.bouton):hover, .barre-app__nav a:hover { color: var(--texte); }
.principal { flex: 1; width: 100%; max-width: 1180px; margin: 0 auto; padding: clamp(1rem, 3vw, 2rem); }
.principal--etroit { max-width: 720px; }
.section-etroite { max-width: 760px; margin: 0 auto; }
.section-auth { max-width: 440px; margin: 2rem auto; }
.liens-auth { display: flex; justify-content: space-between; margin-top: 1rem; font-size: .92rem; }
.separateur { display: flex; align-items: center; gap: .8rem; color: var(--texte-doux); font-size: .85rem; margin: 1.2rem 0; }
.separateur::before, .separateur::after { content: ""; flex: 1; border-top: 1px solid var(--bordure); }

.pied { border-top: 1px solid var(--bordure); background: var(--surface); font-size: .85rem; color: var(--texte-doux); }
.pied__contenu { max-width: 1180px; margin: 0 auto; padding: 1rem clamp(1rem, 3vw, 2rem); display: flex; flex-wrap: wrap; gap: .8rem 2rem; justify-content: space-between; }
.pied__liens { display: flex; flex-wrap: wrap; gap: 1rem; }
[data-theme] .pied__liens a { color: var(--texte-doux); }

/* Accueil */
.accroche { display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: center; padding: 2rem 0 3rem; }
.accroche h1 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); max-width: 22ch; }
.accroche__intro { font-size: 1.08rem; color: var(--texte-doux); max-width: 60ch; }
.accroche__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.4rem; }
.accroche__logo { width: clamp(180px, 26vw, 320px); border-radius: 50%; }
.surtitre { font-family: var(--police-mono); letter-spacing: .12em; text-transform: uppercase; font-size: .8rem; color: var(--texte-doux); }
.grille-services { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; margin-bottom: 2.5rem; }
.carte-service { background: var(--surface); border: 1px solid var(--bordure); border-top: 3px solid var(--svc); border-radius: var(--rayon); padding: 1.1rem; }
.carte-service__numero { font-family: var(--police-mono); font-weight: 700; font-size: 1.6rem; color: var(--svc); }
.bandeau-info { background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon); padding: 1.4rem; }
.liste-points { padding-left: 1.2rem; margin: 0 0 1rem; }
.liste-points li { margin-bottom: .35rem; }

/* Tarifs */
.carte--offre { text-align: left; }
.prix { font-size: 2.4rem; font-weight: 700; margin: .2rem 0; font-family: var(--police-mono); }
.prix small { font-size: .9rem; font-weight: 400; color: var(--texte-doux); font-family: var(--police); }

/* Documents légaux */
.document-legal { max-width: 780px; margin: 0 auto; }
.document-legal h1 { margin-top: .4em; }
.document-legal h2 { margin-top: 1.8em; padding-top: .6em; border-top: 1px solid var(--bordure); }
.document-legal h3 { margin-top: 1.4em; }
.document-legal blockquote { margin: 1rem 0; padding: .6rem 1rem; border-left: 3px solid var(--accent); background: var(--surface); }

/* ---------- Espace connecté ---------- */
.compte-lien { display: flex; align-items: center; gap: .5rem; text-decoration: none; }
[data-theme] .compte-lien { color: var(--texte); }
.avatar { width: 28px; height: 28px; border-radius: 50%; }
.avatar--initiale { display: inline-flex; align-items: center; justify-content: center; background: var(--surface-3); font-weight: 700; font-size: .85rem; }
.cadre-app { flex: 1; display: flex; width: 100%; }
.principal--app { max-width: 1280px; }
.menu-lateral {
    width: 250px; flex: none; padding: 1rem .8rem; background: var(--surface); border-right: 1px solid var(--bordure);
}
.menu-lateral nav { display: grid; gap: 2px; }
.menu-lateral nav a { display: flex; align-items: center; gap: .55rem; padding: .45rem .6rem; border-radius: var(--rayon-petit); text-decoration: none; font-weight: 500; }
[data-theme] .menu-lateral nav a { color: var(--texte-doux); }
[data-theme] .menu-lateral nav a:hover, [data-theme] .menu-lateral nav a[aria-current] { background: var(--surface-3); color: var(--texte); }
.menu-lateral__titre { margin: 1rem .6rem .3rem; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: var(--texte-doux); }
.menu-lateral__serveur { display: flex; align-items: center; gap: .7rem; padding: .3rem .4rem 1rem; border-bottom: 1px solid var(--bordure); margin-bottom: .6rem; }
.menu-lateral__serveur img, .marque img { border-radius: 50%; }
.menu-lateral__serveur div { display: grid; }
.menu-lateral__serveur small { color: var(--texte-doux); }

.titre-page { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.2rem; }
.titre-page h1 { margin: 0; }
.titre-section { margin: 1.6rem 0 .8rem; }
.carte { background: var(--surface); border: 1px solid var(--bordure); border-radius: var(--rayon); padding: 1.2rem; box-shadow: var(--ombre); margin-bottom: 1rem; }
.carte--accent { border-left: 4px solid var(--accent); }
.carte--formulaire { max-width: 640px; }
.grille-cartes + .grille-2, section + .grille-2 { margin-top: 1.2rem; }
.carte h3 { margin-top: 1.4rem; }
.grille-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; }
.grille-cartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.etat-vide { text-align: center; padding: 2.5rem 1rem; }
.carte-serveur, .carte-console { display: flex; align-items: center; gap: .9rem; text-decoration: none; margin: 0; transition: border-color var(--transition); }
[data-theme] .carte-serveur, [data-theme] .carte-console { color: var(--texte); }
a.carte-serveur:hover, a.carte-console:hover { border-color: var(--bordure-forte); }
.carte-serveur img { border-radius: var(--rayon-petit); }
.carte-serveur__texte, .carte-console > span:last-child { display: grid; flex: 1; }
.carte-serveur small, .carte-console small { color: var(--texte-doux); }
.carte-serveur__initiale { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border-radius: var(--rayon-petit); background: var(--surface-3); font-weight: 700; font-size: 1.3rem; }
.carte-console { border-left: 4px solid var(--svc); }
.carte-console--inactive { opacity: .55; }

/* Pastille de service (numéro d'appel) */
.svc-pompiers { --svc: var(--svc-pompiers); }
.svc-samu { --svc: var(--svc-samu); }
.svc-police { --svc: var(--svc-police); }
.svc-gendarmerie { --svc: var(--svc-gendarmerie); }
.svc-police-municipale { --svc: var(--svc-police-municipale); }
.pastille-service {
    display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 24px; padding: 0 .35em;
    border-radius: var(--rayon-petit); background: var(--svc, var(--surface-3)); color: #fff;
    font-family: var(--police-mono); font-weight: 700; font-size: .8rem;
}
.pastille-service--grande { min-width: 46px; height: 38px; font-size: 1.05rem; }

.etiquette { display: inline-block; padding: .05em .5em; border-radius: 99px; font-size: .75rem; font-weight: 600; background: var(--surface-3); color: var(--texte-doux); vertical-align: middle; }
.etiquette--alerte { background: color-mix(in srgb, var(--etat-alerte) 20%, transparent); color: var(--etat-alerte); }

/* Étapes (assistant, installateur) */
.etapes { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; list-style: none; padding: 0; margin: 0 0 1.2rem; color: var(--texte-doux); font-weight: 550; }
.etapes__courante { color: var(--texte); border-bottom: 2px solid var(--accent); }
.etapes__faite { color: var(--etat-ok); }
.choix-services { display: grid; gap: .6rem; }
.choix-service { display: flex !important; grid-template-columns: none !important; flex-direction: row; align-items: center; gap: .8rem !important; padding: .7rem .9rem; border: 1px solid var(--bordure); border-left: 4px solid var(--svc); border-radius: var(--rayon); cursor: pointer; }
.choix-service input { width: 18px; height: 18px; accent-color: var(--svc); }
.choix-service span:last-child { display: grid; font-weight: 400; }
.choix-service small { color: var(--texte-doux); }
.recapitulatif { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1.2rem; margin: 0 0 1rem; }
.recapitulatif dt { color: var(--texte-doux); }
.recapitulatif dd { margin: 0; font-weight: 550; }
.apercu-logo { display: block; margin-bottom: 1rem; border-radius: var(--rayon); background: var(--surface-2); }

/* Tableaux */
.tableau-conteneur { overflow-x: auto; border: 1px solid var(--bordure); border-radius: var(--rayon); background: var(--surface); margin-bottom: 1rem; }
.tableau { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tableau th { text-align: left; font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--texte-doux); font-weight: 600; background: var(--surface-2); }
.tableau th, .tableau td { padding: .55rem .7rem; border-bottom: 1px solid var(--bordure); vertical-align: middle; }
.tableau tr:last-child td { border-bottom: 0; }
.tableau--dense th, .tableau--dense td { padding: .4rem .6rem; }
.tableau select, .tableau input[type="text"] { min-height: 32px; padding: .25em .45em; min-width: 8rem; }
.cellule-actions { display: flex; flex-wrap: wrap; gap: .3rem; }
.ligne-suspendue td { opacity: .6; }
.details-json { font-family: var(--police-mono); font-size: .78rem; color: var(--texte-doux); max-width: 340px; word-break: break-all; }
.pagination { display: flex; gap: .6rem; }
.recherche { display: flex; gap: .4rem; }
.grille-chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.chiffre { display: grid; margin: 0; }
.chiffre span { font-family: var(--police-mono); font-size: 2rem; font-weight: 700; }
.chiffre small { color: var(--texte-doux); }

/* Installateur */
.install-entete { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.4rem; }
.install-entete h1 { margin: 0; }
.controles { list-style: none; padding: 0; display: grid; gap: .35rem; }
.controle__etat { display: inline-block; width: 1.4em; font-weight: 700; }
.controle--ok .controle__etat { color: var(--etat-ok); }
.controle--ko .controle__etat { color: var(--etat-danger); }
.controle--alerte .controle__etat { color: var(--etat-alerte); }

/* Erreurs */
.page-erreur { text-align: center; padding: 3rem 0; }
.code-erreur { font-family: var(--police-mono); font-size: 3.5rem; font-weight: 700; color: var(--texte-doux); margin: 0; }

/* ---------- Mobile ---------- */
@media (max-width: 860px) {
    .accroche { grid-template-columns: 1fr; }
    .accroche__logo { order: -1; width: 160px; }
    .cadre-app { flex-direction: column; }
    .menu-lateral { width: 100%; border-right: 0; border-bottom: 1px solid var(--bordure); }
    .menu-lateral nav { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
    .menu-lateral__titre { grid-column: 1 / -1; }
    .compte-lien__nom { display: none; }
    .barre-app { flex-wrap: wrap; }
}
@media (max-width: 520px) {
    .entete { flex-wrap: wrap; }
    .entete__nav { gap: .6rem; }
    .recapitulatif { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ---------- Bandeau d'état de l'abonnement ---------- */
.bandeau-acces {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1rem; align-items: center;
    padding: .55rem .9rem; margin-bottom: 1rem; border-radius: var(--rayon); font-weight: 550;
    background: color-mix(in srgb, var(--etat-alerte) 16%, var(--surface)); border: 1px solid var(--etat-alerte);
}
.bandeau-acces--lecture_seule, .bandeau-acces--suspendu, .bandeau-acces--aucun {
    background: color-mix(in srgb, var(--etat-danger) 14%, var(--surface)); border-color: var(--etat-danger);
}
.bandeau-acces--complet { background: var(--surface); border-color: var(--bordure-forte); font-weight: 400; }
.page-console .bandeau-acces { margin: 0; border-radius: 0; border-width: 0 0 1px; }
.etiquette--ok { background: color-mix(in srgb, var(--etat-ok) 20%, transparent); color: var(--etat-ok); }

/* ---------- Administration opérationnelle (catalogues, unités) ---------- */
.onglets { display: flex; flex-wrap: wrap; gap: .3rem; margin: 1rem 0 1.4rem; border-bottom: 1px solid var(--bordure); }
.onglet {
    display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .8rem; margin-bottom: -1px;
    border: 1px solid transparent; border-radius: var(--rayon) var(--rayon) 0 0; color: var(--texte-doux); text-decoration: none; font-weight: 600;
}
.onglet[aria-current="page"] { background: var(--surface); border-color: var(--bordure); border-bottom-color: var(--surface); color: var(--texte); }
.section-catalogue { margin-bottom: 2rem; }
.section-catalogue .titre-section small { font-weight: 400; }
.ligne-ajout td { background: var(--surface-2); }
.tableau input[type="color"] { width: 44px; height: 32px; padding: 2px; }
.etiquette-statut {
    display: inline-block; padding: .1em .55em; border-radius: var(--rayon-petit); font-size: .8rem; font-weight: 600;
    background: color-mix(in srgb, var(--couleur, #6b7a90) 22%, transparent); border-left: 4px solid var(--couleur, #6b7a90);
}

/* ---------- Zones de compétence (Phase 4) ---------- */
.zones-disposition { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 1rem; align-items: start; }
.zones-carte { height: 460px; border: 1px solid var(--bordure); border-radius: var(--rayon-petit); background:
    linear-gradient(var(--bordure) 1px, transparent 1px) 0 0 / 40px 40px,
    linear-gradient(90deg, var(--bordure) 1px, transparent 1px) 0 0 / 40px 40px, var(--surface-2); }
.zones-carte.carte-tactique--fond { background: #0a1220; }
.zones-carte.carte-tactique--placement { cursor: crosshair; outline: 2px dashed var(--accent, #2f6fd6); outline-offset: -3px; }
.zones-carte.carte-tactique--placement.leaflet-grab, .zones-carte.carte-tactique--placement .leaflet-interactive { cursor: crosshair; }
.zones-outils { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .5rem; }
.zones-outils select { max-width: 18rem; }
.zones-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 1rem; }
.zone-fiche h3 { margin-top: 0; }
.zone-fiche textarea { font-size: .85rem; }
@media (max-width: 900px) { .zones-disposition { grid-template-columns: 1fr; } .zones-carte { height: 320px; } }
.zones-carte.leaflet-container { background:
    linear-gradient(var(--bordure) 1px, transparent 1px) 0 0 / 40px 40px,
    linear-gradient(90deg, var(--bordure) 1px, transparent 1px) 0 0 / 40px 40px, var(--surface-2); }
.zones-carte.leaflet-container.carte-tactique--fond { background: #0a1220; }

/* ---------- Terminal embarqué : choix de l'unité (Phase 5) ---------- */
.grille-unites-terminal { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .6rem; margin-bottom: 1.4rem; }
.grille-unites-terminal form { margin: 0; }
.choix-terminal {
    display: grid; gap: .25rem; width: 100%; height: 100%; text-align: left; font: inherit; color: var(--texte); cursor: pointer;
    border-left: 6px solid var(--couleur, var(--bordure));
}
.choix-terminal strong { font-family: var(--police-mono); font-size: 1.1rem; }
.choix-terminal.est-selectionne { outline: 2px solid var(--accent); }

/* Liaison jeu : touches du boîtier de statut */
.grille-touches { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .5rem; }
.grille-touches label { display: flex !important; align-items: center; gap: .5rem; font-weight: 400; }
.grille-touches select { flex: 1; min-width: 0; }
.touche-ber { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; flex: none; border-radius: 6px;
    background: var(--surface-3); border: 1px solid var(--bordure); font-family: var(--police-mono); font-weight: 700; }
.liste-simple { margin: .5rem 0 0; padding-left: 1.2rem; display: grid; gap: .2rem; }

/* Fiche de garde */
.garde__colonnes { display: grid; grid-template-columns: minmax(280px, 1fr) 2fr; gap: 1.4rem; align-items: start; }
.garde h3 { margin-top: 0; display: flex; align-items: center; gap: .5rem; }
.garde__personnels { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.garde__personnels li { display: grid; grid-template-columns: auto 1fr; gap: .2rem .7rem; align-items: center; padding: .55rem .7rem; border: 1px solid var(--bordure); border-radius: var(--rayon); background: var(--surface-2); }
.garde__personnels form { grid-column: 1 / -1; }
.garde__personnels select { flex: 1; }
.garde__matricule { font-weight: 700; }
.garde__nom { display: flex; flex-direction: column; }
.garde__equipage { list-style: none; margin: 0; padding: 0; }
.garde__equipage li { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.garde__equipage form { margin-left: auto; }
.garde__vide td:first-child { opacity: .7; }
.pastille-statut { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; background: var(--couleur, #6b7a90); vertical-align: middle; }
@media (max-width: 900px) { .garde__colonnes { grid-template-columns: 1fr; } }
.identite-jeu { display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; }
.identite-jeu > div { display: flex; flex-direction: column; }
.identite-jeu p { margin: 0; flex: 1; min-width: 260px; }
.identite-jeu__matricule { font-size: 1.8rem; letter-spacing: .08em; }
.identite-jeu form { display: flex; align-items: center; gap: .4rem; }

/* Statistiques */
.graphe { display: block; width: 100%; height: auto; }
.graphe__barre { fill: var(--accent); }
.graphe__barre:hover { fill: var(--accent-survol, var(--accent)); opacity: .8; }
.graphe__axe { stroke: var(--bordure-forte); stroke-width: 1; }
.graphe__texte { fill: var(--texte-doux); font-size: 11px; font-family: var(--police-mono); }
.classement { width: 100%; border-collapse: collapse; }
.classement th { text-align: left; font-weight: 400; padding: .2rem .6rem .2rem 0; width: 40%; overflow-wrap: anywhere; }
.classement td { padding: .2rem 0; }
.classement__barre { display: block; width: 100%; height: .7rem; }
.classement__barre rect { fill: var(--accent); }
.classement__valeur { width: 3.5rem; text-align: right; font-family: var(--police-mono); }

/* Webhooks, support */
.groupe-boutons { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.formulaire fieldset { border: 1px solid var(--bordure); border-radius: 8px; padding: .6rem .9rem; display: grid; gap: .35rem; }
.formulaire legend { padding: 0 .3rem; color: var(--texte-doux); }
.fil-support { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .8rem; }
.fil-support li { border: 1px solid var(--bordure); border-radius: 8px; padding: .7rem .9rem; }
.fil-support li.equipe { border-color: var(--accent); }
.fil-support header { display: flex; justify-content: space-between; gap: 1rem; color: var(--texte-doux); font-size: .85rem; margin-bottom: .35rem; }
.fil-support p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }