/* Homepage radar owns its presentation independently of the shared stylesheet. */
#nearby-radar-modal { position: fixed; inset: 0; z-index: 100000; display: none; align-items: flex-end; justify-content: center; padding: 12px 8px 0; box-sizing: border-box; background: rgba(15,23,42,.7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
#nearby-radar-modal.active { display: flex; opacity: 1; visibility: visible; }
#nearby-radar-modal .nearby-radar-modal-box { display: flex; flex-direction: column; width: 100%; max-width: 600px; max-height: 90vh; max-height: 90dvh; min-height: 0; overflow: hidden; background: #fff; border-radius: 22px 22px 0 0; box-shadow: 0 -8px 32px #0003; }
#nearby-radar-modal .nearby-radar-header { display: flex; align-items: flex-start; gap: 12px; padding: 20px; background: #245c40; color: #fff; flex-shrink: 0; }
#nearby-radar-modal .nearby-radar-header-info { flex: 1; min-width: 0; }
#nearby-radar-modal .nearby-radar-badge { font-size: 10px; font-weight: 800; color: #ffeaa5; }
#nearby-radar-modal .nearby-radar-title { margin: 8px 0; color: #fff; font-size: 20px; }
#nearby-radar-modal .nearby-radar-sub { font-size: 12px; line-height: 1.5; margin: 0; }
#nearby-radar-modal .nearby-radar-close-btn { border: 0; border-radius: 50%; width: 44px; height: 44px; flex-shrink: 0; background: #ffffff26; color: #fff; font-size: 22px; cursor: pointer; }
#nearby-radar-modal .nearby-radar-controls { flex-shrink: 0; padding: 12px; border-bottom: 1px solid #e2e8f0; }
#nearby-radar-modal .nearby-radius-pills, #nearby-radar-modal .nearby-city-pills { display: flex; flex-wrap: wrap; gap: 7px; }
#nearby-radar-modal button, #nearby-radar-modal select { touch-action: manipulation; }
#nearby-radar-modal .radius-pill, #nearby-radar-modal .nearby-city-pill, #nearby-radar-modal .nearby-retry-btn { min-height: 40px; padding: 8px 12px; border: 1px solid #cbd5e1; border-radius: 18px; color: #245c40; background: #f8fafc; cursor: pointer; }
#nearby-radar-modal .radius-pill.active { background: #245c40; color: #fff; border-color: #245c40; }
#nearby-radar-modal .nearby-radar-map-btn { display: inline-block; margin-top: 10px; color: #17649b; }
#nearby-radar-modal .nearby-radar-body { min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 16px 12px calc(16px + env(safe-area-inset-bottom,0px)); }
#nearby-radar-modal .nearby-radar-loading, #nearby-radar-modal .nearby-empty-state, #nearby-radar-modal .nearby-fallback-box { text-align: center; padding: 20px 8px; color: #475569; }
#nearby-radar-modal .nearby-quick-cities, #nearby-radar-modal .nearby-city-select-wrap, #nearby-radar-modal .nearby-fallback-actions { margin-top: 18px; }
#nearby-radar-modal .nearby-quick-label, #nearby-radar-modal label { display: block; margin-bottom: 10px; }
#nearby-radar-modal .nearby-province-select { width: 100%; min-height: 44px; font-size: 16px; border: 1px solid #cbd5e1; border-radius: 10px; padding: 8px; background: #fff; }
#nearby-radar-modal .nearby-species-card { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px; margin-bottom: 10px; border: 1px solid #e2e8f0; border-radius: 14px; background:#fff; text-align:left; font:inherit; cursor:pointer; text-decoration: none; color: #183f2e; }
#nearby-radar-modal .nearby-species-img-wrap { position: relative; width: 76px; flex-shrink: 0; }
#nearby-radar-modal img { width: 76px; height: 76px; object-fit: contain; border-radius: 10px; }
#nearby-radar-modal .nearby-species-info { flex: 1; min-width: 0; }
#nearby-radar-modal .nearby-name-tr { font-weight: 750; }
#nearby-radar-modal .nearby-name-sci { font-size: 12px; color: #64748b; font-style: italic; }
#nearby-radar-modal .nearby-meta, #nearby-radar-modal .nearby-dist-badge { font-size: 11px; line-height: 1.5; }
@media (min-width: 769px) { #nearby-radar-modal { align-items: center; padding: 24px; } #nearby-radar-modal .nearby-radar-modal-box { border-radius: 22px; } }
.nearby-directions-overlay { position:fixed; inset:0; z-index:100100; display:none; align-items:flex-end; justify-content:center; box-sizing:border-box; padding:12px 8px 0; background:rgba(15,23,42,.72); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.nearby-directions-overlay.active { display:flex; }
.nearby-directions-sheet { width:100%; max-width:540px; box-sizing:border-box; padding:20px 16px calc(18px + env(safe-area-inset-bottom,0px)); border-radius:22px 22px 0 0; background:#fff; box-shadow:0 -10px 35px rgba(0,0,0,.24); }
.nearby-directions-header { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:0 2px 16px; }
.nearby-directions-kicker { display:block; color:#b37816; font-size:.68rem; font-weight:850; letter-spacing:.08em; }
.nearby-directions-header h3 { margin:5px 0 3px; color:#153f2d; font:800 1.2rem/1.25 Outfit,sans-serif; }
.nearby-directions-header p { margin:0; color:#64748b; font-size:.78rem; line-height:1.4; }
.nearby-directions-close { width:44px; height:44px; flex:0 0 44px; border:0; border-radius:50%; background:#e8f2ed; color:#245c40; font-size:1.25rem; cursor:pointer; }
.nearby-directions-list { display:grid; gap:10px; }
.nearby-directions-app { display:flex; align-items:center; gap:12px; min-height:72px; box-sizing:border-box; padding:11px 13px; border:1px solid #dbe4df; border-radius:15px; background:#fff; color:#173f2e; text-decoration:none; }
.nearby-directions-app[hidden] { display:none; }
.nearby-directions-app:focus-visible { outline:3px solid #efc75e; outline-offset:2px; }
.nearby-directions-app-icon { display:flex; align-items:center; justify-content:center; width:46px; height:46px; flex:0 0 46px; border-radius:13px; color:#fff; font-size:1.15rem; }
.nearby-directions-google .nearby-directions-app-icon { background:#4285f4; }
.nearby-directions-yandex .nearby-directions-app-icon { background:#fc3f1d; }
.nearby-directions-apple .nearby-directions-app-icon { background:#111827; }
.nearby-directions-app-copy { display:flex; flex:1; min-width:0; flex-direction:column; gap:3px; }
.nearby-directions-app-copy strong { font-size:.92rem; }
.nearby-directions-app-copy small { color:#64748b; font-size:.7rem; }
.nearby-directions-app > .fa-chevron-right { color:#94a3b8; }
.nearby-directions-cancel { width:100%; min-height:46px; margin-top:13px; border:1px solid #dbe4df; border-radius:14px; background:#f8faf9; color:#456458; font-weight:800; cursor:pointer; }
@media (min-width:769px) { .nearby-directions-overlay { align-items:center; padding:24px; } .nearby-directions-sheet { border-radius:22px; } }
@media (max-width: 768px) {
  #nearby-radar-modal { padding: 8px 6px 0; background: rgba(5, 35, 26, .68); }
  #nearby-radar-modal .nearby-radar-modal-box { max-height: 92dvh; border: 1px solid rgba(255,255,255,.35); border-bottom: 0; border-radius: 24px 24px 0 0; background: #f8f7f1; box-shadow: 0 -12px 38px rgba(5,35,26,.24); }
  #nearby-radar-modal .nearby-radar-header { position: relative; display: block; padding: 18px 64px 16px 18px; border-bottom: 1px solid #dbe7df; background: linear-gradient(145deg,#eef7f1,#fbf7ed); color: #0b4a36; text-align: left; }
  #nearby-radar-modal .nearby-radar-header-info { width: 100%; text-align: left; }
  #nearby-radar-modal .nearby-radar-badge { display: block; box-sizing: border-box; min-height: 20px; padding: 0; color: #1b7655; font-size: .64rem; letter-spacing: .1em; text-align: left; }
  #nearby-radar-modal .nearby-radar-title { display: block; margin: 6px 0 4px; color: #0b4a36; font: 800 1.45rem/1.1 Outfit,sans-serif; text-align: left; }
  #nearby-radar-modal .nearby-radar-sub { color: #62776d; font-size: .78rem; line-height: 1.4; text-align: left; overflow-wrap: anywhere; }
  #nearby-radar-modal .nearby-radar-close-btn { position: absolute; top: 16px; right: 16px; width: 46px; height: 46px; border: 1px solid #cfe1d6; background: #fff; color: #176c4f; }
  #nearby-radar-modal .nearby-radar-controls { padding: 11px 12px; border-color: #dbe7df; background: rgba(255,255,255,.78); }
  #nearby-radar-modal .nearby-radius-pills { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  #nearby-radar-modal .nearby-radius-pills::-webkit-scrollbar { display: none; }
  #nearby-radar-modal .radius-pill,
  #nearby-radar-modal .nearby-city-pill,
  #nearby-radar-modal .nearby-retry-btn { flex: 0 0 auto; min-height: 44px; border-color: #cfe0d6; border-radius: 13px; background: #fff; color: #15553e; font-weight: 750; }
  #nearby-radar-modal .radius-pill.active { border-color: #176c4f; background: #176c4f; color: #fff; }
  #nearby-radar-modal .nearby-radar-map-btn { display: inline-flex; align-items: center; min-height: 44px; margin-top: 4px; color: #176c4f; font-weight: 800; }
  #nearby-radar-modal .nearby-radar-body { padding: 13px 12px calc(18px + env(safe-area-inset-bottom,0px)); background: #f8f7f1; }
  #nearby-radar-modal .nearby-species-card { box-sizing: border-box; min-height: 96px; padding: 10px; border-color: #dbe6df; border-radius: 17px; background: #fff; box-shadow: 0 6px 16px rgba(19,62,43,.06); }
  #nearby-radar-modal .nearby-species-img-wrap,
  #nearby-radar-modal img { width: 72px; height: 72px; }
  #nearby-radar-modal img { border-radius: 13px; background: #f3f0e6; }
  #nearby-radar-modal .nearby-name-tr { color: #103f30; font-size: .92rem; }
  #nearby-radar-modal .nearby-province-select { min-height: 48px; border-color: #cfe0d6; border-radius: 13px; }
  .nearby-directions-sheet { border: 1px solid #dbe6df; border-bottom: 0; background: #f8f7f1; }
  .nearby-directions-app { border-color: #dbe6df; border-radius: 17px; box-shadow: 0 5px 14px rgba(19,62,43,.05); }
}