:root {
  /* Brand */
  --fdx-purple: #4d148c;
  --fdx-purple-dark: #35105f;
  --fdx-orange: #ff6200;

  /* Neutral palette */
  --fdx-ink: #333333;
  --fdx-ink-strong: #1f1f1f;
  --fdx-muted: #666666;
  --fdx-muted-soft: #767676;
  --fdx-line: #d8d8d8;
  --fdx-line-strong: #b5b5b5;
  --fdx-surface: #ffffff;
  --fdx-surface-subtle: #f7f7f7;
  --fdx-surface-muted: #f2f2f2;
  --fdx-page: #ffffff;

  /* Status */
  --fdx-green: #16794a;
  --fdx-red: #b42318;
  --fdx-amber: #8a5a00;
  --fdx-blue: #174ea6;

  /* Type */
  --fdx-font-sans: FedExSans, Arial, Helvetica, sans-serif;
  --fdx-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  /* Spacing: intentionally close to the utility rhythm seen in FedEx AEM */
  --fdx-space-1: 0.25rem;
  --fdx-space-2: 0.5rem;
  --fdx-space-3: 0.75rem;
  --fdx-space-4: 1rem;
  --fdx-space-5: 1.5rem;
  --fdx-space-6: 2rem;
  --fdx-space-7: 3rem;
  --fdx-space-8: 4rem;

  /* Shape and elevation */
  --fdx-radius-xs: 2px;
  --fdx-radius-sm: 4px;
  --fdx-radius-pill: 999px;
  --fdx-shadow: 0 2px 8px rgb(0 0 0 / 8%);
  --fdx-shadow-strong: 0 4px 16px rgb(0 0 0 / 12%);

  /* Layout */
  --fdx-content-max: 1180px;
  --fdx-control-height: 44px;
  --fdx-header-height: 68px;

  /* Compatibility aliases for existing application-specific rules. */
  --ink: var(--fdx-ink);
  --muted: var(--fdx-muted);
  --line: var(--fdx-line);
  --soft: var(--fdx-surface-subtle);
  --purple: var(--fdx-purple);
  --purple-dark: var(--fdx-purple-dark);
  --orange: var(--fdx-orange);
  --green: var(--fdx-green);
  --red: var(--fdx-red);
  --amber: var(--fdx-amber);
  --shadow: var(--fdx-shadow);
}