/**
 * OPC 官网黑金设计令牌（Design Tokens）
 * 流程：令牌定义 → 基准排版 → 壳层/业务页 → Tailwind 工具类归一
 * 基准：正文 16px（移动端可读）、标题 1.25 阶梯、正文行高 1.5
 */

html[data-opc-theme='official'],
body[data-opc-theme='official'] {
  /* —— 字体族 —— */
  --opc-font-sans: "HarmonyOS Sans SC", -apple-system, sans-serif;

  /* —— 字号阶梯（px，避免 common 根字号 rem 漂移）—— */
  --opc-text-xs: 12px;
  --opc-text-sm: 14px;
  --opc-text-base: 16px;
  --opc-text-lg: 18px;
  --opc-text-xl: 20px;
  --opc-text-2xl: 24px;
  --opc-text-3xl: 28px;
  --opc-text-display: clamp(20px, 4.5vw, 30px);
  --opc-text-stat: clamp(22px, 5vw, 36px);
  --opc-nav-brand-title-size: clamp(16px, 4.8vw, 22px);

  /* V1.3 方案工作台原型（opc-v13-plan-workbench-prototype/styles.css） */
  --opc-v13-font-sans: "HarmonyOS Sans SC", -apple-system, sans-serif;
  --opc-v13-meta: 12px;
  --opc-v13-caption: 13px;
  --opc-v13-section: 13px;
  --opc-v13-ui: 14px;
  --opc-v13-brand: 16px;
  --opc-v13-body: 16px;
  --opc-v13-plan-body: 15px;
  --opc-v13-heading: 18px;
  --opc-v13-subheading: 22px;
  --opc-v13-display: 32px;
  --opc-v13-artifact-title: 18px;
  --opc-v13-line-chat: 1.65;
  --opc-v13-line-plan: 1.78;

  /* —— 行高 / 字重 —— */
  --opc-leading-tight: 1.25;
  --opc-leading-normal: 1.5;
  --opc-leading-relaxed: 1.625;
  --opc-weight-regular: 400;
  --opc-weight-medium: 500;
  --opc-weight-semibold: 600;
  --opc-weight-bold: 700;

  /* —— 背景 —— */
  --opc-bg-base: #070707;
  --opc-bg-mid: #120f0c;
  --opc-bg-deep: #090909;
  --opc-bg-panel: #050505;
  --opc-bg-surface: rgba(255, 255, 255, 0.035);
  --opc-bg-surface-raised: rgba(0, 0, 0, 0.24);
  --opc-bg-surface-accent: rgba(235, 205, 164, 0.08);

  /* —— 金色系 —— */
  --opc-gold-100: #fff6df;
  --opc-gold-200: #f0d49a;
  --opc-gold-300: #e6b980;
  --opc-gold-400: #d1a054;
  --opc-gold-500: #c4934a;
  --opc-gold-600: #8f6630;
  --opc-gold-text: rgba(235, 205, 164, 0.96);
  --opc-gold-text-soft: rgba(230, 196, 140, 0.95);
  --opc-gold-muted: rgba(212, 204, 184, 0.88);
  --opc-gold-border: rgba(235, 205, 164, 0.18);
  --opc-gold-border-strong: rgba(209, 160, 84, 0.42);
  --opc-gold-border-subtle: rgba(235, 205, 164, 0.12);
  /* 与 tools.css 图2 卡框描边一致（opc.html 创意对话 / AI 对话框） */
  /* 与订单核对弹窗（请核对订单）金描边一致；略提亮供使用说明/侧栏外框 */
  --opc-order-frame-gold: rgb(136, 120, 97);
  --opc-order-label-gold: #b8973e;
  --opc-order-value-gold: #e6c47a;
  --tools-fig2-frame-border:  rgb(180 163 125);/*rgb(245, 220, 175);*/
  --tools-fig2-frame-border-hover: rgb(255, 238, 205);
  /* tools 页工具列表卡描边（创意输出内嵌与之对齐） */
  --tools-catalog-card-edge: rgb(157 143 119);
  --tools-catalog-card-edge-soft: rgba(157, 143, 119, 0.35);
  --opc-tools-embed-frame-shadow: inset 0 0 0 1px var(--tools-catalog-card-edge);
  --tools-fig2-frame-shadow:
    0 0 16px rgba(232, 195, 140, 0.46),
    0 0 36px rgba(232, 195, 140, 0.18),
    0 12px 32px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(255, 248, 230, 0.1),
    inset 0 0 20px rgba(232, 195, 140, 0.09);
  --opc-conv-frame-shadow: var(--tools-fig2-frame-shadow);
  /* 图1：方案卡 / AI 对话外框（大圆角 + 顶底金光 + 立体阴影） */
  --opc-fig1-radius: 24px;
  --opc-fig1-radius-inner: 14px;
  --opc-fig1-bg: linear-gradient(180deg, #1c1a18 0%, #141210 38%, #0c0b0a 100%);
  --opc-fig1-inner-bg: linear-gradient(180deg, rgba(38, 35, 32, 0.96) 0%, rgba(20, 18, 16, 0.98) 100%);
  /* AI 对话消息区：略透底，露出页面金波背景（勿过透，保证可读） */
  --opc-fig1-chat-scroll-bg: linear-gradient(
    180deg,
    rgba(28, 26, 24, 0.48) 0%,
    rgba(12, 11, 10, 0.54) 100%
  );
  --opc-fig1-edge-glow: linear-gradient(
    90deg,
    transparent 0%,
    rgba(232, 195, 140, 0.18) 18%,
    rgba(255, 248, 230, 0.82) 50%,
    rgba(232, 195, 140, 0.18) 82%,
    transparent 100%
  );
  --opc-fig1-frame-shadow:
    inset 0 0 0 1px rgb(232, 195, 140),
    inset 0 1px 0 rgba(255, 248, 230, 0.12),
    0 10px 36px rgba(0, 0, 0, 0.55),
    0 0 42px rgba(232, 195, 140, 0.14);
  --opc-fig1-frame-shadow-hover:
    inset 0 0 0 1px rgb(245, 220, 180),
    inset 0 1px 0 rgba(255, 248, 230, 0.16),
    0 12px 40px rgba(0, 0, 0, 0.58),
    0 0 52px rgba(232, 195, 140, 0.22);
  /** 图2：我的方案列表卡外缘（会员页大块外框与之对齐） */
  --opc-plan-card-frame-shadow: var(--opc-fig1-frame-shadow);
  /** 图4：官网落地页 pl-card 内嵌模块 */
  --opc-module-panel-bg: #1a1a1c;
  --opc-module-panel-border: rgba(235, 205, 164, 0.35);
  --opc-gold-gradient-title: linear-gradient(
    180deg,
    #ffffff 0%,
    #f7e6bc 38%,
    #e6b980 58%,
    #c4934a 100%
  );
  --opc-gold-gradient-bar: linear-gradient(180deg, #f0d49a 0%, #e6b980 45%, #c4934a 100%);
  --opc-gold-gradient-btn: linear-gradient(180deg, #f0d49a 0%, #e6b980 100%);
  /* 官网主 CTA（去支付 / 查询 / 确认取消等）：与订阅「立即订阅」一致 */
  --opc-gold-gradient-cta: var(--opc-gold-gradient-bar);
  --opc-gold-gradient-orders-cta: var(--opc-gold-gradient-bar);
  --opc-semantic-danger: #FCA5A5;
  --opc-semantic-success: #02ad69f2;

  /* —— 天蓝主操作钮（与 Tailwind sky-500 一致）—— */
  --opc-sky-cta-bg: rgb(14 165 233 / var(--tw-bg-opacity, 1));
  --opc-sky-cta-bg-hover: rgb(2 132 199 / var(--tw-bg-opacity, 1));
  --opc-sky-cta-text: #ffffff;
  --opc-sky-outline-border: rgb(14 165 233 / var(--tw-bg-opacity, 1));
  --opc-sky-outline-text: #0f172a;

  /* —— 正文色阶 —— */
  --opc-text-primary: rgba(255, 255, 255, 0.94);
  --opc-text-secondary: rgba(255, 255, 255, 0.72);
  --opc-text-muted: rgba(255, 255, 255, 0.52);
  --opc-text-faint: rgba(255, 255, 255, 0.42);
  --opc-text-on-gold: #1a140d;

  /* —— 语义色 —— */
  --opc-danger-text: #FCA5A5;
  --opc-arrears-text: #FCA5A5;
  --opc-danger-border: rgba(244, 63, 94, 0.38);
  --opc-danger-bg: rgba(50, 12, 18, 0.32);

  /* —— 圆角 / 间距（组件级）—— */
  --opc-radius-sm: 12px;
  --opc-radius-md: 18px;
  --opc-radius-lg: 24px;
  --opc-radius-pill: 999px;
}

/** 锁定 OPC 模块根字号，避免整站 rem 缩放导致字号忽大忽小 */
html[data-opc-theme='official'] {
  font-size: 16px;
  background-color: var(--opc-bg-base, #070707);
}

body[data-opc-theme='official'] {
  font-family: var(--opc-font-sans);
  font-size: var(--opc-text-base);
  line-height: var(--opc-leading-normal);
  font-weight: var(--opc-weight-regular);
  color: var(--opc-text-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/** 黑金底图只铺 body 一层；内层勿再叠 opc-bg.webp（宽屏下 1720px 内层与全宽 body 会各绘一张，左右像「重复加载」） */
body[data-opc-theme='official']:not(.tools-page) {
  background-color: var(--opc-bg-deep);
  background-image:
    radial-gradient(ellipse 90% 55% at 50% -12%, rgba(232, 195, 140, 0.14) 0%, transparent 52%),
    radial-gradient(circle at 80% 100%, rgba(196, 147, 74, 0.06) 0%, transparent 40%),
    linear-gradient(180deg, var(--opc-bg-base) 0%, var(--opc-bg-mid) 42%, var(--opc-bg-deep) 100%);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: center top, 80% 100%, center center;
  background-size: auto, auto, auto;
  background-attachment: scroll, scroll, scroll;
}

body[data-opc-theme='official'] .opc-vue-stage,
body[data-opc-theme='official'] .opc-showcase,
body[data-opc-theme='official'] section.middle_con.black-bg,
body[data-opc-theme='official'] .opc-panel-wrap,
body[data-opc-theme='official'] .opc-panel-wrap > #app {
  background-color: transparent;
  background-image: none;
}

/** 会员页（订阅/算力/订单）：壳层不透明白底，避免下拉回弹露出浅色 */
body[data-opc-theme='official']:has(.opc-theme-page--subscription),
body[data-opc-theme='official']:has(.opc-theme-page--compute),
body[data-opc-theme='official']:has(.opc-theme-page--orders),
body[data-opc-theme='official']:has(.opc-theme-page--plans),
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail),
body[data-opc-theme='official']:has(.opc-theme-page--mgr) {
  background-color: var(--opc-ui-color-canvas);
  background-image: none;
  overflow: hidden;
  height: 100dvh;
  max-height: 100dvh;
}

body[data-opc-theme='official']:has(.opc-theme-page--subscription) #opc-site-header-root,
body[data-opc-theme='official']:has(.opc-theme-page--compute) #opc-site-header-root,
body[data-opc-theme='official']:has(.opc-theme-page--orders) #opc-site-header-root,
body[data-opc-theme='official']:has(.opc-theme-page--plans) #opc-site-header-root,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) #opc-site-header-root,
body[data-opc-theme='official']:has(.opc-theme-page--subscription) .nav_mobile,
body[data-opc-theme='official']:has(.opc-theme-page--compute) .nav_mobile,
body[data-opc-theme='official']:has(.opc-theme-page--orders) .nav_mobile,
body[data-opc-theme='official']:has(.opc-theme-page--plans) .nav_mobile,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) .nav_mobile,
body[data-opc-theme='official']:has(.opc-theme-page--subscription) .nav_m_con,
body[data-opc-theme='official']:has(.opc-theme-page--compute) .nav_m_con,
body[data-opc-theme='official']:has(.opc-theme-page--orders) .nav_m_con,
body[data-opc-theme='official']:has(.opc-theme-page--plans) .nav_m_con,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) .nav_m_con {
  background-color: var(--opc-ui-color-canvas);
  background-image: none;
}

body[data-opc-theme='official']:has(.opc-theme-page--subscription) .opc-showcase,
body[data-opc-theme='official']:has(.opc-theme-page--subscription) .opc-showcase-inner,
body[data-opc-theme='official']:has(.opc-theme-page--subscription) section.middle_con.black-bg,
body[data-opc-theme='official']:has(.opc-theme-page--subscription) .opc-panel-wrap,
body[data-opc-theme='official']:has(.opc-theme-page--subscription) .opc-panel-wrap > #app,
body[data-opc-theme='official']:has(.opc-theme-page--subscription) .opc-switch-bar,
body[data-opc-theme='official']:has(.opc-theme-page--compute) .opc-showcase,
body[data-opc-theme='official']:has(.opc-theme-page--compute) .opc-showcase-inner,
body[data-opc-theme='official']:has(.opc-theme-page--compute) section.middle_con.black-bg,
body[data-opc-theme='official']:has(.opc-theme-page--compute) .opc-panel-wrap,
body[data-opc-theme='official']:has(.opc-theme-page--compute) .opc-panel-wrap > #app,
body[data-opc-theme='official']:has(.opc-theme-page--compute) .opc-switch-bar,
body[data-opc-theme='official']:has(.opc-theme-page--orders) .opc-showcase,
body[data-opc-theme='official']:has(.opc-theme-page--orders) .opc-showcase-inner,
body[data-opc-theme='official']:has(.opc-theme-page--orders) section.middle_con.black-bg,
body[data-opc-theme='official']:has(.opc-theme-page--orders) .opc-panel-wrap,
body[data-opc-theme='official']:has(.opc-theme-page--orders) .opc-panel-wrap > #app,
body[data-opc-theme='official']:has(.opc-theme-page--orders) .opc-switch-bar,
body[data-opc-theme='official']:has(.opc-theme-page--plans) .opc-showcase,
body[data-opc-theme='official']:has(.opc-theme-page--plans) .opc-showcase-inner,
body[data-opc-theme='official']:has(.opc-theme-page--plans) section.middle_con.black-bg,
body[data-opc-theme='official']:has(.opc-theme-page--plans) .opc-panel-wrap,
body[data-opc-theme='official']:has(.opc-theme-page--plans) .opc-panel-wrap > #app,
body[data-opc-theme='official']:has(.opc-theme-page--plans) .opc-switch-bar,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) .opc-showcase,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) .opc-showcase-inner,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) section.middle_con.black-bg,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) .opc-panel-wrap,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) .opc-panel-wrap > #app,
body[data-opc-theme='official']:has(.opc-theme-page--plan-detail) .opc-switch-bar {
  background-color: var(--opc-ui-color-canvas);
  background-image: none;
}

/* —— 官网壳层（opc.html 静态区）—— */
body[data-opc-theme='official'] .opc-workspace-head p,
body[data-opc-theme='official'] .opc-showcase-head p,
body[data-opc-theme='official'] .opc-section-head-text p {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-relaxed);
  color: var(--opc-text-muted);
}

body[data-opc-theme='official'] .opc-showcase-head .opc-prefill-lead {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-relaxed);
  color: var(--opc-gold-text-soft);
}

body[data-opc-theme='official'] .opc-switch-btn {
  font-size: clamp(13px, 3.5vw, 16px);
  font-weight: var(--opc-weight-medium);
  line-height: var(--opc-leading-tight);
  color: var(--opc-gold-text-soft);
}

body[data-opc-theme='official'] .opc-section-head-text h2 {
  font-size: var(--opc-text-2xl);
  font-weight: var(--opc-weight-semibold);
  line-height: var(--opc-leading-tight);
  color: var(--opc-text-primary);
}

body[data-opc-theme='official'] .opc-heading-gold-size {
  font-size: var(--opc-text-display);
  line-height: var(--opc-leading-tight);
  font-weight: var(--opc-weight-bold);
  letter-spacing: 0.06em;
}

/* —— Vue 业务页根：统一基准与标题阶梯 —— */
body[data-opc-theme='official'] .opc-theme-page,
body[data-opc-theme='official'] .opc-panel-wrap > #app {
  font-family: var(--opc-font-sans);
  font-size: var(--opc-text-base);
  line-height: var(--opc-leading-normal);
  color: var(--opc-text-primary);
}

body[data-opc-theme='official'] .opc-theme-page h1 {
  font-size: var(--opc-type-heading-lg, 22px);
  line-height: var(--opc-leading-tight);
  font-weight: var(--opc-weight-bold);
}

body[data-opc-theme='official'] .opc-theme-page h2:not(.opc-plan-feedback__title) {
  font-size: var(--opc-text-2xl);
  line-height: var(--opc-leading-tight);
  font-weight: var(--opc-weight-semibold);
}

body[data-opc-theme='official'] .opc-theme-page h3:not(.opc-execution-inline-card__title) {
  font-size: var(--opc-type-heading, 18px);
  line-height: var(--opc-leading-tight);
  font-weight: var(--opc-weight-semibold);
}

body[data-opc-theme='official'] .opc-theme-page h4 {
  font-size: var(--opc-text-lg);
  line-height: var(--opc-leading-tight);
  font-weight: var(--opc-weight-semibold);
}

body[data-opc-theme='official'] .opc-theme-page li {
  font-size: var(--opc-text-base);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page label,
body[data-opc-theme='official'] .opc-theme-page .auth-label {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page button:not([class*='opc-workbench-sidebar__']),
body[data-opc-theme='official'] .opc-theme-page .auth-btn {
  font-size: var(--opc-type-button, 12px);
  line-height: var(--opc-leading-tight);
}

body[data-opc-theme='official'] .opc-theme-page input,
body[data-opc-theme='official'] .opc-theme-page textarea,
body[data-opc-theme='official'] .opc-theme-page select {
  font-size: var(--opc-text-base);
  line-height: var(--opc-leading-normal);
}

/* Tailwind 字号工具类归一（覆盖组件内零散 text-*） */
body[data-opc-theme='official'] .opc-theme-page .text-\[11px\],
body[data-opc-theme='official'] .opc-theme-page .text-\[0\.6875rem\] {
  font-size: var(--opc-text-xs);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page .text-\[13px\],
body[data-opc-theme='official'] .opc-theme-page .text-\[0\.8125rem\] {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page .text-\[0\.975rem\] {
  font-size: var(--opc-text-base);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page .text-xs {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page .text-sm {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page .text-base {
  font-size: var(--opc-text-base);
  line-height: var(--opc-leading-normal);
}

body[data-opc-theme='official'] .opc-theme-page .text-lg {
  font-size: var(--opc-text-lg);
  line-height: var(--opc-leading-tight);
}

body[data-opc-theme='official'] .opc-theme-page .text-xl {
  font-size: var(--opc-text-xl);
  line-height: var(--opc-leading-tight);
}

body[data-opc-theme='official'] .opc-theme-page .text-2xl {
  font-size: var(--opc-text-2xl);
  line-height: var(--opc-leading-tight);
}

body[data-opc-theme='official'] .opc-theme-page .text-\[0\.9375rem\] {
  font-size: var(--opc-text-sm);
}

/* 金色强调文案 */
body[data-opc-theme='official'] .opc-text-gold,
body[data-opc-theme='official'] .opc-theme-page .text-\[\#e6c47a\],
body[data-opc-theme='official'] .opc-theme-page .text-sky-900:where(.font-medium) {
  color: var(--opc-gold-text);
}

/* 算力 / 购买等业务组件字号对齐 */
body[data-opc-theme='official'] .opc-power-stat label,
body[data-opc-theme='official'] .opc-power-total label,
body[data-opc-theme='official'] .opc-power-arrears-title {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-normal);
  color: var(--opc-text-muted);
}

body[data-opc-theme='official'] .opc-power-stat strong,
body[data-opc-theme='official'] .opc-power-total-num {
  font-size: 24px;
  line-height: var(--opc-leading-tight);
  color: var(--opc-gold-text);
}

body[data-opc-theme='official'] .opc-power-arrears-hint {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-relaxed);
  color: var(--opc-text-faint);
}

body[data-opc-theme='official'] .opc-theme-page--compute .opc-power-table th,
body[data-opc-theme='official'] .opc-theme-page--compute .opc-compute-logs-pager-meta,
body[data-opc-theme='official'] .opc-theme-page--compute .opc-compute-logs-pager-index,
body[data-opc-theme='official'] .opc-theme-page--compute .opc-compute-logs-pager-btn {
  font-size: var(--opc-text-sm);
}

body[data-opc-theme='official'] .text-amber-200\/90 {
  color: #f8e5ba;
}

body[data-opc-theme='official'] .opc-power-arrears-val {
  font-size: 24px;
  line-height: var(--opc-leading-tight);
}

body[data-opc-theme='official'] .opc-power-arrears--due .opc-power-arrears-val,
body[data-opc-theme='official'] .opc-power-total-num.opc-power-total-num--negative {
  color: var(--opc-danger-text, #fda4af);
}

body[data-opc-theme='official'] .opc-official-pay-opt {
  font-size: var(--opc-text-base);
}

body[data-opc-theme='official'] .opc-official-pkg-badge {
  font-size: var(--opc-text-sm);
}

body[data-opc-theme='official'] .opc-official-pkg-name {
  font-size: var(--opc-text-base);
}

body[data-opc-theme='official'] .opc-official-pkg-points-num,
body[data-opc-theme='official'] .opc-official-pkg-yuan-num {
  font-size: var(--opc-text-lg);
}

body[data-opc-theme='official'] .opc-official-pkg-unit,
body[data-opc-theme='official'] .opc-official-pkg-detail,
body[data-opc-theme='official'] .opc-official-purchase-foot,
body[data-opc-theme='official'] .opc-official-packages-empty {
  font-size: var(--opc-text-sm);
}

body[data-opc-theme='official'] .opc-theme-page--plans button.opc-plan-view-detail-btn {
  font-size: var(--opc-type-button, 12px);
}

body[data-opc-theme='official'] .opc-theme-page--plan-detail article button.opc-plan-detail-back-btn {
  font-size: var(--opc-type-button, 12px);
}

/* 顶栏可靠性提示条 */
body[data-opc-theme='official'] .opc-official-embed-auth-banner {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-normal);
}

/* 登录注册浮层标题 */
body[data-opc-theme='official'] .auth-card-title {
  font-size: var(--opc-text-3xl);
  line-height: var(--opc-leading-tight);
  letter-spacing: 0.12em;
}

body[data-opc-theme='official'] .auth-label {
  font-size: var(--opc-text-sm);
}

body[data-opc-theme='official'] .auth-input {
  font-size: var(--opc-text-base);
}

body[data-opc-theme='official'] .auth-muted-line,
body[data-opc-theme='official'] .auth-help,
body[data-opc-theme='official'] .auth-foot-note,
body[data-opc-theme='official'] .auth-static-tip {
  font-size: var(--opc-text-sm);
  line-height: var(--opc-leading-relaxed);
}

body[data-opc-theme='official'] .auth-btn {
  font-size: var(--opc-type-button, 12px);
}

body[data-opc-theme='official'] .auth-btn-code {
  font-size: var(--opc-type-button, 12px);
}

/* 窄屏：字号随视口缩放，避免固定 px 在小屏/大屏上失衡 */
@media (max-width: 768px) {
  html[data-opc-theme='official'],
  body[data-opc-theme='official'] {
    --opc-text-xs: clamp(11px, 2.9vw, 12px);
    --opc-text-sm: clamp(12px, 3.2vw, 14px);
    --opc-text-base: clamp(14px, 3.75vw, 16px);
    --opc-text-lg: clamp(15px, 4vw, 18px);
    --opc-text-xl: clamp(16px, 4.2vw, 20px);
    --opc-text-2xl: clamp(18px, 4.8vw, 24px);
    --opc-text-display: clamp(18px, 4.5vw, 26px);
    --opc-nav-brand-title-size: clamp(12px, 3.2vw, 15px);
  }

  body[data-opc-theme='official']:not(.tools-page) {
    background-attachment: scroll, scroll, scroll, scroll;
  }
}

/* 抵消 common.css 在 ≤320px 将 html 设为 20px 导致 rem 顶栏/logo 过大 */
@media (max-width: 320px) {
  html[data-opc-theme='official'] {
    font-size: 16px;
  }
}