/* ============================================================
   行恒简安 · 统一主题层（tools.xhja.cn 及下属工具共用）
   —— 设计语言：工程计算软件。白底中性灰 / 深蓝灰主色 / 1px 细边框 / 4~6px 小圆角
      无渐变、无毛玻璃、无胶囊、无装饰性阴影堆叠。
      设计变量与 calcwall V3.0（index.src.html）、calcwall/doc.css 同源，改色请三处一起改。
   —— 本文件负责：页头 / 页脚 / 悬浮控件 / 通用组件皮肤 / 工具首页
   ============================================================ */

:root {
    /* 底色 */
    --xh-bg-0: #eef1f5;
    --xh-bg-1: #f6f8fa;
    --xh-bg-2: #e9edf2;
    --xh-bg-3: #dfe5ec;
    /* 面板 */
    --xh-panel: #ffffff;
    --xh-panel-strong: #ffffff;
    /* 线 */
    --xh-border: #dde3ea;
    --xh-border-strong: #b9d3e4;
    /* 文字 */
    --xh-text: #17212b;
    --xh-text-2: #3b4a5b;
    --xh-text-3: #63758a;
    /* 主色（工程蓝） */
    --xh-primary: #1b5e8c;
    --xh-primary-light: #2a7cb4;
    --xh-primary-dark: #14496d;
    --xh-accent: #0f766e;
    /* 语义色 */
    --xh-success: #177245;
    --xh-danger: #b42318;
    --xh-warning: #8f4f06;
    /* 阴影：只用一档极轻的，靠边框分层 */
    --xh-shadow: 0 1px 2px rgba(20, 32, 48, .05);
    --xh-shadow-md: 0 2px 8px rgba(20, 32, 48, .09);
    --xh-shadow-glow: none;
    /* 圆角 */
    --xh-r-sm: 4px;
    --xh-r-md: 6px;
    --xh-r-lg: 8px;
    --xh-header-h: 64px;
    --xh-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* ============================================================
   1. 页面基底：纯色中性灰，不铺光晕
   ============================================================ */
body {
    margin: 0;
    background: var(--xh-bg-0) !important;
    background-image: none !important;
    font-family: var(--xh-font);
    color: var(--xh-text);
    -webkit-font-smoothing: antialiased;
}
body.dark {
    --xh-bg-0: #0f151c;
    --xh-bg-1: #161e27;
    --xh-bg-2: #1a232d;
    --xh-bg-3: #1f2933;
    --xh-panel: #161e27;
    --xh-panel-strong: #161e27;
    --xh-border: #2b3743;
    --xh-border-strong: #2d4a61;
    --xh-text: #e3ebf2;
    --xh-text-2: #bfccd9;
    --xh-text-3: #91a1b2;
    --xh-primary: #5aa6d8;
    --xh-primary-light: #7bbce8;
    --xh-primary-dark: #8ac4ea;
    --xh-accent: #4fb3a6;
    --xh-success: #4fbc86;
    --xh-danger: #ef8b80;
    --xh-warning: #e0a45c;
    --xh-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    --xh-shadow-md: 0 2px 10px rgba(0, 0, 0, .38);
    background: var(--xh-bg-0) !important;
    background-image: none !important;
}

/* 点阵背景 = 营销页语言，工具站不用 */
#xh-canvas { display: none !important; }

/* 工具页原顶栏统一让位（内容不丢，只是不再显示） */
.xhja-topbar,
.site-banner {
    display: none !important;
}
/* 原为固定顶栏预留的顶部空白收回 */
.wrap {
    padding-top: 30px !important;
}

/* ============================================================
   2. 统一顶栏：实心白条 + 1px 下边框
   ============================================================ */
.xh-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: var(--xh-panel);
    border-bottom: 1px solid var(--xh-border);
}
.xh-header-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
    height: var(--xh-header-h);
    display: flex;
    align-items: center;
    gap: 18px;
}
.xh-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    text-decoration: none;
    color: inherit;
}
.xh-brand-logo {
    width: 32px;
    height: 32px;
    object-fit: contain;
}
.xh-brand-text { display: flex; flex-direction: column; line-height: 1.25; }
.xh-brand-name {
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: .8px;
    color: var(--xh-text);
}
.xh-brand-slogan {
    font-size: 10px;
    color: var(--xh-text-3);
    letter-spacing: 1.2px;
}
.xh-nav { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.xh-nav a {
    padding: 6px 10px;
    border-radius: var(--xh-r-sm);
    font-size: 12.5px;
    font-weight: 500;
    color: var(--xh-text-2);
    white-space: nowrap;
    text-decoration: none;
    transition: color .14s, background .14s;
}
.xh-nav a:hover {
    color: var(--xh-primary);
    background: var(--xh-bg-2);
    text-decoration: none;
}
.xh-nav a.cur {
    color: var(--xh-primary);
    font-weight: 650;
    background: #eaf2f8;
}
body.dark .xh-nav a.cur { background: #1a2b39; }

.xh-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.xh-clock {
    padding: 5px 9px;
    border-radius: var(--xh-r-sm);
    background: var(--xh-bg-1);
    border: 1px solid var(--xh-border);
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    color: var(--xh-text-2);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    line-height: 1.4;
}
.xh-icon-btn {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--xh-r-sm);
    background: var(--xh-panel);
    border: 1px solid var(--xh-border);
    color: var(--xh-text-2);
    font-size: 15px;
    cursor: pointer;
    transition: background .14s, border-color .14s, color .14s;
}
.xh-icon-btn:hover {
    background: var(--xh-bg-2);
    border-color: var(--xh-text-3);
    color: var(--xh-text);
    transform: none;
}

/* ============================================================
   3. 统一页脚（两行：品牌+站群导航 / 版权·邮箱·备案）
   ============================================================ */
.xh-footer {
    position: relative;
    z-index: 2;
    margin-top: 26px;
    border-top: 1px solid var(--xh-border);
    background: var(--xh-bg-1);
}
.xh-footer-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 13px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    text-align: center;
}
.xh-footer-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px 20px;
    width: 100%;
}
.xh-footer-brand { display: flex; align-items: center; justify-content: center; gap: 7px; }
@media (min-width: 861px) {
    .xh-footer-brand { padding-right: 16px; border-right: 1px solid var(--xh-border); }
}
.xh-footer-brand img { width: 20px; height: 20px; object-fit: contain; }
.xh-footer-name {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--xh-text);
    letter-spacing: .8px;
}
.xh-footer-slogan { font-size: 11px; color: var(--xh-text-3); letter-spacing: .6px; }
.xh-footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 16px;
    font-size: 12px;
    max-width: 100%;
}
.xh-footer-links a { color: var(--xh-text-2); text-decoration: none; transition: color .14s; }
.xh-footer-links a:hover { color: var(--xh-primary); text-decoration: none; }
.xh-footer-legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2px 12px;
    font-size: 11.5px;
    line-height: 1.6;
    color: var(--xh-text-3);
    max-width: 100%;
}
.xh-footer-legal .xh-footer-copy { font-size: 11.5px; color: var(--xh-text-3); }
.xh-footer-legal .xh-footer-copy a { color: var(--xh-primary); font-weight: 600; text-decoration: none; }
.xh-footer-legal .xh-footer-copy a:hover { text-decoration: underline; }
.xh-footer .xhja-mail { margin-top: 0; font-size: 11.5px; line-height: 1.6; color: var(--xh-text-3); }
.xh-footer .xhja-mail a { gap: 4px; color: var(--xh-primary); font-weight: 600; }
.xh-footer .xhja-icp { margin-top: 0; gap: 2px 8px; font-size: 11.5px; line-height: 1.6; color: var(--xh-text-3); }
.xh-footer .xhja-icp svg { width: 12px; height: 12px; }

/* ============================================================
   4. 悬浮控件
   ============================================================ */
.xh-float {
    position: fixed;
    right: 22px;
    width: 36px;
    height: 36px;
    border-radius: var(--xh-r-sm);
    background: var(--xh-panel);
    border: 1px solid var(--xh-border);
    color: var(--xh-text-2);
    font-size: 15px;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--xh-shadow);
    transition: background .14s, border-color .14s, color .14s, opacity .2s;
    cursor: pointer;
}

/* 页脚备案 / 邮箱链接：跟随变量走，深浅色都不用单独覆写 */
.xh-footer .xhja-mail a,
.xh-footer .xhja-icp a { color: var(--xh-text-2); text-decoration: none; }
.xh-footer .xhja-mail a:hover,
.xh-footer .xhja-icp a:hover { color: var(--xh-primary); }
.xh-footer .xhja-mail svg,
.xh-footer .xhja-icp svg { width: 12px; height: 12px; }
.xh-float:hover {
    background: var(--xh-bg-2);
    border-color: var(--xh-text-3);
    color: var(--xh-text);
    transform: none;
}
#xh-dark { bottom: 74px; }
#xh-top { bottom: 22px; opacity: 0; transform: translateY(8px); pointer-events: none; }
#xh-top.visible { opacity: 1; transform: translateY(0); pointer-events: auto; }

/* ============================================================
   5. 通用组件皮肤
   —— 工具页各自的类名在此统一换皮；用 !important 是因为各子页自带样式表
      常带更高特异性甚至 !important，且部分页面（sect）把 <style> 写在 theme.css 之后。
   ============================================================ */
.card,
.res-card,
.type-card,
.rfigbox,
.v-diag-box,
.sub-sec,
.tc-sec,
.panel {
    background: var(--xh-panel) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-md) !important;
    box-shadow: var(--xh-shadow) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* 标题字重与颜色 */
h1, h2, h3 { letter-spacing: .3px; }
.xh-scope h1, .xh-scope h2, .xh-scope h3 { color: var(--xh-text); }

/* 输入控件 */
input:not([type="radio"]):not([type="checkbox"]):not(.cell-input),
select,
textarea {
    border-radius: var(--xh-r-sm) !important;
    border: 1px solid var(--xh-border) !important;
    background: var(--xh-panel) !important;
    color: var(--xh-text) !important;
    transition: border-color .14s, box-shadow .14s;
    font-family: inherit;
    font-variant-numeric: tabular-nums;
}
input:not([type="radio"]):not([type="checkbox"]):not(.cell-input):focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: var(--xh-primary) !important;
    box-shadow: 0 0 0 3px rgba(27, 94, 140, .14) !important;
}

/* 主按钮：实心主色，不用渐变、不用胶囊 */
.btn-primary,
.calc-btn,
.pv-btn.xh-primary {
    background: var(--xh-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border: 1px solid var(--xh-primary) !important;
    border-radius: var(--xh-r-sm) !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}
.btn-primary:hover,
.calc-btn:hover {
    background: var(--xh-primary-dark) !important;
    border-color: var(--xh-primary-dark) !important;
    transform: none !important;
}

/* 次要按钮 */
.btn-ghost,
.dl-btn,
.io-btn {
    border-radius: var(--xh-r-sm) !important;
    border: 1px solid var(--xh-border) !important;
    background: var(--xh-panel) !important;
    color: var(--xh-text-2) !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    transition: background .14s, border-color .14s, color .14s;
}
.btn-ghost:hover,
.dl-btn:hover,
.io-btn:hover {
    color: var(--xh-text) !important;
    border-color: var(--xh-text-3) !important;
    background: var(--xh-bg-2) !important;
}

/* 表格 */
table,
.data-table,
.seg-tbl {
    border-collapse: collapse;
}
th {
    background: var(--xh-bg-2) !important;
    color: var(--xh-text-2) !important;
    font-weight: 650 !important;
}
td, th {
    border-color: var(--xh-border) !important;
}

/* 提示块 */
.note,
.hint,
.small-note,
.pane-hint,
.alert,
.sl-note {
    border-radius: var(--xh-r-sm) !important;
    border: 1px solid var(--xh-border) !important;
    background: var(--xh-bg-1) !important;
}

/* 标签页 / 分段控件：方角，选中用实心主色 */
.tab,
.step-tab,
.mode-tab,
.step,
.seg {
    border-radius: var(--xh-r-sm) !important;
    transition: background .14s, color .14s, border-color .14s;
}
.tab.active,
.step-tab.active,
.mode-tab.active,
.step.active {
    background: var(--xh-primary) !important;
    background-image: none !important;
    color: #fff !important;
    box-shadow: none !important;
}

/* 结果数字 */
.big-num,
.rv,
.num {
    color: var(--xh-primary-dark) !important;
    font-variant-numeric: tabular-nums;
}

/* ============================================================
   6. 工具首页
   ============================================================ */
.xh-main {
    position: relative;
    z-index: 1;
    max-width: 1320px;
    margin: 0 auto;
    padding: 30px 24px 0;
}
.xh-page-title {
    font-size: 22px;
    font-weight: 650;
    line-height: 1.35;
    letter-spacing: .3px;
    margin: 4px 0 6px;
    color: var(--xh-text);
}
.xh-page-sub {
    font-size: 13px;
    line-height: 1.75;
    color: var(--xh-text-3);
    max-width: 820px;
    margin: 0 0 16px;
}
body.dark .xh-page-title { color: var(--xh-text); }
body.dark .xh-page-sub { color: var(--xh-text-3); }
@media (max-width: 640px) {
    .xh-page-title { font-size: 19px; }
    .xh-page-sub { font-size: 12.5px; }
}

/* 搜索 / 过滤：普通输入框 + 主色按钮，不做胶囊 */
.xh-filter {
    max-width: 520px;
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 4px 4px 12px;
    border-radius: var(--xh-r-sm);
    background: var(--xh-panel);
    border: 1px solid var(--xh-border);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.xh-filter:focus-within { border-color: var(--xh-primary); }
.xh-filter-ic { display: flex; flex: 0 0 auto; color: var(--xh-text-3); }
.xh-filter-ic svg {
    width: 16px;
    height: 16px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
/* 输入框：全局 input 规则带 !important 且特异性 (0,3,1)，这里必须抬到 (0,4,1) */
.xh-filter input:not([type="radio"]):not([type="checkbox"]):not(.cell-input) {
    flex: 1;
    min-width: 0;
    padding: 7px 2px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    font-size: 13px;
    color: var(--xh-text) !important;
}
.xh-filter input::placeholder { color: var(--xh-text-3); }
.xh-filter button {
    flex: 0 0 auto;
    height: 32px;
    padding: 0 16px;
    border-radius: var(--xh-r-sm);
    border: 1px solid var(--xh-primary);
    background: var(--xh-primary);
    color: #fff;
    font-weight: 600;
    font-size: 12.5px;
    font-family: inherit;
    cursor: pointer;
    box-shadow: none;
}
.xh-filter button:hover { background: var(--xh-primary-dark); border-color: var(--xh-primary-dark); }

/* 首页分组标题（理论基础工具 / 结构设计工具 …）：占满整行、左侧一道主色细线 */
.xh-group-t {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 8px 2px -2px;
    font-size: 14px;
    font-weight: 650;
    letter-spacing: .3px;
    color: var(--xh-text-2);
}
.xh-group-t + .xh-card { margin-top: 0; }
.xh-group-t .bar {
    width: 3px;
    height: 14px;
    border-radius: 1px;
    background: var(--xh-primary);
    flex: 0 0 auto;
}

/* 工具卡片网格 */
.xh-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(262px, 1fr));
    gap: 14px;
    padding-bottom: 20px;
}
.xh-card {
    display: flex;
    flex-direction: column;
    padding: 14px;
    border-radius: var(--xh-r-md);
    background: var(--xh-panel);
    border: 1px solid var(--xh-border);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    text-decoration: none;
    color: inherit;
    transition: border-color .14s, background .14s;
}
.xh-card:hover {
    transform: none;
    background: var(--xh-bg-1);
    border-color: var(--xh-primary) !important;
    box-shadow: none;
    text-decoration: none;
    color: inherit;
}
.xh-card-ic {
    width: 34px;
    height: 34px;
    border-radius: var(--xh-r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    background: #eaf2f8;
    border: 1px solid var(--xh-border);
    color: var(--xh-primary);
    margin-bottom: 10px;
    box-shadow: none;
}
body.dark .xh-card-ic { background: #1a2b39; }
.xh-card-ic svg {
    width: 20px;
    height: 20px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.xh-card h3 {
    font-size: 14px;
    font-weight: 650;
    color: var(--xh-text);
    margin: 0 0 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.xh-card p {
    font-size: 12px;
    color: var(--xh-text-3);
    line-height: 1.65;
    margin: 0 0 12px;
    flex: 1;
}
.xh-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.xh-badge {
    font-size: 11px;
    padding: 1px 6px;
    border-radius: 3px;
    font-weight: 650;
    border: 1px solid;
    line-height: 1.5;
}
.xh-badge-on { background: #eef7f1; border-color: #b6dbc7; color: #177245; }
.xh-badge-debug { background: #fdf6ea; border-color: #ecd6b3; color: #8f4f06; }
.xh-badge-new { background: #eaf2f8; border-color: #b9d3e4; color: #14496d; }
.xh-badge-soon { background: #f1f4f8; border-color: #dde3ea; color: #63758a; }
body.dark .xh-badge-on { background: #152a20; border-color: #2b5641; color: #4fbc86; }
body.dark .xh-badge-debug { background: #2a2114; border-color: #57452a; color: #e0a45c; }
body.dark .xh-badge-new { background: #1a2b39; border-color: #2d4a61; color: #8ac4ea; }
body.dark .xh-badge-soon { background: #1f2933; border-color: #2b3743; color: #91a1b2; }
.xh-go { color: var(--xh-primary); font-size: 12px; font-weight: 600; }
.xh-soon { color: var(--xh-text-3); font-size: 12.5px; font-weight: 500; }
.xh-card.is-soon { cursor: default; }
.xh-card.is-soon:hover {
    background: var(--xh-panel);
    border-color: var(--xh-border) !important;
}
.xh-card.is-soon .xh-card-ic {
    background: var(--xh-bg-2);
    border-color: var(--xh-border);
    color: var(--xh-text-3);
    box-shadow: none;
}
.xh-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 40px 20px;
    color: var(--xh-text-3);
    font-size: 13px;
}

/* 首页历史组件（保留，统一为工程风） */
.xh-hero { text-align: left; padding: 6px 0 22px; }
.xh-tag {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    background: #eaf2f8;
    border: 1px solid var(--xh-border);
    color: var(--xh-primary-dark);
    font-size: 11.5px;
    font-weight: 650;
    letter-spacing: .6px;
    margin-bottom: 10px;
}
.xh-hero h1 {
    font-size: 24px;
    font-weight: 650;
    line-height: 1.35;
    margin: 0 0 8px;
    background: none;
    -webkit-text-fill-color: currentColor;
    color: var(--xh-text);
}
.xh-hero p {
    color: var(--xh-text-3);
    font-size: 13px;
    max-width: 760px;
    margin: 0;
    line-height: 1.75;
}
.xh-stats { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.xh-stat {
    min-width: 120px;
    padding: 10px 14px;
    border-radius: var(--xh-r-md);
    background: var(--xh-panel);
    border: 1px solid var(--xh-border);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.xh-stat b {
    display: block;
    font-size: 20px;
    font-weight: 650;
    color: var(--xh-primary);
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}
.xh-stat span { font-size: 12px; color: var(--xh-text-3); }

/* ============================================================
   7. 深色模式
   ============================================================ */
body.dark .xh-header {
    background: var(--xh-panel);
    border-bottom-color: var(--xh-border);
}
body.dark .xh-brand-name,
body.dark .xh-footer-name { color: var(--xh-text); }
body.dark .xh-brand-slogan,
body.dark .xh-nav a,
body.dark .xh-footer-slogan,
body.dark .xh-footer-links a { color: var(--xh-text-3); }
body.dark .xh-nav a:hover,
body.dark .xh-footer-links a:hover { color: var(--xh-primary); }
body.dark .xh-clock,
body.dark .xh-icon-btn,
body.dark .xh-float,
body.dark .xh-stat,
body.dark .xh-card,
body.dark .xh-filter {
    background: var(--xh-panel);
    border-color: var(--xh-border);
    color: var(--xh-text-2);
}
body.dark .xh-filter input:not([type="radio"]):not([type="checkbox"]):not(.cell-input) {
    border: 0 !important;
    background: transparent !important;
    color: var(--xh-text) !important;
    box-shadow: none !important;
}
body.dark .xh-filter input::placeholder { color: var(--xh-text-3); }
body.dark .xh-filter-ic { color: var(--xh-text-3); }
body.dark .xh-footer { background: var(--xh-bg-1); border-top-color: var(--xh-border); }
body.dark .xh-hero h1 { background: none; -webkit-text-fill-color: currentColor; color: var(--xh-text); }
body.dark .xh-hero p,
body.dark .xh-card p { color: var(--xh-text-3); }
body.dark .xh-card h3 { color: var(--xh-text); }
body.dark .card,
body.dark .res-card,
body.dark .type-card,
body.dark .rfigbox,
body.dark .v-diag-box,
body.dark .sub-sec,
body.dark .panel {
    background: var(--xh-panel) !important;
    border-color: var(--xh-border) !important;
}
body.dark input:not([type="radio"]):not([type="checkbox"]):not(.cell-input),
body.dark select,
body.dark textarea {
    background: var(--xh-panel) !important;
    color: var(--xh-text) !important;
    border-color: var(--xh-border) !important;
}
body.dark th { background: var(--xh-bg-2) !important; color: var(--xh-text-2) !important; }
body.dark .note,
body.dark .hint,
body.dark .small-note,
body.dark .pane-hint,
body.dark .alert,
body.dark .sl-note {
    background: var(--xh-bg-1) !important;
    border-color: var(--xh-border) !important;
    color: var(--xh-text-2) !important;
}
body.dark .big-num, body.dark .rv, body.dark .num { color: var(--xh-primary) !important; }

/* ============================================================
   8. 响应式
   ============================================================ */
@media (max-width: 1080px) {
    .xh-nav a { padding: 6px 8px; font-size: 12px; }
    .xh-clock { display: none; }
}
@media (max-width: 860px) {
    :root { --xh-header-h: 56px; }
    .xh-header-inner { padding: 0 16px; gap: 12px; }
    .xh-nav { display: none; }
    .xh-brand-slogan { display: none; }
    .xh-main { padding: 20px 16px 0; }
    .xh-filter { max-width: none; }
    .xh-grid { grid-template-columns: 1fr; gap: 10px; }
    .xh-footer-slogan { display: none; }
    .xh-footer-inner { padding: 11px 12px; }
    .xh-footer-links { gap: 4px 12px; }
}
@media (max-width: 480px) {
    .xh-footer-links { font-size: 11.5px; gap: 4px 10px; }
    .xh-footer-legal { font-size: 11px; gap: 1px 8px; }
    .xh-footer .xhja-icp .sep { display: none; }
}

/* ===== 全站统一：备案号 / 邮箱 ===== */
.xhja-icp {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 3px 9px;
    font-size: 11.5px;
    line-height: 1.8;
    color: var(--xh-text-3);
    text-align: center;
}
.xhja-icp a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: inherit;
    text-decoration: none;
    transition: color .14s;
}
.xhja-icp a:hover { color: var(--xh-primary); text-decoration: underline; }
.xhja-icp svg { width: 12px; height: 12px; flex: 0 0 auto; opacity: .85; }
.xhja-icp .sep { opacity: .4; user-select: none; }
.beian-sep { opacity: .4; margin: 0 4px; }
#footerBeian { margin-top: 8px; }
.xhja-mail {
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 12px;
    line-height: 1.6;
    color: var(--xh-text-3);
    text-align: center;
}
.xhja-mail a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--xh-primary);
    font-weight: 600;
    text-decoration: none;
}
.xhja-mail a:hover { text-decoration: underline; }

/* ============================================================
   9. 各模块细节统一
   —— 四个工具页各自的控件类名（sbtn / chip / seg / step / btn-next …）在此收口：
      统一 4px 圆角、实心主色、去掉渐变与发光阴影。
      这些类只在那几个模块里用，写在主题层是为了「改一处、全站生效」。
   ============================================================ */
#particle-canvas { display: none !important; }

/* 小控件不再用胶囊 */
.btn,
.btn-primary,
.btn-ghost,
.sbtn,
.chip,
.seg,
.seg button,
.clause,
.tag,
.pill,
.step,
.step-tab,
.mode-tab,
.btn-next,
.rd {
    border-radius: var(--xh-r-sm) !important;
}

/* 选中态 / 主按钮：一律实心主色，不用渐变 */
.btn.primary,
.btn.primary:hover,
.seg button.on,
.sbtn.on,
.sbtn.warn.on,
.step-tab.active,
.step.active,
.mode-tab.active,
.tab.active {
    background: var(--xh-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border-color: var(--xh-primary) !important;
    box-shadow: none !important;
}
.btn.primary:hover,
.seg button.on:hover,
.sbtn.on:hover {
    background: var(--xh-primary-dark) !important;
    border-color: var(--xh-primary-dark) !important;
}
.sbtn:hover,
.chip:hover {
    color: var(--xh-text) !important;
    border-color: var(--xh-text-3) !important;
    background: var(--xh-bg-2) !important;
}
.sbtn.on:hover { color: #fff !important; }

/* 卡片标题上的序号块 */
.card > h3 .no,
.card h2 .step {
    border-radius: var(--xh-r-sm) !important;
    background: var(--xh-primary) !important;
    background-image: none !important;
    color: #fff !important;
    box-shadow: none !important;
    font-weight: 650;
}

/* 模块里的“下一步”大按钮：从青绿实心改为标准主按钮 */
.btn-next,
.btn-next:hover {
    background: var(--xh-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border: 1px solid var(--xh-primary) !important;
    border-radius: var(--xh-r-sm) !important;
    box-shadow: none !important;
    transform: none !important;
}
.btn-next:hover {
    background: var(--xh-primary-dark) !important;
    border-color: var(--xh-primary-dark) !important;
}

/* 折叠块 / 报表 / 结果框：去渐变、统一描边 */
.hole-block {
    background: var(--xh-panel) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-md) !important;
}
.hole-head {
    background: var(--xh-bg-2) !important;
    background-image: none !important;
    border-bottom: 1px solid var(--xh-border);
    color: var(--xh-text-2);
}
.report-box {
    background: var(--xh-bg-1) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-md) !important;
    color: var(--xh-text-2);
}
.err-box {
    background: #fdf1ef !important;
    border: 1px solid #eec3bd !important;
    color: #b42318 !important;
    border-radius: var(--xh-r-sm) !important;
}
.ok-box {
    background: #eef7f1 !important;
    border: 1px solid #b6dbc7 !important;
    color: #177245 !important;
    border-radius: var(--xh-r-sm) !important;
}
.tb-hint,
.sec-head p {
    border-radius: var(--xh-r-sm) !important;
}
.tb-hint {
    background: var(--xh-bg-1) !important;
    border: 1px solid var(--xh-border) !important;
}

/* 只读数值块 */
.rd {
    background: var(--xh-bg-1) !important;
    border: 1px solid var(--xh-border) !important;
    color: var(--xh-text) !important;
}
.type-card.active {
    background: #eaf2f8 !important;
    background-image: none !important;
    border-color: var(--xh-primary) !important;
    box-shadow: none !important;
}
body.dark .type-card.active {
    background: #1a2b39 !important;
}

/* 截面工具页：标题去掉渐变字，改为与其它页一致的左对齐标题 */
.sec-head {
    text-align: left !important;
    margin: 2px 0 14px !important;
}
.sec-head h1 {
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important;
    color: var(--xh-text) !important;
    font-size: 21px !important;
    font-weight: 650 !important;
    letter-spacing: .3px !important;
}
.sec-head p { color: var(--xh-text-3) !important; font-size: 12.5px !important; }

/* 模块残留（第二轮）：按审计结果逐条收口 */
/* zjs：分段控件用 .active 而非 .on；类型卡选中态在本页用了 (0,3,0)!important，需抬一级 */
.seg.active,
.seg button.active,
button.seg.active {
    background: var(--xh-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border-color: var(--xh-primary) !important;
    box-shadow: none !important;
}
body .type-grid .type-card.active,
body .type-grid .type-card.active:hover {
    background: var(--xh-primary) !important;
    background-image: none !important;
    color: #fff !important;
    border-color: var(--xh-primary) !important;
    box-shadow: none !important;
}
body .type-grid .type-card.active .tc-sub,
body .type-grid .type-card.active .tc-name,
body .type-grid .type-card.active .tc-sec { color: #fff !important; }

/* 提示条 / 提醒条 / 轻提示 */
.jhint {
    background: var(--xh-bg-2) !important;
    background-image: none !important;
    border: 1px solid var(--xh-border) !important;
    color: var(--xh-text-2) !important;
    border-radius: var(--xh-r-sm) !important;
    box-shadow: none !important;
}
.remind {
    background: var(--xh-bg-1) !important;
    background-image: none !important;
    border: 1px solid var(--xh-border) !important;
    border-left: 3px solid var(--xh-primary) !important;
    color: var(--xh-text-2) !important;
    border-radius: var(--xh-r-sm) !important;
}
.toast,
#toast {
    border-radius: var(--xh-r-sm) !important;
    background-image: none !important;
}

/* 拖放区 / 状态框 / 画板容器 */
.zk-drop,
#zkDrop { border-radius: var(--xh-r-md) !important; }
.core-i,
.status,
.board,
#board,
.tools,
.tools .box {
    border-radius: var(--xh-r-md) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}
.tools,
.status {
    background: var(--xh-panel) !important;
    border: 1px solid var(--xh-border) !important;
}

/* 窄屏收口：画布类工具的工具组/结果表可能在 390px 下顶破页面，改为内部换行或横滑 */
@media (max-width: 860px) {
    .grp,
    .seg,
    .seg.seg-s {
        flex-wrap: wrap;
        max-width: 100%;
        min-width: 0;
    }
    .res-card {
        overflow-x: auto;
    }
    table.rt {
        min-width: 0;
    }
}

/* jglx 原理详解页（guide.html）：沿用旧版 .help-hero 类名，按钮与提示框收口 */
.help-hero .acts a,
.help-hero .acts a.cta {
    border-radius: var(--xh-r-sm) !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
}
.help-hero .acts a {
    background: var(--xh-panel) !important;
    border: 1px solid var(--xh-border) !important;
    color: var(--xh-text-2) !important;
}
.help-hero .acts a:hover {
    background: var(--xh-bg-2) !important;
    border-color: var(--xh-text-3) !important;
    color: var(--xh-text) !important;
}
.help-hero .acts a.cta,
.help-hero .acts a.cta:hover {
    background: var(--xh-primary) !important;
    border-color: var(--xh-primary) !important;
    color: #fff !important;
}
.help-hero .acts a.cta:hover { background: var(--xh-primary-dark) !important; }
.box {
    background: var(--xh-bg-1) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-sm) !important;
}
.box .no,
.box .num-ic,
.box .idx {
    border-radius: var(--xh-r-sm) !important;
    background: var(--xh-primary) !important;
    background-image: none !important;
}

/* jglx 新版（V2.5）页面结构：特点/常见问题区、分享条、首次引导 */
.about,
#about.about {
    background: var(--xh-panel) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-md) !important;
    box-shadow: none !important;
}
.about h2 { color: var(--xh-text) !important; }
.about .lead,
.about .about-p { color: var(--xh-text-2) !important; }
.feat {
    background: var(--xh-bg-1) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-sm) !important;
    box-shadow: none !important;
}
.feat b { color: var(--xh-primary) !important; }
.feat span { color: var(--xh-text-2) !important; }
.feat code,
.about code,
.guide-card code {
    background: var(--xh-bg-2) !important;
    border-radius: var(--xh-r-sm) !important;
    color: var(--xh-text) !important;
}
.sep { background: var(--xh-border) !important; }
.sharebar {
    background: var(--xh-bg-1) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-sm) !important;
}
/* 首次引导层：遮罩保留（是遮罩不是装饰），去掉毛玻璃与大圆角 */
.guide { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.guide-card {
    background: var(--xh-panel) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-md) !important;
    box-shadow: var(--xh-shadow-md) !important;
}
.guide-k { color: var(--xh-primary) !important; }
.guide-card h3 { color: var(--xh-text) !important; }
.guide-card p { color: var(--xh-text-2) !important; }
.guide-dots i { background: var(--xh-border-strong) !important; }
.guide-dots i.on { background: var(--xh-primary) !important; }
#ruler {
    background: var(--xh-panel) !important;
    border-radius: var(--xh-r-sm) !important;
}

.preset-card {
    background: var(--xh-panel) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-md) !important;
    box-shadow: var(--xh-shadow-md) !important;
}
.preset-card .pitem,
.preset-item {
    border-radius: var(--xh-r-sm) !important;
}

/* jglx 原理详解：步骤条与示意图 */
.steps li {
    background: var(--xh-bg-1) !important;
    border: 1px solid var(--xh-border) !important;
    border-radius: var(--xh-r-sm) !important;
}
.steps li::before {
    background: var(--xh-primary) !important;
    background-image: none !important;
}
.fig svg {
    background: var(--xh-panel) !important;
    border-radius: var(--xh-r-sm) !important;
}