/* ========== Root tokens (Desktop baseline) ========== */
:root {
   /* Breakpoints (for reference in JS or documentation) */
   --bp-sm: 576px;
   --bp-md: 768px;
   --bp-lg: 1024px;
   --bp-xl: 1280px;

   /* Container widths */
   --container-sm: 540px;
   --container-md: 800px;
   --container-lg: 960px;
   --container-xl: 1200px;
   --container-xxl: 1320px;

   /* Spacing scale */
   --space-xxs: 0.4rem;
   --space-xs: 0.8rem;
   --space-sm: 1.2rem;
   --space-md: 2.0rem;
   --space-lg: 3.2rem;
   --space-xl: 5.6rem;
   --space-xxl: 10.0rem;

   /* ===== Font scale (PC基準) ===== */
   --fz-xxxs: 1.1rem;
   --fz-xxs: 1.2rem;
   --fz-xs: 1.3rem;
   --fz-sm: 1.5rem;
   --fz-md: 1.8rem;
   --fz-rg: 1.6rem;
   --fz-lg: 2.0rem;
   --fz-xl: 2.4rem;
   --fz-2xl: 2.8rem;
   --fz-3xl: 3.2rem;
   --fz-4xl: 4.4rem;
   --fz-5xl: 5.4rem;

   /* Colors */
   --color-text: #0a1e3c;
   --color-text-light: #5a6063;
   --color-link: #185de3;
   --color-bg: #fff;
   --color-bg-alt: #f8f9f9;
   --color-bg-gray: #e6e7e8;
   --color-border: #ddd;
   --color-primary: #0781a8;
   --color-secondary: #0288d1;
   --color-accent: #f57c00;

   /* Radius & Shadow */
   --radius-xs: 0.2rem;
   --radius-sm: 0.4rem;
   --radius-md: 0.8rem;
   --radius-lg: 1.2rem;
   --radius-pill: 999px;

   --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.08);
   --shadow-md: 0 5px 25px rgba(0, 0, 0, 0.08);
   --shadow-lg: 0 6px 20px rgba(0, 0, 0, 0.15);
}

/* ========== Tablet (768–1023px) ========== */
@media (max-width: 1023px) {
   :root {
      /* Spacing adjustments */
      --space-lg: 2.4rem;
      --space-xl: 4.0rem;
      --space-xxl: 6.0rem;

      /* Font adjustments */
      --fz-xxxs: 1.05rem;
      --fz-xxs: 1.14rem;
      --fz-xs: 1.24rem;
      --fz-sm: 1.43rem;
      --fz-md: 1.71rem;
      --fz-rg: 1.52rem;
      --fz-lg: 2.0rem;
      --fz-xl: 2.28rem;
      --fz-2xl: 2.7rem;
      --fz-3xl: 3.24rem;
      --fz-4xl: 3.96rem;
      --fz-5xl: 4.86rem;
   }
}

/* ========== Smartphone (~767px) ========== */
@media (max-width: 767px) {
   :root {
      /* Spacing adjustments  */
      --space-xxs: 0.3rem;
      --space-xs: 0.6rem;
      --space-sm: 1.0rem;
      --space-md: 1.6rem;
      --space-lg: 2.0rem;
      --space-xl: 3.2rem;
      --space-xxl: 4.0rem;

      /* Font adjustments */
      --fz-xxxs: 0.94rem;
      --fz-xxs: 1.1rem;
      --fz-xs: 1.2rem;
      --fz-sm: 1.3rem;
      --fz-md: 1.6rem;
      --fz-rg: 1.4rem;
      --fz-lg: 1.8rem;
      --fz-xl: 2.0rem;
      --fz-2xl: 2.2rem;
      --fz-3xl: 2.4rem;
      --fz-4xl: 2.8rem;
      --fz-5xl: 3.4rem;
   }
}