/* T8 map — 進路マップの上乗せスタイル。tokens.css の custom property のみを使う。 */

.map-canvas{
  height: 360px;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  background: rgba(0,0,0,0.35);
}

/* MapLibre の attribution を控えめに、紙面 token に寄せる */
.map-canvas .maplibregl-ctrl-attrib{
  background: rgba(0,0,0,0.55);
  color: var(--c-ash);
  font-family: var(--f-body);
  font-size: 10px;
  letter-spacing: 0.04em;
}
.map-canvas .maplibregl-ctrl-attrib a{
  color: var(--c-bone);
  border-bottom: 0;
}
.map-canvas .maplibregl-ctrl-attrib.maplibregl-compact{
  margin: 0 6px 6px 0;
  padding: 0 6px;
  border-radius: 4px;
}
.map-canvas .maplibregl-ctrl-attrib-button{ display: none; }

/* 予報円の時刻ラベル（HTML Marker） */
.tlr-time-label{
  font-family: var(--f-mono);
  font-size: 11px;
  color: var(--c-bone);
  background: rgba(0,0,0,0.6);
  padding: 2px 6px;
  border-radius: 2px;
  letter-spacing: 0.04em;
  white-space: nowrap;
  pointer-events: none;
  /* MapLibre は anchor 中心で配置。ラベルは円の縁上の "上方" に出したいので transform で持ち上げる */
  transform: translateY(-14px);
  border: 1px solid var(--c-line-2);
}

/* canvas のフォーカスリングを抑制（地図 UI 全体のフォーカスは attribution などに残す） */
.map-canvas canvas:focus{ outline: none; }