.map-page { background: var(--cream); }
.map-page .site-header { width: 100%; padding-inline: max(24px, calc((100% - 1240px) / 2)); background: var(--petrol-dark); }
.map-shell { padding-top: 96px; }
.map-intro { width: min(1240px, calc(100% - 48px)); margin: 0 auto; padding: 62px 0 34px; display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 70px; }
.map-intro h1 { margin: 12px 0 0; color: var(--petrol); font-family: Georgia, serif; font-size: clamp(46px, 6vw, 78px); font-weight: 400; line-height: .98; letter-spacing: -.05em; }
.map-intro h1 em { color: #b9655e; font-weight: 400; }
.map-intro > p { max-width: 570px; margin: 0 0 7px; color: var(--muted); font-size: 16px; line-height: 1.75; }
.map-workspace { width: min(1340px, calc(100% - 48px)); min-height: 690px; margin: 0 auto 72px; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; display: grid; grid-template-columns: 390px 1fr; background: var(--paper); box-shadow: 0 28px 80px rgba(10,48,51,.08); }
.map-sidebar { max-height: 740px; padding: 25px; border-right: 1px solid var(--line); overflow-y: auto; }
.map-search-wrap label { display: block; margin-bottom: 8px; color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.map-search-wrap input { width: 100%; height: 50px; padding: 0 16px; border: 1px solid var(--line); border-radius: 12px; outline: none; background: #fff; color: var(--ink); font: inherit; }
.map-search-wrap input:focus { border-color: var(--petrol); box-shadow: 0 0 0 3px rgba(13,65,69,.1); }
.map-filters { margin: 16px 0 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.map-filter { padding: 10px 13px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--petrol); cursor: pointer; font: inherit; font-size: 13px; }
.map-filter span { margin-left: 5px; opacity: .6; }
.map-filter.active { border-color: var(--petrol); background: var(--petrol); color: white; }
.map-quick-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.map-quick-actions button { min-height: 48px; padding: 9px 12px; border: 0; border-radius: 12px; background: #e8efed; color: var(--petrol); cursor: pointer; font: inherit; font-size: 12px; font-weight: 800; line-height: 1.25; }
.map-quick-actions button:last-child { background: #f3e6e3; color: #8d4843; }
.map-status { margin: 16px 0 10px; color: var(--muted); font-size: 12px; }
.place-list { display: grid; gap: 8px; }
.place-card { width: 100%; padding: 16px; border: 1px solid var(--line); border-radius: 14px; display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; text-align: left; background: #fff; color: var(--ink); cursor: pointer; transition: border-color .2s, transform .2s, background .2s; }
.place-card:hover, .place-card.active { border-color: var(--petrol); background: #f6faf9; transform: translateY(-1px); }
.place-card strong { align-self: center; font-family: Georgia, serif; font-size: 16px; font-weight: 400; }
.place-card small, .place-card em { grid-column: 2; color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.35; }
.place-card em { color: var(--petrol); }
.place-type { min-width: 44px; height: 22px; padding: 0 7px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: #dbe8df; color: #356044; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.place-type.arma { background: var(--petrol); color: white; }
.map-canvas-wrap { position: relative; min-width: 0; }
.pet-map { width: 100%; height: 100%; min-height: 690px; background: #dfe7e4; }
.map-legend { position: absolute; z-index: 500; top: 18px; right: 18px; padding: 10px 12px; border-radius: 12px; display: flex; gap: 14px; background: rgba(255,255,255,.94); box-shadow: 0 6px 20px rgba(8,40,42,.12); color: var(--ink); font-size: 11px; }
.map-legend span { display: flex; align-items: center; gap: 6px; }
.legend-dot { width: 9px; height: 9px; border-radius: 50%; background: #587d61; }
.legend-dot.arma { background: var(--petrol); }
.arma-map-marker-wrap { background: none; border: 0; }
.arma-map-marker { width: 38px; height: 38px; border: 4px solid white; border-radius: 50% 50% 50% 8px; display: flex; align-items: center; justify-content: center; transform: rotate(-45deg); background: #587d61; color: white; box-shadow: 0 5px 14px rgba(10,48,51,.28); font: 700 14px Georgia, serif; }
.arma-map-marker.arma { background: var(--petrol); }
.arma-map-marker b { display: block; transform: rotate(45deg); line-height: 1; }
.map-popup span { color: #b9655e; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.map-popup h3 { margin: 7px 0 5px; color: var(--petrol); font-family: Georgia, serif; font-size: 19px; font-weight: 400; }
.map-popup p, .map-popup small { display: block; margin: 0 0 6px; color: #56676a; font-size: 12px; line-height: 1.4; }
.map-popup a { display: inline-block; margin-top: 7px; color: var(--petrol); font-size: 12px; font-weight: 800; text-decoration: none; }
.map-contribute { width: min(1040px, calc(100% - 48px)); margin: 0 auto 20px; padding: 16px 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 16px; display: grid; grid-template-columns: 42px 1.1fr 1fr auto; align-items: center; gap: 16px; background: var(--petrol); color: white; box-shadow: 0 12px 30px rgba(10,48,51,.13); }
.map-contribute-mark { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--red); color: white; font-family: Georgia, serif; font-size: 22px; }
.map-contribute h2 { margin: 4px 0 0; font-family: Georgia, serif; font-size: clamp(21px, 2vw, 28px); font-weight: 400; line-height: 1.05; }
.map-contribute p { margin: 0; color: #c9d8d6; font-size: 12.5px; line-height: 1.5; }
.map-contribute-action { display: grid; justify-items: stretch; gap: 7px; }
.map-contribute .button { min-height: 42px; padding-inline: 15px; justify-content: center; white-space: nowrap; background: white; color: var(--petrol); font-size: 11px; }
.map-contribute-action small { color: #b8cecc; font-size: 10px; text-align: center; }
.map-note { width: min(900px, calc(100% - 48px)); margin: 0 auto; padding: 46px 0 70px; display: grid; grid-template-columns: 140px 1fr; gap: 35px; border-top: 1px solid var(--line); }
.map-note strong { color: var(--petrol); font-family: Georgia, serif; font-size: 17px; font-weight: 400; }
.map-note p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.leaflet-control-attribution { font-size: 9px; }

@media (max-width: 900px) {
  .map-intro { grid-template-columns: 1fr; gap: 20px; }
  .map-workspace { grid-template-columns: 1fr; }
  .map-sidebar { max-height: none; border-right: 0; border-bottom: 1px solid var(--line); }
  .pet-map { min-height: 520px; }
  .map-contribute { grid-template-columns: 42px 1fr; gap: 14px; }
  .map-contribute p, .map-contribute-action { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .map-shell { padding-top: 72px; }
  .map-intro { width: calc(100% - 28px); padding: 44px 0 26px; }
  .map-intro h1 { font-size: 46px; }
  .map-intro > p { font-size: 15px; }
  .map-workspace { width: 100%; margin-bottom: 48px; border-right: 0; border-left: 0; border-radius: 0; }
  .map-sidebar { padding: 18px 14px; }
  .pet-map { min-height: 500px; }
  .map-legend { top: 12px; right: 12px; }
  .map-contribute { width: calc(100% - 28px); padding: 20px; }
  .map-note { width: calc(100% - 28px); grid-template-columns: 1fr; gap: 10px; padding: 38px 0 56px; }
}