:root {
  --ui-text-xs: 0.75rem;
  --ui-text-xs-lh: 1rem;
  --ui-text-sm: 0.875rem;
  --ui-text-sm-lh: 1.25rem;
  --ui-card-title-fs: 1rem;
  --ui-ink: #1c1917;
  --ui-ink-2: #57534e;
  --ui-ink-3: #a8a29e;
  --ui-brand: #9f003e;
  --ui-brand-600: #ad0445;
  --ui-wash-0: #fff8f9;
  --ui-wash: #fff0f2;
  --ui-wash-2: #ffe1e5;
  --ui-paper: #ffffff;
  --ui-field: #f7f6f5;
  --ui-sunk: #eeecea;
  --ui-sunk-line: #e0ddd9;
  --ui-hover: #faf9f8;
  --ui-rule: #e7e5e4;
  --ui-done: #15803d;
  --ui-done-wash: #f0fdf4;
  --ui-warn: #b45309;
  --ui-warn-ink: #92400e;
  --ui-warn-wash: #fffbeb;
  --ui-warn-line: #fde68a;
  --ui-done-line: #bbf7d0;
  --ui-flow: #0369a1;
  --ui-flow-wash: #f0f9ff;
  --ui-flow-line: #bae6fd;
  --ui-stop: #b91c1c;
  --ui-stop-wash: #fef2f2;
  --ui-stop-line: #fecaca;
  --ui-brand-line: #f5c6d8;
  --ui-link-pill: var(--ui-wash-2);
  --ui-link-pill-hover: #ffd3da;
  --ui-link-pill-press: #ffc4ce;
  --ui-link-pill-line: #d9839f;
  --ui-link-pill-icon: var(--ui-brand);
  --ui-chrome: #1c0a0f;
  --ui-chrome-2: #2b1219;
  --ui-chrome-line: #33161e;
  --ui-chrome-ink: #fbeef1;
  --ui-chrome-ink-2: #d8a6b1;
  --ui-chrome-ink-3: #a3737e;
  --ui-control-h: 3rem;
  --ui-control-px: 0.75rem;
  --ui-control-fs: 1rem;
  --ui-control-r: 0.5rem;
  --ui-block-r: 0.75rem;
  --ui-tap: 3rem;
}

@media (min-width: 640px) and (pointer: fine) {
  :root {
    --ui-control-h: 1.875rem;
    --ui-control-px: 0.625rem;
    --ui-control-fs: 0.875rem;
  }
}

@media (pointer: fine) {
  :root {
    --ui-tap: 2.25rem;
  }
}

@media (max-width: 639px) {
  :root {
    --ui-text-xs: 0.8125rem;
    --ui-text-xs-lh: 1.125rem;
    --ui-text-sm: 1rem;
    --ui-text-sm-lh: 1.5rem;
    --ui-card-title-fs: 1.0625rem;
  }
}