/* typography-tune.css
 * Site-wide typography normalization layer.
 * Loaded from templates/header.php after page/module CSS so it can normalize most legacy page styles early.
 */

@media screen {
  :root {
    --cp-font-family-base: 'Noto Sans TC', 'Microsoft JhengHei', 'PingFang TC', 'Heiti TC', sans-serif;
    --cp-font-size-root: 16px;
    --cp-fs-text: 0.96rem;
    --cp-fs-control: 0.98rem;
    --cp-fs-small: 0.84rem;
    --cp-fs-h1: clamp(1.68rem, 1.28rem + 1.05vw, 2.05rem);
    --cp-fs-h2: clamp(1.34rem, 1.12rem + 0.72vw, 1.62rem);
    --cp-fs-h3: clamp(1.10rem, 1.02rem + 0.40vw, 1.24rem);
    --cp-fs-h4: clamp(1.02rem, 0.98rem + 0.22vw, 1.12rem);
  }

  html {
    font-size: var(--cp-font-size-root);
  }

  body {
    font-family: var(--cp-font-family-base) !important;
    font-size: var(--cp-fs-text) !important;
    line-height: 1.6;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: 100%;
  }

  body :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, td, th, label, legend, button, input, select, textarea, small, blockquote, figcaption, a) {
    font-family: var(--cp-font-family-base);
  }

  body :where(code, pre, kbd, samp) {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !important;
  }

  h1 {
    font-size: var(--cp-fs-h1) !important;
    line-height: 1.25;
  }

  h2 {
    font-size: var(--cp-fs-h2) !important;
    line-height: 1.3;
  }

  h3 {
    font-size: var(--cp-fs-h3) !important;
    line-height: 1.35;
  }

  h4 {
    font-size: var(--cp-fs-h4) !important;
    line-height: 1.35;
  }

  h5,
  h6 {
    font-size: 1rem !important;
    line-height: 1.4;
  }

  p, li, dt, dd, td, th, label, legend, blockquote {
    font-size: var(--cp-fs-text) !important;
    line-height: 1.6;
  }

  input,
  select,
  textarea,
  button,
  input[type='button'],
  input[type='submit'],
  input[type='reset'],
  .btn,
  a.button {
    font-family: inherit !important;
    font-size: var(--cp-fs-control) !important;
    line-height: 1.45;
  }

  nav ul li a,
  .navbar a,
  .user-info,
  .select-wrapper {
    font-size: 0.95rem !important;
  }

  small,
  .small,
  .badge,
  .muted,
  .hint,
  .help,
  .help-text,
  .sub,
  .subtext,
  .meta,
  .note,
  .desc,
  .copyright small,
  .ao-badge,
  .ao-import-meta,
  .ao-summary-line,
  .ao-debug-box pre {
    font-size: var(--cp-fs-small) !important;
    line-height: 1.55;
  }

  table {
    font-size: var(--cp-fs-text);
  }

  .copyright {
    font-size: 0.94rem !important;
  }

  .since,
  .credits {
    font-size: 0.78rem !important;
  }

  body [style*='font-size:8px'],
  body [style*='font-size: 8px'],
  body [style*='font-size:9px'],
  body [style*='font-size: 9px'],
  body [style*='font-size:10px'],
  body [style*='font-size: 10px'],
  body [style*='font-size:11px'],
  body [style*='font-size: 11px'],
  body [style*='font-size:12px'],
  body [style*='font-size: 12px'],
  body [style*='font-size:.8rem'],
  body [style*='font-size: .8rem'],
  body [style*='font-size:0.8rem'],
  body [style*='font-size: 0.8rem'] {
    font-size: var(--cp-fs-small) !important;
    line-height: 1.55 !important;
  }

  body [style*='font-size:13px'],
  body [style*='font-size: 13px'] {
    font-size: 0.88rem !important;
  }

  body [style*='font-size:14px'],
  body [style*='font-size: 14px'] {
    font-size: 0.94rem !important;
  }

  @media (max-width: 768px) {
    :root {
      --cp-fs-text: 0.95rem;
      --cp-fs-control: 0.97rem;
      --cp-fs-small: 0.83rem;
      --cp-fs-h1: clamp(1.50rem, 1.22rem + 0.92vw, 1.82rem);
      --cp-fs-h2: clamp(1.22rem, 1.08rem + 0.60vw, 1.42rem);
      --cp-fs-h3: clamp(1.06rem, 0.99rem + 0.28vw, 1.16rem);
      --cp-fs-h4: clamp(1rem, 0.96rem + 0.18vw, 1.08rem);
    }

    nav ul li a,
    .navbar a,
    .user-info {
      font-size: 0.92rem !important;
    }
  }
}
