:root {
  color-scheme: light;
  font-family: system-ui, sans-serif;
  line-height: 1.6;
  color: #202124;
  background: #fff;
}

* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 1440px; margin: 0 auto; padding: 24px; }
h1 { font-size: 1.55rem; line-height: 1.35; }
h2 { font-size: 1.2rem; }
h3 { margin: 0 0 8px; font-size: 1.1rem; }
h4 { margin: 0 0 8px; font-size: 1rem; }
p { margin: 8px 0; }
a { color: #0645ad; overflow-wrap: anywhere; }
button {
  color: #202124;
  background: #f5f5f5;
  border: 1px solid #777;
  border-radius: 3px;
  padding: 9px 14px;
  font: inherit;
  cursor: pointer;
}
button:disabled { color: #666; border-color: #aaa; cursor: default; }
button:focus-visible, a:focus-visible { outline: 3px solid #185abc; outline-offset: 3px; }
.notice { padding: 12px; border: 1px solid #bbb; background: #f7f7f7; }
.maps-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.provider { min-width: 0; padding: 16px; border: 1px solid #bbb; }
.map { width: 100% !important; height: 560px !important; background: #f2f2f2; box-shadow: inset 0 0 0 1px #ddd; }
.status { color: #505050; font-size: .9rem; min-height: 1.6em; }
.status[data-state="error"], .status[data-state="tile-error"] { color: #a62020; }
.provider-controls { margin-top: 14px; }
.selection { margin-top: 12px; padding: 12px; background: #f7f7f7; border: 1px solid #ddd; overflow-wrap: anywhere; }
.selection p:last-child { margin-bottom: 0; }
.results ol { margin: 0; padding-left: 26px; }
.candidate { padding: 14px 0; border-bottom: 1px solid #ddd; overflow-wrap: anywhere; }
.candidate:last-child { border-bottom: 0; }
.candidate h4 { margin-bottom: 4px; }
.candidate p { margin: 4px 0; }
.candidate button { margin-top: 7px; font-size: .9rem; padding: 6px 10px; }
.coordinate-note, .identity-note { color: #555; font-size: .9rem; }
.extraction { margin-top: 28px; padding-top: 8px; border-top: 1px solid #bbb; }
.restaurant-extraction { margin-top: 18px; padding: 16px; border: 1px solid #bbb; }
dl { display: grid; grid-template-columns: 8em minmax(0, 1fr); gap: 6px 12px; margin: 12px 0; }
dt { font-weight: 600; }
dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.evidence-list { padding-left: 24px; }
.evidence-list li { padding: 8px 0; }
.evidence-quote { white-space: pre-wrap; }
.map-pin {
  display: inline-block;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 2px solid #202124;
  border-radius: 50%;
  color: #202124;
  background: #fff19a;
  font: 700 14px/24px system-ui, sans-serif;
  text-align: center;
  cursor: pointer;
}
.map-information-card {
  max-height: 400px;
  overflow: hidden;
  border: 1px solid #777;
  background: #fff;
  color: #202124;
  font: 13px/1.45 system-ui, sans-serif;
  white-space: normal;
  overflow-wrap: anywhere;
  touch-action: pan-y;
}
.map-information-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border-bottom: 1px solid #ccc; }
.map-information-close { flex-shrink: 0; padding: 4px 8px; font-size: 12px; }
.map-information-body { max-height: 344px; overflow-y: auto; overscroll-behavior: contain; padding: 10px; }
.map-information-body section + section { margin-top: 14px; padding-top: 12px; border-top: 1px solid #bbb; }
.map-information-card h4 { font-size: 13px; }
.map-information-card dl { display: grid; grid-template-columns: 6.8em minmax(0, 1fr); gap: 5px 8px; }
.map-information-card dd { margin: 0; }
.map-information-place-name { font-weight: 700; }
.map-information-warning { font-weight: 700; padding: 7px; border: 1px solid #aaa; background: #f7f7f7; }
.map-information-evidence { padding-left: 20px; }
.map-information-evidence li { margin: 8px 0; }

@media (max-width: 760px) {
  main { padding: 16px; }
  .maps-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .provider { padding: 12px; }
  .map { height: 560px; }
  dl { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  dd { margin-bottom: 8px; }
}
