/* ====== 工具页独立样式 v7.0 —— 适配7套模板 ====== */
:root{
  --tool-radius:12px;
  --tool-shadow:0 8px 24px rgba(0,0,0,0.08);
}
.tool-page{padding-top:0;}
/* 工具页Hero */
.tool-hero{padding:48px 0 32px;}
.tool-hero h1{font-size:36px;font-weight:800;line-height:1.3;margin-bottom:12px;letter-spacing:-0.02em;}
.tool-hero p{font-size:16px;color:var(--c-text-mute);line-height:1.7;max-width:780px;}
.tool-breadcrumb{font-size:14px;color:var(--c-text-light);padding:12px 0;margin-bottom:8px;}
.tool-breadcrumb a{color:var(--c-text-mute);}
.tool-breadcrumb a:hover{color:var(--c-primary);}
.tool-breadcrumb span{margin:0 8px;color:var(--c-text-light);}
/* 工具元信息 */
.tool-meta{display:flex;flex-wrap:wrap;gap:20px;padding:14px 20px;background:var(--c-bg-alt);border-radius:var(--tool-radius);margin-bottom:32px;font-size:14px;color:var(--c-text-mute);border-left:4px solid var(--c-primary);}
.tool-meta-item{display:inline-flex;align-items:center;gap:6px;}
.tool-meta-item time{color:var(--c-text);font-variant-numeric:tabular-nums;}
/* 工具主体布局：左表单 + 右结果 */
.tool-main{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-bottom:40px;}
.tool-section{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:32px;box-shadow:var(--tool-shadow);}
.tool-section h2{font-size:20px;font-weight:700;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--c-border);display:flex;align-items:center;gap:10px;}
.tool-section h2 .sec-icon{font-size:24px;}
/* 表单 */
.tool-form .form-row{margin-bottom:20px;}
.tool-form label{display:block;font-size:14px;font-weight:600;margin-bottom:8px;color:var(--c-text);}
.tool-form label .unit{font-weight:400;color:var(--c-text-mute);margin-left:6px;font-size:13px;}
.tool-form input[type="number"],.tool-form input[type="text"],.tool-form select,.tool-form textarea{width:100%;padding:12px 16px;border:1px solid var(--c-border);border-radius:var(--radius);font-size:15px;font-family:inherit;background:var(--c-bg);color:var(--c-text);transition:all .2s;outline:none;}
.tool-form input[type="number"]:focus,.tool-form input[type="text"]:focus,.tool-form select:focus,.tool-form textarea:focus{border-color:var(--c-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-primary) 15%,transparent);}
.tool-form input[type="range"]{width:100%;margin:8px 0;accent-color:var(--c-primary);}
.tool-form .form-row-range{display:flex;gap:12px;align-items:center;}
.tool-form .range-val{min-width:80px;text-align:right;font-weight:700;color:var(--c-primary);font-variant-numeric:tabular-nums;font-size:18px;}
.tool-form .form-hint{font-size:13px;color:var(--c-text-light);margin-top:6px;}
.tool-form .form-radios{display:flex;flex-wrap:wrap;gap:10px;}
.tool-form .form-radios label{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid var(--c-border);border-radius:var(--radius);cursor:pointer;font-weight:400;margin:0;transition:all .2s;}
.tool-form .form-radios label:hover{border-color:var(--c-primary-light);}
.tool-form .form-radios input[type="radio"]{accent-color:var(--c-primary);margin:0;}
.tool-form .form-radios input[type="radio"]:checked + span{color:var(--c-primary);font-weight:600;}
.tool-form .form-radios label:has(input:checked){background:color-mix(in srgb,var(--c-primary) 8%,transparent);border-color:var(--c-primary);}
.tool-form .btn-calc{width:100%;padding:14px;font-size:16px;font-weight:700;margin-top:8px;justify-content:center;border-radius:var(--radius);}
/* 结果区 */
.tool-result{display:flex;flex-direction:column;}
.result-kpi-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:24px;}
.result-kpi{background:linear-gradient(135deg,color-mix(in srgb,var(--c-primary) 10%,var(--c-bg-alt)),var(--c-bg-alt));border-radius:var(--tool-radius);padding:20px;text-align:center;border:1px solid color-mix(in srgb,var(--c-primary) 20%,var(--c-border));}
.result-kpi .kpi-label{font-size:13px;color:var(--c-text-mute);margin-bottom:8px;}
.result-kpi .kpi-value{font-size:28px;font-weight:800;color:var(--c-primary);font-variant-numeric:tabular-nums;line-height:1.2;}
.result-kpi .kpi-unit{font-size:14px;color:var(--c-text-mute);font-weight:400;margin-left:4px;}
.result-chart{margin-bottom:20px;border-radius:var(--radius);overflow:hidden;background:var(--c-bg-alt);padding:20px;}
.result-chart svg{width:100%;height:auto;display:block;}
.result-table-wrap{overflow-x:auto;border-radius:var(--radius);border:1px solid var(--c-border);margin-bottom:20px;}
.result-table{width:100%;border-collapse:collapse;font-size:14px;}
.result-table th,.result-table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--c-border);}
.result-table th{background:var(--c-bg-alt);font-weight:700;color:var(--c-text);}
.result-table tr:last-child td{border-bottom:none;}
.result-table tr.highlight td{background:color-mix(in srgb,var(--c-primary) 8%,transparent);font-weight:600;}
.result-note{padding:14px 18px;border-radius:var(--radius);font-size:14px;line-height:1.7;}
.result-note.note-info{background:color-mix(in srgb,var(--c-primary) 8%,var(--c-bg-alt));border-left:3px solid var(--c-primary);color:var(--c-text-mute);}
.result-note.note-warn{background:#fef3c7;border-left:3px solid #f59e0b;color:#92400e;}
.result-progress{margin:16px 0;}
.progress-bar{height:10px;background:var(--c-bg-alt);border-radius:999px;overflow:hidden;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--c-primary),var(--c-primary-light));border-radius:999px;transition:width .4s ease;}
.progress-label{display:flex;justify-content:space-between;font-size:13px;color:var(--c-text-mute);margin-top:6px;}
/* 工具说明区 */
.tool-desc{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:32px;margin-bottom:32px;}
.tool-desc h2{font-size:22px;font-weight:700;margin-bottom:16px;}
.tool-desc h3{font-size:17px;font-weight:700;margin:20px 0 10px;}
.tool-desc p{font-size:15px;color:var(--c-text-mute);line-height:1.8;margin-bottom:12px;}
.tool-desc ul{margin:0 0 12px;padding-left:0;}
.tool-desc ul li{position:relative;padding:6px 0 6px 22px;font-size:15px;color:var(--c-text-mute);}
.tool-desc ul li::before{content:'';position:absolute;left:6px;top:14px;width:6px;height:6px;background:var(--c-primary);border-radius:50%;}
.tool-desc code{background:var(--c-code-bg);padding:2px 8px;border-radius:4px;font-size:0.9em;color:var(--c-primary-dark);}
/* 相关工具 */
.related-tools{margin-top:48px;}
.related-tools h2{font-size:24px;font-weight:700;margin-bottom:20px;}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;}
.related-card{display:block;padding:20px;background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--radius-lg);transition:all .25s;text-decoration:none;color:var(--c-text);}
.related-card:hover{transform:translateY(-2px);box-shadow:var(--tool-shadow);border-color:var(--c-primary-light);color:var(--c-text);}
.related-card .rc-icon{font-size:28px;margin-bottom:8px;}
.related-card h3{font-size:16px;font-weight:700;margin-bottom:6px;}
.related-card p{font-size:13px;color:var(--c-text-mute);margin:0;line-height:1.6;}
/* 工具返回正文链接 */
.tool-back{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;background:var(--c-bg-alt);color:var(--c-text);border-radius:var(--radius);font-size:14px;font-weight:500;margin-top:24px;transition:all .2s;border:1px solid var(--c-border);}
.tool-back:hover{background:var(--c-primary);color:#fff;border-color:var(--c-primary);}
/* 工具末端免责声明 */
.tool-end{margin-top:40px;padding:20px 24px;background:var(--c-bg-alt);border-radius:var(--radius-lg);border-left:4px solid var(--c-primary);font-size:14px;color:var(--c-text-mute);line-height:1.8;}
.tool-end time{color:var(--c-primary);font-weight:600;font-variant-numeric:tabular-nums;}
/* ====== 各模板工具页适配 ====== */
/* 黑金 dark-gold */
body[data-tpl="dark-gold"] .tool-section{background:#181820;border-color:#2a2a36;}
body[data-tpl="dark-gold"] .tool-form input,.body[data-tpl="dark-gold"] .tool-form select{background:#0f0f14;border-color:#2a2a36;color:#e8e4d9;}
body[data-tpl="dark-gold"] .result-kpi{background:rgba(212,175,55,0.08);border-color:rgba(212,175,55,0.2);}
body[data-tpl="dark-gold"] .result-kpi .kpi-value{color:#d4af37;}
body[data-tpl="dark-gold"] .result-table th{background:#25252f;color:#f5ecd0;}
body[data-tpl="dark-gold"] .result-table td{border-color:#2a2a36;color:#d8d2c3;}
body[data-tpl="dark-gold"] .result-chart{background:#25252f;}
body[data-tpl="dark-gold"] .tool-desc{background:#181820;border-color:#2a2a36;}
body[data-tpl="dark-gold"] .tool-desc p,.body[data-tpl="dark-gold"] .tool-desc ul li{color:#9a9588;}
body[data-tpl="dark-gold"] .related-card{background:#181820;border-color:#2a2a36;}
body[data-tpl="dark-gold"] .related-card:hover{border-color:#d4af37;}
body[data-tpl="dark-gold"] .related-card h3{color:#f5ecd0;}
body[data-tpl="dark-gold"] .related-card p{color:#9a9588;}
body[data-tpl="dark-gold"] .tool-back{background:#25252f;border-color:#2a2a36;color:#d8d2c3;}
body[data-tpl="dark-gold"] .tool-end{background:rgba(212,175,55,0.06);}
/* 蓝白 blue-white */
body[data-tpl="blue-white"] .tool-section{box-shadow:0 4px 16px rgba(37,99,235,0.08);}
body[data-tpl="blue-white"] .result-kpi{background:#eff6ff;border-color:rgba(37,99,235,0.2);}
/* 极简蓝 simple-blue */
body[data-tpl="simple-blue"]{--tool-radius:6px;--radius-lg:8px;}
body[data-tpl="simple-blue"] .tool-section{box-shadow:0 1px 3px rgba(0,0,0,0.04);}
body[data-tpl="simple-blue"] .result-kpi{background:#f0f9ff;border-color:#bae6fd;}
/* 中国红 china-red */
body[data-tpl="china-red"] .tool-section{box-shadow:0 4px 12px rgba(200,22,29,0.08);border-radius:8px;}
body[data-tpl="china-red"] .tool-meta{background:#fdf2f2;border-left-color:#c8161d;}
body[data-tpl="china-red"] .result-kpi{background:linear-gradient(135deg,#fff5f5,#fdf2f2);border-color:#ead4d4;}
body[data-tpl="china-red"] .result-kpi .kpi-value{color:#c8161d;}
body[data-tpl="china-red"] .btn-calc{background:linear-gradient(135deg,#c8161d,#e63946);border-radius:4px;}
body[data-tpl="china-red"] .tool-end{background:#fdf2f2;border-left-color:#c8161d;}
/* 黑白 mono */
body[data-tpl="mono"]{--tool-radius:14px;--radius-lg:16px;}
body[data-tpl="mono"] .tool-main{gap:24px;}
body[data-tpl="mono"] .tool-section{background:#fff;border-color:#e5e5e5;box-shadow:0 2px 8px rgba(0,0,0,0.04);}
body[data-tpl="mono"] .tool-form input,.body[data-tpl="mono"] .tool-form select{background:#fafafa;border-color:#e5e5e5;border-radius:10px;}
body[data-tpl="mono"] .result-kpi{background:#fff;border:1px solid #e5e5e5;}
body[data-tpl="mono"] .result-kpi .kpi-value{color:#111;}
body[data-tpl="mono"] .btn-calc{background:#111;border-radius:999px;}
body[data-tpl="mono"] .tool-end{background:#fff;border:1px solid #e5e5e5;border-left:none;border-radius:14px;}
/* 百科 baike */
body[data-tpl="baike"]{--tool-radius:2px;--radius-lg:2px;}
body[data-tpl="baike"] .tool-hero h1{font-size:28px;border-bottom:1px solid #e5e5e5;padding-bottom:10px;}
body[data-tpl="baike"] .tool-main{display:block;}
body[data-tpl="baike"] .tool-section{border:1px solid #a2a9b3;background:#fff;box-shadow:none;padding:20px;border-radius:2px;margin-bottom:20px;}
body[data-tpl="baike"] .tool-section h2{font-size:18px;font-weight:700;border-bottom:1px solid #a2a9b3;padding-bottom:8px;margin-bottom:16px;}
body[data-tpl="baike"] .tool-meta{border-left:3px solid #1a56ab;border-radius:0;background:#f5f7fa;}
body[data-tpl="baike"] .tool-form input,.body[data-tpl="baike"] .tool-form select{border:1px solid #a2a9b3;border-radius:2px;background:#fff;}
body[data-tpl="baike"] .result-kpi-grid{grid-template-columns:repeat(4,1fr);gap:8px;}
body[data-tpl="baike"] .result-kpi{border:1px solid #a2a9b3;background:#f8f9fa;border-radius:0;padding:12px 8px;}
body[data-tpl="baike"] .result-kpi .kpi-label{font-size:12px;}
body[data-tpl="baike"] .result-kpi .kpi-value{font-size:20px;color:#1a56ab;}
body[data-tpl="baike"] .result-table th,.body[data-tpl="baike"] .result-table td{border:1px solid #a2a9b3;}
body[data-tpl="baike"] .result-table th{background:#eaecf0;}
body[data-tpl="baike"] .result-chart{border:1px solid #a2a9b3;background:#fff;}
body[data-tpl="baike"] .btn-calc{background:#1a56ab;border-radius:2px;}
body[data-tpl="baike"] .tool-desc{border:1px solid #a2a9b3;border-radius:2px;}
body[data-tpl="baike"] .related-card{border:1px solid #a2a9b3;border-radius:2px;background:#f8f9fa;}
body[data-tpl="baike"] .related-card:hover{border-color:#1a56ab;}
body[data-tpl="baike"] .tool-back{background:#f5f7fa;border:1px solid #a2a9b3;border-radius:2px;color:#555;}
body[data-tpl="baike"] .tool-end{border-left:3px solid #1a56ab;background:#f5f7fa;border-radius:0;}
/* 官方门户 official */
body[data-tpl="official"]{--tool-radius:12px;--radius-lg:16px;}
body[data-tpl="official"] .tool-section{border:none;box-shadow:0 8px 32px rgba(29,53,87,0.08);border-radius:16px;}
body[data-tpl="official"] .tool-meta{background:linear-gradient(135deg,#fff,#f8f9fa);border-left:4px solid #e63946;border-radius:12px;box-shadow:0 4px 12px rgba(29,53,87,0.06);}
body[data-tpl="official"] .result-kpi{background:linear-gradient(135deg,rgba(230,57,70,0.08),rgba(29,53,87,0.04));border:none;border-radius:12px;}
body[data-tpl="official"] .result-kpi .kpi-value{color:#e63946;}
body[data-tpl="official"] .btn-calc{background:linear-gradient(135deg,#e63946,#c1121f);border-radius:8px;box-shadow:0 4px 16px rgba(230,57,70,0.3);}
body[data-tpl="official"] .tool-end{background:linear-gradient(135deg,#1d3557,#457b9d);color:rgba(255,255,255,0.85);border-left:none;border-radius:12px;}
body[data-tpl="official"] .tool-end time{color:#f4a261;}
/* 响应式 */
@media(max-width:768px){
  .tool-main{grid-template-columns:1fr;gap:20px;}
  .tool-section{padding:20px;}
  .tool-hero{padding:32px 0 20px;}
  .tool-hero h1{font-size:26px;}
  .result-kpi-grid{grid-template-columns:1fr 1fr;gap:12px;}
  .result-kpi .kpi-value{font-size:22px;}
  .tool-desc{padding:20px;}
  .related-grid{grid-template-columns:1fr;}
  .tool-meta{padding:12px 16px;gap:10px;font-size:13px;flex-direction:column;}
}