:root {
  /* ---- Base palette ---------------------------------------------------- */
  --white: #ffffff;
  --black: #14171c;

  /* Brand green — the single accent colour. Buttons, heading accents, the mark. */
  --green-900: #1e2b27;
  --green-800: #2b3d38;
  --green-700: #334a44;
  --green-600: #405952; /* BRAND PRIMARY */
  --green-500: #4f6c64;
  --green-400: #6d8880;
  --green-300: #9db1ab;
  --green-200: #c6d2ce;
  --green-100: #e3e9e7;
  --green-50:  #f0f4f3;

  /* Neutrals — page and surface greys */
  --neutral-0:   #ffffff;
  --neutral-50:  #f7f8fa;
  --neutral-100: #f1f2f6; /* BRAND SURFACE */
  --neutral-200: #e4e6ec;
  --neutral-300: #d0d3dc;
  --neutral-400: #a6abb8;
  --neutral-500: #7a8091;
  --neutral-600: #575d6c;
  --neutral-700: #3c414d;
  --neutral-800: #262a33;
  --neutral-900: #14171c;

  /* Semantic status — muted. Legal work reports facts, it does not alarm. */
  --success-600: #3f7a55;
  --success-50:  #e6f1ea;
  --warning-600: #96702a;
  --warning-50:  #f6efdf;
  --danger-600:  #a2483f;
  --danger-50:   #f6e8e6;
  --info-600:    #3f6379;
  --info-50:     #e7eef3;

  /* ---- Semantic surfaces ---------------------------------------------- */
  --page-bg: var(--neutral-100);
  --surface-page: var(--neutral-100);
  --surface-card: var(--white);
  --surface-sunken: var(--neutral-50);
  --surface-brand-soft: var(--green-50);
  --surface-dark: var(--green-800);
  --surface-darkest: var(--green-900);

  /* ---- Semantic text --------------------------------------------------- */
  --text-strong: var(--neutral-900);
  --text-body: var(--neutral-700);
  --text-muted: var(--neutral-500);
  --text-brand: var(--green-600);
  --text-on-dark: var(--white);
  --text-on-dark-muted: var(--green-200);
  --text-link: var(--green-600);
  --text-link-hover: var(--green-800);

  /* ---- Borders --------------------------------------------------------- */
  --border-subtle: var(--neutral-200);
  --border-default: var(--neutral-300);
  --border-strong: var(--neutral-400);
  --border-brand: var(--green-300);
  --border-brand-soft: var(--green-100);
  --focus-ring: rgba(64, 89, 82, 0.35);

  /* ---- Action colours -------------------------------------------------- */
  --action-primary-bg: var(--green-600);
  --action-primary-bg-hover: var(--green-700);
  --action-primary-bg-active: var(--green-800);
  --action-primary-fg: var(--white);
  --action-secondary-bg: var(--white);
  --action-secondary-bg-hover: var(--green-50);
  --action-secondary-fg: var(--green-600);
  --action-ghost-bg-hover: var(--green-50);
  --action-disabled-bg: var(--neutral-200);
  --action-disabled-fg: var(--neutral-400);
}