* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; font-family: system-ui, sans-serif; }
#map { position: absolute; top: 44px; bottom: 0; left: 0; right: 0; }
#banner {
  position: absolute; top: 0; left: 0; right: 0; height: 44px; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  background: #1d4ed8; color: #fff; font-size: 16px; padding: 0 12px; text-align: center;
}
#status {
  position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%);
  z-index: 1000; background: #111; color: #fff; padding: 10px 16px; border-radius: 999px;
  font-size: 15px; opacity: 0; transition: opacity .2s; pointer-events: none;
}
#status.show { opacity: .92; }
.comment-form { display: flex; flex-direction: column; gap: 8px; width: 220px; }
.comment-form textarea {
  width: 100%; min-height: 70px; font-size: 16px; padding: 8px;
  border: 1px solid #cbd5e1; border-radius: 8px; resize: vertical;
}
.comment-form button {
  font-size: 16px; padding: 10px; border: 0; border-radius: 8px;
  background: #1d4ed8; color: #fff;
}
.comment-form button.secondary { background: #e2e8f0; color: #111; }