/* ============================================================
   中乐设计系统 · 工具站共享层 (zl-design-system)
   注入：/opt/zl/website/  链接：/tools/zl-design-system.css
   作用：重定义各工具页既有 :root 变量 → iOS 系统蓝 + 苹果令牌，
        再叠加通用组件覆盖（按钮/输入/表格/卡片/标题）。
   设计铁律：表格完整网格边框、字号不偏小、禁 emoji、涨红跌绿。
   ============================================================ */
:root{
  /* 主色 → iOS 系统蓝 #0a84ff（覆盖 --brand/--primary/--navy/--blue） */
  --brand:#0a84ff;   --brand2:#4a9dff;
  --primary:#0a84ff; --primary-2:#4a9dff;
  --navy:#0a84ff;    --navy2:#4a9dff;
  --blue:#0a84ff;
  /* 背景 / 表面 */
  --bg:#f2f4f8;  --bg-0:#f2f4f8;  --bg-1:#ffffff;  --bg-2:#f8fafc;
  --card:#ffffff;
  /* 描边 */
  --line:rgba(15,23,42,.09);  --border:rgba(15,23,42,.09);
  /* 文字 */
  --text:#0b1220;  --txt:#0b1220;
  --text-dim:#475569;  --text-mut:#64748b;  --mut:#64748b;  --muted:#64748b;
  /* 语义色 */
  --green:#16a34a;  --red:#dc2626;  --amber:#b97409;
  /* 文档墨色（报告页保留） */
  --ink:#1a1a1a;
  /* 强调类别色（计算器分类标签，柔和化） */
  --cyan:#0aa2c0;  --pink:#d9598c;  --yellow:#e0a82e;  --purple:#7a5bc9;
  /* 圆角令牌 */
  --zl-r:12px;  --zl-r-lg:18px;  --zl-r-sm:10px;
  /* 柔影 */
  --zl-sh:0 1px 3px rgba(15,23,42,.06),0 10px 30px rgba(15,23,42,.07);
  --zl-sh-sm:0 1px 2px rgba(15,23,42,.06);
}

/* 字体渲染与基色 */
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif!important;
  font-size:15px; line-height:1.6; color:var(--text);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  background:var(--bg)!important;
}
/* 标题收敛字距，统一墨色 */
h1,h2,h3,h4,h5{ letter-spacing:-.012em; color:var(--text); }
h1{ font-weight:700; } h2,h3{ font-weight:650; }

/* 卡片 / 盒 / 面板：圆角 + 柔影 + 发丝边 */
.card,.box,.panel{
  background:var(--card)!important;
  border:1px solid var(--line)!important;
  border-radius:var(--zl-r-lg)!important;
  box-shadow:var(--zl-sh)!important;
}

/* 按钮：iOS 圆角 + 轻投影 + 平滑过渡 */
button,.btn,.btn-primary,input[type=button],input[type=submit],.lbtn{
  border-radius:var(--zl-r)!important;
  box-shadow:var(--zl-sh-sm)!important;
  font-weight:600; letter-spacing:.01em;
  transition:transform .15s ease,filter .15s ease,box-shadow .15s ease;
}
button:hover,.btn:hover,.btn-primary:hover{ filter:brightness(1.05); }
button:active,.btn:active{ transform:translateY(1px); }

/* 输入框：圆角 + 聚焦蓝环 */
input,select,textarea{
  border:1px solid var(--line);
  border-radius:var(--zl-r-sm)!important;
  background:#fff; font-size:14px;
  transition:border-color .15s ease,box-shadow .15s ease;
}
input:focus,select:focus,textarea:focus{
  outline:none; border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(10,132,255,.16);
}

/* 表格：完整网格边框（设计系统铁律） */
table{ border-collapse:collapse; width:100%; }
th,td{ border:1px solid var(--line)!important; padding:9px 12px; }
th{ background:#f8fafc; font-weight:600; color:var(--text); }
tbody tr:nth-child(even) td{ background:#fafcff; }

/* 链接 */
a{ color:var(--brand); text-decoration:none; }
a:hover{ text-decoration:underline; }

/* 徽标 / 标签：胶囊化圆角 */
.tag,.badge,.chip{ border-radius:999px!important; }