page,
.page {
  // 字体family token
  --td-font-family: PingFang SC, Microsoft YaHei, Arial Regular; // 字体-磅数-常规
  --td-font-family-medium: PingFang SC, Microsoft YaHei, Arial Medium; // 字体-磅数-粗体

  --td-font-size-link-small: 24rpx;
  --td-font-size-link-medium: 28rpx;
  --td-font-size-link-large: 32rpx;
  --td-font-size-mark-extraSmall: 20rpx;
  --td-font-size-mark-small: 24rpx;
  --td-font-size-mark-medium: 28rpx;
  --td-font-size-mark-large: 32rpx;
  --td-font-size-body-extraSmall: 20rpx;
  --td-font-size-body-small: 24rpx;
  --td-font-size-body-medium: 28rpx;
  --td-font-size-body-large: 32rpx;
  --td-font-size-title-small: 28rpx;
  --td-font-size-title-medium: 32rpx;
  --td-font-size-title-large: 36rpx;
  --td-font-size-title-extraLarge: 40rpx;
  --td-font-size-headline-small: 48rpx;
  --td-font-size-headline-medium: 56rpx;
  --td-font-size-headline-large: 72rpx;
  --td-font-size-display-medium: 96rpx;
  --td-font-size-display-large: 128rpx;

  // 字体行高 token
  --td-line-height-link-small: 40rpx;
  --td-line-height-link-medium: 44rpx;
  --td-line-height-link-large: 48rpx;
  --td-line-height-mark-extraSmall: 32rpx;
  --td-line-height-mark-small: 40rpx;
  --td-line-height-mark-medium: 44rpx;
  --td-line-height-mark-large: 48rpx;
  --td-line-height-body-extraSmall: 32rpx;
  --td-line-height-body-small: 40rpx;
  --td-line-height-body-medium: 44rpx;
  --td-line-height-body-large: 48rpx;
  --td-line-height-title-small: 44rpx;
  --td-line-height-title-medium: 48rpx;
  --td-line-height-title-large: 52rpx;
  --td-line-height-title-extraLarge: 56rpx;
  --td-line-height-headline-small: 64rpx;
  --td-line-height-headline-medium: 72rpx;
  --td-line-height-headline-large: 88rpx;
  --td-line-height-display-medium: 112rpx;
  --td-line-height-display-large: 144rpx;

  // font token
  --td-font-link-small: var(--td-font-size-link-small) / var(--td-line-height-link-small) var(--td-font-family);
  --td-font-link-medium: var(--td-font-size-link-medium) / var(--td-line-height-link-medium) var(--td-font-family);
  --td-font-link-large: var(--td-font-size-link-large) / var(--td-line-height-link-large) var(--td-font-family);
  --td-font-mark-extraSmall: 600 var(--td-font-size-mark-extraSmall) / var(--td-line-height-mark-extraSmall)
    var(--td-font-family);
  --td-font-mark-small: 600 var(--td-font-size-mark-small) / var(--td-line-height-mark-small) var(--td-font-family);
  --td-font-mark-medium: 600 var(--td-font-size-mark-medium) / var(--td-line-height-mark-medium) var(--td-font-family);
  --td-font-mark-large: 600 var(--td-font-size-mark-large) / var(--td-line-height-mark-large) var(--td-font-family);
  --td-font-body-extraSmall: var(--td-font-size-body-extraSmall) / var(--td-line-height-body-extraSmall)
    var(--td-font-family);
  --td-font-body-small: var(--td-font-size-body-small) / var(--td-line-height-body-small) var(--td-font-family);
  --td-font-body-medium: var(--td-font-size-body-medium) / var(--td-line-height-body-medium) var(--td-font-family);
  --td-font-body-large: var(--td-font-size-body-large) / var(--td-line-height-body-large) var(--td-font-family);
  --td-font-title-small: 600 var(--td-font-size-title-small) / var(--td-line-height-title-small) var(--td-font-family);
  --td-font-title-medium: 600 var(--td-font-size-title-medium) / var(--td-line-height-title-medium)
    var(--td-font-family);
  --td-font-title-large: 600 var(--td-font-size-title-large) / var(--td-line-height-title-large) var(--td-font-family);
  --td-font-title-extraLarge: 600 var(--td-font-size-title-extraLarge) / var(--td-line-height-title-extraLarge)
    var(--td-font-family);
  --td-font-headline-small: 600 var(--td-font-size-headline-small) / var(--td-line-height-headline-small)
    var(--td-font-family);
  --td-font-headline-medium: 600 var(--td-font-size-headline-medium) / var(--td-line-height-headline-medium)
    var(--td-font-family);
  --td-font-headline-large: 600 var(--td-font-size-headline-large) / var(--td-line-height-headline-large)
    var(--td-font-family);
  --td-font-display-medium: 600 var(--td-font-size-display-medium) / var(--td-line-height-display-medium)
    var(--td-font-family);
  --td-font-display-large: 600 var(--td-font-size-display-large) / var(--td-line-height-display-large)
    var(--td-font-family);

  // 字体大小 token
  --td-font-size: 20rpx;
  --td-font-size-xs: var(--td-font-size-body-extraSmall);
  --td-font-size-s: var(--td-font-size-body-small);
  --td-font-size-base: var(--td-font-size-title-small);
  --td-font-size-m: var(--td-font-size-title-medium);
  --td-font-size-l: var(--td-font-size-title-large);
  --td-font-size-xl: var(--td-font-size-title-extraLarge);
  --td-font-size-xxl: var(--td-font-size-headline-large);
}
