/**
 * TAYSP design tokens — shared across mirror pages.
 * Source of truth for color / type / spacing on program + shell polish.
 */
:root {
  --taysp-ink: #1a282c;
  --taysp-muted: #3a464a;
  --taysp-soft: #5a6568;
  --taysp-teal: #00a09f;
  --taysp-teal-soft: rgba(0, 160, 159, 0.12);
  --taysp-line: rgba(0, 160, 159, 0.14);
  --taysp-card: #ffffff;
  --taysp-bg-soft: #f7fbfb;
  --taysp-radius: 14px;
  --taysp-radius-lg: 18px;
  --taysp-shadow: 0 8px 22px rgba(26, 40, 44, 0.045);
  --taysp-shadow-lg: 0 12px 32px rgba(26, 40, 44, 0.06);
  --taysp-gap: 1rem;
  --taysp-section-y: 1.75rem;
  --taysp-title-size: 1.28rem;
  --taysp-body-size: 0.98rem;
  --taysp-body-lh: 1.62;
  --taysp-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --taysp-wrap: 1250px;
}

@media (min-width: 991px) {
  :root {
    --taysp-gap: 1.15rem;
    --taysp-section-y: 2.25rem;
    --taysp-title-size: 1.38rem;
    --taysp-body-size: 1.02rem;
  }
}

@media (max-width: 767px) {
  :root {
    --taysp-gap: 0.85rem;
    --taysp-section-y: 1.35rem;
    --taysp-title-size: 1.18rem;
    --taysp-body-size: 0.95rem;
    --taysp-radius: 12px;
  }
}