/* hippo font */

/* 用法：
1. 项目中加载 https://lf-cdn-tos.bytescm.com/obj/static/edu/hippo/font/font-v2/hippo-font-v2.css 文件
2. 业务代码直接声明 font-family 即可
 */

/*
 UI规范：
 https://www.figma.com/file/TZIzXv9tioI9bfqZvGZynG/%E6%B2%B3%E9%A9%AC%E7%88%B1%E5%AD%A63.0%E8%AE%BE%E8%AE%A1%E7%B3%BB%E7%BB%9F?node-id=11%3A2796
*/

html,
body {
  /* 默认西文字体为Byte Sans, 默认中文字体为华文金刚黑，非衬线字体兜底 */
  font-family: 'Byte Sans', 'DFP King Gothic GB', sans-serif;
}

@font-face {
  font-family: 'DFP King Gothic GB';
  font-display: block;
  font-weight: 400;
  src: local('DFP King Gothic GB'), local('DFP-King-Gothic-GB'), url('DFP-King-Gothic-GB-Regular.woff2') format('woff2'),
    url('DFP-King-Gothic-GB-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'DFP King Gothic GB';
  font-display: block;
  font-weight: 500;
  src: local('DFP King Gothic GB Medium'), local('DFP-King-Gothic-GB-Medium'),
    url('DFP-King-Gothic-GB-Medium.woff2') format('woff2'), url('DFP-King-Gothic-GB-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'DFP King Gothic GB';
  font-display: block;
  font-weight: 600;
  src: local('DFP King Gothic GB Semibold'), local('DFP-King-Gothic-GB-Semibold'),
    url('DFP-King-Gothic-GB-Semibold.woff2') format('woff2'), url('DFP-King-Gothic-GB-Semibold.ttf') format('truetype');
}

@font-face {
  font-family: 'DFP King Gothic GB Medium';
  font-display: block;
  font-weight: 400;
  src: local('DFP King Gothic GB Medium'), local('DFP-King-Gothic-GB-Medium'),
    url('DFP-King-Gothic-GB-Medium.woff2') format('woff2'), url('DFP-King-Gothic-GB-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'DFP King Gothic GB Semibold';
  font-display: block;
  font-weight: 400;
  src: local('DFP King Gothic GB Semibold'), local('DFP-King-Gothic-GB-Semibold'),
    url('DFP-King-Gothic-GB-Semibold.woff2') format('woff2'), url('DFP-King-Gothic-GB-Semibold.ttf') format('truetype');
}

/*
NOTE:
Byte Sans字体已裁剪，仅包含半角英文/数字/标点字符
*/
@font-face {
  font-family: 'Byte Sans';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: local('Byte Sans Regular'), local('Byte-Sans-Regular'), url('ByteSans-Regular.woff2') format('woff2'),
    url('ByteSans-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Byte Sans';
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: local('Byte Sans Medium'), local('Byte-Sans-Medium'), url('ByteSans-Medium.woff2') format('woff2'),
    url('ByteSans-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'Byte Sans';
  font-style: normal;
  font-weight: 700;
  font-display: block;
  src: local('Byte Sans Bold'), local('Byte-Sans-Bold'), url('ByteSans-Bold.woff2') format('woff2'),
    url('ByteSans-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Byte Sans Medium';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: local('Byte Sans Medium'), local('Byte-Sans-Medium'), url('ByteSans-Medium.woff2') format('woff2'),
    url('ByteSans-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'Byte Sans Bold';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: local('Byte Sans Bold'), local('Byte-Sans-Bold'), url('ByteSans-Bold.woff2') format('woff2'),
    url('ByteSans-Bold.ttf') format('truetype');
}
