@charset "UTF-8";

@font-face {
  font-family: "HYQiHei-EZS";
  src: url("./font/HYQiHei-50S_vivo-Design-02.ttf?v=1") format("truetype");
  font-style: normal;
  font-weight: 400;
}

/* @font-face {
  font-family: "vivo Sans Global";
  src: url("./font/iQOOtype-Medium.ttf?v=1") format("truetype");
  font-style: normal;
  font-weight: 500;
} */

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-Thin.ttf') format('truetype');
  font-style: normal;
  font-weight: 100;
}

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-ExtraLight.ttf?v=1') format('truetype');
  font-style: normal;
  font-weight: 200;
}

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-Regular.ttf?v=1') format('truetype');
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-Medium.ttf?v=1') format('truetype');
  font-style: normal;
  font-weight: 500;
}

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-DemiBold.ttf?v=1') format('truetype');
  font-style: normal;
  font-weight: 600;
}

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-Bold.ttf?v=1') format('truetype');
  font-style: normal;
  font-weight: 700;
}

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-ExtraBold.ttf?v=1') format('truetype');
  font-style: normal;
  font-weight: 750;
}

@font-face {
  font-family: "vivo Sans Global";
  src: url('./font/vivoSansGlobal2-ExtraBold.ttf?v=1') format('truetype');
  font-style: normal;
  font-weight: 800;
}

/* 默认值 */
@media screen {
  #cbcn-dom-container * {
    box-sizing: border-box;
  }

  #cbcn-dom-container p,
  #cbcn-dom-container h1,
  #cbcn-dom-container h2,
  #cbcn-dom-container h3,
  #cbcn-dom-container h4,
  #cbcn-dom-container h5,
  #cbcn-dom-container h6 {
    margin: 0;
    /* 加了之后没有办法和设计稿同步 */
    /* text-wrap: balance; */
  }

  #cbcn-dom-container video:focus {
    outline: none;
  }

  .J_replace_content {
    width: 100%;
    max-width: 100%;
    min-height: 100vh;
  }

  .J_replace_content .loadingWt {
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    background-color: #fff;
  }

  #cbcn-dom-container {
    font-family: "IQOOTYPE", "HYQiHei-EZS";
    font-size: 20px;
    background: transparent;
    color: black;
    /* display: none; */
  }

  #cbcn-dom-container sup {
    font-size: 0.5em;
    line-height: 0;
    vertical-align: super;
    position: relative;
    top: -0.25em;
  }

  #cbcn-dom-container video.cover,
  #cbcn-dom-container img.cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  #cbcn-dom-container video.contain,
  #cbcn-dom-container img.contain {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
  }
}

/* 常用 */
@media screen {

  /* 玻璃效果 */
  .cbcn-glass {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

  .cbcn-glass:focus {
    outline: none;
  }

  .cbcn-glass::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;

    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: light-dark(hsl(0 0% 100% / 0.1), hsl(0 0% 0% / 0.1));
    -webkit-backdrop-filter: url(#cbcn-glass-distortion) saturate(1);
    backdrop-filter: url(#cbcn-glass-distortion) saturate(1);
    box-shadow: 0 0 2px 1px light-dark(color-mix(in oklch, black, transparent 85%), color-mix(in oklch, white, transparent 65%)) inset, 0 0 10px 4px light-dark(color-mix(in oklch, black, transparent 90%), color-mix(in oklch, white, transparent 85%)) inset, 0 4px 16px #11111a0d, 0 8px 24px #11111a0d, 0 16px 56px #11111a0d, 0 4px 16px #11111a0d inset, 0 8px 24px #11111a0d inset, 0 16px 56px #11111a0d inset;
  }

  .cbcn-glass-svg {
    pointer-events: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    z-index: -1
  }

  .cbcn-glass2 {
    position: relative;
    isolation: isolate;
    box-shadow: 0px 6px 24px rgba(0, 0, 0, 0.2);
  }

  .cbcn-glass2:focus {
    outline: none;
  }

  .cbcn-glass2::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    /* box-shadow: inset 0 0 15px -5px #000000; */
    background-color: rgba(255, 255, 255, 0.3);
  }

  .cbcn-glass2::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    filter: url(#cbcn-glass2-distortion);
    -webkit-filter: url(#cbcn-glass2-distortion);
  }
}


/* 章节screen */
@media screen {
  .cbcn-section {
    position: relative;
    width: 100%;
    background-color: var(--semantic-background-tertiary, #fff);
    overflow: hidden;
  }

  .cbcn-section.bk {
    background-color: var(--semantic-background-quinary, #000);
  }
}

/* 字体  font-weight 根据设计稿调整*/
@media screen {
  #cbcn-dom-container .cbcn-h0 {
    font-family: "vivo Sans Global";
    /* head 0 章节标题 */
    font-size: var(--semantic-font-size-head-0, 4.85em);
    font-style: normal;
    font-weight: 500;
    /* 119.588% */
  }

  #cbcn-dom-container .cbcn-h1 {
    font-family: "vivo Sans Global";
    /* head 1 一级标题 */
    font-size: var(--semantic-font-size-head-1, 3.4em);
    font-style: normal;
    font-weight: 500;
    /* 117.647% */
    line-height: 117.647%;
  }

  #cbcn-dom-container .cbcn-h2 {
    font-family: "vivo Sans Global";
    /* head 2 二级标题 */
    font-size: var(--semantic-font-size-head-2, 2.9em);
    font-style: normal;
    font-weight: 500;
    /* 118.966% */
    line-height: 118.966%;
  }

  #cbcn-dom-container .cbcn-h3 {
    font-family: "vivo Sans Global";
    /* head 3 三级标题 */
    font-size: var(--semantic-font-size-head-3, 2.4em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-head-3, 3.85em);
    /* 118.75% */
  }

  #cbcn-dom-container .cbcn-sh {
    font-family: "vivo Sans Global";
    /* subhead 副标题 */
    font-size: var(--semantic-font-size-subhead, 1.4em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-subhead, 1.65em);
    /* 117.857% */
  }

  /* 数据列项 */
  #cbcn-dom-container .cbcn-hg1 {
    font-family: "vivo Sans Global";
    /* highlight 1 一级高亮 */
    font-size: var(--semantic-font-size-highlight-1, 3.4em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-highlight-1, 4.6em);
    /* 135.294% */
  }

  #cbcn-dom-container .cbcn-hg2 {
    font-family: "vivo Sans Global";
    /* highlight 2 二级高亮 */
    font-size: var(--semantic-font-size-highlight-2, 2.85em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-highlight-2, 3.7em);
    /* 129.825% */
  }

  #cbcn-dom-container .cbcn-hg3 {
    font-family: "vivo Sans Global";
    /* highlight 3 三级高亮 */
    font-size: var(--semantic-font-size-highlight-3, 2.1em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-highlight-3, 2.7em);
    /* 128.571% */
  }

  #cbcn-dom-container .cbcn-hg4 {
    font-family: "vivo Sans Global";
    /* highlight 4 四级高亮 */
    font-size: var(--semantic-font-size-highlight-4, 1.8em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-highlight-4, 2.3em);
    /* 127.778% */
  }

  #cbcn-dom-container .cbcn-hg5 {
    font-family: "vivo Sans Global";
    /* highlight 5 五级高亮 */
    font-size: var(--semantic-font-size-highlight-5, 1.4em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-highlight-5, 1.8em);
    /* 128.571% */
  }

  #cbcn-dom-container .cbcn-hg6 {
    font-family: "vivo Sans Global";
    /* highlight 6 六级高亮 */
    font-size: var(--semantic-font-size-highlight-6, 1.25em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-highlight-6, 1.6em);
    /* 128% */
  }

  #cbcn-dom-container .cbcn-b1 {
    font-family: "vivo Sans Global";
    /* body 1 一级正文 */
    font-size: var(--semantic-font-size-body-1, 1.05em);
    font-style: normal;
    font-weight: 450;
    line-height: var(--semantic-font-line-height-body-1, 1.55em);
    /* 147.619% */
  }


  #cbcn-dom-container .cbcn-b2 {
    font-family: "vivo Sans Global";
    /* body 2 二级正文 */
    font-size: var(--semantic-font-size-body-2, 0.95em);
    font-style: normal;
    font-weight: 400;
    line-height: var(--semantic-font-line-height-body-2, 1.4em);
    /* 147.368% */
  }

  #cbcn-dom-container .cbcn-b3 {
    font-family: "vivo Sans Global";
    /* body 3 三级正文 */
    font-size: var(--semantic-font-size-body-3, 0.85em);
    font-style: normal;
    font-weight: 400;
    line-height: var(--semantic-font-line-height-body-3, 1.25em);
    /* 147.059% */
  }

  #cbcn-dom-container .cbcn-b4 {
    font-family: "vivo Sans Global";
    /* body 4 四级正文 */
    font-size: var(--semantic-font-size-body-4, 0.75em);
    font-style: normal;
    font-weight: 400;
    line-height: var(--semantic-font-line-height-body-4, 1.1em);
    /* 146.667% */
  }

  #cbcn-dom-container .cbcn-b5 {
    font-family: "vivo Sans Global";
    /* body 5 五级正文 */
    font-size: var(--semantic-font-size-body-5, 0.6em);
    font-style: normal;
    font-weight: 400;
    line-height: var(--semantic-font-line-height-body-5, 0.9em);
    /* 150% */
  }

  #cbcn-dom-container .cbcn-fn {
    font-family: "vivo Sans Global";
    /* footnote  注释 */
    font-size: var(--semantic-font-size-footnote-1, 0.6em);
    font-style: normal;
    font-weight: 500;
    line-height: var(--semantic-font-line-height-footnote-0, 150%);
    /* 153.846% */
  }

  #cbcn-dom-container .cbcn-fn1 {
    font-family: "vivo Sans Global";
    /* footnote 1 一级注释 */
    font-size: var(--semantic-font-size-footnote-1, 0.65em);
    font-style: normal;
    font-weight: 400;
    line-height: var(--semantic-font-line-height-footnote-1, 1em);
    /* 153.846% */
  }

  #cbcn-dom-container .cbcn-fn2 {
    font-family: "vivo Sans Global";
    /* footnote 2 二级注释 */
    font-size: var(--semantic-font-size-footnote-2, 0.55em);
    font-style: normal;
    font-weight: 400;
    line-height: var(--semantic-font-line-height-footnote-2, 0.85em);
    /* 154.545% */
  }
}


/* 文字样式 */
@media screen {
  .cbcn-styleColor1 {
    width: fit-content;
   background:  linear-gradient(180deg, #FFF 0%, #FEE2B2 22.6%, #6D614C 100%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
  }

  .cbcn-styleColor1 sup {
    position: static !important;
  }

  #cbcn-dom-container .bk,
  #cbcn-dom-container .wt {
    color: var(--text-93a);
  }

  #cbcn-dom-container .bk .grey,
  #cbcn-dom-container .wt .grey {
    color: var(--text-69a);
  }

  #cbcn-dom-container .bk .grey2,
  #cbcn-dom-container .wt .grey2 {
    color: var(--text-32a);
  }
}

/* 文本间距 */
@media screen {

  /* 标题 */
  .cbcn-title {
    display: flex;
    flex-direction: column;
    gap: var(--title-gap-2, 1.8em);
    /* pc为36px */
  }

  .cbcn-title.big {
    gap: var(--title-gap-1, 2.4em);
    /* pc为48px */
  }

  .cbcn-title.m {
    gap: var(--title-gap-4, 1.2em);
    /* pc为24px */
  }

  .cbcn-title.sm {
    gap: var(--title-gap-7, 0.4em);
    /* pc为8px */
  }
}