/* ============================================================
   26-A11Y — finitions, garde-fous, accessibilité
   Propriétaire : R5 (refonte), hérité de C7. Personne d'autre n'ouvre ce fichier.
   Cf. docs/interface/refonte-spec.md §R5, design-system §4.9/§4.12.
   ============================================================ */

/* ---- focus visible partout (token --fm-focus, design-system §2.1) ---- */

#hud button:focus-visible,
#hud [role="button"]:focus-visible,
#hud input:focus-visible,
#canvas:focus-visible {
  outline: none;
  box-shadow: var(--fm-focus);
}

#canvas:focus-visible {
  box-shadow: inset 0 0 0 2px var(--fm-accent);
}

/* ---- feuilles natives <dialog> (R5 : #help-sheet / #confirm-sheet / #newmap) :
   le patron div §4.12 est purge (R6) — la plate-forme garde le display du
   dialog (none fermé, bloc ouvert), le centrage, le piège de focus et le
   ::backdrop ; la géométrie de carte vit dans 02-base.css ---- */

/* ---- têtes de fiche : #help-sheet / #confirm-sheet / #newmap (§4.12) ---- */

.fm-sheet__head {
  display: flex;
  align-items: center;
  gap: var(--fm-sp-2);
  margin-bottom: var(--fm-sp-4);
}

.fm-sheet__title {
  margin: 0;
  font-family: var(--fm-font-display);
  font-size: var(--fm-fs-500);
  font-weight: 800;
  color: var(--fm-ink-1);
  line-height: var(--fm-lh-1);
}

.fm-sheet__close { margin-left: auto; }

.fm-sheet__body {
  font-size: var(--fm-fs-300);
  color: var(--fm-ink-2);
  line-height: var(--fm-lh-2);
}

.fm-sheet__body p { margin: 0 0 var(--fm-sp-2); }

/* ---- aide : tableau des raccourcis ---- */

.fm-help-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--fm-sp-1) var(--fm-sp-4);
  align-items: baseline;
  margin: 0 0 var(--fm-sp-4);
}

.fm-kbd {
  font-family: var(--fm-font-mono);
  font-size: var(--fm-fs-200);
  color: var(--fm-accent);
  background: var(--fm-accent-soft);
  border: 1px solid var(--fm-accent-line);
  border-radius: var(--fm-r-1);
  padding: 0 var(--fm-sp-2);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.fm-help-note {
  margin: var(--fm-sp-2) 0 0;
  font-size: var(--fm-fs-200);
  color: var(--fm-ink-3);
}

.fm-help-link {
  vertical-align: middle;
  margin: 0 var(--fm-sp-1);
}

/* ---- confirmation destructive : rappel de ce qui va être perdu ---- */

.fm-confirm-recap {
  color: var(--fm-warn);
  font-weight: 600;
}

/* ---- prefers-reduced-motion : les entrées animées et pulsations legacy ---- */

@media (prefers-reduced-motion: reduce) {
  #topbar,
  #toolbar,
  #ecopanel,
  #statspanel,
  #layers,
  #inspector,
  #timebar,
  #nestpanel,
  #minimap,
  .toast,
  .toast.out,
  #nuptial-banner {
    animation: none;
  }
}