/* ============================================================
   学龄身高记录与生长曲线（height-growth-chart）
   主题：牛仔蓝 #3b6ea5 + 芽绿 #7cb342 + 体检手册/坐标纸（与站内其它工具页完全错开）
   深浅双主题：跟随导航栏 #themeToggle（data-theme 挂在 <html>）
   标志性 UI：身高尺速览 + 参考带生长曲线 + 年增速柱状参考带
   ============================================================ */

/* 变量作用域：.hgc-page 主体 + 浮层（弹窗 / 打印单 / 提示条）都在根 div 之外，
   必须同作用域声明，否则浮层取不到变量导致背景失效、内容与页面重叠 */
.hgc-page,
.hgc-modal,
.hgc-sheet,
.hgc-toast {
    --hgc-blue: #3b6ea5;
    --hgc-blue-2: #4f83bd;
    --hgc-blue-deep: #24486e;
    --hgc-green: #7cb342;
    --hgc-green-2: #94c85c;
    --hgc-green-deep: #557a2c;
    --hgc-warn: #c2703d;
    --hgc-warn-soft: #f9ede2;
    --hgc-blue-soft: #e8f0f8;
    --hgc-green-soft: #eff6e4;
    --hgc-paper: #fcfdfb;
    --hgc-bg: #f2f6f1;
    --hgc-surface: #ffffff;
    --hgc-surface-2: #f5f9f4;
    --hgc-line: rgba(59, 110, 165, .16);
    --hgc-line-strong: rgba(59, 110, 165, .36);
    --hgc-text: #1d2c3a;
    --hgc-text-soft: #44576b;
    --hgc-text-muted: #7d90a1;
    --hgc-shadow: 0 14px 34px -20px rgba(30, 66, 100, .4);
    --hgc-shadow-lg: 0 26px 60px -30px rgba(30, 66, 100, .5);
    --hgc-radius: 18px;
    --hgc-radius-sm: 11px;
    --hgc-mono: "Cascadia Mono", "JetBrains Mono", Consolas, "Courier New", monospace;
}
.hgc-page {
    color: var(--hgc-text);
    font-size: 15px;
    line-height: 1.78;
}

:root[data-theme="dark"] .hgc-page,
:root[data-theme="dark"] .hgc-modal,
:root[data-theme="dark"] .hgc-sheet,
:root[data-theme="dark"] .hgc-toast {
    --hgc-blue: #7fb2e0;
    --hgc-blue-2: #9cc7ef;
    --hgc-blue-deep: #3b6ea5;
    --hgc-green: #a5d36e;
    --hgc-green-2: #bde18b;
    --hgc-green-deep: #7cb342;
    --hgc-warn: #e8a06a;
    --hgc-warn-soft: rgba(232, 160, 106, .14);
    --hgc-blue-soft: rgba(127, 178, 224, .13);
    --hgc-green-soft: rgba(165, 211, 110, .13);
    --hgc-paper: #10202e;
    --hgc-bg: #0b1520;
    --hgc-surface: #132433;
    --hgc-surface-2: #182c3e;
    --hgc-line: rgba(127, 178, 224, .2);
    --hgc-line-strong: rgba(127, 178, 224, .42);
    --hgc-text: #e8f0f7;
    --hgc-text-soft: #b6c8d6;
    --hgc-text-muted: #8ba0b1;
    --hgc-shadow: 0 14px 34px -20px rgba(0, 0, 0, .85);
    --hgc-shadow-lg: 0 26px 60px -30px rgba(0, 0, 0, .95);
}

.hgc-page *,
.hgc-page *::before,
.hgc-page *::after { box-sizing: border-box; }
.hgc-page [hidden] { display: none !important; }
.hgc-page b { font-weight: 700; color: var(--hgc-blue-deep); }
:root[data-theme="dark"] .hgc-page b { color: var(--hgc-blue-2); }
.hgc-page code {
    font-family: var(--hgc-mono);
    font-size: .92em;
    padding: 1px 6px;
    border-radius: 5px;
    background: var(--hgc-blue-soft);
    color: var(--hgc-blue-deep);
}
:root[data-theme="dark"] .hgc-page code { color: var(--hgc-blue-2); }

/* ---------------- 首屏 ---------------- */
.hgc-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.32fr) minmax(0, .98fr);
    gap: 34px;
    align-items: start;
    margin-bottom: 24px;
}

.hgc-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--hgc-blue-deep);
    background: var(--hgc-blue-soft);
    border: 1px solid var(--hgc-line);
}
:root[data-theme="dark"] .hgc-kicker { color: var(--hgc-blue-2); }

.hgc-hero-copy h1 {
    margin: 16px 0 12px;
    font-size: 38px;
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: -.02em;
    color: var(--hgc-text);
}
.hgc-hero-copy h1::after {
    content: "";
    display: block;
    width: 64px;
    height: 5px;
    margin-top: 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--hgc-blue), var(--hgc-green));
}
.hgc-lead { margin: 14px 0 0; color: var(--hgc-text-soft); font-size: 15.5px; }

.hgc-tags {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 18px 0 0;
}
.hgc-tags li {
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--hgc-text-soft);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line);
}

.hgc-steps {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 0;
    margin: 20px 0 0;
}
.hgc-steps li {
    padding: 12px 14px;
    border-radius: var(--hgc-radius-sm);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line);
    box-shadow: var(--hgc-shadow);
}
.hgc-steps b {
    display: block;
    font-size: 10.5px;
    letter-spacing: .14em;
    color: var(--hgc-green-deep);
    font-weight: 800;
}
:root[data-theme="dark"] .hgc-steps b { color: var(--hgc-green); }
.hgc-steps span { display: block; margin-top: 3px; font-weight: 800; font-size: 14.5px; }
.hgc-steps i { display: block; font-style: normal; font-size: 12px; color: var(--hgc-text-muted); }

/* 身高尺速览 */
.hgc-ruler {
    position: relative;
    border-radius: var(--hgc-radius);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line);
    box-shadow: var(--hgc-shadow-lg);
    overflow: hidden;
}
.hgc-ruler::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(59,110,165,.06) 1px, transparent 1px),
        linear-gradient(rgba(59,110,165,.05) 1px, transparent 1px);
    background-size: 26px 26px;
    pointer-events: none;
}
:root[data-theme="dark"] .hgc-ruler::before {
    background:
        linear-gradient(90deg, rgba(127,178,224,.07) 1px, transparent 1px),
        linear-gradient(rgba(127,178,224,.06) 1px, transparent 1px);
    background-size: 26px 26px;
}
.hgc-ruler-corner {
    position: relative;
    padding: 10px 18px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    color: var(--hgc-surface);
    background: linear-gradient(120deg, var(--hgc-blue), var(--hgc-green));
}
.hgc-ruler-body {
    position: relative;
    display: flex;
    gap: 16px;
    padding: 22px 20px 18px;
}
.hgc-ruler-ticks {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 6px 0;
}
.hgc-ruler-ticks i {
    width: 22px;
    height: 3px;
    border-radius: 2px;
    background: var(--hgc-line-strong);
}
.hgc-ruler-ticks i:nth-child(odd) { width: 34px; background: var(--hgc-blue); }
.hgc-ruler-num { display: flex; align-items: baseline; gap: 7px; }
.hgc-ruler-num b {
    font-size: 52px;
    line-height: 1;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    color: var(--hgc-blue-deep);
}
:root[data-theme="dark"] .hgc-ruler-num b { color: var(--hgc-blue-2); }
.hgc-ruler-num span { font-size: 15px; font-weight: 700; color: var(--hgc-text-muted); }
.hgc-ruler-meta { margin-top: 10px; font-size: 13.5px; color: var(--hgc-text-soft); }
.hgc-ruler-foot {
    position: relative;
    padding: 10px 18px;
    font-size: 12px;
    color: var(--hgc-text-muted);
    border-top: 1px dashed var(--hgc-line-strong);
    background: var(--hgc-surface-2);
}

/* ---------------- 卡片通用 ---------------- */
.hgc-card {
    margin-top: 22px;
    padding: 24px 26px;
    border-radius: var(--hgc-radius);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line);
    box-shadow: var(--hgc-shadow);
}
.hgc-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 16px;
}
.hgc-card-title {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 19px;
    font-weight: 900;
}
.hgc-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 17px;
    background: var(--hgc-blue-soft);
    border: 1px solid var(--hgc-line);
}
.hgc-note-sub { font-size: 12px; font-weight: 500; color: var(--hgc-text-muted); }

/* ---------------- 档案与表单 ---------------- */
.hgc-profile {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) auto minmax(160px, 1fr) auto;
    gap: 14px;
    align-items: end;
}
.hgc-profile-btns { display: flex; gap: 8px; flex-wrap: wrap; }

.hgc-field { display: flex; flex-direction: column; gap: 5px; }
.hgc-field--grow { flex: 1 1 180px; }
.hgc-label { font-size: 12.5px; font-weight: 700; color: var(--hgc-text-soft); }
.hgc-input {
    width: 100%;
    min-height: 42px;
    padding: 8px 12px;
    font-size: 14.5px;
    color: var(--hgc-text);
    background: var(--hgc-surface-2);
    border: 1.5px solid var(--hgc-line);
    border-radius: var(--hgc-radius-sm);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
    font-family: inherit;
}
.hgc-input:focus {
    border-color: var(--hgc-blue);
    box-shadow: 0 0 0 3px rgba(59, 110, 165, .18);
}
.hgc-hint { font-size: 11.5px; color: var(--hgc-text-muted); }

.hgc-seg {
    display: inline-flex;
    padding: 3px;
    gap: 3px;
    border-radius: 999px;
    background: var(--hgc-surface-2);
    border: 1.5px solid var(--hgc-line);
}
.hgc-segbtn {
    padding: 7px 16px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--hgc-text-soft);
    background: transparent;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    transition: background .15s, color .15s;
    font-family: inherit;
}
.hgc-segbtn.on {
    color: #fff;
    background: linear-gradient(120deg, var(--hgc-blue), var(--hgc-green));
}
:root[data-theme="dark"] .hgc-segbtn.on { color: #0b1520; }

.hgc-form { display: flex; flex-wrap: wrap; gap: 14px; align-items: end; }
.hgc-form-btns { display: flex; gap: 8px; }
.hgc-formmsg {
    margin-top: 12px;
    padding: 10px 14px;
    border-radius: var(--hgc-radius-sm);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--hgc-warn);
    background: var(--hgc-warn-soft);
    border: 1px solid var(--hgc-warn);
}

/* ---------------- 按钮 ---------------- */
.hgc-btns, .hgc-batch-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.hgc-btn {
    padding: 9px 16px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--hgc-blue-deep);
    background: var(--hgc-surface-2);
    border: 1.5px solid var(--hgc-line);
    border-radius: var(--hgc-radius-sm);
    cursor: pointer;
    transition: transform .12s, box-shadow .12s, background .12s;
    font-family: inherit;
}
:root[data-theme="dark"] .hgc-btn { color: var(--hgc-blue-2); }
.hgc-btn:hover { transform: translateY(-1px); box-shadow: var(--hgc-shadow); }
.hgc-btn:active { transform: translateY(0); }
.hgc-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.hgc-btn--primary {
    color: #fff;
    background: linear-gradient(120deg, var(--hgc-blue), var(--hgc-green));
    border-color: transparent;
}
:root[data-theme="dark"] .hgc-btn--primary { color: #0b1520; }
.hgc-btn--ghost { background: transparent; }
.hgc-btn--danger { color: #b3402a; border-color: rgba(179, 64, 42, .4); }
:root[data-theme="dark"] .hgc-btn--danger { color: #ef9c86; }
.hgc-btn--sm { padding: 6px 13px; font-size: 12.5px; }

/* ---------------- 图表 ---------------- */
.hgc-chart-legend {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    color: var(--hgc-text-muted);
    flex-wrap: wrap;
}
.hgc-chart-legend i {
    display: inline-block;
    width: 14px;
    height: 10px;
    border-radius: 3px;
    margin-left: 6px;
}
.hgc-chart-legend i:first-child { margin-left: 0; }
.lg-p397 { background: rgba(124, 179, 66, .18); border: 1px solid rgba(124, 179, 66, .4); }
.lg-p2575 { background: rgba(59, 110, 165, .2); border: 1px solid rgba(59, 110, 165, .4); }
.lg-p50 { background: var(--hgc-green-deep); height: 3px !important; border-radius: 2px; }
.lg-dot { width: 10px !important; height: 10px !important; border-radius: 50% !important; background: var(--hgc-blue); }

.hgc-chartbox, .hgc-velbox { width: 100%; }
.hgc-chartbox svg, .hgc-velbox svg {
    display: block;
    width: 100%;
    height: auto;
    background: var(--hgc-paper);
    border: 1px solid var(--hgc-line);
    border-radius: var(--hgc-radius-sm);
}
.hgc-chart-note { margin: 10px 2px 0; font-size: 12.5px; color: var(--hgc-text-muted); }

/* ---------------- 记录表 ---------------- */
.hgc-rec-count {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--hgc-green-deep);
    background: var(--hgc-green-soft);
    padding: 4px 12px;
    border-radius: 999px;
}
:root[data-theme="dark"] .hgc-rec-count { color: var(--hgc-green); }
.hgc-table-wrap { overflow-x: auto; }
.hgc-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.hgc-table th, .hgc-table td {
    padding: 9px 10px;
    text-align: left;
    white-space: nowrap;
    border-bottom: 1px solid var(--hgc-line);
}
.hgc-table th {
    font-size: 12px;
    font-weight: 800;
    color: var(--hgc-text-muted);
    border-bottom: 2px solid var(--hgc-line-strong);
}
.hgc-table td { font-variant-numeric: tabular-nums; }
.hgc-table tr:last-child td { border-bottom: 0; }
.hgc-table .p-ok { color: var(--hgc-green-deep); font-weight: 700; }
:root[data-theme="dark"] .hgc-table .p-ok { color: var(--hgc-green); }
.hgc-table .p-warn { color: var(--hgc-warn); font-weight: 700; }
.hgc-table .v-ok { color: var(--hgc-green-deep); }
:root[data-theme="dark"] .hgc-table .v-ok { color: var(--hgc-green); }
.hgc-table .v-warn { color: var(--hgc-warn); font-weight: 700; }
.hgc-linkbtn {
    padding: 3px 10px;
    margin-right: 4px;
    font-size: 12px;
    font-weight: 700;
    color: var(--hgc-blue-deep);
    background: var(--hgc-blue-soft);
    border: 1px solid var(--hgc-line);
    border-radius: 7px;
    cursor: pointer;
    font-family: inherit;
}
:root[data-theme="dark"] .hgc-linkbtn { color: var(--hgc-blue-2); }
.hgc-linkbtn--del { color: #b3402a; background: transparent; border-color: rgba(179, 64, 42, .35); }
:root[data-theme="dark"] .hgc-linkbtn--del { color: #ef9c86; }
.hgc-empty { padding: 26px 10px; text-align: center; color: var(--hgc-text-muted); font-size: 14px; }
.hgc-empty p { margin: 4px 0; }

/* ---------------- 口径说明表 ---------------- */
.hgc-notes { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.hgc-notes th, .hgc-notes td {
    padding: 11px 12px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--hgc-line);
}
.hgc-notes th {
    width: 118px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--hgc-blue-deep);
    background: var(--hgc-blue-soft);
    white-space: nowrap;
}
:root[data-theme="dark"] .hgc-notes th { color: var(--hgc-blue-2); }
.hgc-notes tr:last-child th, .hgc-notes tr:last-child td { border-bottom: 0; }

/* ---------------- 批量导入 ---------------- */
.hgc-batch-tip { margin: 0 0 12px; font-size: 13px; color: var(--hgc-text-soft); }
.hgc-batch-tip code { white-space: nowrap; }
.hgc-textarea {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    font-family: var(--hgc-mono);
    line-height: 1.7;
    color: var(--hgc-text);
    background: var(--hgc-surface-2);
    border: 1.5px solid var(--hgc-line);
    border-radius: var(--hgc-radius-sm);
    resize: vertical;
    outline: none;
}
.hgc-textarea:focus { border-color: var(--hgc-blue); box-shadow: 0 0 0 3px rgba(59, 110, 165, .18); }
.hgc-batch-btns { margin-top: 12px; }
.hgc-batch-prev {
    margin-top: 14px;
    padding: 14px 16px;
    border-radius: var(--hgc-radius-sm);
    background: var(--hgc-surface-2);
    border: 1px dashed var(--hgc-line-strong);
    font-size: 13px;
    max-height: 260px;
    overflow: auto;
}
.hgc-batch-prev table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.hgc-batch-prev th, .hgc-batch-prev td {
    padding: 5px 8px;
    text-align: left;
    border-bottom: 1px solid var(--hgc-line);
    white-space: nowrap;
}
.hgc-batch-prev .bp-bad { color: var(--hgc-warn); }

/* ---------------- CSV 预览 ---------------- */
.hgc-pre {
    margin: 14px 0 0;
    padding: 14px 16px;
    border-radius: var(--hgc-radius-sm);
    background: var(--hgc-paper);
    border: 1px solid var(--hgc-line);
    font-family: var(--hgc-mono);
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--hgc-text-soft);
    overflow-x: auto;
    white-space: pre;
}

/* ---------------- 底部标签页 ---------------- */
.hgc-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 30px 0 0;
}
.hgc-tabbtn {
    padding: 9px 18px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--hgc-text-soft);
    background: var(--hgc-surface);
    border: 1.5px solid var(--hgc-line);
    border-radius: 999px;
    cursor: pointer;
    transition: all .15s;
    font-family: inherit;
}
.hgc-tabbtn.on {
    color: #fff;
    background: linear-gradient(120deg, var(--hgc-blue), var(--hgc-green));
    border-color: transparent;
}
:root[data-theme="dark"] .hgc-tabbtn.on { color: #0b1520; }
.hgc-panel {
    display: none;
    margin-top: 14px;
    padding: 24px 26px;
    border-radius: var(--hgc-radius);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line);
    box-shadow: var(--hgc-shadow);
    font-size: 14.5px;
    color: var(--hgc-text-soft);
}
.hgc-panel.on { display: block; }
.hgc-panel h2 {
    margin: 18px 0 8px;
    font-size: 17px;
    font-weight: 900;
    color: var(--hgc-text);
}
.hgc-panel h2:first-child { margin-top: 0; }
.hgc-panel p { margin: 8px 0; }
.hgc-panel ol, .hgc-panel ul { padding-left: 22px; margin: 8px 0; }
.hgc-panel li { margin: 6px 0; }

.hgc-timeline { list-style: none; padding: 0; margin: 0; }
.hgc-timeline li {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px dashed var(--hgc-line);
}
.hgc-timeline li:last-child { border-bottom: 0; }
.hgc-timeline .ver {
    flex: none;
    padding: 1px 10px;
    font-size: 12px;
    font-weight: 800;
    color: #fff;
    background: var(--hgc-green-deep);
    border-radius: 999px;
    height: fit-content;
}
:root[data-theme="dark"] .hgc-timeline .ver { color: #0b1520; background: var(--hgc-green); }
.hgc-timeline .date { flex: none; font-family: var(--hgc-mono); font-size: 12.5px; color: var(--hgc-text-muted); padding-top: 2px; }
.hgc-timeline .txt { font-size: 13px; color: var(--hgc-text-soft); }

.hgc-faq details {
    padding: 12px 16px;
    margin-bottom: 10px;
    border-radius: var(--hgc-radius-sm);
    background: var(--hgc-surface-2);
    border: 1px solid var(--hgc-line);
}
.hgc-faq summary { font-weight: 800; cursor: pointer; font-size: 14.5px; }
.hgc-faq .a { margin-top: 8px; font-size: 13.5px; color: var(--hgc-text-soft); }

/* ---------------- 相关工具 ---------------- */
.hgc-related { margin-top: 30px; }
.hgc-related h2 { font-size: 17px; font-weight: 900; margin: 0 0 12px; }
.hgc-rel-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
}
.hgc-rel {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: var(--hgc-radius-sm);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line);
    text-decoration: none;
    color: var(--hgc-text);
    transition: transform .12s, box-shadow .12s;
}
.hgc-rel:hover { transform: translateY(-2px); box-shadow: var(--hgc-shadow); }
.hgc-rel .ri {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-size: 20px;
    border-radius: 12px;
    background: var(--hgc-green-soft);
    border: 1px solid var(--hgc-line);
}
.hgc-rel b { display: block; font-size: 13.5px; }
.hgc-rel small { display: block; font-size: 12px; color: var(--hgc-text-muted); }

/* ---------------- 弹窗 ---------------- */
.hgc-modal { position: fixed; inset: 0; z-index: 300; }
.hgc-modal[hidden] { display: none !important; }
.hgc-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(13, 27, 40, .55);
    backdrop-filter: blur(2px);
}
.hgc-modal-box {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(560px, calc(100vw - 32px));
    max-height: min(78vh, 720px);
    display: flex;
    flex-direction: column;
    border-radius: var(--hgc-radius);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line-strong);
    box-shadow: var(--hgc-shadow-lg);
    overflow: hidden;
}
.hgc-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--hgc-line);
    background: linear-gradient(120deg, var(--hgc-blue-soft), var(--hgc-green-soft));
}
.hgc-modal-head h3 { margin: 0; font-size: 16px; font-weight: 900; }
.hgc-modal-x {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: var(--hgc-text-soft);
    background: var(--hgc-surface);
    border: 1px solid var(--hgc-line);
    border-radius: 50%;
    cursor: pointer;
    font-family: inherit;
}
.hgc-modal-x:hover { color: #b3402a; border-color: rgba(179, 64, 42, .4); }
.hgc-modal-body { padding: 16px 18px; overflow-y: auto; font-size: 14px; color: var(--hgc-text-soft); }
.hgc-modal-body h4 {
    margin: 14px 0 6px;
    font-size: 13px;
    font-weight: 800;
    color: var(--hgc-blue-deep);
}
:root[data-theme="dark"] .hgc-modal-body h4 { color: var(--hgc-blue-2); }
.hgc-modal-body h4:first-child { margin-top: 0; }
.hgc-modal-body table { width: 100%; border-collapse: collapse; font-size: 13px; }
.hgc-modal-body th, .hgc-modal-body td {
    padding: 6px 9px;
    text-align: left;
    border-bottom: 1px solid var(--hgc-line);
    font-variant-numeric: tabular-nums;
}
.hgc-modal-body th { color: var(--hgc-text-muted); font-weight: 600; white-space: nowrap; }
.hgc-modal-foot { padding: 12px 18px; border-top: 1px solid var(--hgc-line); text-align: right; }
.hgc-modal-foot .hgc-btn { color: #fff; background: linear-gradient(120deg, var(--hgc-blue), var(--hgc-green)); border-color: transparent; }
:root[data-theme="dark"] .hgc-modal-foot .hgc-btn { color: #0b1520; }

/* ---------------- 提示条 ---------------- */
.hgc-toast {
    position: fixed;
    left: 50%;
    bottom: 34px;
    transform: translate(-50%, 16px);
    padding: 10px 20px;
    font-size: 13.5px;
    font-weight: 700;
    color: #fff;
    background: var(--hgc-blue-deep);
    border-radius: 999px;
    box-shadow: var(--hgc-shadow-lg);
    opacity: 0;
    pointer-events: none;
    transition: opacity .22s, transform .22s;
    z-index: 320;
}
:root[data-theme="dark"] .hgc-toast { color: #0b1520; background: var(--hgc-blue); }
.hgc-toast.on { opacity: 1; transform: translate(-50%, 0); }

/* ---------------- A4 打印单 ---------------- */
.hgc-sheet { display: none; }

@media print {
    body * { visibility: hidden !important; }
    .hgc-sheet, .hgc-sheet * { visibility: visible !important; }
    .hgc-sheet {
        display: block !important;
        position: absolute;
        inset: 0 auto auto 0;
        width: 100%;
        padding: 24px 28px;
        background: #fff;
        color: #1d2c3a;
        font-size: 13px;
        line-height: 1.7;
    }
    .hgc-sheet h2 { font-size: 20px; margin: 0 0 4px; }
    .hgc-sheet .sh-sub { color: #44576b; margin: 0 0 14px; font-size: 12.5px; }
    .hgc-sheet table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin: 10px 0 14px; }
    .hgc-sheet th, .hgc-sheet td { border: 1px solid #b9c8d4; padding: 6px 9px; text-align: left; }
    .hgc-sheet th { background: #eef4f9; }
    .hgc-sheet .sh-profile { margin: 0 0 6px; }
    .hgc-sheet .sh-note { margin-top: 12px; padding-top: 10px; border-top: 1px solid #b9c8d4; font-size: 11.5px; color: #44576b; }
}

/* ---------------- 响应式 ---------------- */
@media (max-width: 960px) {
    .hgc-hero { grid-template-columns: 1fr; gap: 20px; }
    .hgc-hero-copy h1 { font-size: 30px; }
    .hgc-profile { grid-template-columns: 1fr 1fr; }
    .hgc-profile-btns { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
    .hgc-card { padding: 18px 16px; }
    .hgc-hero-copy h1 { font-size: 26px; }
    .hgc-steps { grid-template-columns: 1fr; }
    .hgc-profile, .hgc-form { grid-template-columns: 1fr 1fr; }
    .hgc-field--grow, .hgc-form .hgc-field:last-of-type { grid-column: 1 / -1; }
    .hgc-form-btns, .hgc-form .hgc-btn { grid-column: 1 / -1; width: 100%; }
    .hgc-form .hgc-btn--primary { width: 100%; justify-content: center; }
    .hgc-profile-btns { grid-column: 1 / -1; }
    .hgc-ruler-num b { font-size: 42px; }
    .hgc-notes th { width: 92px; }
}