/* The same promise connects the income hook, the chosen target and the route. */
.income-intro { margin-bottom:0; }
.income-intro .income-promise { max-width:760px; margin-bottom:0; }
.income-promise strong { display:block; font:650 19px/1.6 var(--brand-sans); }
.income-promise > span { display:block; margin-top:3px; color:var(--muted); font:400 15px/1.6 var(--brand-sans); }
.income-start > .home-proof-strip { width:min(100%,590px); margin:14px auto 18px; }
.family-choice-hint { display:flex; flex-direction:column; align-items:flex-start; gap:2px; white-space:normal; }
.family-choice-hint strong { color:var(--red-dark); font-size:14px; font-weight:650; }
.family-choice-hint > span { color:var(--muted); font-size:13px; }
.career-profile-salary { display:block; margin-top:5px; letter-spacing:0; font:650 15px/1.5 var(--brand-sans); }

/* Each later step leads with an action and retains the selected target. */
.career-selection-direction {
  margin:0 0 7px; color:var(--red-dark); font:600 13px/1.5 var(--brand-sans);
}
.career-selection h1 { font-size:clamp(28px,2.6vw,36px); }
.career-selection-caption { font-size:14px; line-height:1.65; }
.decision-page-title { flex-direction:column; align-items:flex-start; gap:8px; }
.decision-page-title h1 { font-size:clamp(28px,2.7vw,37px); }
.decision-page-title > p > span.decision-target-role {
  display:inline; color:var(--ink); font:650 17px/1.5 var(--brand-sans);
}
.journey-heading .journey-role-target { font-size:13px; letter-spacing:0; }
.journey-lead { line-height:1.6; }
@media screen and (max-width:700px) {
  .income-start > .home-proof-strip { order:2; margin:16px auto 0; }
  .income-start > .salary-grid { order:1; margin-top:17px; }
  .income-start > .income-author { order:3; }
  .income-promise strong { font-size:16px; line-height:1.65; }
  .income-promise > span { margin-top:2px; font-size:13px; }
  .family-toolbar .family-choice-hint { display:flex; grid-column:1/-1; grid-row:2; margin-top:0; }
  .family-choice-hint strong { font-size:14px; }
  .family-choice-hint > span { font-size:13px; }
  .career-profile-salary { font-size:14px; }
  .career-selection-family { grid-template-columns:minmax(0,1fr) 60px; gap:8px; }
  .career-selection-mascot { width:60px; }
  .career-selection-mascot img { width:72px; height:82px; }
  .career-selection-direction { font-size:12px; margin-bottom:5px; }
  .career-selection h1 { font-size:24px; line-height:1.35; margin-bottom:6px; }
  .career-selection-caption { display:block; font-size:13px; line-height:1.65; }
  .career-selection-head { gap:12px; }
  .career-profile-dialog #profile-title { font-size:27px; line-height:1.35; }
  .decision-page-title h1 { font-size:26px; }
  .decision-page-title > p > span.decision-target-role { display:inline; font-size:16px; }
  .journey-heading .journey-role-target { display:block; font-size:13px; margin:0 0 6px; }
  .journey-heading h1 { font-size:27px; }
  .journey-lead { display:block; margin:0 0 12px; font-size:13px; line-height:1.6; }
}
@media screen and (max-width:370px) {
  .career-selection h1 { font-size:22px; }
}

/* Immediate feedback: two answers, one route action, then the evidence. */
body:has(.career-result--gap-feedback .decision-route-action) { padding-bottom:0; }
.career-result--gap-feedback .decision-page-header { margin-bottom:22px; }
.career-result--gap-feedback .career-decision-layout {
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-areas:'next next' 'overview sources'; gap:18px 22px;
}
.career-result--gap-feedback .career-decision-layout > .career-next-step {
  display:block; position:relative; top:auto; padding:0; min-height:0;
  border:0; background:none; box-shadow:none; color:var(--ink);
}
.decision-feedback-heading {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap;
}
.decision-gap-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.decision-gap-card {
  display:flex; flex-direction:column; min-width:0; padding:22px 24px 24px;
  color:#302b26; border:1px solid var(--gap-border); border-top:4px solid var(--gap-accent); border-radius:12px;
  background:var(--gap-surface); box-shadow:inset 0 1px #ffffffa6,0 3px 0 var(--gap-border),0 8px 22px #392d1c0a;
}
.education-gap {
  --gap-surface:#f7e9d2; --gap-border:#cfb48a; --gap-accent:#91602d; --gap-muted:#705b42;
}
.preparation-gap {
  --gap-surface:#e5edf4; --gap-border:#a7bacb; --gap-accent:#456c8a; --gap-muted:#4e6576;
}
.decision-gap-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:34px; }
.decision-gap-heading h3 { display:flex; align-items:center; gap:10px; margin:0; color:var(--gap-accent); font:700 24px/1.4 var(--serif); }
.decision-gap-heading h3 img { flex:0 0 25px; width:25px; height:25px; opacity:.72; }
.decision-gap-heading .decision-edit { flex-shrink:0; min-height:44px; margin:-5px -6px -5px 0; padding:8px 6px; color:var(--gap-muted); font-size:14px; }
.education-verdict,.ability-verdict { display:flex; align-items:center; gap:13px; margin:20px 0; }
.education-verdict strong,.ability-verdict strong { min-width:0; font:700 24px/1.4 var(--brand-sans); }
.education-state-icon,.ability-state-icon { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; border-radius:50%; }
.education-state-icon svg { width:28px; height:28px; }
[data-education-state='done'] .education-state-icon { color:#2f644e; background:#dcebdd; }
[data-education-state='todo'] .education-state-icon { color:#a33227; background:#f3ddd2; }
[data-education-state='progress'] .education-state-icon,
[data-education-state='verify'] .education-state-icon { color:#805920; background:#f0e3c3; }
.education-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:0; gap:18px; }
.education-comparison > div + div { padding-left:18px; border-left:1px solid var(--gap-border); }
.education-comparison dt { color:var(--gap-muted); font-size:13px; }
.education-comparison dd { margin:6px 0 0; font:650 18px/1.55 var(--brand-sans); }
.education-next { margin:20px 0 0; color:var(--gap-muted); font-size:14px; line-height:1.7; }
.preparation-directions { margin:0; display:grid; gap:15px; }
.preparation-directions dt { color:var(--gap-muted); font-size:13px; line-height:1.6; }
.preparation-directions dt > span { margin-left:10px; }
.preparation-directions dd { margin:4px 0 0; font:600 16px/1.6 var(--brand-sans); }
.ability-state-icon { color:#355e7b; background:#ccdde9; font:650 26px/1 var(--brand-sans); }
.career-result--gap-feedback .decision-route-action {
  position:static; padding:0; margin-top:24px; border:0; background:none; box-shadow:none; backdrop-filter:none;
}
.career-result--gap-feedback .decision-route-action .route-door {
  min-height:76px; max-width:620px; padding:13px 20px; margin:0 auto;
  color:#fffaf0; background:#a73528; border-color:#8e2b21; font-size:24px;
  box-shadow:inset 0 1px #d56f5a,0 3px 0 #76241c,0 8px 18px #a735281c;
}
.career-result--gap-feedback .decision-route-action .route-door small { color:#ffebdb; }
.career-result--gap-feedback .decision-route-action .route-door:hover { background:#922b21; }
.career-result--gap-feedback .route-door:active { transform:translateY(1px); }
.career-result--gap-feedback .career-next-step .decision-explanation {
  margin:14px 0 0; padding:0; border:0; color:#665440;
}
.career-result--gap-feedback .decision-explanation > summary { display:list-item; min-height:44px; padding:12px 2px; color:#665440; font-size:13px; }
.career-result--gap-feedback .decision-explanation > p,
.career-result--gap-feedback .decision-explanation .small { color:#665440; }
.career-result--gap-feedback .decision-explanation .career-path-choice { color:#463628; background:#f8f0df; border-color:#c8b694; }
.career-result--gap-feedback .decision-explanation .career-path-choice span { color:#756049; }
.career-result--gap-feedback .decision-explanation .career-path-choice.selected { color:#fff5df; background:#463628; border-color:#463628; }
.career-result--gap-feedback .decision-explanation .career-path-choice.selected span { color:#e9d9bc; }
.career-result--gap-feedback :is(.career-overview,.decision-sources) { padding:0; border-radius:10px; }
.career-result--gap-feedback :is(.decision-disclosure,.decision-disclosure-content) { display:block; }
.career-result--gap-feedback .decision-disclosure-summary {
  display:flex; flex-direction:column; gap:4px; position:relative; list-style:none;
  padding:17px 44px 17px 20px; cursor:pointer;
}
.career-result--gap-feedback .decision-disclosure-summary::-webkit-details-marker { display:none; }
.career-result--gap-feedback .decision-disclosure-summary::after {
  content:''; position:absolute; top:25px; right:18px; width:18px; height:18px;
  background:url('./assets/icons/lucide/chevron-down.svg') center/contain no-repeat;
}
.career-result--gap-feedback .decision-disclosure[open] > summary::after { transform:rotate(180deg); }
.career-result--gap-feedback .decision-disclosure-summary strong { font:700 21px/1.4 var(--serif); }
.career-result--gap-feedback .decision-disclosure-summary > span { font-size:12px; color:#746656; }
.career-result--gap-feedback .decision-disclosure-content { padding:0 20px 20px; }
.career-result--gap-feedback .decision-disclosure-content .decision-card-title,
.career-result--gap-feedback .decision-flow-arrow { display:none; }
.career-result--gap-feedback .decision-section-heading { margin-bottom:14px; }
.career-result--gap-feedback .decision-source-intro { margin-left:auto; }
.career-result--gap-feedback :is(button,summary):focus-visible { outline:3px solid #a9372a; outline-offset:4px; }
@media screen and (max-width:700px) {
  body:has(.career-result--gap-feedback .decision-route-action) { padding-bottom:calc(112px + env(safe-area-inset-bottom,0px)); }
  html:has(.career-result--gap-feedback .decision-route-action) { scroll-padding-bottom:calc(120px + env(safe-area-inset-bottom,0px)); }
  .career-result--gap-feedback .decision-page-header { margin-bottom:14px; }
  .career-result--gap-feedback .decision-page-title h1 { font-size:26px; }
  .career-result--gap-feedback .career-decision-layout { grid-template-columns:1fr; grid-template-areas:'next' 'overview' 'sources'; gap:12px; }
  .decision-gap-grid { grid-template-columns:1fr; gap:14px; }
  .decision-gap-card { padding:14px 18px 16px; border-radius:10px; }
  .decision-gap-heading h3 { font-size:21px; }
  .decision-gap-heading h3 img { flex-basis:22px; width:22px; height:22px; }
  .education-verdict,.ability-verdict { margin:13px 0 15px; gap:11px; }
  .education-verdict strong,.ability-verdict strong { font-size:20px; }
  .education-state-icon,.ability-state-icon { flex-basis:36px; width:36px; height:36px; }
  .education-state-icon svg { width:24px; height:24px; }
  .education-comparison { gap:12px; }
  .education-comparison > div + div { padding-left:12px; }
  .education-comparison dd { margin-top:3px; font-size:16px; }
  .education-next { margin-top:12px; font-size:12px; line-height:1.7; }
  .preparation-directions { gap:11px; }
  .ability-state-icon { font-size:22px; }
  .preparation-directions dt > span { display:block; margin-left:0; }
  .preparation-directions dd { font-size:15px; line-height:1.55; }
  .career-result--gap-feedback .decision-route-action {
    position:fixed; z-index:40; inset:auto 0 0; margin:0;
    padding:10px 14px calc(14px + env(safe-area-inset-bottom,0px));
    border-top:1px solid #d7c7a8; background:#f8f1e3f5;
    box-shadow:0 -5px 24px #49331e10; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  }
  .career-result--gap-feedback .decision-route-action .route-door { min-height:74px; padding:10px 18px; font-size:24px; }
  .career-result--gap-feedback .decision-route-action .route-door small { font-size:13px; line-height:1.5; }
  .career-result--gap-feedback :is(button,summary,a) { scroll-margin-bottom:calc(120px + env(safe-area-inset-bottom,0px)); }
  .career-result--gap-feedback .career-next-step .decision-explanation { margin-top:10px; }

  /* The phone map is a station selector; the desktop keeps its illustrated map. */
  .career-journey .journey-lead { display:block; margin:0 0 12px; font-size:13px; }
  .mobile-route-map > summary { min-height:58px; padding:10px 15px; }
  .mobile-route-map > summary small { margin-top:2px; }
  .mobile-route-map .journey-board { position:static; }
  .mobile-route-map .route-start,
  .mobile-route-map .road-connections,
  .mobile-route-map .map-footnote { display:none; }
  .mobile-route-map .journey-map { height:auto; margin:10px 14px 14px; }
  .mobile-route-map .journey-education { margin:14px 14px 0; }
  .mobile-route-map .journey-education > p { margin:7px 0; font-size:12px; }
  .mobile-route-map .road-nodes { display:grid; grid-template-columns:1fr; gap:9px; padding:0; }
  .mobile-route-map .map-node {
    position:relative; left:auto; top:auto; width:100%; min-height:70px;
    display:grid; grid-template-columns:34px minmax(0,1fr); gap:3px 10px;
    padding:11px 13px; border-radius:8px; transform:none; box-shadow:none;
  }
  .mobile-route-map .map-node:hover { transform:none; }
  .mobile-route-map .station-top { grid-column:1; grid-row:1/3; display:flex; flex-direction:column; justify-content:center; gap:3px; margin:0; }
  .mobile-route-map .station-top .journey-icon { width:18px; height:18px; flex-basis:18px; }
  .mobile-route-map .station-index { font-size:10px; line-height:1.3; text-align:center; }
  .mobile-route-map .station-title { grid-column:2; grid-row:1; font-size:16px; line-height:1.45; padding-right:0; }
  .mobile-route-map .station-state { grid-column:2; grid-row:2; margin:0; max-width:none; font-size:12px; }
  .mobile-route-map .station-priority { display:none; }
  .mobile-route-map .map-node.is-current .station-state::after { content:' · 建议先看'; }
}

/* Income changes return to the familiar first step; no filter popover to close. */
.family-toolbar .income-change-button { justify-self:end; align-self:center; }
@media (min-width:701px) and (max-width:1100px) {
  .family-toolbar .income-change-button { grid-column:2; }
}
@media (max-width:700px) {
  .family-toolbar .income-change-button { grid-column:2; grid-row:1; padding:9px 10px; font-size:14px; min-height:44px; }
  .career-selection-actions > .income-change-button { display:inline-flex; min-height:44px; padding:9px 10px; font-size:14px; }
}