@charset "utf-8";
/* ==========================================================================
   稳啦官网 · B 赛场直播风 Courtside Broadcast · style.css
   --------------------------------------------------------------------------
   全站共用（首页 /index.html，之后的 /products/wenla/、/products/pro/）。页面专属样式写在各页自己的 <style> 里。
   组件用法、HTML 结构、禁忌见同目录 STYLE.md；全部组件的真实样板见 _kit.html。

   结构
     0. 字体
     1. Token（颜色 / 字体 / 字号三档 / 间距 / 圆角 / 阴影 / 缓动 / 图标）
     2. 基础与排版
     3. 版式：wrap、section、section 头
     4. 原子：按钮、链接、眉题、徽标、标签、LIVE 点、App 图标、复制按钮、勾选列表
     5. 全局导航（桌面 + 手机折叠菜单）、登录态
     6. 产品本地导航（吸顶）
     7. Hero（视频背景版 / 产品图版）、直播计时条、巨字背景
     8. 比分条（章节分隔 / 比赛记分牌）
     9. 双产品 tile
    10. 场景：吸顶大数字 + 叠卡、场景卡、图文交错、时间戳、做法列表、结果句
    11. 设备框：手机框、浏览器框、笔记本框、直播画面框、模板切换
    12. 数据：数据浮签、数据点横排、规格表、规则列表
    13. 横滑亮点卡 + 进度点
    14. 会员价格
    15. 用户声音
    16. FAQ 手风琴
    17. 下载区
    18. 申请开通表单
    19. 页脚
    20. 页内提示条（覆盖 WL.notify）
    21. 入场动效、减少动态
   断点：≥1069 桌面 / ≤1068 平板 / ≤734 手机（另：全局导航 ≤900 折叠成菜单）
   ========================================================================== */

/* 0. 字体 ----------------------------------------------------------------- */
/* 优设标题黑只有一个字形重量。声明成 100–900 的范围，浏览器就不会再合成假粗体；
   万一字体没加载到，回退的系统黑体会按 700 显示，标题不至于发虚。 */
/* 主字体是按 B 风格三页 + site.js + demo.js 实际用到的字生成的子集（tools/subset-font.sh，约 77 KB）。
   改了页面文案记得重跑子集；万一漏了字，先落到下面的 GB1 全量字体（只有真缺字时浏览器才会去下载），再落到系统黑体。 */
@font-face {
  font-family: "YSBTH";
  src: url("../fonts/ysbth-b.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
/* 帮助中心标题用到、但上面主子集里没有的字（33 个，约 4 KB）。同名字体只按 unicode-range 补字，主子集不用重做。
   帮助中心标题改了文案，用 pyftsubset 从 ysbth-gb1.woff2 重新切这一份，并同步改下面的 unicode-range。
   「馨」两份字体里都没有，落到系统黑体。 */
@font-face {
  font-family: "YSBTH";
  src: url("../fonts/ysbth-ext.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+4E45, U+4E8C, U+4F73, U+4FEE, U+5145, U+521B, U+52A9, U+56FA, U+5740, U+5982, U+5EFA, U+5F88, U+62E9, U+67D0, U+67E5, U+68C0, U+6DFB, U+7840, U+7B54, U+7ECD, U+7EF4, U+8017, U+804C, U+8350, U+89C4, U+8BEF, U+8F93, U+9002, U+95E8, U+987B, U+989D, U+9EA6, U+FF5C;
}
@font-face {
  font-family: "YSBTH GB1";
  src: url("../fonts/ysbth-gb1.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  /* 只在主子集、补字子集都没有的字上才用全量字体：把补字子集的 33 个字和「馨」（全量字体里也没有）排除掉。
     不排除的话，浏览器在补字子集还没下完时会先去拉这份 335 KB 的全量字体。补字子集重切后这里要同步。 */
  unicode-range: U+0000-4E44, U+4E46-4E8B, U+4E8D-4F72, U+4F74-4FED, U+4FEF-5144, U+5146-521A, U+521C-52A8, U+52AA-56F9, U+56FB-573F, U+5741-5981, U+5983-5EF9, U+5EFB-5F87, U+5F89-62E8, U+62EA-67CF, U+67D1-67E4, U+67E6-68BF, U+68C1-6DFA, U+6DFC-783F, U+7841-7B53, U+7B55-7ECC, U+7ECE-7EF3, U+7EF5-8016, U+8018-804B, U+804D-834F, U+8351-89C3, U+89C5-8BEE, U+8BF0-8F92, U+8F94-9001, U+9003-95E7, U+95E9-987A, U+987C-989C, U+989E-99A7, U+99A9-9EA5, U+9EA7-FF5B, U+FF5D-10FFFF;
}

/* Oswald（数字、英文）：自托管 Google Fonts 的 latin 子集（SIL OFL），国内访问 fonts.googleapis.com 不稳定 */
@font-face {
  font-family: "Oswald";
  src: url("../fonts/oswald-latin.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* 1. Token ---------------------------------------------------------------- */
:root {
  color-scheme: dark;

  /* 颜色：全站深色，不随观看者的深浅色切换 */
  --ink: #0F0F1B;            /* 主底（App ThemeV2 backgroundDeep） */
  --ink-2: #171725;          /* 主底上抬起一层：面板、浮签 */
  --ink-3: #20202F;          /* 再抬一层：比分条名字格、输入框悬停 */
  --surface: #181818;        /* 交替章节底（ThemeV2 background） */
  --card: #2A2A2A;           /* surface 上的卡片（ThemeV2 card） */
  --court: #10241A;          /* 场地墨绿：赛场章节、叠卡、赛事版 tile */
  --court-2: #183326;        /* court 上抬起一层 */
  --chalk: #F5F5F0;          /* 粉笔白：主文字 */
  --chalk-2: rgba(245, 245, 240, .66);  /* 次级文字，任意底色上 ≥ 6:1 */
  --chalk-3: rgba(245, 245, 240, .56);  /* 三级文字 / 小字，任意底色上 ≥ 5:1 */
  --line: rgba(245, 245, 240, .12);     /* 发丝线 */
  --line-2: rgba(245, 245, 240, .24);   /* 次强线：描边按钮、输入框 */
  --line-chalk: rgba(245, 245, 240, .78); /* 球场白线：分隔线、中点标记 */
  --brand: #EAEE8B;          /* 品牌主色：CTA 实底、关键数字、高光词 */
  --brand-hover: #F3F5B8;
  --brand-ink: #0F0F1B;      /* 品牌色上的字 15.48:1 */
  --brand-faint: rgba(234, 238, 139, .12);
  --live: #DDFF4F;           /* 只给「正在发生」：LIVE 点、当前比分。一屏最多一处 */
  --pink: #EBBAFF;           /* 只做数据分类 */
  --purple: #BCAAFF;         /* 只做数据分类 */
  --scrim: rgba(15, 15, 27, .9);

  /* 字体 */
  --font-zh: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --font-display: "YSBTH", "YSBTH GB1", "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --font-num: "Oswald", "DIN Alternate", "DIN Condensed", "Roboto Condensed", "Arial Narrow", -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;

  /* 字号（桌面 ≥1069；平板、手机在下面两个 @media 里改写） */
  --fs-hero: 96px;   --lh-hero: 1.06;
  --fs-h1: 64px;     --lh-h1: 1.1;
  --fs-h2: 44px;     --lh-h2: 1.16;
  --fs-h3: 28px;     --lh-h3: 1.28;
  --fs-lead: 21px;   --lh-lead: 1.62;
  --fs-body: 17px;   --lh-body: 1.75;
  --fs-small: 14px;  --lh-small: 1.6;
  --fs-fine: 12px;
  --fs-eyebrow: 14px;
  --fs-step: 280px;    /* 吸顶大数字 */
  --fs-stat: 112px;    /* 数据点大数字 */
  --fs-price: 64px;    /* 价格 */
  --fs-tag: 32px;      /* 数据浮签数字 */
  --fs-bigtype: 360px; /* 巨字背景 */

  /* 间距 */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;
  --sec-y: 160px;           /* 章节上下留白 */
  --head-gap: 96px;         /* 章节头到内容 */
  --gutter: 48px;           /* 版心左右留白 */
  --wrap: 1280px;           /* 版心最大宽 */
  --nav-h: 68px;            /* 悬浮导航条高 */
  --nav-top: 16px;          /* 悬浮导航条距顶 */
  --nav-inset: 16px;        /* 悬浮导航条最小左右边距 */
  --sticky-top: 104px;      /* 吸顶元素（大数字、叠卡、FAQ 标题）距顶 */

  /* 圆角 */
  --r-xs: 6px; --r-sm: 12px; --r-md: 20px; --r-lg: 28px; --r-xl: 40px;
  --r-nav: 22px; --r-pill: 999px;

  /* 阴影：只有暗色投影，没有任何彩色发光 */
  --shadow-float: 0 30px 60px -24px rgba(0, 0, 0, .7);
  --shadow-pop: 0 16px 40px -8px rgba(0, 0, 0, .6);

  /* 缓动：苹果系，不用回弹 */
  --ease: cubic-bezier(.28, .11, .32, 1);
  --ease-out: cubic-bezier(0, 0, .5, 1);
  --ease-inout: cubic-bezier(.65, 0, .35, 1);
  --dur-1: .2s; --dur-2: .4s; --dur-3: .7s; --dur-4: .9s;

  /* 图标（CSS mask，颜色跟随 currentColor） */
  --i-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.8 12.7 8l-4.2 4.2' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --i-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.4l3.2 3.1L13 4.6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --i-play: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5 3.2v9.6L12.6 8z'/%3E%3C/svg%3E");
  --i-pause: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 3h2.4v10H4.5zM9.1 3h2.4v10H9.1z'/%3E%3C/svg%3E");
  --i-apple: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M11.2 8.5c0-1.6 1.3-2.4 1.4-2.4-.8-1.1-2-1.3-2.4-1.3-1-.1-2 .6-2.5.6s-1.3-.6-2.2-.6C4.4 4.8 3.3 5.5 2.7 6.6c-1.2 2.1-.3 5.2.9 6.9.6.8 1.2 1.7 2.1 1.7.8 0 1.2-.5 2.2-.5s1.3.5 2.2.5 1.5-.8 2-1.7c.6-.9.9-1.8.9-1.9 0 0-1.8-.7-1.8-2.6zM9.6 3.6c.5-.6.8-1.3.7-2.1-.7 0-1.5.5-2 1-.4.5-.8 1.3-.7 2 .8.1 1.5-.4 2-.9z'/%3E%3C/svg%3E");
  --i-android: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M11.3 6.1l1-1.8a.3.3 0 0 0-.5-.3l-1 1.8A6.3 6.3 0 0 0 8 5.2c-1 0-2 .2-2.8.6l-1-1.8a.3.3 0 0 0-.5.3l1 1.8A5.4 5.4 0 0 0 2 10.4h12a5.4 5.4 0 0 0-2.7-4.3zM5.4 8.7a.6.6 0 1 1 0-1.3.6.6 0 0 1 0 1.3zm5.2 0a.6.6 0 1 1 0-1.3.6.6 0 0 1 0 1.3z'/%3E%3C/svg%3E");
}

@media (max-width: 1068px) {
  :root {
    --fs-hero: 72px;  --fs-h1: 52px; --fs-h2: 36px; --fs-h3: 24px; --fs-lead: 19px;
    --fs-step: 200px; --fs-stat: 88px; --fs-price: 56px; --fs-tag: 28px; --fs-bigtype: 260px;
    --sec-y: 120px; --head-gap: 72px; --gutter: 32px; --r-xl: 32px;
  }
}
@media (max-width: 734px) {
  :root {
    --fs-hero: 44px;  --lh-hero: 1.1; --fs-h1: 36px; --lh-h1: 1.16; --fs-h2: 28px; --lh-h2: 1.22;
    --fs-h3: 21px;    --fs-lead: 17px; --fs-body: 16px; --lh-body: 1.72;
    --fs-step: 120px; --fs-stat: 64px; --fs-price: 44px; --fs-tag: 24px; --fs-bigtype: 160px;
    --sec-y: 88px; --head-gap: 48px; --gutter: 20px;
    --nav-h: 56px; --nav-top: 12px; --r-nav: 18px; --sticky-top: 84px;
    --r-lg: 22px; --r-xl: 24px;
  }
}

/* 2. 基础与排版 ------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html {
  background: var(--ink);
  color: var(--chalk);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: var(--sticky-top);
}
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  min-height: 100vh;
  background: var(--ink);
  color: var(--chalk);
  font: 400 var(--fs-body)/var(--lh-body) var(--font-zh);
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  -webkit-tap-highlight-color: transparent;
}
img, video, svg, picture { display: block; max-width: 100%; }
img, video { height: auto; }
h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
::selection { background: var(--brand); color: var(--brand-ink); }
[hidden] { display: none !important; }

/* 标题：中文用优设标题黑，数字和拉丁字母同一字族 */
.cb-display, .cb-h-hero, .cb-h1, .cb-h2, .cb-h3 {
  font-family: var(--font-display);
  font-weight: 700;
  font-synthesis: none;
  letter-spacing: 0;
  word-spacing: -.12em;       /* 优设标题黑的空格偏宽，中英文之间收一点 */
  color: var(--chalk);
  text-wrap: balance;         /* 万一要折行，也不留单字孤行 */
}
.cb-h-hero { font-size: var(--fs-hero); line-height: var(--lh-hero); }
.cb-h1 { font-size: var(--fs-h1); line-height: var(--lh-h1); }
.cb-h2 { font-size: var(--fs-h2); line-height: var(--lh-h2); }
.cb-h3 { font-size: var(--fs-h3); line-height: var(--lh-h3); }

.cb-lead { font-size: var(--fs-lead); line-height: var(--lh-lead); color: var(--chalk-2); max-width: 34em; text-wrap: pretty; }
.cb-lead strong, .cb-prose strong { color: var(--chalk); font-weight: 600; }
.cb-prose { color: var(--chalk-2); max-width: 36em; text-wrap: pretty; }
.cb-prose p + p { margin-top: 1em; }
.cb-small { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--chalk-2); }
.cb-fine { font-size: var(--fs-fine); line-height: 1.7; color: var(--chalk-3); }
.cb-fine a, .cb-small a { color: var(--chalk); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.cb-fine a:hover, .cb-small a:hover { text-decoration-color: var(--brand); }
.cb-accent { color: var(--brand); }
.cb-num { font-family: var(--font-num); font-variant-numeric: tabular-nums; letter-spacing: 0; }
.cb-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* 3. 版式 ------------------------------------------------------------------ */
.cb-wrap {
  width: 100%;
  max-width: calc(var(--wrap) + var(--gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.cb-sec { position: relative; padding-block: var(--sec-y); background: var(--ink); overflow-x: clip; }
.cb-sec--ink { background: var(--ink); }
.cb-sec--surface { background: var(--surface); }
.cb-sec--court { background: var(--court); }
/* 页内锚点「一屏装下」（如 #download）：点过去要看到整块内容，尤其是底下的按钮。
   锚在章节上会先让出 --sec-y 的留白，矮屏里按钮出屏。改成在内容块里放一个空的 .cb-anchor 当落点：
   底边贴内容块底边，高度 = 吸顶导航以下的一屏（底部再留 --s-5），但不超过内容块本身。
   屏够高 → 落点是内容块顶，标题贴着导航下面；屏不够高 → 内容块底边贴屏幕底，标题上半截让位给按钮。 */
.cb-anchor-host { position: relative; }
.cb-anchor {
  position: absolute; left: 0; bottom: 0; width: 1px; max-height: 100%; pointer-events: none;
  height: calc(100vh - var(--sticky-top) - var(--s-5));
  height: calc(100svh - var(--sticky-top) - var(--s-5));
}
.cb-sec--tight { padding-block: calc(var(--sec-y) * .6); }
.cb-sec--flush-top { padding-top: 0; }

/* 章节头：永远左对齐 */
.cb-head { display: grid; gap: var(--s-5); max-width: 880px; margin-bottom: var(--head-gap); }
.cb-head > .cb-eyebrow { margin-bottom: 0; }
.cb-head--split { max-width: none; grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: var(--s-7); }
.cb-head--split > :not(.cb-head__aside) { grid-column: 1; }
.cb-head__aside { grid-column: 2; grid-row: 1 / span 3; align-self: end; display: flex; gap: var(--s-3); }
@media (max-width: 734px) {
  .cb-head--split { grid-template-columns: minmax(0, 1fr); }
  .cb-head__aside { grid-column: 1; grid-row: auto; }
}

/* 球场白线分隔：一条底线 + 中点标记 */
.cb-baseline { position: relative; height: 1px; background: var(--line-2); border: 0; margin: 0; }
.cb-baseline::after { content: ""; position: absolute; left: 50%; top: -11px; width: 1px; height: 12px; background: var(--line-chalk); }

/* 4. 原子 ------------------------------------------------------------------ */
/* 按钮 */
.cb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3) var(--s-4); }
.cb-btn {
  --h: 48px;
  position: relative;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: var(--h); padding: 0 24px;
  border: 0; border-radius: var(--r-pill);
  background: transparent; color: var(--chalk);
  font: 600 16px/1 var(--font-zh);
  white-space: nowrap; text-decoration: none; cursor: pointer;
  transition: background-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out), box-shadow var(--dur-1) var(--ease-out), transform var(--dur-1) var(--ease-out);
}
.cb-btn:active { transform: scale(.97); }
.cb-btn--brand { background: var(--brand); color: var(--brand-ink); }
.cb-btn--brand:hover { background: var(--brand-hover); }
.cb-btn--ghost { box-shadow: inset 0 0 0 1px var(--line-2); }
.cb-btn--ghost:hover { box-shadow: inset 0 0 0 1px var(--chalk); }
.cb-btn--chalk { background: var(--chalk); color: var(--ink); }
.cb-btn--chalk:hover { background: #fff; }
.cb-btn--sm { --h: 36px; padding: 0 16px; font-size: 14px; }
.cb-btn--lg { --h: 56px; padding: 0 30px; font-size: 17px; }
.cb-btn--block { width: 100%; }
.cb-btn--arrow::after, .cb-link::after {
  content: ""; width: 14px; height: 14px; flex: none; background: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat; mask: var(--i-arrow) center / contain no-repeat;
  transition: transform var(--dur-2) var(--ease);
}
.cb-btn--arrow:hover::after, .cb-link:hover::after { transform: translateX(3px); }
.cb-btn__icon { width: 18px; height: 18px; flex: none; background: currentColor; -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat; }
.cb-btn__icon--apple { -webkit-mask-image: var(--i-apple); mask-image: var(--i-apple); margin-top: -2px; }
.cb-btn__icon--android { -webkit-mask-image: var(--i-android); mask-image: var(--i-android); }
.cb-btn.is-disabled, .cb-btn[aria-disabled="true"] { opacity: .55; cursor: default; pointer-events: none; }
@media (max-width: 734px) { .cb-btn { --h: 46px; padding: 0 20px; } .cb-btn--sm { --h: 34px; padding: 0 14px; } }

/* 文字链接（带箭头） */
.cb-link {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--chalk); font-weight: 600; font-size: 16px; line-height: 1.4;
  transition: color var(--dur-1) var(--ease-out);
}
.cb-link:hover { color: var(--brand); }

/* 眉题：左侧一根品牌色竖条，取自记分牌的边条 */
.cb-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  margin-bottom: var(--s-5);
  font: 500 var(--fs-eyebrow)/1.3 var(--font-num);
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--chalk-2);
}
.cb-eyebrow::before { content: ""; width: 3px; height: 1.1em; flex: none; background: var(--brand); }
.cb-eyebrow--plain::before { display: none; }
.cb-eyebrow--case { text-transform: none; }   /* 带品牌名、产品名的眉标不转大写：WinnerPro、稳啦 App 要保留原来的大小写 */

/* 角标 / 平台名小签（纯文字，不用平台 logo） */
.cb-badge {
  display: inline-flex; align-items: center; gap: 8px;
  height: 30px; padding: 0 12px; border-radius: var(--r-xs);
  background: rgba(15, 15, 27, .88); color: var(--chalk);
  font: 600 12px/1 var(--font-num); letter-spacing: .08em; text-transform: uppercase;
  white-space: nowrap;
}
.cb-badge--brand { background: var(--brand); color: var(--brand-ink); }
.cb-chips { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.cb-chip {
  display: inline-flex; align-items: center; height: 32px; padding: 0 14px;
  border-radius: var(--r-pill); box-shadow: inset 0 0 0 1px var(--line-2);
  font-size: 14px; color: var(--chalk); white-space: nowrap;
}

/* LIVE 点：#DDFF4F，一屏最多一处 */
.cb-livedot {
  display: inline-flex; align-items: center; gap: 8px;
  font: 600 13px/1 var(--font-num); letter-spacing: .14em; text-transform: uppercase;
  color: var(--chalk);
}
.cb-livedot::before {
  content: ""; width: 8px; height: 8px; flex: none; border-radius: 50%;
  background: var(--live);
  animation: cb-blink 1.6s steps(1, end) infinite;
}
@keyframes cb-blink { 50% { opacity: .2; } }

/* 时间戳（场景里的「哪一刻」） */
.cb-stamp {
  display: inline-flex; align-items: stretch; overflow: hidden;
  border-radius: var(--r-xs); background: var(--ink); box-shadow: inset 0 0 0 1px var(--line);
  font-size: 13px; line-height: 1; white-space: nowrap; max-width: 100%;
}
.cb-stamp > * { display: inline-flex; align-items: center; padding: 7px 10px; }
.cb-stamp__t { background: var(--chalk); color: var(--ink); font: 600 14px/1 var(--font-num); letter-spacing: .02em; }
.cb-stamp__p { color: var(--chalk-2); overflow: hidden; text-overflow: ellipsis; }

/* App 图标 */
.cb-appicon {
  width: 56px; height: 56px; flex: none;
  border-radius: 22.5%; overflow: hidden;
  box-shadow: 0 0 0 1px var(--line);
  background: var(--ink-2);
}
.cb-appicon img { width: 100%; height: 100%; object-fit: cover; }
.cb-appicon--lg { width: 72px; height: 72px; }
.cb-appicon--sm { width: 40px; height: 40px; }

/* 复制按钮（配合 data-wl-copy） */
.cb-copy {
  display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 15px; color: var(--chalk);
}
.cb-copy__btn {
  height: 30px; padding: 0 12px; border: 0; border-radius: var(--r-pill);
  background: transparent; color: var(--chalk-2); box-shadow: inset 0 0 0 1px var(--line-2);
  font-size: 13px; line-height: 1;
  transition: color var(--dur-1), box-shadow var(--dur-1), background-color var(--dur-1);
}
.cb-copy__btn:hover { color: var(--chalk); box-shadow: inset 0 0 0 1px var(--chalk); }
.cb-copy__btn.is-copied { background: var(--brand); color: var(--brand-ink); box-shadow: none; }

/* 勾选列表 */
.cb-checks { display: grid; gap: 12px; }
.cb-checks li { position: relative; padding-left: 28px; font-size: 16px; line-height: 1.55; color: var(--chalk); }
.cb-checks li::before {
  content: ""; position: absolute; left: 0; top: .2em; width: 18px; height: 18px; background: var(--brand);
  -webkit-mask: var(--i-check) center / contain no-repeat; mask: var(--i-check) center / contain no-repeat;
}
.cb-checks small { display: block; font-size: 13px; color: var(--chalk-3); }
.cb-checks--cols { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--s-6); }
@media (max-width: 1068px) { .cb-checks--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 734px) { .cb-checks--cols { grid-template-columns: minmax(0, 1fr); } }

/* 5. 全局导航 --------------------------------------------------------------- */
.cb-nav {
  position: fixed; z-index: 100;
  top: calc(var(--nav-top) + env(safe-area-inset-top, 0px));
  left: 50%;
  width: min(calc(var(--wrap) + 48px), calc(100% - var(--nav-inset) * 2));
  transform: translateX(-50%);
  border-radius: var(--r-nav);
  background: rgba(15, 15, 27, .72);
  -webkit-backdrop-filter: blur(24px) saturate(140%);
  backdrop-filter: blur(24px) saturate(140%);
  box-shadow: inset 0 0 0 1px rgba(245, 245, 240, .09);
  transition: transform var(--dur-2) var(--ease), background-color var(--dur-2) var(--ease);
}
.cb-nav__bar { display: flex; align-items: center; gap: 28px; height: var(--nav-h); padding: 0 12px 0 24px; }
.cb-nav__logo { display: block; flex: none; }
.cb-nav__logo img { height: 28px; width: auto; }
.cb-nav__links { display: flex; align-items: center; gap: 28px; margin-right: auto; }
.cb-nav__links a {
  position: relative; padding: 8px 0;
  font-size: 15px; line-height: 1; color: var(--chalk-2);
  transition: color var(--dur-1) var(--ease-out);
}
.cb-nav__links a:hover, .cb-nav__links a[aria-current="page"] { color: var(--chalk); }
.cb-nav__links a[aria-current="page"]::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--brand);
}
.cb-nav__actions { display: flex; align-items: center; gap: 12px; flex: none; }
.cb-nav__text { font-size: 14px; color: var(--chalk-2); padding: 8px 4px; transition: color var(--dur-1); }
.cb-nav__text:hover { color: var(--chalk); }
.cb-nav__login {
  display: inline-flex; align-items: center; height: 36px; padding: 0 16px; border-radius: var(--r-pill);
  font-size: 14px; color: var(--chalk); box-shadow: inset 0 0 0 1px var(--line-2);
  transition: box-shadow var(--dur-1);
}
.cb-nav__login:hover { box-shadow: inset 0 0 0 1px var(--chalk); }
.cb-nav__toggle {
  display: none; align-items: center; gap: 10px; height: 40px; padding: 0 6px 0 14px; margin-left: auto;
  border: 0; border-radius: var(--r-pill); background: transparent; color: var(--chalk);
  font-size: 15px; line-height: 1;
}
.cb-nav__burger { position: relative; width: 28px; height: 28px; border-radius: 50%; background: var(--ink-3); }
.cb-nav__burger::before, .cb-nav__burger::after {
  content: ""; position: absolute; left: 8px; width: 12px; height: 1.5px; border-radius: 1px; background: var(--chalk);
  transition: transform var(--dur-2) var(--ease), top var(--dur-2) var(--ease);
}
.cb-nav__burger::before { top: 10.5px; }
.cb-nav__burger::after { top: 16px; }
.cb-nav.is-open .cb-nav__burger::before { top: 13.25px; transform: rotate(45deg); }
.cb-nav.is-open .cb-nav__burger::after { top: 13.25px; transform: rotate(-45deg); }

/* 手机菜单：悬浮条本身向下展开成面板 */
.cb-nav__panel { padding: 8px 24px 24px; max-height: calc(100dvh - var(--nav-h) - var(--nav-top) * 2 - 16px); overflow-y: auto; overscroll-behavior: contain; }
.cb-nav__menu { display: grid; border-top: 1px solid var(--line); }
.cb-nav__menu a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 0; border-bottom: 1px solid var(--line);
  font: 700 26px/1.2 var(--font-display); font-synthesis: none; color: var(--chalk);
}
.cb-nav__menu a::after { content: ""; width: 16px; height: 16px; background: var(--chalk-3); -webkit-mask: var(--i-arrow) center / contain no-repeat; mask: var(--i-arrow) center / contain no-repeat; }
.cb-nav__menu a[aria-current="page"] { color: var(--brand); }
.cb-nav__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; padding-top: 24px; }
.cb-nav__foot .cb-btn--brand { margin-left: auto; }
/* 菜单底部的文字链接和登录按钮：点击区域不小于 44px（content.md 共用 › 全局导航） */
.cb-nav__foot .cb-nav__text { display: inline-flex; align-items: center; min-height: 48px; padding: 0 8px; font-size: 15px; }
.cb-nav__foot .cb-nav__login { height: 48px; padding: 0 22px; font-size: 15px; }

@media (max-width: 900px) {
  .cb-nav__links, .cb-nav__actions { display: none; }
  .cb-nav__toggle { display: inline-flex; }
  .cb-nav__bar { padding: 0 8px 0 18px; }
  .cb-nav.is-open { background: rgba(15, 15, 27, .97); }
}
@media (min-width: 901px) { .cb-nav__panel { display: none !important; } }
@media (max-width: 734px) { .cb-nav__logo img { height: 24px; } .cb-nav__bar { padding-left: 16px; } .cb-nav__panel { padding-inline: 16px; } }
html.cb-menu-open { overflow: hidden; }
/* 本地导航吸顶后，全局导航让位（同一时刻只有一条悬浮条） */
html.cb-localnav-stuck:not(.cb-menu-open) .cb-nav { transform: translate(-50%, calc(-100% - var(--nav-top) - 24px)); }

/* 登录态（wl.js 把 [data-wl-login] 换成 .wl-user） */
.cb-nav .wl-user {
  height: 36px; padding: 0 14px 0 4px; gap: 8px; border-radius: var(--r-pill);
  box-shadow: inset 0 0 0 1px var(--line-2); color: var(--chalk);
}
.cb-nav .wl-user:hover { box-shadow: inset 0 0 0 1px var(--chalk); }
.cb-nav .wl-user-avatar { width: 28px; height: 28px; background: var(--ink-3); }
.cb-nav .wl-user-name { font-size: 14px; max-width: 96px; }
.cb-nav__foot .wl-user { height: 48px; padding: 0 18px 0 8px; }
.cb-nav__foot .wl-user-avatar { width: 32px; height: 32px; }

/* 跳到正文（键盘聚焦时才出现；三页共用，content.md 共用 › 全局导航） */
.cb-skip {
  position: fixed; z-index: 300; left: 16px; top: 16px;
  padding: 12px 18px; border-radius: var(--r-sm);
  background: var(--brand); color: var(--brand-ink); font-size: 15px; font-weight: 600;
  transform: translateY(calc(-100% - 40px)); transition: transform var(--dur-1) var(--ease-out);
}
.cb-skip:focus, .cb-skip:focus-visible { transform: none; }

/* 6. 产品本地导航（吸顶） ------------------------------------------------------ */
/* 0 高度的 sticky 容器：不占版面，吸顶后由 site.js 让全局导航收起 */
.cb-localnav { position: sticky; z-index: 101; top: calc(var(--nav-top) + env(safe-area-inset-top, 0px)); height: 0; }
.cb-localnav__inner {
  position: relative;
  width: min(calc(var(--wrap) + 48px), calc(100% - var(--nav-inset) * 2));
  margin: 0 auto;
  transform: translateY(var(--s-5));
  transition: transform var(--dur-2) var(--ease);
}
.cb-localnav.is-stuck .cb-localnav__inner { transform: none; }
.cb-localnav__bar {
  display: flex; align-items: center; gap: 24px;
  height: 56px; padding: 0 10px 0 24px;
  border-radius: var(--r-md);
  background: var(--ink-2);   /* 不透明：毛玻璃只给全局导航 */
  box-shadow: inset 0 0 0 1px var(--line), var(--shadow-pop);
}
/* 优设标题黑是斜体字形，最后一个字会探出字框：不折行、右边留 .12em，免得被裁 */
.cb-localnav__title { flex: none; white-space: nowrap; padding-right: .12em; font: 700 20px/1 var(--font-display); font-synthesis: none; color: var(--chalk); }
.cb-localnav__links { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.cb-localnav__links a {
  position: relative; display: inline-flex; align-items: center; height: 36px; padding: 0 14px;
  border-radius: var(--r-pill); font-size: 14px; color: var(--chalk-2);
  transition: color var(--dur-1), background-color var(--dur-1);
}
.cb-localnav__links a:hover { color: var(--chalk); }
.cb-localnav__links a.is-active { color: var(--chalk); background: var(--ink-3); }
.cb-localnav__links a.is-active::before {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 6px; height: 2px; background: var(--brand);
}
.cb-localnav__current {
  display: none; align-items: center; gap: 6px; height: 36px; padding: 0 10px; margin-left: auto;
  border: 0; border-radius: var(--r-pill); background: var(--ink-3); color: var(--chalk); font-size: 14px;
}
.cb-localnav__current::after {
  content: ""; width: 14px; height: 14px; background: currentColor;
  -webkit-mask: var(--i-chevron) center / contain no-repeat; mask: var(--i-chevron) center / contain no-repeat;
  transition: transform var(--dur-2) var(--ease);
}
.cb-localnav__current[aria-expanded="true"]::after { transform: rotate(180deg); }
@media (max-width: 900px) {
  .cb-localnav__bar { gap: 10px; padding: 0 8px 0 16px; height: 52px; }
  .cb-localnav__title { font-size: 18px; }
  .cb-js .cb-localnav__current { display: inline-flex; }
  .cb-js .cb-localnav__links {
    position: absolute; top: calc(100% + 8px); right: 0; left: 0;
    flex-direction: column; align-items: stretch; gap: 0; padding: 8px;
    border-radius: var(--r-md); background: var(--ink-2);
    box-shadow: inset 0 0 0 1px var(--line), var(--shadow-pop);
    visibility: hidden; opacity: 0; transform: translateY(-6px);
    transition: opacity var(--dur-1) var(--ease-out), transform var(--dur-1) var(--ease-out), visibility 0s linear var(--dur-1);
  }
  .cb-js .cb-localnav__links.is-open { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .cb-js .cb-localnav__links a { height: 48px; padding: 0 16px; font-size: 16px; border-radius: var(--r-sm); }
  .cb-js .cb-localnav__links a.is-active::before { left: 0; right: auto; top: 14px; bottom: 14px; width: 3px; height: auto; }
  html:not(.cb-js) .cb-localnav__links { overflow-x: auto; scrollbar-width: none; }
}
@media (max-width: 734px) { .cb-localnav__inner { width: calc(100% - 24px); } }

/* 7. Hero ------------------------------------------------------------------- */
.cb-hero { position: relative; overflow: clip; background: var(--ink); isolation: isolate; }
.cb-hero__inner { position: relative; z-index: 2; }
.cb-hero__copy { display: grid; justify-items: start; gap: var(--s-5); }
.cb-hero__copy > .cb-eyebrow { margin-bottom: 0; }
.cb-hero__copy > .cb-actions { margin-top: var(--s-3); }

/* 7a 视频背景版：全幅球场视频，标题压在左下，计时条在右下 */
.cb-hero--video { min-height: max(640px, 100svh); display: flex; align-items: flex-end; }
.cb-hero__media {
  position: absolute; inset: 0; z-index: 0;
  background: var(--ink) center / cover no-repeat;   /* 页面里写 style="background-image:url(poster)"，循环接缝时露出首帧 */
}
.cb-hero__media video, .cb-hero__media > img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%;
  transition: opacity .4s linear;
}
.cb-hero__media video.is-seam { opacity: 0; }
.cb-hero__media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(15, 15, 27, .55) 0%, rgba(15, 15, 27, 0) 20%),
    linear-gradient(0deg, rgba(15, 15, 27, 1) 0%, rgba(15, 15, 27, .78) 26%, rgba(15, 15, 27, .2) 58%, rgba(15, 15, 27, 0) 72%),
    linear-gradient(90deg, rgba(15, 15, 27, .62) 0%, rgba(15, 15, 27, .2) 46%, rgba(15, 15, 27, 0) 66%);
}
.cb-hero--video .cb-hero__inner {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; column-gap: var(--s-7);
  padding-top: calc(var(--nav-h) + var(--nav-top) + var(--s-9));
  padding-bottom: var(--s-8);
}
.cb-hero--video .cb-hero__aside { display: flex; flex-direction: column; align-items: flex-end; gap: var(--s-3); }
.cb-hero__play {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 32px; padding: 0 12px 0 10px; border: 0; border-radius: var(--r-pill);
  background: rgba(15, 15, 27, .6); color: var(--chalk-2); box-shadow: inset 0 0 0 1px var(--line);
  font-size: 12px; line-height: 1;
}
.cb-hero__play:hover { color: var(--chalk); }
.cb-hero__play::before {
  content: ""; width: 12px; height: 12px; background: currentColor;
  -webkit-mask: var(--i-pause) center / contain no-repeat; mask: var(--i-pause) center / contain no-repeat;
}
.cb-hero__play.is-paused::before { -webkit-mask-image: var(--i-play); mask-image: var(--i-play); }
@media (max-width: 1068px) {
  .cb-hero--video .cb-hero__inner { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-6); }
  .cb-hero--video .cb-hero__aside { align-items: flex-start; }
}
@media (max-width: 734px) {
  .cb-hero--video { min-height: max(600px, 100svh); }
  .cb-hero__media video, .cb-hero__media > img { object-position: 24% 50%; }
  .cb-hero--video .cb-hero__inner { padding-bottom: var(--s-6); }
  .cb-hero--video .cb-hero__aside { width: 100%; }
}

/* 7b 产品图版：左文右图，产品后压巨字 */
.cb-hero--product { padding-top: calc(var(--nav-h) + var(--nav-top) + var(--s-8)); padding-bottom: var(--s-9); }
.cb-hero--product .cb-hero__inner {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; column-gap: var(--s-6);
  min-height: min(760px, calc(100svh - var(--nav-h) - var(--nav-top) - var(--s-8) - var(--s-9)));
}
.cb-hero__stage {
  position: relative; display: flex; align-items: flex-end; justify-content: center;
  min-height: 600px; align-self: stretch;
}
.cb-hero__points { display: grid; gap: 10px; margin-top: var(--s-2); }
.cb-hero__points li { position: relative; padding-left: 22px; color: var(--chalk-2); font-size: 16px; line-height: 1.6; }
.cb-hero__points li::before { content: ""; position: absolute; left: 0; top: .78em; width: 10px; height: 1px; background: var(--brand); }
@media (max-width: 1068px) {
  .cb-hero--product .cb-hero__inner { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); }
  .cb-hero__stage { min-height: 520px; }
}
@media (max-width: 734px) {
  .cb-hero--product { padding-bottom: var(--s-8); }
  .cb-hero--product .cb-hero__inner { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-7); min-height: 0; }
  .cb-hero__stage { min-height: 0; }
}

/* 直播计时条（F1 广播图形式）：LIVE · 赛事 · 场地 · 计时 */
.cb-ticker {
  display: inline-flex; align-items: stretch; max-width: 100%;
  border-radius: var(--r-sm); overflow: hidden;
  background: rgba(15, 15, 27, .92); box-shadow: inset 0 0 0 1px var(--line);
  color: var(--chalk); text-align: left;
}
a.cb-ticker { transition: box-shadow var(--dur-1); }
a.cb-ticker:hover { box-shadow: inset 0 0 0 1px var(--line-2); }
.cb-ticker__seg { display: flex; flex-direction: column; justify-content: center; gap: 5px; min-width: 0; padding: 10px 18px; border-left: 1px solid var(--line); }
.cb-ticker__seg:first-child { border-left: 0; }
.cb-ticker__seg--live { flex-direction: row; align-items: center; padding-inline: 16px; background: var(--ink-3); box-shadow: inset 3px 0 0 var(--brand); }
.cb-ticker__k { font: 500 10px/1 var(--font-num); letter-spacing: .14em; text-transform: uppercase; color: var(--chalk-3); white-space: nowrap; }
.cb-ticker__v { font-size: 14px; line-height: 1.2; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cb-ticker__v.cb-num { font: 500 20px/1 var(--font-num); letter-spacing: .02em; font-variant-numeric: tabular-nums; }
/* 计时每秒在变：Oswald 没有等宽数字（tnum 不起作用），1 和 7 比 0 窄一截，整条计时条会跟着抖。
   按最宽的「00:00:00」留出宽度（500 字重下实测 3.84em） */
.cb-ticker__v[data-cb-clock] { min-width: 3.9em; }
.cb-ticker__seg--grow { flex: 1 1 auto; }
@media (max-width: 734px) {
  .cb-ticker { display: flex; width: 100%; }
  .cb-ticker__seg { padding: 9px 12px; }
  .cb-ticker__seg--opt { display: none; }
  .cb-ticker__seg--grow { flex: 1 1 0; }
  .cb-ticker__v.cb-num { font-size: 18px; }
}

/* 巨字背景：压在产品后面，品牌色 12% */
.cb-bigtype-host { position: relative; isolation: isolate; }
/* 用 peek 时给宿主加这个：上方留出冒头的空间（≈ 字高 × 58% + 16px），保证巨字不压到上面的正文。
   和上面 .cb-head 的下边距会合并（取大者），所以这里写的是总间距 */
.cb-bigtype-host--peek { margin-top: calc(var(--fs-bigtype) * .46 + 16px); }
.cb-bigtype {
  position: absolute; z-index: -1; pointer-events: none; user-select: none;
  font: 700 var(--fs-bigtype)/.78 var(--font-num); letter-spacing: -.02em;
  color: var(--brand-faint); white-space: nowrap;
}
.cb-bigtype--center { left: 50%; top: 50%; transform: translate(-50%, -50%); }
.cb-bigtype--top { left: 50%; top: 0; transform: translateX(-50%); }
.cb-bigtype--right { right: -.04em; top: 50%; transform: translateY(-50%); }
.cb-bigtype--xl { font-size: calc(var(--fs-bigtype) * 1.55); }   /* 一部手机挡中间时用：两边各露出一截 */
.cb-bigtype--peek-r { right: -.03em; top: 0; transform: translateY(-58%); }   /* 右上角，从下一个元素后面冒出半截 */
.cb-bigtype--peek-l { left: -.05em; top: 0; transform: translateY(-58%); }

/* 8. 比分条 ----------------------------------------------------------------- */
/* 8a 章节分隔：一条球场白线 + 压在线上的比分条（取自赛事版记分牌的格子样式） */
.cb-divider { position: relative; display: flex; align-items: center; padding-block: var(--s-5); }
.cb-divider::before { content: ""; position: absolute; left: var(--gutter); right: var(--gutter); top: 50%; height: 1px; background: var(--line-2); }
.cb-divider::after { content: ""; position: absolute; left: 50%; top: calc(50% - 11px); width: 1px; height: 11px; background: var(--line-chalk); }
.cb-divider > .cb-score { position: relative; z-index: 1; }
.cb-divider--end { justify-content: flex-end; }

.cb-score {
  display: inline-flex; align-items: stretch; max-width: 100%;
  height: 40px; border-radius: 3px; overflow: hidden;
  background: var(--ink-3); box-shadow: inset 3px 0 0 var(--brand);
  font-size: 15px; line-height: 1; color: var(--chalk);
}
.cb-score > * { display: inline-flex; align-items: center; }
.cb-score__tag { padding: 0 14px 0 16px; font: 600 12px/1 var(--font-num); letter-spacing: .1em; text-transform: uppercase; color: var(--chalk-2); white-space: nowrap; }
.cb-score__name { display: block; padding: 0 18px 0 4px; font-weight: 600; line-height: 40px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cb-score__cell { justify-content: center; min-width: 40px; padding: 0 8px; background: #0A0A16; color: var(--chalk-3); font: 500 18px/1 var(--font-num); font-variant-numeric: tabular-nums; }
.cb-score__cell.is-brand { background: var(--brand); color: var(--brand-ink); }
.cb-score__cell.is-chalk { background: var(--chalk); color: var(--ink); }
.cb-score__cell.is-win { color: var(--brand); }
@media (max-width: 734px) {
  .cb-score { height: 36px; font-size: 14px; }
  .cb-score__tag { padding: 0 10px 0 13px; }
  .cb-score__name { padding-right: 12px; line-height: 36px; }
  .cb-score__cell { min-width: 32px; font-size: 16px; }
}

/* 8b 比赛记分牌（两行，带发球球标） */
.cb-score--match { display: inline-grid; grid-template-columns: auto; height: auto; padding-left: 3px; }
.cb-score--match .cb-score__row { display: flex; align-items: stretch; height: 36px; }
.cb-score--match .cb-score__row > * { display: inline-flex; align-items: center; }
.cb-score--match .cb-score__row + .cb-score__row { border-top: 1px solid rgba(245, 245, 240, .08); }
.cb-score--match .cb-score__name { flex: 1; min-width: 96px; padding: 0 16px 0 12px; }
.cb-score__serve { display: inline-flex; align-items: center; justify-content: center; width: 30px; }
.cb-score__serve img { width: 18px; height: 18px; }
.cb-score__serve.is-off img { visibility: hidden; }

/* 9. 双产品 tile ------------------------------------------------------------- */
.cb-tiles { display: grid; gap: var(--s-4); }
.cb-tile {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  min-height: 640px; border-radius: var(--r-xl);
}
.cb-tile--app { background: var(--ink); box-shadow: inset 0 0 0 1px var(--line); }
.cb-tile--pro { background: var(--court); }
.cb-tile__copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end; gap: var(--s-5); padding: var(--s-8); }
.cb-tile__brand { display: flex; align-items: center; gap: 14px; margin-bottom: auto; }
.cb-tile__for { font: 500 13px/1.3 var(--font-num); letter-spacing: .1em; text-transform: uppercase; color: var(--chalk-2); }
.cb-tile__name { font: 700 22px/1.25 var(--font-display); font-synthesis: none; word-spacing: -.12em; color: var(--chalk); }
.cb-tile__title { font-size: 52px; line-height: 1.12; }
.cb-tile__copy > .cb-actions { margin-top: var(--s-3); }
.cb-tile__media { position: relative; min-width: 0; }
/* App tile：手机从底边冒出来 */
.cb-tile__media--phone { display: flex; justify-content: center; align-items: flex-start; padding-top: var(--s-8); }
.cb-tile__media--phone .cb-phone { margin-bottom: -40%; }
/* 赛事版 tile：直播画面完整显示（烧在画面里的 logo、场地牌不能被裁） */
.cb-tile__media--screen { display: flex; flex-direction: column; justify-content: center; gap: var(--s-4); padding: var(--s-8) var(--s-8) var(--s-8) 0; }
@media (max-width: 1068px) {
  .cb-tile { min-height: 560px; }
  .cb-tile__copy { padding: var(--s-7); }
  .cb-tile__title { font-size: 40px; }
  .cb-tile__media--screen { padding: var(--s-7) var(--s-7) var(--s-7) 0; }
}
@media (max-width: 734px) {
  .cb-tile { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .cb-tile__copy { padding: var(--s-6) var(--s-5) 0; gap: var(--s-4); }
  .cb-tile__brand { margin-bottom: var(--s-3); }
  .cb-tile__media--phone { height: 420px; padding-top: var(--s-6); }
  .cb-tile__media--phone .cb-phone { margin-bottom: 0; }
  .cb-tile__title { font-size: 30px; }
  .cb-tile__media--screen { padding: var(--s-6) var(--s-5) var(--s-5); }
}

/* 10. 场景 ------------------------------------------------------------------ */
/* 10a 吸顶大数字 + 叠卡：左边 01/02/03 吸顶翻动，右边场景卡依次叠上来 */
.cb-steps { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); column-gap: var(--s-6); align-items: start; }
.cb-steps__rail { position: sticky; top: var(--sticky-top); padding-top: var(--s-2); }
.cb-steps__count { font: 500 13px/1 var(--font-num); letter-spacing: .14em; text-transform: uppercase; color: var(--chalk-3); }
.cb-odo {
  display: flex; margin: 10px 0 0 -0.04em;
  font: 600 var(--fs-step)/1 var(--font-num); letter-spacing: -.03em; color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.cb-odo__d { display: block; height: 1.02em; overflow: hidden; }
.cb-odo__strip { display: block; transform: translateY(calc(var(--d, 0) * -1.02em)); transition: transform var(--dur-4) var(--ease); }
.cb-odo__strip > span { display: block; height: 1.02em; line-height: 1.02em; }
.cb-steps__label { margin-top: var(--s-4); font: 700 28px/1.2 var(--font-display); font-synthesis: none; color: var(--chalk); min-height: 1.2em; }
.cb-steps__bar { display: flex; gap: 6px; margin-top: var(--s-5); }
.cb-steps__bar > span { width: 32px; height: 3px; background: var(--line-2); transition: background-color var(--dur-2) var(--ease); }
.cb-steps__bar > span.is-on { background: var(--brand); }
.cb-steps__list { display: grid; gap: 12vh; }
.cb-step__num { display: none; }
/* ≤1068：侧边大数字放不下，改成卡内序号，卡片占满整行（保证叠起来时整张卡在可视区内） */
@media (max-width: 1068px) {
  .cb-steps { grid-template-columns: minmax(0, 1fr); }
  .cb-steps__rail { display: none; }
  .cb-step__num { display: block; margin-bottom: var(--s-2); font: 600 88px/.9 var(--font-num); letter-spacing: -.02em; color: var(--brand); }
}
@media (max-width: 734px) {
  .cb-steps__list { gap: var(--s-4); }
  .cb-step__num { margin-bottom: var(--s-4); font-size: 64px; }
}

/* 叠卡：每张 sticky，往下错 14px 露出上一张的边；site.js 写 --cb-p（0–1）做缩小压暗 */
.cb-stack { display: grid; gap: 12vh; }
.cb-stack > .cb-stack__card, .cb-steps__list > .cb-stack__card { position: sticky; top: calc(var(--sticky-top) + var(--i, 0) * 14px); transform-origin: 50% 0; }
.cb-stack__card:nth-child(2) { --i: 1; } .cb-stack__card:nth-child(3) { --i: 2; }
.cb-stack__card:nth-child(4) { --i: 3; } .cb-stack__card:nth-child(5) { --i: 4; } .cb-stack__card:nth-child(6) { --i: 5; }
@media (min-width: 735px) and (prefers-reduced-motion: no-preference) {
  .cb-stack__card { transform: scale(calc(1 - var(--cb-p, 0) * .05)); }
  .cb-stack__card > .cb-scene::after { opacity: calc(var(--cb-p, 0) * .55); }
}
@media (max-width: 734px), (max-height: 700px) {
  /* 手机、或者矮屏笔记本：卡片可能比可视区高，不叠，正常往下排 */
  .cb-stack, .cb-steps__list { gap: var(--s-4); }
  .cb-stack > .cb-stack__card, .cb-steps__list > .cb-stack__card { position: relative; top: auto; transform: none; }
}

/* 场景卡：标题 + 一句话 + 画面，配真实界面 */
.cb-scene {
  position: relative; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 9fr);
  min-height: min(640px, calc(100vh - var(--sticky-top) - 72px));
  border-radius: var(--r-xl); background: var(--court);
}
.cb-scene::after { content: ""; position: absolute; inset: 0; z-index: 5; background: #05050A; opacity: 0; pointer-events: none; }
.cb-scene--ink { background: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line); }
.cb-scene__copy { display: flex; flex-direction: column; justify-content: flex-end; gap: 14px; padding: var(--s-7); }
.cb-scene__copy > .cb-eyebrow { margin-bottom: var(--s-1); }
.cb-scene__copy > .cb-h2 { font-size: min(var(--fs-h2), 40px); margin-bottom: var(--s-2); }
.cb-scene__text { font-size: 16px; line-height: 1.75; color: var(--chalk-2); }
.cb-scene__media { position: relative; display: flex; align-items: center; justify-content: center; min-width: 0; padding: var(--s-6) var(--s-5); }
.cb-scene__media--full { padding: 0; }
.cb-scene__media--full > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cb-scene__media--full::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--court) 0%, rgba(16, 36, 26, 0) 22%); pointer-events: none; }
@media (max-width: 1068px) {
  .cb-scene__copy { padding: var(--s-6); }
  .cb-scene__media { padding: var(--s-6) var(--s-4); }
}
@media (max-width: 734px) {
  .cb-scene { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .cb-scene__copy { padding: var(--s-6) var(--s-5) var(--s-5); justify-content: flex-start; }
  .cb-scene__media { padding: 0 var(--s-5) var(--s-6); }
  .cb-scene__media--full { order: -1; padding: 0; aspect-ratio: 4 / 3; }
  .cb-scene__media--full::after { background: linear-gradient(0deg, var(--court) 0%, rgba(16, 36, 26, 0) 30%); }
}

/* 做法列表：Oswald 序号 */
.cb-howto { display: grid; gap: 10px; counter-reset: cb-howto; }
.cb-howto li { position: relative; padding-left: 30px; font-size: 16px; line-height: 1.65; color: var(--chalk-2); counter-increment: cb-howto; }
.cb-howto li::before {
  content: counter(cb-howto); position: absolute; left: 0; top: .1em;
  width: 20px; height: 20px; border-radius: 4px; background: var(--brand-faint); color: var(--brand);
  font: 600 12px/20px var(--font-num); text-align: center;
}
.cb-howto strong { color: var(--chalk); font-weight: 600; }

/* 结果句：左边品牌竖条 */
.cb-result { position: relative; padding-left: 16px; font-size: 17px; line-height: 1.6; font-weight: 600; color: var(--chalk); }
.cb-result::before { content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: 3px; background: var(--brand); }

/* 10b 图文交错 */
.cb-split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s-8); align-items: center; }
.cb-split + .cb-split { margin-top: var(--s-10); }
.cb-split__copy { display: flex; flex-direction: column; gap: var(--s-4); }
.cb-split__copy > .cb-eyebrow { margin-bottom: var(--s-1); }
.cb-split__copy > .cb-h2 { margin-bottom: var(--s-2); }
.cb-split--rev { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.cb-split--rev .cb-split__media { order: 2; }
.cb-panel {
  position: relative; overflow: hidden; isolation: isolate;
  display: flex; align-items: center; justify-content: center; gap: var(--s-5);
  min-height: 600px; padding: var(--s-7); border-radius: var(--r-xl); background: var(--court);
}
.cb-panel--ink { background: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line); }
@media (max-width: 1068px) { .cb-split, .cb-split--rev { column-gap: var(--s-6); } .cb-panel { min-height: 520px; padding: var(--s-6); } }
@media (max-width: 734px) {
  .cb-split, .cb-split--rev { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-6); }
  .cb-split--rev .cb-split__media { order: 0; }
  .cb-split + .cb-split { margin-top: var(--s-9); }
  .cb-panel { min-height: 0; padding: var(--s-6) var(--s-4); gap: var(--s-3); }
}

/* 11. 设备框 ----------------------------------------------------------------- */
/* 11a 手机框：屏幕 393:852。截图自带状态栏和灵动岛，框只画机身 */
.cb-phone { --phone-w: 300px; container-type: inline-size; width: var(--phone-w); max-width: 100%; flex: none; margin: 0; }
.cb-phone__body {
  position: relative; padding: 3.4cqw; border-radius: 16.2cqw;
  background: #09090B;
  box-shadow: 0 0 0 1px #4A4A52, 0 0 0 2.2cqw #18181C, 0 0 0 calc(2.2cqw + 1px) #2E2E34, var(--shadow-float);
  margin: 2.2cqw;
}
.cb-phone__body::before {   /* 左侧：操作按钮、音量加、音量减 */
  content: ""; position: absolute; left: calc(-2.2cqw - 1.1cqw); top: 21cqw; width: 1.1cqw; height: 42cqw; border-radius: 1cqw 0 0 1cqw;
  background: linear-gradient(180deg, #2E2E34 0 7cqw, transparent 7cqw 13cqw, #2E2E34 13cqw 26cqw, transparent 26cqw 29cqw, #2E2E34 29cqw 42cqw);
}
.cb-phone__body::after {    /* 右侧：电源键 */
  content: ""; position: absolute; right: calc(-2.2cqw - 1.1cqw); top: 36cqw; width: 1.1cqw; height: 20cqw; border-radius: 0 1cqw 1cqw 0; background: #2E2E34;
}
.cb-phone__screen { position: relative; overflow: hidden; aspect-ratio: 393 / 852; border-radius: 12.4cqw; background: #000; }
.cb-phone__screen > img, .cb-phone__screen > picture > img, .cb-phone__screen > video { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
.cb-phone--tilt-l { transform: rotate(-4deg); }
.cb-phone--tilt-r { transform: rotate(4deg); }
@supports not (width: 1cqw) {
  .cb-phone__body { padding: 10px; border-radius: 48px; margin: 6px; box-shadow: 0 0 0 1px #4A4A52, 0 0 0 6px #18181C, var(--shadow-float); }
  .cb-phone__screen { border-radius: 38px; }
  .cb-phone__body::before, .cb-phone__body::after { display: none; }
}

/* 两台设备前后错开（手机 / 手表都行）：第一个在前，第二个在后、偏右上 */
.cb-duo { position: relative; display: flex; align-items: flex-end; justify-content: center; }
.cb-duo > :first-child { position: relative; z-index: 2; }
.cb-duo > * + * { position: relative; z-index: 1; margin-left: -14%; transform: translateY(-10%); }
.cb-duo--rev > * + * { transform: translateY(10%); }
@media (max-width: 734px) { .cb-duo > * + * { margin-left: -24%; } }

/* 手表（素材自带表壳，只控制尺寸） */
.cb-watch { width: var(--watch-w, 280px); max-width: 100%; flex: none; margin: 0; }
.cb-watch img { width: 100%; height: auto; }

/* 11b 浏览器框 */
.cb-browser {
  overflow: hidden; margin: 0; border-radius: var(--r-sm);
  background: #121218; box-shadow: 0 0 0 1px var(--line-2), var(--shadow-float);
}
.cb-browser__bar { display: flex; align-items: center; gap: 14px; height: 36px; padding: 0 14px; background: #1E1E26; border-bottom: 1px solid rgba(0, 0, 0, .4); }
.cb-browser__dots { display: inline-flex; gap: 7px; flex: none; }
.cb-browser__dots::before, .cb-browser__dots::after, .cb-browser__dots > i { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #3A3A44; }
.cb-browser__url {
  flex: 1; max-width: 360px; height: 22px; margin: 0 auto; padding: 0 12px; border-radius: 6px;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  background: #121218; color: var(--chalk-3); font-size: 12px; white-space: nowrap; text-overflow: ellipsis;
}
.cb-browser__body > img { width: 100%; height: auto; }
.cb-browser__body--crop { aspect-ratio: var(--crop, 16 / 10); overflow: hidden; }
.cb-browser__body--crop > img { width: 100%; height: 100%; object-fit: cover; object-position: 0 0; }
@media (max-width: 734px) { .cb-browser__bar { height: 28px; gap: 10px; } .cb-browser__dots::before, .cb-browser__dots::after, .cb-browser__dots > i { width: 8px; height: 8px; } .cb-browser__url { height: 18px; font-size: 11px; } }

/* 11c 笔记本框 */
.cb-laptop { margin: 0; width: 100%; }
.cb-laptop__lid { margin: 0 7%; padding: 1.4% 1.4% 2.6%; border-radius: 18px 18px 0 0; background: #0B0B0E; box-shadow: 0 0 0 1px #3C3C44; }
.cb-laptop__lid .cb-browser { border-radius: 4px; box-shadow: none; }
.cb-laptop__base { position: relative; height: 14px; border-radius: 0 0 14px 14px / 0 0 10px 10px; background: linear-gradient(180deg, #34343C 0%, #1C1C22 60%, #121216 100%); box-shadow: 0 0 0 1px #3C3C44, var(--shadow-float); }
.cb-laptop__base::before { content: ""; position: absolute; left: 50%; top: 0; width: 16%; height: 5px; transform: translateX(-50%); border-radius: 0 0 6px 6px; background: #121216; }
@media (max-width: 734px) { .cb-laptop__lid { border-radius: 10px 10px 0 0; } .cb-laptop__base { height: 8px; } }

/* 11d 直播画面框：16:9，四角可叠角标 */
.cb-screen { margin: 0; min-width: 0; }
.cb-screen__frame {
  position: relative; overflow: hidden; aspect-ratio: 16 / 9;
  border-radius: var(--r-md); background: #000; box-shadow: 0 0 0 1px var(--line);
}
.cb-screen__frame > img, .cb-screen__frame > video, .cb-screen__frame > picture > img,
.cb-switch__pane > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cb-screen__corner { position: absolute; z-index: 3; display: flex; gap: 8px; }
.cb-screen__corner.is-tl { left: 16px; top: 16px; }
.cb-screen__corner.is-tr { right: 16px; top: 16px; }
.cb-screen__corner.is-bl { left: 16px; bottom: 16px; }
.cb-screen__corner.is-br { right: 16px; bottom: 16px; }
.cb-screen__cap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: var(--s-4); font-size: 14px; color: var(--chalk-2); }
@media (max-width: 734px) {
  .cb-screen__frame { border-radius: var(--r-sm); }
  .cb-screen__corner.is-tl, .cb-screen__corner.is-bl { left: 10px; } .cb-screen__corner.is-tr, .cb-screen__corner.is-br { right: 10px; }
  .cb-screen__corner.is-tl, .cb-screen__corner.is-tr { top: 10px; } .cb-screen__corner.is-bl, .cb-screen__corner.is-br { bottom: 10px; }
  .cb-screen__corner .cb-badge { height: 24px; padding: 0 8px; font-size: 10px; }
}

/* 11e 模板切换（四套画面模板轮播） */
.cb-switch { min-width: 0; }
.cb-switch__pane { position: absolute; inset: 0; opacity: 0; transition: opacity var(--dur-3) var(--ease); }
.cb-switch__pane.is-active { opacity: 1; }
.cb-switch__tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--s-4); }
.cb-switch__tab {
  position: relative; overflow: hidden;
  height: 40px; padding: 0 18px; border: 0; border-radius: var(--r-pill);
  background: transparent; color: var(--chalk-2); box-shadow: inset 0 0 0 1px var(--line-2);
  font-size: 15px; line-height: 1;
  transition: color var(--dur-1), background-color var(--dur-1), box-shadow var(--dur-1);
}
.cb-switch__tab:hover { color: var(--chalk); }
.cb-switch__tab[aria-selected="true"] { background: var(--chalk); color: var(--ink); box-shadow: none; }
.cb-switch__tab .cb-fill { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: var(--brand); }
.cb-switch.is-running .cb-switch__tab[aria-selected="true"] .cb-fill { animation: cb-fill var(--cb-dur, 4s) linear forwards; }
.cb-switch.is-paused .cb-switch__tab .cb-fill { animation-play-state: paused; }

/* 12. 数据 ------------------------------------------------------------------ */
/* 12a 数据浮签：数字必须和旁边截图里的一致 */
.cb-tag {
  position: absolute; z-index: 3;
  display: grid; gap: 4px; padding: 14px 18px 13px;
  border-radius: 16px; background: rgba(23, 23, 37, .96);
  box-shadow: inset 0 0 0 1px var(--line), var(--shadow-pop);
  white-space: nowrap;
}
.cb-tag__k { font-size: 13px; line-height: 1.2; color: var(--chalk-2); }
.cb-tag__v { font: 500 var(--fs-tag)/1 var(--font-num); font-variant-numeric: tabular-nums; color: var(--brand); letter-spacing: 0; }
.cb-tag__v small { margin-left: 3px; font-size: .5em; font-weight: 400; color: var(--chalk-2); }
.cb-tag--pink .cb-tag__v { color: var(--pink); }
.cb-tag--purple .cb-tag__v { color: var(--purple); }
.cb-tag--chalk .cb-tag__v { color: var(--chalk); }
.cb-tag--text .cb-tag__v { font: 600 16px/1.35 var(--font-zh); color: var(--chalk); }
.cb-tag.is-tl { left: 6%; top: 12%; } .cb-tag.is-tr { right: 6%; top: 12%; }
.cb-tag.is-ml { left: 2%; top: 46%; } .cb-tag.is-mr { right: 2%; top: 46%; }
.cb-tag.is-bl { left: 6%; bottom: 12%; } .cb-tag.is-br { right: 6%; bottom: 12%; }
@media (max-width: 734px) {
  .cb-tag { padding: 10px 12px 9px; border-radius: 12px; }
  .cb-tag__k { font-size: 12px; }
  .cb-tag.is-tl, .cb-tag.is-ml, .cb-tag.is-bl { left: 0; } .cb-tag.is-tr, .cb-tag.is-mr, .cb-tag.is-br { right: 0; }
}

/* 12b 数据点横排：大数字 + 说明，竖线分隔，不用卡片 */
.cb-stats { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); border-top: 1px solid var(--line-2); }
.cb-stat { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-6) var(--s-6) 0 0; }
.cb-stat + .cb-stat { padding-left: var(--s-6); border-left: 1px solid var(--line); }
.cb-stat__v { display: flex; align-items: baseline; gap: 8px; color: var(--brand); }
.cb-stat__v .cb-num { font-size: var(--fs-stat); font-weight: 600; line-height: .9; letter-spacing: -.02em; }
.cb-stat__u { font-size: 22px; font-weight: 600; color: var(--chalk); }
.cb-stat__k { font-size: 16px; line-height: 1.6; color: var(--chalk-2); max-width: 18em; }
.cb-stat__vs { font-size: 13px; color: var(--chalk-3); }
@media (max-width: 734px) {
  .cb-stats { grid-auto-flow: row; }
  .cb-stat { padding: var(--s-5) 0; }
  .cb-stat + .cb-stat { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
  .cb-stat__u { font-size: 18px; }
}

/* 12c 规格表：「值 + 说明」行，两列 */
.cb-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s-8); border-top: 1px solid var(--line-2); }
.cb-specs__row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: baseline; gap: var(--s-5); padding: var(--s-5) 0; border-bottom: 1px solid var(--line); }
.cb-specs__row dt, .cb-specs__v { font: 600 40px/1 var(--font-num); letter-spacing: -.01em; color: var(--chalk); white-space: nowrap; }
.cb-specs__row dt small, .cb-specs__v small { margin-left: 4px; font: 600 16px/1 var(--font-zh); color: var(--chalk-2); }
.cb-specs__row dd { font-size: 15px; line-height: 1.6; color: var(--chalk-2); }
@media (max-width: 1068px) { .cb-specs { column-gap: var(--s-6); } .cb-specs__row dt, .cb-specs__v { font-size: 34px; } }
@media (max-width: 734px) {
  .cb-specs { grid-template-columns: minmax(0, 1fr); }
  .cb-specs__row { grid-template-columns: minmax(0, 4fr) minmax(0, 6fr); gap: var(--s-4); padding: var(--s-4) 0; }
  .cb-specs__row dt, .cb-specs__v { font-size: 28px; }
  .cb-specs__row dd { font-size: 14px; }
}

/* 12d 规则列表：替代三等分卡片（适合谁 / 三步总览） */
.cb-rows { border-top: 1px solid var(--line-2); counter-reset: cb-rows; }
.cb-rows__item {
  display: grid; grid-template-columns: 96px minmax(0, 4fr) minmax(0, 7fr); align-items: baseline; gap: var(--s-6);
  padding: var(--s-6) 0; border-bottom: 1px solid var(--line);
  counter-increment: cb-rows;
}
.cb-rows__item::before { content: counter(cb-rows, decimal-leading-zero); font: 500 20px/1 var(--font-num); letter-spacing: .04em; color: var(--brand); }
.cb-rows__title { font: 700 var(--fs-h3)/1.3 var(--font-display); font-synthesis: none; color: var(--chalk); }
.cb-rows__text { font-size: 16px; line-height: 1.7; color: var(--chalk-2); }
@media (max-width: 734px) {
  .cb-rows__item { grid-template-columns: 40px minmax(0, 1fr); row-gap: var(--s-2); column-gap: var(--s-3); padding: var(--s-5) 0; }
  .cb-rows__text { grid-column: 2; }
  .cb-rows__item::before { font-size: 16px; }
}

/* 13. 横滑亮点卡 ------------------------------------------------------------- */
.cb-rail { --rail-pad: max(var(--gutter), calc((100% - var(--wrap)) / 2)); position: relative; }
.cb-rail__track {
  display: flex; gap: var(--s-4);
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scroll-padding-inline: var(--rail-pad);
  padding: 4px var(--rail-pad) 8px;
  scrollbar-width: none; -ms-overflow-style: none;
}
.cb-rail__track::-webkit-scrollbar { display: none; }
.cb-rail__track > * { flex: none; scroll-snap-align: start; }
.cb-rail__foot { display: flex; align-items: center; gap: var(--s-4); margin-top: var(--s-6); }
.cb-rail__btns { display: flex; gap: 10px; }
.cb-rail__btn {
  width: 44px; height: 44px; border: 0; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--ink-3); color: var(--chalk);
  transition: background-color var(--dur-1), color var(--dur-1), opacity var(--dur-1);
}
.cb-rail__btn::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--i-arrow) center / contain no-repeat; mask: var(--i-arrow) center / contain no-repeat; }
.cb-rail__btn--prev::before { transform: scaleX(-1); }
.cb-rail__btn:hover { background: var(--chalk); color: var(--ink); }
.cb-rail__btn:disabled { opacity: .35; cursor: default; background: var(--ink-3); color: var(--chalk); }
.cb-rail__pause {
  width: 36px; height: 36px; border: 0; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--ink-3); color: var(--chalk);
}
.cb-rail__pause::before { content: ""; width: 12px; height: 12px; background: currentColor; -webkit-mask: var(--i-pause) center / contain no-repeat; mask: var(--i-pause) center / contain no-repeat; }
.cb-rail.is-user-paused .cb-rail__pause::before { -webkit-mask-image: var(--i-play); mask-image: var(--i-play); }
.cb-sec--surface .cb-rail__btn, .cb-sec--surface .cb-rail__pause { background: var(--card); }
@media (max-width: 734px) { .cb-head__aside.cb-rail__btns, .cb-head__aside .cb-rail__btns { display: none; } }

/* 进度点：当前点拉长成条，自动播放时条内走进度 */
.cb-dots { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: var(--r-pill); background: var(--ink-3); }
.cb-sec--surface .cb-dots { background: var(--card); }
.cb-dots__dot {
  position: relative; overflow: hidden; width: 8px; height: 8px; padding: 0; border: 0; border-radius: 4px;
  background: var(--chalk-3);
  transition: width var(--dur-2) var(--ease), background-color var(--dur-2) var(--ease);
}
.cb-dots__dot::after { content: ""; position: absolute; inset: -14px -6px; }
.cb-dots__dot:hover { background: var(--chalk-2); }
.cb-dots__dot.is-active { width: 40px; background: var(--line-2); }
.cb-dots__fill { position: absolute; left: 0; top: 0; bottom: 0; width: 100%; background: var(--chalk); transform-origin: 0 50%; }
.cb-dots__dot:not(.is-active) .cb-dots__fill { transform: scaleX(0); }
.cb-rail.is-running .cb-dots__dot.is-active .cb-dots__fill { animation: cb-fill-x var(--cb-dur, 5s) linear forwards; }
.cb-rail.is-paused .cb-dots__fill, .cb-rail.is-user-paused .cb-dots__fill { animation-play-state: paused !important; }
@keyframes cb-fill-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes cb-fill { from { width: 0; } to { width: 100%; } }

/* 亮点卡 */
.cb-hl {
  position: relative; overflow: hidden; isolation: isolate;
  display: flex; flex-direction: column;
  width: min(84vw, 400px); height: 600px; border-radius: var(--r-lg);
  background: var(--card);
}
.cb-sec--ink .cb-hl, .cb-hl--ink { background: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line); }
.cb-hl--court { background: var(--court); }
.cb-hl__copy { padding: var(--s-6) var(--s-6) 0; }
.cb-hl__idx { display: block; margin-bottom: var(--s-3); font: 500 14px/1 var(--font-num); letter-spacing: .1em; color: var(--brand); }
.cb-hl__title { font: 700 24px/1.3 var(--font-display); font-synthesis: none; color: var(--chalk); }
.cb-hl__text { margin-top: var(--s-2); font-size: 15px; line-height: 1.65; color: var(--chalk-2); }
.cb-hl__media { position: relative; flex: 1; min-height: 0; margin-top: var(--s-5); display: flex; justify-content: center; align-items: flex-start; }
.cb-hl__media .cb-phone { --phone-w: 236px; }
.cb-hl__media--fill { margin-top: var(--s-5); }
.cb-hl__media--fill > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 734px) {
  .cb-hl { height: 520px; }
  .cb-hl__copy { padding: var(--s-5) var(--s-5) 0; }
  .cb-hl__title { font-size: 21px; }
  .cb-hl__media .cb-phone { --phone-w: 210px; }
}

/* 14. 会员价格 --------------------------------------------------------------- */
.cb-plans { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: var(--s-4); align-items: stretch; }
.cb-plan { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-6); }
.cb-plan__name { font: 700 22px/1.3 var(--font-display); font-synthesis: none; color: var(--chalk); }
.cb-plan__price { display: flex; align-items: baseline; gap: 6px; margin-top: var(--s-2); color: var(--chalk); }
.cb-plan__price .cb-num { font-size: var(--fs-price); font-weight: 500; line-height: 1; letter-spacing: -.01em; }
.cb-plan__per { font-size: 15px; color: var(--chalk-2); }
.cb-plan__note { font-size: 14px; line-height: 1.6; color: var(--chalk-2); }
.cb-plan__fine { margin-top: auto; padding-top: var(--s-4); font-size: 12px; line-height: 1.6; color: var(--chalk-3); }
.cb-plan__hl { display: inline-flex; align-self: flex-start; justify-self: start; align-items: center; height: 26px; padding: 0 10px; border-radius: var(--r-xs); background: var(--brand-faint); color: var(--brand); font-size: 13px; font-weight: 600; }
.cb-plan--free { border-radius: var(--r-lg); box-shadow: inset 0 0 0 1px var(--line-2); }
.cb-plan--free .cb-checks { margin-top: var(--s-4); }
.cb-plans__board {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  border-radius: var(--r-lg); background: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line);
  overflow: hidden;
}
.cb-plans__board > .cb-plan + .cb-plan { border-left: 1px solid var(--line); }
.cb-plan--key { position: relative; background: var(--court); }
.cb-plan--key::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--brand); }
.cb-plan--key .cb-plan__price { color: var(--brand); }
.cb-plans__perks { grid-column: 1 / -1; padding: var(--s-6); border-top: 1px solid var(--line); }
.cb-plans__perks-title { margin-bottom: var(--s-4); font: 500 13px/1 var(--font-num); letter-spacing: .1em; text-transform: uppercase; color: var(--chalk-3); }
.cb-plans__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4); margin-top: var(--s-6); }
@media (max-width: 1068px) {
  .cb-plans { grid-template-columns: minmax(0, 1fr); }
  /* 免费版横过来：左边名字和价格，右边两列权益 */
  .cb-plan--free { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: var(--s-6); align-items: start; }
  .cb-plan--free > .cb-plan__name, .cb-plan--free > .cb-plan__price { grid-column: 1; }
  .cb-plan--free > .cb-checks { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s-6); }
}
@media (max-width: 734px) {
  .cb-plan { padding: var(--s-5); }
  .cb-plan--free { display: flex; }
  .cb-plan--free > .cb-checks { margin-top: var(--s-4); grid-template-columns: minmax(0, 1fr); }
  .cb-plans__board { grid-template-columns: minmax(0, 1fr); }
  .cb-plans__board > .cb-plan { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--s-4); row-gap: 6px; align-items: baseline; }
  .cb-plans__board > .cb-plan + .cb-plan { border-left: 0; border-top: 1px solid var(--line); }
  .cb-plans__board > .cb-plan > * { grid-column: 1 / -1; }
  .cb-plans__board > .cb-plan > .cb-plan__name { grid-column: 1; }
  .cb-plans__board > .cb-plan > .cb-plan__price { grid-column: 2; grid-row: 1; margin-top: 0; }
  .cb-plans__board .cb-plan__fine { padding-top: 0; }
  .cb-plan--key::before { top: 0; bottom: 0; right: auto; width: 4px; height: auto; }
  .cb-plans__perks { padding: var(--s-5); }
}

/* 15. 用户声音 --------------------------------------------------------------- */
.cb-voice {
  display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-6);
  width: min(84vw, 380px); min-height: 280px; padding: var(--s-6);
  border-radius: var(--r-lg); background: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line);
}
.cb-sec--surface .cb-voice { background: var(--card); box-shadow: none; }
.cb-voice__quote { font-size: 19px; line-height: 1.7; color: var(--chalk); }
.cb-voice__quote::before { content: "\201C"; display: block; height: 36px; margin-bottom: 4px; font: 600 56px/1 var(--font-num); color: var(--brand); }
.cb-voice__who { display: flex; align-items: center; gap: 12px; }
.cb-voice__avatar {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 44px; height: 44px; border-radius: 50%; background: var(--brand); color: var(--brand-ink);
  font: 700 19px/1 var(--font-display); font-synthesis: none;
}
.cb-voice__name { font-size: 15px; font-weight: 600; color: var(--chalk); }
.cb-voice__src { font-size: 12px; color: var(--chalk-3); }
@media (max-width: 734px) { .cb-voice { min-height: 240px; padding: var(--s-5); } .cb-voice__quote { font-size: 17px; } }

/* 16. FAQ 手风琴 ------------------------------------------------------------- */
.cb-faq { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: var(--s-8); align-items: start; }
.cb-faq__head { position: sticky; top: var(--sticky-top); display: grid; gap: var(--s-5); }
.cb-faq__head > .cb-eyebrow { margin-bottom: 0; }
.cb-faq__list { border-top: 1px solid var(--line-2); }
.cb-faq__item { border-bottom: 1px solid var(--line); }
.cb-faq__q {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s-5);
  width: 100%; min-height: 76px; padding: var(--s-5) 0; border: 0; background: none;
  text-align: left; font-size: 19px; line-height: 1.5; font-weight: 600; color: var(--chalk);
}
.cb-faq__q:hover { color: #fff; }
.cb-faq__icon { position: relative; flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--ink-3); transition: background-color var(--dur-2) var(--ease); }
.cb-faq__icon::before, .cb-faq__icon::after { content: ""; position: absolute; left: 10px; top: 15.25px; width: 12px; height: 1.5px; border-radius: 1px; background: var(--chalk); transition: transform var(--dur-2) var(--ease), background-color var(--dur-2); }
.cb-faq__icon::after { transform: rotate(90deg); }
.cb-faq__item.is-open .cb-faq__icon { background: var(--brand); }
.cb-faq__item.is-open .cb-faq__icon::before, .cb-faq__item.is-open .cb-faq__icon::after { background: var(--brand-ink); transform: rotate(180deg); }
.cb-faq__a { display: grid; grid-template-rows: 1fr; }
.cb-faq__a > div { min-height: 0; overflow: hidden; }
.cb-faq__a p { max-width: 40em; padding: 0 56px var(--s-5) 0; font-size: 16px; line-height: 1.8; color: var(--chalk-2); }
.cb-faq__a p + p { margin-top: -8px; }
.cb-faq__a a { color: var(--chalk); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.cb-js .cb-faq__a { grid-template-rows: 0fr; transition: grid-template-rows var(--dur-2) var(--ease); }
.cb-js .cb-faq__item.is-open .cb-faq__a { grid-template-rows: 1fr; }
@media (max-width: 1068px) { .cb-faq { column-gap: var(--s-6); } }
@media (max-width: 734px) {
  .cb-faq { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-6); }
  .cb-faq__head { position: static; }
  .cb-faq__q { font-size: 17px; min-height: 64px; padding: 18px 0; }
  .cb-faq__a p { padding-right: 0; font-size: 15px; }
}

/* 17. 下载区：一块场地，中间一道网 ---------------------------------------------- */
.cb-dl {
  display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
  border-radius: var(--r-xl); background: var(--court); overflow: hidden;
}
.cb-dl__net { position: relative; background: var(--line-chalk); margin-block: var(--s-7); }
.cb-dl__net::before { content: ""; position: absolute; left: -6px; top: 50%; width: 13px; height: 1px; background: var(--line-chalk); }
.cb-dl__side { display: flex; flex-direction: column; gap: var(--s-4); padding: var(--s-8); }
.cb-dl__id { display: flex; align-items: center; gap: var(--s-4); margin-bottom: var(--s-3); }
.cb-dl__name { font: 700 36px/1.2 var(--font-display); font-synthesis: none; color: var(--chalk); }
.cb-dl__desc { font-size: 16px; line-height: 1.7; color: var(--chalk-2); max-width: 28em; }
.cb-dl__btns { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-3); }
/* 平台行：像应用商店里的「适用于」，设备名不在中间断行（下载区、App 页表盘下都用它） */
.cb-plat { font-size: 14px; line-height: 1.6; letter-spacing: .02em; color: var(--chalk-2); }
.cb-plat span { white-space: nowrap; color: var(--chalk); }
.cb-dl--pro-first .cb-dl__side:first-child { order: 3; }
.cb-dl--pro-first .cb-dl__net { order: 2; }
@media (max-width: 1068px) { .cb-dl__side { padding: var(--s-7) var(--s-6); } }
@media (max-width: 734px) {
  .cb-dl { grid-template-columns: minmax(0, 1fr); }
  .cb-dl__net { height: 1px; margin: 0 var(--s-5); }
  .cb-dl__net::before { left: 50%; top: -6px; width: 1px; height: 13px; }
  .cb-dl__side { padding: var(--s-6) var(--s-5); }
  .cb-dl__name { font-size: 28px; }
  .cb-dl--pro-first .cb-dl__side:first-child { order: 3; }
}

/* 18. 申请开通表单 ----------------------------------------------------------- */
.cb-apply { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--s-8); align-items: start; }
.cb-apply__copy { display: grid; gap: var(--s-5); position: sticky; top: var(--sticky-top); }
.cb-apply__copy > .cb-eyebrow { margin-bottom: 0; }
.cb-form { display: grid; gap: var(--s-5); padding: var(--s-7); border-radius: var(--r-xl); background: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line); }
.cb-sec--court .cb-form { background: var(--court-2); box-shadow: none; }
.cb-form__title { font: 700 28px/1.2 var(--font-display); font-synthesis: none; }
.cb-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5) var(--s-4); }
.cb-field { display: grid; gap: 8px; min-width: 0; }
.cb-field--full { grid-column: 1 / -1; }
.cb-field label, .cb-field__label { font-size: 14px; line-height: 1.4; color: var(--chalk-2); }
.cb-field label b { color: var(--brand); font-weight: 400; margin-left: 2px; }
.cb-input {
  width: 100%; height: 52px; padding: 0 16px; border: 0; border-radius: var(--r-sm);
  background: rgba(245, 245, 240, .06); color: var(--chalk);
  box-shadow: inset 0 0 0 1px var(--line-2);
  font-size: 16px; line-height: 1.4;
  transition: box-shadow var(--dur-1), background-color var(--dur-1);
  -webkit-appearance: none; appearance: none;
}
.cb-input::placeholder { color: rgba(245, 245, 240, .38); }
.cb-input:hover { background: rgba(245, 245, 240, .08); }
.cb-input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--brand); background: rgba(245, 245, 240, .08); }
.cb-input[aria-invalid="true"] { box-shadow: inset 0 0 0 2px #FF8A80; }
.cb-input[type="date"] { min-height: 52px; }
.cb-input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(.9); opacity: .7; }
.cb-form__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4); }
.cb-form__note { font-size: 13px; line-height: 1.6; color: var(--chalk-3); }
@media (max-width: 1068px) { .cb-apply { column-gap: var(--s-6); } .cb-form { padding: var(--s-6); } }
@media (max-width: 734px) {
  .cb-apply { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-6); }
  .cb-apply__copy { position: static; }
  .cb-form { padding: var(--s-5); border-radius: var(--r-lg); }
  .cb-form__grid { grid-template-columns: minmax(0, 1fr); }
  .cb-form__foot .cb-btn { width: 100%; }
}

/* 19. 页脚 ------------------------------------------------------------------- */
.cb-footer { position: relative; padding: var(--s-9) 0 calc(var(--s-6) + env(safe-area-inset-bottom, 0px)); background: var(--ink); border-top: 1px solid var(--line); overflow-x: clip; }
.cb-footer__sign { font: 700 clamp(48px, 9vw, 128px)/1 var(--font-display); font-synthesis: none; color: var(--chalk); margin-bottom: var(--s-8); }
.cb-footer__sign .cb-accent { color: var(--brand); }
.cb-footer__top { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: var(--s-8); padding-bottom: var(--s-7); }
.cb-footer__about { display: grid; gap: var(--s-4); align-content: start; }
.cb-footer__about img { height: 30px; width: auto; }
.cb-footer__about p { font-size: 14px; line-height: 1.75; color: var(--chalk-2); max-width: 26em; }
.cb-footer__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-6); }
.cb-footer__h { margin-bottom: var(--s-4); font: 500 13px/1 var(--font-zh); letter-spacing: .04em; color: var(--chalk-3); }   /* 标题都是中文，用正文字体；数字字体会把「稳啦 App」里的 App 显示成窄长的 Oswald */
.cb-footer__cols ul { display: grid; gap: 10px; }
.cb-footer__cols a { font-size: 14px; line-height: 1.5; color: var(--chalk-2); transition: color var(--dur-1); }
.cb-footer__cols a:hover { color: var(--chalk); }
.cb-footer__bottom {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-3) var(--s-6);
  padding-top: var(--s-5); border-top: 1px solid var(--line);
  font-size: 12px; line-height: 1.7; color: var(--chalk-3);
}
.cb-footer__beian { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 20px; }
.cb-footer__beian a { display: inline-flex; align-items: center; gap: 6px; color: var(--chalk-3); transition: color var(--dur-1); }
.cb-footer__beian a:hover { color: var(--chalk); }
.cb-footer__beian img { width: 16px; height: auto; }
@media (max-width: 1068px) {
  .cb-footer__top { grid-template-columns: minmax(0, 1fr); row-gap: var(--s-7); }
}
@media (max-width: 734px) {
  .cb-footer { padding-top: var(--s-8); }
  .cb-footer__sign { margin-bottom: var(--s-7); }
  .cb-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--s-6); }
  .cb-footer__bottom { flex-direction: column; align-items: flex-start; }
}

/* 20. 页内提示条（覆盖 shared/wl.js 的默认 .wl-notify） --------------------------- */
.wl-notify {
  top: calc(var(--nav-top) + var(--nav-h) + 12px + env(safe-area-inset-top, 0px));
  max-width: min(520px, calc(100% - 32px));
  padding: 14px 18px 14px 20px;
  border-radius: var(--r-sm);
  background: var(--ink-3);
  color: var(--chalk);
  font: 500 15px/1.6 var(--font-zh);
  text-align: left;
  box-shadow: inset 3px 0 0 var(--brand), inset 0 0 0 1px var(--line), var(--shadow-pop);
  transition: opacity var(--dur-2) var(--ease), transform var(--dur-2) var(--ease);
}

/* 21. 入场动效 ----------------------------------------------------------------- */
/* 只有 site.js 确认 IntersectionObserver 可用、且没开「减少动态」时才加 html.cb-anim；
   首屏元素在加 cb-anim 之前就标好 is-in，所以首屏不闪。 */
.cb-anim [data-cb-reveal]:not(.is-in) { opacity: 0; transform: translateY(30px); }
.cb-anim [data-cb-reveal] {
  transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-4) var(--ease);
  transition-delay: var(--cb-delay, 0s);
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .cb-livedot::before { animation: none; }
  .cb-anim [data-cb-reveal]:not(.is-in) { opacity: 1; transform: none; }
}
@media print {
  .cb-nav, .cb-localnav { display: none; }
  .cb-anim [data-cb-reveal]:not(.is-in) { opacity: 1; transform: none; }
}