/* ==========================================================================
   kid-dental-cost-calc · 儿童牙科费用计算器
   Visual concept: 「诊室光」— 儿童齿科诊室的清晨白光、薄荷器械盘与珊瑚提醒贴
   Type scale: 40 / 26 / 19 / 15 / 13.5 / 12 / 11
   ========================================================================== */

.kdc-page {
    --kdc-bg: #edf7f4;
    --kdc-card: #ffffff;
    --kdc-cream: #fffdf8;
    --kdc-ink: #0c2a26;
    --kdc-ink-soft: #45645e;
    --kdc-ink-faint: #7b9993;
    --kdc-teal: #0d9d88;
    --kdc-teal-deep: #06685a;
    --kdc-teal-soft: #e1f4ef;
    --kdc-coral: #ff7a62;
    --kdc-coral-soft: #ffe8e1;
    --kdc-amber: #e4a323;
    --kdc-amber-soft: #fff5e0;
    --kdc-line: #d5ebe5;
    --kdc-line-soft: #e9f5f1;
    --kdc-soft: #f4fbf9;
    --kdc-radius: 22px;
    --kdc-shadow: 0 26px 52px -42px rgba(8, 74, 63, .55);
    --kdc-shadow-lg: 0 36px 74px -50px rgba(8, 74, 63, .5);
    --kdc-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    --kdc-num: "SF Mono", "JetBrains Mono", ui-monospace, "Cascadia Mono", Menlo, Consolas, monospace;
    position: relative;
    isolation: isolate;
    padding: 20px 0 60px;
    color: var(--kdc-ink);
    font-family: var(--kdc-font);
    background:
        radial-gradient(920px 430px at 6% -14%, rgba(13, 157, 136, .13), transparent 62%),
        radial-gradient(760px 400px at 98% 2%, rgba(255, 122, 98, .11), transparent 58%),
        var(--kdc-bg);
}

[data-theme="dark"] .kdc-page {
    --kdc-bg: #061513;
    --kdc-card: #0e2321;
    --kdc-cream: #122a26;
    --kdc-ink: #e7f4f1;
    --kdc-ink-soft: #a5c3bd;
    --kdc-ink-faint: #739690;
    --kdc-teal: #3dd0b6;
    --kdc-teal-deep: #6ee0c9;
    --kdc-teal-soft: #12332e;
    --kdc-coral: #ff9179;
    --kdc-coral-soft: #3a201c;
    --kdc-amber: #f0b948;
    --kdc-amber-soft: #352913;
    --kdc-line: #1e3a35;
    --kdc-line-soft: #193330;
    --kdc-soft: #102a26;
    --kdc-shadow: 0 24px 48px -40px rgba(0, 0, 0, .9);
    --kdc-shadow-lg: 0 34px 70px -48px rgba(0, 0, 0, .95);
    background:
        radial-gradient(900px 420px at 8% -14%, rgba(61, 208, 182, .12), transparent 62%),
        radial-gradient(720px 380px at 98% 2%, rgba(255, 145, 121, .09), transparent 58%),
        var(--kdc-bg);
}

.kdc-page *,
.kdc-page *::before,
.kdc-page *::after { box-sizing: border-box; }

.kdc-inner { max-width: 1200px; margin: 0 auto; padding: 0 26px; }

/* ---------- 面包屑 ---------- */
.kdc-crumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin: 2px 0 16px;
    font-size: 12.5px;
    letter-spacing: .01em;
    color: var(--kdc-ink-faint);
}
.kdc-crumb a { color: var(--kdc-ink-soft); text-decoration: none; transition: color .18s; }
.kdc-crumb a:hover { color: var(--kdc-teal); }
.kdc-crumb .sep { color: var(--kdc-line); font-size: 11px; }
.kdc-crumb .cur { color: var(--kdc-teal-deep); font-weight: 700; }

/* ---------- 首屏 ---------- */
.kdc-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, .82fr);
    gap: 28px;
    padding: 32px 34px 30px;
    border: 1px solid var(--kdc-line);
    border-radius: 30px;
    background:
        radial-gradient(600px 280px at 86% -16%, rgba(13, 157, 136, .16), transparent 66%),
        linear-gradient(132deg, #ffffff 0%, #f8fdfb 50%, #ebf8f4 100%);
    box-shadow: var(--kdc-shadow-lg);
    overflow: hidden;
}
[data-theme="dark"] .kdc-hero {
    background:
        radial-gradient(600px 280px at 86% -16%, rgba(61, 208, 182, .16), transparent 66%),
        linear-gradient(132deg, #0f2522 0%, #0d211e 50%, #102b27 100%);
}
.kdc-hero::before {
    content: "";
    position: absolute;
    top: -168px;
    right: -104px;
    width: 380px;
    height: 380px;
    border-radius: 50%;
    border: 1px solid rgba(13, 157, 136, .2);
    box-shadow: inset 0 0 0 30px rgba(255, 255, 255, .5);
    pointer-events: none;
}
[data-theme="dark"] .kdc-hero::before { box-shadow: inset 0 0 0 30px rgba(255, 255, 255, .03); }
.kdc-hero::after {
    content: "";
    position: absolute;
    left: 34px;
    right: 34px;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, rgba(13, 157, 136, .5), rgba(255, 122, 98, .38) 62%, transparent);
}

.kdc-hero-copy { position: relative; z-index: 1; min-width: 0; }

.kdc-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 13px 5px 11px;
    border-radius: 999px;
    background: var(--kdc-teal-soft);
    color: var(--kdc-teal-deep);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .12em;
}
.kdc-kicker::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--kdc-teal);
    box-shadow: 0 0 0 3px rgba(13, 157, 136, .18);
}

.kdc-hero h1 {
    margin: 14px 0 12px;
    font-size: clamp(27px, 3vw, 39px);
    font-weight: 800;
    font-style: normal;
    line-height: 1.2;
    letter-spacing: -.9px;
    color: var(--kdc-ink);
}

.kdc-hero-sub {
    margin: 0 0 10px;
    max-width: 560px;
    padding-left: 12px;
    border-left: 2px solid var(--kdc-teal);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.8;
    color: var(--kdc-ink);
}

.kdc-lead {
    margin: 0 0 18px;
    max-width: 600px;
    font-size: 14.5px;
    line-height: 1.95;
    color: var(--kdc-ink-soft);
}
.kdc-lead b { color: var(--kdc-teal-deep); font-weight: 700; }
[data-theme="dark"] .kdc-lead b { color: var(--kdc-teal); }

.kdc-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}
.kdc-chips li {
    padding: 5px 11px;
    border: 1px solid var(--kdc-line);
    border-radius: 9px;
    background: rgba(255, 255, 255, .82);
    color: var(--kdc-ink-soft);
    font-size: 11.5px;
    letter-spacing: .01em;
    transition: border-color .18s, color .18s, transform .18s;
}
[data-theme="dark"] .kdc-chips li { background: rgba(255, 255, 255, .04); }
.kdc-chips li:hover { border-color: var(--kdc-teal); color: var(--kdc-teal-deep); transform: translateY(-1px); }

.kdc-hero-btns { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---------- 牙位卡 ---------- */
.kdc-map {
    position: relative;
    z-index: 1;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    padding: 18px 18px 16px;
    border: 1px solid var(--kdc-line);
    border-radius: 24px;
    background: var(--kdc-card);
    box-shadow: var(--kdc-shadow);
}
.kdc-map-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    color: var(--kdc-ink-faint);
}
.kdc-map-head b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--kdc-teal);
    color: #ffffff;
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
}
[data-theme="dark"] .kdc-map-head b { color: #062b25; }

.kdc-teeth {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    margin: 10px 0 6px;
    padding: 6px 0;
    border-radius: 16px;
    background: radial-gradient(ellipse 78% 84% at 50% 46%, rgba(225, 244, 239, .95), rgba(225, 244, 239, 0) 78%);
}
[data-theme="dark"] .kdc-teeth {
    background: radial-gradient(ellipse 78% 84% at 50% 46%, rgba(18, 51, 46, .95), rgba(18, 51, 46, 0) 78%);
}
.kdc-teeth svg { display: block; width: 100%; height: auto; }
.kdc-teeth .tooth-baby { fill: #ffffff; stroke: #c3e2db; stroke-width: 1.4; }
.kdc-teeth .tooth-six { fill: var(--kdc-coral); stroke: #e2684f; stroke-width: 1.4; }
.kdc-teeth .tooth-root { stroke: #c3e2db; stroke-width: 1.4; fill: none; }
.kdc-teeth .tooth-label { fill: var(--kdc-ink-faint); font-size: 7.5px; letter-spacing: .04em; font-family: var(--kdc-font); }
[data-theme="dark"] .kdc-teeth .tooth-baby { fill: #17332e; stroke: #4d9184; }
[data-theme="dark"] .kdc-teeth .tooth-six { fill: #cf6b56; stroke: #f0a08a; }
[data-theme="dark"] .kdc-teeth .tooth-root { stroke: #4d9184; }

.kdc-map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 11px;
    color: var(--kdc-ink-faint);
}
.kdc-map-legend i {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 5px;
    border-radius: 2px;
    vertical-align: 1px;
}
.kdc-map-legend .lt { background: #ffffff; border: 1px solid #c3e2db; }
.kdc-map-legend .lg { background: var(--kdc-coral); }

.kdc-map-kpi {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: auto;
    padding-top: 13px;
}
.kdc-map-kpi > div {
    padding: 10px 11px;
    border-radius: 13px;
    background: var(--kdc-soft);
    border: 1px solid var(--kdc-line-soft);
}
.kdc-map-kpi span {
    display: block;
    font-size: 10.5px;
    letter-spacing: .06em;
    color: var(--kdc-ink-faint);
}
.kdc-map-kpi strong {
    display: block;
    margin-top: 2px;
    font-family: var(--kdc-num);
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -.4px;
    color: var(--kdc-teal-deep);
    font-variant-numeric: tabular-nums;
}
[data-theme="dark"] .kdc-map-kpi strong { color: var(--kdc-teal); }

.kdc-map-foot {
    margin: 11px 0 0;
    font-size: 11px;
    line-height: 1.6;
    color: var(--kdc-ink-faint);
}

/* ---------- 年龄滑杆 ---------- */
.kdc-age {
    margin: 18px 0;
    padding: 18px 22px 16px;
    border: 1px solid var(--kdc-line);
    border-radius: 22px;
    background: var(--kdc-card);
    box-shadow: var(--kdc-shadow);
}
.kdc-age-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
}
.kdc-age-label {
    flex: none;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
    color: var(--kdc-ink-faint);
}
.kdc-range {
    flex: 1 1 240px;
    min-width: 160px;
    height: 26px;
    margin: 0;
    background: transparent;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}
.kdc-range::-webkit-slider-runnable-track {
    height: 6px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--kdc-teal) 0%, #7fd5c6 62%, var(--kdc-line) 62%, var(--kdc-line) 100%);
}
.kdc-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px;
    height: 22px;
    margin-top: -8px;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background: var(--kdc-teal-deep);
    box-shadow: 0 0 0 4px rgba(13, 157, 136, .18), 0 6px 14px -6px rgba(6, 104, 90, .9);
}
.kdc-range::-moz-range-track { height: 6px; border-radius: 999px; background: var(--kdc-line); }
.kdc-range::-moz-range-progress { height: 6px; border-radius: 999px; background: var(--kdc-teal); }
.kdc-range::-moz-range-thumb {
    width: 18px;
    height: 18px;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background: var(--kdc-teal-deep);
}
.kdc-age-out {
    flex: none;
    min-width: 62px;
    font-family: var(--kdc-num);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.5px;
    color: var(--kdc-ink);
    font-variant-numeric: tabular-nums;
}
.kdc-age-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.kdc-tag {
    padding: 5px 11px;
    border: 1px solid var(--kdc-line);
    border-radius: 999px;
    background: transparent;
    color: var(--kdc-ink-soft);
    font-family: inherit;
    font-size: 11.5px;
    cursor: pointer;
    transition: all .16s;
}
.kdc-tag:hover { border-color: var(--kdc-teal); color: var(--kdc-teal-deep); }
.kdc-tag.is-on {
    border-color: transparent;
    background: var(--kdc-teal-deep);
    color: #ffffff;
    font-weight: 700;
    box-shadow: 0 10px 20px -14px rgba(6, 104, 90, .9);
}
[data-theme="dark"] .kdc-tag.is-on { background: var(--kdc-teal); color: #062b25; }

.kdc-age-tip {
    margin-top: 13px;
    padding: 11px 14px;
    border-left: 3px solid var(--kdc-amber);
    border-radius: 0 12px 12px 0;
    background: var(--kdc-amber-soft);
    color: #7a5410;
    font-size: 12.5px;
    line-height: 1.8;
}
[data-theme="dark"] .kdc-age-tip { color: #f0cf92; }

/* ---------- 主区 ---------- */
.kdc-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 366px;
    gap: 18px;
    align-items: start;
}
.kdc-layout > * { min-width: 0; }

.kdc-panel {
    position: relative;
    padding: 20px 22px 22px;
    border: 1px solid var(--kdc-line);
    border-radius: var(--kdc-radius);
    background: var(--kdc-card);
    box-shadow: var(--kdc-shadow);
}
.kdc-panel + .kdc-panel { margin-top: 16px; }
.kdc-panel h2 {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 800;
    font-style: normal;
    letter-spacing: -.3px;
    color: var(--kdc-ink);
}
.kdc-panel h2:not(:first-child) { margin-top: 22px; }
.kdc-panel p {
    margin: 0 0 10px;
    font-size: 13.5px;
    line-height: 1.95;
    color: var(--kdc-ink-soft);
}
.kdc-panel p b { color: var(--kdc-ink); }

.kdc-panel-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 12px;
    margin-bottom: 14px;
}
.kdc-panel-head h2 { margin: 0; }
.kdc-panel-head h2::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 9px;
    border-radius: 2px;
    background: var(--kdc-teal);
    vertical-align: 3px;
}
.kdc-panel-sub {
    font-size: 11.5px;
    color: var(--kdc-ink-faint);
    letter-spacing: .01em;
}
.kdc-panel-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}
.kdc-mini {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .1em;
    color: var(--kdc-ink-faint);
}

/* ---------- 表格 ---------- */
.kdc-table-wrap { width: 100%; overflow-x: auto; }
.kdc-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
}
.kdc-table th {
    padding: 0 9px 9px;
    border-bottom: 1px solid var(--kdc-line);
    color: var(--kdc-ink-faint);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .1em;
    text-align: left;
    white-space: nowrap;
}
.kdc-table td {
    padding: 10px 9px;
    border-bottom: 1px dashed var(--kdc-line-soft);
    vertical-align: middle;
    color: var(--kdc-ink);
}
.kdc-table tbody tr:last-child td { border-bottom: none; }
.kdc-table tbody tr:hover td { background: var(--kdc-soft); }
.kdc-table .c-num { text-align: right; white-space: nowrap; }
.kdc-table .c-check { width: 34px; text-align: center; padding-left: 0; padding-right: 0; }
.kdc-table .c-flag { width: 62px; text-align: center; }
.kdc-table .c-diff { text-align: right; white-space: nowrap; }

.kdc-table tbody tr.is-off td { color: var(--kdc-ink-faint); }
.kdc-table tbody tr.is-off .kdc-name { opacity: .62; }
.kdc-table tbody tr.is-off .kdc-input { background: var(--kdc-soft); color: var(--kdc-ink-faint); }

.kdc-name {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13.5px;
    font-weight: 600;
    color: inherit;
}
.kdc-name em {
    flex: none;
    padding: 1px 6px;
    border-radius: 5px;
    background: var(--kdc-teal-soft);
    color: var(--kdc-teal-deep);
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .04em;
}
.kdc-name em.is-treat { background: var(--kdc-coral-soft); color: #c2452f; }
[data-theme="dark"] .kdc-name em { color: var(--kdc-teal); }
[data-theme="dark"] .kdc-name em.is-treat { color: #ffb4a4; }

.kdc-sub {
    font-family: var(--kdc-num);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--kdc-ink);
}

/* ---------- 控件 ---------- */
.kdc-checkbox {
    width: 19px;
    height: 19px;
    margin: 0;
    border: 1.5px solid #b9d9d2;
    border-radius: 6px;
    background: #ffffff;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    transition: all .15s;
    vertical-align: middle;
}
.kdc-checkbox:hover { border-color: var(--kdc-teal); }
.kdc-checkbox:checked {
    border-color: var(--kdc-teal-deep);
    background: var(--kdc-teal-deep) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.4 8.5l3 3L12.7 5' fill='none' stroke='%23ffffff' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 13px no-repeat;
}
[data-theme="dark"] .kdc-checkbox { border-color: #2f5a53; background: #0d211e; }
[data-theme="dark"] .kdc-checkbox:checked { background-color: var(--kdc-teal); border-color: var(--kdc-teal); }
[data-theme="dark"] .kdc-checkbox:checked { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.4 8.5l3 3L12.7 5' fill='none' stroke='%23062b25' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }

.kdc-input {
    width: 84px;
    padding: 6px 8px;
    border: 1px solid var(--kdc-line);
    border-radius: 9px;
    background: var(--kdc-soft);
    color: var(--kdc-ink);
    font-family: var(--kdc-num);
    font-size: 12.5px;
    font-variant-numeric: tabular-nums;
    text-align: right;
    transition: border-color .16s, box-shadow .16s, background .16s;
}
.kdc-input:focus {
    outline: none;
    border-color: var(--kdc-teal);
    background: var(--kdc-card);
    box-shadow: 0 0 0 3px rgba(13, 157, 136, .16);
}
.kdc-input::-webkit-outer-spin-button,
.kdc-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.kdc-select {
    padding: 7px 26px 7px 10px;
    border: 1px solid var(--kdc-line);
    border-radius: 10px;
    background: var(--kdc-card) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%237b9993' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") right 9px center / 10px no-repeat;
    color: var(--kdc-ink);
    font-family: inherit;
    font-size: 12.5px;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}
.kdc-select--sm { padding: 4px 22px 4px 9px; font-size: 12px; background-size: 9px; }
.kdc-select:focus { outline: none; border-color: var(--kdc-teal); box-shadow: 0 0 0 3px rgba(13, 157, 136, .16); }

.kdc-flag {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 5px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .02em;
}
.kdc-flag.is-yes { background: var(--kdc-teal-soft); color: var(--kdc-teal-deep); }
.kdc-flag.is-no { background: var(--kdc-line-soft); color: var(--kdc-ink-faint); }
[data-theme="dark"] .kdc-flag.is-yes { color: var(--kdc-teal); }

/* ---------- 按钮 ---------- */
.kdc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 18px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .01em;
    text-decoration: none;
    cursor: pointer;
    transition: transform .16s, box-shadow .16s, background .16s, border-color .16s, color .16s;
}
.kdc-btn:active { transform: translateY(1px); }
.kdc-btn--teal {
    background: linear-gradient(135deg, var(--kdc-teal) 0%, var(--kdc-teal-deep) 100%);
    color: #ffffff;
    box-shadow: 0 14px 26px -18px rgba(6, 104, 90, .95);
}
.kdc-btn--teal:hover { box-shadow: 0 18px 32px -16px rgba(6, 104, 90, .85); transform: translateY(-1px); }
[data-theme="dark"] .kdc-btn--teal { color: #052420; }
.kdc-btn--line {
    border-color: var(--kdc-line);
    background: var(--kdc-card);
    color: var(--kdc-ink-soft);
}
.kdc-btn--line:hover { border-color: var(--kdc-teal); color: var(--kdc-teal-deep); background: var(--kdc-soft); }
.kdc-btn--sm { padding: 6px 12px; font-size: 12px; border-radius: 9px; }

.kdc-plan-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--kdc-line);
    font-size: 11.5px;
    line-height: 1.7;
    color: var(--kdc-ink-faint);
}

/* ---------- 费用收据（右侧） ---------- */
.kdc-panel--sum {
    position: sticky;
    top: 78px;
    padding: 0 0 18px;
    border-radius: 24px;
    background: var(--kdc-cream);
    box-shadow: var(--kdc-shadow-lg);
    overflow: hidden;
}
.kdc-panel--sum::before {
    content: "";
    display: block;
    height: 10px;
    background:
        radial-gradient(circle at 6px 0, var(--kdc-bg) 4.2px, var(--kdc-card) 4.4px) 0 0 / 15px 10px repeat-x;
}
.kdc-panel--sum > h2 {
    margin: 0;
    padding: 14px 22px 12px;
    border-bottom: 1px dashed var(--kdc-line);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .18em;
    color: var(--kdc-ink-faint);
}
.kdc-panel--sum > h2::before { display: none; }

.kdc-total { padding: 16px 22px 4px; }
.kdc-total span {
    display: block;
    font-size: 11px;
    letter-spacing: .12em;
    color: var(--kdc-ink-faint);
}
.kdc-total strong {
    display: block;
    margin: 4px 0 2px;
    font-family: var(--kdc-num);
    font-size: 38px;
    font-weight: 700;
    letter-spacing: -1.6px;
    line-height: 1.1;
    color: var(--kdc-ink);
    font-variant-numeric: tabular-nums;
}
.kdc-total em {
    display: block;
    font-size: 11.5px;
    font-style: normal;
    color: var(--kdc-ink-faint);
}

.kdc-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin: 14px 22px 0;
}
.kdc-split-item {
    position: relative;
    padding: 10px 12px 12px;
    border: 1px solid var(--kdc-line-soft);
    border-radius: 13px;
    background: var(--kdc-card);
    overflow: hidden;
}
.kdc-split-item span {
    display: block;
    font-size: 10.5px;
    letter-spacing: .08em;
    color: var(--kdc-ink-faint);
}
.kdc-split-item b {
    display: block;
    margin-top: 2px;
    font-family: var(--kdc-num);
    font-size: 17px;
    font-weight: 700;
    color: var(--kdc-teal-deep);
    font-variant-numeric: tabular-nums;
}
.kdc-split-item.is-treat b { color: #cf5636; }
[data-theme="dark"] .kdc-split-item.is-treat b { color: var(--kdc-coral); }
.kdc-split-item i {
    display: block;
    height: 4px;
    margin-top: 8px;
    border-radius: 999px;
    background: var(--kdc-teal);
    transition: width .4s ease;
}
.kdc-split-item.is-treat i { background: var(--kdc-coral); }

.kdc-reimb {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 14px 22px 0;
    padding: 12px 13px;
    border: 1px dashed var(--kdc-line);
    border-radius: 14px;
    background: rgba(255, 255, 255, .5);
}
[data-theme="dark"] .kdc-reimb { background: rgba(255, 255, 255, .03); }
.kdc-field2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
}
.kdc-field2 > label {
    flex: 1 1 auto;
    font-size: 11.5px;
    color: var(--kdc-ink-soft);
    white-space: nowrap;
}
.kdc-inline { display: flex; flex: none; align-items: center; gap: 5px; }
.kdc-inline span { font-size: 11.5px; color: var(--kdc-ink-faint); }
.kdc-reimb .kdc-input { width: 92px; flex: none; }

.kdc-money { margin: 14px 22px 0; padding: 0; list-style: none; }
.kdc-money li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 7px 0;
    border-bottom: 1px dashed var(--kdc-line-soft);
    font-size: 12.5px;
    color: var(--kdc-ink-soft);
}
.kdc-money li b {
    font-family: var(--kdc-num);
    font-size: 13px;
    font-weight: 700;
    color: var(--kdc-ink);
    font-variant-numeric: tabular-nums;
}
.kdc-money li.is-green b { color: var(--kdc-teal-deep); }
[data-theme="dark"] .kdc-money li.is-green b { color: var(--kdc-teal); }
.kdc-money li.is-strong {
    margin-top: 4px;
    padding-top: 11px;
    border-bottom: none;
    border-top: 1px solid var(--kdc-line);
    font-size: 13px;
    font-weight: 700;
    color: var(--kdc-ink);
}
.kdc-money li.is-strong b {
    font-size: 25px;
    letter-spacing: -.8px;
    color: #e2543a;
}
[data-theme="dark"] .kdc-money li.is-strong b { color: var(--kdc-coral); }

.kdc-year {
    margin: 12px 22px 0;
    padding: 11px 13px;
    border-radius: 13px;
    background: var(--kdc-teal-soft);
}
.kdc-year span {
    display: block;
    font-size: 10.5px;
    letter-spacing: .04em;
    color: var(--kdc-teal-deep);
    opacity: .78;
}
.kdc-year b {
    display: block;
    margin: 1px 0;
    font-family: var(--kdc-num);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.5px;
    color: var(--kdc-teal-deep);
    font-variant-numeric: tabular-nums;
}
.kdc-year em {
    display: block;
    font-size: 10.5px;
    font-style: normal;
    color: var(--kdc-teal-deep);
    opacity: .7;
}
[data-theme="dark"] .kdc-year b,
[data-theme="dark"] .kdc-year span,
[data-theme="dark"] .kdc-year em { color: var(--kdc-teal); }

.kdc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 22px 0;
}
.kdc-actions .kdc-btn--teal { flex: 1 1 100%; }

/* ---------- 长期预算 ---------- */
.kdc-long-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.kdc-long-cell {
    padding: 13px 14px;
    border: 1px solid var(--kdc-line-soft);
    border-radius: 15px;
    background: var(--kdc-soft);
}
.kdc-long-cell span {
    display: block;
    font-size: 10.5px;
    line-height: 1.5;
    color: var(--kdc-ink-faint);
}
.kdc-long-cell b {
    display: block;
    margin-top: 4px;
    font-family: var(--kdc-num);
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -.4px;
    color: var(--kdc-ink);
    font-variant-numeric: tabular-nums;
}
.kdc-long-cell.is-total {
    border-color: transparent;
    background: linear-gradient(135deg, var(--kdc-teal-deep) 0%, #0a8371 100%);
}
.kdc-long-cell.is-total span { color: rgba(255, 255, 255, .78); }
.kdc-long-cell.is-total b { color: #ffffff; font-size: 22px; }
[data-theme="dark"] .kdc-long-cell.is-total { background: linear-gradient(135deg, #0f4a42 0%, #146357 100%); }

.kdc-long-bar {
    display: flex;
    gap: 3px;
    height: 10px;
    margin-top: 14px;
    border-radius: 999px;
    background: var(--kdc-line-soft);
    overflow: hidden;
}
.kdc-long-bar i {
    display: block;
    height: 100%;
    border-radius: 999px;
    transition: width .45s ease;
}
.kdc-long-bar i:nth-child(1) { background: var(--kdc-teal); }
.kdc-long-bar i:nth-child(2) { background: #7fd5c6; }
.kdc-long-bar i:nth-child(3) { background: var(--kdc-coral); }

.kdc-long-note {
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.85;
    color: var(--kdc-ink-faint);
}

/* ---------- 比价表 ---------- */
.kdc-table--cmp td { font-variant-numeric: tabular-nums; }
.kdc-table--cmp tbody tr.is-best td { background: var(--kdc-teal-soft); }
.kdc-table--cmp tbody tr.is-best td:first-child { font-weight: 700; color: var(--kdc-teal-deep); }
.kdc-table--cmp tbody tr.is-best td:first-child::before {
    content: "";
    display: inline-block;
    width: 3px;
    height: 12px;
    margin-right: 7px;
    border-radius: 2px;
    background: var(--kdc-teal);
    vertical-align: -1px;
}
.kdc-table--cmp .is-best { color: var(--kdc-teal-deep); font-weight: 700; }
[data-theme="dark"] .kdc-table--cmp tbody tr.is-best td { background: rgba(61, 208, 182, .1); }

/* ---------- 口径说明 ---------- */
.kdc-note {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
}
.kdc-note th {
    width: 132px;
    padding: 12px 14px 12px 0;
    border-bottom: 1px dashed var(--kdc-line);
    color: var(--kdc-ink);
    font-size: 12.5px;
    font-weight: 700;
    text-align: left;
    vertical-align: top;
    white-space: nowrap;
}
.kdc-note td {
    padding: 12px 0;
    border-bottom: 1px dashed var(--kdc-line);
    color: var(--kdc-ink-soft);
    font-size: 12.5px;
    line-height: 1.9;
}
.kdc-note tr:last-child th,
.kdc-note tr:last-child td { border-bottom: none; padding-bottom: 0; }
.kdc-note td b { color: var(--kdc-ink); }

/* ---------- 标签页 ---------- */
.kdc-tabs {
    display: flex;
    gap: 4px;
    margin: 22px 0 0;
    padding: 0 4px;
    border-bottom: 1px solid var(--kdc-line);
    overflow-x: auto;
}
.kdc-tab {
    flex: none;
    padding: 11px 14px 12px;
    border: none;
    border-bottom: 2.5px solid transparent;
    border-radius: 8px 8px 0 0;
    background: transparent;
    color: var(--kdc-ink-faint);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: color .16s, border-color .16s, background .16s;
    white-space: nowrap;
}
.kdc-tab:hover { color: var(--kdc-ink); background: var(--kdc-soft); }
.kdc-tab.is-on { border-bottom-color: var(--kdc-teal); color: var(--kdc-teal-deep); font-weight: 700; }

.kdc-panel[data-kdc-panel] { display: none; margin-top: 14px; }
.kdc-panel[data-kdc-panel].is-on { display: block; }

.kdc-steps {
    margin: 0;
    padding-left: 20px;
    font-size: 13.5px;
    line-height: 1.95;
    color: var(--kdc-ink-soft);
}
.kdc-steps li { margin-bottom: 7px; }
.kdc-steps li::marker { color: var(--kdc-teal); font-weight: 700; }
.kdc-steps b { color: var(--kdc-ink); }

.kdc-timeline { margin: 0; padding: 0; list-style: none; }
.kdc-timeline li {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    padding: 11px 0;
    border-bottom: 1px dashed var(--kdc-line-soft);
    font-size: 12.5px;
    line-height: 1.85;
    color: var(--kdc-ink-soft);
}
.kdc-timeline li:last-child { border-bottom: none; }
.kdc-timeline .ver {
    padding: 0 9px;
    border-radius: 999px;
    background: var(--kdc-teal-soft);
    color: var(--kdc-teal-deep);
    font-size: 11.5px;
    font-weight: 700;
    line-height: 22px;
}
[data-theme="dark"] .kdc-timeline .ver { color: var(--kdc-teal); }
.kdc-timeline .date { color: var(--kdc-ink-faint); font-family: var(--kdc-num); font-size: 11.5px; }
.kdc-timeline .txt { flex: 1 1 260px; min-width: 0; }

.kdc-faq details {
    border: 1px solid var(--kdc-line-soft);
    border-radius: 13px;
    margin-bottom: 8px;
    padding: 0 14px;
    background: var(--kdc-card);
    transition: border-color .18s;
}
.kdc-faq details[open] { border-color: var(--kdc-line); background: var(--kdc-soft); }
.kdc-faq summary {
    padding: 12px 0;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--kdc-ink);
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: flex-start;
    gap: 9px;
}
.kdc-faq summary::-webkit-details-marker { display: none; }
.kdc-faq summary::before {
    content: "＋";
    flex: none;
    color: var(--kdc-teal);
    font-weight: 700;
    font-size: 14px;
    line-height: 1.4;
}
.kdc-faq details[open] summary::before { content: "－"; }
.kdc-faq .a {
    padding: 0 0 13px 23px;
    font-size: 13px;
    line-height: 1.9;
    color: var(--kdc-ink-soft);
}
.kdc-faq .a b { color: var(--kdc-ink); }

/* ---------- 相关工具 ---------- */
.kdc-related { margin-top: 26px; }
.kdc-related > h2 {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 800;
    font-style: normal;
    letter-spacing: -.2px;
}
.kdc-rel-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
}
.kdc-rel {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 14px;
    border: 1px solid var(--kdc-line);
    border-radius: 16px;
    background: var(--kdc-card);
    text-decoration: none;
    color: var(--kdc-ink);
    transition: transform .18s, border-color .18s, box-shadow .18s;
}
.kdc-rel:hover {
    border-color: var(--kdc-teal);
    transform: translateY(-2px);
    box-shadow: 0 18px 30px -24px rgba(6, 104, 90, .9);
}
.kdc-rel .ri {
    flex: none;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: var(--kdc-teal-soft);
    font-size: 17px;
}
.kdc-rel b { display: block; font-size: 13px; font-weight: 700; line-height: 1.4; }
.kdc-rel small { display: block; margin-top: 1px; font-size: 11.5px; line-height: 1.5; color: var(--kdc-ink-faint); }

/* ---------- toast ---------- */
.kdc-toast {
    position: fixed;
    left: 50%;
    bottom: 78px;
    z-index: 9999;
    padding: 11px 20px;
    border-radius: 12px;
    background: #0d2b27;
    color: #eaf8f5;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .7);
    opacity: 0;
    transform: translate(-50%, 12px);
    pointer-events: none;
    transition: opacity .24s, transform .24s;
}
.kdc-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* ---------- 打印稿（A4 预算单） ---------- */
.kdc-sheet { display: none; }
.kdc-sheet-in {
    font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
    color: #10302c;
    font-size: 12px;
    line-height: 1.7;
}
.kdc-sheet-title {
    margin-bottom: 3px;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: .5px;
    text-align: center;
}
.kdc-sheet-sub {
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 2px solid #10302c;
    color: #4d6a66;
    font-size: 11.5px;
    text-align: center;
}
.kdc-sheet-in h2 {
    margin: 14px 0 6px;
    padding-left: 8px;
    border-left: 3px solid #0d9d88;
    font-size: 12.5px;
    font-weight: 700;
}
.kdc-sheet-in table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11.5px;
}
.kdc-sheet-in th,
.kdc-sheet-in td {
    padding: 5px 7px;
    border-bottom: 1px solid #dbe9e6;
    text-align: left;
}
.kdc-sheet-in th { background: #f2f8f6; font-weight: 700; }
.kdc-sheet-in .r { text-align: right; font-variant-numeric: tabular-nums; }
.kdc-sheet-in .sum-row td { border-top: 1.5px solid #10302c; font-weight: 700; }
.kdc-sheet-kpi {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 10px 0 4px;
}
.kdc-sheet-kpi > div {
    padding: 8px 10px;
    border: 1px solid #dbe9e6;
    border-radius: 6px;
    background: #f8fcfb;
}
.kdc-sheet-kpi span { display: block; font-size: 10px; color: #4d6a66; }
.kdc-sheet-kpi strong { display: block; font-size: 15px; }
.kdc-sheet-note {
    margin-top: 12px;
    padding: 8px 10px;
    border-radius: 4px;
    background: #f5f9f8;
    color: #4d6a66;
    font-size: 10.5px;
    line-height: 1.7;
}
.kdc-sheet-sign {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 16px;
    padding-top: 10px;
    border-top: 1px dashed #b9d9d2;
    font-size: 11.5px;
    color: #10302c;
}

/* ---------- 响应式 ---------- */
@media (max-width: 1080px) {
    .kdc-layout { grid-template-columns: minmax(0, 1fr); }
    .kdc-panel--sum { position: static; }
    .kdc-hero { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 20px; padding: 26px 26px 24px; }
    .kdc-long-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .kdc-rel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
    .kdc-page { padding: 14px 0 44px; }
    .kdc-inner { padding: 0 14px; }
    .kdc-hero { grid-template-columns: minmax(0, 1fr); padding: 22px 18px 20px; border-radius: 22px; gap: 18px; }
    .kdc-hero::before { display: none; }
    .kdc-hero h1 { font-size: 27px; letter-spacing: -.6px; }
    .kdc-lead { font-size: 13.5px; line-height: 1.9; }
    .kdc-chips li { font-size: 11px; padding: 4px 9px; }
    .kdc-map { padding: 14px; border-radius: 18px; }
    .kdc-age { padding: 15px 16px 14px; border-radius: 18px; }
    .kdc-age-row { gap: 10px; }
    .kdc-age-tags { order: 4; width: 100%; }
    .kdc-tag { flex: 1 1 auto; }
    .kdc-panel { padding: 16px 15px 18px; border-radius: 18px; }
    .kdc-panel--sum { padding: 0 0 16px; }
    .kdc-panel--sum > h2 { padding: 12px 16px 10px; }
    .kdc-total { padding: 14px 16px 2px; }
    .kdc-total strong { font-size: 32px; }
    .kdc-split, .kdc-reimb, .kdc-money, .kdc-year, .kdc-actions { margin-left: 16px; margin-right: 16px; }
    .kdc-table { min-width: 560px; }
    .kdc-table th { padding-bottom: 8px; }
    .kdc-table td { padding: 9px 8px; }
    .kdc-input { width: 68px; }
    .kdc-plan-foot { font-size: 11px; }
    .kdc-note th { width: 92px; font-size: 12px; }
    .kdc-note td { font-size: 12px; line-height: 1.8; }
    .kdc-tabs { margin-top: 18px; gap: 0; padding: 0; }
    .kdc-tab { padding: 10px 10px 11px; font-size: 12.5px; }
    .kdc-related > h2 { font-size: 15px; }
    .kdc-rel { padding: 11px 12px; border-radius: 14px; }
    .kdc-rel .ri { width: 32px; height: 32px; border-radius: 10px; font-size: 15px; }
    .kdc-rel b { font-size: 12.5px; }
}

@media (max-width: 480px) {
    .kdc-long-grid { gap: 8px; }
    .kdc-long-cell { padding: 11px 12px; }
    .kdc-long-cell b { font-size: 17px; }
    .kdc-long-cell.is-total b { font-size: 19px; }
    .kdc-rel-grid { grid-template-columns: minmax(0, 1fr); }
    .kdc-hero-btns .kdc-btn { flex: 1 1 100%; }
    .kdc-actions .kdc-btn { flex: 1 1 100%; }
    .kdc-split { grid-template-columns: 1fr; }
}

/* ---------- 打印 ---------- */
@media print {
    .nav-header,
    .footer,
    .back-to-top,
    .detail-breadcrumb,
    #evadeFab,
    .evade-fab,
    #navEvadeBtn,
    .nav-evade-btn,
    #navMask,
    .nav-mask,
    .ma-page-modal,
    #clicaptcha-container,
    #ai-captcha-holder,
    .ai-captcha-guard { display: none !important; }

    .kdc-page { display: none !important; }

    .kdc-sheet {
        display: block !important;
        visibility: visible !important;
        padding: 12mm 12mm 10mm;
        background: #ffffff;
        color: #10302c;
    }
    .kdc-sheet * { visibility: visible !important; }

    @page { size: A4 portrait; margin: 8mm; }
}