/* ============================================================
   02-BASE — socle : utilitaires du système fm-*. Propriétaire : R2 (refonte).
   Le reset, html/body, #canvas, la typographie de base, le focus, les
   scrollbars et les @keyframes vivent encore dans 10-legacy.css.
   Cf. docs/interface/sim-ui-design-system.md §4.13 · refonte-spec §R2.
   ============================================================ */

.fm-hidden { display: none !important; }   /* le SEUL !important autorisé */

.fm-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}

.fm-truncate { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fm-nums { font-variant-numeric: tabular-nums; }
.fm-stack { display: flex; flex-direction: column; gap: var(--fm-sp-2); }
.fm-row { display: flex; align-items: center; gap: var(--fm-sp-2); }
.fm-spacer { margin-left: auto; }

/* ---------- couche supérieure : [popover] et <dialog> ---------- */

[popover].fm-pop,
.fm-tip { margin: 0; inset: auto; }

dialog.fm-sheet {
  margin: auto;
  width: min(460px, calc(100vw - 24px));
  max-height: calc(100dvh - 24px);
  padding: var(--fm-sp-6);
  background: var(--fm-surface-1);
  color: var(--fm-ink-2);
  border: 1px solid var(--fm-line-2);
  border-radius: var(--fm-r-3);
  box-shadow: var(--fm-el-3);
}
dialog.fm-sheet::backdrop { background: var(--fm-scrim); }

/* ---------- curseur unique ---------- */

input[type="range"].fm-range {
  -webkit-appearance: none; appearance: none;
  height: var(--fm-ctl-h);
  background: transparent;
  cursor: pointer;
}
input[type="range"].fm-range::-webkit-slider-runnable-track {
  height: 4px; border-radius: var(--fm-r-pill);
  background: var(--fm-line-2);
}
input[type="range"].fm-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 12px; height: 12px; margin-top: -4px;
  border: none; border-radius: var(--fm-r-pill);
  background: var(--fm-accent);
  box-shadow: 0 0 6px var(--fm-accent-glow);
}
input[type="range"].fm-range::-moz-range-track {
  height: 4px; border-radius: var(--fm-r-pill);
  background: var(--fm-line-2);
}
input[type="range"].fm-range::-moz-range-thumb {
  width: 12px; height: 12px;
  border: none; border-radius: var(--fm-r-pill);
  background: var(--fm-accent);
  box-shadow: 0 0 6px var(--fm-accent-glow);
}
input[type="range"].fm-range:focus-visible { outline: none; box-shadow: var(--fm-focus); border-radius: var(--fm-r-1); }
