/* Every rule is scoped to the explainer; no site-wide menu or body styles. */
.b12-mobility-explainer {
  --ink:#1e3042; --muted:#45596a; --accent:#12647a; --rule:#c7d5dc;
  box-sizing:border-box; width:100%; max-width:920px; margin:0 auto;
  padding:54px 38px 72px; color:var(--ink); background:#fff;
  font-family:"Noto Sans CJK KR","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic", "NanumGothic",sans-serif;
  font-size:19px; line-height:1.9; word-break:keep-all; overflow-wrap:break-word;
  text-align:left; -webkit-text-size-adjust:100%;
}
.b12-mobility-explainer *, .b12-mobility-explainer *::before,
.b12-mobility-explainer *::after {box-sizing:border-box;}
.b12-mobility-explainer h1 {font-size:clamp(31px,4vw,46px); line-height:1.35; letter-spacing:-.055em; margin:0 0 20px; color:#142c3c; font-weight:800;}
.b12-mobility-explainer h2 {font-size:27px; line-height:1.5; letter-spacing:-.035em; margin:58px 0 22px; padding-top:23px; border-top:1px solid var(--rule);}
.b12-mobility-explainer h3 {font-size:22px; line-height:1.5; letter-spacing:-.025em; margin:32px 0 16px;}
.b12-mobility-explainer p {margin:0 0 23px;}
.b12-mobility-explainer a {color:#08647b; text-decoration:underline; text-underline-offset:.17em; overflow-wrap:anywhere;}
.b12-mobility-explainer a:hover {text-decoration-thickness:2px;}
.b12-mobility-explainer a:focus-visible,
.b12-mobility-explainer .table-scroll:focus-visible {outline:3px solid #88430d; outline-offset:4px;}
.b12-mobility-explainer strong {font-weight:750; color:#173b50;}
.b12-mobility-explainer .deck {font-size:22px; color:var(--muted); line-height:1.65; margin-bottom:32px;}
.b12-mobility-explainer .answer-box {margin:35px 0 40px; padding:24px 28px; border-left:5px solid #12647a; background:#edf6f8; border-radius:0 14px 14px 0;}
.b12-mobility-explainer .answer-box p:last-child {margin:0;}
.b12-mobility-explainer .box-label {font-weight:800; font-size:16px; letter-spacing:.04em; color:#0a586b; margin:0 0 10px;}
.b12-mobility-explainer figure {margin:30px 0 24px;}
.b12-mobility-explainer .concept,
.b12-mobility-explainer .chart-card {border:1px solid var(--rule); border-radius:16px; padding:25px; background:#f8fbfc;}
.b12-mobility-explainer .figure-kicker {font-size:15px; font-weight:700; letter-spacing:.025em; color:#415f6a; margin:0 0 12px;}
.b12-mobility-explainer .concept h3,
.b12-mobility-explainer .chart-card h3 {font-size:24px; margin:0 0 20px;}
.b12-mobility-explainer .step-flow {list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; padding:0; margin:28px 0;}
.b12-mobility-explainer .step-flow li {position:relative; background:#fff; border:1px solid #b6cbd5; border-radius:11px; padding:14px 10px 18px; font-size:16px; line-height:1.6; text-align:center; min-width:0;}
.b12-mobility-explainer .step-flow li:not(:last-child)::after {content:"→"; position:absolute; right:-22px; top:38%; color:#4c6a76; font-size:22px; font-weight:700;}
.b12-mobility-explainer .step-number {display:block; margin:0 auto 10px; width:31px; height:31px; border:1px solid #3c6678; border-radius:50%; color:#264d60; font-size:17px; line-height:29px; font-weight:700;}
.b12-mobility-explainer .measurement {border-block:1px solid var(--rule); padding:14px 3px; font-size:18px;}
.b12-mobility-explainer figcaption,
.b12-mobility-explainer .visual-note {font-size:16px; line-height:1.85; color:var(--muted); margin:18px 0 0;}
.b12-mobility-explainer .visual-note {margin:15px 0 31px;}
.b12-mobility-explainer .chart-subtitle {font-size:18px; margin:0 0 15px;}
.b12-mobility-explainer .tug-chart {width:100%; max-width:640px; height:auto; display:block; margin:10px auto; overflow:visible;}
.b12-mobility-explainer .tug-chart text {font-family:inherit; fill:#273f50;}
.b12-mobility-explainer .zero-line {stroke:#627684; stroke-width:1.3; stroke-dasharray:5 4;}
.b12-mobility-explainer .zero-label {font-size:18px;}
.b12-mobility-explainer .ci-line {stroke:#146177; stroke-width:4;}
.b12-mobility-explainer .ci-cap {stroke:#146177; stroke-width:2;}
.b12-mobility-explainer .estimate-point {fill:#153f50; stroke:white; stroke-width:1.5;}
.b12-mobility-explainer .ci-label,
.b12-mobility-explainer .tick-label {font-size:20px;}
.b12-mobility-explainer .estimate-label {font-size:22px; font-weight:700; paint-order:stroke; stroke:#f8fbfc; stroke-width:4px;}
.b12-mobility-explainer .axis {stroke:#657d88; stroke-width:1.2;}
.b12-mobility-explainer .axis-reading {display:flex; justify-content:space-between; gap:18px; font-size:15px; line-height:1.65; padding:0 2px 15px; border-bottom:1px solid var(--rule);}
.b12-mobility-explainer .axis-reading span {max-width:47%;}
.b12-mobility-explainer .table-scroll {width:100%; max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; border:1px solid var(--rule); border-radius:12px; margin:24px 0 0; background:white; scrollbar-color:#7c98a6 #edf3f6;}
.b12-mobility-explainer table {border-collapse:collapse; width:100%; margin:0; font-size:16px; line-height:1.8; text-align:left; table-layout:fixed;}
.b12-mobility-explainer .data-table {min-width:720px;}
.b12-mobility-explainer .evidence-table {min-width:840px;}
.b12-mobility-explainer caption {caption-side:top; text-align:left; font-weight:750; font-size:17px; padding:17px 18px; background:#eef4f7; color:#173b50;}
.b12-mobility-explainer th,
.b12-mobility-explainer td {border-bottom:1px solid #d3dfe5; padding:16px 17px; vertical-align:top;}
.b12-mobility-explainer thead th {background:#f2f6f8; color:#243f51; font-weight:700;}
.b12-mobility-explainer tbody th {font-weight:650;}
.b12-mobility-explainer tbody tr:last-child th,
.b12-mobility-explainer tbody tr:last-child td {border-bottom:0;}
.b12-mobility-explainer tbody tr:nth-child(even) {background:#fafcfd;}
.b12-mobility-explainer .technical-note {padding:20px 22px; background:#fbf8f1; border-left:3px solid #ae864f; font-size:17px; line-height:1.85; margin:29px 0;}
.b12-mobility-explainer .closing {border-block:2px solid #7596a6; padding:24px 0; font-size:22px; margin:35px 0;}
.b12-mobility-explainer .reference-intro {font-size:17px; color:var(--muted);}
.b12-mobility-explainer .reference {font-size:16px; line-height:1.8; padding:21px 0; border-bottom:1px solid #d9e3e8; overflow-wrap:anywhere; word-break:normal; scroll-margin-top:25px;}
.b12-mobility-explainer .reference p {margin:0 0 10px;}
.b12-mobility-explainer .reference p:last-child {margin:0;}
.b12-mobility-explainer .access-note {font-size:15px; color:#516575;}
@media(max-width:600px) {
  .b12-mobility-explainer {font-size:18px; line-height:1.9; padding:26px 13px 44px;}
  .b12-mobility-explainer h1 {font-size:32px; line-height:1.4;}
  .b12-mobility-explainer h2 {font-size:24px; margin:45px 0 21px; padding-top:21px;}
  .b12-mobility-explainer h3 {font-size:21px;}
  .b12-mobility-explainer .deck {font-size:20px;}
  .b12-mobility-explainer .answer-box {padding:20px 17px;}
  .b12-mobility-explainer .concept,
  .b12-mobility-explainer .chart-card {padding:20px 13px; border-radius:12px;}
  .b12-mobility-explainer .concept h3,
  .b12-mobility-explainer .chart-card h3 {font-size:22px;}
  .b12-mobility-explainer .step-flow {grid-template-columns:1fr; gap:30px; margin:24px 0;}
  .b12-mobility-explainer .step-flow li {display:flex; gap:14px; align-items:center; padding:13px 15px; text-align:left; font-size:18px;}
  .b12-mobility-explainer .step-number {display:inline-block; flex:0 0 31px; margin:0;}
  .b12-mobility-explainer .step-flow li:not(:last-child)::after {content:"↓"; right:calc(50% - 8px); top:100%; line-height:29px;}
  .b12-mobility-explainer .axis-reading {display:block; font-size:15px;}
  .b12-mobility-explainer .axis-reading span {display:block; max-width:none;}
  .b12-mobility-explainer .chart-subtitle {font-size:17px;}
  .b12-mobility-explainer .zero-label,
  .b12-mobility-explainer .ci-label,
  .b12-mobility-explainer .tick-label {font-size:26px;}
  .b12-mobility-explainer .estimate-label {font-size:28px;}
  .b12-mobility-explainer .technical-note {padding:19px 16px; font-size:16px;}
  .b12-mobility-explainer figcaption,
  .b12-mobility-explainer .visual-note {font-size:16px;}
  .b12-mobility-explainer .closing {font-size:21px;}
  .b12-mobility-explainer .reference {font-size:15px;}
}
@media print {
  .b12-mobility-explainer {max-width:none; padding:0; color:#000; font-size:11pt;}
  .b12-mobility-explainer h2,
  .b12-mobility-explainer h3 {break-after:avoid;}
  .b12-mobility-explainer figure {break-inside:avoid;}
  .b12-mobility-explainer .table-scroll {overflow:visible;}
  .b12-mobility-explainer table {min-width:0; font-size:9pt;}
}