:root {
  /* base ink & neutrals */
  --ink: #0d0d0d;
  --body: #4d4a4a;
  --muted: #6b6668;
  --muted-soft: #a9a4a6;
  --label: #5c5859;
  --line: #e2dfe0;
  --line-soft: #eeebec;
  --surface: #ffffff;
  --surface-sunken: #f4f1f2;

  /* brand pink */
  --pink: #ff2f95;
  --pink-deep: #d10f6f;
  --pink-dark: #c01f74;
  --pink-grad: linear-gradient(135deg, #ff5aa8, #f0287f); /* @kind color */
  --pink-grad-hover: linear-gradient(135deg, #ff79bd, #ff3f92); /* @kind color */
  --pink-rail-grad: linear-gradient(180deg, #ffb0da 0%, #ff56a6 26%, #f5197f 52%, #ff56a6 78%, #ffb0da 100%); /* @kind color */

  /* secondary blue (proof / referral) */
  --blue: #1560a8;
  --blue-deep: #12558f;
  --blue-grad: linear-gradient(90deg, #3d9be0, #12558f); /* @kind color */
  --blue-refer-grad: linear-gradient(150deg, #1f74b5, #0f4a7d); /* @kind color */

  /* semantic accents */
  --green: #0b7a48;
  --success-tick: #4fc98a;

  /* semantic aliases */
  --text-heading: var(--ink);
  --text-body: var(--body);
  --text-muted: var(--muted);
  --surface-card: var(--surface);
  --surface-dark: var(--ink);
  --border-default: var(--line);
  --border-soft: var(--line-soft);

  --card-shadow: 0 2px 6px rgba(13, 13, 13, 0.05), 0 18px 44px rgba(13, 13, 13, 0.09);
  --card-shadow-dark: 0 24px 60px rgba(13, 13, 13, 0.22);
}