/* Independent reference-inspired tokens; see design-tokens.json for provenance. */
:root {
  --sg-color-paper: #ffffff;
  --sg-color-ink: #222222;
  --sg-color-muted: #767676;
  --sg-color-sand: #f6f2ea;
  --sg-color-line: #dfdbd5;
  --sg-color-blue: #0278c7;
  --sg-color-sky: #038dd8;
  --sg-color-teal: #3eadc4;
  --sg-color-alert: #de4e31;
  --sg-color-teal-text: #16768a;
  --sg-font-body: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
  --sg-font-latin: "Gantari", Arial, sans-serif;
  --sg-type-body: 1rem;
  --sg-type-small: 0.875rem;
  --sg-type-heading: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --sg-type-display: clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
  --sg-type-label: 1rem;
  --sg-space-4: 0.25rem;
  --sg-space-8: 0.5rem;
  --sg-space-12: 0.75rem;
  --sg-space-16: 1rem;
  --sg-space-20: 1.25rem;
  --sg-space-24: 1.5rem;
  --sg-space-32: 2rem;
  --sg-space-40: 2.5rem;
  --sg-space-48: 3rem;
  --sg-space-60: 3.75rem;
  --sg-space-80: 5rem;
  --sg-space-100: 6.25rem;
  --sg-layout-content: 75rem;
  --sg-layout-reading: 62.5rem;
  --sg-layout-gutter: clamp(1rem, 4vw, 3rem);
  --sg-layout-section: clamp(3.75rem, 7vw, 6.25rem);
  --sg-layout-breakpoint: 48rem;
  --sg-layout-wide: 75rem;
  --sg-layout-target: 2.75rem;
  --sg-radius-card: 1.25rem;
  --sg-radius-small: 0.625rem;
  --sg-radius-section: clamp(1.875rem, 5vw, 5rem);
  --sg-radius-pill: 9999px;
  --sg-motion-fast: 250ms;
  --sg-motion-normal: 300ms;
}