:root{
  /* --- Base ramps --- */
  --pd-ink-900:#1E1917;
  --pd-ink-800:#2A2320;
  --pd-ink-700:#3B322D;
  --pd-ink-600:#544940;

  --pd-clay-700:#6E3623;
  --pd-clay-600:#8F4A34;
  --pd-clay-500:#B5654A;
  --pd-clay-400:#C98369;
  --pd-clay-300:#E0AE99;
  --pd-clay-200:#F0D6CA;
  --pd-clay-100:#FAEDE7;

  --pd-sand-100:#FBF7F3;
  --pd-sand-200:#F3EDE6;
  --pd-sand-300:#E7DED4;
  --pd-sand-400:#D3C6B8;
  --pd-sand-500:#A8998A;
  --pd-sand-600:#7A6E62;

  --pd-sage-600:#55604F;
  --pd-sage-500:#6E7A6A;
  --pd-sage-200:#DCE1D8;

  --pd-white:#FFFFFF;
  --pd-black:#0F0D0C;

  /* --- Semantic status --- */
  --pd-success-500:#5C7A55;
  --pd-success-100:#E6EDE2;
  --pd-warning-500:#C08A2E;
  --pd-warning-100:#F7ECD6;
  --pd-error-500:#A33A28;
  --pd-error-100:#F7E2DE;

  /* --- Text --- */
  --text-strong:var(--pd-ink-900);
  --text-body:var(--pd-ink-700);
  --text-muted:var(--pd-sand-600);
  --text-accent:var(--pd-clay-600);
  --text-inverse:var(--pd-sand-100);
  --text-on-accent:var(--pd-white);

  /* --- Surfaces --- */
  --surface-page:var(--pd-sand-100);
  --surface-card:var(--pd-white);
  --surface-sunken:var(--pd-sand-200);
  --surface-inverse:var(--pd-ink-900);
  --surface-accent:var(--pd-clay-500);
  --surface-accent-soft:var(--pd-clay-100);
  --surface-overlay:rgba(30,25,23,.62);

  /* --- Borders --- */
  --border-subtle:var(--pd-sand-300);
  --border-default:var(--pd-sand-400);
  --border-strong:var(--pd-ink-900);
  --border-accent:var(--pd-clay-500);

  /* --- Actions --- */
  --action-primary-bg:var(--pd-clay-500);
  --action-primary-bg-hover:var(--pd-clay-600);
  --action-primary-bg-active:var(--pd-clay-700);
  --action-primary-fg:var(--pd-white);

  --action-secondary-bg:transparent;
  --action-secondary-bg-hover:var(--pd-clay-100);
  --action-secondary-fg:var(--pd-ink-900);
  --action-secondary-border:var(--pd-ink-900);

  --action-quiet-fg:var(--pd-clay-600);
  --action-quiet-bg-hover:var(--pd-sand-200);

  --action-disabled-bg:var(--pd-sand-300);
  --action-disabled-fg:var(--pd-sand-500);

  --focus-ring:var(--pd-clay-500);
  --selection-bg:var(--pd-clay-200);
}
