/* Mobile presents one task at a time; the approved desktop compositions stay intact. */
#mobile-flow-nav,.mobile-profile-back { display:none; }
.decision-disclosure-summary { display:none; }
@media (min-width:701px) {
  .decision-disclosure,.decision-disclosure-content { display:contents; }
}
@media screen and (max-width:700px) {
  body[data-career-step] { padding-bottom:0; }
  body[data-career-step] .site-head {
    position:sticky; top:0; z-index:40; min-height:60px; padding:7px 14px;
    background:#171411; border-bottom:1px solid #54473b;
  }
  body[data-career-step] .site-head > .brand,
  body[data-career-step] .site-head > #steps { display:none; }
  #mobile-flow-nav { display:grid; grid-template-columns:84px 1fr 84px; align-items:center; width:100%; gap:6px; }
  .mobile-flow-back,.mobile-lab-home { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:9px 11px; border-radius:7px; font:600 15px/1.5 var(--brand-sans,sans-serif); text-decoration:none; }
  .mobile-flow-back { color:#fff7e9; background:#30271f; border:1px solid #685848; padding-inline:8px; white-space:nowrap; }
  .mobile-flow-back .flow-icon { width:19px; height:19px; flex-shrink:0; }
  .mobile-lab-home { justify-self:end; color:#d0c3ad; }
  .mobile-flow-current { display:flex; align-items:center; justify-content:center; gap:8px; color:#fff7e9; white-space:nowrap; }
  .mobile-flow-current strong { font:650 16px/1.4 var(--brand-sans,sans-serif); }
  .mobile-flow-current > span { font:400 12px/1.4 var(--brand-sans,sans-serif); color:#cbbfae; }
  body[data-career-step] #main { width:100%; margin:0; padding:16px 14px 12px; min-height:0; }
  body[data-career-step] .site-foot { margin:8px 14px 0; padding:16px 0 20px; }
  body[data-career-step] .site-foot .foot-note { display:none; }
  body[data-career-step] .evidence-note { margin:16px 0 0; font-size:13px; }
  body[data-career-step] .evidence-note > summary { padding:12px 0; }
  body[data-career-step] :is(button,a,summary,select):focus-visible { outline:2px solid #b83c2e; outline-offset:3px; }
  body[data-career-step] :is(h1,h2,h3,details,.career-card,.journey-detail) { scroll-margin-top:78px; }

  /* Keep money as the first choice, with the proof beneath it. */
  body[data-career-step="0"] #main { padding:12px 14px 16px; }
  .income-start { padding:18px 16px 0; }
  .income-intro > .eyebrow { font-size:12px; margin-bottom:8px; }
  .income-intro h1 { font-size:36px; line-height:1.2; }
  .income-intro > p { font-size:14px; }
  .home-proof-strip { margin-block:14px; }
  .home-proof-strip strong { font-size:22px; }
  .salary-grid { gap:10px; }
  .salary-option { min-height:128px; }

  /* Direction cards retain their characters without a page of empty canvas. */
  .family-toolbar { grid-template-columns:minmax(0,1fr) auto; gap:10px; margin-bottom:16px; }
  .family-toolbar h1 { grid-column:1; font-size:23px; line-height:1.35; }
  .family-toolbar h1 > span:first-child { display:none; }
  .family-choice-hint { display:none; }
  .family-toolbar .flow-filter-compact { grid-column:2; grid-row:1; }
  .flow-filter-compact > summary { min-height:44px; font-size:14px; padding:9px 10px; }
  .flow-filter-details .explore-filters { max-height:calc(100dvh - 180px); overflow:auto; }
  .flow-filter-details .explore-filters select { font-size:16px; min-height:44px; }
  .flow-filter-details .filter-chip,.flow-filter-details .filter-all { min-height:44px; font-size:14px; }
  .family-grid { --family-card-height:174px; gap:14px; }
  .family-card--illustrated { --portrait-size:160px; --portrait-pop:0px; --portrait-space:7px; padding:14px 16px; border-radius:10px; }
  .family-card--illustrated[data-family="testing-quality"] { --portrait-space:24px; }
  .family-card--illustrated .family-visual { top:6px; }
  .family-nickname { top:13px; left:16px; font-size:12px; }
  .family-career-copy { justify-content:center; gap:6px; padding-top:15px; }
  .family-card--illustrated h2 { max-width:65%; font-size:22px; line-height:1.25; }
  .family-card--illustrated .family-examples { max-width:62%; gap:1px; font-size:13px; line-height:1.5; font-weight:500; color:#675b4e; }
  .family-card--illustrated .family-scene { display:none; }

  /* Compact context and comparable cards: career, pay, education, experience. */
  .career-selection-head { gap:7px; margin-bottom:14px; padding-bottom:12px; }
  .career-selection-family { grid-template-columns:minmax(0,1fr) 70px; gap:10px; }
  .career-selection-mascot { width:70px; height:66px; }
  .career-selection-mascot img { width:82px; height:82px; top:-7px; }
  .career-selection h1 { margin-bottom:3px; font-size:26px; }
  .career-selection-caption { display:none; }
  .career-selection-controls { display:flex; align-items:center; justify-content:space-between; gap:8px; }
  .career-selection-context { display:flex; flex:1; align-items:center; flex-wrap:wrap; gap:4px 9px; }
  .career-selection-income,.career-selection-location { min-height:0; padding:0; border:0; border-radius:0; background:none; }
  .career-selection-income strong { font-size:15px; line-height:1.5; }
  .career-selection-location { font-size:13px; }
  .career-selection-actions { display:block; width:auto; }
  .career-selection-actions > .career-back-button { display:none; }
  .career-selection-actions .flow-filter-compact > summary { width:auto; min-height:44px; gap:6px; padding:9px; background:#faf5e8; border-color:#c6b79c; color:#594a3b; box-shadow:none; font-size:13px; }
  .career-selection-grid { gap:12px; }
  .career-selection .career-card { padding:17px; min-height:0; transform:none; }
  .career-selection .career-card::before { opacity:.28; }
  .career-card-top { gap:7px; }
  .career-selection .career-card h3 { font-size:23px; }
  .career-selection .career-card .salary { font-size:23px; }
  .career-selection .career-card .salary .unit { display:inline; margin:0 0 0 9px; font-size:12px; letter-spacing:0; }
  .career-selection .career-card .scene { display:none; }
  .career-selection .career-card .career-facts { margin-top:12px; padding-top:10px; gap:12px; }
  .career-selection .career-facts dt { font-size:12px; margin-bottom:4px; }
  .career-selection .career-facts dd { font-size:14px; line-height:1.5; }
  .career-selection .career-card:hover { transform:none; }

  /* Native modal keeps focus and blur, with an explicit text return. */
  .mobile-profile-back { display:inline-flex; align-items:center; align-self:flex-start; gap:7px; min-height:44px; padding:8px 12px; margin:12px 16px 0; color:#594a3b; background:#fff9ed; border:1px solid #c6b79c; border-radius:7px; font-size:15px; font-weight:600; }
  .career-profile-dialog .dialog-heading { padding-top:14px; }
  .career-profile-dialog .dialog-close { display:none; }
  .career-profile-dialog #profile-description { font-size:14px; }
  .career-profile-dialog .dialog-footer > span { display:none; }

  /* The personal answer leads. Source cards are available on request. */
  .career-result--focused .decision-page-header { margin-bottom:14px; }
  .decision-page-title h1 { font-size:28px; }
  .decision-page-title > p > strong { font-size:16px; }
  .decision-back { display:none; }
  .career-decision-layout { grid-template-columns:1fr; grid-template-areas:'next' 'overview' 'sources'; gap:12px; }
  .career-result--focused .career-next-step { padding:20px; min-height:0; border-radius:10px; }
  .career-result--focused .career-next-step .decision-card-title { position:static; max-width:none; padding:0; margin:0 0 17px; background:none; border:0; box-shadow:none; font-size:23px; color:#fff4df; }
  .decision-profile-summary { margin-bottom:15px; }
  .decision-profile-summary .decision-origin strong { font-size:15px; }
  .decision-profile-summary .decision-origin > span { font-size:13px; }
  .decision-profile-summary .decision-edit { min-height:44px; font-size:14px; }
  .decision-guidance { padding:13px; }
  .decision-guidance > span { font-size:12px; }
  .decision-guidance > p { font-size:17px; line-height:1.65; }
  .decision-route-benefits { display:none; }
  .decision-mobile-basis { margin:14px 0; color:#d7c5aa; font-size:12px; line-height:1.7; }
  .decision-route-action { position:static; border:0; padding:0; background:none; backdrop-filter:none; box-shadow:none; }
  .decision-route-action .route-door { min-height:64px; margin:0; padding:11px 14px; font-size:20px; }
  .decision-route-action .route-door small { font-size:12px; }
  .career-next-step .decision-explanation { margin-top:17px; padding-top:8px; }
  .decision-explanation > summary { padding:8px 0; font-size:13px; }
  .career-result--focused .career-overview,.career-result--focused .decision-sources { padding:0; min-height:0; border-radius:10px; }
  .decision-disclosure-summary { display:flex; flex-direction:column; gap:5px; position:relative; list-style:none; cursor:pointer; padding:17px 42px 17px 18px; }
  .decision-disclosure-summary::-webkit-details-marker { display:none; }
  .decision-disclosure-summary::after { content:''; position:absolute; top:27px; right:17px; width:18px; height:18px; background:url('./assets/icons/lucide/chevron-down.svg') center/contain no-repeat; }
  .decision-disclosure[open] > summary::after { transform:rotate(180deg); }
  .decision-disclosure-summary strong { font:700 20px/1.4 var(--serif); }
  .decision-disclosure-summary > span { color:#746656; font-size:13px; line-height:1.5; }
  .decision-sources .decision-disclosure-summary strong { color:#244e40; }
  .decision-sources .decision-disclosure-summary > span { color:#577366; }
  .decision-disclosure-content { padding:0 18px 18px; }
  .decision-disclosure-content .decision-card-title { display:none; }
  .decision-disclosure-content .decision-section-heading { margin-bottom:13px; }
  .decision-work > p,.career-work > p { font-size:15px; }
  .career-requirements dt,.career-requirements dd { font-size:14px; }
  .career-source-link { padding:14px; }
  .posting-company { font-size:13px; }
  .decision-common-foot > p { font-size:12px; line-height:1.7; }

  /* A route opens at the current task. The full map remains one tap away. */
  .journey-heading { display:grid; grid-template-columns:1fr; gap:0; margin-bottom:15px; }
  .journey-heading .eyebrow,.journey-lead { display:none; }
  .journey-heading h1 { font-size:27px; margin:0 0 7px; }
  .journey-target { display:grid; grid-template-columns:minmax(0,1fr) auto; text-align:left; gap:0 10px; padding:0; margin:0; border:0; }
  .journey-target > span:first-child { grid-column:1; font-size:12px; }
  .journey-target > strong { grid-column:1; grid-row:2; font-size:26px; margin:3px 0; }
  .journey-target > .journey-target-source { display:none; }
  .journey-save { grid-column:2; grid-row:1/3; align-self:center; min-height:44px; margin:0; padding:8px 10px; font-size:13px; }
  .journey-save .journey-icon { width:17px; height:17px; flex-basis:17px; }
  .journey-layout { display:flex; flex-direction:column; gap:14px; }
  .mobile-route-map { width:100%; border:1px solid #c5b798; border-radius:9px; background:#f9f2e3; }
  .mobile-route-map > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:72px; padding:13px 16px; list-style:none; cursor:pointer; }
  .mobile-route-map > summary::-webkit-details-marker { display:none; }
  .mobile-route-map > summary strong { display:block; font-size:16px; line-height:1.4; }
  .mobile-route-map > summary small { display:block; color:#786b57; margin-top:4px; font-size:12px; }
  .mobile-route-map > summary .journey-icon { width:20px; height:20px; transform:rotate(90deg); }
  .mobile-route-map[open] > summary .journey-icon { transform:rotate(-90deg); }
  .mobile-route-map .journey-board { border:0; border-top:1px solid #d8c9ae; border-radius:0 0 9px 9px; box-shadow:none; }
  .mobile-route-map .map-heading { display:none; }
  .journey-detail { width:100%; }
  .journey-detail-head { padding:17px 18px; }
  .journey-map-return { display:none; }
  .detail-kicker { font-size:12px; gap:8px; }
  .detail-status { font-size:12px; }
  .detail-title h2 { font-size:24px; }
  .journey-detail-content { padding:16px; }
  .detail-intro { font-size:15px; line-height:1.75; }
  .detail-summary { font-size:16px; }
  .module-list-label { font-size:13px; }
  .module-list-label > span:last-child { font-size:12px; }
  .journey-modules { gap:9px; }
  .journey-module { padding:0; box-shadow:none; }
  .module-accordion > summary { display:flex; align-items:center; gap:8px; min-height:58px; padding:13px; list-style:none; cursor:pointer; }
  .module-accordion > summary::-webkit-details-marker { display:none; }
  .module-accordion > summary::after { content:''; flex:0 0 16px; width:16px; height:16px; background:url('./assets/icons/lucide/chevron-down.svg') center/contain no-repeat; }
  .module-accordion[open] > summary::after { transform:rotate(180deg); }
  .module-accordion > summary h3 { margin:0 auto 0 0; font-size:18px; line-height:1.4; }
  .module-accordion > summary .module-stage { font-size:12px; }
  .module-accordion-body { padding:0 13px 14px; }
  .module-accordion-body > p { margin:0 0 12px; font-size:14px; line-height:1.7; color:#726656; }
  .module-actions > a,.module-actions > button { min-height:44px; font-size:13px; }
  .module-source,.module-note p { font-size:12px; }
  .journey-resources { margin:16px 0 0; }
  .journey-resources > summary strong { font-size:15px; }
  .journey-resources > summary > span { font-size:12px; }
  .journey-next { min-height:60px; }
  .journey-node-links a { font-size:15px; }
  .journey-node-links p { font-size:13px; }
  .journey-explanation,.journey-footnote { font-size:12px; }
  .journey-explanation summary { padding-block:9px; font-size:14px; }
}
@media screen and (max-width:370px) {
  #mobile-flow-nav { grid-template-columns:76px 1fr 52px; }
  .mobile-flow-current { gap:6px; }
  .mobile-flow-current strong { font-size:15px; }
  .family-card--illustrated { --portrait-size:140px; }
  .family-card--illustrated h2 { font-size:21px; }
  .journey-target > strong { font-size:23px; }
  .journey-save { padding-inline:8px; }
}
@media print { #mobile-flow-nav,.mobile-profile-back { display:none; } }