/* Course pages keep their --pd-* names, mapped onto the Design System 2 roles in
   /system/tokens.css. --pd-ink is the paper and --pd-bone the ink, as before. */
.ut-courses {
  --pd-ink: var(--gw-paper);
  --pd-carbon: var(--gw-card);
  --pd-graphite: var(--gw-card-hover);
  --pd-bone: var(--gw-ink);
  --pd-paper: var(--gw-paper-raised);
  --pd-ash: var(--gw-muted);
  --pd-faint: var(--gw-muted);
  --pd-rule: rgba(37, 56, 60, .18);
  --pd-rule-strong: rgba(37, 56, 60, .4);
  --pd-signal: var(--gw-signal-text);
  --pd-focus: var(--gw-signal-text);
  --pd-font-display: 'IBM Plex Sans', system-ui, sans-serif;
  --pd-font-body: 'IBM Plex Sans', system-ui, sans-serif;
  --pd-font-instrument: 'IBM Plex Sans', system-ui, sans-serif;
  --pd-gutter: clamp(20px, 4vw, 64px);
}