/*
 * First Sheep — shared tokens
 * Only existing, genuinely shared values belong here. Page-specific values
 * intentionally remain in their page stylesheet or the compatibility stylesheet.
 */
:root {
  --first-sheep-font: "筑紫A丸ゴシック", "Tsukushi A Round Gothic", sans-serif;
  --fs-color-warm-ivory: #fff7f0;
  --fs-color-soft-cream: #f9efe6;
  --fs-color-primary-amber: #d89a3a;
  --fs-color-dusty-pink: #c98f97;
  --fs-color-dark-cocoa: #3a2c28;

  /* First Sheep typography roles — Mobile (default) */
  --fs-display: 44px;
  --fs-h1: 38px;
  --fs-h2: 30px;
  --fs-h3: 24px;
  --fs-lead: 22px;
  --fs-body-large: 18px;
  --fs-body: 18px;
  --fs-small: 14px;
  --fs-caption: 12px;

  --lh-display: 1.12;
  --lh-h1: 1.15;
  --lh-h2: 1.22;
  --lh-h3: 1.35;
  --lh-lead: 1.55;
  --lh-body-large: 1.7;
  --lh-body: 1.8;
  --lh-small: 1.7;
  --lh-caption: 1.6;
}

/* Tablet: 768px–899px */
@media (min-width: 768px) {
  :root {
    --fs-display: 52px;
    --fs-h1: 44px;
    --fs-h2: 34px;
    --fs-h3: 28px;
    --fs-lead: 24px;
    --fs-body-large: 20px;
    --fs-body: 20px;
    --fs-small: 14px;
    --fs-caption: 12px;
  }
}

/* Compact Desktop: 900px–1279px */
@media (min-width: 900px) {
  :root {
    --fs-display: 58px;
    --fs-h1: 50px;
    --fs-h2: 38px;
    --fs-h3: 32px;
    --fs-lead: 26px;
    --fs-body-large: 22px;
    --fs-body: 22px;
    --fs-small: 15px;
    --fs-caption: 13px;
  }
}

/* Wide Desktop: 1280px以上 */
@media (min-width: 1280px) {
  :root {
    --fs-display: 64px;
    --fs-h1: 56px;
    --fs-h2: 42px;
    --fs-h3: 36px;
    --fs-lead: 28px;
    --fs-body-large: 24px;
    --fs-body: 24px;
    --fs-small: 16px;
    --fs-caption: 13px;
  }
}