@import url("/site-foundation.css?v=20260924-3");
/* Life Fit Japan: site-wide readability and touch-target baseline. */
:root{--lf-touch:44px}
button,summary,select,.cta a,.navlinks a,.site-links a{touch-action:manipulation;-webkit-tap-highlight-color:rgba(57,166,154,.14)}
button:focus-visible,summary:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid rgba(57,166,154,.38)!important;outline-offset:3px!important}
button:not(:disabled),summary,.cta a{transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease,border-color .12s ease}
button:not(:disabled):active,.cta a:active{transform:scale(.985)}
.navlinks a,.site-links a{display:inline-flex;align-items:center;min-height:40px;font-size:13px!important;line-height:1.35}
@media(max-width:600px){.navlinks a,.site-links a{font-size:13px!important;min-height:40px;padding-top:5px;padding-bottom:5px}}
.cta a{display:inline-flex!important;align-items:center;justify-content:center;min-height:50px;padding:13px 20px!important;font-size:15px!important;box-shadow:0 8px 18px rgba(47,153,140,.14)}
.scale .opt{position:relative!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;border:0!important;background:transparent!important;transform:none!important;flex:0 0 44px!important}
.scale .opt::after{content:"";position:absolute;left:50%;top:50%;border:2px solid #aab8b5;border-radius:50%;background:#fff;transform:translate(-50%,-50%);transition:transform .12s ease,background-color .12s ease,border-color .12s ease,box-shadow .12s ease}
.scale .opt.neutral::after{width:26px;height:26px}.scale .opt.s1::after{width:32px;height:32px}.scale .opt.s2::after{width:40px;height:40px}.scale .opt.s3::after{width:48px;height:48px}
.scale .opt:hover::after,.scale .opt.sel::after{background:var(--teal,#39a69a);border-color:var(--teal,#39a69a);transform:translate(-50%,-50%) scale(1.05);box-shadow:0 4px 12px rgba(57,166,154,.18)}
.scale .opt.neg:hover::after,.scale .opt.neg.sel::after{background:var(--coral,#ef6c72);border-color:var(--coral,#ef6c72);box-shadow:0 4px 12px rgba(239,108,114,.16)}
@media(max-width:600px){.scale{gap:0!important}}
.liveTop10Open,.liveTop10Close,.phaseGatePrimary,.phaseGateSecondary,#resultBtn,.choice,.localDetailBtn,.lifeFitWhatIfChip,.lifeFitSimulatorReset,.feedbackButtons button,.shareBtn,.resultEditButtons button,.detailsCloseAction button,.pwaInstallButton,.restartBtn{min-height:44px!important}
.choice{min-height:52px!important}.phaseGatePrimary,#resultBtn,.resultEditPrimary{min-height:52px!important;font-size:15px!important;box-shadow:0 8px 20px rgba(57,166,154,.15)}
#resultBtn{min-width:220px;padding:14px 22px!important;margin-top:22px}.phaseGateSecondary{font-size:14px!important}
.localDetailBtn{font-size:13px!important;padding:10px 14px!important}.lifeFitWhatIfChip{font-size:13px!important;padding:9px 12px!important}.lifeFitWhatIfChip.active{box-shadow:0 0 0 3px rgba(47,143,130,.12)}
.lifeFitSimulatorReset{font-size:13px!important;padding:9px 13px!important}.feedbackButtons button{font-size:14px!important;padding:10px 14px!important}
.factDisclosure>summary{min-height:44px!important;display:flex;align-items:center}select{min-height:48px!important;font-size:16px!important}
@media(max-width:600px){#resultBtn,.phaseGatePrimary,.phaseGateSecondary,.resultEditButtons button{width:100%}}
.progress-meta,.liveRankingHeadActions span,.liveTop10Open,.liveRankingMeta span,.liveStabilityLabel,.liveStabilityValue,.liveRankItem small,.liveRankMove,.liveRankingWhy,.liveRankingNote,.liveTop10PanelHead p,.liveTop10Place small,.liveTop10Score,.phaseGateBadge,.questionImpact,.realityCandidateHead span,.realityCandidateMessage,.choice span,.miniFact span,.miniFact small,.discoveryCard span,.balanceHint,.pairedTrackWrap small,.metricCompareCard>span,.metricValues small,.metricCompareCard em,.livingAreaEvidenceLabel,.livingAreaCard p,.localEnrichment,.lifeFitSimulatorBadge,.lifeFitSimulatorMove,.lifeFitWhatIfHead span,.lifeFitSimulatorTop20Head span,.lifeFitSimulatorTop20Rank,.lifeFitSimulatorTop20Score,.lifeFitSimulatorTop20Move,.lifeFitSimulatorTop20Reason,.lifeFitSimulatorControlHead span,.lifeFitSimulatorScale,.lifeFitSimulatorNote,.top3QuickPlace small,.top3CityAction{font-size:12px!important;line-height:1.5}
.localEnrichment,.livingAreaCard p{font-size:13px!important}.liveTop10Open{font-size:13px!important;padding:8px 12px!important}.liveTop10Close{font-size:13px!important;padding:8px 12px!important}.liveRankItem strong{font-size:16px!important}
.lifeFitSimulatorTop20City{font-size:13px!important}.top3QuickPlace small{font-size:13px!important}.top3CityAction{font-size:13px!important}
.articlePhoto figcaption,.lfDiagramHead small,.lfMini span,.storyEyebrow,.sourceNote,.sceneCard span,.barHint,.barLabel,.barValue,.statCard span,.spectrumNode span,.balanceThree span{font-size:12px!important;line-height:1.6!important}
.dataTable th,.dataTable td{font-size:13px!important;line-height:1.7!important}.card small{font-size:13px}.more{font-size:14px}
.liveRankingMeta span,.liveStabilityLabel,.liveStabilityValue,.liveRankingNote,.lifeFitSimulatorNote,.lifeFitSimulatorTop20Reason,.articlePhoto figcaption,.sourceNote{color:#66777b!important}
@media(prefers-reduced-motion:reduce){button,summary,.cta a,.scale .opt::after{transition:none!important}button:not(:disabled):active,.cta a:active{transform:none!important}}


/* 2026-09-06: second-pass attention hierarchy audit. */
.question-card.answered{background:#fcfdfd;box-shadow:0 5px 16px rgba(54,72,89,.035)}
.question-card.current-question{border-color:#78c8bc!important;box-shadow:0 16px 38px rgba(42,120,110,.12)!important;background:#fff!important}
.question-card.current-question .q{color:#213f3b}
.question-card.current-question .questionImpact{box-shadow:0 0 0 3px rgba(57,166,154,.07)}

.top3QuickList{border-top:0!important;margin-top:18px!important}
.top3QuickRow:first-child{margin:0 -8px 6px;padding:16px 10px!important;border:1px solid #cce7e1!important;border-radius:14px;background:linear-gradient(100deg,#edf9f6 0%,#ffffff 76%);box-shadow:0 8px 20px rgba(57,166,154,.08)}
.top3QuickRow:first-child .top3QuickRank{width:36px;height:36px}
.top3QuickRow:first-child .top3QuickPlace strong{font-size:20px}
.top3QuickRow:first-child .top3QuickScore{font-size:16px;color:#236e65}

.lifeFitSimulator{margin:24px 0 22px!important;padding:24px 22px 20px!important;border:1px solid #c8e2dc!important;border-top:6px solid #39a69a!important;border-radius:20px!important;background:linear-gradient(145deg,#f4fbf9 0%,#ffffff 58%,#f6f3fc 100%)!important;box-shadow:0 16px 40px rgba(45,118,108,.11)!important}
.lifeFitSimulatorEyebrow{margin-bottom:7px;color:#2b7c72;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.lifeFitSimulatorHead h3{font-size:24px!important;letter-spacing:-.02em}
.lifeFitSimulatorHead p{font-size:14px!important;max-width:650px}
.lifeFitSimulatorControl{transition:background-color .14s ease,border-color .14s ease,box-shadow .14s ease,padding .14s ease}
.lifeFitSimulatorControl:focus-within{padding-left:10px;padding-right:10px;border-bottom-color:var(--sim-color,#39a69a);border-radius:10px;background:rgba(255,255,255,.78);box-shadow:inset 3px 0 0 var(--sim-color,#39a69a)}
.lifeFitWhatIfChip:hover{border-color:#8fc7bd;background:#f0f9f6}

.top3DetailPanel{box-shadow:0 8px 24px rgba(54,72,89,.05)!important}
.typeSummaryPanel{box-shadow:0 6px 20px rgba(54,72,89,.04)!important;background:#fff!important}

.currentSummaryPanel .currentInlineAccordion{margin-top:10px!important;border-top:0!important}
.currentSummaryPanel .currentInlineAccordion>summary{justify-content:space-between!important;min-height:48px!important;padding:11px 14px!important;border:1px solid #dce8e5;border-radius:12px;background:#f9fbfa!important;color:#436a64!important;font-size:14px!important}
.currentSummaryPanel .currentMoveInlineAccordion>summary{min-height:52px!important;border-color:#a9d7ce;background:#eaf7f4!important;color:#226f65!important;font-size:15px!important;box-shadow:0 7px 18px rgba(57,166,154,.08)}
.currentSummaryPanel .currentMoveInlineAccordion>summary:hover{background:#def3ee!important}

.resultUtilityPanel{box-shadow:none!important;border-color:#e7ecea!important;background:#fcfdfd!important}
.navlinks a,.site-links a{min-height:44px!important}
.cta a:hover{box-shadow:0 10px 24px rgba(47,153,140,.20)!important;transform:translateY(-1px)}

@media(max-width:600px){
  .top3QuickRow:first-child{margin-left:-4px;margin-right:-4px;padding:14px 8px!important}
  .top3QuickRow:first-child .top3QuickPlace strong{font-size:18px}
  .top3QuickRow:first-child .top3QuickScore{font-size:14px}
  .lifeFitSimulator{padding:20px 13px 17px!important;margin:20px 0!important}
  .lifeFitSimulatorHead h3{font-size:21px!important}
  .lifeFitSimulatorEyebrow{font-size:12px}
  .currentSummaryPanel .currentInlineAccordion>summary{font-size:14px!important}
}

/* Responsive article data tables */
@media(max-width:600px){
  .dataTableWrap{
    overflow:visible!important;
    border:0!important;
    background:transparent!important;
  }
  .dataTable{
    display:block!important;
    min-width:0!important;
    width:100%!important;
    border-collapse:separate!important;
  }
  .dataTable thead{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
  .dataTable tbody,
  .dataTable tr,
  .dataTable td{
    display:block!important;
    width:100%!important;
  }
  .dataTable tr{
    margin:0 0 12px!important;
    padding:13px 14px!important;
    border:1px solid #e7e9ef!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 4px 12px rgba(54,72,89,.035)!important;
  }
  .dataTable td{
    display:grid!important;
    grid-template-columns:minmax(112px,44%) minmax(0,1fr)!important;
    gap:10px!important;
    align-items:start!important;
    padding:8px 0!important;
    border:0!important;
    border-bottom:1px solid #eef0f3!important;
    white-space:normal!important;
    font-size:13px!important;
    line-height:1.55!important;
    overflow-wrap:anywhere!important;
  }
  .dataTable td:last-child{border-bottom:0!important}
  .dataTable td::before{
    content:attr(data-label);
    color:#718096;
    font-size:11px;
    font-weight:850;
    line-height:1.5;
  }
  .dataTable td:first-child{
    display:block!important;
    padding-top:2px!important;
    padding-bottom:10px!important;
    color:#243337!important;
    font-size:16px!important;
    font-weight:850!important;
  }
  .dataTable td:first-child::before{
    display:block;
    margin-bottom:3px;
    font-size:10px;
    letter-spacing:.04em;
  }
}

/* Article graphical index visuals */
.dataTable .indexCell{min-width:118px}
.indexVisual{display:grid;grid-template-columns:minmax(34px,auto) minmax(64px,1fr);align-items:center;gap:8px}
.indexValue{font-weight:850;color:#243337;font-variant-numeric:tabular-nums}
.indexTrack{height:7px;border-radius:999px;background:#edf1f2;overflow:hidden}
.indexTrack span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#79c7bb,#39a69a)}
.indexExplain{margin:10px 0 22px;padding:11px 13px;border-radius:12px;background:#f6faf9;border:1px solid #e0ece9;color:#617078;font-size:11px;line-height:1.65}
.indexExplain strong{display:block;margin-bottom:2px;color:#39756d;font-size:11px}
.indexExplain span{display:block}
@media(max-width:600px){
  .dataTable td.indexCell{display:grid!important}
  .dataTable td.indexCell .indexVisual{grid-template-columns:42px minmax(0,1fr);gap:9px}
  .dataTable td.indexCell .indexTrack{height:8px}
  .indexExplain{margin-top:8px;padding:10px 11px;font-size:10.5px}
}

/* Article finding box */
.articleFinding{
  margin:22px 0;
  padding:18px 20px;
  border:1px solid #dce9e6;
  border-left:5px solid #39a69a;
  border-radius:16px;
  background:linear-gradient(135deg,#f2faf8,#fbfdfd);
}
.articleFinding small{
  display:block;
  margin-bottom:6px;
  color:#2f8177;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
}
.articleFinding strong{
  display:block;
  color:#26383b;
  font-size:18px;
  line-height:1.65;
  letter-spacing:-.01em;
}
.articleFinding p{
  margin:7px 0 0!important;
  color:#566870!important;
  font-size:13px!important;
  line-height:1.75!important;
}
@media(max-width:600px){
  .articleFinding{margin:18px 0;padding:15px 15px 16px}
  .articleFinding strong{font-size:16px;line-height:1.65}
  .articleFinding p{font-size:12.5px!important}
}

/* Article web evidence */
.webEvidence{
  margin:14px 0 22px;
  padding:14px 16px;
  border-radius:14px;
  background:#fbfcfd;
  border:1px solid #e5eaee;
  color:#53636b;
}
.webEvidence small{
  display:block;
  margin-bottom:5px;
  color:#6c7b83;
  font-size:10.5px;
  font-weight:900;
  letter-spacing:.05em;
}
.webEvidence p{
  margin:0!important;
  font-size:12.5px!important;
  line-height:1.75!important;
  color:#53636b!important;
}
.webEvidence a{
  color:#2f8177;
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:2px;
}
@media(max-width:600px){
  .webEvidence{padding:12px 13px;margin:12px 0 18px}
  .webEvidence p{font-size:12px!important}
}

/* Inline evidence source */
.evidenceSource{
  color:#74828a;
  font-size:.9em;
  white-space:normal;
}
.evidenceSource a{
  color:#4d8079;
  font-weight:750;
  text-decoration:none;
  border-bottom:1px dotted #a8c7c1;
}
.evidenceSource a:hover{color:#2f8177;border-bottom-color:#2f8177}
@media(max-width:600px){
  .evidenceSource{font-size:.85em}
}

/* Editorial data-science article baseline */
/* Keep data rich, reduce administrative card repetition. */
.scene{
  margin:30px -12px 42px!important;
  padding:28px 24px 24px!important;
  border:0!important;
  border-radius:22px!important;
  background:linear-gradient(120deg,#173d43 0%,#245b5c 48%,#327d74 100%)!important;
  color:#fff!important;
  box-shadow:none!important;
  overflow:hidden;
}
.scene small{color:#b9eee6!important;letter-spacing:.09em!important}
.scene>strong{color:#fff!important;font-size:clamp(21px,3.4vw,28px)!important;line-height:1.55!important}
.sceneGrid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
  margin-top:24px!important;
  border-top:1px solid rgba(255,255,255,.2)!important;
}
.sceneCard{
  padding:17px 16px 2px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.sceneCard+.sceneCard{
  padding-left:18px!important;
  border-left:1px solid rgba(255,255,255,.16)!important;
}
.sceneCard b{
  color:#fff!important;
  font-size:16px!important;
  line-height:1.4!important;
}
.sceneCard span{
  color:#cfe7e3!important;
  font-size:11.5px!important;
  line-height:1.6!important;
}

.dataStory{
  margin:38px -14px 46px!important;
  padding:30px 22px 28px!important;
  border:0!important;
  border-top:1px solid #dfe9e7!important;
  border-bottom:1px solid #dfe9e7!important;
  border-radius:0!important;
  background:linear-gradient(90deg,#f7fbfa 0%,#fff 100%)!important;
  box-shadow:none!important;
}
.dataStory h2{font-size:clamp(22px,3.4vw,28px)!important}
.storyEyebrow{letter-spacing:.09em!important}

.insightGrid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
  margin:22px 0!important;
  border-top:1px solid #dfe7e7!important;
  border-bottom:1px solid #dfe7e7!important;
}
.statCard{
  padding:18px 16px 18px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.statCard+.statCard{
  padding-left:18px!important;
  border-left:1px solid #e1e8e7!important;
}
.statCard strong{font-size:clamp(27px,4vw,38px)!important;color:#276f68!important}
.statCard span{font-size:11.5px!important}

.lfDiagram{
  margin:32px 0 42px!important;
  padding:22px 0!important;
  border:0!important;
  border-top:1px solid #dfe7e7!important;
  border-bottom:1px solid #dfe7e7!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.lfMiniGrid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:0!important;
}
.lfMini{
  padding:16px 14px 16px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.lfMini:nth-child(3n+2),.lfMini:nth-child(3n+3){
  padding-left:16px!important;
  border-left:1px solid #e1e8e7!important;
}
.lfMini:nth-child(n+4){border-top:1px solid #edf1f0!important}

.point{
  margin:26px 0!important;
  padding:14px 0 14px 18px!important;
  border:0!important;
  border-left:4px solid #39a69a!important;
  border-radius:0!important;
  background:transparent!important;
}
.example{
  margin:26px 0!important;
  padding:18px 0!important;
  border:0!important;
  border-top:1px solid #eadfc2!important;
  border-bottom:1px solid #eadfc2!important;
  border-radius:0!important;
  background:transparent!important;
}

.storyTakeaway{
  margin:22px 0 0!important;
  padding:16px 0 16px 18px!important;
  border:0!important;
  border-left:4px solid #d7b969!important;
  border-radius:0!important;
  background:transparent!important;
}

.miniBars{
  margin:22px 0 24px!important;
  padding:18px 0 14px!important;
  border:0!important;
  border-top:1px solid #dfe7e7!important;
  border-bottom:1px solid #dfe7e7!important;
  border-radius:0!important;
  background:transparent!important;
}

.articleFinding{
  margin:30px 0!important;
  padding:20px 0!important;
  border:0!important;
  border-top:1px solid #bcded8!important;
  border-bottom:1px solid #bcded8!important;
  border-radius:0!important;
  background:transparent!important;
}
.articleFinding small{margin-bottom:8px!important}
.articleFinding strong{
  max-width:760px;
  font-size:clamp(19px,3vw,25px)!important;
  line-height:1.6!important;
  color:#24423f!important;
}
.articleFinding p{max-width:760px;font-size:13.5px!important}

@media(max-width:600px){
  .scene{margin-left:-6px!important;margin-right:-6px!important;padding:23px 17px 20px!important}
  .sceneGrid{grid-template-columns:1fr!important}
  .sceneCard{padding:13px 0!important;border-left:0!important;border-bottom:1px solid rgba(255,255,255,.14)!important}
  .sceneCard+.sceneCard{padding-left:0!important;border-left:0!important}
  .sceneCard:last-child{border-bottom:0!important}
  .dataStory{margin-left:-6px!important;margin-right:-6px!important;padding:23px 14px!important}
  .insightGrid{grid-template-columns:1fr!important}
  .statCard{display:grid!important;grid-template-columns:86px 1fr!important;gap:10px!important;padding:14px 0!important;border-left:0!important;border-bottom:1px solid #e6eceb!important}
  .statCard+.statCard{padding-left:0!important;border-left:0!important}
  .statCard:last-child{border-bottom:0!important}
  .lfMiniGrid{grid-template-columns:1fr 1fr!important}
  .lfMini,.lfMini:nth-child(3n+2),.lfMini:nth-child(3n+3){padding:13px 10px 13px 0!important;border-left:0!important;border-top:0!important;border-bottom:1px solid #edf1f0!important}
  .lfMini:nth-child(even){padding-left:10px!important;border-left:1px solid #e1e8e7!important}
}

/* Article zoom hierarchy */
.zoomStory{
  margin:34px 0 46px;
  padding:24px 0;
  border-top:1px solid #cfe0dd;
  border-bottom:1px solid #cfe0dd;
}
.zoomEyebrow{
  margin-bottom:9px;
  color:#2f8177;
  font-size:11px;
  font-weight:900;
  letter-spacing:.09em;
}
.zoomStory>strong{
  display:block;
  max-width:760px;
  font-size:clamp(20px,3vw,27px);
  line-height:1.55;
  color:#263f3c;
}
.zoomPath{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin-top:22px;
  counter-reset:zoom;
}
.zoomStep{
  position:relative;
  padding:17px 17px 12px 0;
  border-top:3px solid #73b9b0;
}
.zoomStep+.zoomStep{padding-left:18px}
.zoomStep+.zoomStep:before{
  content:"→";
  position:absolute;
  left:-7px;
  top:13px;
  transform:translateX(-50%);
  color:#9aacaa;
  font-weight:900;
  background:#fff;
  padding:0 4px;
}
.zoomStep small{
  display:block;
  margin-bottom:4px;
  color:#71827f;
  font-size:10px;
  font-weight:850;
  letter-spacing:.05em;
}
.zoomStep b{
  display:block;
  font-size:16px;
  line-height:1.45;
  color:#2b3d40;
}
.zoomStep span{
  display:block;
  margin-top:5px;
  font-size:11px;
  line-height:1.6;
  color:#718096;
}
.zoomNote{
  margin:18px 0 0!important;
  font-size:12.5px!important;
  line-height:1.8!important;
  color:#607078!important;
}
@media(max-width:600px){
  .zoomPath{grid-template-columns:1fr}
  .zoomStep,.zoomStep+.zoomStep{padding:13px 0 13px 18px;border-top:0;border-left:3px solid #73b9b0}
  .zoomStep+.zoomStep:before{content:"↓";left:0;top:-8px;transform:translate(-50%,-50%);padding:1px 3px}
}

/* Article statistical charts */
.chartBlock{
  margin:30px 0 42px;
  padding:22px 0 24px;
  border-top:1px solid #dfe8e6;
  border-bottom:1px solid #dfe8e6;
}
.chartHead{display:flex;justify-content:space-between;gap:16px;align-items:end;margin-bottom:18px}
.chartTitle{font-size:17px;font-weight:900;line-height:1.5;color:#2a4441}
.chartSub{font-size:10.5px;line-height:1.55;color:#7a898e;text-align:right}
.chartRows{display:grid;gap:12px}
.chartRow{display:grid;grid-template-columns:92px minmax(0,1fr) 58px;gap:10px;align-items:center}
.chartLabel{font-size:12px;font-weight:800;color:#46585d;white-space:nowrap}
.chartTrack{height:15px;border-radius:999px;background:#eef2f2;overflow:hidden;position:relative}
.chartBar{height:100%;border-radius:999px;background:var(--chart-color,#39a69a)}
.chartValue{font-size:12px;font-weight:900;color:#34474b;text-align:right;font-variant-numeric:tabular-nums}
.chartLegend{display:flex;flex-wrap:wrap;gap:12px;margin-top:15px;font-size:10.5px;color:#6f7d82}
.chartLegend span:before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;background:var(--chart-color,#39a69a);vertical-align:-1px}
.chartNote{margin:13px 0 0!important;font-size:11px!important;line-height:1.7!important;color:#748187!important}

.histogram{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end;height:190px;padding:18px 8px 0;border-bottom:1px solid #cad8d5}
.histBin{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%}
.histValue{font-size:11px;font-weight:900;color:#40555a;margin-bottom:6px}
.histBar{width:min(72px,70%);min-height:3px;background:var(--chart-color,#39a69a);border-radius:9px 9px 0 0}
.histLabel{font-size:10.5px;font-weight:750;color:#67777c;text-align:center;margin-top:8px;line-height:1.4}

.rangeRows{display:grid;gap:15px}
.rangeRow{display:grid;grid-template-columns:70px minmax(0,1fr) 112px;gap:12px;align-items:center}
.rangeTrack{position:relative;height:16px;background:linear-gradient(90deg,#d7eef1,#f6e1c8);border-radius:999px}
.rangeSegment{position:absolute;top:3px;height:10px;border-radius:999px;background:var(--chart-color,#39a69a)}
.rangeDots:before,.rangeDots:after{content:"";position:absolute;top:-1px;width:12px;height:12px;border:2px solid #fff;border-radius:50%;background:var(--chart-color,#39a69a);box-shadow:0 0 0 1px rgba(38,65,68,.15)}
.rangeDots:before{left:var(--range-start)}
.rangeDots:after{left:var(--range-end)}
.rangeText{font-size:11px;font-weight:800;color:#52646a;text-align:right;font-variant-numeric:tabular-nums}

.chart-c-transport{--chart-color:#36a6a0}
.chart-c-rent{--chart-color:#d6a14a}
.chart-c-medical{--chart-color:#5f88c7}
.chart-c-work{--chart-color:#8a6fc1}
.chart-c-climate{--chart-color:#df7d57}

@media(max-width:600px){
  .chartBlock{margin:24px 0 34px;padding:18px 0 20px}
  .chartHead{display:block}.chartSub{text-align:left;margin-top:4px}
  .chartRow{grid-template-columns:74px minmax(0,1fr) 48px;gap:8px}
  .chartLabel,.chartValue{font-size:11px}
  .histogram{height:160px;gap:8px}
  .rangeRow{grid-template-columns:54px minmax(0,1fr);gap:8px}
  .rangeText{grid-column:2;text-align:left;margin-top:-5px}
}

/* Global navigation consistency */
@media(max-width:600px){
  .topnav{display:block!important}
  .topnav .brand{display:inline-block;margin-bottom:8px}
  .topnav .navlinks{justify-content:flex-start!important;gap:3px 12px!important}
  .topnav .navlinks a{min-height:36px!important;padding:0!important}
  .site-links{gap:4px 12px!important}
}