body {
  font-size: 13px;
  margin: 0;
  padding: 0;
}

#home {
  text-align: center;
  margin-top: 140px;
}

#home h1 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 16px;
}

#hint, footer {
  color: gray;
  font-size: 11px;
  margin-top: 6px;
}

#error-msg { color: red; font-size: 11px; margin-top: 4px; }

input[type="text"] { max-width: 75vw; }

#result-page {
  max-width: 480px;
  margin: 24px auto;
  padding: 0 16px;
  box-sizing: border-box;
}

#result-page h1 {
  font-size: 14px;
  margin-bottom: 10px;
  text-align: center;
}

#result-body {
  display: flex;
  flex-direction: column;
}

td { padding: 2px 6px; vertical-align: top; }
td:first-child { color: gray; width: 50px; }
td.val { font-family: monospace; cursor: pointer; }
td.val:hover { background: #eee; }
td.copied { color: green; }
td.fmt-label { cursor: pointer; user-select: none; }
td.fmt-label:hover { text-decoration: underline; color: #333; }
td.fmt-active { color: black !important; font-weight: bold; }

#geo-section, #links-section { margin-top: 10px; }
#links-label { color: gray; font-size: 11px; margin-bottom: 3px; }
#serviceLinks { display: flex; flex-wrap: wrap; gap: 3px 10px; }
#serviceLinks a { font-size: 11px; white-space: nowrap; }

#parse-hint {
  color: gray; font-size: 11px; margin-top: 6px;
  display: flex; align-items: center; gap: 6px;
}
#swap-btn {
  padding: 1px 6px;
  font-size: 11px;
  background: #f5f5f5;
  border: 1px solid #ccc;
  cursor: pointer;
  border-radius: 2px;
  color: #555;
  line-height: 1.4;
}
#swap-btn:hover { background: #e8e8e8; }

#map {
  height: 320px;
  margin-top: 16px;
  border: 1px solid #ddd;
}

