:root {
  /* Canvas and surface */
  --merxi-cloud: #fcfaf4;
  --merxi-pearl: #f4eddf;
  --merxi-mist: #eaf2f7;
  --merxi-white: #ffffff;

  /* Brand */
  --merxi-azure: #145bff;
  --merxi-cobalt: #0a3fb8;
  --merxi-aqua: #11bed0;
  --merxi-gold: #d79b18;
  --merxi-gold-light: #fff2b1;
  --merxi-gold-deep: #b77908;
  --merxi-gold-text: #9a6200;
  --merxi-orange: #ff6a1a;
  --merxi-orange-light: #ffb11b;

  /* Content and state */
  --merxi-ink: #10233d;
  --merxi-muted: #516174;
  --merxi-line: #d9e0e6;
  --merxi-success: #007f67;
  --merxi-danger: #c83642;

  /* Gradients */
  --merxi-gradient-value: linear-gradient(105deg, #fff2b1 0%, #e3ae2d 52%, #b77908 100%);
  --merxi-gradient-signal: linear-gradient(105deg, #145bff 0%, #11bed0 100%);
  --merxi-gradient-event: linear-gradient(105deg, #ffb11b 0%, #ff6a1a 100%);
  --merxi-gradient-pearl: linear-gradient(105deg, #fcfaf4 0%, #f4eddf 100%);

  /* Typography */
  --merxi-font-display: 'Inter Tight', 'Arial Narrow', sans-serif;
  --merxi-font-text: 'Inter', 'Noto Sans SC', 'PingFang SC', sans-serif;
  --merxi-font-data: 'IBM Plex Sans Condensed', 'Arial Narrow', sans-serif;
  --merxi-weight-regular: 400;
  --merxi-weight-medium: 500;
  --merxi-weight-semibold: 600;
  --merxi-weight-bold: 700;

  --merxi-type-size-label: 12px;
  --merxi-type-size-meta: 13px;
  --merxi-type-size-small: 14px;
  --merxi-type-size-control: 15px;
  --merxi-type-size-body: 16px;
  --merxi-type-size-lead: 17px;
  --merxi-type-size-body-large: 18px;
  --merxi-type-size-title: 20px;
  --merxi-type-size-title-mobile: 18px;
  --merxi-type-size-data-small: 24px;
  --merxi-type-size-heading-3: 28px;
  --merxi-type-size-heading-3-mobile: 24px;
  --merxi-type-size-data-medium: 32px;
  --merxi-type-size-heading-1-mobile: 36px;
  --merxi-type-size-heading-2: 40px;
  --merxi-type-size-heading-2-mobile: 30px;
  --merxi-type-size-data-large: 48px;
  --merxi-type-size-display-mobile: 44px;
  --merxi-type-size-hero-mobile: 52px;
  --merxi-type-size-heading-1: 56px;
  --merxi-type-size-score: 64px;
  --merxi-type-size-display: 72px;
  --merxi-type-size-hero: 96px;

  --merxi-type-line-label: 16px;
  --merxi-type-line-small: 20px;
  --merxi-type-line-body: 24px;
  --merxi-type-line-lead: 28px;
  --merxi-type-line-title: 28px;
  --merxi-type-line-title-mobile: 24px;
  --merxi-type-line-data-small: 28px;
  --merxi-type-line-data-medium: 32px;
  --merxi-type-line-heading-3: 36px;
  --merxi-type-line-heading-3-mobile: 32px;
  --merxi-type-line-heading-1-mobile: 40px;
  --merxi-type-line-heading-2: 48px;
  --merxi-type-line-heading-2-mobile: 36px;
  --merxi-type-line-data-large: 48px;
  --merxi-type-line-display-mobile: 48px;
  --merxi-type-line-hero-mobile: 52px;
  --merxi-type-line-heading-1: 60px;
  --merxi-type-line-score: 64px;
  --merxi-type-line-display: 72px;
  --merxi-type-line-hero: 92px;

  --merxi-type-tracking-hero: -0.035em;
  --merxi-type-tracking-display: -0.03em;
  --merxi-type-tracking-heading-1: -0.025em;
  --merxi-type-tracking-heading-2: -0.02em;
  --merxi-type-tracking-heading-3: -0.015em;
  --merxi-type-tracking-title: -0.01em;
  --merxi-type-tracking-lead: -0.005em;
  --merxi-type-tracking-body: 0;
  --merxi-type-tracking-live: 0.04em;
  --merxi-type-tracking-label: 0.06em;
  --merxi-type-tracking-wordmark-compact: 0.12em;
  --merxi-type-tracking-wordmark: 0.18em;

  /* 4-point spacing scale */
  --merxi-space-1: 4px;
  --merxi-space-2: 8px;
  --merxi-space-3: 12px;
  --merxi-space-4: 16px;
  --merxi-space-6: 24px;
  --merxi-space-8: 32px;
  --merxi-space-12: 48px;
  --merxi-space-16: 64px;
  --merxi-space-24: 96px;
  --merxi-space-32: 128px;

  /* Shape and layout */
  --merxi-radius-sm: 6px;
  --merxi-radius-md: 10px;
  --merxi-radius-lg: 16px;
  --merxi-layout-content-max: 1280px;
  --merxi-layout-page-gutter-desktop: 80px;
  --merxi-layout-page-gutter-laptop: 48px;
  --merxi-layout-page-gutter-tablet: 32px;
  --merxi-layout-page-gutter-mobile: 20px;
  --merxi-layout-column-gap-desktop: 24px;
  --merxi-layout-column-gap-laptop: 24px;
  --merxi-layout-column-gap-tablet: 24px;
  --merxi-layout-column-gap-mobile: 16px;
  --merxi-layout-section-space-desktop: 128px;
  --merxi-layout-section-space-laptop: 96px;
  --merxi-layout-section-space-tablet: 96px;
  --merxi-layout-section-space-mobile: 72px;
  --merxi-layout-page-gutter: var(--merxi-layout-page-gutter-desktop);
  --merxi-layout-column-gap: var(--merxi-layout-column-gap-desktop);
  --merxi-layout-section-space: var(--merxi-layout-section-space-desktop);
  --merxi-layout-columns: 12;
}

.merxi-data {
  font-family: var(--merxi-font-data);
  font-variant-numeric: tabular-nums lining-nums slashed-zero;
  font-feature-settings: 'tnum' 1, 'lnum' 1, 'zero' 1;
}

.merxi-label {
  font-size: var(--merxi-type-size-label);
  font-weight: var(--merxi-weight-semibold);
  line-height: var(--merxi-type-line-label);
  letter-spacing: var(--merxi-type-tracking-label);
  text-transform: uppercase;
}

[lang^='zh'] {
  letter-spacing: 0;
}

@media (max-width: 1439px) {
  :root {
    --merxi-layout-page-gutter: var(--merxi-layout-page-gutter-laptop);
    --merxi-layout-column-gap: var(--merxi-layout-column-gap-laptop);
    --merxi-layout-section-space: var(--merxi-layout-section-space-laptop);
  }
}

@media (max-width: 1023px) {
  :root {
    --merxi-layout-page-gutter: var(--merxi-layout-page-gutter-tablet);
    --merxi-layout-column-gap: var(--merxi-layout-column-gap-tablet);
    --merxi-layout-section-space: var(--merxi-layout-section-space-tablet);
    --merxi-layout-columns: 8;
  }
}

@media (max-width: 767px) {
  :root {
    --merxi-layout-page-gutter: var(--merxi-layout-page-gutter-mobile);
    --merxi-layout-column-gap: var(--merxi-layout-column-gap-mobile);
    --merxi-layout-section-space: var(--merxi-layout-section-space-mobile);
    --merxi-layout-columns: 4;
  }
}