/* QUVÉE — designtokens. Immutabel. Geen kleur/font elders in de codebase. */
:root {
  /* Kleuren */
  --creme:        #F5EFE6;  /* achtergrond canvas */
  --lichtbruin:   #EDE4D6;  /* panelen, kaartvlak */
  --cognac-goud:  #C9A96E;  /* accent, randen, actieve staat */
  --espresso:     #2C1810;  /* koppen, primaire tekst */
  --zacht-bruin:  #6B5D4F;  /* secundaire tekst, labels */
  --terracotta:   #A6412B;  /* status: inschrijving open */
  --salie-groen:  #7A946E;  /* status: te koop */

  /* Typografie */
  --font-head: 'Cormorant Garamond', 'Liberation Serif', serif;
  --font-body: 'Inter', 'DejaVu Sans', sans-serif;

  /* Afgeleide, niet-nieuwe waarden (opacity-varianten van bovenstaande) */
  --rand:         1px solid var(--cognac-goud);
  --radius:       4px;
  --schaduw:      0 2px 12px rgba(44,24,16,0.08);
  --creme-92:     rgba(245,239,230,0.92);
  --creme-97:     rgba(245,239,230,0.97);
  --espresso-08:  rgba(44,24,16,0.08);
  --espresso-14:  rgba(44,24,16,0.14);
  --goud-18:      rgba(201,169,110,0.18);
  --goud-40:      rgba(201,169,110,0.40);
  --salie-tint:   rgba(122,148,110,0.16);
  --goud-tint:    rgba(201,169,110,0.16);
  --terracotta-tint: rgba(166,65,43,0.14);
  --bruin-tint:   rgba(107,93,79,0.12);

  /* Spacing */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px;

  /* Maten uit de layoutspec */
  --header-h: 64px;
  --filter-w: 320px;
  --detail-w: 420px;
  --tijdlijn-h: 96px;
  --tijdlijn-h-in: 24px;
}