:root{
  --brand: #9A2A20;
  --brand-dark: #6E1B14;
  --accent: #CE372A;
  --surface: #FFFFFF;
  --surface-2: #F3E4E1;
  --text: #1F1A19;
  --text-muted: #5C5350;
  --border: #D9C9C5;
  --on-brand: #FFFFFF;
  --bar-btn: 52px;
  --bar-gap: 8px;
  --bar-line: 1px;
  --bar-h: calc(var(--bar-btn) + 2 * var(--bar-gap) + var(--bar-line));
  --bar-safe: env(safe-area-inset-bottom, 0px);
  --bar-total: calc(var(--bar-h) + var(--bar-safe));
  color-scheme: light;
}