/* ==========================================================================
   theme-cool-silver-legal.css —— 法律/条款类页面主题层（第 6 层）
   --------------------------------------------------------------------------
   适用页面：terms.html / refund.html / disclaimer.html / privacy.html
             （此四页不引任何外部 CSS，全靠内联 <style>，是独立的深底色系）

   手法说明（与主站 5 层不同）：
     这四页的内联样式全部写成 var(--bg) / var(--line) / var(--text) /
     var(--muted) / var(--cyan) / var(--gold)，是一个"变量驱动"的小系统。
     因此最优解法不是逐条覆盖属性，而是【重定义这 6 个变量】—— 一处生效全页，
     且不改变任何布局属性（padding / display / width 全部原样保留）。

   注入方式：由于这四页没有外部 CSS 链接，本层必须**内联注入**到
     它们 </head> 之前，而不是 <link rel="stylesheet">。
     构建脚本：build_legal_preview.js

   风险与回滚：本层只改颜色变量 + 少量元素微调，不触碰任何尺寸/布局/显示逻辑；
     回滚 = 移除注入的 <style> 块。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 变量重定义 —— 四页浅色化的唯一关键
   -------------------------------------------------------------------------- */
:root{
  /* 底色：深墨绿 #041318 → 冷银浅底 */
  --bg:#f2f4f8;
  /* 描边：深青 #21454c → 冷银描边 */
  --line:#e3e8f0;
  /* 正文：浅青白 #e7f7f6 → 深墨 */
  --text:#0d1522;
  /* 次要：灰青 #86a4a8 → 中灰（加深到 #5f6b7d 以满足 WCAG AA 4.5:1） */
  --muted:#5f6b7d;
  /* 重音：霓虹青 #2bd9cc → 冷青（与主站 --cyan 对齐） */
  --cyan:#0b7285;
  /* 高亮：香槟金 #d9b76f → 深铜金（浅底上需 4.5:1，原 #9a6b1f 只到 4.24） */
  --gold:#7a5410;

  /* 声明浅色配色方案，让浏览器原生控件（滚动条/表单）也跟随 */
  color-scheme:light;
}

/* --------------------------------------------------------------------------
   2. 页面骨架
   -------------------------------------------------------------------------- */

/* 冷银细网纹底，与主站视觉统一 */
body{
  background-color:var(--bg)!important;
  background-image:radial-gradient(rgba(13,21,34,.035) .5px,transparent .5px)!important;
  background-size:22px 22px!important;
  background-attachment:fixed!important;
  color:var(--text)!important;
}

/* 顶栏：深底分隔线 → 冷银 + 玻璃态 */
header{
  border-bottom:1px solid var(--line)!important;
  position:sticky;top:0;z-index:10;
  background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  backdrop-filter:blur(14px) saturate(140%);
}

/* 品牌标识：多边形深底徽记 → 浅色描边徽记 */
.brand{color:var(--text)!important}
.brand-mark{
  border-color:var(--line-2,rgba(196,206,221,.9))!important;
  background:
    radial-gradient(circle at 35% 25%,rgba(11,114,133,.10),transparent 45%),
    #ffffff!important;
  box-shadow:0 2px 12px -4px rgba(13,21,34,.16)!important;
}
.brand-mark svg path:first-child{
  fill:#ffffff!important;
  stroke:var(--cyan)!important;
}
.brand-mark .brand-t{stroke:var(--cyan)!important}
.brand-mark .brand-wave{stroke:var(--cyan)!important;opacity:.75}
.brand-mark .brand-wave.gold{stroke:var(--gold)!important}
.brand-word{
  color:var(--text)!important;
  letter-spacing:.12em!important;
  font-weight:800;
}

/* 正文区 */
main{padding-top:38px!important;padding-bottom:58px!important}

/* 小标签（NO REFUND POLICY / TERMS OF SERVICE 等） */
label{
  color:var(--gold)!important;
  letter-spacing:.16em!important;
  font-weight:600;
}

/* 主标题：加冷银渐变质感，不与正文同色 */
h1{
  color:var(--text)!important;
  font-weight:300;
  letter-spacing:-.01em;
  background:linear-gradient(120deg,#0d1522,#3d495c);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  padding-bottom:4px; /* 防止 background-clip 裁掉下沿字形 */
}

/* 小标题 */
h2{
  color:var(--ink-strong,#3d495c)!important;
  font-weight:500;
  letter-spacing:0;
}

/* 章节：深描边 → 冷银细线 */
section{
  border-top-color:var(--line)!important;
}

/* --------------------------------------------------------------------------
   3. 四页专属类（差集里报出来的 .lead / .notice / .back）
   -------------------------------------------------------------------------- */

/* .lead —— 导语段（terms / refund / privacy 用） */
.lead{color:var(--ink-strong,#3d495c)!important;font-size:17px!important;line-height:1.75}

/* .meta —— 版本号行 */
.meta{color:var(--muted)!important}

/* .notice —— 免责声明页的警示块（生产：#17150d 深棕底 + #6d5830 描边 + #ead9aa 金字）
   浅色化：改成"浅琥珀底 + 铜金描边 + 深棕字"，保持警示语义但不刺眼 */
.notice{
  border:1px solid #e8d9b4!important;
  border-left:3px solid var(--gold)!important;
  background:linear-gradient(135deg,#fdf8ec,#fbf3e2)!important;
  color:#6b4f14!important;
  border-radius:10px;
  padding:16px 18px!important;
  font-size:14px;
  box-shadow:0 1px 2px rgba(13,21,34,.03);
}

/* .back —— "返回首页"按钮（生产只有 1px 描边，无背景） */
.back{
  border:1px solid var(--line-2,#d5dce8)!important;
  border-radius:7px;
  background:rgba(255,255,255,.72);
  color:var(--cyan)!important;
  padding:9px 15px!important;
  font-weight:600;
  transition:border-color .16s,background .16s,box-shadow .16s;
}
.back:hover{
  border-color:var(--cyan)!important;
  background:rgba(11,114,133,.06);
  box-shadow:0 4px 14px -8px rgba(11,114,133,.5);
}

/* 列表项 */
li{margin:8px 0!important}
li::marker{color:var(--muted)}

/* 链接 */
a{color:var(--cyan)!important}
a:hover{text-decoration:underline;text-underline-offset:3px}

/* --------------------------------------------------------------------------
   4. 页脚
   -------------------------------------------------------------------------- */
footer{
  border-top:1px solid var(--line)!important;
  color:var(--muted)!important;
  padding:20px 0 44px!important;
}

/* --------------------------------------------------------------------------
   5. 滚动条（浅色）
   -------------------------------------------------------------------------- */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{
  background:rgba(13,21,34,.14);
  border-radius:999px;
  border:2px solid transparent;
  background-clip:content-box;
}
::-webkit-scrollbar-thumb:hover{background:rgba(13,21,34,.24);background-clip:content-box}

/* --------------------------------------------------------------------------
   6. 选中文字 & 焦点可见性
   -------------------------------------------------------------------------- */
::selection{background:rgba(11,114,133,.16);color:var(--text)}
:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;border-radius:4px}

/* --------------------------------------------------------------------------
   7. 移动端
   -------------------------------------------------------------------------- */
@media (max-width:640px){
  h1{font-size:clamp(28px,9vw,40px)!important}
  h2{font-size:20px!important}
  main{padding-top:26px!important;padding-bottom:40px!important}
  .notice{padding:14px 15px!important}
}

/* --------------------------------------------------------------------------
   8. 打印
   -------------------------------------------------------------------------- */
@media print{
  body{background:#fff!important}
  header{position:static!important;background:#fff!important}
  .back{display:none!important}
  h1{-webkit-text-fill-color:var(--text)!important;background:none!important}
}

/* [logo 2026-10-24] 新 Logo：去掉旧六边形发光容器 */
.brand-mark{clip-path:none!important;border:0!important;background:none!important;box-shadow:none!important;
  display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible}
.brand-mark:after{display:none!important}
.brand-mark svg{width:100%!important;height:100%!important}
.brand-mark img.brand-img{width:100%;height:100%;object-fit:contain;display:block}