/* ============================================================
   24好玩 · Typography  (Element Plus base)
   ------------------------------------------------------------
   UI / body / display all use the universally-available Element
   system stack (Helvetica Neue / PingFang SC / Microsoft YaHei).
   “Display” is simply the same stack at a heavy weight (800) — no
   webfont dependency, matching the product & slide material.
   ============================================================ */
:root {
  /* ---- Families ---- */
  --el-font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
  --font-sans:    var(--el-font-family);
  --font-display: var(--el-font-family); /* use at weight 800 for headlines */
  --font-num:     var(--el-font-family); /* tabular numerals via font-feature-settings */
  --font-mono:    ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  /* ---- Element font sizes ---- */
  --el-font-size-extra-large: 20px;
  --el-font-size-large:       18px;
  --el-font-size-medium:      16px;
  --el-font-size-base:        14px;
  --el-font-size-small:       13px;
  --el-font-size-extra-small: 12px;

  /* ---- Weights ---- */
  --fw-regular: 400; /* @kind other */
  --fw-medium:  500; /* @kind other */
  --fw-bold:    600; /* @kind other */
  --fw-heavy:   700; /* @kind other */
  --fw-black:   800; /* @kind other */

  /* ---- Type scale (UI uses el sizes; these for headings/marketing) ---- */
  --fs-display: 52px; /* marketing hero / big numbers */
  --fs-h1: 38px;
  --fs-h2: 30px;
  --fs-h3: 24px;
  --fs-h4: 20px;
  --fs-h5: 16px;
  --fs-body-lg: 16px;
  --fs-body: 14px;   /* Element base */
  --fs-sm: 13px;
  --fs-xs: 12px;

  /* ---- Line heights ---- */
  --lh-tight: 1.2;  /* @kind other */
  --lh-snug:  1.35; /* @kind other */
  --lh-normal:1.6;  /* @kind other */
  --lh-loose: 1.8;  /* @kind other */

  /* ---- Letter spacing ---- */
  --ls-tight: -0.01em; /* @kind other */
  --ls-normal: 0;      /* @kind other */
  --ls-wide: 0.04em;   /* @kind other */
}