/* ==========================================================================
   HAIRUNWEI TECH Audio Studio 页面样式（/studio、/studio/devices、/studio/support）
   移植说明：本文件由 Next 版 app/(public)/studio/studio.css 原样移植（2026-09-15）。
   仅依赖 globals.css 的通用令牌（间距/圆角/字体/文本色），这些令牌在
   assets/css/style.css 中同名同值，故无需改动。本页自有令牌 --fs-* 自带于本文件。
   · 全部类名以 .fs- 前缀，作用域隔离，不影响站点其它页面
   · 颜色/间距/圆角/动效全部复用 globals.css 设计令牌
   · 视觉基调（2026-09-15 R2 确立品牌分工）：
     HAIRUNWEI 主站 = 深蓝黑 + 科技蓝（芯片 / 研发 / 制造）
     本页   = 中性黑灰 + 香槟金（未来音频品牌）
     两个品牌刻意用不同色相，避免看起来是同一套皮。
     不使用大面积蓝、霓虹、RGB、粒子动画
   ========================================================================== */

/* ---------- 音频工作室品牌局部令牌（2026-09-15 R2） ----------
   只在本页生效。这里刻意不使用 --brand-* 系列 —— 那属于主站的科技蓝体系，
   本页需要自己的一套色相，两个品牌才区分得开。 */
:root {
  --fs-bg-solid:       #141417;                              /* 深底块（FAQ / 生态格） */
  --fs-bg-panel:       rgba(35, 35, 40, 0.72);               /* 主面板 */
  --fs-bg-panel-soft:  rgba(45, 45, 52, 0.52);               /* 次级面板 */
  --fs-grad-card:      linear-gradient(180deg, #1F1F23 0%, #19191D 100%);
  --fs-line:           #2E2E34;
  --fs-line-strong:    #3A3A41;
  --fs-gold:           rgba(184, 148, 89, 0.92);              /* 香槟金：唯一强调色 */
  --fs-gold-line:      rgba(184, 148, 89, 0.30);
  --fs-gold-soft:      rgba(184, 148, 89, 0.07);
  --fs-shadow-card:    inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 10px 26px rgba(0, 0, 0, 0.46);
  --fs-shadow-card-h:  inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 18px 40px rgba(0, 0, 0, 0.58);
}

@keyframes fs-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .fs-hero-copy > *, .fs-hero-visual, .fs-showcase, .fs-card, .fs-device, .fs-soon-card { animation: none !important; }
  .fs-card, .fs-device, .fs-cta, .fs-nav-item, .fs-shot { transition: none !important; }
  .fs-card:hover, .fs-device:hover, .fs-cta:hover { transform: none !important; }
}

/* 金属细分隔线（克制使用） */
.fs-hairline {
  height: 1px;
  border: 0;
  margin: 0;
  background: linear-gradient(90deg, transparent, rgba(184, 148, 89, 0.42), transparent);
}

/* ==========================================================
   一、Studio 二级导航（位于站点主导航之下）
   ========================================================== */
.fs-nav {
  /* 站点头部是 position:fixed（高 --header-h），这里必须留出偏移并吸顶在其下方 */
  position: sticky;
  top: var(--header-h);
  z-index: 90;
  margin-top: var(--header-h);
  border-bottom: 1px solid var(--line);
  background: rgba(24, 24, 28, 0.86);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.fs-nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  min-height: 46px;
  padding-top: 6px;
  padding-bottom: 6px;
}
.fs-nav-brand { display: inline-flex; align-items: baseline; gap: 10px; }
.fs-nav-brand-main {
  font-family: var(--font-display);
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: 0.22em;
  color: var(--text-1);
}
.fs-nav-brand-sub {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.12em;
  color: var(--text-3);
  padding-left: 10px;
  border-left: 1px solid var(--line-strong);
}
.fs-nav-menu { display: flex; align-items: center; gap: var(--space-5); flex-wrap: wrap; }
.fs-nav-item {
  position: relative;
  font-size: var(--fs-sm);
  color: var(--text-2);
  padding: 4px 0;
  transition: color var(--t-fast) var(--ease);
}
a.fs-nav-item:hover { color: var(--text-1); }
.fs-nav-item.active { color: var(--text-1); }
.fs-nav-item.active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -7px;
  height: 2px;
  background: var(--fs-gold);
  border-radius: var(--r-pill);
}
.fs-nav-item.is-soon {
  color: var(--text-3);
  cursor: default;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.fs-nav-item.is-soon i {
  font-style: normal;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  color: rgba(184, 148, 89, 0.85);
  border: 1px solid rgba(184, 148, 89, 0.28);
  border-radius: var(--r-pill);
  padding: 1px 7px;
}

/* ==========================================================
   二、Hero（左文案 + 右软件界面）
   ========================================================== */
.fs-hero {
  position: relative;
  overflow: hidden;
  padding: var(--space-16) 0 var(--space-16);
}
.fs-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse 78% 70% at 32% 30%, #000 22%, transparent 76%);
  mask-image: radial-gradient(ellipse 78% 70% at 32% 30%, #000 22%, transparent 76%);
  pointer-events: none;
}
.fs-hero::after {
  content: '';
  position: absolute;
  left: 14%;
  top: -18%;
  width: min(760px, 86vw);
  height: 420px;
  background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
  pointer-events: none;
}
.fs-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, 1fr);
  gap: var(--space-16);
  align-items: center;
}
.fs-hero-copy > * { animation: fs-in var(--t-slow) var(--ease-out) both; }
.fs-hero-copy > *:nth-child(1) { animation-delay: 0ms; }
.fs-hero-copy > *:nth-child(2) { animation-delay: 60ms; }
.fs-hero-copy > *:nth-child(3) { animation-delay: 110ms; }
.fs-hero-copy > *:nth-child(4) { animation-delay: 160ms; }
.fs-hero-copy > *:nth-child(5) { animation-delay: 210ms; }
.fs-hero-copy > *:nth-child(6) { animation-delay: 260ms; }

.fs-eyebrow {
  display: inline-block;
  padding: 5px 12px;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.2em;
  color: var(--fs-gold);
  background: var(--fs-gold-soft);
  border: 1px solid var(--fs-gold-line);
  border-radius: var(--r-pill);
}
.fs-h1 {
  margin-top: var(--space-5);
  font-family: var(--font-display);
  font-size: clamp(30px, 4.4vw, 52px);
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: -0.012em;
  color: var(--text-1);
}
.fs-brandline {
  margin-top: var(--space-4);
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  letter-spacing: 0.2em;
  color: rgba(184, 148, 89, 0.88);
}
.fs-lead {
  margin-top: var(--space-5);
  font-size: clamp(var(--fs-base), 1.5vw, var(--fs-xl));
  color: var(--text-2);
  line-height: 1.8;
  max-width: 34em;
}
/* ★ 2026-10-05：Hero 品牌支持行 —— 让 FIDESEN 等品牌用户扫码落地后立刻确认「来对了地方」
   （用户场景：随 FIDESEN 产品附赠二维码，落地页需明确支持品牌，避免陌生感） */
.fs-lead-brand {
  display: block;
  margin-top: 6px;
  font-size: var(--fs-sm);
  letter-spacing: 0.02em;
  color: rgba(184, 148, 89, 0.92);
}
.fs-aux {
  margin-top: var(--space-4);
  font-size: var(--fs-sm);
  color: var(--text-3);
}
.fs-hero-cta {
  margin-top: var(--space-8);
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  flex-wrap: wrap;
}
.fs-cta-cell { display: inline-flex; flex-direction: column; gap: 6px; }
.fs-cta {
  box-shadow: 0 0 0 rgba(184, 148, 89, 0);
  transition: box-shadow var(--t-base) var(--ease), transform var(--t-fast) var(--ease);
}
.fs-cta:hover { box-shadow: 0 0 26px rgba(184, 148, 89, 0.22); transform: translateY(-1px); }
.fs-hint {
  font-style: normal;
  font-size: var(--fs-xs);
  color: rgba(212, 188, 134, 0.9);
  max-width: 22em;
  line-height: 1.6;
}

/* 设备状态（客户端检测结果） */
.fs-status {
  margin-top: var(--space-6);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--fs-bg-panel-soft);
  font-size: var(--fs-sm);
  color: var(--text-2);
}
.fs-status.is-compact { margin-top: var(--space-4); font-size: var(--fs-xs); padding: 5px 12px; }
.fs-status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-300); flex: none; }
.fs-status-dot.is-on { background: var(--fs-gold); box-shadow: 0 0 8px rgba(184, 148, 89, 0.7); }
.fs-status-dot.is-wait { background: var(--text-3); }
.fs-status-dot.is-off { background: var(--ink-300); }
.fs-status-text { white-space: nowrap; }
.fs-status-sub { color: var(--text-3); }
.fs-status-btn {
  margin-left: 4px;
  padding: 3px 10px;
  font-size: var(--fs-xs);
  color: var(--text-1);
  background: transparent;
  border: 1px solid var(--ink-200);
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.fs-status-btn:hover { border-color: var(--fs-gold-line); background: var(--fs-gold-soft); }

/* 禁用态（未开发功能一律不可点，避免产生假入口） */
.btn.is-disabled,
.fs-nav-item.is-soon {
  opacity: 0.72;
  cursor: default;
  pointer-events: none;
}
.fs-feat.is-soon { color: var(--text-3); }
.fs-feat.is-soon::before { background-color: rgba(255, 255, 255, 0.22); }
.fs-device-foot .fs-cta-cell { width: 100%; }
.fs-device-foot .btn { width: 100%; justify-content: center; }

/* Hero 右侧软件界面（只露上部，形成"预览"感） */
.fs-hero-visual {
  position: relative;
  animation: fs-in var(--t-slow) 120ms var(--ease-out) both;
}
.fs-hero-visual::before {
  content: '';
  position: absolute;
  inset: 8% 6% -6% 6%;
  background: radial-gradient(ellipse at center, rgba(184, 148, 89, 0.06) 0%, rgba(184, 148, 89, 0) 72%);
  pointer-events: none;
}
.fs-shot {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-xl);
  background: var(--fs-bg-solid);
  box-shadow: var(--shadow-xl), 0 0 0 1px rgba(255, 255, 255, 0.04);
  transition: transform var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease);
}
.fs-shot:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-xl), 0 0 34px rgba(184, 148, 89, 0.12);
}
.fs-shot--peek { height: 300px; object-fit: cover; object-position: top center; }

/* ==========================================================
   三、移动端轻提示
   ========================================================== */
.fs-notice {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin: 0 auto var(--space-8);
  max-width: var(--container);
  padding: 12px 16px;
  border: 1px solid var(--fs-gold-line);
  border-radius: var(--r-lg);
  background: var(--fs-gold-soft);
  font-size: var(--fs-sm);
  color: var(--text-2);
}
.fs-notice strong { color: var(--text-1); font-weight: 600; }

/* ==========================================================
   四、软件展示区
   ========================================================== */
.fs-showcase { max-width: 1120px; margin: 0 auto; animation: fs-in var(--t-slow) var(--ease-out) both; }
.fs-showcase-head { text-align: center; margin-bottom: var(--space-6); }
.fs-showcase-title {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-xl), 2.6vw, var(--fs-3xl));
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text-1);
  margin-top: var(--space-3);
}
.fs-tags { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
.fs-tag {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.06em;
  color: var(--text-2);
  padding: 5px 12px;
  border: 1px solid var(--fs-line-strong);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.02);
}
.fs-showcase-shot { margin-top: var(--space-8); }
.fs-caption { margin-top: var(--space-4); text-align: center; font-size: var(--fs-xs); color: var(--text-3); }

/* ==========================================================
   五、核心功能（3 卡）
   ========================================================== */
.fs-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); margin-top: var(--space-10); }
.fs-card {
  padding: var(--space-6);
  background: var(--fs-grad-card);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  box-shadow: var(--fs-shadow-card);
  transition: transform var(--t-base) var(--ease), border-color var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease);
}
.fs-card:hover { transform: translateY(-2px); border-color: var(--fs-line-strong); box-shadow: var(--fs-shadow-card-h); }
.fs-card-no { font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: 0.16em; color: rgba(184, 148, 89, 0.9); }
.fs-card-title { margin-top: var(--space-4); font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
.fs-card-desc { margin-top: var(--space-2); font-size: var(--fs-sm); line-height: 1.8; color: var(--text-2); }

/* ==========================================================
   六、支持设备（数据驱动卡片）
   ========================================================== */
.fs-devices { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); margin-top: var(--space-10); }
.fs-device {
  display: flex;
  flex-direction: column;
  padding: var(--space-6);
  background: var(--fs-bg-panel);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  box-shadow: var(--fs-shadow-card);
  transition: transform var(--t-base) var(--ease), border-color var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease);
}
.fs-device:hover { transform: translateY(-2px); border-color: var(--fs-line-strong); box-shadow: var(--fs-shadow-card-h); }
.fs-device-brand { font-family: var(--font-display); font-size: var(--fs-xs); letter-spacing: 0.24em; color: var(--text-3); }
.fs-device-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.fs-device-status {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  padding: 2px 8px;
  border-radius: var(--r-pill);
  border: 1px solid var(--ink-200);
  color: var(--text-2);
  flex: none;
}
.fs-device-status.is-developing { color: var(--fs-gold); border-color: var(--fs-gold-line); background: var(--fs-gold-soft); }
.fs-device-status.is-pending { color: rgba(184, 148, 89, 0.9); border-color: rgba(184, 148, 89, 0.28); }
.fs-device-model { margin-top: var(--space-3); font-family: var(--font-mono); font-size: var(--fs-2xl); letter-spacing: 0.02em; color: var(--text-1); }
.fs-device-type { margin-top: 4px; font-size: var(--fs-xs); letter-spacing: 0.06em; color: var(--text-3); }
.fs-device-feats { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--line); display: grid; gap: 6px; }

/* 卡片上的「连接状态」（按 PID 判断是哪一台连着，客户端检测） */
.fs-device-conn {
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.fs-device-conn-k { font-size: var(--fs-xs); letter-spacing: 0.06em; color: var(--text-3); }
.fs-device-conn-v {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-xs);
  color: var(--text-3);
}
.fs-device-conn-v.is-on { color: var(--fs-gold); }
.fs-feat { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); color: var(--text-2); }
.fs-feat::before {
  content: '';
  width: 12px;
  height: 12px;
  flex: none;
  background-color: rgba(184, 148, 89, 0.85);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M6.2 11.8 2.6 8.2l1.3-1.3 2.3 2.3 5.9-5.9 1.3 1.3z'/></svg>") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M6.2 11.8 2.6 8.2l1.3-1.3 2.3 2.3 5.9-5.9 1.3 1.3z'/></svg>") center / contain no-repeat;
}
.fs-device-foot { margin-top: auto; padding-top: var(--space-5); }
.fs-device-more {
  grid-column: 1 / -1;
  padding: var(--space-4) var(--space-6);
  border: 1px dashed var(--fs-line-strong);
  border-radius: var(--r-lg);
  text-align: center;
  font-size: var(--fs-sm);
  color: var(--text-3);
}

/* 产品线规划（总表「预留」型号：整体标注规划中，不与「支持设备」混淆） */
.fs-roadmap {
  margin-top: var(--space-10);
  padding: var(--space-6);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
}
.fs-roadmap-head { display: flex; align-items: baseline; gap: var(--space-4); flex-wrap: wrap; }
.fs-roadmap-title { font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
.fs-roadmap-note { font-size: var(--fs-xs); color: var(--text-3); }
.fs-roadmap-groups { margin-top: var(--space-5); display: grid; gap: 1px; background: var(--fs-line); border-radius: var(--r-md); overflow: hidden; }
.fs-roadmap-group { display: grid; grid-template-columns: 120px 1fr; gap: var(--space-4); align-items: start; padding: var(--space-4) var(--space-5); background: var(--fs-bg-solid); }
.fs-roadmap-label { font-size: var(--fs-sm); color: var(--text-2); padding-top: 3px; }
.fs-roadmap-models { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.fs-roadmap-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 4px 10px;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--text-2);
  border: 1px solid var(--fs-line-strong);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.02);
}
.fs-roadmap-chip i { font-style: normal; font-size: 10px; color: var(--text-3); }

/* ==========================================================
   七、更多能力（麦克风 / 固件升级：敬请期待）
   ========================================================== */
.fs-soon-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-5); margin-top: var(--space-10); }
.fs-soon-card {
  display: flex;
  flex-direction: column;
  padding: var(--space-6);
  border: 1px dashed var(--fs-line-strong);
  border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
}
.fs-soon-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.fs-soon-title { font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
.fs-soon-badge {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  color: rgba(184, 148, 89, 0.9);
  border: 1px solid rgba(184, 148, 89, 0.28);
  border-radius: var(--r-pill);
  padding: 2px 8px;
  flex: none;
}
.fs-soon-en { margin-top: var(--space-2); font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: 0.12em; color: var(--text-3); }
.fs-soon-desc { margin-top: var(--space-4); font-size: var(--fs-sm); line-height: 1.8; color: var(--text-2); }
.fs-soon-card.is-disabled { cursor: default; }

/* ==========================================================
   八、使用说明 / 兼容性
   ========================================================== */
.fs-compat { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); margin-top: var(--space-10); }
/* 条目数为 4 时用 2×2，避免 3 列出现孤行 */
.fs-compat.is-2 { grid-template-columns: repeat(2, 1fr); }
.fs-compat-item { padding: var(--space-5) var(--space-6); border: 1px solid var(--fs-line); border-radius: var(--r-lg); background: var(--fs-bg-panel-soft); }
.fs-compat-k { font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: 0.12em; color: var(--text-3); }
.fs-compat-v { margin-top: var(--space-3); font-size: var(--fs-sm); line-height: 1.85; color: var(--text-2); }
.fs-usage {
  max-width: 820px;
  margin: var(--space-10) auto 0;
  text-align: center;
  font-size: var(--fs-xs);
  line-height: 1.95;
  color: var(--text-3);
}

/* ==========================================================
   九、设备中心页（/studio/devices）
   ========================================================== */
.fs-dc-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-6); flex-wrap: wrap; }
.fs-dc-title { margin-top: var(--space-4); font-family: var(--font-display); font-size: clamp(var(--fs-2xl), 3.2vw, var(--fs-4xl)); font-weight: 700; letter-spacing: -0.01em; color: var(--text-1); }
.fs-dc-sub { margin-top: var(--space-3); font-size: var(--fs-base); color: var(--text-2); }
.fs-dc-panel {
  margin-top: var(--space-10);
  padding: var(--space-6);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
}
.fs-dc-panel-title { font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
.fs-kv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-6); }
.fs-kv-item { padding-top: var(--space-4); border-top: 1px solid var(--line); }
.fs-kv-k { font-size: var(--fs-xs); letter-spacing: 0.08em; color: var(--text-3); }
.fs-kv-v { margin-top: var(--space-2); font-family: var(--font-mono); font-size: var(--fs-lg); color: var(--text-1); }
.fs-kv-v.is-muted { color: var(--text-3); font-size: var(--fs-sm); }
.fs-dc-actions { display: flex; gap: var(--space-4); flex-wrap: wrap; margin-top: var(--space-6); }
.fs-dc-note { margin-top: var(--space-5); font-size: var(--fs-xs); line-height: 1.9; color: var(--text-3); }
.fs-dc-block { padding-top: var(--space-4); }

/* ==========================================================
   十、Hero 设备连接状态模块
   ========================================================== */
.fs-conn {
  margin-top: var(--space-8);
  max-width: 520px;
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
  animation: fs-in var(--t-slow) var(--ease-out) both;
  animation-delay: 300ms;
}
.fs-conn-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.fs-conn-label {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.12em;
  color: var(--text-3);
}
.fs-conn-state { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-xs); color: var(--text-3); }
.fs-conn-state.is-found { color: var(--fs-gold); }
.fs-conn-main { margin-top: var(--space-4); font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
.fs-conn-minor { margin-top: 4px; font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-3); }
.fs-conn-hint { margin-top: var(--space-3); font-size: var(--fs-xs); line-height: 1.85; color: var(--text-3); }
.fs-conn-btn {
  margin-top: var(--space-5);
  padding: 7px 16px;
  font-size: var(--fs-xs);
  color: var(--text-1);
  background: transparent;
  border: 1px solid var(--ink-200);
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.fs-conn-btn:hover { border-color: var(--fs-gold-line); background: var(--fs-gold-soft); }

/* ==========================================================
   十一、品牌与技术支撑（克制：建立背书，不抢 Hero 主视觉）
   ========================================================== */
.fs-rel-wrap { padding: var(--space-8) 0 0; }
.fs-rel {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--space-8);
  padding: var(--space-6) var(--space-8);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
}
.fs-rel-en {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  color: var(--text-3);
}
.fs-rel-cn {
  margin-top: var(--space-3);
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: 600;
  color: var(--text-1);
}
.fs-rel-desc { margin-top: var(--space-2); font-size: var(--fs-sm); color: var(--text-2); }
.fs-rel-side.is-right { text-align: right; }
.fs-rel-mid {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  min-width: 168px;
}
.fs-rel-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(184, 148, 89, 0.5), transparent);
}
.fs-rel-key {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  white-space: nowrap;
  color: rgba(184, 148, 89, 0.9);
}
.fs-rel-note {
  margin-top: var(--space-5);
  text-align: center;
  font-size: var(--fs-xs);
  line-height: 1.9;
  color: var(--text-3);
}

/* ==========================================================
   十二、生态展示（HAIRUNWEI TECH Audio Ecosystem）
   ========================================================== */
.fs-eco {
  max-width: 1120px;
  margin: 0 auto;
  padding: var(--space-10) var(--space-8);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
}
.fs-eco-head { text-align: center; }
.fs-eco-title {
  margin-top: var(--space-4);
  font-family: var(--font-display);
  font-size: clamp(var(--fs-xl), 2.6vw, var(--fs-2xl));
  font-weight: 600;
  color: var(--text-1);
}
.fs-eco-sub { margin-top: var(--space-3); font-size: var(--fs-sm); color: var(--text-2); }
.fs-eco-grid {
  margin-top: var(--space-8);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--fs-line);
  border-radius: var(--r-md);
  overflow: hidden;
}
.fs-eco-item { padding: var(--space-6); background: var(--fs-bg-solid); }
.fs-eco-en {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: rgba(184, 148, 89, 0.85);
}
.fs-eco-cn { margin-top: var(--space-3); font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
.fs-eco-desc { margin-top: var(--space-2); font-size: var(--fs-sm); color: var(--text-2); }

/* ==========================================================
   十三、支持中心页（/studio/support）
   ========================================================== */
.fs-faq {
  max-width: 880px;
  margin: var(--space-10) auto 0;
  display: grid;
  gap: 1px;
  background: var(--fs-line);
  border-radius: var(--r-lg);
  overflow: hidden;
}
.fs-faq-item { padding: var(--space-6); background: var(--fs-bg-solid); }
.fs-faq-q { font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
.fs-faq-a { margin-top: var(--space-3); font-size: var(--fs-sm); line-height: 1.9; color: var(--text-2); }
.fs-inline-link {
  margin: 0 4px;
  color: var(--fs-gold);
  text-decoration: none;
  border-bottom: 1px solid var(--fs-gold-line);
}
.fs-inline-link:hover { color: var(--brand-500); }

/* ==========================================================
   十四、页脚品牌背书（Powered by HAIRUNWEI TECH）
   —— 克制：小字号、低对比度，不抢主视觉
   ========================================================== */
.fs-powered {
  margin: var(--space-12) 0 var(--space-10);
  padding-top: var(--space-6);
  border-top: 1px solid var(--line);
  text-align: center;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  line-height: 1.9;
  color: var(--text-3);
}
.fs-powered strong {
  font-weight: 600;
  letter-spacing: 0.14em;
  color: var(--text-2);
}
.fs-powered-sep { margin: 0 8px; color: var(--ink-200); }

/* ==========================================================
   十五、响应式
   ========================================================== */
@media (max-width: 1024px) {
  .fs-hero-grid { grid-template-columns: 1fr; gap: var(--space-10); }
  .fs-hero-visual { order: 2; }
  .fs-shot--peek { height: 260px; }
  .fs-features, .fs-devices, .fs-compat { grid-template-columns: repeat(2, 1fr); }
  .fs-compat.is-2 { grid-template-columns: repeat(2, 1fr); }
  .fs-kv { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fs-eco { padding: var(--space-8) var(--space-6); }
  .fs-rel { gap: var(--space-6); padding: var(--space-6); }
}
@media (max-width: 768px) {
  .fs-nav-inner { flex-direction: column; align-items: flex-start; gap: 6px; padding-top: 8px; padding-bottom: 10px; }
  .fs-nav-menu { gap: var(--space-4); }
  .fs-nav-item.active::after { bottom: -4px; }
  .fs-hero { padding: var(--space-10) 0 var(--space-12); }
  .fs-hero-cta { gap: var(--space-3); }
  .fs-hero-cta .btn { width: 100%; justify-content: center; }
  .fs-cta-cell { width: 100%; }
  .fs-shot--peek { height: 200px; }
  .fs-features, .fs-devices, .fs-soon-grid, .fs-compat, .fs-kv { grid-template-columns: 1fr; }
  .fs-compat.is-2 { grid-template-columns: 1fr; }
  .fs-roadmap-group { grid-template-columns: 1fr; gap: var(--space-2); }
  .fs-roadmap { padding: var(--space-5); }
  .fs-status { width: 100%; justify-content: center; flex-wrap: wrap; }
  .fs-conn { max-width: 100%; padding: var(--space-5); }
  .fs-conn-head { flex-wrap: wrap; }
  .fs-eco { padding: var(--space-6) var(--space-5); }
  .fs-eco-grid { grid-template-columns: 1fr; }
  .fs-eco-item { padding: var(--space-5); }
  .fs-faq-item { padding: var(--space-5); }
  .fs-rel { grid-template-columns: 1fr; gap: var(--space-5); padding: var(--space-5); }
  .fs-rel-side.is-right { text-align: left; }
  .fs-rel-side.is-right .fs-rel-cn { margin-top: var(--space-3); }
  .fs-rel-mid { min-width: 0; }
}
@media (max-width: 480px) {
  .fs-nav-brand-main { font-size: var(--fs-xs); letter-spacing: 0.16em; }
  .fs-device-model { font-size: var(--fs-xl); }
}

/* ==========================================================
   PHP 版补充：尊重 [hidden] 属性
   ----------------------------------------------------------
   Next 版用条件渲染（不渲染即不存在）；PHP 版为减少分支改为「始终渲染 + hidden 切换」。
   但 .fs-notice / .fs-conn 等声明了 display:flex，会覆盖 [hidden] 的默认 display:none，
   导致隐藏元素仍然可见 —— 这里显式声明。作用域仅限 /studio 系列页面。
   ========================================================== */
[hidden] { display: none !important; }

/* ==========================================================
   十六、平台首页（/studio）—— 2026-09-19 最终 UI 优化
   ----------------------------------------------------------
   · 作用域：html[data-fs-page="home"]，只由 studio/index.php 设置
     ⇒ /studio/devices、/studio/support 及全站其它页面**完全不受影响**
   · 品牌金三级（取自站点 Logo 渐变，项目内已存在，不引入新色相）：
       #9D8954  弱边框 / 分隔线 / 次级装饰
       #C9AF6C  主 CTA / 01·02·03 编号 / 已连接状态 / 重点文字
       #E1C479  hover / active / 少量高亮
   · 未修改任何既有令牌（--brand-500 / --fs-gold / --fs-line 等原样保留），
     只在首页范围内覆盖少量呈现值 —— 不新建主题体系、不改整体配色
   · 黑金比例：黑 ≈70%（页面/卡片/导航背景，未改）· 白灰 ≈25%（文字层级，未改）
              金 ≈5%（只做"视觉导航"，无大面积金底、无金色阴影泛滥）
   ========================================================== */
html[data-fs-page="home"] {
  --fsg-dim:       #9D8954;
  --fsg-main:      #C9AF6C;
  --fsg-hi:        #E1C479;
  --fsg-dim-line:  rgba(157, 137, 84, 0.30);
  --fsg-dim-soft:  rgba(157, 137, 84, 0.07);
}

/* ---------- 16.1 区块节奏（仅间距/留白，不改配色） ---------- */
html[data-fs-page="home"] .section { padding: 0 0 var(--space-20); }
html[data-fs-page="home"] .section-head { margin-bottom: var(--space-10); }
html[data-fs-page="home"] .section-title { color: var(--text-1); }
html[data-fs-page="home"] .section-head .section-title { margin: var(--space-3) 0 0; }
html[data-fs-page="home"] .fs-sechen,
html[data-fs-page="devices"] .fs-sechen,
html[data-fs-page="support"] .fs-sechen,
html[data-fs-page="guide"] .fs-sechen {   /* 2026-09-19：设备中心 / 支持中心复用同一小标样式；2026-10-08 指南页并入 */
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.22em;
  color: var(--fsg-dim);
}

/* ---------- 16.2 Hero 文字层级 + 双 CTA ---------- */
html[data-fs-page="home"] .fs-eyebrow {
  color: var(--fsg-main);
  background: var(--fsg-dim-soft);
  border-color: var(--fsg-dim-line);
}
/* 主 CTA：品牌金底 + 深字（#C9AF6C 上白字对比度不足，故用深色字，保证可读性） */
html[data-fs-page="home"] .fs-cta {
  background: var(--fsg-main);
  color: #141417;
  font-weight: 600;
  box-shadow: 0 4px 16px rgba(201, 175, 108, 0.18);
}
html[data-fs-page="home"] .fs-cta:hover {
  background: var(--fsg-hi);
  box-shadow: 0 10px 26px rgba(201, 175, 108, 0.26);
}
/* 次级按钮：深色底 + 暗金边框 */
html[data-fs-page="home"] .fs-hero-cta .btn-outline {
  border-color: var(--fsg-dim-line);
  color: var(--text-1);
}
html[data-fs-page="home"] .fs-hero-cta .btn-outline:hover {
  border-color: var(--fsg-main);
  color: var(--fsg-hi);
  background: var(--fsg-dim-soft);
}

/* ---------- 16.3 当前设备（状态点缀用金，卡片保持深黑） ---------- */
html[data-fs-page="home"] .fs-conn { max-width: none; }
html[data-fs-page="home"] .fs-conn-label { color: var(--text-2); }
html[data-fs-page="home"] .fs-conn-state { color: var(--text-3); }
html[data-fs-page="home"] .fs-conn-state.is-found { color: var(--fsg-main); }
html[data-fs-page="home"] .fs-status-dot.is-on {
  background: var(--fsg-main);
  box-shadow: 0 0 8px rgba(201, 175, 108, 0.55);
}
html[data-fs-page="home"] .fs-conn-main { color: var(--text-1); }
html[data-fs-page="home"] .fs-conn-hint { color: var(--text-2); }
/* 第二行左右分栏：左设备名 · 右就绪说明（窄屏自动改为上下） */
html[data-fs-page="home"] .fs-conn-body {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px var(--space-5);
}
html[data-fs-page="home"] .fs-conn-body > .fs-conn-main { margin-top: var(--space-4); }
html[data-fs-page="home"] .fs-conn-body > .fs-conn-hint { margin-top: var(--space-4); margin-left: auto; }

/* ---------- 16.4 核心功能卡（编号/名称/副标题/说明/标签/小箭头 统一结构） ---------- */
html[data-fs-page="home"] .fs-card { display: flex; flex-direction: column; }
html[data-fs-page="home"] .fs-card-no {
  font-size: var(--fs-sm);
  letter-spacing: 0.18em;
  color: var(--fsg-main);
}
html[data-fs-page="home"] .fs-card-title { color: var(--text-1); }
html[data-fs-page="home"] .fs-card-sub {
  margin-top: 2px;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.10em;
  color: var(--fsg-dim);
}
html[data-fs-page="home"] .fs-card-desc { margin-top: var(--space-3); }
html[data-fs-page="home"] .fs-card-tags {
  list-style: none;
  margin: var(--space-5) 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
html[data-fs-page="home"] .fs-card-tag {
  padding: 4px 10px;
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: var(--text-2);
  border: 1px solid var(--fsg-dim-line);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.02);
}
/* 小箭头：纯文字链，不是大按钮 */
html[data-fs-page="home"] .fs-card-foot {
  margin: auto 0 0;
  padding-top: var(--space-5);
  text-align: right;
}
html[data-fs-page="home"] .fs-card-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-xs);
  letter-spacing: 0.04em;
  color: var(--text-2);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
html[data-fs-page="home"] .fs-card-more span { transition: transform var(--t-fast) var(--ease); }
html[data-fs-page="home"] .fs-card-more:hover {
  color: var(--fsg-hi);
  border-bottom-color: var(--fsg-dim-line);
}
html[data-fs-page="home"] .fs-card-more:hover span { transform: translateX(3px); }

/* ---------- 16.4b 核心功能：01「调音中心」= 主卡，02 / 03 = 辅助卡 ----------
   · 目标：三张卡不再等权 —— 视觉重心落在调音中心（它才是本平台的核心能力）。
   · 手法：只调「列宽比例 + 主卡的描边/内边距/字号/标签尺寸」，
     不新增栏目、不重复放截图、不改卡片内容与链接。
   · ⚠ 本页作用域前缀**不可省**：.fs-features 的通用规则在 §五 是无作用域的 3 等列，
     且 ≤1024px / ≤768px 各有一条 media 覆盖（2 列 / 1 列）。
     本页规则特异性更高，会盖掉那两条 —— 所以下面必须把两档**显式补回来**，
     否则窄屏会被强行挤成 3 列（横向溢出）。 */
html[data-fs-page="home"] .fs-features {
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr) minmax(0, 1fr);
}
html[data-fs-page="home"] .fs-card.is-primary {
  position: relative;
  padding: var(--space-8);
  border-color: var(--fsg-dim-line);
  background: var(--fs-bg-panel);
}
/* 主卡标识：顶边一条极细金线（纯色 + 低不透明度；非渐变、不发光） */
html[data-fs-page="home"] .fs-card.is-primary::before {
  content: '';
  position: absolute;
  left: var(--space-8);
  right: var(--space-8);
  top: 0;
  height: 1px;
  background: var(--fsg-main);
  opacity: 0.5;
}
html[data-fs-page="home"] .fs-card.is-primary .fs-card-no { color: var(--fsg-hi); }
html[data-fs-page="home"] .fs-card.is-primary .fs-card-title {
  font-size: clamp(var(--fs-xl), 1.5vw, var(--fs-2xl));
}
html[data-fs-page="home"] .fs-card.is-primary .fs-card-desc { font-size: var(--fs-base); }
html[data-fs-page="home"] .fs-card.is-primary .fs-card-tag {
  padding: 5px 12px;
  font-size: var(--fs-sm);
  color: var(--text-1);
}
html[data-fs-page="home"] .fs-card.is-primary .fs-card-more { font-size: var(--fs-sm); color: var(--fsg-main); }

@media (max-width: 1024px) {
  /* 2 列：主卡跨满整行（仍是最重的那个），02/03 各占一格 */
  html[data-fs-page="home"] .fs-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-fs-page="home"] .fs-card.is-primary { grid-column: span 2; }
}
@media (max-width: 768px) {
  /* 1 列：回归普通卡片尺寸，主卡仍排在最前 */
  html[data-fs-page="home"] .fs-features { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="home"] .fs-card.is-primary {
    grid-column: auto;
    padding: var(--space-6);
  }
  html[data-fs-page="home"] .fs-card.is-primary::before {
    left: var(--space-6);
    right: var(--space-6);
  }
}

/* ---------- 16.5 使用说明（三步 + 推荐环境） ---------- */
html[data-fs-page="home"] .fs-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}
html[data-fs-page="home"] .fs-step {
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--fs-line);
  border-left: 2px solid var(--fsg-dim-line);   /* 暗金细线：次级装饰 */
  border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
}
html[data-fs-page="home"] .fs-step-no {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.18em;
  color: var(--fsg-main);
}
html[data-fs-page="home"] .fs-step-title {
  margin-top: var(--space-3);
  font-size: var(--fs-lg);
  font-weight: 600;
  color: var(--text-1);
}
html[data-fs-page="home"] .fs-step-text {
  margin-top: var(--space-2);
  font-size: var(--fs-sm);
  line-height: 1.85;
  color: var(--text-2);
}
html[data-fs-page="home"] .fs-env {
  margin-top: var(--space-8);
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-3) var(--space-8);
  align-items: baseline;
}
html[data-fs-page="home"] .fs-env-k {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.12em;
  color: var(--fsg-dim);
}
html[data-fs-page="home"] .fs-env-v { display: flex; flex-wrap: wrap; gap: var(--space-3); }
html[data-fs-page="home"] .fs-env-item {
  padding: 4px 12px;
  font-size: var(--fs-sm);
  line-height: 1.6;
  color: var(--text-1);
  border: 1px solid var(--fsg-dim-line);
  border-radius: var(--r-pill);
}
html[data-fs-page="home"] .fs-env-note {
  grid-column: 1 / -1;
  margin-top: var(--space-2);
  padding-top: var(--space-4);
  border-top: 1px solid var(--fsg-dim-line);
  font-size: var(--fs-xs);
  line-height: 1.95;
  color: var(--text-3);
}

/* ---------- 16.6 注意事项（深黑横向信息区，非警告框、无红色） ---------- */
html[data-fs-page="home"] .fs-notes {
  display: grid;
  grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
  gap: var(--space-8);
  padding: var(--space-8);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: var(--fs-bg-solid);
}
html[data-fs-page="home"] .fs-notes-en {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.22em;
  color: var(--fsg-dim);
}
html[data-fs-page="home"] .fs-notes-title {
  margin-top: var(--space-3);
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: 700;
  line-height: 1.25;
  color: var(--text-1);
}
html[data-fs-page="home"] .fs-notes-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3) var(--space-8);
  align-content: start;
}
html[data-fs-page="home"] .fs-notes-item {
  position: relative;
  padding-left: 16px;
  font-size: var(--fs-sm);
  line-height: 1.85;
  color: var(--text-2);
}
html[data-fs-page="home"] .fs-notes-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.72em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--fsg-dim);   /* 暗金小圆点分隔 */
}

/* ---------- 16.6b 功能持续开放中（轻量信息条：无背景 / 无按钮 / 无图片 / 非独立大模块） ---------- */
html[data-fs-page="home"] .fs-open,
html[data-fs-page="devices"] .fs-open,
html[data-fs-page="support"] .fs-open {   /* 2026-09-19：设备中心 / 支持中心复用同一「功能持续开放中」信息条 */
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-top: var(--space-10);   /* 与核心功能卡片留出间距，但不另起一个区块 */
}
html[data-fs-page="home"] .fs-open-dot,
html[data-fs-page="devices"] .fs-open-dot,
html[data-fs-page="support"] .fs-open-dot {
  flex: none;
  width: 5px;
  height: 5px;
  margin-top: 0.62em;
  border-radius: 50%;
  background: var(--fsg-dim);    /* 暗金 #9D8954 —— 弱装饰，非高亮 */
}
html[data-fs-page="home"] .fs-open-text,
html[data-fs-page="devices"] .fs-open-text,
html[data-fs-page="support"] .fs-open-text { min-width: 0; }
html[data-fs-page="home"] .fs-open-title,
html[data-fs-page="devices"] .fs-open-title,
html[data-fs-page="support"] .fs-open-title {
  font-size: var(--fs-base);
  font-weight: 600;
  line-height: 1.5;
  color: var(--text-1);          /* 白 / 浅灰 */
}
html[data-fs-page="home"] .fs-open-desc,
html[data-fs-page="devices"] .fs-open-desc,
html[data-fs-page="support"] .fs-open-desc {
  margin-top: 4px;
  font-size: var(--fs-sm);
  line-height: 1.8;
  color: var(--text-3);          /* 中灰 */
}

/* ---------- 16.7 响应式（桌面双栏 → 移动端纵向，无横向溢出） ---------- */
@media (max-width: 1024px) {
  html[data-fs-page="home"] .fs-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-fs-page="home"] .fs-notes {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
    padding: var(--space-6);
  }
}
@media (max-width: 768px) {
  html[data-fs-page="home"] .section { padding: 0 0 var(--space-16); }
  html[data-fs-page="home"] .fs-steps { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="home"] .fs-notes-list { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
  html[data-fs-page="home"] .fs-notes-title { font-size: var(--fs-xl); }
  html[data-fs-page="home"] .fs-conn-body { flex-direction: column; align-items: flex-start; gap: 0; }
  html[data-fs-page="home"] .fs-conn-body > .fs-conn-hint { margin-left: 0; }
  html[data-fs-page="home"] .fs-env { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
  html[data-fs-page="home"] .fs-card-foot { text-align: left; }
  html[data-fs-page="home"] .fs-open { margin-top: var(--space-8); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-fs-page="home"] .fs-card-more span { transition: none !important; transform: none !important; }
}

/* ==========================================================
   十七、设备中心（/studio/devices）—— 2026-09-19 设备管理 Dashboard
   ----------------------------------------------------------
   · 作用域：html[data-fs-page="devices"]，只由 studio/devices.php 设置
     ⇒ home / support 与全站其它页面**完全不受影响**
   · 布局（本轮改版）：Hero → 双栏【当前设备 40% ｜ 设备信息 60%】
     → 支持能力（整宽卡片，能力项 = 标题 + 一句话说明）→ 功能持续开放中 → 页脚背书
   · 配色：仍为黑底 + 白字 + 灰辅文 + 暗金点缀。
     **不引入新色相** —— 17.0 只是把首页已存在的品牌金三级在本页补齐，
     并新增一个仅用于"已连接"的状态绿。无蓝/紫/青、无霓虹、无大面积金底。
   · 本页所有"动态切换"都**复用既有 studio.js 写入的类，未修改 studio.js**：
       .fs-conn-state.is-none / .is-unsupported → 显示「暂未检测到设备」空态
       .fs-device-conn-v.is-on                 → 显示命中的那个方案的能力
   · ⚠ .fs-kv / .fs-kv-item（support.php 共用）、.fs-conn（index.php 共用）
       在本文件中的**通用定义一律未改**，本页的改动全部带作用域前缀覆盖。
   ========================================================== */

/* ---------- 17.0a ★ Audio Studio 官网型页面：统一容器宽度 ----------
   · 适用范围：/studio（home）、/studio/devices、/studio/support —— 三个「官网型」页面
     统一 1400px（此前为 home 1280 / devices 1480 / support 1480 三种值，现收敛为一）。
   · ⛔ 调音中心 /tuner 不在其中：它是独立的专业工具工作区，用自有的
     .hbar / main / .abar（1180px；视口 ≥1441px 时为 1320px），**与本变量无关**，
     改这里对它没有任何影响，也不应为了"四页一致"去改它。
   · ⛔ 主站（无 data-fs-page 的页面）继续吃 style.css :root 的 1280px，不受影响。
   · ⚠ 只覆盖 --container 这**一个**值：.container 的 width / max-width / margin /
     padding 全部保持原样，**不做 min(1400px, 100% - 64px) 之类的二次计算** ——
     .container 已有 padding:0 24px，再扣一次会造成重复留白。
   · ⚠ 覆盖在 html 上 ⇒ .container 是 Header / 子导航 / Hero / Section / Footer
     共用的容器，故四者同步收放、左右边界严格对齐，不会出现"正文比导航宽"的错位。
   · 窄屏表现：--container 只是 max-width 的上限，视口 <1400px 时 .container
     自然退化为 width:100% 并按自身 padding 留白，**不产生横向滚动**。 */
html[data-fs-page="home"],
html[data-fs-page="devices"],
html[data-fs-page="support"] {
  --container: 1400px;
}

/* ★ 2026-10-08：指南页单独使用 1200px（v3 重构要求"页面宽度 1200 左右"）——
   页头 / 二级导航 / 正文 / 页脚同为一个 .container，故整体同步收窄、左右边界仍严格对齐。 */
html[data-fs-page="guide"] {
  --container: 1200px;
}

/* ---------- 17.0 本页令牌（补齐 + 状态绿） ----------
   背景：品牌金三级 --fsg-* 原本**只**定义在 html[data-fs-page="home"] 下（见 §十六），
   而设备中心的样式早就引用了它们（.fs-sechen 小标、.fs-open-dot 圆点），
   结果在本页取不到值 ⇒ 小标失去金色、圆点背景失效而**不可见**。
   这里按**同名同值**在本页补齐 —— 不新增色相、不改整体配色，只修掉这个既有缺陷。
   另新增仅本页使用的「状态绿」，**只**用于"已连接 / 命中"的提示。 */
html[data-fs-page="devices"],
html[data-fs-page="support"],
html[data-fs-page="guide"] {   /* 2026-10-08：指南页并入，取同一套品牌金令牌 */
  /* 宽度已上移到 §17.0a 统一管理（home / devices / support / guide 四页共用 1400px）。
     本块只保留设备中心与支持中心**专属**的令牌，不再重复定义 --container。 */
  --fsg-dim:       #9D8954;
  --fsg-main:      #C9AF6C;
  --fsg-hi:        #E1C479;
  --fsg-dim-line:  rgba(157, 137, 84, 0.30);
  --fsg-dim-soft:  rgba(157, 137, 84, 0.07);
  --fs-dc-ok:      #6FBF8B;                       /* 状态绿：仅"已连接" */
  --fs-dc-ok-line: rgba(111, 191, 139, 0.32);
  --fs-dc-ok-soft: rgba(111, 191, 139, 0.10);
}
/* 状态点：本页把 is-on 由"金"改为"绿"，与状态胶囊同色 */
html[data-fs-page="devices"] .fs-status-dot.is-on {
  background: var(--fs-dc-ok);
  box-shadow: 0 0 8px rgba(111, 191, 139, 0.45);
}

/* ---------- 17.1 区块节奏与页头 ---------- */
html[data-fs-page="devices"] .section { padding: 0 0 var(--space-16); }
html[data-fs-page="devices"] .fs-dc-hero { padding-top: var(--space-16); }
html[data-fs-page="devices"] .fs-dc-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-8) var(--space-10);
  flex-wrap: wrap;
}
html[data-fs-page="devices"] .fs-dc-head-copy { min-width: 0; }
html[data-fs-page="devices"] .fs-dc-title { margin-top: var(--space-4); }
html[data-fs-page="devices"] .fs-dc-desc {
  margin-top: var(--space-3);
  max-width: 62ch;
  font-size: var(--fs-sm);
  line-height: 1.9;
  color: var(--text-3);
}
/* 双按钮靠右、与左侧标题块底部对齐（不再单独占一行堆在内容中间） */
html[data-fs-page="devices"] .fs-dc-actions {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-top: 0;
}

/* ---------- 17.2 双栏骨架（桌面 40% ｜ 60%，移动端纵向） ---------- */
html[data-fs-page="devices"] .fs-dc-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  gap: var(--space-6);
  align-items: stretch;
}

/* 本页主卡片：统一黑金底 + 细金边。
   ⚠ .fs-conn 被首页共用，故下面所有覆盖都强制带本页作用域前缀 */
html[data-fs-page="devices"] .fs-dc-card,
html[data-fs-page="devices"] .fs-conn {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: var(--space-6);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
  box-shadow: var(--fs-shadow-card);
}
html[data-fs-page="devices"] .fs-conn {
  max-width: none;
  margin-top: 0;
  animation: none;   /* 本页不要入场动画，保持"控制台"的稳定感 */
}

html[data-fs-page="devices"] .fs-dc-card-head { margin-bottom: var(--space-5); }
html[data-fs-page="devices"] .fs-dc-card-title {
  margin: var(--space-3) 0 0;
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--text-1);
}

/* ---------- 17.3 当前设备：状态胶囊 → 大号设备名 → 状态描述 ---------- */
html[data-fs-page="devices"] .fs-conn-head {
  display: flex;
  align-items: center;
  margin-top: 4px;
}
html[data-fs-page="devices"] .fs-conn-state {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 12px;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.08em;
  color: var(--text-3);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, 0.02);
}
html[data-fs-page="devices"] .fs-conn-state.is-found {
  color: var(--fs-dc-ok);
  border-color: var(--fs-dc-ok-line);
  background: var(--fs-dc-ok-soft);
}

html[data-fs-page="devices"] .fs-conn-body {
  display: block;
  margin-top: var(--space-5);
}
html[data-fs-page="devices"] .fs-conn-body > .fs-conn-main {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(var(--fs-2xl), 2.4vw, var(--fs-3xl));
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--text-1);
  overflow-wrap: anywhere;
}
html[data-fs-page="devices"] .fs-conn-body > .fs-conn-minor { margin-top: 6px; }
html[data-fs-page="devices"] .fs-conn-body > .fs-conn-hint {
  margin: var(--space-4) 0 0;
  font-size: var(--fs-sm);
  line-height: 1.85;
  color: var(--text-2);
}

/* 空态：默认隐藏。仅当 studio.js 判为「未连接 / 浏览器不支持」时出现；
   同时隐藏 JS 写入的正文，避免与空态文案重复。
   （.fs-conn-state 的类名由 studio.js 写入：is-checking / is-found / is-none / is-unsupported） */
html[data-fs-page="devices"] .fs-dc-empty { display: none; }
html[data-fs-page="devices"] .fs-conn:has(.fs-conn-state.is-none) .fs-conn-body,
html[data-fs-page="devices"] .fs-conn:has(.fs-conn-state.is-unsupported) .fs-conn-body { display: none; }
html[data-fs-page="devices"] .fs-conn:has(.fs-conn-state.is-none) .fs-dc-empty,
html[data-fs-page="devices"] .fs-conn:has(.fs-conn-state.is-unsupported) .fs-dc-empty {
  display: block;
  margin-top: var(--space-5);
  padding-top: var(--space-4);
  border-top: 1px solid var(--line);
}
html[data-fs-page="devices"] .fs-dc-empty-title {
  font-size: var(--fs-base);
  font-weight: 600;
  color: var(--text-1);
}
html[data-fs-page="devices"] .fs-dc-empty-desc {
  margin-top: var(--space-2);
  font-size: var(--fs-sm);
  line-height: 1.85;
  color: var(--text-3);
}

/* ---------- 17.4 设备信息：两列「标签 · 数值」Grid ----------
   ⚠ .fs-kv / .fs-kv-item 被 support.php 共用，故全部规则带本页作用域前缀
   排布（宽屏）：设备名称独占整行 → 设备状态｜连接方式 → 音频能力｜调音支持 → 固件版本独占 */
html[data-fs-page="devices"] .fs-dc-card--info [data-fs-detail] { flex: 1 1 auto; }
html[data-fs-page="devices"] .fs-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--space-10);
  row-gap: 0;
  margin-top: 0;
}
html[data-fs-page="devices"] .fs-kv-item {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: baseline;
  gap: var(--space-4);
  padding: 10px 0;
  border: 0;
}
html[data-fs-page="devices"] .fs-kv-k { letter-spacing: 0.06em; color: var(--text-3); }
html[data-fs-page="devices"] .fs-kv-v {
  margin-top: 0;
  font-size: var(--fs-base);
  color: var(--text-1);
}
html[data-fs-page="devices"] .fs-kv-v.is-muted {
  font-size: var(--fs-sm);
  color: var(--text-3);
}

/* ★ 2026-10-08（用户要求）：固件版本行的状态提示 chip ——「已是最新」/「有新版 vX.Y.Z」
   由 studio.js 在版本值后追加（DOM 创建，非 innerHTML）；不在 device 页面也可复用，故不加作用域。 */
.fs-kv-chip {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 9px;
  font-size: var(--fs-xs);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.02em;
  color: var(--text-3);
  border: 1px solid var(--line);
  border-radius: 999px;
  vertical-align: 1px;
  white-space: nowrap;
}
.fs-kv-chip.is-new {
  color: var(--fs-gold);
  border-color: var(--fs-gold-line);
  background: var(--fs-gold-soft);
}

/* 主项：设备名称 —— 整行独占、数值提级，并以细线把"设备身份"与下面的状态/能力分开。
   ⚠ .is-primary 挂在 .fs-kv-item 上而**不能**挂数值元素 ——
     studio.js 会把数值元素的 className 重写成 'fs-kv-v[ is-muted]'，挂上去会被抹掉。 */
html[data-fs-page="devices"] .fs-kv-item.is-primary {
  grid-column: 1 / -1;
  display: block;
  padding: 0 0 var(--space-4);
  border-bottom: 1px solid var(--line);
}
html[data-fs-page="devices"] .fs-kv-item.is-primary .fs-kv-k { margin-bottom: var(--space-2); }
html[data-fs-page="devices"] .fs-kv-item.is-primary .fs-kv-v,
html[data-fs-page="devices"] .fs-kv-item.is-primary .fs-kv-v.is-muted {
  font-family: var(--font-display);
  font-size: clamp(var(--fs-xl), 1.5vw, var(--fs-2xl));
  font-weight: 600;
  line-height: 1.3;
  color: var(--text-1);
  overflow-wrap: anywhere;
}

/* 固件状态整行独占，避免最后一行只落半格、右边空着 */
html[data-fs-page="devices"] .fs-kv-item:last-child { grid-column: 1 / -1; }

/* 第二组（音频能力/调音支持/固件版本）与第一组之间留分组呼吸；
   同一网格行的两项一起加，保证左右仍然对齐 */
html[data-fs-page="devices"] .fs-kv-item:nth-child(4),
html[data-fs-page="devices"] .fs-kv-item:nth-child(5) { margin-top: var(--space-5); }

/* ---------- 17.4a 固件更新提示条（2026-10-07） ----------
   studio.js 读到设备固件版本、且 fw-manifest.json 存在更新时显示（hidden 切换）。
   ⚠ 本容器 display:flex，会盖掉 [hidden] 的 UA 样式 → 必须显式补 [hidden]{display:none} */
html:is([data-fs-page="devices"], [data-fs-page="home"]) .fs-fw-upd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-4);
  margin-top: var(--space-5);
  padding: 12px 16px;
  background: var(--fs-gold-soft);
  border: 1px solid var(--fs-gold-line);
  border-radius: 8px;
}
html:is([data-fs-page="devices"], [data-fs-page="home"]) .fs-fw-upd[hidden] { display: none; }
html:is([data-fs-page="devices"], [data-fs-page="home"]) .fs-fw-upd-txt {
  font-size: var(--fs-sm);
  color: var(--text-1);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
html:is([data-fs-page="devices"], [data-fs-page="home"]) .fs-fw-upd-txt::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--fs-gold);
  box-shadow: 0 0 8px rgba(184, 148, 89, 0.7);
  margin-right: 8px;
  vertical-align: 1px;
}
html:is([data-fs-page="devices"], [data-fs-page="home"]) .fs-fw-upd-btn {
  flex: none;
  display: inline-flex;
  align-items: center;
  padding: 6px 16px;
  font-size: var(--fs-sm);
  letter-spacing: 0.02em;
  color: var(--fs-gold);
  border: 1px solid var(--fs-gold-line);
  border-radius: 999px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s ease, border-color .2s ease;
}
html:is([data-fs-page="devices"], [data-fs-page="home"]) .fs-fw-upd-btn:hover,
html:is([data-fs-page="devices"], [data-fs-page="home"]) .fs-fw-upd-btn:focus-visible {
  background: var(--fs-gold-soft);
  border-color: var(--fs-gold);
}

/* 辅助说明：更小更弱，不抢主视觉 */
html[data-fs-page="devices"] .fs-dc-note {
  margin-top: var(--space-5);
  font-size: var(--fs-xs);
  line-height: 1.9;
  color: var(--text-3);
}
html[data-fs-page="devices"] .fs-dc-card--info .fs-dc-note--foot {
  margin-top: auto;
  padding-top: var(--space-5);
  border-top: 1px solid var(--line);
  font-size: 11px;
  line-height: 1.85;
  color: var(--text-3);
}
html[data-fs-page="devices"] .fs-dc-note--center { text-align: center; }

/* ---------- 17.5 支持能力：整宽卡片 + 横向能力项（标题 + 一句话说明） ----------
   · 默认**全部隐藏** —— 未连接时不该出现任何"能力清单"，否则又变成产品目录
   · studio.js 给命中的 .fs-device-conn-v 加 .is-on ⇒ 只显示那一个容器的能力
   · 不支持 :has() 的老浏览器：容器保持隐藏，页面只显示引导语（绝不显示错误信息） */
html[data-fs-page="devices"] .fs-caps { max-width: none; margin: 0; }
html[data-fs-page="devices"] .fs-caps-hint {
  margin: 0;
  padding: var(--space-5) var(--space-6);
  border: 1px dashed var(--fs-line-strong);
  border-radius: var(--r-lg);
  font-size: var(--fs-sm);
  line-height: 1.85;
  color: var(--text-3);
  text-align: center;
}
html[data-fs-page="devices"] .fs-cap-group { display: none; }
html[data-fs-page="devices"] .fs-cap-group:has(.fs-device-conn-v.is-on) { display: block; }
html[data-fs-page="devices"] .fs-caps:has(.fs-device-conn-v.is-on) .fs-caps-hint { display: none; }

/* 命中状态行（同时是 .is-on 的载体，机制必需）—— 克制呈现 */
html[data-fs-page="devices"] .fs-device-conn {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  justify-content: flex-start;
  gap: var(--space-4);
}
html[data-fs-page="devices"] .fs-device-conn-k { letter-spacing: 0.08em; }
html[data-fs-page="devices"] .fs-device-conn-v { font-size: var(--fs-xs); }
html[data-fs-page="devices"] .fs-device-conn-v.is-on { color: var(--fs-dc-ok); }

/* 能力项：**每个能力一张卡**，横向等分占满整行；能力变多会自动换行 */
html[data-fs-page="devices"] .fs-cap-chips {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin: var(--space-6) 0 0;
  padding: 0;
  list-style: none;
  border: 0;
  background: none;
}
html[data-fs-page="devices"] .fs-cap-chips > .fs-feat {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  align-items: start;
  column-gap: 10px;
  row-gap: 6px;
  margin: 0;
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
  transition: border-color var(--t-fast) var(--ease);
}
html[data-fs-page="devices"] .fs-cap-chips > .fs-feat:hover { border-color: var(--fsg-dim-line); }
html[data-fs-page="devices"] .fs-cap-chips > .fs-feat::before {
  margin-top: 5px;
  background-color: var(--fsg-main);
}
html[data-fs-page="devices"] .fs-feat-t {
  grid-column: 2;
  font-size: var(--fs-lg);
  font-weight: 600;
  line-height: 1.35;
  color: var(--text-1);
}
html[data-fs-page="devices"] .fs-feat-d {
  grid-column: 2;
  font-size: var(--fs-xs);
  line-height: 1.7;
  color: var(--text-3);
}

/* ---------- 17.5′ 固件升级入口卡（2026-10-08，用户选定方案 E）----------
   背景：固件升级此前是能力卡区里的一张**可点击卡**，与「PEQ 调节／音效预设／参数管理／音量档位」
   完全同款 ⇒ 用户反馈"很普通、像隐藏的一样"（能力清单里混行动入口，层级不对）。
   用户裁定（2026-10-08）：
     · 能力卡**全部保留但一律不可点击**（含「固件升级」）—— 能力卡区只做"能力清单"；
     · 行动入口改为下方**独立入口卡** .fs-fw-card（与首页「核心功能」卡同族样式：
       小字英文标签 + 标题 + 说明 + 底部金色链接），份量与"一个独立功能"匹配。
   备选方案对比见预览目录 fw-entry-options.html（A 横条 / B 实心按钮 / C 胶囊 / D 信息行 / E 卡片）。
   显隐：与所在设备分组一致（未命中该方案的设备不显示）；
   是否渲染：取决于该方案 caps.firmwareUpgrade（与能力位同源，不另立口径）。
   旧类 .fs-feat-link / .fs-feat-hit / .fs-feat-go / .fs-fw-entry* 均已不再使用。 */
html[data-fs-page="devices"] .fs-fw-card {
  display: block;
  margin-top: var(--space-5);
  padding: 18px 20px;
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
  box-shadow: var(--fs-shadow-card);
  text-decoration: none;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
html[data-fs-page="devices"] .fs-fw-card:hover,
html[data-fs-page="devices"] .fs-fw-card:focus-visible {
  border-color: var(--fs-gold-line);
  box-shadow: var(--fs-shadow-card-h);
  transform: translateY(-2px);
}
html[data-fs-page="devices"] .fs-fw-card-no {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: 0.16em;
  color: rgba(184, 148, 89, 0.9);
}
html[data-fs-page="devices"] .fs-fw-card-t {
  display: block;
  margin-top: 6px;
  font-size: var(--fs-lg);
  font-weight: 600;
  line-height: 1.35;
  color: var(--text-1);
}
html[data-fs-page="devices"] .fs-fw-card-d {
  display: block;
  margin-top: 6px;
  font-size: var(--fs-sm);
  line-height: 1.6;
  color: var(--text-2);
}
html[data-fs-page="devices"] .fs-fw-card-go {
  display: inline-block;
  margin-top: 12px;
  font-size: var(--fs-sm);
  color: var(--fs-gold);
  transition: transform .2s ease;
}
html[data-fs-page="devices"] .fs-fw-card:hover .fs-fw-card-go { transform: translateX(3px); }

/* ---------- 17.6 页脚背书：与正文之间加一道更清晰的分隔 ---------- */
html[data-fs-page="devices"] .fs-powered {
  margin-top: var(--space-16);
  padding-top: var(--space-6);
  border-top: 1px solid var(--line-strong);
}

/* ---------- 17.7 响应式 ---------- */
/* ★ 2026-10-07：能力卡 2 列断点从 1024 提前到 1280 —— 1025~1280 区间 3 列卡片
   只有 ~330px 宽（标题+说明挤压），2 列后每张 ≥460px，与 ≥1280 时 3 列观感一致 */
@media (max-width: 1280px) {
  html[data-fs-page="devices"] .fs-cap-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
  /* 平板：双栏塌成纵向；能力卡维持 2 列（断点已提前到 1280） */
  html[data-fs-page="devices"] .fs-dc-grid { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="devices"] .fs-cap-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  html[data-fs-page="devices"] .section { padding: 0 0 var(--space-12); }
  html[data-fs-page="devices"] .fs-dc-hero { padding-top: var(--space-12); }
  /* 顶部：标题块在上、两个按钮整行在下 */
  html[data-fs-page="devices"] .fs-dc-head { flex-direction: column; align-items: stretch; }
  html[data-fs-page="devices"] .fs-dc-actions { flex-direction: column; align-items: stretch; }
  html[data-fs-page="devices"] .fs-dc-actions .btn { width: 100%; justify-content: center; }
  html[data-fs-page="devices"] .fs-dc-actions .fs-cta-cell { width: 100%; }
  /* 设备信息：两列 → 单列；能力卡：单列 */
  html[data-fs-page="devices"] .fs-kv { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="devices"] .fs-kv-item { grid-template-columns: 76px minmax(0, 1fr); }
  html[data-fs-page="devices"] .fs-cap-chips { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="devices"] .fs-open { margin-top: var(--space-8); }
}

/* ==========================================================
   十八、支持中心（/studio/support）—— 2026-09-19 重设计
   ----------------------------------------------------------
   · 作用域：html[data-fs-page="support"]，只由 studio/support.php 设置
     ⇒ 平台首页 / 设备中心与全站其它页面**互不影响**
   · 宽度与品牌金令牌复用 §十七.0a / §十七.0
     （--container 三页统一 1400px，见 §17.0a；本页未另设宽度）
   · 配色**完全复用既有变量**（--fs-grad-card / --fs-bg-panel-soft /
     --fs-shadow-card / --fsg-* / --text-* / --line*）—— 未新增任何色值：
     无蓝/紫/青、无霓虹、无大面积金底、无强发光、无玻璃拟态
   · FAQ 折叠使用**原生 <details>** ⇒ 本页零 JS，assets/js/studio.js 一行未改
   ========================================================== */

/* ---------- 18.0 本页局部令牌（仅 support 作用域，不改动任何全局变量） ---------- */
html[data-fs-page="support"] {
  /* 比 --line 更淡一档的分隔线：用于 FAQ 折叠项与 Hero 状态行，降低"卡片感" */
  --fs-sc-line: rgba(184, 148, 89, 0.10);
}

/* ---------- 18.1 区块节奏（垂直呼吸：段落分明，但不留大片空洞） ---------- */
html[data-fs-page="support"] .section { padding: 0 0 var(--space-12); }
html[data-fs-page="support"] .fs-sc-hero { padding-top: var(--space-12); }
html[data-fs-page="support"] .section-head { margin-bottom: var(--space-8); }
html[data-fs-page="support"] .section-title { color: var(--text-1); }
html[data-fs-page="support"] .section-head .section-title { margin: var(--space-2) 0 0; }

/* ---------- 18.2 Hero：左文案 ｜ 右音频技术视觉（**频谱为主，设备状态为辅**） ---------- */
html[data-fs-page="support"] .fs-sc-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 560px);
  gap: var(--space-10) var(--space-12);
  align-items: center;
}
html[data-fs-page="support"] .fs-sc-hero-copy { min-width: 0; }
html[data-fs-page="support"] .fs-sc-h1 {
  margin-top: var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(var(--fs-2xl), 3vw, var(--fs-4xl));
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.1;
  color: var(--text-1);
}
/* 主标题：全站仅此一处使用"金色重点文字"，把视觉落点收在 Hero */
html[data-fs-page="support"] .fs-sc-lead {
  margin-top: var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(var(--fs-lg), 1.5vw, var(--fs-xl));
  font-weight: 600;
  line-height: 1.4;
  color: var(--fsg-main);
}
html[data-fs-page="support"] .fs-sc-sub {
  margin-top: var(--space-4);
  max-width: 50ch;
  font-size: var(--fs-base);
  line-height: 1.8;
  color: var(--text-2);
}
html[data-fs-page="support"] .fs-sc-desc {
  margin-top: var(--space-2);
  max-width: 50ch;
  font-size: var(--fs-sm);
  line-height: 1.85;
  color: var(--text-3);
}
html[data-fs-page="support"] .fs-sc-hero-copy .fs-cta-cell { display: block; margin-top: var(--space-6); }

/* --- 右侧：频谱（视觉主体，纯装饰；层次仅靠每根条的内联 opacity） --- */
html[data-fs-page="support"] .fs-sc-hero-visual { min-width: 0; }
html[data-fs-page="support"] .fs-sc-wave {
  display: block;
  width: 100%;
  height: 140px;
  overflow: visible;
}
html[data-fs-page="support"] .fs-sc-wave-base { stroke: var(--fsg-dim-line); stroke-width: 1; }
html[data-fs-page="support"] .fs-sc-wave-bar { fill: var(--fsg-main); }
html[data-fs-page="support"] .fs-sc-wave-line { stroke: var(--fsg-dim); stroke-width: 1; opacity: 0.6; }

/* --- 右侧：设备状态行 ----------
   本轮**刻意做轻**：无边框 / 无底色 / 无阴影 / 无卡片圆角，
   只由一条淡金细线与频谱分隔 ⇒ 一眼看去是"技术支持入口"，不是第二个「设备中心」。
   高度也从原来的三行信息表压到一行 + 一行提示。 ---------- */
html[data-fs-page="support"] .fs-sc-status {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid var(--fs-sc-line);
}
html[data-fs-page="support"] .fs-sc-status-main {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
}
html[data-fs-page="support"] .fs-conn-state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--text-3);
}
html[data-fs-page="support"] .fs-conn-state.is-found { color: var(--fs-dc-ok); }
html[data-fs-page="support"] .fs-status-dot.is-on {
  background: var(--fs-dc-ok);
  box-shadow: 0 0 6px rgba(111, 191, 139, 0.4);
}
html[data-fs-page="support"] .fs-sc-kv { display: inline-flex; align-items: baseline; gap: 7px; }
html[data-fs-page="support"] .fs-sc-kv-k { font-size: 11px; letter-spacing: 0.06em; color: var(--text-3); }
/* ⚠ 数值元素只能是 .fs-kv-v（studio.js 会整段重写 className），故样式一律由 .fs-sc-kv 限定 */
html[data-fs-page="support"] .fs-sc-kv .fs-kv-v,
html[data-fs-page="support"] .fs-sc-kv .fs-kv-v.is-muted {
  margin-top: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--text-2);
}
html[data-fs-page="support"] .fs-sc-rescan {
  padding: 4px 12px;
  font-size: 11px;
  border-color: var(--fs-sc-line);
}
html[data-fs-page="support"] .fs-sc-status-note {
  flex: 1 1 100%;
  margin: 0;
  font-size: 11px;
  line-height: 1.8;
  color: var(--text-3);
}
html[data-fs-page="support"] .fs-sc-status-hint {
  margin: var(--space-2) 0 0;
  font-size: 11px;
  line-height: 1.8;
  color: var(--text-3);
}

/* ---------- 18.3 快速支持：4 列等宽卡片（等高 + 收紧内边距，避免"里面什么都没有"） ---------- */
html[data-fs-page="support"] .fs-sc-quick {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  align-items: stretch;          /* 四张卡严格等高 */
}
html[data-fs-page="support"] .fs-sc-qcard {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  padding: var(--space-5);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
  transition: transform var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
html[data-fs-page="support"] .fs-sc-qcard:hover {
  transform: translateY(-3px);                       /* 轻微上浮，不做缩放 */
  border-color: var(--fsg-dim-line);
  box-shadow: var(--fs-shadow-card-h);
}
html[data-fs-page="support"] .fs-sc-qcard-no {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--fsg-dim);
}
html[data-fs-page="support"] .fs-sc-qcard-title {
  margin-top: var(--space-2);
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: 600;
  line-height: 1.3;
  color: var(--text-1);
}
html[data-fs-page="support"] .fs-sc-qcard-desc {
  margin-top: var(--space-2);
  flex: 1 1 auto;                                    /* 撑开中间，把标签/箭头压到底部 */
  font-size: var(--fs-sm);
  line-height: 1.75;
  color: var(--text-3);
}
html[data-fs-page="support"] .fs-sc-qcard-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--fs-sc-line);
}
html[data-fs-page="support"] .fs-sc-qcard-tag {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  color: var(--text-3);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-pill);
  padding: 1px 9px;
}
html[data-fs-page="support"] .fs-sc-qcard-arrow {
  font-size: var(--fs-sm);
  line-height: 1;
  color: var(--fsg-dim);
  transition: transform var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
html[data-fs-page="support"] .fs-sc-qcard:hover .fs-sc-qcard-arrow { transform: translateX(4px); color: var(--fsg-main); }

/* ---------- 18.4 使用环境：**技术规格条**（比快速支持更轻：无底色、低高度、小标签） ---------- */
html[data-fs-page="support"] .fs-sc-env {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
}
html[data-fs-page="support"] .fs-sc-env-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--fs-sc-line);
  border-radius: var(--r-lg);
  background: transparent;
}
html[data-fs-page="support"] .fs-sc-env-k {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fsg-dim);
}
html[data-fs-page="support"] .fs-sc-env-v {
  margin-top: 6px;
  font-family: var(--font-display);
  font-size: var(--fs-base);
  font-weight: 600;
  line-height: 1.45;
  color: var(--text-1);
  overflow-wrap: anywhere;
}
html[data-fs-page="support"] .fs-sc-env-d { margin-top: 4px; font-size: 11px; line-height: 1.6; color: var(--text-3); }
html[data-fs-page="support"] .fs-sc-env-notes { margin-top: var(--space-5); display: grid; gap: 6px; }
html[data-fs-page="support"] .fs-sc-note { font-size: var(--fs-sm); line-height: 1.85; color: var(--text-3); }

/* ---------- 18.5 常见问题：两列 + 原生折叠（零 JS） ---------- */
html[data-fs-page="support"] .fs-sc-faq {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3) var(--space-5);
  align-items: start;
}
html[data-fs-page="support"] .fs-sc-faq-col { display: grid; gap: var(--space-3); min-width: 0; }
html[data-fs-page="support"] .fs-sc-faq-item {
  border: 1px solid var(--fs-sc-line);          /* 比卡片更淡的分隔线 ⇒ 弱化"卡片感" */
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
  transition: border-color var(--t-fast) var(--ease);
}
html[data-fs-page="support"] .fs-sc-faq-item:hover,
html[data-fs-page="support"] .fs-sc-faq-item[open] { border-color: var(--fsg-dim-line); }
html[data-fs-page="support"] .fs-sc-faq-q {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) 15px;
  align-items: baseline;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  cursor: pointer;
  list-style: none;
}
html[data-fs-page="support"] .fs-sc-faq-q::-webkit-details-marker { display: none; }
/* 展开时，问题与答案之间加一道很淡的分隔，明确"问题 / 答案"两级 */
html[data-fs-page="support"] .fs-sc-faq-item[open] .fs-sc-faq-q { border-bottom: 1px solid var(--fs-sc-line); }
html[data-fs-page="support"] .fs-sc-faq-no {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--fsg-dim);
}
html[data-fs-page="support"] .fs-sc-faq-t {
  font-size: var(--fs-sm);
  font-weight: 500;
  line-height: 1.6;
  color: var(--text-1);
}
/* 指示器：横线 + 竖线组成的「加号」，展开时竖线收成「减号」；用 --t-fast 让开合更干脆 */
html[data-fs-page="support"] .fs-sc-faq-ic { position: relative; align-self: center; width: 12px; height: 12px; }
html[data-fs-page="support"] .fs-sc-faq-ic::before,
html[data-fs-page="support"] .fs-sc-faq-ic::after {
  content: '';
  position: absolute;
  left: 0;
  top: 5.5px;
  width: 12px;
  height: 1px;
  background: var(--fsg-dim);
  transition: transform var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
html[data-fs-page="support"] .fs-sc-faq-ic::after { transform: rotate(90deg); }
html[data-fs-page="support"] .fs-sc-faq-item[open] .fs-sc-faq-ic::after { transform: rotate(0deg); opacity: 0; }
html[data-fs-page="support"] .fs-sc-faq-item[open] .fs-sc-faq-ic::before { background: var(--fsg-main); }
/* 答案：内缩到与问题文字左对齐，上下收紧，行高略降 ⇒ 展开后不占过大视觉空间 */
html[data-fs-page="support"] .fs-sc-faq-a {
  padding: var(--space-4) var(--space-5) var(--space-4) calc(var(--space-5) + 30px + var(--space-3));
  animation: fs-sc-reveal var(--t-fast) var(--ease-out) both;
}
html[data-fs-page="support"] .fs-sc-faq-a p { font-size: var(--fs-sm); line-height: 1.85; color: var(--text-2); }
@keyframes fs-sc-reveal {
  from { opacity: 0; transform: translateY(-3px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-fs-page="support"] .fs-sc-faq-a { animation: none !important; }
  html[data-fs-page="support"] .fs-sc-qcard:hover { transform: none !important; }
  html[data-fs-page="support"] .fs-sc-qcard:hover .fs-sc-qcard-arrow { transform: none !important; }
}

/* ---------- 18.6 技术支持：横向、低高度（像官网的入口条，不是一个空的大盒子） ---------- */
html[data-fs-page="support"] .fs-sc-tech {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6) var(--space-10);
  flex-wrap: wrap;
  padding: var(--space-6) var(--space-8);
  border: 1px solid var(--fs-sc-line);
  border-radius: var(--r-lg);
  background: var(--fs-grad-card);
}
html[data-fs-page="support"] .fs-sc-tech-copy { min-width: 0; max-width: 66ch; }
html[data-fs-page="support"] .fs-sc-tech-title {
  margin: var(--space-2) 0 0;
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: 600;
  line-height: 1.3;
  color: var(--text-1);
}
html[data-fs-page="support"] .fs-sc-tech-lead { margin-top: var(--space-3); font-size: var(--fs-base); line-height: 1.75; color: var(--text-2); }
html[data-fs-page="support"] .fs-sc-tech-desc { margin-top: var(--space-2); font-size: var(--fs-sm); line-height: 1.85; color: var(--text-3); }
html[data-fs-page="support"] .fs-sc-tech-note {
  flex: none;
  padding: 6px 14px;
  border: 1px dashed var(--fs-line-strong);
  border-radius: var(--r-pill);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text-3);
}

/* ---------- 18.7 页脚背书 ---------- */
html[data-fs-page="support"] .fs-powered {
  margin-top: var(--space-16);
  padding-top: var(--space-6);
  border-top: 1px solid var(--line-strong);
}

/* ---------- 18.8 响应式 ---------- */
@media (max-width: 1280px) {
  /* 4 列 → 2 列（宽屏以下先减列，避免卡片被压得过窄） */
  html[data-fs-page="support"] .fs-sc-quick,
  html[data-fs-page="support"] .fs-sc-env { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
  /* 平板：Hero 塌成纵向（频谱在下、状态行随之），FAQ 收成一列 */
  html[data-fs-page="support"] .fs-sc-hero-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
  html[data-fs-page="support"] .fs-sc-faq { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="support"] .fs-sc-wave { height: 110px; }
  html[data-fs-page="support"] .fs-sc-tech { padding: var(--space-5) var(--space-6); }
}
@media (max-width: 768px) {
  html[data-fs-page="support"] .section { padding: 0 0 var(--space-10); }
  html[data-fs-page="support"] .fs-sc-hero { padding-top: var(--space-10); }
  html[data-fs-page="support"] .fs-sc-quick,
  html[data-fs-page="support"] .fs-sc-env { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="support"] .fs-sc-wave { height: 84px; }
  html[data-fs-page="support"] .fs-sc-status-main { gap: 6px var(--space-4); }
  html[data-fs-page="support"] .fs-sc-faq-q {
    grid-template-columns: 26px minmax(0, 1fr) 14px;
    padding: var(--space-3) var(--space-4);
  }
  html[data-fs-page="support"] .fs-sc-faq-a {
    padding: var(--space-3) var(--space-4) var(--space-3) calc(var(--space-4) + 26px + var(--space-2));
  }
  html[data-fs-page="support"] .fs-sc-tech { flex-direction: column; align-items: stretch; }
  html[data-fs-page="support"] .fs-sc-tech-note { text-align: center; }
  html[data-fs-page="support"] .fs-open { margin-top: var(--space-6); }
}


/* ══════════════════════════════════════════════════════════════════════════
   19. 调音中心使用指南（/studio/guide）—— v3 UI 重构（2026-10-08）
   ──────────────────────────────────────────────────────────────────────────
   结构：Hero → 快速开始 → 标准操作流程 → 声音风格预设 → 调音模式(Tab)
         → 我的声音 → 功能区域说明(折叠) → 参数参考 → 注意事项
   目标：普通用户 30 秒知道怎么用；专业用户仍可查阅 PEQ 与参数说明。
   ⚠ 全部规则以 html[data-fs-page="guide"] 为前缀，不影响其它页面。
   ⚠ 宽度：本页 --container 为 1200px（见 §17.0a 附近的单独定义）。
   ⚠ Tab 为纯 CSS（radio + :checked），无 JS 依赖。
   ══════════════════════════════════════════════════════════════════════════ */

/* ---------- 19.1 通用文字与骨架 ---------- */
html[data-fs-page="guide"] .fs-gd-sec-wrap { padding: var(--space-12) 0; border-top: 1px solid var(--line); }
html[data-fs-page="guide"] .fs-gd-head { margin-bottom: var(--space-6); }
html[data-fs-page="guide"] .fs-gd-h2 {
  position: relative;
  margin: var(--space-3) 0 0;
  padding-left: 16px;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--text-1);
}
html[data-fs-page="guide"] .fs-gd-h2::before {
  content: '';
  position: absolute;
  left: 0;
  top: .3em;
  bottom: .3em;
  width: 3px;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--fsg-main), rgba(201, 175, 108, .22));
}
html[data-fs-page="guide"] .fs-gd-head-sub { margin: var(--space-3) 0 0; font-size: var(--fs-base); color: var(--text-3); }
html[data-fs-page="guide"] .fs-gd-p { margin: 0 0 var(--space-4); font-size: var(--fs-base); line-height: 1.85; color: var(--text-2); }
html[data-fs-page="guide"] .fs-gd-p--hint { margin: var(--space-4) 0 0; font-size: var(--fs-sm); color: var(--text-3); }
html[data-fs-page="guide"] .fs-gd-mono { font-family: var(--font-mono); }

/* ---------- 19.2 Hero ---------- */
html[data-fs-page="guide"] .fs-gd-hero { padding: var(--space-12) 0 var(--space-12); }
html[data-fs-page="guide"] .fs-gd-backrow { margin-bottom: var(--space-6); }
html[data-fs-page="guide"] .fs-gd-back {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: var(--fs-sm); color: var(--text-3); text-decoration: none;
  transition: color .15s ease;
}
html[data-fs-page="guide"] .fs-gd-back:hover { color: var(--fsg-main); }
html[data-fs-page="guide"] .fs-gd-back-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border: 1px solid var(--fs-line); border-radius: 50%;
  font-size: 12px; line-height: 1; transition: border-color .15s ease;
}
html[data-fs-page="guide"] .fs-gd-back:hover .fs-gd-back-ico { border-color: var(--fs-gold-line); }

html[data-fs-page="guide"] .fs-gd-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
  gap: var(--space-10);
  align-items: center;
}
html[data-fs-page="guide"] .fs-gd-hero .fs-sechen { color: var(--fsg-main); }
html[data-fs-page="guide"] .fs-gd-h1 {
  margin: var(--space-3) 0 0;
  font-size: 40px; font-weight: 700; line-height: 1.2; letter-spacing: .01em; color: var(--text-1);
}
html[data-fs-page="guide"] .fs-gd-sub {
  margin: var(--space-2) 0 0;
  font-size: 20px; font-weight: 500; color: var(--fsg-main); letter-spacing: .04em;
}
html[data-fs-page="guide"] .fs-gd-lead {
  margin: var(--space-5) 0 var(--space-3);
  font-size: var(--fs-lg); line-height: 1.8; color: var(--text-2);
}
html[data-fs-page="guide"] .fs-gd-lead strong { color: var(--text-1); font-weight: 600; }
html[data-fs-page="guide"] .fs-gd-hero-list {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2) var(--space-4);
  margin: 0 0 var(--space-6); padding: 0; list-style: none;
}
html[data-fs-page="guide"] .fs-gd-hero-list > li {
  position: relative; padding-left: 20px;
  font-size: var(--fs-base); line-height: 1.8; color: var(--text-1);
}
html[data-fs-page="guide"] .fs-gd-hero-list > li::before {
  content: ''; position: absolute; left: 2px; top: .72em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--fsg-main);
}
html[data-fs-page="guide"] .fs-gd-hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-4); }
html[data-fs-page="guide"] .fs-gd-hero-note {
  margin: var(--space-5) 0 0; max-width: 46em;
  font-size: var(--fs-sm); line-height: 1.8; color: var(--text-3);
}
html[data-fs-page="guide"] .fs-gd-hero-visual { min-width: 0; }
html[data-fs-page="guide"] .fs-gd-hero-visual svg { display: block; width: 100%; height: auto; }

/* ---------- 19.3 快速开始（4 张步骤卡） ---------- */
html[data-fs-page="guide"] .fs-gd-start {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4); margin: 0; padding: 0; list-style: none;
}
html[data-fs-page="guide"] .fs-gd-startcard {
  position: relative;
  padding: var(--space-6) var(--space-5);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
  transition: border-color .2s ease, transform .2s ease;
}
html[data-fs-page="guide"] .fs-gd-startcard:hover { border-color: var(--fs-gold-line); transform: translateY(-2px); }
html[data-fs-page="guide"] .fs-gd-startcard-no {
  position: absolute; top: var(--space-4); right: var(--space-5);
  font-family: var(--font-mono); font-size: 22px; font-weight: 600;
  color: rgba(201, 175, 108, .28);
}
html[data-fs-page="guide"] .fs-gd-startcard-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; margin-bottom: var(--space-4);
  border: 1px solid var(--fs-gold-line); border-radius: 12px;
  background: var(--fs-gold-soft); color: var(--fsg-main);
}
html[data-fs-page="guide"] .fs-gd-startcard-ico svg { width: 22px; height: 22px; }
html[data-fs-page="guide"] .fs-gd-startcard-t { margin: 0 0 var(--space-3); font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
html[data-fs-page="guide"] .fs-gd-startcard-l { margin: 0; padding: 0; list-style: none; }
html[data-fs-page="guide"] .fs-gd-startcard-l > li {
  position: relative; padding-left: 16px; margin-bottom: 4px;
  font-size: var(--fs-sm); line-height: 1.7; color: var(--text-2);
}
html[data-fs-page="guide"] .fs-gd-startcard-l > li::before {
  content: ''; position: absolute; left: 0; top: .68em;
  width: 5px; height: 5px; border-radius: 50%; background: var(--fsg-dim);
}

/* ---------- 19.4 时间线 ---------- */
html[data-fs-page="guide"] .fs-gd-timeline { position: relative; margin: 0 0 var(--space-6); padding: 0 0 0 34px; list-style: none; }
html[data-fs-page="guide"] .fs-gd-timeline::before {
  content: ''; position: absolute; left: 13px; top: 12px; bottom: 12px; width: 1px;
  background: linear-gradient(180deg, var(--fs-gold-line), rgba(255,255,255,.06));
}
html[data-fs-page="guide"] .fs-gd-tl-item { position: relative; padding: 0 0 var(--space-5); }
html[data-fs-page="guide"] .fs-gd-tl-item:last-child { padding-bottom: 0; }
html[data-fs-page="guide"] .fs-gd-tl-dot {
  position: absolute; left: -34px; top: -2px;
  display: inline-flex; align-items: center; justify-content: center;
  width: 27px; height: 27px; border-radius: 50%;
  border: 1px solid var(--fs-gold-line); background: #16161A;
  color: var(--fsg-main); font-family: var(--font-mono); font-size: var(--fs-sm);
}
html[data-fs-page="guide"] .fs-gd-tl-t { margin: 0 0 4px; font-size: var(--fs-lg); font-weight: 600; color: var(--text-1); }
html[data-fs-page="guide"] .fs-gd-tl-d { margin: 0; font-size: var(--fs-base); line-height: 1.8; color: var(--text-2); }
html[data-fs-page="guide"] .fs-gd-timeline--compact .fs-gd-tl-t { font-size: var(--fs-base); }
html[data-fs-page="guide"] .fs-gd-timeline--compact .fs-gd-tl-d { font-size: var(--fs-sm); color: var(--text-3); }

/* ---------- 19.5 提示框（callout） ---------- */
html[data-fs-page="guide"] .fs-gd-callout {
  margin-top: var(--space-5);
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--fs-gold-line);
  border-left-width: 3px;
  border-radius: var(--r-lg);
  background: var(--fs-gold-soft);
}
html[data-fs-page="guide"] .fs-gd-callout--soft {
  border: 1px solid var(--line);
  border-left: 3px solid var(--fsg-dim);
  background: transparent;
}
html[data-fs-page="guide"] .fs-gd-callout-t { margin-bottom: var(--space-4); font-size: var(--fs-base); font-weight: 600; color: var(--fsg-main); }
html[data-fs-page="guide"] .fs-gd-callout-p { margin: 0; font-size: var(--fs-sm); line-height: 1.85; color: var(--text-2); }
html[data-fs-page="guide"] .fs-gd-callout-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
html[data-fs-page="guide"] .fs-gd-callout-cell {
  display: flex; flex-direction: column; gap: 4px;
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--fs-line); border-radius: 10px;
  background: rgba(255, 255, 255, .02);
}
html[data-fs-page="guide"] .fs-gd-callout-cell.is-strong { border-color: var(--fs-gold-line); background: rgba(201, 175, 108, .1); }
html[data-fs-page="guide"] .fs-gd-callout-k { font-size: var(--fs-sm); font-weight: 600; color: var(--text-1); }
html[data-fs-page="guide"] .fs-gd-callout-v { font-size: var(--fs-sm); color: var(--text-2); }
html[data-fs-page="guide"] .fs-gd-callout-cell.is-strong .fs-gd-callout-k { color: var(--fsg-main); }

/* ---------- 19.6 声音风格预设（5 卡 + 示意曲线） ---------- */
html[data-fs-page="guide"] .fs-gd-presets {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-4); margin: 0; padding: 0; list-style: none;
}
html[data-fs-page="guide"] .fs-gd-preset {
  padding: var(--space-5);
  border: 1px solid var(--fs-line); border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
  transition: border-color .2s ease, transform .2s ease;
}
html[data-fs-page="guide"] .fs-gd-preset:hover { border-color: var(--fs-gold-line); transform: translateY(-2px); }
html[data-fs-page="guide"] .fs-gd-preset-curve {
  height: 40px; margin-bottom: var(--space-4);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}
html[data-fs-page="guide"] .fs-gd-preset-curve svg { display: block; width: 100%; height: 34px; }
html[data-fs-page="guide"] .fs-gd-preset-t { margin: 0 0 var(--space-2); font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
html[data-fs-page="guide"] .fs-gd-preset-d { margin: 0; font-size: var(--fs-sm); line-height: 1.7; color: var(--text-3); }

/* ---------- 19.7 调音模式（纯 CSS Tab） ---------- */
html[data-fs-page="guide"] .fs-gd-tabinput { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
html[data-fs-page="guide"] .fs-gd-tabbar {
  display: inline-flex; gap: 6px; padding: 5px;
  border: 1px solid var(--fs-line); border-radius: 999px;
  background: var(--fs-bg-panel-soft);
}
html[data-fs-page="guide"] .fs-gd-tab {
  display: flex; flex-direction: column; gap: 2px;
  padding: 9px 22px; border-radius: 999px; cursor: pointer;
  transition: background .2s ease, color .2s ease;
}
html[data-fs-page="guide"] .fs-gd-tab-t { font-size: var(--fs-base); font-weight: 600; color: var(--text-2); }
html[data-fs-page="guide"] .fs-gd-tab-s { font-size: var(--fs-xs); color: var(--text-3); }
html[data-fs-page="guide"] .fs-gd-tab:hover .fs-gd-tab-t { color: var(--text-1); }
html[data-fs-page="guide"] #gdtab-basic:checked ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-basic"],
html[data-fs-page="guide"] #gdtab-peq:checked   ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-peq"] {
  background: var(--fs-gold-soft);
  box-shadow: inset 0 0 0 1px var(--fs-gold-line);
}
html[data-fs-page="guide"] #gdtab-basic:checked ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-basic"] .fs-gd-tab-t,
html[data-fs-page="guide"] #gdtab-peq:checked   ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-peq"] .fs-gd-tab-t { color: var(--fsg-main); }
html[data-fs-page="guide"] #gdtab-basic:checked ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-basic"] .fs-gd-tab-s,
html[data-fs-page="guide"] #gdtab-peq:checked   ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-peq"] .fs-gd-tab-s { color: rgba(201,175,108,.8); }
html[data-fs-page="guide"] #gdtab-basic:focus-visible ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-basic"],
html[data-fs-page="guide"] #gdtab-peq:focus-visible   ~ .fs-gd-tabbar .fs-gd-tab[for="gdtab-peq"] { outline: 1px solid var(--fsg-main); outline-offset: 2px; }

html[data-fs-page="guide"] .fs-gd-tabpanel { display: none; margin-top: var(--space-6); }
html[data-fs-page="guide"] #gdtab-basic:checked ~ .fs-gd-tabpanel--basic { display: block; }
html[data-fs-page="guide"] #gdtab-peq:checked   ~ .fs-gd-tabpanel--peq   { display: block; }

html[data-fs-page="guide"] .fs-gd-bandchips {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-3); margin: 0 0 var(--space-5); padding: 0; list-style: none;
}
html[data-fs-page="guide"] .fs-gd-bandchips > li {
  display: flex; flex-direction: column; gap: 4px;
  padding: var(--space-4); border: 1px solid var(--fs-line); border-radius: 10px;
  background: rgba(255, 255, 255, .02);
}
html[data-fs-page="guide"] .fs-gd-bandchips b { font-size: var(--fs-base); color: var(--text-1); }
html[data-fs-page="guide"] .fs-gd-bandchips span { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--fsg-dim); }

/* ---------- 19.8 面板 / 列表 / 表格 ---------- */
html[data-fs-page="guide"] .fs-gd-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); margin: 0 0 var(--space-5); }
html[data-fs-page="guide"] .fs-gd-panel {
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--fs-line); border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
}
html[data-fs-page="guide"] .fs-gd-panel-t { margin-bottom: var(--space-3); font-size: var(--fs-sm); font-weight: 600; letter-spacing: .06em; color: var(--fsg-main); }
html[data-fs-page="guide"] .fs-gd-ul { margin: 0 0 var(--space-4); padding: 0; list-style: none; }
html[data-fs-page="guide"] .fs-gd-ul > li { position: relative; padding: 0 0 var(--space-3) 20px; font-size: var(--fs-base); line-height: 1.8; color: var(--text-2); }
html[data-fs-page="guide"] .fs-gd-ul > li::before {
  content: ''; position: absolute; left: 0; top: .72em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--fsg-dim);
}
html[data-fs-page="guide"] .fs-gd-ul--kv > li b { display: inline-block; min-width: 92px; margin-right: 12px; color: var(--text-1); font-weight: 600; }
html[data-fs-page="guide"] .fs-gd-tablewrap { margin: 0 0 var(--space-5); overflow-x: auto; border: 1px solid var(--fs-line); border-radius: var(--r-lg); }
html[data-fs-page="guide"] .fs-gd-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: var(--fs-sm); }
html[data-fs-page="guide"] .fs-gd-table th,
html[data-fs-page="guide"] .fs-gd-table td {
  padding: 11px 16px; text-align: left; vertical-align: top; line-height: 1.7;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}
html[data-fs-page="guide"] .fs-gd-table thead th {
  font-weight: 600; color: var(--fsg-main); letter-spacing: .04em;
  background: rgba(255, 255, 255, .02); border-bottom: 1px solid var(--fs-gold-line); white-space: nowrap;
}
html[data-fs-page="guide"] .fs-gd-table tbody td { color: var(--text-2); }
html[data-fs-page="guide"] .fs-gd-table tbody td:first-child { color: var(--text-1); white-space: nowrap; }
html[data-fs-page="guide"] .fs-gd-table tbody tr:last-child td { border-bottom: 0; }
html[data-fs-page="guide"] .fs-gd-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, .018); }
html[data-fs-page="guide"] .fs-gd-table tbody tr:hover { background: rgba(201, 175, 108, .05); }
html[data-fs-page="guide"] .fs-gd-table--ref tbody td:nth-child(2) { color: var(--text-1); }

/* ---------- 19.9 我的声音：三个能力 ---------- */
html[data-fs-page="guide"] .fs-gd-actions3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); margin: 0 0 var(--space-5); }
html[data-fs-page="guide"] .fs-gd-action {
  display: flex; flex-direction: column; gap: 6px;
  padding: var(--space-5); border: 1px solid var(--fs-line); border-radius: var(--r-lg);
  background: var(--fs-bg-panel-soft);
}
html[data-fs-page="guide"] .fs-gd-action-t { font-size: var(--fs-base); font-weight: 600; color: var(--fsg-main); }
html[data-fs-page="guide"] .fs-gd-action-d { font-size: var(--fs-sm); line-height: 1.7; color: var(--text-2); }

/* ---------- 19.10 功能区域说明（折叠） ---------- */
html[data-fs-page="guide"] .fs-gd-acc { border: 1px solid var(--fs-line); border-radius: var(--r-lg); overflow: hidden; background: var(--fs-bg-panel-soft); }
html[data-fs-page="guide"] .fs-gd-acc-item + .fs-gd-acc-item { border-top: 1px solid rgba(255, 255, 255, .06); }
html[data-fs-page="guide"] .fs-gd-acc-sum {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
  padding: var(--space-5) var(--space-6); cursor: pointer; list-style: none;
  transition: background .15s ease;
}
html[data-fs-page="guide"] .fs-gd-acc-sum::-webkit-details-marker { display: none; }
html[data-fs-page="guide"] .fs-gd-acc-sum:hover { background: rgba(255, 255, 255, .025); }
html[data-fs-page="guide"] .fs-gd-acc-t { font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
html[data-fs-page="guide"] .fs-gd-acc-ico { position: relative; flex: none; width: 14px; height: 14px; }
html[data-fs-page="guide"] .fs-gd-acc-ico::before,
html[data-fs-page="guide"] .fs-gd-acc-ico::after {
  content: ''; position: absolute; left: 50%; top: 50%; background: var(--fsg-main);
  transform: translate(-50%, -50%); transition: transform .2s ease, opacity .2s ease;
}
html[data-fs-page="guide"] .fs-gd-acc-ico::before { width: 13px; height: 1.5px; }
html[data-fs-page="guide"] .fs-gd-acc-ico::after  { width: 1.5px; height: 13px; }
html[data-fs-page="guide"] .fs-gd-acc-item[open] .fs-gd-acc-ico::after { transform: translate(-50%, -50%) scaleY(0); opacity: 0; }
html[data-fs-page="guide"] .fs-gd-acc-body { padding: 0 var(--space-6) var(--space-5); }
html[data-fs-page="guide"] .fs-gd-acc-body .fs-gd-ul { margin-bottom: 0; }

/* ---------- 19.11 注意事项（警示框） ---------- */
html[data-fs-page="guide"] .fs-gd-warnbox {
  padding: var(--space-6);
  border: 1px solid rgba(201, 175, 108, .38);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(201, 175, 108, .09), rgba(201, 175, 108, .03));
}
html[data-fs-page="guide"] .fs-gd-warnbox-head { display: flex; align-items: center; gap: 10px; margin-bottom: var(--space-4); }
html[data-fs-page="guide"] .fs-gd-warnbox-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--fsg-main); color: #16161A; font-size: 13px; font-weight: 700;
}
html[data-fs-page="guide"] .fs-gd-warnbox-t { font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
html[data-fs-page="guide"] .fs-gd-warnbox-list { margin: 0; padding: 0; list-style: none; }
html[data-fs-page="guide"] .fs-gd-warnbox-list > li {
  position: relative; padding: 0 0 var(--space-3) 18px;
  font-size: var(--fs-base); line-height: 1.85; color: var(--text-2);
}
html[data-fs-page="guide"] .fs-gd-warnbox-list > li:last-child { padding-bottom: 0; }
html[data-fs-page="guide"] .fs-gd-warnbox-list > li::before {
  content: ''; position: absolute; left: 0; top: .74em;
  width: 6px; height: 6px; border-radius: 50%; background: var(--fsg-main);
}

/* ---------- 19.12 底部导航 ---------- */
html[data-fs-page="guide"] .fs-gd-endnav { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--line-strong); }
html[data-fs-page="guide"] .fs-gd-endbtn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 22px; border: 1px solid var(--fs-line); border-radius: 999px;
  font-size: var(--fs-sm); color: var(--text-2); text-decoration: none;
  transition: border-color .15s ease, color .15s ease, background .15s ease;
}
html[data-fs-page="guide"] .fs-gd-endbtn:hover { border-color: var(--fs-gold-line); color: var(--fsg-main); background: var(--fs-gold-soft); }
html[data-fs-page="guide"] .fs-gd-foot-line { margin: var(--space-6) 0 0; font-size: var(--fs-xs); line-height: 1.8; color: var(--text-3); }

/* ---------- 19.13 响应式 ---------- */
@media (max-width: 1100px) {
  html[data-fs-page="guide"] .fs-gd-hero-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
  html[data-fs-page="guide"] .fs-gd-hero-visual { max-width: 460px; }
  html[data-fs-page="guide"] .fs-gd-start { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-fs-page="guide"] .fs-gd-presets { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  html[data-fs-page="guide"] .fs-gd-bandchips { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html[data-fs-page="guide"] .fs-gd-grid2,
  html[data-fs-page="guide"] .fs-gd-actions3,
  html[data-fs-page="guide"] .fs-gd-callout-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  html[data-fs-page="guide"] .fs-gd-h1 { font-size: 30px; }
  html[data-fs-page="guide"] .fs-gd-sub { font-size: 17px; }
  html[data-fs-page="guide"] .fs-gd-lead { font-size: var(--fs-base); }
  html[data-fs-page="guide"] .fs-gd-hero-list { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="guide"] .fs-gd-hero-actions .btn { width: 100%; justify-content: center; }
  html[data-fs-page="guide"] .fs-gd-start,
  html[data-fs-page="guide"] .fs-gd-presets,
  html[data-fs-page="guide"] .fs-gd-bandchips { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="guide"] .fs-gd-h2 { font-size: 20px; }
  html[data-fs-page="guide"] .fs-gd-ul--kv > li b { min-width: 0; display: block; margin-right: 0; }
  html[data-fs-page="guide"] .fs-gd-acc-sum { padding: var(--space-4) var(--space-5); }
  html[data-fs-page="guide"] .fs-gd-acc-body { padding: 0 var(--space-5) var(--space-5); }
}

/* ---------- 19.14 首页「使用说明」区末尾：完整指南入口（2026-10-08） ----------
   ⚠ 页面作用域是 home（不是 guide）—— v3 重写 §19 时曾误删，此处补回。 */
html[data-fs-page="home"] .fs-steps-more { margin: var(--space-6) 0 0; }
html[data-fs-page="home"] .fs-steps-more-link {
  display: inline-flex;
  align-items: center;
  font-size: var(--fs-sm);
  color: var(--fsg-main);
  text-decoration: none;
  border-bottom: 1px solid var(--fs-gold-line);
  padding-bottom: 2px;
  transition: color .15s ease, border-color .15s ease;
}
html[data-fs-page="home"] .fs-steps-more-link:hover { border-color: var(--fsg-main); }

/* ══════════════════════════════════════════════════════════════════════════
   20. 平台首页 v3 重构（/studio，2026-10-08）
   ──────────────────────────────────────────────────────────────────────────
   定位：专业音频设备控制平台首页（非营销官网、非帮助页）。
   结构：Hero(+CURRENT DEVICE 卡) → 核心功能 3 卡 → 快速开始 5 步 → 音频能力 2 栏
         → 推荐环境 + 提示条 → Footer 品牌行
   ⚠ 全部规则以 html[data-fs-page="home"] 为前缀 —— 不影响设备中心 / 支持中心 / 调音中心 / 指南页。
   ⚠ 复用既有类：.fs-sechen（小标）· .fs-features/.fs-card*（功能卡）· .fs-conn-*（设备面板填充点）
   ⚠ 未连接判断用 :has()（依赖 studio.js 给未命中字段加 .fs-kv-v.is-muted）——Chrome/Edge 105+ 支持。
   ══════════════════════════════════════════════════════════════════════════ */

/* ---------- 20.1 Hero ---------- */
html[data-fs-page="home"] .fs-home-hero {
  position: relative;
  padding: var(--space-16) 0 var(--space-12);
  border-bottom: 1px solid var(--line-strong);
  background:
    radial-gradient(720px 320px at 82% 18%, rgba(201, 175, 108, .07), transparent 70%),
    linear-gradient(180deg, rgba(255, 255, 255, .012), transparent);
}
html[data-fs-page="home"] .fs-home-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 400px);
  gap: var(--space-12);
  align-items: center;
}
html[data-fs-page="home"] .fs-home-hero .fs-sechen { color: var(--fsg-main); }
html[data-fs-page="home"] .fs-home-h1 {
  margin: var(--space-4) 0 0;
  font-size: 38px;
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: .01em;
  color: var(--text-1);
}
html[data-fs-page="home"] .fs-home-brand {
  margin: var(--space-3) 0 0;
  font-size: var(--fs-base);
  letter-spacing: .06em;
  color: var(--fsg-main);
}
html[data-fs-page="home"] .fs-home-sub {
  margin: var(--space-4) 0 0;
  max-width: 30em;
  font-size: var(--fs-lg);
  line-height: 1.8;
  color: var(--text-2);
}
html[data-fs-page="home"] .fs-home-cta { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-6); }

/* ---------- 20.2 Hero 右侧：CURRENT DEVICE 卡 ---------- */
html[data-fs-page="home"] .fs-home-dev {
  padding: var(--space-6);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, .012));
  box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
}
html[data-fs-page="home"] .fs-home-dev-h {
  margin-bottom: var(--space-5);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: .22em;
  color: var(--fsg-dim);
}
html[data-fs-page="home"] .fs-home-dev-panel { display: block; }
html[data-fs-page="home"] .fs-home-dev .fs-conn-main {
  margin: var(--space-4) 0 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--text-1);
}
html[data-fs-page="home"] .fs-home-dev .fs-conn-minor { margin-top: 4px; font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-3); }
html[data-fs-page="home"] .fs-home-dev .fs-conn-hint { margin: var(--space-3) 0 0; font-size: var(--fs-xs); line-height: 1.8; color: var(--text-3); }
html[data-fs-page="home"] .fs-home-dev-meta {
  margin: var(--space-5) 0 0;
  padding: var(--space-4) 0 0;
  border-top: 1px solid rgba(255, 255, 255, .07);
}
html[data-fs-page="home"] .fs-home-dev-meta > div { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-4); }
html[data-fs-page="home"] .fs-home-dev-meta dt { font-size: var(--fs-sm); color: var(--text-3); }
html[data-fs-page="home"] .fs-home-dev-meta dd { margin: 0; font-family: var(--font-mono); font-size: var(--fs-sm); color: var(--text-1); }
html[data-fs-page="home"] .fs-home-dev-tip { margin: var(--space-4) 0 0; font-size: var(--fs-xs); line-height: 1.75; color: var(--text-3); }
html[data-fs-page="home"] .fs-home-dev-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
html[data-fs-page="home"] .fs-home-dev .btn { padding: 9px 18px; font-size: var(--fs-sm); }
html[data-fs-page="home"] .fs-home-dev .fs-fw-upd { margin-top: var(--space-4); }

/* ---------- 20.3 通用区段标题 ---------- */
html[data-fs-page="home"] .fs-home-head { margin-bottom: var(--space-6); }
html[data-fs-page="home"] .fs-home-h2 {
  position: relative;
  margin: var(--space-3) 0 0;
  padding-left: 16px;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--text-1);
}
html[data-fs-page="home"] .fs-home-h2::before {
  content: '';
  position: absolute;
  left: 0; top: .3em; bottom: .3em;
  width: 3px; border-radius: 2px;
  background: linear-gradient(180deg, var(--fsg-main), rgba(201, 175, 108, .22));
}
html[data-fs-page="home"] .fs-home-head-sub { margin: var(--space-3) 0 0; font-size: var(--fs-sm); color: var(--text-3); }

/* ---------- 20.4 快速开始：横向 5 步（无卡片框） ---------- */
html[data-fs-page="home"] .fs-home-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-5);
  margin: 0;
  padding: 0;
  list-style: none;
}
html[data-fs-page="home"] .fs-home-flow-item {
  position: relative;
  padding-top: var(--space-5);
  border-top: 1px solid var(--fs-line);
}
html[data-fs-page="home"] .fs-home-flow-item::before {   /* 顶部金色短标 */
  content: '';
  position: absolute;
  left: 0; top: -1px;
  width: 28px; height: 2px;
  background: var(--fsg-main);
  opacity: .55;
}
html[data-fs-page="home"] .fs-home-flow-item::after {    /* 步骤之间的连接线 */
  content: '';
  position: absolute;
  top: calc(var(--space-5) - 1px);
  right: calc(var(--space-5) * -1);
  width: var(--space-5);
  height: 1px;
  background: linear-gradient(90deg, rgba(201, 175, 108, .45), rgba(201, 175, 108, .05));
}
html[data-fs-page="home"] .fs-home-flow-item:last-child::after { display: none; }
html[data-fs-page="home"] .fs-home-flow-no {
  display: block;
  font-family: var(--font-mono);
  font-size: 20px;
  font-weight: 600;
  color: rgba(201, 175, 108, .55);
}
html[data-fs-page="home"] .fs-home-flow-t { display: block; margin-top: var(--space-3); font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
html[data-fs-page="home"] .fs-home-flow-d { display: block; margin-top: 6px; font-size: var(--fs-sm); line-height: 1.7; color: var(--text-3); }

/* ---------- 20.5 音频能力：左右两栏 ---------- */
html[data-fs-page="home"] .fs-home-cap-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
}
html[data-fs-page="home"] .fs-home-cap-col {
  padding: var(--space-6);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .015);
}
html[data-fs-page="home"] .fs-home-cap-h {
  margin-bottom: var(--space-5);
  font-size: var(--fs-sm);
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--fsg-main);
}
html[data-fs-page="home"] .fs-home-cap-list { margin: 0; padding: 0; list-style: none; }
html[data-fs-page="home"] .fs-home-cap-item { padding: var(--space-3) 0; border-top: 1px solid rgba(255, 255, 255, .055); }
html[data-fs-page="home"] .fs-home-cap-item:first-child { border-top: 0; padding-top: 0; }
html[data-fs-page="home"] .fs-home-cap-t { display: block; font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
html[data-fs-page="home"] .fs-home-cap-d { display: block; margin-top: 4px; font-size: var(--fs-sm); line-height: 1.7; color: var(--text-3); }

html[data-fs-page="home"] .fs-home-cap-rows { display: flex; flex-direction: column; gap: var(--space-5); }
html[data-fs-page="home"] .fs-home-cap-row { display: flex; flex-direction: column; gap: 6px; }
html[data-fs-page="home"] .fs-home-cap-k { font-size: var(--fs-xs); letter-spacing: .1em; color: var(--text-3); }
html[data-fs-page="home"] .fs-home-cap-v { font-size: var(--fs-base); line-height: 1.75; color: var(--text-1); }
html[data-fs-page="home"] .fs-home-cap-v.fs-kv-v.is-muted { color: var(--text-3); }
html[data-fs-page="home"] .fs-home-cap-note { margin: var(--space-5) 0 0; font-size: var(--fs-xs); line-height: 1.8; color: var(--text-3); }

/* 未连接 / 未命中 → 显示「等待连接设备」，隐藏能力行（依据 studio.js 写入的 is-muted） */
html[data-fs-page="home"] .fs-home-cap-wait { display: none; margin: 0; font-size: var(--fs-base); color: var(--text-3); }
html[data-fs-page="home"] .fs-home-cap-dev:has(.fs-kv-v.is-muted) .fs-home-cap-rows { display: none; }
html[data-fs-page="home"] .fs-home-cap-dev:has(.fs-kv-v.is-muted) .fs-home-cap-wait { display: block; }

/* ---------- 20.6 推荐环境（一行 4 格） ---------- */
html[data-fs-page="home"] .fs-home-env {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .015);
  overflow: hidden;
}
html[data-fs-page="home"] .fs-home-env-cell { padding: var(--space-5) var(--space-6); }
html[data-fs-page="home"] .fs-home-env-cell + .fs-home-env-cell { border-left: 1px solid rgba(255, 255, 255, .055); }
html[data-fs-page="home"] .fs-home-env-k { display: block; font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: .12em; color: var(--fsg-dim); }
html[data-fs-page="home"] .fs-home-env-v { display: block; margin-top: 6px; font-size: var(--fs-base); color: var(--text-1); }

/* ---------- 20.7 提示条（承接原「注意事项」） ---------- */
html[data-fs-page="home"] .fs-home-tip {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  margin-top: var(--space-5);
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--fs-gold-line);
  border-left-width: 3px;
  border-radius: 8px;
  background: var(--fs-gold-soft);
}
html[data-fs-page="home"] .fs-home-tip-h { flex: none; font-size: var(--fs-sm); font-weight: 600; color: var(--fsg-main); }
html[data-fs-page="home"] .fs-home-tip-list { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px var(--space-6); }
html[data-fs-page="home"] .fs-home-tip-list > li { font-size: var(--fs-sm); line-height: 1.7; color: var(--text-2); }

/* ---------- 20.8 Footer 品牌行 ---------- */
html[data-fs-page="home"] .fs-home-foot { padding: var(--space-10) 0 0; }
html[data-fs-page="home"] .fs-home-foot-brand { margin: 0; font-family: var(--font-mono); font-size: var(--fs-sm); letter-spacing: .16em; color: var(--fsg-main); }
html[data-fs-page="home"] .fs-home-foot-tag { margin: var(--space-3) 0 0; font-size: var(--fs-sm); color: var(--text-3); }

/* ---------- 20.9 响应式 ---------- */
@media (max-width: 1100px) {
  html[data-fs-page="home"] .fs-home-hero-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
  html[data-fs-page="home"] .fs-home-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--space-6); }
  html[data-fs-page="home"] .fs-home-flow-item:nth-child(3n)::after { display: none; }
  html[data-fs-page="home"] .fs-home-cap-grid { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="home"] .fs-home-env { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-fs-page="home"] .fs-home-env-cell:nth-child(odd) { border-left: 0; }
  html[data-fs-page="home"] .fs-home-env-cell:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .055); }
}
@media (max-width: 640px) {
  html[data-fs-page="home"] .fs-home-hero { padding: var(--space-12) 0 var(--space-10); }
  html[data-fs-page="home"] .fs-home-h1 { font-size: 28px; }
  html[data-fs-page="home"] .fs-home-sub { font-size: var(--fs-base); }
  html[data-fs-page="home"] .fs-home-cta .btn { width: 100%; justify-content: center; }
  html[data-fs-page="home"] .fs-home-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-fs-page="home"] .fs-home-flow-item::after { display: none; }
  html[data-fs-page="home"] .fs-home-env { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="home"] .fs-home-env-cell + .fs-home-env-cell { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .055); }
  html[data-fs-page="home"] .fs-home-tip { flex-direction: column; gap: var(--space-2); }
  html[data-fs-page="home"] .fs-home-tip-list { flex-direction: column; gap: 4px; }
}

/* ══════════════════════════════════════════════════════════════════════════
   21. 设备中心 v3 重排（/studio/devices，2026-10-08）
   ──────────────────────────────────────────────────────────────────────────
   定位：专业音频硬件管理中心（硬件控制面板）。
   结构：① Hero/当前设备 → ② 设备信息 → ③ 能力 → ④ 固件 → ⑤ 开放中条 + 页脚
   ⚠ 全部规则以 html[data-fs-page="devices"] 为前缀 —— 不影响首页 / 支持中心 / 指南页。
   ⚠ kv 值元素的 class 会被 studio.js 重写为 'fs-kv-v[ is-muted]'
     ⇒ 下面一律用 **属性选择器 [data-fs-kv="…"]** 定位（属性不会被重写），
       自定义类只用于「容器」和「非 kv 元素」。
   ══════════════════════════════════════════════════════════════════════════ */

/* ---------- 21.1 Hero ---------- */
html[data-fs-page="devices"] .fs-dc-hero { padding: var(--space-12) 0 var(--space-10); }
html[data-fs-page="devices"] .fs-dc-h1 {
  margin: var(--space-4) 0 0;
  font-size: 34px; font-weight: 700; line-height: 1.24; letter-spacing: .01em; color: var(--text-1);
}
html[data-fs-page="devices"] .fs-dc-sub { margin: var(--space-3) 0 0; font-size: var(--fs-lg); color: var(--text-3); }

/* 当前设备主区域：宽条状，左信息 / 右操作 + 轻量 EQ 装饰 */
html[data-fs-page="devices"] .fs-dc-dev {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
  gap: var(--space-8);
  align-items: center;
  margin-top: var(--space-6);
  padding: var(--space-6) var(--space-7, var(--space-6));
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, .012));
  box-shadow: 0 18px 40px rgba(0, 0, 0, .32);
}
html[data-fs-page="devices"] .fs-dc-dev-main { min-width: 0; }
html[data-fs-page="devices"] .fs-dc-dev-h {
  display: block;
  margin-bottom: var(--space-4);
  font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: .22em; color: var(--fsg-dim);
}
html[data-fs-page="devices"] .fs-dc-dev .fs-conn-state { font-size: var(--fs-sm); }
/* 设备名称（唯一 model）：提级为卡片主信息 */
html[data-fs-page="devices"] .fs-dc-dev [data-fs-kv="model"] {
  display: block;
  margin-top: var(--space-3);
  font-size: 26px; font-weight: 700; line-height: 1.3; color: var(--text-1);
}
html[data-fs-page="devices"] .fs-dc-dev [data-fs-kv="model"].is-muted { font-size: var(--fs-lg); font-weight: 500; color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-dev .fs-conn-minor { margin-top: 4px; font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-dev-stateline { display: flex; align-items: baseline; gap: 10px; margin-top: var(--space-4); }
html[data-fs-page="devices"] .fs-dc-dev-k { font-size: var(--fs-sm); color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-dev [data-fs-kv="state"] { font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
html[data-fs-page="devices"] .fs-dc-dev [data-fs-kv="state"].is-muted { font-weight: 500; color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-dev .fs-conn-hint { margin: var(--space-4) 0 0; font-size: var(--fs-sm); line-height: 1.75; color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-dev [data-fs-detail-note] { margin: var(--space-3) 0 0; font-size: var(--fs-sm); line-height: 1.75; color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-dev-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
html[data-fs-page="devices"] .fs-dc-dev-visual { min-width: 0; opacity: .9; }
html[data-fs-page="devices"] .fs-dc-dev-visual svg { display: block; width: 100%; height: auto; }

/* ---------- 21.2 区段通用 ---------- */
html[data-fs-page="devices"] .fs-dc-sec { padding: var(--space-10) 0; border-top: 1px solid var(--line); }
html[data-fs-page="devices"] .fs-dc-head { margin-bottom: var(--space-5); }
/* ⚠ 2026-10-08 对齐修复：区段页头是「eyebrow 靠左 / 标题靠右」的分栏（space-between）。
   「能力」段比其他段多一行说明文案；若它作为普通 flex 子项留在同一行，
   3 个元素会被平均摊开 ⇒ 标题「能力」飘到容器正中，与「设备信息」「固件」的右对齐不一致。
   修法：让说明文字强制换行到第二行并整体贴右 —— 第一行只剩 eyebrow + 标题，
   结构与其余两段完全一致，标题自然回到容器右边缘（PHP 侧无需改动）。 */
html[data-fs-page="devices"] .fs-dc-head > .fs-dc-head-sub {
  flex: 0 0 100%;
  margin: var(--space-3) 0 0;
  text-align: right;
}
html[data-fs-page="devices"] .fs-dc-h2 {
  position: relative;
  margin: var(--space-3) 0 0;
  padding-left: 16px;
  font-size: 22px; font-weight: 600; line-height: 1.4; color: var(--text-1);
}
html[data-fs-page="devices"] .fs-dc-h2::before {
  content: ''; position: absolute; left: 0; top: .3em; bottom: .3em;
  width: 3px; border-radius: 2px;
  background: linear-gradient(180deg, var(--fsg-main), rgba(201, 175, 108, .22));
}
html[data-fs-page="devices"] .fs-dc-head-sub { margin: var(--space-3) 0 0; font-size: var(--fs-sm); color: var(--text-3); }

/* ---------- 21.3 设备信息：高级信息行（非表格） ---------- */
html[data-fs-page="devices"] .fs-dc-info { border-top: 1px solid var(--fs-line); }
html[data-fs-page="devices"] .fs-dc-info-row {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: var(--space-6);
  align-items: baseline;
  padding: var(--space-5) 0;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}
html[data-fs-page="devices"] .fs-dc-info-k { font-size: var(--fs-sm); color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-info-row [data-fs-kv] { font-size: var(--fs-base); line-height: 1.8; color: var(--text-1); }
html[data-fs-page="devices"] .fs-dc-info-row [data-fs-kv].is-muted { color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-info-row .fs-kv-v:not([data-fs-kv]) { font-family: var(--font-mono); color: var(--text-1); }

/* ---------- 21.4 能力：金点 + 标签 + 说明（无 emoji） ---------- */
html[data-fs-page="devices"] .fs-dc-caps-hint { margin: 0 0 var(--space-5); font-size: var(--fs-sm); color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-caps:has(.fs-device-conn-v.is-on) .fs-dc-caps-hint { display: none; }
html[data-fs-page="devices"] .fs-dc-caps-empty { margin: 0; font-size: var(--fs-sm); color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-cap-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3) var(--space-8);
  margin: 0; padding: 0; list-style: none;
}
html[data-fs-page="devices"] .fs-dc-cap { position: relative; padding: 0 0 var(--space-4) 20px; }
html[data-fs-page="devices"] .fs-dc-cap::before {
  content: ''; position: absolute; left: 0; top: .62em;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--fsg-main); box-shadow: 0 0 0 3px rgba(201, 175, 108, .1);
}
html[data-fs-page="devices"] .fs-dc-cap-t { display: block; font-size: var(--fs-base); font-weight: 600; color: var(--text-1); }
html[data-fs-page="devices"] .fs-dc-cap-d { display: block; margin-top: 4px; font-size: var(--fs-sm); line-height: 1.7; color: var(--text-3); }

/* ---------- 21.5 固件：横向区域（版本 + 状态 + 入口） ---------- */
html[data-fs-page="devices"] .fs-dc-fw {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-6);
  padding: var(--space-6);
  border: 1px solid var(--fs-gold-line);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(201, 175, 108, .07), rgba(201, 175, 108, .02));
  transition: border-color .2s ease, background .2s ease;
}
html[data-fs-page="devices"] .fs-dc-fw:hover { border-color: var(--fsg-main); background: linear-gradient(180deg, rgba(201, 175, 108, .11), rgba(201, 175, 108, .03)); }
html[data-fs-page="devices"] .fs-dc-fw-block { display: flex; flex-direction: column; gap: 6px; min-width: 180px; }
html[data-fs-page="devices"] .fs-dc-fw-k { font-family: var(--font-mono); font-size: var(--fs-xs); letter-spacing: .16em; color: var(--fsg-dim); }
html[data-fs-page="devices"] .fs-dc-fw [data-fs-kv="fwver"] { font-family: var(--font-mono); font-size: 22px; font-weight: 600; color: var(--text-1); }
html[data-fs-page="devices"] .fs-dc-fw [data-fs-kv="fwver"].is-muted { font-size: var(--fs-lg); font-weight: 500; color: var(--text-3); }
html[data-fs-page="devices"] .fs-dc-fw .fs-fw-upd { flex: 1 1 260px; margin: 0; }
html[data-fs-page="devices"] .fs-dc-fw-actions { margin-left: auto; }

/* ---------- 21.6 响应式 ---------- */
@media (max-width: 1100px) {
  html[data-fs-page="devices"] .fs-dc-dev { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  html[data-fs-page="devices"] .fs-dc-dev-visual { max-width: 380px; }
  html[data-fs-page="devices"] .fs-dc-cap-list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  html[data-fs-page="devices"] .fs-dc-h1 { font-size: 26px; }
  html[data-fs-page="devices"] .fs-dc-dev { padding: var(--space-5); }
  html[data-fs-page="devices"] .fs-dc-dev [data-fs-kv="model"] { font-size: 21px; }
  html[data-fs-page="devices"] .fs-dc-dev-actions .btn { width: 100%; justify-content: center; }
  html[data-fs-page="devices"] .fs-dc-info-row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  html[data-fs-page="devices"] .fs-dc-fw { flex-direction: column; align-items: flex-start; }
  html[data-fs-page="devices"] .fs-dc-fw-actions { margin-left: 0; width: 100%; }
  html[data-fs-page="devices"] .fs-dc-fw-actions .btn { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════════════════════
   22. 支持中心 v3 重排（/studio/support，2026-10-08）
   ──────────────────────────────────────────────────────────────────────────
   结构：① 标题区 → ② 当前设备（动态）→ ③ 核心支持 4 卡 → ④ 常见问题 → ⑤ 仍然需要帮助
   ⚠ 全部规则以 html[data-fs-page="support"] 为前缀 —— 不影响其它页面。
   ⚠ kv 值元素的 class 会被 studio.js 重写 ⇒ 用父级 / [data-fs-kv] 属性选择器定位。
   ⚠ 「连接设备 / 设备信息 / 固件升级」三个按钮按连接状态切换：未连接 → 只留「连接设备」
     （用 :has(.fs-kv-v.is-muted) 判断，依据 studio.js 写入的 is-muted）。
   ══════════════════════════════════════════════════════════════════════════ */

/* ---------- 22.1 当前设备卡 ---------- */
html[data-fs-page="support"] .fs-sc-devcard {
  padding: var(--space-6);
  border: 1px solid var(--fs-line);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, .012));
  box-shadow: 0 18px 40px rgba(0, 0, 0, .32);
}
html[data-fs-page="support"] .fs-sc-devcard-head { margin-bottom: var(--space-5); }
html[data-fs-page="support"] .fs-sc-devcard-body { display: block; }
html[data-fs-page="support"] .fs-sc-devcard-top { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-4); }
html[data-fs-page="support"] .fs-sc-devcard .fs-conn-state { font-size: var(--fs-sm); }
html[data-fs-page="support"] .fs-sc-devcard-name { min-width: 0; }
html[data-fs-page="support"] .fs-sc-devcard-name .fs-kv-v {
  font-size: 24px; font-weight: 700; line-height: 1.3; color: var(--text-1);
}
html[data-fs-page="support"] .fs-sc-devcard-name .fs-kv-v.is-muted { font-size: var(--fs-lg); font-weight: 500; color: var(--text-3); }

html[data-fs-page="support"] .fs-sc-devcard-kv {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4) var(--space-8);
  margin: var(--space-5) 0 0;
  padding: var(--space-5) 0 0;
  border-top: 1px solid rgba(255, 255, 255, .07);
}
html[data-fs-page="support"] .fs-sc-devcard-kvitem dt { font-size: var(--fs-xs); letter-spacing: .1em; color: var(--text-3); }
html[data-fs-page="support"] .fs-sc-devcard-kvitem dd { margin: 6px 0 0; }
html[data-fs-page="support"] .fs-sc-devcard-kvitem .fs-kv-v { font-size: var(--fs-base); line-height: 1.75; color: var(--text-1); }
html[data-fs-page="support"] .fs-sc-devcard-kvitem .fs-kv-v.is-muted { color: var(--text-3); }

html[data-fs-page="support"] .fs-sc-devcard .fs-sc-status-hint { margin: var(--space-4) 0 0; font-size: var(--fs-sm); line-height: 1.75; color: var(--text-3); }
html[data-fs-page="support"] .fs-sc-devcard .fs-sc-status-note { margin: var(--space-3) 0 0; font-size: var(--fs-sm); line-height: 1.75; color: var(--text-3); }
html[data-fs-page="support"] .fs-sc-devcard-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }

/* 未连接（kv 为 is-muted）→ 隐藏「设备信息 / 固件升级」，只留「连接设备」 */
html[data-fs-page="support"] .fs-sc-devcard-body:has(.fs-kv-v.is-muted) .fs-sc-devonly { display: none; }

/* ---------- 22.2 核心支持卡：底部按钮文案（沿用既有卡片结构） ---------- */
html[data-fs-page="support"] .fs-sc-qcard-tag { color: var(--fsg-main); }
html[data-fs-page="support"] .fs-sc-qcard:hover .fs-sc-qcard-arrow { transform: translateX(3px); }

/* ---------- 22.3 常见问题：追问入口保持简洁（沿用既有 details 折叠） ---------- */
html[data-fs-page="support"] .fs-sc-faq-more { margin: var(--space-6) 0 0; text-align: center; }

/* ---------- 22.4 仍然需要帮助 ---------- */
html[data-fs-page="support"] .fs-sc-help {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-6);
  padding: var(--space-6) var(--space-7, var(--space-6));
  border: 1px solid var(--fs-gold-line);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, rgba(201, 175, 108, .07), rgba(201, 175, 108, .02));
  transition: border-color .2s ease;
}
html[data-fs-page="support"] .fs-sc-help:hover { border-color: var(--fsg-main); }
html[data-fs-page="support"] .fs-sc-help-copy { min-width: 0; }
html[data-fs-page="support"] .fs-sc-help-t { margin: var(--space-3) 0 0; font-size: 22px; font-weight: 600; color: var(--text-1); }
html[data-fs-page="support"] .fs-sc-help-d { margin: var(--space-3) 0 0; font-size: var(--fs-base); color: var(--text-2); }
html[data-fs-page="support"] .fs-sc-help-env { margin: var(--space-3) 0 0; font-family: var(--font-mono); font-size: var(--fs-xs); line-height: 1.8; color: var(--text-3); }
html[data-fs-page="support"] .fs-sc-help-actions { flex: none; }

/* ---------- 22.5 响应式 ---------- */
@media (max-width: 900px) {
  html[data-fs-page="support"] .fs-sc-devcard-kv { grid-template-columns: minmax(0, 1fr); }
  html[data-fs-page="support"] .fs-sc-help { flex-direction: column; align-items: flex-start; }
  html[data-fs-page="support"] .fs-sc-help-actions { width: 100%; }
  html[data-fs-page="support"] .fs-sc-help-actions .btn { width: 100%; justify-content: center; }
}
@media (max-width: 640px) {
  html[data-fs-page="support"] .fs-sc-devcard { padding: var(--space-5); }
  html[data-fs-page="support"] .fs-sc-devcard-name .fs-kv-v { font-size: 20px; }
}

/* ---------- 22.6 Android App 下载模块（2026-10-08 新增，纯静态展示） ---------- */
html[data-fs-page="support"] .fs-sc-app {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-8);
  padding: var(--space-6) var(--space-7, var(--space-6));
  border: 1px solid var(--fs-gold-line);
  border-radius: var(--r-lg);
  background:
    radial-gradient(420px 200px at 88% 50%, rgba(201, 175, 108, .07), transparent 72%),
    linear-gradient(180deg, rgba(255, 255, 255, .025), rgba(255, 255, 255, .008));
  transition: border-color .2s ease;
}
html[data-fs-page="support"] .fs-sc-app:hover { border-color: var(--fsg-main); }
html[data-fs-page="support"] .fs-sc-app-copy { min-width: 0; }
html[data-fs-page="support"] .fs-sc-app-copy .fs-sechen { color: var(--fsg-main); }
html[data-fs-page="support"] .fs-sc-app-label { margin: var(--space-4) 0 0; font-size: var(--fs-sm); letter-spacing: .06em; color: var(--fsg-main); }
html[data-fs-page="support"] .fs-sc-app-t { margin: var(--space-2) 0 0; font-size: 26px; font-weight: 700; line-height: 1.3; color: var(--text-1); }
html[data-fs-page="support"] .fs-sc-app-d { margin: var(--space-4) 0 0; max-width: 34em; font-size: var(--fs-base); line-height: 1.85; color: var(--text-2); }
html[data-fs-page="support"] .fs-sc-app-actions { margin-top: var(--space-5); }

/* 二维码：黑模块 + 透明底 ⇒ 垫白底才能扫；矢量 SVG 不变形 */
html[data-fs-page="support"] .fs-sc-app-qr {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
  margin: 0;
}
html[data-fs-page="support"] .fs-sc-app-qr img {
  display: block;
  width: 176px;
  height: 176px;
  padding: 10px;
  border-radius: 10px;
  background: #FFFFFF;               /* ★ 白底：保证在深色页面上可扫描 */
  box-shadow: 0 8px 22px rgba(0, 0, 0, .35);
}
html[data-fs-page="support"] .fs-sc-app-qrn { font-size: var(--fs-xs); letter-spacing: .02em; color: var(--text-3); }

@media (max-width: 900px) {
  html[data-fs-page="support"] .fs-sc-app { flex-direction: column; align-items: flex-start; gap: var(--space-6); }
  html[data-fs-page="support"] .fs-sc-app-qr { align-self: flex-start; }
}
@media (max-width: 640px) {
  html[data-fs-page="support"] .fs-sc-app { padding: var(--space-5); }
  html[data-fs-page="support"] .fs-sc-app-t { font-size: 22px; }
  html[data-fs-page="support"] .fs-sc-app-actions .btn { width: 100%; justify-content: center; }
  html[data-fs-page="support"] .fs-sc-app-qr img { width: 150px; height: 150px; }
}

/* ---------- 21.7 固件区标注：固件升级仅支持电脑端浏览器（2026-10-08 用户决定 A） ---------- */
html[data-fs-page="devices"] .fs-dc-fw-note {
  display: block;
  margin-top: 6px;
  font-style: normal;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: .02em;
  color: var(--text-3);
}

/* ==========================================================
   首页卡片与金色统一 2026-10-21（回滚：backups/studio-home-cards-20261021/）
   ----------------------------------------------------------
   · 卡片边框 0.42 → 0.22：金只做视线导航，不抢区块标题
   · 设备卡 / 环境格 圆角 10 → 8：与 .fs-card / .fs-home-tip 对齐
   · 旧金 #B89459 残留 → 统一为品牌三级金 #C9AF6C（同透明度，只换色相）
   ========================================================== */
html[data-fs-page="home"] .fs-card{border-color:rgba(201,175,108,.22)!important}
html[data-fs-page="home"] .fs-home-dev{
  border-color:rgba(201,175,108,.17)!important;
  border-radius:8px!important;
}
html[data-fs-page="home"] .fs-home-env{
  border-color:rgba(201,175,108,.17)!important;
  border-radius:8px!important;
}
html[data-fs-page="home"] .fs-home-tip{
  border-color:rgba(201,175,108,.26)!important;
  background-color:rgba(201,175,108,.05)!important;
}
html[data-fs-page="home"] .fs-home-flow-item{border-color:rgba(201,175,108,.15)!important}
html[data-fs-page="home"] .fs-powered{border-color:rgba(201,175,108,.13)!important}

/* ==========================================================
   首页比例与明度底盘 2026-10-21（回滚：backups/studio-home-scale-20261021/）
   ----------------------------------------------------------
   实测问题：内容宽 94%（几乎无留白）、Hero 仅 55% 屏、
             卡片底色 L=0.006 与背景 0.002 差 0.004（只能靠亮边框浮起）
   对策：收窄容器 → 给卡片底色 → 边框才能降到 .13 → Hero 撑到 78vh
   ========================================================== */
html[data-fs-page="home"]{ --container: 1200px; }

/* ① Hero 撑满 78vh，首屏不再漏出下一节 */
html[data-fs-page="home"] .fs-home-hero{
  min-height:78vh;
  display:flex;
  align-items:center;
  padding-top:clamp(48px, 6vh, 84px);
  padding-bottom:clamp(40px, 5vh, 68px);
}
html[data-fs-page="home"] .fs-home-hero > .container{ width:100%; }
/* 标题断行平衡：避免"平台"这类孤字掉到第二行 */
html[data-fs-page="home"] .fs-home-h1,
html[data-fs-page="home"] .fs-home-h2{ text-wrap:balance; }

/* ② 卡片给底色：明度从 0.006 提到 0.018，层次自己浮起来 */
html[data-fs-page="home"] main .container{max-width:1200px!important}
html[data-fs-page="home"] .fs-card{
  background-image:linear-gradient(180deg, #1B1B1F 0%, #15151A 100%)!important;
  background-color:rgb(21, 21, 26)!important;
  border-color:rgba(201,175,108,.13)!important;
}
html[data-fs-page="home"] .fs-card.is-primary{border-color:rgba(201,175,108,.30)!important}
html[data-fs-page="home"] .fs-home-dev,
html[data-fs-page="home"] .fs-home-env{
  background:rgb(16, 16, 19);
}
/* ③ 有了底色，容器边框继续退 */
html[data-fs-page="home"] .fs-home-dev{border-color:rgba(201,175,108,.13)!important}
html[data-fs-page="home"] .fs-home-env{border-color:rgba(201,175,108,.12)!important}

/* ==========================================================
   首页重排：节奏与不对称 2026-10-21（回滚：backups/studio-home-relayout-20261021/）
   ----------------------------------------------------------
   问题：区块高度 78/63/47/74/53 全在中段，无主次；
         音频能力 1:1 等分、推荐环境 4 等分 → 两处"平"。
   对策：纵向做轻重交替（重-轻-轻-重-轻），横向做不对称。
   ========================================================== */

/* ① 纵向节奏：轻/重交替，眼睛有落点 */
html[data-fs-page="home"] main > section:nth-of-type(2){ padding-bottom: clamp(36px, 4.5vh, 60px); }
html[data-fs-page="home"] main > section:nth-of-type(3){ padding-bottom: clamp(28px, 3.5vh, 44px); }
html[data-fs-page="home"] main > section:nth-of-type(4){ padding-bottom: clamp(64px, 8vh, 100px); }
html[data-fs-page="home"] main > section:nth-of-type(5){ padding-bottom: clamp(36px, 4.5vh, 60px); }

/* ② 音频能力：左列表为主，右设备卡为辅（1.32 : 1） */
html[data-fs-page="home"] .fs-home-cap-grid{
  grid-template-columns: 1.32fr 1fr;
  align-items: stretch;
}
/* 右侧设备卡撑满列高，消除下方空白 */
html[data-fs-page="home"] .fs-home-cap-dev{
  display:flex;flex-direction:column;
}
html[data-fs-page="home"] .fs-home-cap-dev .fs-home-cap-note{margin-top:auto}

/* ③ 推荐环境：三格等宽 + 一格更宽（放"移动端"这条最长说明） */
html[data-fs-page="home"] .fs-home-env{
  grid-template-columns: 1fr 1fr 1fr 1.45fr;
}

/* ④ 核心功能：主卡更突出（1.45 → 1.6） */
html[data-fs-page="home"] .fs-features{ grid-template-columns: 1.6fr 1fr 1fr; }

/* ⑤ 快速开始：五步连成一条线，不再各自为政 */
html[data-fs-page="home"] .fs-home-flow{ position: relative; }
html[data-fs-page="home"] .fs-home-flow::before{
  content: ""; position: absolute; left: 0; right: 0; top: 14px; height: 1px;
  background: linear-gradient(90deg, rgba(201,175,108,.05), rgba(201,175,108,.22) 12%, rgba(201,175,108,.22) 88%, rgba(201,175,108,.05));
  pointer-events: none;
}
html[data-fs-page="home"] .fs-home-flow-item{ position: relative; padding-top: 0; }

/* ⑥ 窄屏回退：恢复等分，避免挤压 */
@media (max-width: 1100px){
  html[data-fs-page="home"] .fs-features{ grid-template-columns: 1fr 1fr; }
  html[data-fs-page="home"] .fs-home-env{ grid-template-columns: 1fr 1fr; }
  html[data-fs-page="home"] .fs-home-cap-grid{ grid-template-columns: 1fr; }
}

/* === 对比度修正 2026-10-21（自查发现 8 处 <4.5:1）=== */
html[data-fs-page="home"] .fs-home-flow-item .fs-home-flow-no,
html[data-fs-page="home"] .fs-home-flow-no{ color:rgba(201,175,108,.78)!important; }
/* 曲线说明文字（今日新增组件） */
html[data-fs-page="home"] .fs-eq-cap{ color:rgba(201,175,108,.72)!important; }

/* ==========================================================
   核心功能：真实界面截图 2026-10-21（回滚：backups/studio-home-shot-20261021/）
   ----------------------------------------------------------
   把三张抽象卡改为「真机界面截图 + 三条能力」——截图来自连真机后的实际界面，
   数据为设备固件读回的参数（低频 0 / 人声 +2.0dB / 高频 0）。
   ========================================================== */
html[data-fs-page="home"] .fs-features{
  grid-template-columns: 1.22fr 1fr;
  grid-template-rows: repeat(3, auto);
  align-items: start;
  gap: 16px 24px;
}
html[data-fs-page="home"] .fs-shot{
  grid-column: 1; grid-row: 1 / span 3;
  margin: 0; display: flex; flex-direction: column;
  border: 1px solid rgba(201,175,108,.16);
  border-radius: 8px; overflow: hidden;
  background: #0B0B0D;
  box-shadow: 0 18px 44px rgba(0,0,0,.42);
}
html[data-fs-page="home"] .fs-shot img{
  display: block; width: 100%; height: auto;
  border-bottom: 1px solid rgba(255,255,255,.05);
  filter: brightness(1.1) contrast(1.03) saturate(1.05);
}
html[data-fs-page="home"] .fs-shot figcaption{
  display: flex; flex-direction: column; gap: 5px;
  padding: 13px 16px 15px;
}
html[data-fs-page="home"] .fs-shot-t{ font-size: 13px; color: #FAF6EC; letter-spacing: .01em; }
html[data-fs-page="home"] .fs-shot-s{
  font-family: var(--font-mono, monospace); font-size: 10.5px;
  letter-spacing: .1em; color: rgba(201,175,108,.72);
}
/* 右栏三条能力：紧凑化 */
html[data-fs-page="home"] .fs-features > article:nth-of-type(1){ grid-column: 2; grid-row: 1; }
html[data-fs-page="home"] .fs-features > article:nth-of-type(2){ grid-column: 2; grid-row: 2; }
html[data-fs-page="home"] .fs-features > article:nth-of-type(3){ grid-column: 2; grid-row: 3; }
html[data-fs-page="home"] .fs-features > .fs-card{ padding: 16px 18px; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-title{ font-size: 16px; margin-top: 6px; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-desc{
  margin-top: 6px; font-size: 12.5px; line-height: 1.7;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-tags{ margin-top: 8px; }

@media (max-width: 1100px){
  html[data-fs-page="home"] .fs-features{ grid-template-columns: 1fr; grid-template-rows: auto; }
  html[data-fs-page="home"] .fs-shot{ grid-column: 1; grid-row: 1; }
  html[data-fs-page="home"] .fs-features > article:nth-of-type(1){ grid-column: 1; grid-row: 2; }
  html[data-fs-page="home"] .fs-features > article:nth-of-type(2){ grid-column: 1; grid-row: 3; }
  html[data-fs-page="home"] .fs-features > article:nth-of-type(3){ grid-column: 1; grid-row: 4; }
}

/* === 核心功能：对齐与紧凑 2026-10-21 === */
html[data-fs-page="home"] .fs-features{
  grid-template-columns: 1.25fr 1fr;
  grid-template-rows: repeat(3, minmax(0, 1fr));   /* 三卡等分，右列总高 = 图高 */
  gap: 8px 20px;
  align-items: stretch;
}
html[data-fs-page="home"] .fs-shot{
  grid-column: 1; grid-row: 1 / span 3;
  height: 100%; min-height: 0;
  justify-content: flex-start;
}
html[data-fs-page="home"] .fs-shot img{
  flex: 0 0 auto; width: 100%; height: auto;
}
html[data-fs-page="home"] .fs-shot figcaption{ flex: 0 0 auto; padding: 10px 14px 12px; }

/* 三卡：等高、内距收紧、链接贴底 */
html[data-fs-page="home"] .fs-features > .fs-card{
  display: flex; flex-direction: column;
  padding: 10px 14px !important;
  min-height: 0; overflow: hidden;
}
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-no{ font-size: 10.5px; letter-spacing: .18em; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-title{ font-size: 14.5px; margin-top: 1px; line-height: 1.28; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-sub{ display: none; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-desc{
  font-size: 12px; line-height: 1.5; margin-top: 5px;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-tags{
  margin: auto 0 0 !important; padding-top: 6px; gap: 5px;
}
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-tag{ font-size: 10.5px; padding: 2px 7px; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-foot{ margin: 5px 0 0; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-more{ font-size: 11.5px; }

/* === 窄屏最终回退 2026-10-21（媒体查询不增权重，必须放文件末尾）=== */
@media (max-width: 1100px){
  html[data-fs-page="home"] .fs-features{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 10px;
  }
  html[data-fs-page="home"] .fs-shot{ grid-column: 1; grid-row: 1; height: auto; }
  html[data-fs-page="home"] .fs-features > article:nth-of-type(1){ grid-column: 1; grid-row: 2; }
  html[data-fs-page="home"] .fs-features > article:nth-of-type(2){ grid-column: 1; grid-row: 3; }
  html[data-fs-page="home"] .fs-features > article:nth-of-type(3){ grid-column: 1; grid-row: 4; }
  html[data-fs-page="home"] .fs-features > .fs-card{ padding: 14px 16px !important; }
  html[data-fs-page="home"] .fs-features > .fs-card .fs-card-sub{ display: block; }
}

/* === 首屏数据条 2026-10-21（数值取自 PROFILES / peq-constants / fs=48k） === */
html[data-fs-page="home"] .fs-hero-facts{
  display: flex; align-items: center; gap: 0;
  margin: clamp(28px, 4vh, 44px) 0 0; padding: 0;
  list-style: none;
  border-top: 1px solid rgba(201,175,108,.14);
}
html[data-fs-page="home"] .fs-hero-facts li{
  flex: 0 0 auto;
  display: flex; align-items: baseline; gap: 7px;
  padding: 14px 26px 0 0; margin-right: 26px;
  border-right: 1px solid rgba(255,255,255,.06);
}
html[data-fs-page="home"] .fs-hero-facts li:last-child{ border-right: 0; margin-right: 0; padding-right: 0; }
html[data-fs-page="home"] .fs-hero-facts b{
  font-family: var(--font-mono, monospace);
  font-size: 20px; font-weight: 500; line-height: 1;
  color: rgba(201,175,108,.92);
  letter-spacing: -.01em;
}
html[data-fs-page="home"] .fs-hero-facts span{
  font-size: 11.5px; line-height: 1; color: rgba(232,227,216,.62);
  letter-spacing: .04em;
}
/* 首屏略降高度，减少下方空白 */
html[data-fs-page="home"] .fs-home-hero{ min-height: 72vh; }

@media (max-width: 720px){
  html[data-fs-page="home"] .fs-hero-facts{ flex-wrap: wrap; gap: 0 18px; }
  html[data-fs-page="home"] .fs-hero-facts li{ padding-right: 18px; margin-right: 18px; }
}

/* === 纵向间距收紧 2026-10-21（填充率实测：快速开始 64% / 推荐环境 70%） === */
html[data-fs-page="home"] main > section:nth-of-type(2){ padding-bottom: clamp(24px, 3vh, 40px); }
html[data-fs-page="home"] main > section:nth-of-type(3){ padding-bottom: clamp(20px, 2.5vh, 32px); }
html[data-fs-page="home"] main > section:nth-of-type(4){ padding-bottom: clamp(40px, 5vh, 64px); }
html[data-fs-page="home"] main > section:nth-of-type(5){ padding-bottom: clamp(24px, 3vh, 40px); }
html[data-fs-page="home"] main > section:nth-of-type(2){ padding-top: clamp(24px, 3vh, 44px); }
html[data-fs-page="home"] main > section:nth-of-type(3){ padding-top: clamp(20px, 2.5vh, 36px); }
html[data-fs-page="home"] main > section:nth-of-type(4){ padding-top: clamp(40px, 5vh, 68px); }
html[data-fs-page="home"] main > section:nth-of-type(5){ padding-top: clamp(24px, 3vh, 44px); }
/* 区块标题与内容更靠拢 */
html[data-fs-page="home"] .fs-home-head{ margin-bottom: clamp(14px, 1.8vh, 24px); }

/* === 纵向间距最终覆盖 2026-10-21（.section 类名提高优先级，压过 §十六 的 home 规则） === */
html[data-fs-page="home"] main > .section:nth-of-type(2){ padding: clamp(24px,3vh,44px) 0 clamp(24px,3vh,40px) !important; }
html[data-fs-page="home"] main > .section:nth-of-type(3){ padding: clamp(20px,2.5vh,36px) 0 clamp(20px,2.5vh,32px) !important; }
html[data-fs-page="home"] main > .section:nth-of-type(4){ padding: clamp(40px,5vh,68px) 0 clamp(40px,5vh,64px) !important; }
html[data-fs-page="home"] main > .section:nth-of-type(5){ padding: clamp(24px,3vh,44px) 0 clamp(24px,3vh,40px) !important; }

/* === 首屏曲线图 2026-10-21（替换数据条；真机界面局部） === */
html[data-fs-page="home"] .fs-dev-curve{
  margin: 14px -2px -2px; padding: 0;
  border-top: 1px solid rgba(201,175,108,.12);
  padding-top: 12px;
}
html[data-fs-page="home"] .fs-dev-curve img{
  display: block; width: 100%; height: auto;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,.06);
  filter: brightness(1.12) contrast(1.02);
}

/* === 首屏撑满与高度 2026-10-21 === */
/* 右列设备卡撑满 Hero 高度，曲线图贴底 */
html[data-fs-page="home"] .fs-home-hero-grid{ align-items: stretch; }
html[data-fs-page="home"] .fs-home-dev{ display: flex; flex-direction: column; }
html[data-fs-page="home"] .fs-dev-curve{ margin-top: auto; }
/* 首屏高度收到 66vh，减少上下空白 */
html[data-fs-page="home"] .fs-home-hero{ min-height: 66vh; }

/* === 核心功能：右列改为明细行式（更详细，不带卡片边框） 2026-10-21 === */
html[data-fs-page="home"] .fs-features > .fs-card{
  background: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 14px 0 12px !important;
  transition: border-color .2s ease;
}
html[data-fs-page="home"] .fs-features > .fs-card:first-of-type{ border-top: 0 !important; padding-top: 2px !important; }
html[data-fs-page="home"] .fs-features > .fs-card:hover{
  border-top-color: rgba(201,175,108,.3) !important;
  transform: none !important;
  background: none !important;
}

/* 编号 + 标题同一行，链接右对齐 */
html[data-fs-page="home"] .fs-features > .fs-card{
  display: grid !important;
  grid-template-columns: auto 1fr auto;
  grid-template-areas:
    "no   title  link"
    "desc desc   desc"
    "tags tags   tags";
  column-gap: 10px;
  align-items: baseline;
  align-content: center;
}
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-no{ grid-area: no; font-size: 10px; line-height: 1.6; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-title{ grid-area: title; font-size: 15px; margin: 0 !important; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-sub{ display: none; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-desc{
  grid-area: desc; margin: 5px 0 0 !important; font-size: 12.5px; line-height: 1.65;
  color: rgba(232,227,216,.62);
  display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important;
}
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-tags{
  grid-area: tags; margin: 8px 0 0 !important; padding: 0 !important; gap: 6px;
}
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-foot{ grid-area: link; margin: 0 !important; padding: 0 !important; }
html[data-fs-page="home"] .fs-features > .fs-card .fs-card-more{ font-size: 11.5px; color: rgba(201,175,108,.8); }