/* v451 — user-approved compact reading scale.
   Scope is deliberately limited to public, customer and shopkeeper surfaces.
   The administrator panel does not receive the body class, so dense operational
   tables/forms retain their established scale.  Controls keep their 44px tap
   targets and mobile inputs retain the 16px anti-zoom minimum. */
body.type-compact-nonadmin {
  /* 90% typographic rhythm, with an explicit 12px floor in v450 a11y CSS. */
  --fs-xs:   clamp(0.75rem, 0.72rem + 0.1vw, 0.8125rem); /* 12–13px floor */
  --fs-sm:   clamp(0.75rem, 0.745rem + 0.09vw, 0.8125rem); /* 12–13px */
  --fs-md:   clamp(0.8125rem, 0.79rem + 0.11vw, 0.875rem); /* 13–14px */
  --fs-base: clamp(0.875rem, 0.85rem + 0.09vw, 0.9rem); /* 14–14.4px */
  --fs-lg:   clamp(0.9375rem, 0.91rem + 0.135vw, 1rem); /* 15–16px */
  --fs-xl:   clamp(1.05rem, 0.98rem + 0.27vw, 1.24rem); /* ~16.8–19.8px */
  --fs-2xl:  clamp(1.24rem, 1.125rem + 0.45vw, 1.575rem); /* ~19.8–25.2px */
  --fs-3xl:  clamp(1.35rem, 1.215rem + 0.54vw, 1.8rem); /* ~21.6–28.8px */
  --fs-4xl:  clamp(1.575rem, 1.395rem + 0.72vw, 2.25rem); /* ~25.2–36px */

  /* Compact page rhythm only; interactive target variables stay unchanged. */
  --space-md: 14px;
  --space-lg: 22px;
  --space-xl: 29px;
  --space-2xl: 43px;
  --space-3xl: 58px;
  --space-4xl: 86px;
}

/* Prominent public headings include historical literal sizes rather than the
   token family. Scale those specific display surfaces without affecting admin. */
body.type-compact-nonadmin :is(.page-hero, .section-head) h2,
body.type-compact-nonadmin .page-hero h1 {
  font-size: clamp(1.22rem, 2vw, 1.76rem);
}
body.type-compact-nonadmin .h-hero-title {
  font-size: clamp(26px, 2.39vw, 38px);
}
body.type-compact-nonadmin .h-hero-lead {
  font-size: 13px;
}

/* At narrow widths preserve information density without reducing controls or
   the mandatory readable-text floor. */
@media (max-width: 1024px) {
  body.type-compact-nonadmin {
    --space-2xl: 29px;
    --space-3xl: 36px;
    --space-4xl: 43px;
  }
}

@media (max-width: 480px) {
  body.type-compact-nonadmin .page-hero h1,
  body.type-compact-nonadmin :is(.page-hero, .section-head) h2 {
    font-size: 1.18rem;
  }
  body.type-compact-nonadmin .h-hero-title { font-size: clamp(24px, 6.9vw, 27px); }
}