/* ============================================================
   金缆软件 · 电缆工程师工具箱 共享样式
   继承主站视觉：白底导航、品牌蓝 #15467b、深海军蓝页脚
   ============================================================ */
:root{
  --t-blue:#15467b;
  --t-blue-deep:#0d3560;
  --t-ink:#0f2d4e;
  --t-body:#2b3a4e;
  --t-sub:#64748b;
  --t-faint:#64748b;
  --t-line:#e2e8f0;
  --t-line-soft:#edf1f6;
  --t-bg:#f4f6f9;
  --t-card:#ffffff;
  --t-copper:#b45309;
  --t-copper-bg:#fdf3e7;
  --t-good:#157347;
  --t-radius:14px;
  --t-shadow:0 1px 2px rgba(15,23,42,.04),0 14px 34px -18px rgba(15,23,42,.14);
  --t-ease:cubic-bezier(.22,.61,.36,1);
}
/* 原生 details 折叠标记统一隐藏（各引擎） */
summary{list-style:none;display:block;position:relative;cursor:pointer;padding:10px 34px 10px 12px;transition:color .18s var(--t-ease)}
summary::-webkit-details-marker{display:none}
summary::marker{content:''}
summary:hover{color:var(--t-blue)}
summary::after{content:'';position:absolute;right:14px;top:50%;width:8px;height:8px;border-right:1.7px solid var(--t-sub);border-bottom:1.7px solid var(--t-sub);transform:translateY(-70%) rotate(45deg);transition:transform .2s var(--t-ease)}
details[open]>summary::after{transform:translateY(-30%) rotate(225deg)}
/* ---------- 基础 ---------- */
html{scroll-behavior:smooth}
body{
  font-family:-apple-system,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
  background:var(--t-bg);color:var(--t-body);
  font-size:15.5px;line-height:1.75;padding:0;margin:0;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
::selection{background:#cfe1f2;color:var(--t-ink)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{
  outline:2px solid var(--t-blue);outline-offset:2px;border-radius:4px}
img{max-width:100%}
/* ---------- 页眉 ---------- */
.t-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);
  backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--t-line);
}
.t-header-in{
  max-width:1120px;margin:0 auto;padding:10px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.t-brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-height:36px}
.t-brand img{height:36px;width:auto;display:block}
.t-brand-sep{width:1px;height:22px;background:var(--t-line);flex:none}
.t-brand-sub{font-size:15px;font-weight:600;color:var(--t-ink);letter-spacing:.05em;white-space:nowrap}
.t-nav{display:flex;align-items:center;gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.t-nav::-webkit-scrollbar{display:none}
.t-nav a{
  flex:none;text-decoration:none;color:#4a5b70;font-size:14px;
  padding:7px 13px;border-radius:8px;line-height:1.5;
  transition:color .18s var(--t-ease),background-color .18s var(--t-ease);
}
.t-nav a:hover{color:var(--t-blue);background:#f0f5fa}
.t-nav a.on{color:var(--t-blue);background:#e7eff8;font-weight:600}
/* ---------- 面包屑 ---------- */
.t-crumb{max-width:860px;margin:0 auto;padding:14px 20px 0;font-size:13px;color:var(--t-faint)}
.t-crumb a{color:var(--t-sub);text-decoration:none}
.t-crumb a:hover{color:var(--t-blue);text-decoration:underline;text-underline-offset:3px}
.t-crumb .sep{margin:0 7px;color:#94a3b8}
.t-crumb b{color:var(--t-ink);font-weight:500}
/* ---------- 内容卡片 ---------- */
.wrap{
  max-width:860px;margin:18px auto 0;background:var(--t-card);
  border:1px solid #e6ebf2;border-radius:var(--t-radius);
  box-shadow:var(--t-shadow);padding:32px;
}
h1{
  font-size:26px;line-height:1.4;color:var(--t-ink);
  border-bottom:1px solid var(--t-line);padding-bottom:14px;margin-bottom:14px;
}
h2{font-size:19px;line-height:1.5;color:var(--t-ink);font-weight:650;margin:26px 0 10px}
h3{color:var(--t-ink)}
p{margin:8px 0}
a{color:var(--t-blue)}
strong,b{color:var(--t-ink)}
/* ---------- 表单控件 ---------- */
input,select,textarea{
  font-family:inherit;font-size:16px;color:var(--t-body);
  background:#fff;border:1px solid #c9d4e0;border-radius:8px;
  transition:border-color .18s var(--t-ease),box-shadow .18s var(--t-ease);
}
input:hover,select:hover,textarea:hover{border-color:#a9bacd}
input:focus,select:focus,textarea:focus{
  border-color:var(--t-blue);outline:none;
  box-shadow:0 0 0 3px rgba(21,70,123,.13);
}
button,.optbtn{
  font-family:inherit;background:var(--t-blue);color:#fff;border:none;border-radius:8px;
  padding:9px 24px;font-size:15px;font-weight:600;cursor:pointer;
  transition:background-color .18s var(--t-ease),transform .18s var(--t-ease);
}
button:hover{background:var(--t-blue-deep)}
button:active{transform:translateY(1px)}
.btn2{background:#eef2f6;color:var(--t-body);border:1px solid #cbd5e1}
.btn2:hover{background:#e2e9f0;color:var(--t-ink)}
/* ---------- 数据表 ---------- */
table{border-collapse:collapse;width:100%;margin:10px 0;font-size:14px}
th,td{border:1px solid #dbe3ec;padding:8px 10px;text-align:left}
th{background:#f0f4f9;color:var(--t-ink)}
td{font-variant-numeric:tabular-nums}
tr:nth-child(even) td{background:#fafbfd}
/* ---------- 页脚 ---------- */
.t-footer{
  margin-top:44px;color:#94a3b8;font-size:13px;
  background:linear-gradient(180deg,#0b1220 0%,#0f172a 70%,#0e1b30 100%);
}
.t-footer-in{
  max-width:1120px;margin:0 auto;padding:36px 20px 26px;
  display:grid;grid-template-columns:2.2fr 1fr 1.6fr;gap:36px;
}
.t-f-brand .t-f-name{color:#f1f5f9;font-size:15px;font-weight:600;margin-bottom:8px}
.t-f-brand p{margin:0 0 10px;line-height:1.8}
.t-f-col h3{
  color:#f1f5f9;font-size:13px;font-weight:600;letter-spacing:.08em;
  margin:0 0 12px;
}
.t-f-col ul{list-style:none;margin:0;padding:0}
.t-f-col li{margin:0 0 7px}
.t-f-brand a{color:#aebbcc;text-decoration:none;transition:color .18s var(--t-ease)}
.t-f-brand a:hover{color:#6ee7b7}
.t-f-col a{color:#94a3b8;text-decoration:none;transition:color .18s var(--t-ease)}
.t-f-col a:hover{color:#6ee7b7}
.t-f-tools ul{columns:2;column-gap:22px}
.t-footer-bottom{border-top:1px solid rgba(255,255,255,.08)}
.t-footer-bottom-in{
  max-width:1120px;margin:0 auto;padding:14px 20px;
  display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;
  font-size:12.5px;color:#7c8aa0;
}
.t-footer-bottom a{color:#94a3b8;text-decoration:none}
.t-footer-bottom a:hover{color:#f1f5f9}
/* ---------- 响应式 ---------- */
@media (max-width:860px){
  .t-header-in{padding:8px 14px}
  .t-brand img{height:30px}
  .t-brand-sub{display:none}
  .t-brand-sep{display:none}
  .t-nav{width:100%;order:3;padding-bottom:2px}
  .t-nav a{padding:6px 11px;font-size:13.5px}
  .t-crumb{padding:10px 16px 0}
  .wrap{margin:12px 12px 0;padding:22px 18px;border-radius:12px}
  h1{font-size:24px}
  h2{font-size:18px}
  .t-footer-in{grid-template-columns:1fr;gap:26px;padding:28px 16px 22px}
  .t-footer-bottom-in{padding:12px 16px;flex-direction:column}
}
@media (max-width:640px){
  .wrap table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;
    -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%);
    mask-image:linear-gradient(90deg,#000 88%,transparent 100%)}
  /* 滚动到底时取消右缘渐隐（支持的浏览器渐进增强） */
  @supports (animation-timeline: scroll()){
    .wrap table{animation:t-unfade linear both;animation-timeline:scroll(self inline)}
    @keyframes t-unfade{
      from{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,#000 88%,transparent 100%)}
      to{-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 100%);mask-image:linear-gradient(90deg,#000 0%,#000 100%)}
    }
  }
  .wrap th,.wrap td{white-space:nowrap}
}
/* ---------- 打印：只留正文 ---------- */
@media print{
  .t-header,.t-crumb,.t-footer,.no-print{display:none!important}
  body{background:#fff;padding:0}
  .wrap{max-width:100%;border:none;box-shadow:none;border-radius:0;padding:0;margin:0}
}
