/* ============================================================================
   AmberVouch · Archive（档案馆）全站主题层
   ----------------------------------------------------------------------------
   设计方向：纸张、墨、黄铜、细线、编号、宋体标题、直角卡片。
   在页面原有样式之后加载，只改“气质”，不改业务布局与交互。

   颜色：纸 #F5F0E6 / 墨 #211C16 / 黄铜 #9A5B2E / 深绿 #1E3A32
   字体：标题宋体；正文无衬线；编号/哈希等宽。
   ========================================================================== */
:root{
  --av-paper:#F5F0E6;
  --av-paper-2:#FBF8F1;
  --av-paper-3:#EFE7D8;
  --av-ink:#211C16;
  --av-ink-2:#4A4035;
  --av-muted:#766B5D;
  --av-brass:#9A5B2E;
  --av-brass-2:#7F4722;
  --av-brass-3:#B07A3A;
  --av-green:#1E3A32;
  --av-line:#D8CBB4;
  --av-line-2:#C7B79A;
  --av-serif:"Songti SC","Noto Serif SC","STSong","SimSun",serif;

  --bg:var(--av-paper) !important;
  --bg-2:var(--av-paper-2) !important;
  --surface:var(--av-paper-2) !important;
  --surface-2:var(--av-paper-3) !important;
  --surface-3:#E6DAC8 !important;
  --ink:var(--av-ink) !important;
  --ink-2:var(--av-ink-2) !important;
  --ink-3:var(--av-muted) !important;
  --ink-4:#A29482 !important;
  --gold:var(--av-brass) !important;
  --gold-2:var(--av-brass-2) !important;
  --gold-3:var(--av-brass-3) !important;
  --gold-soft:rgba(154,91,46,.10) !important;
  --gold-line:rgba(154,91,46,.28) !important;
  --link:var(--av-brass-2) !important;
  --link-2:#5E3218 !important;
  --line:var(--av-line) !important;
  --line-2:var(--av-line-2) !important;
  --r-sm:2px !important; --r:2px !important; --r-md:2px !important;
  --r-lg:3px !important; --r-xl:4px !important; --radius:2px !important;
  --sh-1:0 1px 0 rgba(33,28,22,.04) !important;
  --sh-2:0 14px 34px rgba(33,28,22,.07) !important;
  --sh-3:0 24px 60px rgba(33,28,22,.10) !important;
  --font-serif:var(--av-serif);
}

html{background:var(--av-paper) !important}
body{
  background:var(--av-paper) !important;
  color:var(--av-ink) !important;
}
/* 证据页等页面用 body[class] 的 Tailwind 底色，特异性高于单 body；这里压平 */
html body[class],body[class]{
  background:var(--av-paper) !important;
  color:var(--av-ink) !important;
}
body[class] .bg-white,body[class] .bg-slate-50,body[class] .bg-slate-100,body[class] .bg-gray-50,
body[class] .bg-amber-50,body[class] .bg-amber-100,body[class] .bg-yellow-50{
  background:var(--av-paper-2) !important;
}
body[class] .bg-amber-50,body[class] .bg-amber-100,body[class] .bg-yellow-50{background:var(--av-paper-3) !important}
body[class] .border-slate-200,body[class] .border-slate-300,body[class] .border-gray-200,
body[class] [class*="border-amber"],body[class] [class*="border-yellow"]{
  border-color:var(--av-line) !important;
}
body[class] [class*="text-amber"],body[class] [class*="text-yellow"]{color:var(--av-brass-2) !important}
body[class] [class*="rounded"]{border-radius:2px !important}
body[class] [class*="shadow"]{box-shadow:none !important}

/* 标题：宋体、收紧字距；保持原有字号层级 */
h1,h2,h3,h4,h5,.serif,.hero h1,.hero-claim,.h3-hero h2,.sec-head h2,.sec-title h2{
  font-family:var(--av-serif) !important;
  font-weight:500 !important;
  letter-spacing:-.02em;
}
h1{line-height:1.08 !important}
h2{line-height:1.3 !important}

/* 正文里的小标签、编号、哈希保持等宽 */
.mono,code,kbd,samp,pre,.eyebrow,.kicker,.h3-eyebrow{font-family:var(--font-mono) !important}

/* ── 顶部导航 ─────────────────────────────────────────────── */
.u-nav{
  background:rgba(245,240,230,.95) !important;
  color:var(--av-ink) !important;
  border-bottom:1px solid var(--av-line) !important;
  box-shadow:none !important;
  backdrop-filter:blur(12px);
}
.u-nav .brand .nm{color:var(--av-ink) !important}
.u-nav .brand .nm i{color:var(--av-brass) !important}
/* 站长确认：保留旧版朱红渐变章面「琥珀印」，作为全站唯一红色品牌锚点 */
.u-nav .brand .cn{
  display:inline-block !important;
  background:linear-gradient(160deg,#D64A37,#C0392B 60%,#A93226) !important;
  color:#FFFFFF !important;
  border:0 !important;
  border-radius:7px !important;
  box-shadow:0 3px 12px rgba(192,57,43,.38), inset 0 0 0 1.5px rgba(255,244,214,.55) !important;
  padding:6px 12px !important;
  font-family:"KaiTi","STKaiti","楷体",serif !important;
  font-weight:700 !important;
  font-size:22px !important;
  letter-spacing:4px !important;
  line-height:1.25 !important;
  transform:rotate(-2deg) !important;
  white-space:nowrap !important;
}
.u-nav .brand .cn em{
  font-style:normal !important;
  color:#F5B942 !important;
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .u-nav .brand .cn em{
    background:linear-gradient(180deg,#FFE9B8,#F5B942 50%,#E0A02A) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
  }
}
@media (max-width:760px){
  .u-nav .brand .cn{font-size:17px !important;letter-spacing:2.5px !important;padding:4px 8px !important;border-radius:6px !important}
}
.u-nav .nav-links > .nav-item > .nav-top,
.u-nav .nav-links > a.nav-top{
  color:var(--av-ink-2) !important;
  font-size:13px !important;
  letter-spacing:.02em;
}
.u-nav .nav-links > .nav-item > .nav-top:hover,
.u-nav .nav-links > a.nav-top:hover{color:var(--av-brass) !important}
.u-nav .caret{border-color:var(--av-muted) !important}
.u-nav .nav-cta{
  background:var(--av-ink) !important;
  color:var(--av-paper-2) !important;
  border:1px solid var(--av-ink) !important;
  border-radius:2px !important;
  box-shadow:none !important;
  font-weight:700 !important;
}
.u-nav .nav-cta:hover{background:var(--av-brass) !important;border-color:var(--av-brass) !important}
.u-nav .submenu-in{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line-2) !important;
  border-radius:2px !important;
  box-shadow:0 18px 40px rgba(33,28,22,.12) !important;
}
.u-nav .submenu-in a b{color:var(--av-ink) !important}
.u-nav .submenu-in a span{color:var(--av-muted) !important}
.u-nav .submenu-in a:hover{background:var(--av-paper-3) !important}
.u-nav .catbox .cb-hd{border-radius:2px !important}
.u-nav .nav-burger .bar{background:var(--av-ink) !important}

/* 工具页顶部的分类条：从“彩色图标条”收敛为纸面细线 */
.catnav,.catbar{border-color:var(--av-line) !important}

/* ── 按钮：直角、墨色主按钮、黄铜 hover ───────────────────── */
.btn,.btn-main,.btn-o,.btn-p,.btn-amber,.btn-hero,.btn-ghost,.btn-primary,
.nav-cta,.nd-act,.h3-search button,.h3-intent .go{
  border-radius:2px !important;
  box-shadow:none !important;
  font-family:var(--font) !important;
}
.btn-main,.btn-p,.btn-amber,.h3-search button{
  background:var(--av-ink) !important;
  border-color:var(--av-ink) !important;
  color:var(--av-paper-2) !important;
}
.btn-main:hover,.btn-p:hover,.btn-amber:hover,.h3-search button:hover{
  background:var(--av-brass) !important;
  border-color:var(--av-brass) !important;
}
.btn-o,.btn-ghost,.btn-hero.btn-ghost{
  background:transparent !important;
  border:1px solid var(--av-line-2) !important;
  color:var(--av-ink) !important;
}
.btn-o:hover,.btn-ghost:hover,.btn-hero.btn-ghost:hover{
  background:var(--av-paper-3) !important;
  border-color:var(--av-ink) !important;
}

/* ── 卡片：纸面、细线、直角、几乎无阴影 ───────────────────── */
.card,.panel,.box,.h3-card,.h3-intent,.tool-card,.price-card,.plan,.pcard,
.feature,.stat,.step-card,.wb-card,.drop,.h3-drop,.h3-search,.faq-item{
  border-radius:2px !important;
  box-shadow:none !important;
}
.card,.panel,.box,.tool-card,.price-card,.plan,.pcard,.feature,.stat,.step-card,.wb-card,.faq-item{
  background:var(--av-paper-2) !important;
  border-color:var(--av-line) !important;
}
.card:hover,.tool-card:hover,.price-card:hover,.plan:hover,.pcard:hover,.feature:hover,.wb-card:hover{
  border-color:var(--av-line-2) !important;
  box-shadow:0 14px 30px rgba(33,28,22,.06) !important;
}

/* 表单 */
input,select,textarea{
  border-radius:2px !important;
  background:var(--av-paper-2) !important;
  border-color:var(--av-line-2) !important;
  color:var(--av-ink) !important;
}
input:focus,select:focus,textarea:focus{border-color:var(--av-brass) !important;box-shadow:none !important}

/* 页脚：墨底、纸字 */
footer,.site-footer{
  background:var(--av-ink) !important;
  color:var(--av-paper) !important;
  border-top:1px solid var(--av-ink) !important;
}
footer a,.site-footer a{color:rgba(245,240,230,.72) !important}
footer a:hover,.site-footer a:hover{color:var(--av-brass-3) !important}
footer h4,footer .foot-h{color:rgba(245,240,230,.42) !important;font-family:var(--font-mono) !important;font-size:10px !important;letter-spacing:.14em !important}
footer p,footer .muted{color:rgba(245,240,230,.56) !important}

/* 法律条款条（2026-11-01 用户指出配色奇怪）
   坑：它是个 <nav class="legal-nav">，被全站通用规则
   `nav{background:var(--bg-2)}`（theme.css）和
   `nav:not(.hub-catnav-bar){background:var(--surface)}`（tool.css）
   一起刷成了浅纸底，夹在深墨页脚里就像贴了一张白纸条 —— 深、浅、深三明治。
   这里把它归位：透明底、纸字、只用一条极淡的分隔线跟正文分开。
   注意：选择器必须带 footer 前缀，否则会误伤页脚之外单独使用的 legal-nav。 */
footer .legal-nav,.site-footer .legal-nav{
  background:transparent !important;
  border:0 !important;
  border-top:1px solid rgba(245,240,230,.13) !important;
  margin-top:18px !important;
  padding-top:14px !important;
}
footer .legal-nav .ln-t,.site-footer .legal-nav .ln-t{color:rgba(245,240,230,.60) !important}
footer .legal-nav a,.site-footer .legal-nav a{color:rgba(245,240,230,.82) !important}
footer .legal-nav a:hover,.site-footer .legal-nav a:hover{color:var(--av-brass-3) !important}
footer .legal-nav .lf-sep,.site-footer .legal-nav .lf-sep{color:rgba(245,240,230,.26) !important}

/* ============================================================================
   页脚对比度修复（2026-11-01）
   ----------------------------------------------------------------------------
   病因：页脚是深墨底，里面却混了两类"看不见"的东西 ——
     ① 纯文字（分组标题、页脚说明）用 --ink-2 深褐 → 深底深字；
     ② 标签胶囊用 --surface-2，被本文件映射成不透明纸色 #EFE7D8，
        而 `footer a` 规则又把胶囊里的字刷成纸色 → 浅底浅字。
   做法：纯文字提到半透明纸色；胶囊反过来改成深色半透明，
        让纸色文字坐得稳。胶囊变深之后，整块页脚反而更安静。
   ========================================================================== */
footer .tool-links .tl-title,
footer #toolLinks .tl-title,
footer #hubCats .tl-title,
footer #sceneLinks .tl-title,
footer .ft-note,
footer .rel-tools span,
footer .foot-h,
footer .muted{
  color:rgba(245,240,230,.58) !important;
}
footer #toolLinks a,
footer #hubCats a,
footer .tool-links a,
footer .hub-cats a{
  background:rgba(245,240,230,.09) !important;
  border-color:rgba(245,240,230,.14) !important;
  color:rgba(245,240,230,.86) !important;
}
footer #toolLinks a:hover,
footer #hubCats a:hover,
footer .tool-links a:hover,
footer .hub-cats a:hover{
  background:rgba(245,240,230,.16) !important;
  color:#FFF8EC !important;
}
/* 页脚广告按钮：金底深字，别再被 footer a 的纸色规则刷白 */
footer .ad-slot .ad-cta,
footer .ad-slot.ad-foot .ad-cta{
  background:var(--av-brass) !important;
  border-color:var(--av-brass) !important;
  color:#FFF8EC !important;
}
footer .ad-slot .ad-cta:hover{
  background:var(--av-brass-2) !important;
  border-color:var(--av-brass-2) !important;
  color:#FFF8EC !important;
}
/* 页脚广告卡：整张卡是浅纸底，夹在深墨页脚里像一块没撕干净的标签。
   改成深色半透明 + 极淡描边，按钮用黄铜金 —— 该显眼的地方仍然显眼。 */
footer .ad-slot.ad-foot{
  background:rgba(245,240,230,.055) !important;
  border-color:rgba(245,240,230,.13) !important;
}
footer .ad-slot.ad-foot .ad-title{color:rgba(245,240,230,.94) !important}
footer .ad-slot.ad-foot .ad-desc{color:rgba(245,240,230,.66) !important}
footer .ad-slot.ad-foot::before{
  color:rgba(245,240,230,.44) !important;
  border-color:rgba(245,240,230,.20) !important;
}

/* ============================================================================
   全站对比度收尾（2026-11-01 扫描后）
   ----------------------------------------------------------------------------
   用脚本逐元素算了「文字色 vs 实际背景」的对比度，把 <2（几乎看不见）的挑出来修。
   这里只处理确定是「配色打架」的，不改设计意图。
   ========================================================================== */

/* ① 页脚品牌名与分组标题：深墨字落在深墨底上，对比度 1，等于隐形 */
footer .ft-brand .nm,footer .ft-brand .nm b{color:rgba(245,240,230,.94) !important}
footer .ft-brand .cn,footer .ft-brand span{color:rgba(245,240,230,.62) !important}
footer h3,footer h4,footer .ft-grid h3{color:rgba(245,240,230,.42) !important}

/* ② 代码片段：深色主题的亮蓝 (#7FD0FF) 留在浅纸上，1.5 的对比度。
      改成压深金 + 极淡金底，既看得清又还在品牌色系里。 */
p code,li code,td code,dd code,
.desc code,.note code,.wb-cb code,.wb-cb-note code{
  color:#7A4410 !important;
  background:rgba(154,91,46,.10) !important;
  border:1px solid rgba(154,91,46,.16) !important;
  border-radius:2px !important;
  padding:1px 5px !important;
}

/* ③ 深色 hero（橙红渐变 + 白字）：archive 的 .hero{background:纸色} 把底清了、字没清。
      只认「带白色描边按钮的 hero」——那是深底 hero 的固定特征，不误伤浅底 hero。 */
.hero:has(.cta.ghost){
  background:linear-gradient(160deg,#B03A2E 0%,#C0392B 40%,#E67E22 100%) !important;
  color:#FFF8EC !important;
}

/* ④ 同类工具条：曾被页脚纸字规则染白，落在浅色底上。
      统一改成深色半透明条，和页脚标签胶囊一个语言。 */
footer .rel-tools,footer .rel-tools span{
  color:rgba(245,240,230,.62) !important;
}
footer .rel-tools{
  background:rgba(245,240,230,.05) !important;
  border-radius:2px !important;
}
footer .rel-tools a{color:rgba(245,240,230,.86) !important}

/* ⑤ 「仅存证」这类金色徽章：亮金压在浅纸上一片糊。压深一档，保住金的意思。 */
.badge.local,.top > .badge.local{
  color:#7A4410 !important;
  background:rgba(224,160,42,.16) !important;
  border-color:rgba(224,160,42,.34) !important;
}

/* ⑥ 数字游民工作台的时钟胶囊：金底上又写金字，字和底同一个色号（对比度 1）。
      金底配深字，这是黄铜铭牌的正确读法。 */
.now > b,.now b{color:#2A1F14 !important}

/* ⑦ 蓝色提示框：深色主题的亮蓝 (#6EA8FE) 落在浅灰底上，1.97。
      换成同色系的深蓝，仍然是"蓝色提示"，但能读。 */
.note.blue,.note.blue span,.note.blue code,.note.blue a{
  color:#1F4E79 !important;
}
.note.blue{
  background:rgba(31,78,121,.07) !important;
  border-color:rgba(31,78,121,.22) !important;
}

/* ⑧ 工作台底部状态栏（"等待添加文件"）：又一处深褐字落深墨底，2.63。
      它常驻在工具界面底部，看不清就等于没有反馈。 */
footer.wb-bot,footer.wb-bot span,footer.wb-bot b,
#status,#wb-status{color:rgba(245,240,230,.74) !important}

/* ⑨ 工作台编号「01」：金得太淡（2.13），像印糊了的铅字。压深到能读，仍是金。 */
.h3-no.num,.h3-card-top .num{color:#8A5A0D !important}

/* ⑩ 绿色状态徽章（仅存证 / 已上线 / 已锚定）：淡绿压浅纸，2.4 左右。
      压深一档，绿色还在，字能读了。 */
.badge.green,.cert-ok > b,.cap-fp,.note.green,.note.green span{color:#1E7A4E !important}

/* ── /tools/ Hub：A 方案的纸面目录 ────────────────────────── */
.hub3{
  background:var(--av-paper) !important;
  border-top:1px solid var(--av-line) !important;
  border-bottom:1px solid var(--av-line) !important;
}
.hub3::before{background:var(--av-brass) !important}
.h3-eyebrow{color:var(--av-brass) !important}
.h3-hero h2{color:var(--av-ink) !important;font-size:clamp(32px,3.8vw,48px) !important;letter-spacing:-.04em !important}
.h3-hero h2 em{color:var(--av-brass) !important;font-style:normal !important}
.h3-lede{color:var(--av-ink-2) !important}
.h3-search{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line-2) !important;
  box-shadow:none !important;
}
.h3-search input{background:transparent !important;border:0 !important}
.h3-search kbd{background:var(--av-paper-3) !important;border-color:var(--av-line) !important;border-radius:2px !important}
.h3-drop{
  background:rgba(251,248,241,.7) !important;
  border:1px dashed var(--av-line-2) !important;
}
.h3-drop .pick a{background:var(--av-brass) !important;color:#FFF8EC !important;border-radius:2px !important}
.h3-sec-h{color:var(--av-ink) !important;font-family:var(--av-serif) !important;font-size:15px !important}
.h3-sec-h::before{background:var(--av-brass) !important}
.h3-intents{gap:10px !important}
.h3-intent{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line) !important;
  color:var(--av-ink) !important;
}
.h3-intent b{font-family:var(--av-serif) !important;font-weight:600 !important}
.h3-intent span{color:var(--av-muted) !important}
.h3-intent .go{color:var(--av-brass) !important}
.h3-intent:hover{border-color:var(--av-brass) !important;transform:translateY(-1px) !important}
.h3-card{
  background:var(--av-paper-2) !important;
  border:1px solid var(--av-line) !important;
  min-height:0 !important;
}
.h3-card:hover{border-color:var(--av-brass) !important;box-shadow:0 14px 28px rgba(33,28,22,.06) !important;transform:translateY(-2px) !important}
.h3-card-title h3{font-family:var(--av-serif) !important;font-weight:600 !important;color:var(--av-ink) !important}
/* 【2026-10-31】图标恢复彩色。
   原先这里用 grayscale(1)+sepia 把 emoji 压成统一褐色，为的是“旧档案”的统一感，
   但代价太大：盾牌、包裹、钥匙、彩虹全变成同一种土黄，用户认不出、也显得脏。
   档案馆的质感应该来自纸色、细线、宋体，不该靠把图标去色来凑。
   现在只撤去色，容器仍是纸底细框，彩色图标反而更好认、更有精神。 */
.h3-ico{filter:none;opacity:1}
.catnav .ic,.catbar .ic{filter:none;opacity:.92}
.catnav .cn-ic{filter:none;opacity:.92}

/* 每个工作台一层极淡的专属色底 —— 图标有归属，卡片好辨认。
   浓度都压在 12% 上下：够看出区别，又不会把纸底搅成调色盘。
   配色跟各自的 emoji 呼应，不是随机撒糖。 */
.h3-card[data-wb="img"]    .h3-ico{background:rgba(232,140,96,.13);border-color:rgba(232,140,96,.28)}
.h3-card[data-wb="photo"]  .h3-ico{background:rgba(226,176,74,.15);border-color:rgba(226,176,74,.30)}
.h3-card[data-wb="doc"]    .h3-ico{background:rgba(198,86,72,.12);border-color:rgba(198,86,72,.26)}
.h3-card[data-wb="txt"]    .h3-ico{background:rgba(96,128,178,.12);border-color:rgba(96,128,178,.26)}
.h3-card[data-wb="office"] .h3-ico{background:rgba(78,146,110,.12);border-color:rgba(78,146,110,.26)}
.h3-card[data-wb="media"]  .h3-ico{background:rgba(148,110,178,.12);border-color:rgba(148,110,178,.26)}
.h3-card[data-wb="dev"]    .h3-ico{background:rgba(72,158,150,.12);border-color:rgba(72,158,150,.26)}
.h3-card[data-wb="sec"]    .h3-ico{background:rgba(196,140,56,.13);border-color:rgba(196,140,56,.28)}
.h3-card[data-wb="calc"]   .h3-ico{background:rgba(88,132,190,.12);border-color:rgba(88,132,190,.26)}
.h3-card[data-wb="nomad"]  .h3-ico{background:rgba(190,132,88,.13);border-color:rgba(190,132,88,.28)}
.h3-card-title span{color:var(--av-muted) !important;font-family:var(--font-mono) !important;font-size:9px !important}
.h3-card .h3-links a{color:var(--av-ink-2) !important}
.h3-card .h3-links a:hover{color:var(--av-brass) !important;border-color:var(--av-brass) !important}
.h3-card-foot{border-top:1px solid var(--av-line) !important}
.h3-card-foot span{color:var(--av-muted) !important}
.h3-card-foot b{color:var(--av-brass) !important}
.h3-more a{background:var(--av-paper-2) !important;border-color:var(--av-line) !important;border-radius:2px !important;color:var(--av-ink) !important}
.h3-more a:hover{border-color:var(--av-brass) !important}
.h3-pal-box{background:var(--av-paper-2) !important;border-color:var(--av-line) !important;border-radius:2px !important}

/* 首页的局部“金色块/深色块”统一到纸面与墨色 */
.hero{background:var(--av-paper) !important}
.stat-strip{background:var(--av-paper-2) !important;border-color:var(--av-line) !important}
.portal-card,.feature-card,.use-case,.pricing-card,.quote,.faq{
  background:var(--av-paper-2) !important;
  border-color:var(--av-line) !important;
  border-radius:2px !important;
  box-shadow:none !important;
}

/* 链接与选中态 */
::selection{background:rgba(154,91,46,.22);color:var(--av-ink)}
a{text-underline-offset:3px}


/* ============================================================================
   苹果式交互层（2026-10-31）—— 档案馆主题适配版
   与 theme.css 同源，但：① CTA 柔光用黄铜色；② 不碰直角（档案美学保留直角）。
   ============================================================================ */

html{ scroll-behavior: smooth; }
:root{ --ease-out: cubic-bezier(.22,1,.36,1); --ease-soft: cubic-bezier(.4,0,.2,1); --ease-spring: cubic-bezier(.34,1.56,.64,1); }

a{ transition: color .2s var(--ease-soft); }

button, [role="button"], .btn, .g-btn, .btn-p, .btn-pri, .btn-buy, .btn-primary,
.btn-sec, .btn-ghost, button.buy, a.btn, a.btn-p, .nav-cta{
  transition: transform .16s var(--ease-out), background-color .2s var(--ease-soft),
              border-color .2s var(--ease-soft), color .2s var(--ease-soft),
              box-shadow .24s var(--ease-soft), filter .2s var(--ease-soft);
  -webkit-tap-highlight-color: transparent;
}
button:active, [role="button"]:active, .btn:active, .g-btn:active, .btn-p:active,
.btn-pri:active, .btn-buy:active, .btn-primary:active, .btn-sec:active, .btn-ghost:active,
a.btn:active, a.btn-p:active, .nav-cta:active{ transform: scale(.965); }

/* 主 CTA（黄铜底）hover 抬升 + 柔光 */
.btn-p, .btn-pri, .btn-buy, .btn-primary, .g-btn--primary, button.buy{
  position: relative; overflow: hidden;
  box-shadow: 0 1px 3px rgba(154,91,46,.18);
}
.btn-p:hover, .btn-pri:hover, .btn-buy:hover, .btn-primary:hover,
.g-btn--primary:hover, button.buy:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(154,91,46,.30);
}
.btn-p:active, .btn-pri:active, .btn-buy:active, .btn-primary:active,
.g-btn--primary:active, button.buy:active{
  transform: translateY(0) scale(.965);
  box-shadow: 0 2px 8px rgba(154,91,46,.20);
}
.btn-p::after, .btn-pri::after, .btn-buy::after, .btn-primary::after,
.g-btn--primary::after, button.buy::after{
  content:""; position:absolute; top:0; left:-130%; width:55%; height:100%;
  pointer-events:none; background:linear-gradient(100deg,transparent,rgba(255,255,255,.30),transparent);
  transform:skewX(-20deg); transition:left .55s var(--ease-soft);
}
.btn-p:hover::after, .btn-pri:hover::after, .btn-buy:hover::after,
.btn-primary:hover::after, .g-btn--primary:hover::after, button.buy:hover::after{ left:135%; }

/* 卡片：悬停阴影加深，可点击卡片轻抬 */
.g-card, .card{
  transition: box-shadow .28s var(--ease-out), border-color .28s var(--ease-soft), transform .28s var(--ease-out);
}
.g-card:hover, .card:hover{ box-shadow: var(--sh-2); border-color: var(--gold-line); }
.g-card:has(a):hover, .card:has(a):hover{ transform: translateY(-3px); }

/* 工作台卡片 + 图标回弹 */
.h3-card{ transition: transform .28s var(--ease-out), box-shadow .28s var(--ease-out), border-color .28s var(--ease-soft); }
.h3-card:hover{ transform: translateY(-4px); box-shadow: var(--sh-3); border-color: var(--gold-line); }
.h3-card .h3-ico{ transition: transform .34s var(--ease-spring); }
.h3-card:hover .h3-ico{ transform: scale(1.1) rotate(-3deg); }

input, select, textarea{
  transition: border-color .2s var(--ease-soft), box-shadow .2s var(--ease-soft), background-color .2s var(--ease-soft);
}
.nav-links a, .nav-top, .nav-item > a{ transition: color .2s var(--ease-soft), border-color .2s var(--ease-soft), opacity .2s var(--ease-soft); }
.logo, .brand-mark, .seal-mark{ transition: transform .4s var(--ease-spring); }
.logo:hover, .brand-mark:hover, .seal-mark:hover{ transform: scale(1.05); }
.rate tbody tr, table tbody tr{ transition: background-color .18s var(--ease-soft); }
.rate tbody tr:hover, table tbody tr:hover{ background-color: var(--gold-soft); }


/* ---------- 苹果式交互增强（motion.js 配套） ---------- */
/* 滚动入场 */
.av-reveal{ opacity:0; transform:translateY(16px);
  transition:opacity .55s var(--ease-out, cubic-bezier(.22,1,.36,1)),
             transform .55s var(--ease-out, cubic-bezier(.22,1,.36,1)); }
.av-reveal.av-in{ opacity:1; transform:none; }
/* 按钮涟漪 */
.av-ripple{ position:absolute; border-radius:50%; background:currentColor; opacity:.16;
  transform:scale(0); animation:av-ripple .6s var(--ease-out, cubic-bezier(.22,1,.36,1));
  pointer-events:none; z-index:1; }
@keyframes av-ripple{ to{ transform:scale(1); opacity:0; } }


/* ============================================================================
   板块氛围层（2026-10-31）
   ----------------------------------------------------------------------------
   问题：全站 121 个页面共用同一张纸色底，走进去分不清自己在哪个厅。
   做法：给每个板块调一束自己的光 —— 墙还是那张纸，但色温不一样。
        像同一间画廊的不同展厅：你走得进去就知道换厅了，却说不清哪里变了。

   技术选择：全部由 CSS 渐变 + 内联 SVG 噪点程序化生成。
     · 不加载任何图片文件 —— 离线可用，弱网不会闪白，放大不糊
     · 只在 body::before 一层作画，不碰布局、不碰任何业务元素
     · 光晕被卡片和文字盖住，只从页边距和区块缝隙里透出来 = “隐约”

   板块标记由 _deploy/build.js 注入 <body data-av-tone="…">。
   未标记的页面落到默认暖纸金晕，不会出现“没刷到”的裸墙。
   ========================================================================== */

:root{
  /* 默认：暖纸 + 极淡金晕 */
  --av-atmo-1: rgba(224,160,42,.14);
  --av-atmo-2: rgba(154,91,46,.085);
  --av-atmo-3: rgba(110,132,110,.055);
  --av-atmo-p1: 86% 78% at 4% -16%;
  --av-atmo-p2: 72% 64% at 97% 2%;
  --av-atmo-p3: 96% 58% at 50% 110%;
  --av-atmo-grain: .030;
}

/* 免费工具台：琥珀金 —— 明亮、有序、一眼找到工具 */
body[data-av-tone="hub"]{
  --av-atmo-1: rgba(232,176,74,.175);
  --av-atmo-2: rgba(198,140,52,.095);
  --av-atmo-3: rgba(110,132,110,.062);
}

/* 电子证据固化：墨绿 + 铜 —— 庄重、封存、法律感 */
body[data-av-tone="evidence"]{
  --av-atmo-1: rgba(40,70,58,.185);
  --av-atmo-2: rgba(154,91,46,.095);
  --av-atmo-3: rgba(30,58,50,.078);
  --av-atmo-p1: 100% 62% at 50% -14%;
  --av-atmo-p2: 66% 60% at 6% 96%;
  --av-atmo-p3: 80% 50% at 98% 40%;
}

/* 琥珀市场：蜜橙聚光 —— 珠宝柜台，暖而贵 */
body[data-av-tone="market"]{
  --av-atmo-1: rgba(232,152,52,.190);
  --av-atmo-2: rgba(186,110,38,.100);
  --av-atmo-3: rgba(240,190,90,.075);
  --av-atmo-p1: 62% 46% at 50% -10%;
  --av-atmo-p2: 70% 62% at 96% 18%;
  --av-atmo-p3: 88% 52% at 8% 104%;
}

/* AI 创作：靛青 + 一点品牌金 —— 灵感、夜灯 */
body[data-av-tone="ai"]{
  --av-atmo-1: rgba(74,92,140,.180);
  --av-atmo-2: rgba(120,96,148,.092);
  --av-atmo-3: rgba(224,160,42,.075);
  --av-atmo-p1: 84% 74% at 2% -14%;
  --av-atmo-p2: 70% 62% at 98% 8%;
}

/* 确权交易：深绿 + 金 —— 契约、正式 */
body[data-av-tone="trade"]{
  --av-atmo-1: rgba(30,58,50,.155);
  --av-atmo-2: rgba(154,91,46,.082);
  --av-atmo-3: rgba(46,74,62,.058);
  --av-atmo-p1: 90% 68% at 50% -18%;
  --av-atmo-p2: 64% 58% at 4% 100%;
}

/* 行业落地：赭陶 —— 手作、行业气 */
body[data-av-tone="industry"]{
  --av-atmo-1: rgba(176,118,74,.155);
  --av-atmo-2: rgba(140,122,102,.075);
  --av-atmo-3: rgba(200,150,90,.060);
  --av-atmo-p1: 82% 72% at 6% -12%;
  --av-atmo-p2: 68% 60% at 96% 6%;
}

/* 账号 / 价格 / 后台：安静，别抢事 */
body[data-av-tone="account"]{
  --av-atmo-1: rgba(200,180,150,.115);
  --av-atmo-2: rgba(160,140,115,.058);
  --av-atmo-3: rgba(224,160,42,.045);
}

/* ---- 画布本体 ----
   坑（2026-10-31 踩过一次）：不能用 body::before + z-index:-1 画这层光。
   body 有不透明的纸色底，负 z-index 的伪元素会被它压在下面 —— 灯开着，
   门关着，页面上什么也看不见（第一版就是这么白忙的）。
   所以直接写进 body 自己的 background-image：光在纸里，天然垫在所有内容之下。
   固定背景 = 像房间里的灯，不随滚动跑。 */
body,
html body[class],
body[class]{
  background-color: var(--av-paper) !important;
  background-image:
    /* 纸面颗粒：半透明黑噪点，只加质感、不改整体亮度 */
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.10 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E"),
    /* 三处布光：左上 / 右上 / 底部，形成自然的三角光 */
    radial-gradient(var(--av-atmo-p1), var(--av-atmo-1), transparent 72%),
    radial-gradient(var(--av-atmo-p2), var(--av-atmo-2), transparent 68%),
    radial-gradient(var(--av-atmo-p3), var(--av-atmo-3), transparent 78%) !important;
  background-repeat: repeat, no-repeat, no-repeat, no-repeat !important;
  background-size: 180px 180px, cover, cover, cover !important;
  background-attachment: fixed !important;
  color: var(--av-ink) !important;
}

/* 内嵌工作台（iframe ?embed=1）：只要工具本体，不要氛围 */
html.embed body,
html.embed body[class]{ background-image: none !important }

/* 打印时不要氛围，省墨、也别把纸色底印成灰块 */
@media print{
  body, body[class]{ background-image: none !important }
}

/* 手机端：部分 iOS 版本对 fixed 背景支持不稳，退成随页面走，观感差异很小 */
@media (max-width: 640px){
  body, body[class]{ background-attachment: scroll !important }
}