:root {
  color-scheme: light;
  --paper: #f5f4f0;
  --ink: #242522;
  --muted: #656660;
  --line: #d8d8d0;
  --soft: #e8e8e1;
  --field-surface: #fcfcf9;
  --field-border: #81837b;
  --focus: #345d4d;
  --error: #a02e2e;
  --inverse-muted: #bfc1b7;
  --inverse-line: #454740;
  --selection: #d1d7cd;
  --button-hover: #42453f;
  --gutter: clamp(1.25rem, 5.55vw, 5rem);
  --sans: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;
  --type-display: clamp(3.25rem, 5.3vw, 5rem);
  --type-section: clamp(2.25rem, 3.5vw, 3.25rem);
  --type-title: 1.5rem;
  --type-body: 1.0625rem;
  --type-input: 1rem;
  --type-navigation: .875rem;
  --type-control: .875rem;
  --type-meta: .8125rem;
  --type-caption: .75rem;
  --leading-body: 1.55;
  --leading-meta: 1.5;
  --target-min: 44px;
  --control-height: 48px;
  --control-radius: 24px;
  --field-radius: 4px;
  --request-inset-compact: clamp(12px, 4vw, 20px);
  --field-inset-compact: clamp(8px, 2.5vw, 12px);
  --control-gap: 12px;
  --column-gap: clamp(2rem, 6vw, 5.5rem);
  --border-width: 1px;
  --focus-width: 2px;
  --focus-offset: 5px;
  --motion-resolve: 2000ms;
  --motion-reset: 800ms;
  --motion-opening: 2600ms;
  --motion-feedback: 150ms;
  --motion-disclosure: 220ms;
  --motion-enter: 300ms;
  --motion-stagger: 100ms;
  --ease-feedback: ease-out;
}