:root {
  --ink: #17201d;
  --muted: #66736f;
  --line: #dce5e0;
  --panel: #ffffff;
  --soft: #f5f8f6;
  --soft-strong: #e8f4ee;
  --green: #1f8a5b;
  --green-dark: #11613f;
  --gold: #d99b2b;
  --red: #c9443f;
  --blue: #2e76d0;
  --shadow: 0 18px 50px rgba(25, 37, 32, 0.16);
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--soft); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: 0.7; }
.app-shell { display: grid; grid-template-columns: minmax(360px, 430px) 1fr; min-height: 100vh; }
.sidebar { z-index: 5; display: flex; flex-direction: column; gap: 14px; height: 100vh; overflow: auto; padding: 18px; background: var(--panel); border-right: 1px solid var(--line); }
.brand { display: flex; gap: 14px; align-items: center; padding-bottom: 2px; }
.brand-logo { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 14px; color: #fff; background: var(--green); font-weight: 900; box-shadow: 0 8px 20px rgba(31,138,91,.3); flex: 0 0 auto; }
.brand-copy { min-width: 0; }
.brand h1, .section-heading h2, .form-heading h2 { margin: 0; }
.brand h1 { font-size: 23px; line-height: 1.08; }
.brand p { margin: 5px 0 0; color: var(--muted); font-size: 14px; line-height: 1.35; }
section { border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 14px; }
.mode-tabs, .auth-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(82px, 1fr)); gap: 6px; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--soft); }
.auth-tabs { grid-template-columns: 1fr 1fr; margin-bottom: 10px; }
.mode-tab, .auth-tab { border: 0; border-radius: 7px; padding: 9px 10px; color: var(--muted); background: transparent; font-weight: 900; }
.mode-tab.active, .auth-tab.active { color: var(--green-dark); background: #fff; box-shadow: 0 5px 14px rgba(25,37,32,.08); }
.view-panel { display: none; flex-direction: column; gap: 14px; }
.view-panel.active { display: flex; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.compact-heading { margin-bottom: 8px; }
.section-heading h2 { font-size: 15px; }
.live-pill, .count-badge { border-radius: 999px; padding: 5px 9px; font-size: 12px; font-weight: 800; background: var(--soft-strong); color: var(--green-dark); white-space: nowrap; }
.live-pill.loading { background: #fff5dc; color: #8a5b08; }
.live-pill.error { background: #fdeceb; color: #a32f2b; }
.text-button { border: 0; color: var(--green-dark); background: transparent; font-size: 13px; font-weight: 800; }
.text-button:hover { text-decoration: underline; }
.overview { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 10px; background: var(--soft); }
.overview-item { min-width: 0; border-radius: 8px; background: #fff; border: 1px solid var(--line); padding: 10px 8px; text-align: center; }
.overview-item strong { display: block; font-size: 19px; line-height: 1; color: var(--ink); }
.overview-item span { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; font-weight: 800; }
.auth-form { display: none; gap: 9px; }
.auth-form.active { display: grid; }
.auth-form label, .pin-form label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 900; }
.auth-form button, .logout-button { border: 0; border-radius: 8px; padding: 11px 12px; color: #fff; background: var(--green); font-weight: 900; }
.auth-message { margin: 9px 0 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.auth-message.success { color: var(--green-dark); font-weight: 800; }
.resend-confirm-button { width: 100%; margin-top: 8px; border: 1px solid var(--line); border-radius: 8px; padding: 9px 10px; color: var(--green-dark); background: var(--soft); font-size: 12px; font-weight: 900; }
.resend-confirm-button:hover { border-color: var(--green); background: var(--soft-strong); }
.auth-signed-in { display: none; gap: 10px; }
.auth-signed-in.active { display: grid; }
.auth-signed-out.hidden { display: none; }
.user-chip { display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 8px; padding: 10px; background: var(--soft); }
.user-chip span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: #fff; background: var(--green); font-size: 13px; font-weight: 900; }
.user-chip strong { display: block; font-size: 14px; }
.user-chip small { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; }
.logout-button { color: var(--ink); background: #fff; border: 1px solid var(--line); }
.ask-row { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; }
input, select, textarea { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 11px 12px; color: var(--ink); background: #fff; }
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(31,138,91,.17); border-color: var(--green); }
.ask-row button, .submit-button, .map-toolbar button { border: 0; border-radius: 8px; padding: 11px 14px; color: #fff; background: var(--green); font-weight: 900; }
.voice-button { background: #245d9f !important; }
.voice-button.listening { background: var(--gold) !important; color: var(--ink); box-shadow: 0 0 0 3px rgba(217,155,43,.22), 0 10px 22px rgba(217,155,43,.22); }
.voice-button.unsupported { opacity: .62; }
.quick-asks { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.quick-asks button { border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); padding: 7px 10px; font-size: 12px; font-weight: 800; }
@media (max-width: 560px) {
  .ask-row { grid-template-columns: 1fr auto; }
  .ask-row input { grid-column: 1 / -1; }
  .voice-button, #askButton { min-height: 42px; }
}
.answer { margin-top: 10px; color: var(--muted); background: var(--soft); border-radius: 8px; padding: 12px; font-size: 14px; line-height: 1.45; }
.answer.strong { color: var(--ink); background: #f0faf5; }
.timeline-range { width: 100%; accent-color: var(--green); }
.timeline-readout { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 8px; padding: 9px 10px; background: var(--soft); }
.timeline-readout strong { color: var(--green-dark); font-size: 18px; line-height: 1; }
.timeline-readout span { color: var(--muted); font-size: 12px; font-weight: 900; text-align: right; }
.timeline-ticks { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0; margin: 7px 3px 3px; color: var(--muted); }
.timeline-ticks span { display: grid; justify-items: center; gap: 4px; min-width: 0; }
.timeline-ticks i { display: block; width: 2px; height: 10px; border-radius: 999px; background: var(--line); }
.timeline-ticks em { font-style: normal; font-size: 10px; font-weight: 900; line-height: 1; }
.timeline-ticks .major i { height: 14px; background: var(--green); }
.timeline-ticks .major em { color: var(--green-dark); }
.timeline-context { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 6px; }
.timeline-context span:nth-child(2) { text-align: center; color: var(--green-dark); }
.timeline-context span:last-child { text-align: right; }
.timeline-marks { display: flex; justify-content: space-between; color: var(--muted); font-size: 11px; font-weight: 800; }
.timeline-marks.timeline-context { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 6px; }
.category-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-height: 320px; overflow: auto; padding-right: 2px; }
.category-filter { display: flex; align-items: center; gap: 8px; min-height: 40px; border: 1px solid var(--line); border-radius: 8px; padding: 8px; background: #fff; font-size: 13px; font-weight: 800; transition: border-color .15s ease, background .15s ease, opacity .15s ease; }
.category-filter.inactive { opacity: .45; }
.category-filter:hover { border-color: var(--green); }
.category-filter input { width: auto; accent-color: var(--green); }
.dot { width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto; }
.selected-empty { color: var(--muted); font-size: 14px; line-height: 1.45; }
.selected-card-title { margin: 0 0 6px; font-size: 16px; line-height: 1.25; }
.selected-card-copy { margin: 0 0 10px; color: var(--muted); font-size: 14px; line-height: 1.4; }
.selected-card-foot, .pin-actions { display: flex; flex-wrap: wrap; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 700; }
.pin-actions { margin-top: 10px; }
.pin-actions button { border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); padding: 7px 9px; font-size: 12px; font-weight: 800; }
.pin-feed { display: flex; flex-direction: column; gap: 10px; }
.pin-card { border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: #fff; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.pin-card:hover { border-color: #b8c9c1; transform: translateY(-1px); }
.pin-card.active { border-color: var(--green); box-shadow: 0 0 0 3px rgba(31,138,91,.13); }
.pin-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.tag { border-radius: 999px; padding: 4px 7px; color: #fff; font-size: 11px; font-weight: 900; }
.privacy, .timer { background: #eef2f0; color: var(--ink); }
.timer.ending { background: #fff5dc; color: #8a5b08; }
.timer.expired { background: #fdeceb; color: #a32f2b; }
.pin-card h3 { margin: 0 0 6px; font-size: 15px; line-height: 1.25; }
.pin-card p { margin: 0 0 8px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.user-line { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 12px; }
.badge { color: var(--green-dark); font-weight: 900; text-align: right; }
.photo-carousel-label { margin: 8px 0 -2px; color: var(--muted); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: 0; }
.photo-strip { display: flex; gap: 10px; margin: 10px 0; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding: 2px 2px 10px; scrollbar-color: var(--green) transparent; }
.photo-strip::-webkit-scrollbar { height: 8px; }
.photo-strip::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(31,138,91,.55); }
.photo-strip::-webkit-scrollbar-track { background: transparent; }
.photo-strip img, .pin-card .mini-photo, .popup-photo { display: block; width: 100%; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); background: var(--soft); }
.photo-strip img { aspect-ratio: 16 / 10; }
.gallery-photo { flex: 0 0 88%; scroll-snap-align: start; margin: 0; min-width: 0; }
.gallery-photo figcaption { margin-top: 5px; color: var(--muted); font-size: 11px; font-weight: 900; line-height: 1.25; }
.pin-card .mini-photo { aspect-ratio: 16 / 7; margin: 2px 0 9px; }
.popup-photo { aspect-ratio: 16 / 9; margin-bottom: 8px; }
.location-line { display: flex; flex-wrap: wrap; gap: 7px; margin: 8px 0; color: var(--muted); font-size: 12px; font-weight: 800; }
.location-line span { border-radius: 999px; background: var(--soft); border: 1px solid var(--line); padding: 5px 8px; }
.comments-block { display: grid; gap: 7px; margin-top: 10px; }
.comment-row { border-left: 3px solid var(--line); padding: 7px 9px; color: var(--muted); background: var(--soft); border-radius: 0 8px 8px 0; font-size: 12px; line-height: 1.4; }
.comment-row strong { color: var(--ink); }
.comment-photo { display: block; width: min(100%, 220px); aspect-ratio: 16 / 10; object-fit: cover; border: 1px solid var(--line); border-radius: 8px; margin: 0 0 7px; background: var(--soft); }
.comment-actions { display: flex; align-items: center; gap: 8px; margin-top: 7px; color: var(--muted); font-size: 11px; font-weight: 900; }
.comment-actions button { border: 1px solid rgba(33,135,91,0.24); border-radius: 999px; padding: 5px 8px; color: var(--green-dark); background: #fff; font-size: 11px; font-weight: 900; }
.discover-grid, .dashboard-grid { display: grid; gap: 10px; }
.discover-card, .dashboard-card { border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: #fff; }
.discover-card button { margin-top: 9px; border: 1px solid var(--line); border-radius: 999px; padding: 7px 10px; background: var(--soft); color: var(--green-dark); font-size: 12px; font-weight: 900; }
.discover-card h3, .dashboard-card h3 { margin: 0 0 6px; font-size: 15px; }
.discover-card p, .dashboard-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.map-stage { position: relative; min-height: 100vh; }
#map { position: absolute; inset: 0; background: #dce5e0; }
.map-toolbar { position: absolute; top: 18px; right: 18px; z-index: 4; display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.map-toolbar button { box-shadow: var(--shadow); }
.map-toolbar .secondary-action { color: var(--ink); background: #fff; border: 1px solid var(--line); }
.map-tip { position: absolute; left: 18px; bottom: 22px; z-index: 4; max-width: 380px; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; color: var(--muted); background: rgba(255,255,255,.94); box-shadow: 0 10px 28px rgba(25,37,32,.12); font-size: 13px; font-weight: 700; }
.pin-form { position: absolute; right: 18px; top: 76px; z-index: 6; display: none; width: min(410px, calc(100vw - 36px)); border: 1px solid var(--line); border-radius: 8px; padding: 16px; background: #fff; box-shadow: var(--shadow); }
.pin-form.open { display: grid; gap: 12px; }
.form-heading { display: flex; justify-content: space-between; align-items: center; }
.form-heading button { border: 0; border-radius: 8px; width: 32px; height: 32px; background: var(--soft); color: var(--ink); font-weight: 900; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.submit-button { width: 100%; }
.leaflet-popup-content { margin: 12px; min-width: 230px; }
.popup-title { margin: 0 0 6px; font-weight: 900; }
.popup-copy { margin: 0 0 8px; color: #52615c; line-height: 1.35; }
.popup-foot { color: #66736f; font-size: 12px; line-height: 1.45; }
.custom-marker { position: relative; display: grid; place-items: center; width: 34px; height: 34px; border: 3px solid #fff; border-radius: 50% 50% 50% 8px; color: #fff; font-weight: 900; transform: rotate(-45deg); box-shadow: 0 6px 18px rgba(0,0,0,.25); }
.custom-marker span { transform: rotate(45deg); font-size: 15px; }
.custom-marker.hot::after { content: ""; position: absolute; inset: -9px; border: 2px solid currentColor; border-radius: 50%; opacity: .35; animation: pulse 1.8s infinite; }
.custom-marker.recent { box-shadow: 0 0 0 7px rgba(31,138,91,.16), 0 6px 18px rgba(0,0,0,.25); }
.custom-marker.expired { filter: grayscale(.8); opacity: .58; }
@keyframes pulse { 0% { transform: scale(.7); opacity: .4; } 100% { transform: scale(1.35); opacity: 0; } }
@media (max-width: 960px) { .app-shell { grid-template-columns: 1fr; grid-template-rows: 56vh auto; } .map-stage { grid-row: 1; min-height: 56vh; } .sidebar { grid-row: 2; height: auto; max-height: none; border-right: 0; border-top: 1px solid var(--line); } .map-toolbar { top: 12px; right: 12px; left: 12px; } .map-tip { left: 12px; right: 12px; bottom: 12px; max-width: none; } }
@media (max-width: 560px) { .sidebar { padding: 14px; } .brand h1 { font-size: 20px; } .overview { grid-template-columns: 1fr 1fr 1fr; } .category-grid, .form-grid { grid-template-columns: 1fr; } .pin-form { left: 12px; right: 12px; top: 66px; width: auto; } .map-toolbar button { padding: 10px 11px; } .user-line { display: block; } .badge { display: block; margin-top: 5px; text-align: left; } }


.pin-viewer {
  position: absolute;
  top: 76px;
  left: 18px;
  z-index: 6;
  display: none;
  width: min(430px, calc(100vw - 36px));
  max-height: calc(100vh - 110px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: var(--shadow);
}
.pin-viewer.open { display: block; }
.viewer-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 12px;
}
.viewer-heading h2 {
  margin: 4px 0 0;
  font-size: 20px;
  line-height: 1.15;
}
.viewer-heading button {
  border: 0;
  border-radius: 8px;
  width: 32px;
  height: 32px;
  background: var(--soft);
  color: var(--ink);
  font-weight: 900;
}
.viewer-category {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 8px;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}
.viewer-body { display: grid; gap: 11px; }
.viewer-main-photo {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--soft);
}
.viewer-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.viewer-detail {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px;
  background: var(--soft);
}
.viewer-detail span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 3px;
}
.viewer-detail strong {
  display: block;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
}
.viewer-actions {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
}
.viewer-actions button {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 7px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}
.viewer-actions button.active {
  border-color: var(--green);
  background: var(--soft-strong);
  color: var(--green-dark);
}
.viewer-description {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.viewer-section-title {
  margin: 3px 0 -3px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}
.viewer-comment-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}
.viewer-comment-form input { min-width: 0; }
.viewer-comment-form input[name="commentPhoto"] { grid-column: 1 / -1; }
.viewer-comment-form button { grid-column: 2; grid-row: 1; }
.viewer-comment-form button {
  border: 0;
  border-radius: 8px;
  padding: 0 12px;
  color: #fff;
  background: var(--green);
  font-weight: 900;
}
.map-pick-note {
  position: absolute;
  left: 18px;
  top: 18px;
  z-index: 4;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 12px;
  color: var(--muted);
  background: rgba(255,255,255,.94);
  box-shadow: 0 8px 24px rgba(25,37,32,.11);
  font-size: 12px;
  font-weight: 900;
}
@media (max-width: 960px) {
  .pin-viewer { left: 12px; right: 12px; top: 66px; width: auto; max-height: calc(56vh - 82px); }
  .map-pick-note { display: none; }
}
@media (max-width: 560px) {
  .viewer-detail-grid, .viewer-actions { grid-template-columns: 1fr 1fr; }
}


/* Visual polish layer */
:root {
  --ink: #14211d;
  --muted: #61706a;
  --line: #d9e4df;
  --panel: rgba(255,255,255,0.94);
  --soft: #f3f7f5;
  --soft-strong: #e5f3ec;
  --green: #21875b;
  --green-dark: #0e5f3b;
  --teal: #277e86;
  --gold: #d39a2f;
  --red: #c9443f;
  --blue: #2f74c8;
  --shadow: 0 18px 50px rgba(21, 35, 29, 0.18);
  --soft-shadow: 0 10px 28px rgba(21, 35, 29, 0.09);
}

body {
  background:
    linear-gradient(135deg, rgba(33,135,91,0.08), rgba(47,116,200,0.06) 46%, rgba(211,154,47,0.07));
}

.app-atmosphere {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.72), rgba(243,247,245,0.28)),
    radial-gradient(circle at 18% 8%, rgba(33,135,91,0.10), transparent 34%),
    radial-gradient(circle at 90% 18%, rgba(211,154,47,0.10), transparent 30%);
  z-index: 0;
}

.app-shell { position: relative; z-index: 1; }
.sidebar {
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(14px);
  box-shadow: 12px 0 38px rgba(24,37,31,0.08);
}
.brand {
  border: 1px solid rgba(217,228,223,0.78);
  border-radius: 12px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(255,255,255,0.96), rgba(235,246,239,0.86));
  box-shadow: var(--soft-shadow);
}
.brand-logo {
  border-radius: 16px;
  background: linear-gradient(145deg, #21875b, #277e86);
  box-shadow: 0 10px 24px rgba(33, 135, 91, 0.28);
}
.brand h1 { font-size: 24px; letter-spacing: 0; }
.brand p { max-width: 28ch; }

.mode-tabs, .auth-tabs {
  background: rgba(243,247,245,0.82);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.72);
}
.mode-tab, .auth-tab { transition: transform .15s ease, color .15s ease, background .15s ease; }
.mode-tab:hover, .auth-tab:hover { transform: translateY(-1px); color: var(--ink); }
.mode-tab.active, .auth-tab.active { box-shadow: 0 8px 22px rgba(21,35,29,0.12); }

section {
  background: rgba(255,255,255,0.94);
  box-shadow: 0 1px 0 rgba(255,255,255,0.82), var(--soft-shadow);
}
.section-heading h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  letter-spacing: 0;
}
.live-pill, .count-badge {
  box-shadow: inset 0 0 0 1px rgba(14,95,59,0.08);
}
.overview {
  background: linear-gradient(135deg, rgba(229,243,236,0.95), rgba(240,245,248,0.95));
}
.overview-item {
  box-shadow: 0 8px 18px rgba(21,35,29,0.06);
}
.overview-item strong { color: var(--green-dark); }

.ask-panel {
  border-color: rgba(33,135,91,0.22);
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(247,251,249,0.94));
}
.ask-row input {
  min-height: 46px;
  box-shadow: inset 0 1px 3px rgba(21,35,29,0.04);
}
.ask-row button, .submit-button, .map-toolbar button, .auth-form button {
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
  box-shadow: 0 10px 22px rgba(33,135,91,0.18);
}
.ask-row button:hover, .submit-button:hover, .map-toolbar button:hover, .auth-form button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(33,135,91,0.24);
}
.quick-asks button {
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.quick-asks button:hover { transform: translateY(-1px); background: #f7fbf9; }
.answer {
  border: 1px solid rgba(217,228,223,0.72);
}

.timeline-panel {
  background: linear-gradient(135deg, rgba(255,255,255,0.96), rgba(245,248,250,0.94));
}
.timeline-range { height: 6px; }
.timeline-marks span:first-child, .timeline-marks span:last-child { color: var(--green-dark); }

.category-grid { scrollbar-width: thin; scrollbar-color: #b9cbc3 transparent; }
.category-filter {
  background: rgba(255,255,255,0.86);
  box-shadow: 0 5px 12px rgba(21,35,29,0.04);
}
.category-filter:hover {
  background: #f8fcfa;
  transform: translateY(-1px);
}
.dot { box-shadow: 0 0 0 3px rgba(255,255,255,0.8), 0 3px 8px rgba(21,35,29,0.18); }

.selected-panel {
  border-color: rgba(39,126,134,0.20);
}
.selected-card-title { font-size: 17px; }
.selected-card-foot span, .location-line span {
  background: rgba(243,247,245,0.9);
}
.pin-actions button, .viewer-actions button, .discover-card button {
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.pin-actions button:hover, .viewer-actions button:hover, .discover-card button:hover {
  transform: translateY(-1px);
  border-color: var(--green);
}

.pin-card {
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(21,35,29,0.06);
}
.pin-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, rgba(33,135,91,0.9), rgba(39,126,134,0.8), rgba(211,154,47,0.75));
  opacity: 0;
  transition: opacity .15s ease;
}
.pin-card:hover::before, .pin-card.active::before { opacity: 1; }
.pin-card:hover { box-shadow: 0 14px 30px rgba(21,35,29,0.10); }
.pin-card.active { background: linear-gradient(180deg, #fff, #f8fcfa); }
.tag { box-shadow: inset 0 -1px 0 rgba(0,0,0,0.12); }
.pin-card .mini-photo, .photo-strip img, .viewer-main-photo, .popup-photo {
  box-shadow: 0 8px 18px rgba(21,35,29,0.10);
}
.comment-row { border-left-color: rgba(33,135,91,0.45); }

.discover-card, .dashboard-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,251,249,0.95));
  box-shadow: var(--soft-shadow);
  transition: transform .15s ease, box-shadow .15s ease;
}
.discover-card:hover, .dashboard-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(21,35,29,0.12);
}
.discover-card h3, .dashboard-card h3 { color: var(--green-dark); }

#map .leaflet-tile-pane { filter: saturate(0.92) contrast(0.98); }
.map-toolbar {
  padding: 6px;
  border: 1px solid rgba(217,228,223,0.78);
  border-radius: 12px;
  background: rgba(255,255,255,0.82);
  backdrop-filter: blur(12px);
  box-shadow: var(--soft-shadow);
}
.map-toolbar button { box-shadow: none; }
.map-toolbar .secondary-action { background: rgba(255,255,255,0.92); }
.map-tip, .map-pick-note {
  backdrop-filter: blur(12px);
  background: rgba(255,255,255,0.88);
}
.custom-marker {
  transition: transform .15s ease, filter .15s ease;
}
.leaflet-marker-icon:hover .custom-marker {
  transform: rotate(-45deg) scale(1.08);
  filter: saturate(1.15);
}

.pin-viewer, .pin-form {
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(16px);
  border-color: rgba(217,228,223,0.86);
}
.viewer-heading {
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
}
.viewer-heading h2 { letter-spacing: 0; }
.viewer-detail {
  background: linear-gradient(180deg, rgba(248,252,250,0.98), rgba(243,247,245,0.92));
}
.viewer-detail strong { font-size: 13px; }
.viewer-actions button.active {
  box-shadow: inset 0 0 0 1px rgba(33,135,91,0.12);
}

.leaflet-control-zoom a {
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
.leaflet-popup-content-wrapper {
  border-radius: 10px;
  box-shadow: 0 16px 38px rgba(21,35,29,0.20);
}

@media (max-width: 960px) {
  .sidebar { background: rgba(255,255,255,0.96); }
  .brand { padding: 10px; }
}


.viewer-actions button[data-action="thumbUp"] {
  border-color: rgba(33,135,91,0.35);
  background: #f0faf5;
  color: var(--green-dark);
}
.viewer-actions button[data-action="thumbDown"] {
  border-color: rgba(201,68,63,0.28);
  background: #fff3f2;
  color: #a32f2b;
}
.viewer-detail strong:has(+ .nothing) { color: inherit; }



.rep-card h3 {
  color: var(--green-dark);
  font-size: 18px;
}
.rep-meter {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--soft);
  margin-top: 10px;
}
.rep-meter span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), var(--teal), var(--gold));
}
.achievement-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.achievement-list span {
  border: 1px solid rgba(33,135,91,.18);
  border-radius: 999px;
  padding: 6px 9px;
  color: var(--green-dark);
  background: var(--soft-strong);
  font-size: 12px;
  font-weight: 900;
}



.profile-card { grid-column: 1 / -1; }
.profile-hero { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: center; }
.profile-avatar { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 18px; color: #fff; background: linear-gradient(135deg, var(--green), var(--teal)); font-size: 18px; font-weight: 900; box-shadow: 0 12px 28px rgba(33,135,91,0.22); overflow:hidden; }
.profile-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.profile-hero h3 { margin: 0 0 4px; font-size: 20px; }
.profile-hero p, .profile-next, .profile-empty { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.profile-meta, .profile-pill-list, .profile-place-list { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.profile-meta span, .profile-pill-list span, .profile-place-list span { border: 1px solid rgba(33,135,91,.18); border-radius: 999px; padding: 6px 9px; color: var(--green-dark); background: var(--soft-strong); font-size: 12px; font-weight: 900; }
.profile-place-list span { color: var(--ink); background: var(--soft); border-color: var(--line); }
.profile-post-list { display: grid; gap: 8px; }
.profile-post-list button { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 9px 10px; color: var(--ink); background: var(--soft); text-align: left; }
.profile-post-list strong { display: block; font-size: 13px; line-height: 1.25; }
.profile-post-list span { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 800; }
.profile-post-list button:hover { border-color: var(--green); background: var(--soft-strong); }
@media (max-width: 560px) { .profile-hero { grid-template-columns: 1fr; } .profile-avatar { width: 54px; height: 54px; border-radius: 15px; } .gallery-photo { flex-basis: 92%; } }

.viewer-actions button[data-action="verify"] {
  border-color: rgba(47,116,200,0.32);
  background: #eef6ff;
  color: #245d9f;
}


/* Pin viewer overlap fixes */
.pin-viewer {
  top: 92px;
  left: 22px;
  max-height: calc(100vh - 138px);
}
.pin-viewer.open {
  isolation: isolate;
}
.leaflet-tooltip {
  max-width: min(320px, calc(100vw - 48px)) !important;
  border: 2px solid rgba(23,32,29,0.22) !important;
  border-radius: 8px !important;
  color: #0f1714 !important;
  background: rgba(255,255,255,0.98) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.28) !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 950 !important;
  padding: 8px 11px !important;
  white-space: normal !important;
  text-shadow: none !important;
}
@media (max-width: 960px) {
  .pin-viewer {
    top: 76px;
    max-height: calc(56vh - 92px);
  }
}


/* Hard fix: keep custom GO panels above Leaflet panes */
.map-stage { isolation: isolate; }
#map { z-index: 1; }
.map-pick-note, .map-tip { z-index: 800; }
.map-toolbar { z-index: 1200; }
.pin-viewer {
  z-index: 1600 !important;
  background: #ffffff !important;
  box-shadow: 0 24px 70px rgba(21, 35, 29, 0.28) !important;
}
.pin-form,
.map-feedback-panel {
  z-index: 1700 !important;
  background: #ffffff !important;
}
.pin-viewer.open,
.pin-form.open,
.map-feedback-panel.open {
  transform: translateZ(0);
}
.leaflet-pane,
.leaflet-top,
.leaflet-bottom {
  z-index: auto;
}


/* Restore Leaflet internal pane order under GO overlays */
#map .leaflet-tile-pane { z-index: 200; }
#map .leaflet-overlay-pane { z-index: 400; }
#map .leaflet-shadow-pane { z-index: 500; }
#map .leaflet-marker-pane { z-index: 600; }
#map .leaflet-tooltip-pane { z-index: 650; }
#map .leaflet-popup-pane { z-index: 700; }
#map .leaflet-top,
#map .leaflet-bottom { z-index: 1000; }


/* Desktop viewport lock: only the sidebar scrolls */
@media (min-width: 961px) {
  html,
  body {
    overflow: hidden;
  }
  .app-shell {
    height: 100vh;
    min-height: 100vh;
    overflow: hidden;
  }
  .sidebar {
    height: 100vh;
    min-height: 0;
    overflow-y: auto;
  }
  .map-stage {
    height: 100vh;
    min-height: 100vh;
    overflow: hidden;
  }
}


/* Fixed desktop pin viewer: prevents map tile overlap while scrolling */
@media (min-width: 961px) {
  .pin-viewer {
    position: fixed !important;
    left: 452px !important;
    top: 92px !important;
    width: min(430px, calc(100vw - 500px)) !important;
    max-height: calc(100vh - 138px) !important;
  }
}


/* Fast post flow */
.quick-post-form .form-heading p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.post-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.post-steps span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 7px;
  color: var(--muted);
  background: var(--soft);
  font-size: 11px;
  font-weight: 900;
  text-align: center;
  white-space: nowrap;
}
.post-steps span.active {
  color: var(--green-dark);
  background: var(--soft-strong);
  border-color: rgba(33,135,91,.22);
}
.priority-field select {
  min-height: 48px;
  border-color: rgba(33,135,91,.32);
  background: #fbfefc;
  font-weight: 900;
}
#dropPinButton {
  font-size: 15px;
  padding-inline: 18px;
}
@media (max-width: 560px) {
  .post-steps {
    grid-template-columns: 1fr 1fr;
  }
}


/* Map place search */
.map-search {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 1250;
  display: grid;
  grid-template-columns: minmax(220px, 360px) auto;
  gap: 8px;
  padding: 6px;
  border: 1px solid rgba(217,228,223,0.78);
  border-radius: 12px;
  background: rgba(255,255,255,0.88);
  backdrop-filter: blur(12px);
  box-shadow: var(--soft-shadow);
}
.map-search input {
  min-height: 42px;
  border-radius: 8px;
  background: rgba(255,255,255,0.96);
}
.map-search button {
  border: 0;
  border-radius: 8px;
  padding: 0 13px;
  color: #fff;
  background: var(--green);
  font-weight: 900;
}
.locate-action {
  border-color: rgba(47,116,200,0.22) !important;
  color: #245d9f !important;
  background: #eef6ff !important;
}
.map-radius-panel {
  display: grid;
  gap: 5px;
  min-width: 180px;
  border-left: 1px solid rgba(217,228,223,0.82);
  padding-left: 10px;
}
.map-radius-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
}
.map-radius-head .count-badge {
  padding: 3px 7px;
  font-size: 11px;
}
.map-radius-panel .timeline-range {
  height: 6px;
}
.map-radius-marks {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}
.search-result-pulse {
  stroke: #245d9f;
  stroke-width: 3;
  fill: rgba(47,116,200,.18);
}
@media (min-width: 961px) {
  .pin-viewer.open ~ .pin-form + .nothing { display: none; }
}
@media (max-width: 960px) {
  .map-search {
    left: 12px;
    right: 12px;
    top: 68px;
    grid-template-columns: 1fr auto auto;
  }
  .map-radius-panel {
    grid-column: 1 / -1;
    min-width: 0;
    border-left: 0;
    border-top: 1px solid rgba(217,228,223,0.82);
    padding: 8px 0 0;
  }
  .map-toolbar {
    justify-content: flex-end;
  }
}
@media (max-width: 560px) {
  .map-search {
    grid-template-columns: 1fr;
  }
  .map-search button {
    min-height: 40px;
  }
}


.viewer-heading h2 {
  order: -1;
  margin: 0 0 8px !important;
  font-size: 22px;
  line-height: 1.12;
}
.viewer-heading .viewer-category {
  margin-top: 0;
}


/* Account settings */
.mode-tabs { grid-template-columns: repeat(auto-fit, minmax(82px, 1fr)); }
.settings-mode-tab, .me-mode-tab { display: none; }
body.signed-in .settings-mode-tab,
body.signed-in .me-mode-tab { display: block; }
.settings-form {
  display: grid;
  gap: 11px;
}
.settings-form label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.settings-toggle-grid {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--soft);
}
.settings-toggle-grid label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-size: 13px;
}
.settings-toggle-grid input {
  width: auto;
  accent-color: var(--green);
}
#openSettingsButton {
  color: var(--green-dark);
  background: var(--soft-strong);
  border-color: rgba(33,135,91,.2);
}
@media (max-width: 560px) {
  .mode-tabs { grid-template-columns: 1fr 1fr; }
  .map-feedback-panel { left: 12px; right: 12px; top: 66px; width: auto; max-height: calc(100vh - 92px); }
}


/* Send feedback overlay */
.map-feedback-panel {
  position: absolute;
  right: 18px;
  top: 76px;
  z-index: 1700;
  display: none;
  width: min(430px, calc(100vw - 36px));
  max-height: calc(100vh - 112px);
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: var(--shadow);
}
.map-feedback-panel.open {
  display: grid;
  gap: 12px;
}
.map-feedback-panel .form-heading p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.feedback-form {
  display: grid;
  gap: 11px;
}
.feedback-form label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.feedback-list-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 2px;
}
.feedback-list-heading strong {
  color: var(--ink);
  font-size: 14px;
}
.feedback-list {
  display: grid;
  gap: 9px;
}
.feedback-item {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--soft);
}
.feedback-item div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.feedback-item strong {
  color: var(--green-dark);
  font-size: 13px;
}
.feedback-item span,
.feedback-item small,
.feedback-empty {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.feedback-item p {
  margin: 0;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.4;
}
.feedback-empty {
  margin: 0;
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--soft);
}


.policy-panel {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
  overflow: hidden;
}
.policy-panel summary {
  cursor: pointer;
  padding: 12px;
  color: var(--green-dark);
  font-weight: 900;
}
.policy-content {
  display: grid;
  gap: 8px;
  padding: 0 12px 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.policy-content h3 {
  margin: 6px 0 0;
  color: var(--ink);
  font-size: 13px;
}
.policy-content p,
.policy-content ul {
  margin: 0;
}
.policy-content ul {
  padding-left: 18px;
}
.policy-content li + li {
  margin-top: 4px;
}


/* Signed-in account moves into Settings */
body.signed-in .auth-panel {
  display: none;
}
.settings-account-card {
  display: none;
  gap: 10px;
  margin-bottom: 12px;
}
body.signed-in .settings-account-card {
  display: grid;
}
.settings-user-chip {
  background: linear-gradient(135deg, var(--soft-strong), #fff);
}
#settingsLogoutButton {
  color: #a32f2b;
  background: #fff3f2;
  border-color: rgba(201,68,63,.22);
}


.crosshair-button {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  border: 1px solid rgba(47,116,200,0.22) !important;
  border-radius: 8px;
  color: #245d9f !important;
  background: #eef6ff !important;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}
.crosshair-button:hover {
  transform: translateY(-1px);
  border-color: #2f74c8 !important;
}
.map-search {
  grid-template-columns: minmax(220px, 360px) auto auto minmax(180px, 260px);
  align-items: center;
}
@media (max-width: 560px) {
  .map-search {
    grid-template-columns: 1fr auto;
  }
  .crosshair-button {
    grid-column: 2;
  }
  .map-radius-panel {
    grid-column: 1 / -1;
  }
}



/* Guest mode moves login/register into Settings */
.auth-tabs { grid-template-columns: repeat(3, 1fr); }
body.guest-mode .auth-panel {
  display: none;
}
body.guest-mode .settings-mode-tab {
  display: block;
}
body.guest-mode .me-mode-tab {
  display: none;
}
.settings-auth-box {
  display: none;
  border: 1px solid rgba(33,135,91,.18);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 12px;
  background: linear-gradient(135deg, var(--soft-strong), #fff);
}
body.guest-mode:not(.signed-in) .settings-auth-box {
  display: block;
}
.settings-auth-box p {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.settings-auth-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.settings-auth-actions button {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  color: var(--green-dark);
  background: #fff;
  font-weight: 900;
}
.settings-auth-actions button:hover {
  border-color: var(--green);
  background: var(--soft);
}


.settings-auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 10px 0;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
}
.settings-auth-tabs button {
  border: 0;
  border-radius: 7px;
  padding: 9px 10px;
  color: var(--muted);
  background: transparent;
  font-weight: 900;
}
.settings-auth-tabs button.active {
  color: var(--green-dark);
  background: #fff;
  box-shadow: 0 5px 14px rgba(25,37,32,0.08);
}
.settings-auth-form {
  display: none;
  gap: 9px;
}
.settings-auth-form.active {
  display: grid;
}
.settings-auth-form label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.settings-auth-form button {
  border: 0;
  border-radius: 8px;
  padding: 11px 12px;
  color: #fff;
  background: var(--green);
  font-weight: 900;
}


/* Guest read-only contribution locks */
.contribution-lock {
  display: grid;
  gap: 3px;
  margin: 10px 0;
  padding: 10px 12px;
  border: 1px solid rgba(36,93,159,0.16);
  border-radius: 8px;
  color: #245d9f;
  background: #eef6ff;
  font-size: 12px;
  line-height: 1.35;
}
.contribution-lock strong {
  color: #1c4f87;
  font-size: 12px;
}
.contribution-lock span {
  color: #55708b;
  font-weight: 700;
}
.contribution-lock.compact {
  margin-top: 8px;
}
.viewer-actions.readonly,
.pin-actions.readonly {
  grid-template-columns: 1fr;
}
#dropPinButton.requires-login {
  background: #eef6ff;
  color: #245d9f;
  border: 1px solid rgba(47,116,200,0.22);
}
#dropPinButton.requires-login:hover {
  border-color: #2f74c8;
}


.privacy-note {
  margin: -4px 0 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}


/* Dark and light theme toggle */
.theme-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--muted);
  background: var(--soft);
  font-size: 12px;
  font-weight: 900;
}
.theme-switch button {
  min-width: 76px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 10px;
  color: var(--green-dark);
  background: #fff;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 5px 14px rgba(25,37,32,0.08);
}
.theme-switch button:hover {
  border-color: var(--green);
}

/* Clean quick post panel */
.quick-post-form {
  width: min(460px, calc(100vw - 36px));
  max-height: calc(100vh - 108px);
  overflow-y: auto;
}
.post-section {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  background: linear-gradient(180deg, #fbfefc, #f4faf7);
}
.post-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.post-section-head strong {
  display: block;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.25;
}
.section-kicker {
  display: block;
  margin-bottom: 2px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
}
.location-status,
.optional-pill {
  flex: 0 0 auto;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid rgba(33,135,91,.22);
  border-radius: 999px;
  padding: 5px 8px;
  color: var(--green-dark);
  background: var(--soft-strong);
  font-size: 11px;
  font-weight: 900;
}
.location-choice-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 7px;
}
.location-choice-row button,
.address-row button {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 8px;
  color: var(--ink);
  background: #fff;
  font-size: 12px;
  font-weight: 900;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.location-choice-row button:hover,
.location-choice-row button.active,
.address-row button:hover {
  transform: translateY(-1px);
  border-color: var(--green);
  color: var(--green-dark);
  background: var(--soft-strong);
}
.address-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}
.file-upload {
  display: grid;
  gap: 8px;
  border: 1px dashed rgba(33,135,91,.34);
  border-radius: 8px;
  padding: 11px;
  color: var(--green-dark) !important;
  background: rgba(232,248,239,.65);
  cursor: pointer;
}
.file-upload span {
  font-size: 13px;
  font-weight: 900;
}
.file-upload input {
  width: 100%;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.photo-preview {
  display: grid;
  gap: 7px;
  min-height: 44px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  color: var(--muted);
  background: #fff;
  font-size: 12px;
  font-weight: 900;
}
.photo-preview img {
  width: 100%;
  aspect-ratio: 16 / 8;
  object-fit: cover;
  border-radius: 7px;
  border: 1px solid var(--line);
}
.photo-preview.empty {
  min-height: 38px;
  background: rgba(247,251,249,.9);
}
.advanced-post-options {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 11px;
  background: var(--soft);
}
.advanced-post-options summary {
  cursor: pointer;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
}
.advanced-post-options[open] {
  display: grid;
  gap: 10px;
}
.pin-form.picking-location .post-location-card {
  border-color: var(--green);
  box-shadow: 0 0 0 4px rgba(33,135,91,.12);
}
@media (max-width: 560px) {
  .quick-post-form { max-height: calc(100vh - 92px); }
  .location-choice-row { grid-template-columns: 1fr; }
  .address-row { grid-template-columns: 1fr; }
  .location-status, .optional-pill { max-width: 120px; }
}

body.theme-dark {
  color-scheme: dark;
  --ink: #e5eee9;
  --muted: #a8b8b1;
  --line: #2b3c35;
  --panel: rgba(14, 21, 18, 0.96);
  --soft: #111c18;
  --soft-strong: #183426;
  --green: #46cf8f;
  --green-dark: #86e8b5;
  --teal: #55c3cc;
  --gold: #d9aa4d;
  --red: #f07770;
  --blue: #72a8ff;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.42);
  --soft-shadow: 0 12px 34px rgba(0, 0, 0, 0.28);
  background: linear-gradient(135deg, rgba(17,28,24,0.98), rgba(20,31,36,0.96) 48%, rgba(29,25,16,0.92));
}
body.theme-dark .app-atmosphere {
  background:
    linear-gradient(180deg, rgba(8,13,11,0.68), rgba(13,21,18,0.86)),
    radial-gradient(circle at 20% 8%, rgba(70,207,143,0.13), transparent 34%),
    radial-gradient(circle at 90% 18%, rgba(217,170,77,0.10), transparent 30%);
}
body.theme-dark .sidebar {
  background: rgba(12,18,16,0.96);
  box-shadow: 12px 0 38px rgba(0,0,0,0.26);
}
body.theme-dark .brand,
body.theme-dark section,
body.theme-dark .pin-form,
body.theme-dark .pin-viewer,
body.theme-dark .map-feedback-panel,
body.theme-dark .map-toolbar {
  background: linear-gradient(180deg, rgba(18,28,24,0.97), rgba(14,22,19,0.96));
  border-color: var(--line);
  box-shadow: var(--soft-shadow);
}
body.theme-dark .mode-tabs,
body.theme-dark .auth-tabs,
body.theme-dark .theme-switch,
body.theme-dark .overview,
body.theme-dark .settings-toggle-grid,
body.theme-dark .settings-auth-tabs {
  background: rgba(17,28,24,0.92);
  border-color: var(--line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}
body.theme-dark .mode-tab.active,
body.theme-dark .auth-tab.active,
body.theme-dark .settings-auth-tabs button.active,
body.theme-dark .theme-switch button,
body.theme-dark .overview-item,
body.theme-dark .category-filter,
body.theme-dark .pin-card,
body.theme-dark .discover-card,
body.theme-dark .dashboard-card,
body.theme-dark .user-chip,
body.theme-dark input,
body.theme-dark select,
body.theme-dark textarea,
body.theme-dark .quick-asks button,
body.theme-dark .pin-actions button,
body.theme-dark .viewer-actions button,
body.theme-dark .logout-button,
body.theme-dark .map-toolbar .secondary-action,
body.theme-dark .comment-actions button,
body.theme-dark .location-choice-row button,
body.theme-dark .address-row button,
body.theme-dark .file-upload {
  color: var(--ink);
  background: #15231e;
  border-color: var(--line);
}
body.theme-dark input::placeholder,
body.theme-dark textarea::placeholder {
  color: #778982;
}
body.theme-dark .ask-panel,
body.theme-dark .timeline-readout,
body.theme-dark .timeline-panel,
body.theme-dark .selected-panel,
body.theme-dark .settings-auth-box,
body.theme-dark .settings-user-chip,
body.theme-dark .feedback-item,
body.theme-dark .feedback-empty,
body.theme-dark .post-section,
body.theme-dark .photo-preview,
body.theme-dark .advanced-post-options,
body.theme-dark .pin-card.active,
body.theme-dark .answer,
body.theme-dark .comment-row,
body.theme-dark .viewer-detail,
body.theme-dark .location-line span,
body.theme-dark .selected-card-foot span {
  background: #13221d;
  border-color: var(--line);
}
body.theme-dark .answer.strong,
body.theme-dark .viewer-actions button.active {
  background: #183426;
  color: var(--green-dark);
}
body.theme-dark .privacy,
body.theme-dark .timer {
  background: #20332d;
  color: var(--ink);
}
body.theme-dark .timer.ending {
  background: #392f17;
  color: #f0c969;
}
body.theme-dark .timer.expired {
  background: #3b1f1f;
  color: #ff9a94;
}
body.theme-dark .map-tip,
body.theme-dark .map-pick-note {
  background: rgba(15,24,20,0.92);
  border-color: var(--line);
  color: var(--muted);
}
body.theme-dark .map-radius-panel {
  border-color: var(--line);
}
body.theme-dark .leaflet-tooltip {
  color: #f4fbf7 !important;
  background: rgba(13,21,18,0.96) !important;
  border-color: rgba(134,232,181,0.36) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.52) !important;
}
body.theme-dark #map .leaflet-tile-pane {
  filter: brightness(0.72) saturate(0.78) contrast(1.08);
}
body.theme-dark .leaflet-control-zoom a,
body.theme-dark .timeline-ticks i,
body.theme-dark .leaflet-control-attribution {
  background: #14211d;
  color: var(--ink);
  border-color: var(--line);
}
body.theme-dark .crosshair-button,
body.theme-dark #dropPinButton.requires-login {
  background: #182d3e !important;
  color: #9cc9ff !important;
  border-color: rgba(114,168,255,0.28) !important;
}
body.theme-dark .voice-button {
  background: #245d9f !important;
  color: #fff;
}
body.theme-dark .voice-button.listening {
  background: var(--gold) !important;
  color: #17201d;
}

/* Readability contrast pass */
:root {
  --ink: #101a16;
  --muted: #35443f;
  --line: #c7d5ce;
  --soft: #f2f7f4;
  --soft-strong: #dff1e8;
  --green: #176f4c;
  --green-dark: #073f2a;
  --gold: #a86707;
  --red: #a8322e;
  --blue: #1f5fb8;
}
body.theme-dark {
  --ink: #f5fbf8;
  --muted: #d4e1db;
  --line: #40554c;
  --soft: #101b17;
  --soft-strong: #1f3b2e;
  --green: #52d99a;
  --green-dark: #a6f0ca;
  --gold: #f0c866;
  --red: #ff9d96;
  --blue: #a7ceff;
}
body,
button,
input,
select,
textarea {
  color: var(--ink);
}
input::placeholder,
textarea::placeholder {
  color: #4f5f59;
  opacity: 1;
}
body.theme-dark input::placeholder,
body.theme-dark textarea::placeholder {
  color: #c1d0c9;
  opacity: 1;
}
.brand p,
.mode-tab,
.auth-tab,
.auth-message,
.user-chip small,
.answer,
.timeline-readout span,
.timeline-ticks,
.timeline-marks,
.selected-empty,
.selected-card-copy,
.selected-card-foot,
.pin-card p,
.user-line,
.photo-carousel-label,
.gallery-photo figcaption,
.location-line,
.comment-row,
.comment-actions,
.discover-card p,
.dashboard-card p,
.feedback-item span,
.feedback-item small,
.feedback-empty,
.privacy-note,
.file-upload input,
.photo-preview,
.policy-content,
.map-radius-head span,
.map-radius-marks,
.section-kicker {
  color: var(--muted);
}
.mode-tab,
.auth-tab,
.category-filter,
.location-line span,
.selected-card-foot span,
.viewer-detail span,
.feedback-list-heading strong,
.advanced-post-options summary {
  color: var(--ink);
}
.mode-tab.active,
.auth-tab.active,
.live-pill,
.count-badge,
.text-button,
.badge,
.timeline-readout strong,
.timeline-context span:nth-child(2),
.timeline-ticks .major em,
.discover-card h3,
.dashboard-card h3,
.feedback-item strong,
.location-status,
.optional-pill {
  color: var(--green-dark);
}
.category-filter.inactive {
  opacity: .82;
}
.category-filter.inactive span,
.category-filter.inactive strong {
  color: var(--muted);
}
button:disabled,
.voice-button.unsupported {
  opacity: .9;
}
.custom-marker.expired {
  opacity: .78;
}
.map-tip,
.map-pick-note {
  color: #1f2d28;
  background: rgba(255,255,255,.97);
  border-color: #bccdc5;
  font-weight: 800;
}
.leaflet-tooltip {
  color: #102018 !important;
  background: rgba(255,255,255,.98) !important;
  border-color: #9eb3aa !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}
.popup-copy,
.popup-foot {
  color: #33423d;
}
.privacy,
.timer,
.location-line span,
.selected-card-foot span,
.answer,
.comment-row,
.feedback-item,
.feedback-empty,
.photo-preview,
.advanced-post-options {
  border-color: var(--line);
}
.tag,
.custom-marker span,
.viewer-category {
  text-shadow: 0 1px 2px rgba(0,0,0,.45);
}
body.theme-dark .mode-tab,
body.theme-dark .auth-tab,
body.theme-dark .category-filter,
body.theme-dark .location-line span,
body.theme-dark .selected-card-foot span,
body.theme-dark .viewer-detail span,
body.theme-dark .feedback-list-heading strong,
body.theme-dark .advanced-post-options summary {
  color: var(--ink);
}
body.theme-dark .map-tip,
body.theme-dark .map-pick-note {
  color: var(--ink);
  background: rgba(12,20,17,.97);
  border-color: var(--line);
}
body.theme-dark .leaflet-tooltip {
  color: var(--ink) !important;
  background: rgba(11,18,15,.98) !important;
  border-color: rgba(166,240,202,.5) !important;
}
body.theme-dark .popup-copy,
body.theme-dark .popup-foot {
  color: #e3eee8;
}
body.theme-dark .leaflet-control-zoom a,
body.theme-dark .leaflet-control-attribution {
  color: var(--ink) !important;
}

.pin-card p,
.selected-card-copy,
.discover-card p,
.dashboard-card p,
.profile-hero p,
.profile-next,
.profile-empty,
.profile-post-list span,
.popup-copy,
.popup-foot,
.comment-row,
.answer,
.feedback-item p,
.policy-content,
.viewer-detail strong {
  font-weight: 700;
}

/* Light mode overlay contrast fixes */
.pin-viewer,
.pin-form,
.map-feedback-panel {
  color: #101a16 !important;
}
.viewer-heading h2,
.form-heading h2,
.viewer-section-title,
.selected-card-title,
.feedback-list-heading strong {
  color: #101a16 !important;
}
.viewer-description,
.selected-card-copy,
.viewer-detail strong,
.feedback-item p,
.pin-card p,
.popup-title {
  color: #1d2a25 !important;
}
.viewer-detail span,
.photo-carousel-label,
.gallery-photo figcaption,
.location-line,
.user-line,
.comment-actions,
.feedback-item span,
.feedback-item small,
.auth-message,
.privacy-note,
.section-kicker,
.file-upload input,
.photo-preview {
  color: #35443f !important;
}
.viewer-detail,
.comment-row,
.feedback-item,
.feedback-empty,
.post-section,
.photo-preview,
.advanced-post-options,
.location-line span,
.selected-card-foot span {
  background: #f6faf8 !important;
  border-color: #c7d5ce !important;
}
.viewer-actions button,
.pin-actions button,
.viewer-comment-form input,
.viewer-comment-form button,
.location-choice-row button,
.address-row button,
.file-upload,
.advanced-post-options summary {
  color: #101a16 !important;
  background: #ffffff !important;
  border-color: #c7d5ce !important;
}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  color: #101a16 !important;
  background: #ffffff !important;
}
.leaflet-popup-content,
.popup-copy,
.popup-foot {
  color: #1d2a25 !important;
}


/* Dark mode overlay contrast fixes */
body.theme-dark .pin-viewer,
body.theme-dark .pin-form,
body.theme-dark .map-feedback-panel {
  color: var(--ink) !important;
  background: #101b17 !important;
  border-color: #52675e !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.62) !important;
}
body.theme-dark .pin-viewer *,
body.theme-dark .pin-form *,
body.theme-dark .map-feedback-panel * {
  text-shadow: none;
}
body.theme-dark .viewer-heading,
body.theme-dark .form-heading {
  border-color: #52675e !important;
}
body.theme-dark .viewer-heading h2,
body.theme-dark .form-heading h2,
body.theme-dark .viewer-section-title,
body.theme-dark .selected-card-title,
body.theme-dark .feedback-list-heading strong {
  color: #f8fffb !important;
}
body.theme-dark .viewer-description,
body.theme-dark .selected-card-copy,
body.theme-dark .viewer-detail strong,
body.theme-dark .comment-row,
body.theme-dark .feedback-item p,
body.theme-dark .pin-card p,
body.theme-dark .popup-title {
  color: #edf7f2 !important;
}
body.theme-dark .viewer-detail span,
body.theme-dark .viewer-category,
body.theme-dark .photo-carousel-label,
body.theme-dark .gallery-photo figcaption,
body.theme-dark .location-line,
body.theme-dark .user-line,
body.theme-dark .comment-actions,
body.theme-dark .feedback-item span,
body.theme-dark .feedback-item small,
body.theme-dark .auth-message,
body.theme-dark .privacy-note,
body.theme-dark .section-kicker,
body.theme-dark .file-upload input,
body.theme-dark .photo-preview {
  color: #dceae4 !important;
}
body.theme-dark .viewer-detail,
body.theme-dark .comment-row,
body.theme-dark .feedback-item,
body.theme-dark .feedback-empty,
body.theme-dark .post-section,
body.theme-dark .photo-preview,
body.theme-dark .advanced-post-options,
body.theme-dark .location-line span,
body.theme-dark .selected-card-foot span {
  color: var(--ink) !important;
  background: #172720 !important;
  border-color: #4a6056 !important;
}
body.theme-dark .viewer-actions button,
body.theme-dark .pin-actions button,
body.theme-dark .viewer-comment-form input,
body.theme-dark .viewer-comment-form button,
body.theme-dark .location-choice-row button,
body.theme-dark .address-row button,
body.theme-dark .file-upload,
body.theme-dark .advanced-post-options summary,
body.theme-dark input,
body.theme-dark select,
body.theme-dark textarea {
  color: #f8fffb !important;
  background: #1d3028 !important;
  border-color: #5a7167 !important;
}
body.theme-dark .viewer-actions button.active,
body.theme-dark .pin-actions button.active,
body.theme-dark .viewer-actions button[data-action="thumbUp"],
body.theme-dark .viewer-actions button[data-action="verify"] {
  color: #062618 !important;
  background: #9ff0c6 !important;
  border-color: #baf8d5 !important;
}
body.theme-dark .viewer-actions button[data-action="thumbDown"] {
  color: #2a0706 !important;
  background: #ffb8b3 !important;
  border-color: #ffd0cc !important;
}
body.theme-dark .leaflet-popup-content-wrapper,
body.theme-dark .leaflet-popup-tip {
  color: var(--ink) !important;
  background: #101b17 !important;
  border: 1px solid #52675e !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.58) !important;
}
body.theme-dark .leaflet-popup-content,
body.theme-dark .popup-copy,
body.theme-dark .popup-foot {
  color: #edf7f2 !important;
}
body.theme-dark .popup-foot strong {
  color: #a6f0ca !important;
}
body.theme-dark .tag,
body.theme-dark .custom-marker span,
body.theme-dark .viewer-category {
  text-shadow: 0 1px 2px rgba(0,0,0,.72) !important;
}
body.theme-dark .count-badge,
body.theme-dark .live-pill,
body.theme-dark .location-status,
body.theme-dark .optional-pill,
body.theme-dark .badge {
  color: #092819 !important;
  background: #a6f0ca !important;
  border-color: #bff8d8 !important;
}
body.theme-dark .map-toolbar .secondary-action {
  color: #f8fffb !important;
  background: #1d3028 !important;
  border-color: #5a7167 !important;
}

/* Polished floating map search */
.map-search {
  top: 16px !important;
  left: 18px !important;
  grid-template-columns: minmax(260px, 390px) auto auto auto minmax(190px, 255px) !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 8px !important;
  border: 1px solid rgba(255,255,255,.78) !important;
  border-radius: 24px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.86), rgba(245,251,248,.72)) !important;
  box-shadow: 0 18px 48px rgba(20,35,29,.18), inset 0 1px 0 rgba(255,255,255,.82) !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
}
.map-search input {
  min-height: 44px !important;
  border-radius: 999px !important;
  border-color: rgba(156,180,169,.62) !important;
  padding: 0 16px !important;
  color: #101a16 !important;
  background: rgba(255,255,255,.96) !important;
  box-shadow: inset 0 1px 3px rgba(20,35,29,.06) !important;
}
.map-search input:focus {
  border-color: rgba(23,111,76,.58) !important;
  box-shadow: 0 0 0 4px rgba(23,111,76,.14), inset 0 1px 3px rgba(20,35,29,.06) !important;
}
.map-search button {
  min-height: 44px !important;
  border-radius: 999px !important;
  padding: 0 17px !important;
  box-shadow: none !important;
}
#mapSearchButton {
  background: linear-gradient(135deg, #176f4c, #21875b) !important;
  color: #fff !important;
}
.crosshair-button {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  border-color: rgba(31,95,184,.28) !important;
  color: #164f9c !important;
  background: linear-gradient(135deg, #f7fbff, #e7f1ff) !important;
  font-size: 21px !important;
}
.map-radius-panel {
  min-width: 0 !important;
  border: 1px solid rgba(156,180,169,.44) !important;
  border-left: 1px solid rgba(156,180,169,.44) !important;
  border-radius: 18px !important;
  padding: 7px 12px 8px !important;
  background: rgba(255,255,255,.62) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72) !important;
}
.map-radius-head {
  color: #35443f !important;
  text-transform: none !important;
  font-size: 12px !important;
}
.map-radius-marks {
  color: #53645e !important;
}
.map-radius-panel .timeline-range {
  accent-color: #176f4c !important;
}
@media (max-width: 960px) {
  .map-search {
    top: 64px !important;
    left: 12px !important;
    right: 12px !important;
    grid-template-columns: 1fr auto auto auto !important;
    border-radius: 20px !important;
  }
  .map-radius-panel {
    grid-column: 1 / -1 !important;
    border-top: 1px solid rgba(156,180,169,.44) !important;
  }
}
@media (max-width: 560px) {
  .map-search {
    grid-template-columns: 1fr auto auto !important;
    border-radius: 18px !important;
  }
  .map-search input {
    grid-column: 1 / -1 !important;
  }
  #mapSearchButton {
    grid-column: 1 !important;
  }
  .map-voice-button {
    grid-column: 2 !important;
  }
  .crosshair-button {
    grid-column: 3 !important;
  }
  .map-radius-panel {
    grid-column: 1 / -1 !important;
  }
}
body.theme-dark .map-search {
  border-color: rgba(91,116,105,.64) !important;
  background: linear-gradient(135deg, rgba(18,30,25,.91), rgba(14,23,20,.78)) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
body.theme-dark .map-search input {
  color: #f8fffb !important;
  background: rgba(24,42,35,.96) !important;
  border-color: #5a7167 !important;
}
body.theme-dark #mapSearchButton {
  color: #062618 !important;
  background: linear-gradient(135deg, #86e8b5, #52d99a) !important;
}
body.theme-dark .crosshair-button {
  color: #d8ebff !important;
  background: linear-gradient(135deg, #20384e, #172d42) !important;
  border-color: rgba(167,206,255,.38) !important;
}
body.theme-dark .map-radius-panel {
  color: #f8fffb !important;
  background: rgba(24,42,35,.78) !important;
  border-color: #5a7167 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}
body.theme-dark .map-radius-head,
body.theme-dark .map-radius-marks {
  color: #d4e1db !important;
}


/* Map search autocomplete */
.map-search {
  overflow: visible !important;
}
.map-search-suggestions {
  position: absolute;
  left: 8px;
  top: calc(100% + 8px);
  z-index: 1200;
  display: none;
  width: min(390px, calc(100vw - 36px));
  max-height: 330px;
  overflow: auto;
  padding: 7px;
  border: 1px solid rgba(156,180,169,.58);
  border-radius: 18px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 18px 46px rgba(20,35,29,.22);
  backdrop-filter: blur(14px) saturate(1.06);
}
.map-search-suggestions.open {
  display: grid;
  gap: 5px;
}
.map-search .map-search-suggestion {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 54px !important;
  height: auto !important;
  padding: 9px 11px !important;
  border: 1px solid transparent !important;
  border-radius: 13px !important;
  color: #14211b !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
}
.map-search .map-search-suggestion:hover,
.map-search .map-search-suggestion.active {
  border-color: rgba(33,135,91,.24) !important;
  background: rgba(229,246,238,.88) !important;
}
.map-search .map-search-suggestion span {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.map-search .map-search-suggestion strong {
  overflow: hidden;
  color: #102018;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.map-search .map-search-suggestion small {
  overflow: hidden;
  color: #53645e;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.map-search .map-search-suggestion em {
  border: 1px solid rgba(33,135,91,.18);
  border-radius: 999px;
  padding: 4px 7px;
  color: #176f4c;
  background: #eff8f3;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  white-space: nowrap;
}
@media (max-width: 960px) {
  .map-search-suggestions {
    width: calc(100% - 16px);
  }
}
body.theme-dark .map-search-suggestions {
  border-color: #5a7167;
  background: rgba(18,30,25,.98);
  box-shadow: 0 18px 46px rgba(0,0,0,.5);
}
body.theme-dark .map-search .map-search-suggestion {
  color: #f8fffb !important;
}
body.theme-dark .map-search .map-search-suggestion:hover,
body.theme-dark .map-search .map-search-suggestion.active {
  border-color: rgba(134,232,181,.32) !important;
  background: rgba(43,70,59,.96) !important;
}
body.theme-dark .map-search .map-search-suggestion strong {
  color: #f8fffb;
}
body.theme-dark .map-search .map-search-suggestion small {
  color: #d4e1db;
}
body.theme-dark .map-search .map-search-suggestion em {
  color: #9ff2c3;
  background: rgba(134,232,181,.12);
  border-color: rgba(134,232,181,.28);
}


/* Radius clear control */
.map-radius-head {
  display: grid !important;
  grid-template-columns: auto auto auto !important;
  align-items: center !important;
  gap: 8px !important;
}
.map-radius-head button {
  min-height: 0 !important;
  height: 28px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(36,93,159,.26) !important;
  border-radius: 999px !important;
  color: #245d9f !important;
  background: rgba(235,244,255,.95) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}
.map-radius-head button:disabled {
  cursor: default;
  opacity: .46;
  color: #65756f !important;
  background: rgba(245,248,246,.78) !important;
}
.map-radius-head button:not(:disabled):hover {
  color: #fff !important;
  background: #245d9f !important;
}
body.theme-dark .map-radius-head button {
  color: #d8ebff !important;
  background: rgba(32,56,78,.94) !important;
  border-color: rgba(167,206,255,.32) !important;
}
body.theme-dark .map-radius-head button:disabled {
  color: #aabbb3 !important;
  background: rgba(36,54,47,.74) !important;
  border-color: #5a7167 !important;
}
body.theme-dark .map-radius-head button:not(:disabled):hover {
  color: #081f31 !important;
  background: #9ccfff !important;
}


/* Post category type selector */
.post-taxonomy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 12px;
}
.tag.subtype {
  color: #173126;
  background: #eaf5ef;
  border: 1px solid rgba(33,135,91,.22);
}
body.theme-dark .tag.subtype {
  color: #dffceb;
  background: rgba(81,139,104,.28);
  border-color: rgba(134,232,181,.28);
}
@media (max-width: 560px) {
  .post-taxonomy-grid {
    grid-template-columns: 1fr;
  }
}


/* Clean Discover tab */
#discoverView {
  gap: 12px;
}
#discoverView .ask-panel {
  order: -3;
  position: sticky;
  top: -1px;
  z-index: 3;
  padding: 12px;
  border-radius: 12px;
  box-shadow: 0 14px 34px rgba(21,35,29,.11);
}
#discoverView .ask-panel .section-heading {
  margin-bottom: 9px;
}
#discoverView .ask-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
}
#discoverView .ask-row input {
  min-height: 42px;
  border-radius: 999px;
  padding-inline: 15px;
}
#discoverView .ask-row button {
  min-height: 42px;
  border-radius: 999px;
  padding-inline: 13px;
}
#discoverView .quick-asks {
  margin-top: 8px;
}
#discoverView .answer {
  margin-top: 8px;
  padding: 10px 11px;
}
#discoverView .timeline-panel {
  padding: 12px;
  border-radius: 12px;
}
#discoverView .timeline-readout {
  grid-template-columns: 1fr;
  gap: 3px;
  padding: 8px 10px;
}
#discoverView .timeline-readout span {
  text-align: left;
}
.discover-panel {
  padding: 12px;
  border-radius: 12px;
}
.discover-grid {
  gap: 8px;
}
.discover-card.clean {
  display: grid;
  gap: 8px;
  padding: 11px;
  cursor: pointer;
}
.discover-card.clean:hover,
.discover-card.clean:focus-visible {
  border-color: rgba(33,135,91,.38);
  outline: none;
}
.discover-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.discover-card-head h3 {
  margin: 0;
  font-size: 14px;
}
.discover-card-head span {
  display: inline-grid;
  place-items: center;
  min-width: 28px;
  height: 24px;
  border-radius: 999px;
  color: var(--green-dark);
  background: var(--soft-strong);
  font-size: 12px;
  font-weight: 900;
}
.discover-card.clean > p,
.discover-empty {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.discover-mini-list {
  display: grid;
  gap: 6px;
}
.discover-mini-item {
  display: grid;
  gap: 2px;
  padding: 8px 9px;
  border: 1px solid rgba(217,228,223,.78);
  border-radius: 8px;
  background: rgba(247,251,249,.82);
}
.discover-mini-item strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.discover-mini-item span {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 560px) {
  #discoverView .ask-row {
    grid-template-columns: 1fr auto;
  }
  #discoverView .ask-row input {
    grid-column: 1 / -1;
  }
}
body.theme-dark #discoverView .ask-panel,
body.theme-dark #discoverView .timeline-panel,
body.theme-dark .discover-panel {
  background: #13221d;
  border-color: var(--line);
}
body.theme-dark .discover-card-head span {
  color: #9ff2c3;
  background: rgba(134,232,181,.12);
}
body.theme-dark .discover-mini-item {
  border-color: #31463d;
  background: rgba(21,35,30,.96);
}
body.theme-dark .discover-mini-item strong {
  color: var(--ink);
}
body.theme-dark .discover-mini-item span,
body.theme-dark .discover-empty {
  color: var(--muted);
}


/* Icon voice controls */
.icon-button {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 44px !important;
  width: 44px !important;
  min-height: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  line-height: 1 !important;
}
.mic-icon,
.mic-icon svg {
  display: block;
  width: 20px;
  height: 20px;
}
.mic-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.map-search .icon-button {
  padding: 0 !important;
}
.map-voice-button {
  color: #164f9c !important;
  background: linear-gradient(135deg, #f7fbff, #e7f1ff) !important;
  border: 1px solid rgba(31,95,184,.28) !important;
}
.map-voice-button.listening,
.voice-button.listening {
  animation: voicePulse 1.15s ease-in-out infinite;
}
.map-voice-button.unsupported {
  opacity: .62;
}
@keyframes voicePulse {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-1px) scale(1.04); }
}
body.theme-dark .map-voice-button {
  color: #d8ebff !important;
  background: linear-gradient(135deg, #20384e, #172d42) !important;
  border-color: rgba(167,206,255,.38) !important;
}
body.theme-dark .map-voice-button.listening {
  color: #081f31 !important;
  background: #9ccfff !important;
}


/* Ask GO visual pin results */
.ask-results {
  display: none;
  gap: 7px;
  margin-top: 10px;
}
.ask-results.open {
  display: grid;
}
.ask-results-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
}
.ask-results-head span {
  color: var(--muted);
  font-weight: 800;
}
.ask-result-pin {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 68px;
  padding: 7px;
  border: 1px solid rgba(217,228,223,.9);
  border-radius: 10px;
  color: var(--ink);
  background: rgba(255,255,255,.92);
  text-align: left;
  box-shadow: 0 8px 18px rgba(21,35,29,.06);
}
.ask-result-pin:hover,
.ask-result-pin:focus-visible {
  border-color: rgba(33,135,91,.42);
  background: #f7fbf9;
  outline: none;
  transform: translateY(-1px);
}
.ask-result-thumb {
  display: grid;
  place-items: center;
  width: 56px;
  height: 52px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--soft);
}
.ask-result-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ask-result-thumb span {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  font-weight: 900;
}
.ask-result-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.ask-result-copy strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ask-result-copy small {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.theme-dark .ask-result-pin {
  color: var(--ink);
  background: #15231e;
  border-color: var(--line);
  box-shadow: 0 8px 18px rgba(0,0,0,.22);
}
body.theme-dark .ask-result-pin:hover,
body.theme-dark .ask-result-pin:focus-visible {
  background: #1a2d26;
  border-color: rgba(134,232,181,.34);
}
body.theme-dark .ask-result-copy strong {
  color: var(--ink);
}
body.theme-dark .ask-result-copy small,
body.theme-dark .ask-results-head span {
  color: var(--muted);
}


/* Ask GO result sorting */
.ask-results-head > div:first-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.ask-result-toggle {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--soft);
}
.ask-result-toggle button {
  min-height: 28px;
  border: 0;
  border-radius: 999px;
  padding: 0 9px;
  color: var(--muted);
  background: transparent;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.ask-result-toggle button.active {
  color: #fff;
  background: var(--green);
}
@media (max-width: 430px) {
  .ask-results-head {
    align-items: stretch;
    flex-direction: column;
  }
  .ask-result-toggle {
    justify-content: stretch;
  }
  .ask-result-toggle button {
    flex: 1 1 auto;
  }
}
body.theme-dark .ask-result-toggle {
  background: #101d18;
  border-color: var(--line);
}
body.theme-dark .ask-result-toggle button {
  color: var(--muted);
}
body.theme-dark .ask-result-toggle button.active {
  color: #062618;
  background: #86e8b5;
}


/* Pin popularity and score */
.pin-popularity {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 9px 0 10px;
}
.pin-popularity span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(33,135,91,.18);
  border-radius: 8px;
  background: linear-gradient(180deg, #f7fbf9, #edf7f1);
}
.pin-popularity strong {
  color: var(--green-dark);
  font-size: 18px;
  line-height: 1;
  font-weight: 950;
}
.pin-popularity em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
}
.pin-popularity.compact {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 7px 0 8px;
}
.pin-popularity.compact span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 8px;
  border-radius: 999px;
}
.pin-popularity.compact strong {
  font-size: 13px;
}
.pin-popularity.compact em {
  font-size: 10px;
}
.pin-hover-tooltip {
  font-weight: 900;
}
.pin-hover-tooltip strong,
.pin-hover-tooltip span {
  display: block;
}
.pin-hover-tooltip span {
  margin-top: 3px;
  color: #174632;
  font-size: 12px;
}
.score-detail strong {
  color: var(--green-dark) !important;
}
body.theme-dark .pin-popularity span {
  background: rgba(23,39,33,.96);
  border-color: rgba(134,232,181,.24);
}
body.theme-dark .pin-popularity strong,
body.theme-dark .score-detail strong {
  color: #9ff2c3 !important;
}
body.theme-dark .pin-hover-tooltip span {
  color: #dffceb;
}


/* Ask GO polished search glow */
#discoverView .ask-input-wrap {
  position: relative;
  min-width: 0;
  border-radius: 999px;
  isolation: isolate;
}
#discoverView .ask-input-wrap::before {
  content: "";
  position: absolute;
  inset: -4px;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(115deg, #4fd8ff, #8c6cff, #ff5fc7, #ffcf62, #4ff0b0, #4fd8ff);
  background-size: 260% 260%;
  filter: blur(12px);
  opacity: .34;
  animation: askGoGlowFlow 14s ease-in-out infinite;
  pointer-events: none;
}
#discoverView #askInput {
  position: relative;
  z-index: 1;
  border: 2px solid transparent !important;
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    linear-gradient(115deg, #4fd8ff, #8c6cff, #ff5fc7, #ffcf62, #4ff0b0, #4fd8ff) border-box !important;
  background-size: auto, 260% 260% !important;
  animation: askGoGlowFlow 14s ease-in-out infinite;
  box-shadow: 0 0 0 1px rgba(255,255,255,.74), 0 12px 28px rgba(94,113,255,.13) !important;
}
#discoverView #askInput::placeholder {
  color: transparent;
}
#discoverView #askInput:focus {
  box-shadow: 0 0 0 4px rgba(109,129,255,.14), 0 16px 34px rgba(255,95,199,.14) !important;
}
@keyframes askGoGlowFlow {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
@media (max-width: 560px) {
  #discoverView .ask-input-wrap {
    grid-column: 1 / -1;
  }
}
body.theme-dark #discoverView #askInput {
  background:
    linear-gradient(#182a23, #182a23) padding-box,
    linear-gradient(115deg, #63ddff, #a58cff, #ff75d2, #ffe17d, #67f0bc, #63ddff) border-box !important;
  color: #f8fffb !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 12px 32px rgba(99,221,255,.12) !important;
}
body.theme-dark #discoverView .ask-input-wrap::before {
  opacity: .28;
}

/* Empty map state and people search */
.pin-empty-state {
  display: grid;
  gap: 6px;
  padding: 18px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.78);
  color: var(--ink);
}
.pin-empty-state strong {
  font-size: 15px;
}
.pin-empty-state span {
  color: var(--muted);
  font-weight: 800;
}
.people-card {
  grid-column: span 2;
}
.people-search-panel {
  display: grid;
  gap: 12px;
}
.people-search-label {
  display: grid;
  gap: 7px;
  color: var(--ink);
  font-weight: 900;
}
.people-search-label input {
  width: 100%;
}
.people-search-results,
.followed-users-list {
  display: grid;
  gap: 8px;
}
.followed-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 4px;
}
.followed-heading span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.person-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.78);
}
.person-avatar {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--green);
  color: white;
  font-weight: 900;
}
.person-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.person-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.person-copy strong,
.person-copy small {
  overflow-wrap: anywhere;
}
.person-copy small {
  color: var(--muted);
  font-weight: 800;
}
.person-row button {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--green-dark);
  background: #fff;
  font-weight: 900;
}
.person-row button.following { color: #fff; background: var(--green); border-color: var(--green); }
body.theme-dark .pin-empty-state,
body.theme-dark .person-row {
  background: rgba(12,26,20,.86);
}
@media (max-width: 900px) {
  .people-card {
    grid-column: span 1;
  }
}

/* Clean profile tabs */
.profile-summary-card {
  display: grid;
  gap: 12px;
}
.profile-tabs {
  position: sticky;
  top: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 24px rgba(25,37,32,.08);
}
.profile-tab {
  min-width: 0;
  border: 0;
  border-radius: 7px;
  padding: 8px 6px;
  color: var(--muted);
  background: transparent;
  font-weight: 950;
}
.profile-tab span,
.profile-tab em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.profile-tab em {
  margin-top: 2px;
  color: inherit;
  font-size: 11px;
  font-style: normal;
  opacity: .82;
}
.profile-tab.active {
  color: var(--green-dark);
  background: #fff;
  box-shadow: 0 8px 20px rgba(21,35,29,.1);
}
.profile-tab-panel {
  display: grid;
  gap: 10px;
}
.profile-block {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.profile-block h3 {
  margin: 0;
  color: var(--green-dark);
  font-size: 15px;
}
.profile-block p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  font-weight: 750;
}
.profile-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.profile-stat {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
}
.profile-stat strong,
.profile-stat span {
  display: block;
  overflow-wrap: anywhere;
}
.profile-stat strong {
  color: var(--green-dark);
  font-size: 18px;
  line-height: 1;
}
.profile-stat span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}
.people-block {
  gap: 12px;
}
body.theme-dark .profile-tabs,
body.theme-dark .profile-block,
body.theme-dark .profile-stat {
  color: var(--ink);
  background: #15231e;
  border-color: var(--line);
}
body.theme-dark .profile-tab.active {
  color: var(--green-dark);
  background: #1d3028;
}
@media (max-width: 560px) {
  .profile-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .profile-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Profile tab cleanup overrides */
.profile-tab-panel .people-search-panel {
  margin-top: 2px;
}
.profile-tab-panel .profile-place-list {
  margin-top: 0;
}
.profile-stat strong {
  font-size: 17px;
}



/* Effortless quick post flow */
.quick-post-form {
  width: min(500px, calc(100vw - 36px));
  padding: 14px;
  gap: 10px;
  border-radius: 14px;
}
.quick-post-form.open {
  gap: 10px;
}
.post-form-heading {
  align-items: flex-start;
  padding-bottom: 2px;
}
.quick-post-form .form-heading h2 {
  font-size: 21px;
  line-height: 1.15;
}
.quick-post-form .form-heading p {
  max-width: 320px;
  color: #4f625a;
}
.post-steps {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
.post-steps span {
  min-width: 0;
  padding: 7px 6px;
  color: #436057;
  background: #f5faf7;
  border-color: #d8e5df;
  font-size: 11px;
}
.post-steps span.active {
  color: #0d6a49;
  background: #dff8eb;
  border-color: rgba(33,135,91,.34);
}
.post-section {
  gap: 9px;
  padding: 10px;
  border-radius: 12px;
}
.post-choice-card {
  background: linear-gradient(180deg, #f9fdfb, #eef9f3);
}
.post-taxonomy-grid {
  margin: 0;
}
.priority-field select {
  min-height: 44px;
  border-radius: 10px;
  background: #fff;
}
.post-section-head strong {
  font-size: 14px;
}
.location-choice-row button,
.address-row button {
  min-height: 42px;
  border-radius: 10px;
}
.address-row input,
.details-section textarea,
.media-section input[type="url"] {
  border-radius: 10px;
}
.details-section textarea {
  min-height: 104px;
  resize: vertical;
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
}
.details-section label {
  margin-top: 1px;
}
.media-section {
  background: linear-gradient(180deg, #fbfefc, #f5fbff);
}
.file-upload {
  min-height: 52px;
  place-items: center;
  text-align: center;
}
.required-pill {
  color: #0d6a49;
  background: #dff8eb;
}
.advanced-post-options {
  background: #fbfdfc;
}
.advanced-post-options summary {
  color: #244338;
}
.quick-post-form .submit-button {
  min-height: 48px;
  border-radius: 12px;
  font-size: 15px;
  box-shadow: 0 13px 30px rgba(31,138,91,.18);
}
body.theme-dark .quick-post-form .form-heading p,
body.theme-dark .post-steps span {
  color: #c8d7d0 !important;
}
body.theme-dark .post-steps span {
  background: rgba(25,38,33,.92) !important;
  border-color: #465d53 !important;
}
body.theme-dark .post-steps span.active,
body.theme-dark .required-pill {
  color: #061a12 !important;
  background: #86e8b5 !important;
  border-color: #86e8b5 !important;
}
body.theme-dark .post-choice-card,
body.theme-dark .media-section,
body.theme-dark .advanced-post-options {
  background: #14211c !important;
}
body.theme-dark .details-section textarea {
  color: #f3faf6 !important;
  background: #0f1915 !important;
  border-color: #4b6258 !important;
}
@media (max-width: 560px) {
  .quick-post-form {
    padding: 12px;
  }
  .post-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .quick-post-form .form-heading h2 {
    font-size: 19px;
  }
}


/* Keep map search and action buttons from clipping at 100% browser zoom */
@media (min-width: 961px) {
  .map-search {
    left: 18px;
    right: auto;
    width: min(58vw, 1000px);
    max-width: calc(100vw - 610px);
  }
  .map-toolbar {
    top: 18px;
    right: 18px;
    max-width: 360px;
    flex-wrap: nowrap;
    align-items: stretch;
  }
  .map-toolbar button {
    min-height: 48px;
    white-space: nowrap;
    padding: 0 16px;
  }
  #feedbackButton {
    max-width: 178px;
  }
  #dropPinButton {
    min-width: 104px;
    max-width: 136px;
  }
}
@media (min-width: 961px) and (max-width: 1380px) {
  .map-search {
    width: min(56vw, 780px);
    max-width: calc(100vw - 500px);
  }
  .map-toolbar {
    max-width: 300px;
    gap: 8px;
  }
  .map-toolbar button {
    min-height: 44px;
    padding: 0 12px;
    font-size: 14px;
  }
  #feedbackButton {
    max-width: 158px;
  }
  #dropPinButton {
    min-width: 88px;
    max-width: 118px;
  }
}

/* Polished map control dock: search/radius centered, actions separate */
@media (min-width: 961px) {
  .map-stage {
    container-type: inline-size;
  }
  .map-search {
    top: 18px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: min(680px, calc(100% - 340px)) !important;
    max-width: 680px !important;
    min-height: 92px !important;
    height: auto !important;
    display: grid !important;
    grid-template-columns: minmax(180px, 1fr) 44px 88px 44px !important;
    grid-template-rows: 46px 32px !important;
    gap: 8px !important;
    align-items: center !important;
    padding: 10px !important;
    border-radius: 22px !important;
    border: 1px solid rgba(209,226,218,.78) !important;
    background: rgba(15,43,34,.82) !important;
    box-shadow: 0 18px 42px rgba(13,31,24,.28), inset 0 1px 0 rgba(255,255,255,.16) !important;
    backdrop-filter: blur(18px) !important;
  }
  .map-search input {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 46px !important;
    height: 46px !important;
    padding: 0 18px !important;
    border-radius: 17px !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
    color: #f7fffb !important;
    background: rgba(9,31,24,.72) !important;
    border: 1px solid rgba(187,225,209,.55) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  }
  .map-search input::placeholder {
    color: rgba(242,255,249,.72) !important;
  }
  .map-search button {
    min-height: 46px !important;
    height: 46px !important;
    white-space: nowrap !important;
    border-radius: 18px !important;
    font-size: 14px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .map-voice-button,
  .crosshair-button {
    width: 46px !important;
    min-width: 46px !important;
    padding: 0 !important;
    color: #eafff8 !important;
    background: rgba(48,91,130,.9) !important;
    border: 1px solid rgba(178,220,255,.32) !important;
  }
  #mapVoiceButton {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }
  #mapSearchButton {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: 88px !important;
    min-width: 88px !important;
    padding: 0 14px !important;
    color: #06331f !important;
    background: #65e8aa !important;
    box-shadow: 0 8px 18px rgba(62,216,148,.22) !important;
  }
  #locateButton {
    grid-column: 4 !important;
    grid-row: 1 !important;
  }
  .map-radius-panel {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    max-width: none !important;
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    display: grid !important;
    grid-template-columns: auto minmax(120px, 1fr) auto auto !important;
    gap: 10px !important;
    align-items: center !important;
    align-content: center !important;
    padding: 4px 8px !important;
    border-radius: 15px !important;
    border-left: 0 !important;
    background: rgba(255,255,255,.08) !important;
    overflow: hidden !important;
  }
  .map-radius-head {
    display: contents !important;
    color: rgba(244,255,249,.82) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }
  .map-radius-head span {
    grid-column: 1 !important;
    font-size: 12px !important;
    line-height: 1 !important;
  }
  .map-radius-head .count-badge {
    grid-column: 3 !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    color: #083421 !important;
    background: #c4ffdf !important;
    font-size: 11px !important;
    line-height: 1 !important;
  }
  .map-radius-head button {
    grid-column: 4 !important;
    min-height: 22px !important;
    height: 22px !important;
    padding: 0 8px !important;
    border-radius: 999px !important;
    color: rgba(255,255,255,.75) !important;
    background: rgba(255,255,255,.08) !important;
    font-size: 11px !important;
    line-height: 1 !important;
  }
  .map-radius-panel .timeline-range {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    height: 8px !important;
    margin: 0 !important;
  }
  .map-radius-marks {
    display: none !important;
  }
  .map-search-suggestions {
    top: calc(100% + 8px) !important;
    left: 10px !important;
    right: 10px !important;
  }
  .map-toolbar {
    top: 18px !important;
    right: 18px !important;
    max-width: 290px !important;
    display: flex !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    align-items: center !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .map-toolbar button {
    min-height: 64px !important;
    height: 64px !important;
    border-radius: 18px !important;
    white-space: nowrap !important;
    padding: 0 16px !important;
    overflow: visible !important;
    text-overflow: clip !important;
    font-size: 15px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 16px 34px rgba(11,32,24,.22) !important;
  }
  #feedbackButton {
    width: 152px !important;
    min-width: 152px !important;
    max-width: 152px !important;
    color: #f5fff9 !important;
    background: rgba(16,45,35,.9) !important;
    border: 1px solid rgba(181,219,204,.45) !important;
  }
  #dropPinButton {
    width: 118px !important;
    min-width: 118px !important;
    max-width: 118px !important;
    color: #07351f !important;
    background: #54dda0 !important;
  }
}
@container (max-width: 1120px) {
  .map-search {
    left: 16px !important;
    transform: none !important;
    width: calc(100% - 326px) !important;
    grid-template-columns: minmax(120px, 1fr) 40px 76px 40px !important;
  }
  .map-toolbar {
    max-width: 276px !important;
    gap: 8px !important;
  }
  .map-toolbar button {
    min-height: 58px !important;
    height: 58px !important;
    font-size: 13px !important;
    padding: 0 12px !important;
  }
  #feedbackButton {
    width: 142px !important;
    min-width: 142px !important;
    max-width: 142px !important;
  }
  #dropPinButton {
    width: 108px !important;
    min-width: 108px !important;
    max-width: 108px !important;
  }
}
@container (max-width: 760px) {
  .map-search {
    top: 82px !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    grid-template-columns: minmax(0, 1fr) 42px 78px 42px !important;
  }
  .map-toolbar {
    top: 12px !important;
    right: 12px !important;
    left: 12px !important;
    max-width: none !important;
  }
}

/* Icon-only main navigation */
.mode-tabs {
  grid-template-columns: repeat(auto-fit, minmax(54px, 1fr)) !important;
  gap: 8px !important;
  padding: 6px !important;
  border-radius: 14px !important;
}
.mode-tab {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  min-height: 54px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  font-size: 0 !important;
}
.mode-tab .mode-icon {
  display: grid !important;
  place-items: center !important;
  width: 28px !important;
  height: 28px !important;
}
.mode-tab .mode-icon svg {
  width: 25px !important;
  height: 25px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.mode-tab .tab-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.mode-tab::after {
  content: attr(aria-label);
  position: absolute;
  left: 50%;
  bottom: -34px;
  z-index: 20;
  transform: translateX(-50%) translateY(-4px);
  opacity: 0;
  pointer-events: none;
  padding: 6px 9px;
  border-radius: 999px;
  color: #fff;
  background: rgba(11,31,24,.92);
  box-shadow: 0 10px 24px rgba(12,28,22,.22);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  transition: opacity .15s ease, transform .15s ease;
}
.mode-tab:hover::after,
.mode-tab:focus-visible::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.mode-tab.active .mode-icon {
  color: var(--green-dark);
}
body.theme-dark .mode-tab::after {
  color: #062116;
  background: #c8f7df;
}
@media (max-width: 560px) {
  .mode-tabs {
    grid-template-columns: repeat(auto-fit, minmax(50px, 1fr)) !important;
  }
  .mode-tab {
    min-height: 50px !important;
  }
  .mode-tab::after {
    display: none !important;
  }
}

/* Original poster pin editing */
.pin-actions .edit-action,
.viewer-actions .edit-action {
  color: #0d4b78 !important;
  background: #edf7ff !important;
  border-color: rgba(36,93,159,.28) !important;
}
.pin-actions .edit-action:hover,
.viewer-actions .edit-action:hover {
  color: #fff !important;
  background: #245d9f !important;
}
.pin-form.editing {
  border-color: rgba(36,93,159,.36);
  box-shadow: 0 24px 70px rgba(27,56,82,.24);
}
.pin-form.editing .submit-button {
  background: #245d9f;
}
body.theme-dark .pin-actions .edit-action,
body.theme-dark .viewer-actions .edit-action {
  color: #d8ebff !important;
  background: rgba(32,56,78,.94) !important;
  border-color: rgba(167,206,255,.32) !important;
}
body.theme-dark .pin-actions .edit-action:hover,
body.theme-dark .viewer-actions .edit-action:hover {
  color: #081f31 !important;
  background: #9ccfff !important;
}


/* Profile post filters */
.posts-profile-block {
  gap: 12px;
}
.profile-post-tools {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
}
.profile-post-filter {
  min-width: 0;
  border: 0;
  border-radius: 7px;
  padding: 8px 6px;
  color: var(--muted);
  background: transparent;
  font-weight: 950;
}
.profile-post-filter span,
.profile-post-filter em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.profile-post-filter em {
  margin-top: 2px;
  font-size: 11px;
  font-style: normal;
  opacity: .78;
}
.profile-post-filter.active {
  color: var(--green-dark);
  background: #fff;
  box-shadow: 0 8px 18px rgba(21,35,29,.1);
}
.profile-post-section {
  display: grid;
  gap: 9px;
}
body.theme-dark .profile-post-tools {
  background: rgba(12,26,20,.82);
  border-color: var(--line);
}
body.theme-dark .profile-post-filter.active {
  color: var(--green-dark);
  background: #1d3028;
}
@media (max-width: 560px) {
  .profile-post-tools {
    grid-template-columns: 1fr;
  }
}

body.theme-dark .resend-confirm-button { border-color: rgba(201,247,223,.24); color: #d7ffe9; background: rgba(31,138,91,.16); }
body.theme-dark .resend-confirm-button:hover { border-color: rgba(94,225,153,.54); background: rgba(31,138,91,.24); }


/* Social/profile data states */
.person-row{align-items:center;gap:10px;}
.person-profile-link{display:flex;align-items:center;gap:10px;flex:1;min-width:0;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;}
.person-profile-link:hover .person-copy strong{text-decoration:underline;}
.person-copy em{display:block;font-style:normal;color:var(--muted);font-size:.78rem;line-height:1.25;margin-top:2px;}
.profile-actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.profile-actions button,.group-actions button,.profile-back-button{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:12px;padding:9px 12px;font-weight:900;cursor:pointer;}
.profile-actions button.following{background:rgba(49,211,139,.18);color:var(--accent-strong);}
.profile-bio{margin:.2rem 0 .45rem;color:var(--muted);font-size:.95rem;line-height:1.35;}
.group-list{display:grid;gap:10px;}
.group-card{display:grid;gap:5px;width:100%;text-align:left;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:14px;padding:12px;cursor:pointer;}
.group-card:hover{border-color:var(--accent);box-shadow:0 12px 28px rgba(17,97,63,.12);}
.group-card span,.group-card small,.group-stats span,.group-member-list em{color:var(--muted);}
.group-stats{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0;}
.group-stats span{border:1px solid var(--line);border-radius:999px;padding:5px 9px;font-weight:800;background:var(--soft);}
.group-member-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:8px 0 14px;}
.group-member-list span{display:flex;justify-content:space-between;gap:8px;border:1px solid var(--line);border-radius:12px;padding:8px 10px;background:var(--soft);font-weight:800;}
.group-detail-block h4{margin:14px 0 8px;}
.group-audience-field{display:grid;gap:6px;margin-top:10px;}
.group-audience-field input{width:100%;border:1px solid var(--line);background:var(--input-bg);color:var(--text);border-radius:12px;padding:11px 12px;font:inherit;}
