
:root{--green:#778104;--brown:#4B3F0F;--offwhite:#F8FAFA;--blue:#2586C7;--red:#D71920;--text:#1e1e1e}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%;font-family:Poppins,Arial,Helvetica,sans-serif;background:var(--offwhite);color:var(--text)}
body{min-height:100dvh;display:flex;flex-direction:column}
header{background:var(--green);color:white;padding:14px 16px 13px}
.topbar{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.brand{font-size:27px;letter-spacing:.06em;line-height:1;font-weight:500}
.code{margin-top:6px;font-size:11px;opacity:.92}
nav{display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-end}
nav a{color:white;text-decoration:none;border:1px solid rgba(255,255,255,.48);border-radius:999px;padding:5px 8px;font-size:11px}
.title-area{max-width:1100px;margin:12px auto 0}
h1{margin:0;font-size:22px;line-height:1.17}
.intro{margin:7px 0 0;font-size:13px;line-height:1.42;max-width:780px}
.main{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}
#map{width:100%;flex:1;min-height:calc(100dvh - 170px);background:#d8ddaa}
.loading{position:absolute;z-index:900;top:14px;left:14px;right:14px;max-width:520px;background:rgba(248,250,250,.96);color:var(--brown);border-left:5px solid var(--green);border-radius:8px;padding:10px 12px;font-size:13px;line-height:1.35;box-shadow:0 4px 15px rgba(0,0,0,.15)}
.hidden{display:none}
.leaflet-popup-content-wrapper{border-radius:12px}
.leaflet-popup-content{font-family:Poppins,Arial,Helvetica,sans-serif;min-width:250px;max-width:350px;margin:14px 16px}
.popup-title{font-weight:700;color:var(--brown);font-size:16px;line-height:1.25;margin-bottom:8px}
.popup-text{font-size:13px;line-height:1.45;max-height:230px;overflow:auto;white-space:pre-wrap;margin-bottom:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.btn{display:inline-block;color:white!important;text-decoration:none!important;background:var(--green);padding:8px 10px;border-radius:7px;font-size:13px;font-weight:700}
.btn.video{background:var(--blue)}.btn.secondary{background:var(--brown)}
.fallback-marker{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-weight:700;border:3px solid white;box-shadow:0 2px 7px rgba(0,0,0,.38);line-height:1;font-size:16px}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:3000;background:var(--offwhite);box-shadow:0 -10px 30px rgba(0,0,0,.28);border-radius:18px 18px 0 0;max-height:76dvh;overflow:auto;padding:15px 18px 18px;transform:translateY(110%);transition:transform .22s ease}
.sheet.open{transform:translateY(0)}
.grip{width:44px;height:4px;background:#c7c7c7;border-radius:4px;margin:0 auto 12px}
.close{position:absolute;top:10px;right:13px;width:34px;height:34px;border-radius:50%;border:0;background:#e4e4e4;font-size:22px;line-height:1}
.sheet-title{padding-right:42px;font-size:18px;line-height:1.25;font-weight:700;color:var(--brown);margin-bottom:9px}
.sheet-text{font-size:14px;line-height:1.48;white-space:pre-wrap;margin-bottom:14px}
.sheet-actions{display:flex;flex-wrap:wrap;gap:9px}
.video-embed{width:100%;margin-bottom:12px;overflow:hidden}
.video-embed iframe{width:100%;aspect-ratio:16/9;border-radius:8px;border:0;display:block;max-width:100%}
footer{background:white;border-top:1px solid rgba(0,0,0,.08);padding:8px 14px;font-size:11px;color:#666}
@media(max-width:720px){header{padding:12px 12px 11px}.topbar{display:block}.brand{font-size:24px}nav{justify-content:flex-start;margin-top:10px}nav a{font-size:10px;padding:5px 7px}.title-area{margin-top:10px}h1{font-size:19px}.intro{font-size:12px}#map{min-height:calc(100dvh - 205px)}.leaflet-popup{display:none}}
