/* ============================================================
   指尖像素城 · 手册 —— 全站统一设计规范
   挂载方式:放在各页面 <style> 之后、</head> 之前(最后生效)
   原则:只统一视觉(配色/圆角/阴影/顶栏),不动各页布局
   ============================================================ */
:root{
  --bg:#f5f7fb;          /* 页面底色 */
  --surface:#ffffff;     /* 卡片/顶栏底色 */
  --ink:#232733;         /* 主文字 */
  --ink2:#4a5164;        /* 次文字 */
  --muted:#7b8296;       /* 辅助文字 */
  --line:#e9ecf3;        /* 分隔线 */
  --accent:#3a7afe;      /* 统一强调色 */
  --gold:#d9a441;        /* 品牌金 */
  --radius:12px;
  --shadow:0 2px 10px rgba(20,30,60,.06);
}

*{-webkit-tap-highlight-color:transparent;}

html,body{
  background:var(--bg)!important;
  color:var(--ink);
  font-family:"PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-text-size-adjust:100%;
}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-thumb{background:#d5dae6;border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:#c2c9d9;}
::-webkit-scrollbar-track{background:transparent;}

/* ---------- 顶栏统一(白底 + 细分割线 + 轻阴影) ---------- */
.mui-bar-nav,.hd,.top-nav,.navbar,.page-title-bar{
  background:var(--surface)!important;
  box-shadow:0 1px 8px rgba(20,30,60,.08)!important;
  border-bottom:1px solid var(--line);
}
.mui-title,.hd h1,.nav-title,.page-title{
  color:var(--ink)!important;
  font-weight:600!important;
}
.hd p,.hd small,.nav-title small{
  color:var(--muted)!important;
  opacity:1!important;
}
.mui-icon-left-nav,.mui-action-back,.nav-back,.header-back{
  color:var(--ink2)!important;
}

/* ---------- 卡片统一 ---------- */
.card,.item-card{
  background:var(--surface)!important;
  border:1px solid #eef1f6!important;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.card-title{color:var(--ink)!important;}
.card-note,.card-head small{color:var(--muted)!important;}

/* ---------- 表格统一 ---------- */
.tbl th{
  background:#f5f7fa!important;
  color:#6b7280!important;
  border-bottom:1px solid var(--line)!important;
}
.tbl td{border-bottom:1px solid #f2f4f8!important;}

/* ---------- 强调色统一(原蓝/紫混用 → 统一蓝) ---------- */
.seg button.on,
.filt button.on,
.calc button{
  background:var(--accent)!important;
  border-color:var(--accent)!important;
  color:#fff!important;
}
.st-term,.grp{color:var(--accent)!important;}
.grp{background:#eef3ff!important;}

/* ---------- 顶部快捷跳转 chips ---------- */
.chip{
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  color:var(--ink2)!important;
  border-radius:16px;
  box-shadow:0 1px 4px rgba(20,30,60,.04);
}

/* ---------- 通用文字 ---------- */
.status{color:var(--muted)!important;}
.mile-hint,.sw-legend,.stat{color:#9aa1b3!important;}
a{color:var(--accent);}

/* ============================================================
   顶栏规格统一:44px 高 · 白底 · 标题 16px 居中加粗深色
   ============================================================ */
.mui-bar-nav,.top-nav,.hd,.navbar{
  height:44px!important;
  padding-top:0!important;
  padding-bottom:0!important;
  display:flex!important;
  align-items:center;
  justify-content:center;
}
.mui-title,.hd h1,.nav-title,.page-title,.top-nav .nav-title{
  font-size:16px!important;
  font-weight:600!important;
  letter-spacing:1px;
}
/* 搜索/筛选条跟随 44px 顶栏 */
.bar{top:44px!important;}
/* 高栏里的副标题收起,保持全站一致 */
.hd p,.hd small{display:none!important;}

/* ---------- 可复用顶栏组件(无顶栏页面用) ---------- */
.page-bar{
  position:relative;z-index:10;height:44px;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 8px rgba(20,30,60,.08);
  display:flex;align-items:center;justify-content:center;
}
.page-bar h1{font-size:16px;font-weight:600;letter-spacing:1px;color:var(--ink);}
.page-bar .back{
  position:absolute;left:0;top:0;height:44px;
  display:flex;align-items:center;
  color:var(--ink2);font-size:15px;text-decoration:none;
}
.page-bar .back:active{opacity:.6;}

/* ============================================================
   返回按钮统一 —— 参考「符文攻略」
   图标字形 \e471(mui-icon-back) · 绝对定位左上 · 44px 高
   左右内边距 12px · 层级 99 · 深灰箭头
   ============================================================ */
.mui-action-back,
.back-btn,
.nav-back,
.back-arrow,
.page-bar .back{
  position:absolute!important;
  left:0!important;
  top:0!important;
  height:44px!important;
  line-height:44px!important;
  padding:0 12px!important;
  margin:0!important;
  z-index:99!important;
  font-size:22px!important;
  font-weight:400!important;
  color:var(--ink2)!important;
  background:none!important;
  border:none!important;
  box-shadow:none!important;
  text-align:left!important;
  text-decoration:none!important;
  cursor:pointer;
  display:block!important;
}
.mui-action-back:active,
.back-btn:active,
.nav-back:active,
.back-arrow:active,
.page-bar .back:active{opacity:.55;}
/* 纯符号返回键(不依赖图标字体) */
.mui-action-back,.back-btn,.nav-back,.back-arrow,.page-bar .back{
  font-family:inherit!important;
  line-height:44px!important;
  padding-left:14px!important;
}


/* ============================================================
   像素风改造(全站)—— 硬边框 · 硬阴影 · 复古米黄底 · 像素渲染
   ============================================================ */
:root{
  --radius:3px;
  --shadow:5px 5px 0 rgba(47,51,70,.16);
  --line:#2f3346;
}
html,body{
  background:#f3ece0!important;
  background-image:
    linear-gradient(rgba(47,51,70,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47,51,70,.035) 1px, transparent 1px)!important;
  background-size:16px 16px!important;
}
/* 图片一律像素化渲染 */
img{ image-rendering:pixelated; image-rendering:-moz-crisp-edges; }
/* 顶栏:硬底线 */
.mui-bar-nav,.hd,.top-nav,.page-bar,.navbar,.page-title-bar{
  border-bottom:3px solid #2f3346!important;
  box-shadow:none!important;
  background:#fffdf7!important;
}
/* 卡片:硬边 + 硬阴影(无圆角模糊) */
.card,.item-card,a.item{
  border:3px solid #2f3346!important;
  border-radius:3px!important;
  box-shadow:5px 5px 0 rgba(47,51,70,.18)!important;
  background:#fffdf7!important;
}
.card:active,a.item:active{ transform:translate(2px,2px)!important; box-shadow:3px 3px 0 rgba(47,51,70,.18)!important; }
/* 表格/分组保持硬朗 */
.tbl th{ background:#e9dfcb!important; color:#4a3f2b!important; border-bottom:2px solid #2f3346!important; }
.grp{ border:2px solid #2f3346!important; border-radius:3px!important; background:#fdf1d7!important; }
.chip{ border:2px solid #2f3346!important; border-radius:3px!important; background:#fffdf7!important; box-shadow:3px 3px 0 rgba(47,51,70,.14)!important; }

/* ---- 全站右下角署名 ---- */
@font-face{
  font-family: 'XZKai';
  src: url('../font/kai-subset.woff2') format('woff2');
  font-display: swap;
}
.site-foot{
  position: fixed; right: 10px; bottom: 8px;
  font-size: 11px; line-height: 1; letter-spacing: .5px;
  color: #8d95a6; z-index: 40; pointer-events: none;
  text-shadow: 0 1px 0 rgba(255,255,255,.8);
  font-family: 'DFKai-SB', 'BiauKai', 'KaiTi', 'STKaiti', 'Kaiti SC',
               '楷体', 'XZKai', serif;
}