/* 海外連携マップ：station-ai-overseas-regions 専用 */
.stf-article-body .stf-global-map {
  --stf-map-panel: #ffffff;
  --stf-map-panel-soft: #f8fbf9;
  --stf-map-text: #1f2a25;
  --stf-map-muted: #62726b;
  --stf-map-border: #d8e4de;
  --stf-map-land: #ecf2ef;
  --stf-map-accent: #0f6b4f;
  --stf-map-accent-strong: #0a503b;
  --stf-map-accent-soft: #e7f3ee;
  margin: 34px 0 44px;
}

.stf-article-body .stf-global-map__intro {
  margin-bottom: 16px;
}

.stf-article-body .stf-global-map__intro h2 {
  margin-bottom: 10px;
}

.stf-article-body .stf-global-map__intro p {
  margin: 0;
}

.stf-article-body .stf-global-map__frame {
  border: 1px solid var(--stf-map-border);
  border-radius: 18px;
  padding: 14px;
  background: var(--stf-map-panel);
  box-shadow: 0 2px 16px rgba(15, 107, 79, 0.05);
}

.stf-article-body .stf-global-map svg {
  display: block;
  width: 100%;
  height: auto;
}

.stf-article-body .stf-global-map .stf-map-country {
  fill: var(--stf-map-land);
  stroke: var(--stf-map-border);
  stroke-width: 0.7;
}

.stf-article-body .stf-global-map__note {
  margin: 8px 0 0;
  color: var(--stf-map-muted);
  font-size: 0.92em;
  line-height: 1.65;
}

.stf-article-body .stf-map-region-hit {
  cursor: pointer;
}

.stf-article-body .stf-map-region-hit:focus {
  outline: none;
}

.stf-article-body .stf-map-region-hit:focus .stf-map-label-box,
.stf-article-body .stf-map-region-hit:hover .stf-map-label-box {
  stroke: var(--stf-map-accent);
  stroke-width: 2;
}

.stf-article-body .stf-map-region-hit[aria-pressed="true"] .stf-map-label-box {
  fill: var(--stf-map-accent-soft);
  stroke: var(--stf-map-accent);
}

.stf-article-body .stf-map-region-hit[aria-pressed="true"] .stf-map-leader {
  stroke: var(--stf-map-accent);
}

.stf-article-body .stf-map-region-hit[aria-pressed="true"] .stf-map-marker {
  fill: var(--stf-map-accent);
  opacity: 1;
}

.stf-article-body .stf-map-region-hit[aria-pressed="false"] .stf-map-marker {
  opacity: 0.58;
}

.stf-article-body .stf-map-region-hit[aria-pressed="false"] .stf-map-leader {
  opacity: 0.62;
}

.stf-article-body .stf-map-region-hit[aria-pressed="false"] .stf-map-label-box {
  opacity: 0.92;
}

.stf-article-body .stf-map-marker {
  fill: var(--stf-map-accent);
  stroke: #ffffff;
  stroke-width: 2;
}

.stf-article-body .stf-map-leader {
  fill: none;
  stroke: var(--stf-map-accent);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.stf-article-body .stf-map-label-box {
  fill: var(--stf-map-panel);
  stroke: var(--stf-map-border);
  stroke-width: 1.1;
}

.stf-article-body .stf-map-label-text {
  fill: var(--stf-map-text);
  font-size: 13px;
  font-weight: 700;
  pointer-events: none;
}

.stf-article-body .stf-global-map__mobile-picker {
  display: none;
}

.stf-article-body .stf-global-map__mobile-picker summary {
  cursor: pointer;
  list-style: none;
  border: 1px solid var(--stf-map-border);
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--stf-map-panel);
  font-weight: 700;
}

.stf-article-body .stf-global-map__mobile-picker summary::-webkit-details-marker {
  display: none;
}

.stf-article-body .stf-global-map__mobile-picker summary::after {
  content: "＋";
  float: right;
  color: var(--stf-map-accent);
}

.stf-article-body .stf-global-map__mobile-picker[open] summary::after {
  content: "−";
}

.stf-article-body .stf-global-map__controls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}

.stf-article-body .stf-global-map__controls button {
  min-height: 48px;
  border: 1px solid var(--stf-map-border);
  border-radius: 12px;
  padding: 10px;
  background: var(--stf-map-panel);
  color: var(--stf-map-text);
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.stf-article-body .stf-global-map__controls button[aria-pressed="true"] {
  border-color: var(--stf-map-accent);
  background: var(--stf-map-accent-soft);
}

.stf-article-body .stf-global-map__detail {
  margin-top: 16px;
  border: 1px solid var(--stf-map-border);
  border-radius: 16px;
  padding: 18px;
  background: var(--stf-map-panel-soft);
  box-shadow: 0 2px 12px rgba(15, 107, 79, 0.04);
}

.stf-article-body .stf-global-map__detail h3 {
  margin: 2px 0 0;
}

.stf-article-body .stf-global-map__eyebrow {
  margin: 0;
  color: var(--stf-map-muted);
  font-size: 0.9em;
}

.stf-article-body .stf-global-map__detail dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 16px 0;
}

.stf-article-body .stf-global-map__detail dt {
  color: var(--stf-map-muted);
  font-size: 0.85em;
}

.stf-article-body .stf-global-map__detail dd {
  margin: 4px 0 0;
}

.stf-article-body .stf-global-map__jump {
  border: 0;
  border-radius: 10px;
  padding: 11px 16px;
  background: var(--stf-map-accent);
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.stf-article-body .stf-global-map__jump:hover,
.stf-article-body .stf-global-map__jump:focus-visible {
  background: var(--stf-map-accent-strong);
}

.stf-article-body .stf-region-anchor {
  scroll-margin-top: 24px;
}

.stf-article-body .stf-region-anchor.stf-region-arrival {
  border-bottom-color: var(--stf-map-accent);
  background: var(--stf-map-accent-soft);
}

@media (max-width: 720px) {
  .stf-article-body .stf-global-map__frame {
    padding: 8px;
  }

  .stf-article-body .stf-global-map__mobile-picker {
    display: block;
    margin-top: 14px;
  }

  .stf-article-body .stf-global-map__detail dl {
    grid-template-columns: 1fr;
  }

  .stf-article-body .stf-map-label-text {
    font-size: 14px;
  }
}

@media (max-width: 430px) {
  .stf-article-body .stf-global-map__controls {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .stf-article-body .stf-region-anchor {
    transition: background 0.2s, border-bottom-color 0.2s;
  }
}