@import url("assets/vendor/noto-sans-sc/wght.css");
/* Scoped calculator additions: preserve the site's existing service designs. */
html:lang(zh) :is(.ilc-page, .ilc-hub, .ilc-context),
html:lang(zh) :is(.ilc-page, .ilc-hub, .ilc-context) :is(h1,h2,h3) { font-family: "Noto Sans SC Variable", sans-serif; }
.ilc-page, .ilc-hub, .ilc-context { --ilc-red: #bd1930; --ilc-ink: #252b37; --ilc-muted: #596273; color: var(--ilc-ink); }
.ilc-page { padding: 160px 0 90px; background: radial-gradient(ellipse at 96% 16%, #fce6e870, transparent 40%), radial-gradient(ellipse at 0 40%, #e7edf780, transparent 40%); }
.ilc-page [hidden], .ilc-context [hidden] { display: none !important; }
.ilc-page :is(h1,h2,h3,p), .ilc-hub :is(h2,h3,p), .ilc-context :is(h3,p) { overflow-wrap: anywhere; }
.ilc-page p, .ilc-hub p, .ilc-context p { line-height: 1.7; }
.ilc-page :is(button,input,a,summary):focus-visible, .ilc-hub a:focus-visible, .ilc-context :is(a,button):focus-visible { outline: 3px solid #9b1930; outline-offset: 4px; }
.ilc-breadcrumb { display: flex; gap: 12px; font-size: .95rem; margin-bottom: 28px; }
.ilc-breadcrumb a { color: var(--ilc-muted); text-decoration: none; }
.ilc-breadcrumb a:hover { color: var(--ilc-red); text-decoration: underline; }
.ilc-kicker { display: block; color: var(--ilc-red); font-size: .82rem; font-weight: 800; letter-spacing: .06em; margin-bottom: 12px; }
.ilc-hero { max-width: 900px; margin-bottom: 38px; }
.ilc-hero h1 { font-size: clamp(2rem, 3.8vw, 3.35rem); font-weight: 800; line-height: 1.17; letter-spacing: -.035em; margin: 0 0 20px; }
.ilc-hero > p { color: var(--ilc-muted); font-size: 1.12rem; max-width: 780px; margin: 0; }
.ilc-glass { border: 1px solid rgba(255,255,255,.92); border-radius: 26px; background: radial-gradient(ellipse at 12% 0, rgba(255,255,255,.9), transparent 55%), linear-gradient(135deg, rgba(255,255,255,.66), rgba(250,250,253,.52)); box-shadow: inset 0 1.5px 0 #fff, inset 0 -1px 0 #49506012, 0 14px 42px #2028380c; -webkit-backdrop-filter: blur(18px) saturate(155%); backdrop-filter: blur(18px) saturate(155%); }
.ilc-layout { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,1fr); gap: 26px; align-items: start; }
.ilc-form, .ilc-results { padding: 30px; min-width: 0; }
.ilc-page h2 { font-size: 1.45rem; font-weight: 750; line-height: 1.35; margin-bottom: 12px; }
.ilc-page h3 { font-size: 1.13rem; font-weight: 750; line-height: 1.45; }
.ilc-note { color: var(--ilc-muted); font-size: .92rem; line-height: 1.65; }
.ilc-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 23px 18px; margin-top: 26px; }
.ilc-field { min-width: 0; }
.ilc-field-section { grid-column: 1 / -1; border-top: 1px solid #dce1e8; padding-top: 24px; }
.ilc-field-section:first-child { border-top: 0; padding-top: 0; }
.ilc-field-section h3 { margin: 0 0 6px; }
.ilc-field-section p { margin: 0; font-size: .84rem; }
.ilc-page .ilc-warning { color: #a51127; }
.ilc-field label { display: block; font-size: .98rem; line-height: 1.4; font-weight: 650; margin-bottom: 9px; }
.ilc-input-wrap { display: flex; align-items: center; border: 1px solid #c4cbd5; background: #ffffffc9; border-radius: 12px; overflow: hidden; min-height: 52px; }
.ilc-input-wrap:focus-within { border-color: var(--ilc-red); box-shadow: 0 0 0 3px #bd193010; }
.ilc-input-wrap:has(input[aria-invalid="true"]) { border-color: #ab182d; }
.ilc-input-wrap > span { color: var(--ilc-muted); font-size: .9rem; padding: 0 12px; flex-shrink: 0; }
.ilc-input-wrap input { width: 100%; min-width: 0; font-family: inherit; font-size: 1.12rem; font-weight: 650; padding: 13px 10px; color: var(--ilc-ink); border: 0; background: transparent; border-radius: 10px; outline-offset: -3px !important; }
.ilc-hint { display: block; font-size: .8rem; color: var(--ilc-muted); line-height: 1.6; margin-top: 7px; }
.ilc-hint:empty { display: none; }
.ilc-error { display: block; color: #a51127; font-size: .88rem; line-height: 1.55; margin: 8px 0 0; }
.ilc-actions { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; margin-top: 26px; }
.ilc-primary, .ilc-secondary { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 13px 21px; border-radius: 999px; font-family: inherit; font-size: .97rem; font-weight: 750; text-decoration: none; line-height: 1.4; text-align: center; transition: background .15s, box-shadow .15s; }
.ilc-primary { color: #fff; border: 1px solid var(--ilc-red); background: linear-gradient(135deg,#d52b41,#b6162c); box-shadow: inset 0 1px 0 #ffffff40, 0 5px 15px #bd193023; }
.ilc-primary:hover { color: #fff; background: #ab152a; box-shadow: 0 7px 18px #bd19302e; }
.ilc-primary:disabled { opacity: .55; cursor: not-allowed; }
.ilc-secondary { color: var(--ilc-red); border: 1px solid #cf596960; background: #ffffff88; }
.ilc-secondary:hover { background: #fff1f3; color: #951326; }
.ilc-text-button { border: 0; padding: 10px 0; color: var(--ilc-muted); background: transparent; text-decoration: underline; text-underline-offset: 4px; font: inherit; font-size: .89rem; min-height: 44px; }
.ilc-privacy { border-top: 1px solid #dbe0e6; padding-top: 20px; margin: 24px 0 0; font-size: .83rem; }
.ilc-results { border-color: #ffffff; }
.ilc-results .ilc-kicker { color: var(--ilc-muted); font-size: .74rem; letter-spacing: .02em; }
.ilc-headline { margin: 22px 0 18px; padding: 22px; background: linear-gradient(140deg,#fff0f2c9,#ffffff57); border: 1px solid #fff; border-radius: 18px; }
.ilc-headline > span { display: block; font-size: .98rem; font-weight: 600; }
.ilc-headline > strong { display: block; color: var(--ilc-red); font-size: clamp(1.8rem,2.8vw,2.65rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.25; margin-top: 8px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.ilc-result-message { font-size: .95rem; color: #375342; }
.ilc-stats { margin: 0; }
.ilc-stats > div { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); align-items: baseline; gap: 16px; padding: 12px 0; border-bottom: 1px solid #dce0e780; }
.ilc-stats dt { font-size: .87rem; color: var(--ilc-muted); font-weight: 500; line-height: 1.5; }
.ilc-stats dd { text-align: right; font-weight: 750; font-size: .97rem; margin: 0; line-height: 1.5; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.ilc-topup { padding: 20px; border: 1px solid #dce1e8; border-radius: 18px; margin-top: 22px; background: #fff9; }
.ilc-topup > strong { display: inline-block; color: var(--ilc-red); font-size: 1.65rem; line-height: 1.4; font-weight: 800; margin-right: 8px; overflow-wrap: anywhere; }
.ilc-topup > p { margin: 14px 0 0; font-size: .84rem; }
.ilc-result-note { margin-top: 24px; font-size: .84rem; }
.ilc-result-cta { border-top: 1px solid #dce1e8; padding-top: 23px; margin-top: 23px; }
.ilc-result-cta > p { color: var(--ilc-muted); font-size: .95rem; }
.ilc-result-cta .ilc-primary { width: 100%; }
.ilc-projection { margin-top: 28px; padding: 30px; }
.ilc-legend { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 22px 0; font-size: .9rem; }
.ilc-legend span { display: inline-flex; align-items: center; gap: 10px; }
.ilc-legend span::before { content: ''; width: 25px; border-top: 3px solid #b71930; }
.ilc-legend .ilc-legend-target::before { border-color: #6a7689; border-top-style: dashed; }
.ilc-chart-frame { display: grid; grid-template-columns: 82px minmax(0,1fr); gap: 12px; height: 240px; }
.ilc-y-axis { display: flex; flex-direction: column; justify-content: space-between; font-size: .8rem; color: var(--ilc-muted); text-align: right; padding: 0 0 4px; }
.ilc-chart-frame svg { display: block; width: 100%; height: 240px; min-height: 0; overflow: visible; }
.ilc-grid-line { stroke: #dee2e8; stroke-width: 1; }
.ilc-chart-fill { fill: #bd193009; }
.ilc-line-saved { fill: none; stroke: #b71930; stroke-width: 3; }
.ilc-line-target { fill: none; stroke: #6a7689; stroke-width: 2.5; stroke-dasharray: 7 5; }
.ilc-x-axis { display: flex; justify-content: space-between; margin: 6px 0 0 94px; font-size: .85rem; color: var(--ilc-muted); }
.ilc-projection details { margin-top: 24px; }
.ilc-page summary { cursor: pointer; font-weight: 700; line-height: 1.5; padding: 8px 0; }
.ilc-page summary::marker { color: var(--ilc-red); }
.ilc-table-wrap { max-height: 360px; overflow: auto; margin-top: 15px; border: 1px solid #dce1e8; border-radius: 10px; }
.ilc-table-wrap table { width: 100%; border-collapse: collapse; font-size: .87rem; }
.ilc-table-wrap :is(th,td) { padding: 12px; border-bottom: 1px solid #e2e5ea; text-align: right; white-space: nowrap; }
.ilc-table-wrap tr > :first-child { text-align: left; }
.ilc-table-wrap thead { background: #f1f3f7; }
.ilc-bars { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin: 20px 0 0; }
.ilc-bars dt { color: var(--ilc-muted); font-size: .93rem; font-weight: 500; }
.ilc-bars dd { font-size: 1.25rem; font-weight: 750; margin-top: 8px; overflow-wrap: anywhere; }
.ilc-bar-track { background: #e2e6ed; height: 10px; border-radius: 8px; overflow: hidden; }
.ilc-bar-track span { height: 100%; display: block; border-radius: 8px; }
.ilc-bar-target { background: #bd1930; }
.ilc-bar-saved { background: #66768d; }
.ilc-explain { margin-top: 28px; display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 26px; }
.ilc-explain details { padding: 20px 26px; min-width: 0; }
.ilc-explain ul { padding-left: 20px; margin: 18px 0 8px; }
.ilc-explain :is(li,p) { color: var(--ilc-muted); font-size: .9rem; line-height: 1.75; }
.ilc-explain li { margin-bottom: 14px; }
.ilc-explain > details > p { margin: 14px 0; }
.ilc-references a { color: var(--ilc-red); font-weight: 700; }
.ilc-references p { margin-top: 5px; }
.ilc-notice { padding: 25px; margin-bottom: 25px; }
.ilc-hub { padding: 80px 0; scroll-margin-top: 140px; }
.ilc-hub-heading { text-align: center; max-width: 780px; margin: 0 auto 32px; }
.ilc-hub-heading h2 { font-size: clamp(1.75rem,3vw,2.5rem); font-weight: 800; letter-spacing: -.025em; }
.ilc-hub-heading p { color: var(--ilc-muted); font-size: 1rem; }
.ilc-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.ilc-hub:not(.ilc-teaser) .ilc-card-grid { grid-template-columns: repeat(6,minmax(0,1fr)); }
.ilc-hub:not(.ilc-teaser) .ilc-link-card { grid-column: span 2; }
.ilc-hub:not(.ilc-teaser) .ilc-link-card--retirement { grid-column: 2 / span 2; }
.ilc-presets { margin: 18px 0 0; padding: 0; min-width: 0; border: 0; }
.ilc-presets legend { float: none; width: auto; margin-bottom: 9px; font-size: .88rem; font-weight: 700; }
.ilc-preset-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.ilc-preset { display: inline-flex; flex-direction: column; align-items: start; gap: 3px; padding: 10px 12px; min-height: 48px; border: 1px solid #c8cfd8; border-radius: 12px; background: #ffffffb8; color: var(--ilc-ink); font-family: inherit; font-size: .82rem; font-weight: 650; }
.ilc-preset span { color: var(--ilc-muted); font-size: .8rem; font-weight: 500; }
.ilc-preset:hover, .ilc-preset[aria-pressed="true"] { border-color: var(--ilc-red); background: #fff1f3; color: var(--ilc-red); }
.ilc-link-card { padding: 30px; display: flex; flex-direction: column; align-items: start; gap: 18px; }
.ilc-card-icon { color: var(--ilc-red); font-size: 1.7rem; }
.ilc-link-card h3 { font-size: 1.35rem; font-weight: 750; line-height: 1.4; }
.ilc-link-card p { color: var(--ilc-muted); font-size: .98rem; margin: 12px 0 0; }
.ilc-link-card .ilc-secondary { margin-top: auto; }
.ilc-teaser { padding: 25px 0 65px; }
.ilc-teaser .ilc-card-grid { display: block; }
.ilc-teaser .ilc-link-card { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 24px; }
.ilc-teaser .ilc-secondary { margin-top: 0; }
.ilc-context { padding: 25px; margin: 24px 0 28px; }
.ilc-context h3 { font-size: 1.3rem; font-weight: 750; }
.ilc-context > p { margin-bottom: 12px; font-size: .95rem; }
.ilc-context-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; margin: 20px 0; }
.ilc-context-stats dt { font-size: .85rem; color: var(--ilc-muted); font-weight: 500; }
.ilc-context-stats dd { font-size: 1.15rem; font-weight: 750; margin: 5px 0 0; overflow-wrap: anywhere; }
.profile-page .ilc-context-stats, .profile-hero-card .ilc-context-stats { grid-template-columns: 1fr; gap: 12px; }
.ilc-context .ilc-actions { margin-top: 15px; }
@media (max-width: 1199.98px) { .ilc-fields { grid-template-columns: 1fr; } .ilc-form, .ilc-results { padding: 25px; } }
@media (max-width: 767.98px) {
    .ilc-page { padding: 132px 0 55px; }
    .ilc-hero { margin-bottom: 26px; }
    .ilc-hero > p { font-size: 1.02rem; }
    .ilc-layout, .ilc-explain { grid-template-columns: 1fr; gap: 22px; }
    .ilc-form, .ilc-results, .ilc-projection { padding: 23px 20px; border-radius: 22px; }
    .ilc-fields { gap: 20px; }
    .ilc-field label { font-size: 1rem; }
    .ilc-input-wrap input { font-size: 1.1rem; }
    .ilc-headline { padding: 20px 16px; }
    .ilc-headline > strong { font-size: 2.05rem; }
    .ilc-stats > div { gap: 12px; }
    .ilc-topup { padding: 18px 15px; }
    .ilc-chart-frame { height: 220px; grid-template-columns: 65px minmax(0,1fr); gap: 8px; }
    .ilc-y-axis { font-size: .7rem; }
    .ilc-chart-frame svg { height: 220px; }
    .ilc-x-axis { margin-left: 73px; }
    .ilc-bars { grid-template-columns: 1fr; gap: 22px; }
    .ilc-explain details { padding: 16px 20px; }
    .ilc-card-grid { grid-template-columns: 1fr; }
    .ilc-hub:not(.ilc-teaser) .ilc-card-grid { grid-template-columns: 1fr; }
    .ilc-hub:not(.ilc-teaser) .ilc-link-card { grid-column: auto; }
    .ilc-hub { padding: 50px 0; }
    .ilc-link-card { padding: 26px; }
    .ilc-teaser .ilc-link-card { grid-template-columns: auto minmax(0,1fr); }
    .ilc-teaser .ilc-secondary { grid-column: 1 / -1; justify-self: start; }
    .ilc-context-stats { grid-template-columns: 1fr; gap: 14px; }
    .ilc-context { padding: 22px 18px; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .ilc-glass { background: #f9fafc; border-color: #dce1e8; } }
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) { .ilc-glass { background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; border-color: #949dab; } }
@media (prefers-reduced-motion: reduce) { .ilc-primary, .ilc-secondary { transition: none; } }

/* The extra navigation link uses the existing collapsed menu on small laptops,
   keeping the established text size and preventing long translations clipping. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .liquid-glass-navbar #navbar {
        position: absolute; top: calc(100% + 8px); left: 0; right: 0;
        padding: 18px; border: 1px solid #fff; border-radius: 24px;
        max-height: calc(100dvh - 130px); overflow-y: auto !important;
        background: linear-gradient(135deg,rgba(255,255,255,.97),rgba(246,247,250,.95));
        box-shadow: inset 0 1px 0 #fff, 0 12px 30px #20253626;
        backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
    }
    .liquid-glass-navbar .liquid-nav { display: block; padding: 0; }
    .liquid-glass-navbar #liquidNavLens { display: none !important; }
    .liquid-glass-navbar .liquid-nav .nav-link { padding: 11px 14px !important; min-height: 44px; }
    .liquid-glass-navbar .liquid-nav .nav-link.active { background: #bd19300b !important; border-radius: 12px; }
    .liquid-glass-navbar .sp-language { margin: 12px 0 4px; width: 100%; }
    .liquid-glass-navbar .sp-language-button { width: 100%; justify-content: space-between; }
    .liquid-glass-navbar .sp-language-menu { left: 0; right: auto; position: relative; top: auto; width: 100%; max-height: 0; margin-top: 0; padding-top: 0; padding-bottom: 0; transform: none; }
    .liquid-glass-navbar .sp-language.open .sp-language-menu { max-height: 220px; margin-top: 9px; padding: 10px; }
    .liquid-glass-navbar .custom-toggler { min-width: 44px; min-height: 44px; }
}