/* Le Salon : la base commune (polices, couleurs). Polices Fira Sans et Archivo (licence OFL, fichiers dans /polices). */
@font-face { font-family: 'Fira Sans'; font-weight: 400; font-style: normal; font-display: swap; src: url(/polices/fira-sans-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Fira Sans'; font-weight: 700; font-style: normal; font-display: swap; src: url(/polices/fira-sans-latin-700-normal.woff2) format('woff2'); }
@font-face { font-family: 'Archivo'; font-weight: 600; font-style: normal; font-display: swap; src: url(/polices/archivo-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Archivo'; font-weight: 800; font-style: normal; font-display: swap; src: url(/polices/archivo-latin-800-normal.woff2) format('woff2'); }
:root {
  --papier: #F6F2EC; --carte: #FFFFFF; --carte2: #EFE8DF; --trait: #DDD3C7;
  --encre: #2A1C12; --texte: #2E241C; --doux: #6B5D50;
  --cafe: #6F3B1E; --creme: #F3E3CF; --accent: #B4532A;
  --vert: #1F7A4D; --vert-f: #E2F2E8; --orange: #B5620B; --orange-f: #FBEBD8; --rouge: #B42318; --rouge-f: #FBE3E0; --bleu: #2F6DB5; --bleu-f: #E3EDF8;
  --or: #C99A1D; --action: #2A1C12; --action-t: #FFFFFF; --focus: #2F6DB5;
  --ombre: 0 1px 2px rgba(42, 28, 18, .06), 0 8px 24px rgba(42, 28, 18, .09);
  --f-texte: 'Fira Sans', system-ui, 'Segoe UI', Arial, sans-serif;
  --f-titre: 'Archivo', 'Segoe UI', Arial, sans-serif;
  color-scheme: light;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--papier); color: var(--texte); font-family: var(--f-texte); font-size: 16px; line-height: 1.45; -webkit-font-smoothing: antialiased; overflow-wrap: anywhere;
  -webkit-text-size-adjust: 100%; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
button:disabled { cursor: not-allowed; opacity: .45; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
h1, h2, h3, p, ol, ul, figure { margin: 0; }
h1, h2, h3 { text-wrap: balance; font-family: var(--f-titre); }
[hidden] { display: none !important; }
.num { font-variant-numeric: tabular-nums; }
.etoiles { color: var(--or); letter-spacing: .05em; white-space: nowrap; }
.pastille { display: inline-block; width: .8em; height: .8em; border-radius: 50%; background: var(--c, var(--doux)); flex: none; }
.reseau { position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 50; background: var(--rouge); color: #fff; font-weight: 700;
  border-radius: 99px; padding: 8px 16px; font-size: 15px; box-shadow: var(--ombre); }
.toast { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 60; width: max-content; max-width: calc(100% - 32px);
  background: var(--encre); color: #fff; font-weight: 700; border-radius: 12px; padding: 12px 18px; box-shadow: var(--ombre); font-size: 17px; text-align: center; }
.toast.juste { background: var(--vert); }
.toast.erreur { background: var(--rouge); }
.btn { border: 1.5px solid var(--encre); background: var(--carte); color: var(--encre); border-radius: 10px; padding: 10px 16px; font-weight: 700; min-height: 44px; }
.btn.plein { background: var(--action); color: var(--action-t); }
.btn.vert { background: var(--vert); border-color: var(--vert); color: #fff; }
.btn.petit { min-height: 34px; padding: 5px 11px; font-size: 14px; border-radius: 8px; }
.btn.lien { border: 0; background: none; padding: 6px 4px; text-decoration: underline; font-weight: 400; min-height: 0; color: var(--doux); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }