@charset "UTF-8";
/* ============================================================
   ExcelMailer 站点样式表
   ------------------------------------------------------------
   风格：绿色科技 · 专业克制 · 全响应式 · 支持亮/暗主题
   规范：无外部依赖，不使用 CSS 预处理器
   目录：
     01 变量与重置      02 基础排版       03 布局容器
     04 按钮            05 页头导航       06 首屏
     07 卡片与栅格      08 下载区         09 步骤条
     10 常见问题        11 提示框         12 表格
     13 表单            14 页脚           15 杂项
     16 响应式          17 亮暗主题
   ------------------------------------------------------------
   主题机制：
     所有颜色一律走 :root 变量；暗色只在「17 亮暗主题」里覆盖
     变量值，组件样式无需重复书写。加新组件时请使用语义变量
     （--surface / --surface-2 / --sky-* 等），不要再硬编码颜色。
   ============================================================ */

/* ---------- 01 变量与重置 ---------- */
:root {
  color-scheme: light;

  /* 品牌绿：亮暗两套主题共用，保持品牌识别一致 */
  --brand:        #12A150;
  --brand-600:    #0E8C44;
  --brand-700:    #0A6E35;
  --brand-100:    #DCF3E6;
  --brand-050:    #F0FAF4;
  /* 品牌绿之上的文字/图标色（深色主题下翻转为深色以保证对比度） */
  --on-brand:     #FFFFFF;

  --ink:          #0D1B13;
  --ink-2:        #3A4A42;
  --muted:        #6B7C74;
  --line:         #E4EBE7;
  --line-strong:  #D6E4DB;
  --bg:           #FFFFFF;
  --soft:         #F6F9F7;

  /* 语义化表面：卡片/输入框/弹层统一用它，暗色下一处即可翻转 */
  --surface:      #FFFFFF;
  --surface-2:    #F6F9F7;
  --header-bg:    rgba(255, 255, 255, .86);

  /* 首屏与内页横幅的底色与光晕 */
  --hero-top:     #FBFDFC;
  --hero-bottom:  #FFFFFF;
  --hero-glow-1:  rgba(18, 161, 80, .13);
  --hero-glow-2:  rgba(18, 161, 80, .09);

  /* 警示（黄） */
  --warn-bg:      #FFF8EC;
  --warn-line:    #F2DFB8;
  --warn-ink:     #8A6116;
  --warn-ico:     #C8880F;
  --warn-card-bg: #FFF9EC;
  --warn-card-line: #F3DFAE;

  /* 错误（红） */
  --err-ink:      #A32A2A;
  --err-bg:       #FDF1F1;
  --err-line:     #F3D4D4;

  /* 页脚：亮色主题下是深色区块，暗色主题下改为浅于页面的深灰以保持层次 */
  --foot-bg:      #0D1B13;
  --foot-ink:     #A7B8AF;
  --foot-link:    #C7D6CD;
  --foot-strong:  #FFFFFF;
  --foot-muted:   #7E9188;
  --foot-accent:  #34C77B;
  --foot-divide:  rgba(255, 255, 255, .09);
  --foot-chip:    rgba(255, 255, 255, .07);
  --foot-chip-h:  rgba(255, 255, 255, .14);
  --foot-chip-bd: rgba(255, 255, 255, .12);

  /* 视频容器底衬（与页脚同色系，暗色下压暗） */
  --video-bg:     #0D1B13;

  --r-sm: 8px;
  --r:    14px;
  --r-lg: 20px;

  --sh-sm: 0 1px 2px rgba(13,27,19,.06);
  --sh:    0 8px 26px -10px rgba(13,27,19,.16);
  --sh-lg: 0 24px 60px -24px rgba(13,27,19,.28);

  --wrap:  1140px;
  --header-h: 68px;

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei",
          "PingFang SC", "Hiragino Sans GB", "Source Han Sans SC", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 16px);
}

body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.75;
  color: var(--ink-2);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

body.nav-locked { overflow: hidden; }

img, svg, video { max-width: 100%; height: auto; }
img { border: 0; }

a { color: var(--brand-600); text-decoration: none; transition: color .18s ease; }
a:hover { color: var(--brand-700); }

ul, ol { margin: 0; padding: 0; }

/* ---------- 02 基础排版 ---------- */
h1, h2, h3, h4 {
  margin: 0 0 .6em;
  color: var(--ink);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.01em;
}
h1 { font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3rem); }
h2 { font-size: clamp(1.45rem, 1.15rem + 1.2vw, 2.05rem); }
h3 { font-size: 1.15rem; }
h4 { font-size: 1rem; }

p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

strong { color: var(--ink); font-weight: 700; }
small { font-size: .86rem; }

code, kbd {
  padding: .12em .45em;
  font-size: .9em;
  font-family: Consolas, Monaco, "Courier New", monospace;
  color: var(--brand-700);
  background: var(--brand-050);
  border: 1px solid var(--brand-100);
  border-radius: 5px;
}

.skip-link {
  position: absolute; left: -9999px; top: 0;
  padding: 10px 18px; background: var(--brand); color: var(--on-brand);
  border-radius: 0 0 var(--r-sm) 0; z-index: 999;
}
.skip-link:focus { left: 0; }

:focus-visible { outline: 3px solid rgba(18,161,80,.45); outline-offset: 2px; border-radius: 4px; }

/* ---------- 03 布局容器 ---------- */
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: 20px; }

.section { padding: 76px 0; }
.section--soft { background: var(--soft); }
.section--tight { padding: 52px 0; }

.section-head { max-width: 720px; margin: 0 auto 44px; text-align: center; }
.section-head p { color: var(--muted); font-size: 1.03rem; margin: 0; }
.section-head--left { margin-inline: 0; text-align: left; }

.eyebrow {
  display: inline-flex; align-items: center; gap: 7px;
  margin-bottom: 14px; padding: 5px 13px;
  font-size: .8rem; font-weight: 600; letter-spacing: .04em;
  color: var(--brand-700); background: var(--brand-050);
  border: 1px solid var(--brand-100); border-radius: 999px;
}

.grid { display: grid; gap: 22px; }
.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }

/* ---------- 04 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 13px 26px;
  font-family: inherit; font-size: .96rem; font-weight: 600; line-height: 1;
  border: 1px solid transparent; border-radius: 999px;
  cursor: pointer; white-space: nowrap;
  transition: transform .16s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
.btn:active { transform: translateY(1px); }

.btn--primary { color: var(--on-brand); background: var(--brand); box-shadow: 0 8px 20px -8px rgba(18,161,80,.6); }
.btn--primary:hover { color: var(--on-brand); background: var(--brand-600); box-shadow: 0 12px 26px -8px rgba(18,161,80,.7); }

.btn--ghost { color: var(--ink); background: var(--surface); border-color: var(--line); }
.btn--ghost:hover { color: var(--brand-700); border-color: var(--brand); background: var(--brand-050); }

.btn--dark { color: var(--on-brand); background: var(--ink); }
.btn--dark:hover { color: var(--on-brand); background: var(--brand-700); }

.btn--sm { padding: 9px 18px; font-size: .88rem; }
.btn--lg { padding: 16px 34px; font-size: 1.03rem; }
.btn--block { width: 100%; }

.btn svg { flex: none; }

/* ---------- 05 页头导航 ---------- */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: var(--header-bg);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid transparent;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.site-header.is-scrolled { border-bottom-color: var(--line); box-shadow: var(--sh-sm); }

.site-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  min-height: var(--header-h); gap: 20px;
}

.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--brand); }
.brand__mark { display: inline-flex; flex: none; }
.brand__text { display: flex; flex-direction: column; line-height: 1.25; }
.brand__text strong { font-size: 1.08rem; color: var(--ink); letter-spacing: -.01em; }
.brand__text em { font-style: normal; font-size: .74rem; color: var(--muted); }

.nav-panel { display: flex; align-items: center; gap: 26px; }
.nav { display: flex; align-items: center; gap: 4px; list-style: none; }
.nav a {
  position: relative; display: block; padding: 8px 13px;
  font-size: .94rem; font-weight: 500; color: var(--ink-2); border-radius: 8px;
}
.nav a:hover { color: var(--brand-700); background: var(--brand-050); }
.nav a.is-active { color: var(--brand-700); font-weight: 700; }
.nav a.is-active::after {
  content: ""; position: absolute; left: 13px; right: 13px; bottom: 1px;
  height: 2px; background: var(--brand); border-radius: 2px;
}

.nav-toggle {
  display: none; align-items: center; justify-content: center;
  width: 42px; height: 42px; padding: 0;
  color: var(--ink); background: var(--surface);
  border: 1px solid var(--line); border-radius: 10px; cursor: pointer;
}
.nav-toggle__icon--close { display: none; }
.nav-toggle.is-open .nav-toggle__icon { display: none; }
.nav-toggle.is-open .nav-toggle__icon--close { display: inline-flex; }

/* ---------- 06 首屏 ---------- */
.hero {
  position: relative; overflow: hidden;
  padding: 84px 0 88px;
  background:
    radial-gradient(900px 420px at 82% -8%, var(--hero-glow-1), transparent 68%),
    radial-gradient(700px 380px at 8% 108%, var(--hero-glow-2), transparent 70%),
    linear-gradient(180deg, var(--hero-top) 0%, var(--hero-bottom) 100%);
}
.hero::after {
  content: ""; position: absolute; inset: auto 0 0 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
}
.hero__grid {
  display: grid; grid-template-columns: 1.08fr .92fr;
  gap: 56px; align-items: center;
}
.hero h1 { margin-bottom: 20px; }
.hero h1 .hl {
  background: linear-gradient(180deg, transparent 62%, var(--brand-100) 62%);
  padding-inline: 2px;
}
.hero__lead { font-size: 1.1rem; color: var(--ink-2); margin-bottom: 30px; max-width: 34em; }

.hero__actions { display: flex; flex-wrap: wrap; gap: 13px; margin-bottom: 28px; }

.hero__meta {
  display: flex; flex-wrap: wrap; gap: 8px 10px;
  padding-top: 24px; border-top: 1px solid var(--line);
}
.chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; font-size: .82rem; font-weight: 500;
  color: var(--ink-2); background: var(--surface);
  border: 1px solid var(--line); border-radius: 999px;
}
.chip svg { color: var(--brand); flex: none; }

/* 首屏右侧：版本卡 */
.hero__visual { position: relative; }
.version-card {
  position: relative; padding: 26px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg);
}
.version-card__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding-bottom: 18px; margin-bottom: 18px;
  border-bottom: 1px dashed var(--line);
}
.version-card__title { display: flex; align-items: center; gap: 11px; }
.version-card__title strong { display: block; font-size: 1.02rem; }
.version-card__title span { font-size: .8rem; color: var(--muted); }
.version-card__title .ico {
  display: grid; place-items: center; width: 42px; height: 42px;
  color: var(--brand); background: var(--brand-050);
  border-radius: 12px; flex: none;
}
.tag {
  padding: 4px 11px; font-size: .76rem; font-weight: 700;
  color: var(--brand-700); background: var(--brand-050);
  border: 1px solid var(--brand-100); border-radius: 999px; white-space: nowrap;
}
.version-card__list { list-style: none; display: grid; gap: 12px; margin-bottom: 20px; }
.version-card__list li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: .9rem; color: var(--ink-2);
}
.version-card__list svg { color: var(--brand); flex: none; margin-top: 3px; }
.version-card__list b { color: var(--ink); font-weight: 600; }

/* ---------- 06b 产品实景位 ----------
   站点此前完全没有产品截图，是转化上的主要缺口。
   配置驱动：路径填在 config.php 的 'shot_hero'，留空则整个区块不渲染
   （与 trust.* 同一哲学——宁可少说，不出现「待补图」的半成品观感）。
   图片自带 width/height 属性 + 容器 aspect-ratio，加载中不抖动（防 CLS）。 */
.shot {
  position: relative; margin: 0 0 22px;
  border-radius: var(--r-lg); overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--sh);
}
.shot--hero { aspect-ratio: 16 / 10; }
.shot img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- 06c 首屏右侧版本卡微调 ---------- */
/* 原卡片标题为「ExcelMailer / Excel效率插件」，现改为信任表述，
   副标题改为「本地运行，不联网、不上传任何数据」，文案更贴近用户关切。 */
.version-card__title strong { display: block; font-size: 1rem; line-height: 1.45; }

/* ---------- 07 卡片与栅格 ---------- */
.card {
  padding: 26px 24px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); box-shadow: var(--sh-sm);
  transition: transform .2s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover { transform: translateY(-3px); box-shadow: var(--sh); border-color: var(--line-strong); }

.feature__ico {
  display: grid; place-items: center; width: 48px; height: 48px;
  margin-bottom: 16px; color: var(--brand);
  background: var(--brand-050); border: 1px solid var(--brand-100);
  border-radius: 13px;
}
.card h3 { margin-bottom: 8px; }
.card p { margin: 0; font-size: .92rem; color: var(--muted); line-height: 1.7; }

/* 场景卡：改为纵向布局，标题与图标同行，能力标签挂在底部 */
.scene {
  display: flex; gap: 16px; padding: 24px 26px;
  background: var(--surface); border: 1px solid var(--line);
  border-left: 3px solid var(--brand); border-radius: var(--r);
  transition: border-color .2s ease, box-shadow .22s ease;
}
.scene:hover { box-shadow: var(--sh); }
.scene__body { min-width: 0; }
.scene__head { display: flex; align-items: center; gap: 11px; margin-bottom: 9px; }
.scene__ico {
  display: grid; place-items: center; width: 38px; height: 38px; flex: none;
  color: var(--brand); background: var(--brand-050);
  border: 1px solid var(--brand-100); border-radius: 11px;
}
.scene h3 { margin: 0; font-size: 1.05rem; }
.scene p { margin: 0 0 14px; font-size: .93rem; color: var(--muted); }

/* 场景 → 能力的映射标签：让能力「挂在场景上」，
   替代原先把八项能力另列一遍的做法，避免两处内容重复。
   标签是链接，可直接跳到功能页对应条目。 */
.scene__tags { display: flex; flex-wrap: wrap; gap: 7px; }
.tagpill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 11px; font-size: .78rem; font-weight: 500;
  color: var(--brand-700); background: var(--brand-050);
  border: 1px solid var(--brand-100); border-radius: 999px;
  transition: background .18s ease, border-color .18s ease;
}
a.tagpill:hover {
  color: var(--brand-700); background: var(--brand-100);
  border-color: var(--brand); text-decoration: none;
}
a.tagpill::after { content: "→"; opacity: .55; }

/* 列表式特性 */
.ticks { list-style: none; display: grid; gap: 10px; margin: 16px 0 0; }
.ticks li { display: flex; gap: 9px; align-items: flex-start; font-size: .92rem; }
.ticks svg { color: var(--brand); flex: none; margin-top: 4px; }

/* ---------- 08 下载区 ---------- */
.dl-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }

.dl-card {
  position: relative; display: flex; flex-direction: column;
  padding: 28px 26px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); box-shadow: var(--sh-sm);
  transition: border-color .2s ease, box-shadow .22s ease;
}
.dl-card:hover { border-color: var(--brand); box-shadow: var(--sh); }
.dl-card--featured { border-color: var(--brand); background: linear-gradient(180deg, var(--brand-050), var(--surface) 42%); }
.dl-card__badge {
  position: absolute; top: -12px; left: 26px;
  padding: 4px 13px; font-size: .74rem; font-weight: 700; color: var(--on-brand);
  background: var(--brand); border-radius: 999px;
}
.dl-card__head { display: flex; align-items: center; gap: 13px; margin-bottom: 14px; }
.dl-card__head .ico {
  display: grid; place-items: center; width: 46px; height: 46px;
  color: var(--brand); background: var(--brand-050); border-radius: 12px; flex: none;
}
.dl-card__head h3 { margin: 0 0 2px; font-size: 1.06rem; }
.dl-card__head span { font-size: .82rem; color: var(--muted); }
.dl-card p { font-size: .9rem; color: var(--muted); margin-bottom: 20px; }
.dl-card .btn { margin-top: auto; }

/* ---------- 08b 下载区「一主一次」结构 ----------
   原版X64 / X86 并排等权，用户仍要自己做选择。
   现在改为：X64 占主位（唯一主按钮），X86 收进可展开的次要行。
   把「不确定位数」这个前置疑问放在主位旁边，
   比让用户对着两张同权卡片猜要有效得多。 */
.dl-hero {
  display: grid; grid-template-columns: 1.25fr .75fr; gap: 30px;
  align-items: center; padding: 34px 36px;
  background: linear-gradient(180deg, var(--brand-050), var(--surface) 55%);
  border: 1px solid var(--brand); border-radius: var(--r-lg);
  box-shadow: var(--sh);
}
.dl-hero__badge {
  display: inline-block; margin-bottom: 12px; padding: 4px 13px;
  font-size: .76rem; font-weight: 700;
  color: var(--on-brand); background: var(--brand); border-radius: 999px;
}
.dl-hero__body h2 { margin-bottom: 8px; }
.dl-hero__sub {
  margin: 0 0 22px; font-size: .92rem; color: var(--muted);
}
.dl-hero__hint {
  margin: 14px 0 0; font-size: .84rem; color: var(--muted);
}

.dl-hero__aside { display: flex; }
.dl-hero__ask {
  width: 100%; padding: 20px 22px;
  background: var(--surface); border: 1px dashed var(--line-strong);
  border-radius: var(--r);
}
.dl-hero__ask strong { display: block; margin-bottom: 7px; font-size: .95rem; color: var(--ink); }
.dl-hero__ask p { margin: 0 0 14px; font-size: .86rem; color: var(--muted); line-height: 1.7; }

/* 32 位备用入口：默认收起为一个可点击的条，降低视觉噪音 */
.alt-dl {
  margin-top: 16px; overflow: hidden;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r);
}
.alt-dl summary {
  display: flex; flex-direction: column; gap: 3px;
  padding: 17px 22px; cursor: pointer; list-style: none;
  transition: background .18s ease;
}
.alt-dl summary::-webkit-details-marker { display: none; }
.alt-dl summary::after {
  content: "展开"; flex: none; align-self: flex-start;
  margin-top: 2px; padding: 2px 10px;
  font-size: .75rem; font-weight: 600; color: var(--brand-700);
  background: var(--brand-050); border: 1px solid var(--brand-100); border-radius: 999px;
}
.alt-dl[open] summary::after { content: "收起"; }
.alt-dl summary:hover { background: var(--soft); }
.alt-dl__t { font-size: .98rem; font-weight: 600; color: var(--ink); }
.alt-dl__hint { font-size: .83rem; color: var(--muted); }
.alt-dl__body {
  padding: 0 22px 22px; border-top: 1px solid var(--line);
}
.alt-dl__body p { margin: 16px 0 14px; font-size: .9rem; color: var(--muted); }

/* dl-note 里的弱化条目：环境要求属于「装不上才需要」的信息，
   视觉上退到次要，避免与主下载动作争夺注意力。 */
.dl-note__soft { opacity: .78; }

.dl-note {
  display: flex; flex-wrap: wrap; gap: 8px 22px;
  margin-top: 20px; padding: 15px 20px;
  font-size: .87rem; color: var(--ink-2);
  background: var(--soft); border: 1px dashed var(--line); border-radius: var(--r-sm);
}
.dl-note span { display: inline-flex; align-items: center; gap: 7px; }
.dl-note svg { color: var(--brand); flex: none; }

.file-meta { font-size: .8rem; color: var(--muted); font-variant-numeric: tabular-nums; }

/* ---------- 08b 「一个工具、多个下载版本」跨栏卡片 ----------
   说明在左、各版本小卡在右；窄屏自动叠成一列。
   版本小卡沿用 .dl-card 的边框/圆角语言，但用左侧色条区分主次。 */
.dl-card--span { grid-column: 1 / -1; }
.dl-card__body { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; align-items: start; }

/* 分行网格：VaultBox 独占一行，其余工具两两并列。
   .dl-grid + .dl-grid 之间留出与网格内部一致的间距；
   align-items:stretch（默认）让同一行两张卡片等高，
   再把按钮 margin-top:auto 压到卡片底部，视觉上就不会有参差留白。 */
.dl-grid + .dl-grid { margin-top: 22px; }
.dl-card--equal { height: 100%; }

.dl-vlist { display: grid; gap: 12px; }
.dl-vitem {
  position: relative; padding: 16px 18px;
  background: var(--soft); border: 1px solid var(--line); border-left: 3px solid var(--line);
  border-radius: var(--r-sm);
  transition: border-color .2s ease, background .2s ease;
}
.dl-vitem--main { border-left-color: var(--brand); background: var(--surface); }
.dl-vitem:hover { border-color: var(--brand); }
.dl-vitem__head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 3px; }
.dl-vitem__head h4 { margin: 0; font-size: .98rem; }
.dl-vitem .file-meta { display: block; margin-bottom: 8px; }
.dl-vitem p { font-size: .87rem; }
.dl-vitem .btn { margin-top: 4px; }

.dl-tag {
  padding: 2px 9px; font-size: .7rem; font-weight: 700; color: var(--on-brand);
  background: var(--brand); border-radius: 999px; letter-spacing: .02em;
}

.dl-privacy {
  display: inline-flex; align-items: center; gap: 7px;
  margin: 0 0 14px; padding: 7px 13px;
  font-size: .84rem; font-weight: 600; color: var(--brand-700);
  background: var(--brand-050); border: 1px solid rgba(18,161,80,.28); border-radius: 999px;
}
.dl-privacy svg { flex: none; }

.dl-warn {
  display: flex; gap: 10px; align-items: flex-start;
  margin-top: 18px; padding: 14px 17px;
  font-size: .88rem; color: var(--ink-2);
  background: var(--warn-card-bg); border: 1px solid var(--warn-card-line); border-radius: var(--r-sm);
}
.dl-warn svg { color: var(--warn-ico); flex: none; margin-top: 2px; }

/* 当 .dl-warn 直接用在首页卡片里作为「注意事项」段落时的微调：
   标题下的间距与正文一致，避免贴着上面的特性列表。 */
.dl-card p.dl-warn { margin-top: 0; margin-bottom: 20px; font-size: .87rem; }

/* 首页「更多作品」卡里的按钮排：允许换行，小屏占满整行 */
.dl-card .hero__actions { flex-wrap: wrap; }
.dl-card .hero__actions .btn { margin-top: 0; }

/* ---------- 09 步骤条 ---------- */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; counter-reset: step; }
.step {
  position: relative; padding: 28px 24px 24px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
}
.step__no {
  display: grid; place-items: center; width: 36px; height: 36px;
  margin-bottom: 16px; font-size: .95rem; font-weight: 700; color: var(--on-brand);
  background: var(--brand); border-radius: 10px;
}
.step h3 { font-size: 1.03rem; margin-bottom: 8px; }
.step p { font-size: .9rem; color: var(--muted); }

/* 时间线（更新日志） */
.timeline { position: relative; padding-left: 28px; }
.timeline::before {
  content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px;
  width: 2px; background: var(--line);
}
.tl-item { position: relative; padding-bottom: 34px; }
.tl-item:last-child { padding-bottom: 0; }
.tl-item::before {
  content: ""; position: absolute; left: -28px; top: 7px;
  width: 16px; height: 16px; background: var(--surface);
  border: 3px solid var(--brand); border-radius: 50%;
}
.tl-item__date { font-size: .84rem; font-weight: 600; color: var(--brand-700); margin-bottom: 4px; }
.tl-item h3 { font-size: 1.02rem; margin-bottom: 8px; }
.tl-item ul { list-style: none; display: grid; gap: 6px; }
.tl-item li { display: flex; gap: 8px; font-size: .92rem; color: var(--muted); }
.tl-item li::before { content: "·"; color: var(--brand); font-weight: 700; }

/* ---------- 10 常见问题 ---------- */
.faq-list { display: grid; gap: 12px; max-width: 860px; margin-inline: auto; }
.faq-item {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-sm); overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.faq-item[open] { border-color: var(--brand); box-shadow: var(--sh-sm); }
.faq-item summary {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 18px 22px; cursor: pointer; list-style: none;
  font-size: .98rem; font-weight: 600; color: var(--ink);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: ""; flex: none; width: 9px; height: 9px; margin: 8px 2px 0 auto;
  border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted);
  transform: rotate(45deg); transition: transform .22s ease;
}
.faq-item[open] summary::after { transform: rotate(-135deg); border-color: var(--brand); }
.faq-item summary:hover { background: var(--soft); }
.faq-item__q {
  display: inline-flex; align-items: center; justify-content: center;
  flex: none; min-width: 24px; height: 24px; margin-top: 1px;
  font-size: .78rem; font-weight: 700; color: var(--brand-700);
  background: var(--brand-050); border-radius: 7px;
}
.faq-item__a { padding: 0 22px 20px 58px; font-size: .93rem; color: var(--ink-2); }
.faq-item__a p { margin-bottom: 10px; }
.faq-item__a ul, .faq-item__a ol { padding-left: 1.2em; margin: 8px 0 10px; }
.faq-item__a li { margin-bottom: 5px; }

/* ---------- 11 提示框 ---------- */
.notice {
  display: flex; gap: 13px; padding: 16px 20px;
  font-size: .91rem; border-radius: var(--r-sm); border: 1px solid;
}
.notice svg { flex: none; margin-top: 2px; }
.notice p { margin: 0 0 8px; }
.notice p:last-child { margin-bottom: 0; }
.notice--warn { color: var(--warn-ink); background: var(--warn-bg); border-color: var(--warn-line); }
.notice--warn svg { color: var(--warn-ico); }
.notice--info { color: var(--brand-700); background: var(--brand-050); border-color: var(--brand-100); }
.notice--info svg { color: var(--brand); }

/* ---------- 12 表格 ---------- */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.data {
  width: 100%; border-collapse: collapse;
  font-size: .91rem; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden;
}
table.data caption { padding: 0 0 12px; font-size: .86rem; color: var(--muted); text-align: left; }
table.data th, table.data td { padding: 13px 16px; text-align: left; border-bottom: 1px solid var(--line); }
table.data thead th { font-weight: 700; color: var(--ink); background: var(--soft); white-space: nowrap; }
table.data tbody tr:last-child td { border-bottom: 0; }
table.data tbody tr:hover { background: var(--brand-050); }
table.data td strong { font-weight: 600; }

/* 内容页排版 */
.prose { max-width: 800px; }
/* 中文阅读习惯：纯文字段落首行缩进两个汉字（2em）。
   <a>/<strong>/<br> 都是行内元素，含它们的段落照常缩进；
   只有真正内含块级内容（图片、或 .notice 这类卡片）的段落不缩进。 */
.prose > p { text-indent: 2em; }
.prose > p:has(img),
.prose > p:has(> .notice) { text-indent: 0; }
.prose h2 { margin-top: 1.8em; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin-top: 1.8em; }
.prose ul, .prose ol { padding-left: 1.35em; margin: 0 0 1.2em; }
.prose li { margin-bottom: .5em; }
.prose img { border: 1px solid var(--line); border-radius: var(--r-sm); }

.figure { margin: 26px 0; text-align: center; }
.figure img { display: block; margin: 0 auto; border: 1px solid var(--line); border-radius: var(--r-sm); box-shadow: var(--sh-sm); }
.figure figcaption { margin-top: 10px; font-size: .85rem; color: var(--muted); }

.video-box {
  position: relative; max-width: 940px; margin-inline: auto;
  background: var(--video-bg); border-radius: var(--r); overflow: hidden; box-shadow: var(--sh-lg);
}
.video-box video { display: block; width: 100%; height: auto; }

/* 二维码 */
.qr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; max-width: 560px; }
.qr-card {
  padding: 22px; text-align: center;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
}
.qr-card img { width: 190px; height: 190px; margin: 0 auto 14px; border-radius: 10px; }
.qr-card h3 { font-size: 1rem; margin-bottom: 4px; }
.qr-card span { font-size: .85rem; color: var(--muted); }

/* 面包屑 */
.crumbs { font-size: .85rem; color: var(--muted); margin-bottom: 18px; }
.crumbs a { color: var(--muted); }
.crumbs a:hover { color: var(--brand); }
.crumbs span { margin-inline: 7px; opacity: .55; }

/* 页头横幅（内页） */
.page-hero {
  padding: 52px 0 44px;
  background: linear-gradient(180deg, var(--soft), var(--surface));
  border-bottom: 1px solid var(--line);
}
.page-hero h1 { font-size: clamp(1.6rem, 1.25rem + 1.5vw, 2.3rem); margin-bottom: 12px; }
.page-hero p { max-width: 46em; color: var(--muted); margin: 0; }

/* ---------- 13 表单 ---------- */
.form { display: grid; gap: 18px; max-width: 620px; }
.field { display: grid; gap: 7px; }
.field label { font-size: .9rem; font-weight: 600; color: var(--ink); }
.field .hint { font-size: .82rem; color: var(--muted); font-weight: 400; }
.field input, .field textarea, .field select {
  width: 100%; padding: 12px 14px;
  font-family: inherit; font-size: .95rem; color: var(--ink);
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.field input:focus, .field textarea:focus, .field select:focus {
  outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(18,161,80,.14);
}
.field textarea { min-height: 130px; resize: vertical; }
.field--hp { position: absolute; left: -9999px; }

.form-msg { padding: 14px 18px; font-size: .92rem; border-radius: var(--r-sm); margin-bottom: 20px; }
.form-msg--ok { color: var(--brand-700); background: var(--brand-050); border: 1px solid var(--brand-100); }
.form-msg--err { color: var(--err-ink); background: var(--err-bg); border: 1px solid var(--err-line); }
.form-msg ul { margin: 6px 0 0; padding-left: 1.2em; }

/* 联系方式卡 */
.contact-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 44px; align-items: start; }
.contact-side { display: grid; gap: 14px; }
.contact-item {
  display: flex; gap: 14px; padding: 18px 20px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-sm);
}
.contact-item__ico {
  display: grid; place-items: center; width: 42px; height: 42px; flex: none;
  color: var(--brand); background: var(--brand-050); border-radius: 11px;
}
.contact-item h4 { margin: 0 0 3px; font-size: .95rem; }
.contact-item p { margin: 0; font-size: .88rem; color: var(--muted); }

.copy-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 3px 10px; font-family: inherit; font-size: .88rem; font-weight: 600;
  color: var(--brand-700); background: var(--brand-050);
  border: 1px solid var(--brand-100); border-radius: 999px; cursor: pointer;
  font-variant-numeric: tabular-nums;
}
.copy-btn:hover { background: var(--brand-100); }
.copy-btn.is-copied { color: var(--on-brand); background: var(--brand); border-color: var(--brand); }
.copy-tip { font-size: .74rem; font-weight: 400; opacity: .75; }
.copy-btn.is-copied .copy-tip { opacity: .95; }

/* ---------- 14 页脚 ---------- */
.site-footer { background: var(--foot-bg); color: var(--foot-ink); font-size: .9rem; }
.site-footer a { color: var(--foot-link); }
.site-footer a:hover { color: var(--foot-strong); }

.site-footer__grid {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 40px; padding: 64px 0 44px;
}
.brand--footer { color: var(--foot-accent); margin-bottom: 16px; }
.brand--footer .brand__text strong { color: var(--foot-strong); }
.site-footer__desc { font-size: .89rem; line-height: 1.75; margin-bottom: 16px; }
.site-footer__meta { display: inline-flex; align-items: center; gap: 7px; font-size: .85rem; color: var(--foot-muted); }
.site-footer__meta svg { color: var(--foot-accent); }

.site-footer__col h4 { margin: 0 0 16px; font-size: .93rem; color: var(--foot-strong); }
.site-footer__col ul { list-style: none; display: grid; gap: 10px; }
.site-footer__contact li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.site-footer__contact svg { color: var(--foot-accent); flex: none; }
.site-footer .copy-btn {
  color: var(--foot-link); background: var(--foot-chip);
  border-color: var(--foot-chip-bd);
}
.site-footer .copy-btn:hover { background: var(--foot-chip-h); color: var(--foot-strong); }
.site-footer .copy-btn.is-copied { color: var(--foot-bg); background: var(--foot-accent); border-color: var(--foot-accent); }

.site-footer__bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 10px; padding: 22px 0;
  font-size: .84rem; color: var(--foot-muted);
  border-top: 1px solid var(--foot-divide);
}
.site-footer__bar p { margin: 0; }
.site-footer__legal { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.site-footer__legal .sep { opacity: .4; }

/* ---------- 15 杂项 ---------- */
.back-top {
  position: fixed; right: 22px; bottom: 22px; z-index: 90;
  display: grid; place-items: center; width: 44px; height: 44px;
  color: var(--on-brand); background: var(--brand);
  border: 0; border-radius: 50%; cursor: pointer;
  box-shadow: 0 10px 26px -10px rgba(18,161,80,.9);
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .24s ease, transform .24s ease, visibility .24s;
}
.back-top svg { transform: rotate(180deg); }
.back-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.back-top:hover { background: var(--brand-600); }

.cta-band {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 26px; padding: 40px 44px;
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-700) 100%);
  border-radius: var(--r-lg); color: var(--on-brand);
}
.cta-band h2 { color: var(--on-brand); margin-bottom: 8px; }
.cta-band p { color: rgba(255,255,255,.88); margin: 0; }
.cta-band .btn--ghost { color: var(--brand-700); background: var(--on-brand); border-color: transparent; }
.cta-band .btn--ghost:hover { background: var(--brand-050); color: var(--brand-700); }
.cta-band .btn--dark { background: rgba(0,0,0,.22); }
.cta-band .btn--dark:hover { background: rgba(0,0,0,.34); }

.text-center { text-align: center; }
.mt-0 { margin-top: 0; } .mt-1 { margin-top: 12px; } .mt-2 { margin-top: 24px; } .mt-3 { margin-top: 36px; }
.mb-0 { margin-bottom: 0; } .mb-1 { margin-bottom: 12px; } .mb-2 { margin-bottom: 24px; } .mb-3 { margin-bottom: 36px; }
.muted { color: var(--muted); }
.nowrap { white-space: nowrap; }
.lead { font-size: 1.06rem; color: var(--ink-2); }

/* ---------- 16 响应式 ---------- */
@media (max-width: 1000px) {
  .hero__grid { grid-template-columns: 1fr; gap: 44px; }
  .hero { padding: 60px 0 66px; }
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .site-footer__grid { grid-template-columns: 1fr 1fr; gap: 34px; }
  .contact-grid { grid-template-columns: 1fr; gap: 34px; }
  /* 下载主位在中等宽度下改为单列：先给下载动作，再给「不确定怎么办」的引导 */
  .dl-hero { grid-template-columns: 1fr; gap: 22px; padding: 28px 26px; }
}

@media (max-width: 820px) {
  .nav-toggle { display: inline-flex; }
  /* 窄屏主题按钮贴右侧：提示框改为右对齐，避免中心对齐时溢出屏幕 */
  .theme-toggle::after { left: auto; right: -8px; transform: none; }
  .nav-panel {
    position: fixed; left: 0; right: 0; top: var(--header-h);
    flex-direction: column; align-items: stretch; gap: 6px;
    max-height: calc(100vh - var(--header-h)); overflow-y: auto;
    padding: 14px 20px 26px;
    background: var(--surface); border-bottom: 1px solid var(--line);
    box-shadow: var(--sh);
    transform: translateY(-12px); opacity: 0; visibility: hidden;
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
  }
  .nav-panel.is-open { transform: none; opacity: 1; visibility: visible; }
  .nav { flex-direction: column; align-items: stretch; gap: 2px; }
  .nav a { padding: 13px 14px; font-size: 1rem; border-radius: 10px; }
  .nav a.is-active::after { display: none; }
  .nav a.is-active { background: var(--brand-050); }
  .nav-cta { margin-top: 10px; }
  .brand__text em { display: none; }

  .grid--2, .grid--3, .grid--4, .dl-grid, .steps, .qr-grid { grid-template-columns: 1fr; }
  .dl-card__body { grid-template-columns: 1fr; gap: 20px; }
  .section { padding: 54px 0; }
  .section-head { margin-bottom: 32px; }
  .cta-band { padding: 30px 24px; }
  .cta-band h2 { font-size: 1.35rem; }
}

@media (max-width: 560px) {
  body { font-size: 15.5px; }
  .wrap { padding-inline: 16px; }
  .site-footer__grid { grid-template-columns: 1fr; gap: 30px; padding: 44px 0 34px; }
  .site-footer__bar { flex-direction: column; align-items: flex-start; }
  .hero__actions .btn { width: 100%; }
  .card, .dl-card, .step { padding: 22px 20px; }
  .faq-item summary { padding: 16px 16px; }
  .faq-item__a { padding: 0 16px 18px 16px; }
  .version-card { padding: 20px; }
  .dl-hero { padding: 24px 20px; }
  .dl-hero__body .btn { width: 100%; }
  .scene { padding: 20px 18px; }
  .shot--hero { aspect-ratio: 4 / 3; }
}

/* 打印 */
@media print {
  .site-header, .site-footer, .back-top, .hero__actions, .nav-cta,
  .theme-toggle { display: none !important; }
  body { color: #000; }
}

/* ============================================================
   17 亮暗主题
   ------------------------------------------------------------
   机制：只有亮 / 暗两种主题，默认亮色。
   写 <html data-theme="dark"> 即暗色；没有该属性即亮色（也是默认态）。
   主题完全由用户手动切换，不跟随系统 prefers-color-scheme。
   防闪烁脚本在 inc/header.php 的 <head> 内联执行，先于首帧绘制。

   设计原则：
     · 品牌绿保持不变，保证品牌识别；
     · 暗色不放纯黑，用带绿调的深灰（#0F1713 / #151E19），
       避免与纯黑 OLED 边缘产生光晕，也降低长时间阅读疲劳；
     · 层次靠「卡片比页面亮一档」+ 更微弱的阴影来区分，
       而不是靠阴影（深色背景上阴影几乎不可见）。
   ============================================================ */

/* 暗色变量表
   唯一生效条件：<html data-theme="dark">
   没写这个属性就是亮色（默认态）。不再跟随系统 prefers-color-scheme——
   主题完全由用户手动决定，默认亮色。 */
:root[data-theme="dark"] {
  color-scheme: dark;

  --brand:        #2FBE72;
  --brand-600:    #46D089;
  --brand-700:    #7CE0AE;
  --brand-100:    #234A38;
  --brand-050:    #172B22;
  --on-brand:     #06170F;

  --ink:          #F1F6F3;
  --ink-2:        #C7D4CC;
  --muted:        #93A79C;
  --line:         #2A3730;
  --line-strong:  #3A4C42;
  --bg:           #0F1713;
  --soft:         #151E19;

  --surface:      #1A241E;
  --surface-2:    #151E19;
  --header-bg:    rgba(15, 23, 19, .84);

  --hero-top:     #101A15;
  --hero-bottom:  #0F1713;
  --hero-glow-1:  rgba(47, 190, 114, .16);
  --hero-glow-2:  rgba(47, 190, 114, .10);

  --warn-bg:      #2A2313;
  --warn-line:    #55431C;
  --warn-ink:     #E8C575;
  --warn-ico:     #E8B84B;
  --warn-card-bg: #241F12;
  --warn-card-line: #4E3F1B;

  --err-ink:      #F0A7A1;
  --err-bg:       #2C1A19;
  --err-line:     #5A2F2C;

  --foot-bg:      #080D0A;
  --foot-ink:     #8FA396;
  --foot-link:    #B6C7BC;
  --foot-strong:  #FFFFFF;
  --foot-muted:   #79907F;
  --foot-accent:  #46D089;
  --foot-divide:  rgba(255, 255, 255, .08);
  --foot-chip:    rgba(255, 255, 255, .06);
  --foot-chip-h:  rgba(255, 255, 255, .12);
  --foot-chip-bd: rgba(255, 255, 255, .10);

  --video-bg:     #060907;

  /* 深色底上阴影要更重、更弥散才有层次感 */
  --sh-sm: 0 1px 2px rgba(0, 0, 0, .5);
  --sh:    0 10px 30px -12px rgba(0, 0, 0, .7);
  --sh-lg: 0 28px 64px -26px rgba(0, 0, 0, .8);
}

/* 主题切换按钮（放在导航栏内），与 .nav-toggle 同一视觉语言 */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; padding: 0; flex: none;
  color: var(--ink); background: var(--surface);
  border: 1px solid var(--line); border-radius: 10px; cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease;
}
.theme-toggle:hover { color: var(--brand-700); border-color: var(--brand); background: var(--brand-050); }
.theme-toggle svg { flex: none; }
/* 两种主题，按钮只显示"当前态"对应的图标。
   两个来源，按优先级：
     ① js 跑起来后 → 按钮自己的 data-mode（由 initTheme 维护，最权威）
     ② js 还没跑   → <html data-theme-mode>（head 内联脚本写入）
   服务端故意不在按钮上硬编码 data-mode，就是为了让 ② 能生效。 */
.theme-toggle__ico { display: none; }
html[data-theme-mode="light"] .theme-toggle .theme-toggle__ico--light,
html[data-theme-mode="dark"]  .theme-toggle .theme-toggle__ico--dark { display: inline-flex; }
.theme-toggle[data-mode="light"] .theme-toggle__ico--light,
.theme-toggle[data-mode="dark"]  .theme-toggle__ico--dark { display: inline-flex; }

/* 自绘提示框：替代浏览器原生 title 气泡（原生气泡位置/裁切不受页面控制）。
   悬停或键盘聚焦后延迟 0.4s 出现，移开立即消失；走语义变量，暗色自动适配。 */
.theme-toggle { position: relative; }
.theme-toggle::after {
  content: attr(data-tip);
  position: absolute; top: calc(100% + 9px); left: 50%;
  transform: translateX(-50%);
  padding: 6px 12px;
  font-size: .78rem; font-weight: 500; line-height: 1.4; white-space: nowrap;
  color: var(--ink); background: var(--surface);
  border: 1px solid var(--line); border-radius: 8px;
  box-shadow: var(--sh-sm);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .16s ease, visibility .16s ease;
  z-index: 300;
}
.theme-toggle:hover::after,
.theme-toggle:focus-visible::after {
  opacity: 1; visibility: visible;
  transition-delay: .4s;
}

/* 移动端：把主题按钮与汉堡按钮并排放到页头右侧 */
.site-header__actions { display: flex; align-items: center; gap: 10px; flex: none; }

/* 深色主题下的个别细节修正
   （无法只靠变量表达的部分：渐变语汇、图形描边、打印） */
:root[data-theme="dark"] .hero h1 .hl {
  /* 亮色下是"荧光笔"效果，深色下改为低透明度品牌色块，避免刺眼 */
  background: linear-gradient(180deg, transparent 62%, rgba(47, 190, 114, .22) 62%);
}

/* 下载主位在深色下的渐变底：亮色是「品牌浅绿 → 白」，
   深色不能沿用 white 端点（会突兀地发亮），改用 surface收尾。 */
:root[data-theme="dark"] .dl-hero {
  background: linear-gradient(180deg, var(--brand-050), var(--surface) 60%);
}

/* 品牌徽标里的白色横线在深色底上依旧成立（绿底白线），无需改；
   但 logo 内那笔描边用的固定绿需要跟随主题，否则深色下对比不足。 */
:root[data-theme="dark"] .brand__mark svg path[stroke="#12A150"] { stroke: var(--brand); }

/* 主题切换的过渡：只给颜色类属性，避免布局抖动；
   prefers-reduced-motion 用户不做动画。 */
@media (prefers-reduced-motion: no-preference) {
  body,
  .site-header, .card, .dl-card, .dl-vitem, .step, .faq-item, .qr-card,
  .contact-item, .version-card, .chip, .nav-panel, .page-hero, .hero,
  .notice, .dl-warn, .field input, .field textarea, .field select,
  table.data, table.data thead th, .btn, .theme-toggle {
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
  }
  /* .btn 已有位移动画，这里补回它自己的过渡，别被覆盖 */
  .btn { transition: transform .16s ease, box-shadow .18s ease, background-color .2s ease, color .2s ease, border-color .2s ease; }
}

/* 切换瞬间禁用过渡，避免"半亮半暗"的拖影 */
html.theme-switching *, html.theme-switching *::before, html.theme-switching *::after {
  transition: none !important;
}

/* 打印永远用亮色：即使访客当前是暗色主题 */
@media print {
  :root, :root[data-theme="dark"] {
    color-scheme: light;
    --bg: #FFFFFF; --surface: #FFFFFF; --soft: #F6F9F7;
    --ink: #000000; --ink-2: #1A1A1A; --muted: #444444; --line: #CCCCCC;
    --brand-050: #F0FAF4; --brand-100: #DCF3E6; --brand-700: #0A6E35;
    --warn-bg: #FFFFFF; --warn-card-bg: #FFFFFF; --err-bg: #FFFFFF;
    --header-bg: #FFFFFF;
    --hero-top: #FFFFFF; --hero-bottom: #FFFFFF;
    --hero-glow-1: transparent; --hero-glow-2: transparent;
    --foot-bg: #FFFFFF; --foot-ink: #333333; --foot-link: #333333;
    --foot-strong: #000000; --foot-muted: #555555;
    --sh-sm: none; --sh: none; --sh-lg: none;
  }
  body { color: #000; background: #fff; }
  .theme-toggle { display: none !important; }
}