/* Brand tokens from the monikas-brand skill (palette locked 2026-08-31). Never hardcode hex below this block. */
:root {
  --cream:  #FCF7F5;
  --blush:  #F0E8E2;
  --white:  #FDFDFD;
  --greige: #B7A593;
  --sage:   #82A99C;
  --forest: #374837;
  --accent: var(--navy);   /* portal emphasis color. Monika 2026-10-05: navy, not forest */
  --navy:   #00324A;
  --ink:    #0D0D0D;

  --muted:      rgba(13, 13, 13, 0.62);
  --line:       rgba(183, 165, 147, 0.38);   /* greige at ~38% */
  --on-navy:    rgba(252, 247, 245, 0.78);
  --lift:       0 4px 16px rgba(0, 50, 74, 0.08);

  --f-head:  'Playfair Display', Georgia, serif;
  --f-body:  'Poppins', system-ui, sans-serif;
  --f-label: 'Karla', system-ui, sans-serif;
  --f-hand:  'Caveat', cursive;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: var(--f-body);
  font-size: 15px;
  line-height: 1.75;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main { flex: 1; }
h1, h2, h3 { font-family: var(--f-head); font-weight: 700; line-height: 1.2; margin: 0; }
h1 em, h2 em { font-weight: 400; font-style: italic; color: var(--accent); }
a { color: var(--accent); }
img, svg { display: block; }

.label {
  font-family: var(--f-label);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: var(--accent);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.label.quiet { color: var(--muted); }

.star { width: 10px; height: 10px; fill: currentColor; flex: none; }

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