/* WordPress owns saved design choices; components consume semantic runtime
   tokens. A visitor colour preference may replace the semantic layer without
   mutating WordPress preset variables or the selected Global Style variation. */
:root {
  --contextus-ink: var(--wp--preset--color--ink, #111111);
  --contextus-ink-soft: var(--wp--preset--color--ink-soft, #2a2a2a);
  --contextus-paper: var(--wp--preset--color--paper, #ffffff);
  --contextus-paper-2: var(--wp--preset--color--paper-2, #f7f6f2);
  --contextus-gray-1: var(--wp--preset--color--gray-1, #f5f5f4);
  --contextus-gray-2: var(--wp--preset--color--gray-2, #e6e6e4);
  --contextus-gray-3: var(--wp--preset--color--gray-3, #c9c9c6);
  --contextus-mute: var(--wp--preset--color--mute, #6f6f6c);
  --contextus-accent: var(--wp--preset--color--yellow, #ffe600);
  --contextus-accent-soft: var(--wp--preset--color--yellow-soft, #fff9c2);

  /* Compatibility names used by the app-derived component stylesheets. */
  --ink: var(--contextus-ink);
  --ink-soft: var(--contextus-ink-soft);
  --paper: var(--contextus-paper);
  --paper-2: var(--contextus-paper-2);
  --gray-1: var(--contextus-gray-1);
  --gray-2: var(--contextus-gray-2);
  --gray-3: var(--contextus-gray-3);
  --mute: var(--contextus-mute);
  --y: var(--contextus-accent);
  --y-soft: var(--contextus-accent-soft);

  --on-accent: var(--wp--custom--semantic--on-accent, #111111);
  --shell-inverse-bg: var(--wp--custom--semantic--inverse-surface, #111111);
  --shell-inverse-text: var(--wp--custom--semantic--inverse-text, #ffffff);
  --shell-muted: color-mix(in hsl, var(--shell-inverse-text) 62%, var(--shell-inverse-bg));
  --shell-rule: color-mix(in hsl, var(--shell-inverse-text) 18%, var(--shell-inverse-bg));
}