@font-face{font-family:"Sora";font-style:normal;font-display:swap;font-weight:100 800;src:url(sora.fa26406eed.woff2) format("woff2");}

/* ---- css/tokens.css ---- */
/* Charte ANG Assurance : variables définies une seule fois (voir .claude/rules/interface.md). */
:root {
  --ang-nuit: #0B1D3A;   /* texte principal, barre latérale, titres */
  --ang-bleu: #1E5BFF;   /* action principale, liens, focus, congé annuel */
  --ang-cyan: #00B4FF;   /* accent sur fond bleu nuit uniquement */
  --ang-gris: #F2F4F7;   /* fond de page */
  --surface: #FFFFFF;
  --texte-secondaire: #4A5670;
  --bordure: #DCE1EA;
  --succes: #12805C;
  --attention: #8A5A00;
  --attention-fond: #FFF4DE;
  --erreur: #C62828;
  --erreur-fond: #FDECEC;

  --police: "Sora", system-ui, "Segoe UI", Arial, sans-serif;
  --t-12: 12px;
  --t-14: 14px;
  --t-16: 16px;
  --t-20: 20px;
  --t-28: 28px;

  --rayon: 8px;
  --duree: 180ms;
}

/* ---- css/base.css ---- */
/* Styles de base : remise à zéro légère, typographie, coque provisoire du lot 1. */
*, *::before, *::after { box-sizing: border-box; }

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

body {
  margin: 0;
  background: var(--ang-gris);
  color: var(--ang-nuit);
  font-family: var(--police);
  font-size: var(--t-16);
  font-weight: 400;
  line-height: 1.5;
}

h1, h2, h3 { font-weight: 600; line-height: 1.25; margin: 0 0 12px; }
h1 { font-size: var(--t-28); }

:focus-visible { outline: 2px solid var(--ang-bleu); outline-offset: 2px; }

.shell { min-height: 100vh; display: flex; flex-direction: column; }

.topbar {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 24px;
  background: var(--ang-nuit);
  color: #FFFFFF;
}

.brand { font-weight: 600; font-size: var(--t-20); }
.brand-logo { height: 32px; width: auto; display: block; }
.app-name { font-size: var(--t-14); font-weight: 500; opacity: 0.9; }

.main { flex: 1; padding: 32px 24px; max-width: 80ch; outline: none; }
.lead { font-size: var(--t-20); margin: 0 0 8px; }
.muted { color: var(--texte-secondaire); font-size: var(--t-14); }
.muted.error { color: #C62828; font-weight: 500; }

@media (max-width: 600px) {
  .topbar { flex-wrap: wrap; gap: 4px 12px; padding: 12px 16px; }
  .main { padding: 24px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}