/*
 * Reset minimal + typographie globale (§2.2, §2.3).
 * Aucune valeur codee en dur : tout provient de theme.css.
 */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  height: 100%;
}

body {
  background: var(--color-bg-primary);
  color: var(--color-ink-primary);
  font-family: var(--font-body);
  font-size: var(--font-size-narrative);
  line-height: var(--line-height-narrative);
  font-weight: var(--font-weight-regular);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Titres de section : --font-body, 600, --color-ink-primary (§2.2) */
h1,
h2,
h3,
h4 {
  font-family: var(--font-body);
  font-weight: var(--font-weight-semibold);
  color: var(--color-ink-primary);
  line-height: 1.3;
}

/* Labels et navigation (§2.2) */
label,
.label {
  font-family: var(--font-body);
  font-size: var(--font-size-label);
  font-weight: var(--font-weight-medium);
  color: var(--color-ink-secondary);
}

/* Metadonnees techniques : --font-mono 11px uppercase cyan (§2.2) */
.meta {
  font-family: var(--font-mono);
  font-size: var(--font-size-meta);
  text-transform: uppercase;
  letter-spacing: var(--letter-spacing-meta);
  color: var(--color-cyan);
}

a {
  color: var(--color-cyan);
  text-decoration: none;
  transition: var(--transition-fast);
}

a:hover {
  opacity: 0.85;
}

button {
  font-family: var(--font-body);
  cursor: pointer;
  border-radius: var(--radius);
}

/* Etats focus (§2.3) : outline cyan, offset 2px */
:focus-visible {
  outline: var(--focus-outline);
  outline-offset: var(--focus-outline-offset);
}

/* border-radius : --radius partout, aucun arrondi superieur (§2.3) */
input,
textarea,
select,
button,
.card,
.panel,
.modal {
  border-radius: var(--radius);
}

/* Barres de defilement discretes */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: var(--color-bg-primary);
}
::-webkit-scrollbar-thumb {
  background: var(--color-bg-elevated);
  border-radius: var(--radius);
}

[hidden] {
  display: none !important;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}