/* S&F map: clear address, distinct flat/terrain choices, and a coordinate pin. */
.map-frame.syf-map {
  height: 610px;
  isolation: isolate;
  border: 1px solid #d0ddc6;
  border-radius: 28px;
  background: #e8eddf;
  box-shadow: 0 28px 65px -34px #1c381b55, 0 1px 0 #fff inset;
}
.syf-map-stage { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .45s ease; }
.syf-map-ready .syf-map-stage { opacity: 1; }
.syf-map-ready > iframe { visibility: hidden; pointer-events: none; }
.syf-map .map-label { z-index: 4; bottom: 48px; left: 20px; right: 20px; padding: 17px 19px; border-radius: 14px; box-shadow: 0 14px 35px #18341124; }
.syf-map .map-label strong { font-size: 21px; line-height: 1.2; }
.syf-map .map-label > span:first-child { font-size: 8px; }
.map-frame .map-label small { display: block; margin-top: 5px; font: 500 10px/1.4 var(--body, sans-serif); letter-spacing: 0; }
.syf-map-caption { position: absolute; top: 20px; left: 20px; z-index: 4; display: flex; align-items: flex-start; gap: 10px; max-width: calc(100% - 88px); padding: 13px 15px; border: 1px solid #fff; border-radius: 13px; background: #fffffff2; color: #21351b; box-shadow: 0 5px 20px #1735141c; pointer-events: none; opacity: 0; transition: opacity .25s; }
.syf-map-ready .syf-map-caption { opacity: 1; }
.syf-map-caption > span:last-child { min-width: 0; font: 700 8px/1.5 var(--body, sans-serif); letter-spacing: .08em; }
.syf-map-caption strong { display: block; margin-top: 3px; font: 800 21px/1.15 var(--heading, sans-serif); letter-spacing: -.035em; }
.syf-map-caption small { display: block; margin-top: 4px; font: 500 10px/1.4 var(--body, sans-serif); letter-spacing: 0; }
.syf-map-dot { width: 8px; height: 8px; margin-top: 4px; flex-shrink: 0; border-radius: 50%; background: #3c9923; box-shadow: 0 0 0 4px #3c992322; }
.syf-map-toolbar { position: absolute; z-index: 5; inset: 0; pointer-events: none; opacity: 0; visibility: hidden; }
.syf-map-ready .syf-map-toolbar { opacity: 1; visibility: visible; }
.syf-map-views { position: absolute; top: 122px; left: 20px; display: flex; gap: 3px; padding: 4px; max-width: calc(100% - 40px); border: 1px solid #c2d2b8; border-radius: 13px; background: #fff; box-shadow: 0 4px 18px #17351424; pointer-events: auto; }
.syf-map-actions { position: absolute; bottom: 158px; left: 20px; display: flex; gap: 8px; pointer-events: auto; }
.syf-map-button { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; gap: 8px; min-height: 42px; padding: 9px; border: 1px solid #cbd9c3; border-radius: 10px; background: #fff; color: #244e1b; box-shadow: 0 3px 10px #143b1322; cursor: pointer; font: 700 11px/1.2 var(--body, sans-serif); }
.syf-map-button:hover { background: #edf7e6; }
.syf-map-button:focus-visible, .syf-map-pin:focus-visible { outline: 3px solid #163c10; outline-offset: 3px; }
.syf-map-button svg { width: 20px; height: 20px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.syf-map-view { min-height: 39px; gap: 5px; padding: 10px 14px; border: 0; border-radius: 8px; background: transparent; box-shadow: none; font-size: 11px; }
.syf-map-view strong { font-size: 14px; }
.syf-map-view[aria-pressed=true] { background: #2d771c; color: #fff; box-shadow: 0 1px 4px #1f4d1a38; }
.syf-map-center { padding-inline: 13px; }
.syf-map-rotate { width: 42px; }
.syf-map-button:disabled { color: #687861; background: #eff2ec; cursor: default; opacity: .7; }
.syf-map-pin { display: flex; flex-direction: column; align-items: center; width: max-content; position: relative; padding: 0; color: #fff; text-decoration: none; }
.syf-map-pin-card { display: flex; align-items: center; gap: 10px; padding: 8px 17px 8px 8px; border: 3px solid #fff; border-radius: 16px; background: #286e18; box-shadow: 0 6px 22px #183c1566; }
.syf-map-pin-logo { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: #fff; }
.syf-map-pin-logo img { width: 44px; height: 44px; object-fit: contain; }
.syf-map-pin-name { font: 800 27px/1 var(--heading, sans-serif); letter-spacing: -.05em; }
.syf-map-pin-name small { display: block; margin-top: 6px; font: 700 8px/1.2 var(--body, sans-serif); letter-spacing: .045em; white-space: nowrap; }
.syf-map-pin-stem { display: block; width: 3px; height: 21px; background: #286e18; box-shadow: 0 0 0 1px #fff; }
.syf-map-pin-point { position: absolute; bottom: -6px; left: calc(50% - 6px); width: 12px; height: 12px; border: 2px solid #fff; border-radius: 50%; background: #286e18; box-shadow: 0 0 0 7px #3c99233b, 0 0 0 14px #3c99231f, 0 2px 5px #17351455; }
.syf-map-pin:hover .syf-map-pin-card { background: #1e5611; }
.syf-map-status { position: absolute; z-index: 5; left: 50%; top: 45%; transform: translate(-50%, -50%); padding: 15px 20px; border-radius: 100px; background: #fff; color: #294c20; font-size: 12px; font-weight: 600; box-shadow: 0 5px 30px #17341220; white-space: nowrap; }
.syf-map-status[hidden] { display: none; }
.syf-map .maplibregl-ctrl-top-right { top: 14px; right: 4px; }
.syf-map .maplibregl-ctrl-group { overflow: hidden; border: 1px solid #cbd9c3; border-radius: 10px; box-shadow: 0 3px 10px #143b1322; }
.syf-map .maplibregl-ctrl-group button { width: 37px; height: 37px; }
.syf-map .maplibregl-ctrl-attrib { color: #33472c; background: #fffffff2; font: 10px/20px sans-serif; }
.syf-map .maplibregl-ctrl-attrib a { color: #33472c; }
.syf-map .maplibregl-ctrl-bottom-right { max-width: calc(100% - 12px); }
.syf-map .maplibregl-cooperative-gesture-screen { font-family: var(--body, sans-serif); }
@media (max-width: 760px) {
  .map-frame.syf-map { height: 550px; border-radius: 23px; }
  .syf-map-caption { top: 16px; left: 16px; max-width: calc(100% - 78px); padding: 11px 12px; gap: 8px; }
  .syf-map-caption strong { font-size: 19px; }
  .syf-map-caption small { font-size: 9px; }
  .syf-map-views { top: 119px; left: 16px; max-width: calc(100% - 32px); }
  .syf-map-view { padding-inline: 12px; }
  .syf-map-actions { bottom: 156px; left: 16px; }
  .syf-map .map-label { bottom: 44px; left: 16px; right: 16px; padding: 17px; }
  .syf-map .map-label strong { font-size: 20px; }
}
@media (max-width: 380px) {
  .map-frame.syf-map { height: 530px; }
  .syf-map-caption { left: 13px; top: 14px; max-width: calc(100% - 74px); padding: 10px; }
  .syf-map-caption strong { font-size: 18px; }
  .syf-map-caption > span:last-child { font-size: 7px; }
  .syf-map-views { top: 115px; left: 13px; }
  .syf-map-view { padding-inline: 10px; }
  .syf-map-actions { bottom: 154px; left: 13px; gap: 7px; }
  .syf-map-center { padding-inline: 10px; font-size: 10px; }
  .syf-map .map-label { left: 13px; right: 13px; padding: 15px; }
  .syf-map .map-label strong { font-size: 18px; }
  .syf-map-pin-card { gap: 8px; padding-right: 12px; }
  .syf-map-pin-logo, .syf-map-pin-logo img { width: 39px; height: 39px; }
  .syf-map-pin-name { font-size: 25px; }
  .syf-map-pin-name small { font-size: 7px; }
}
@media (prefers-reduced-motion: reduce) {
  .syf-map-stage, .syf-map-caption { transition: none; }
}