/* flow-v1: Explore layout shared by /pools/ and /lakes-rivers/ */
@media (min-width:801px){
 #app #body{grid-template-columns:minmax(360px,40%) 1fr}
 body.tmap .wrap,body.tmap #wrap{grid-template-columns:minmax(360px,40%) 1fr}
}
.pin-sel{filter:hue-rotate(150deg) saturate(1.6) drop-shadow(0 0 3px #0A62B8);transform-origin:bottom center}
.mc.sel,.card.sel,.mcard.sel,.mc[aria-current=true]{outline:3px solid #0A62B8;outline-offset:-3px;border-radius:12px}
.sta{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:1100;background:#fff;color:#11305D;border:0;border-radius:999px;padding:10px 18px;font-weight:700;font-size:.95rem;box-shadow:0 2px 10px rgba(0,0,0,.25);cursor:pointer;min-height:44px}
.sta:focus-visible{outline:3px solid #0A62B8;outline-offset:2px}
.flowload{display:flex;align-items:center;gap:8px;padding:8px 14px;font-size:.88rem;color:#456}
.flowload .sk{width:14px;height:14px;border-radius:50%;border:2px solid #cfe0f2;border-top-color:#0A62B8;animation:flowspin 0.8s linear infinite}
@keyframes flowspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.flowload .sk{animation:none}}
.mcimg,.im{aspect-ratio:16/9}
.lakechip{text-decoration:none}
/* mobile bottom sheet */
@media (max-width:800px){
 #app.flowsheet #mapw{visibility:visible!important;display:block!important;position:absolute;inset:0}
 #app.flowsheet #side{display:flex!important;flex-direction:column;position:absolute;left:0;right:0;bottom:0;top:auto;height:50%;z-index:1200;border-radius:16px 16px 0 0;box-shadow:0 -4px 18px rgba(0,0,0,.18);transition:height .25s ease;padding-bottom:env(safe-area-inset-bottom);overflow:hidden;background:#fff}
 #app.flowsheet #side>*:not(.sheethd){min-height:0}
 #app.flowsheet #list{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex:1}
 #app.flowsheet #side[data-state=peek] #tools{display:none}
 .sheethd{flex:none;display:flex;justify-content:center;align-items:center;width:100%;height:28px;border:0;background:transparent;cursor:grab;touch-action:none;padding:0}
 .sheethd span{width:44px;height:5px;border-radius:3px;background:#b9c4cf}
 .sheethd:focus-visible{outline:3px solid #0A62B8;outline-offset:-3px}
 #app.flowsheet #mobtog{display:block;position:absolute;right:12px;left:auto;transform:none;bottom:calc(12px + env(safe-area-inset-bottom));z-index:1300}
 #app.flowsheet #detail{position:absolute;left:8px;right:8px;bottom:8px;top:auto!important;max-height:62%!important;z-index:1250;overflow:auto}
 .sta{top:10px}
}
@media (min-width:801px){.sheethd{display:none}}
/* lakes page */
@media (min-width:801px){body:not(.flowsheet) aside#side{width:40%;min-width:360px;max-width:640px}}
@media (max-width:800px){
 body.flowsheet #side{display:flex!important;flex-direction:column;position:absolute;left:0;right:0;bottom:0;top:auto;inset:auto 0 0 0;height:30%;z-index:900;border-radius:16px 16px 0 0;box-shadow:0 -4px 18px rgba(0,0,0,.18);transition:height .25s ease;padding:0 12px env(safe-area-inset-bottom);overflow:hidden}
 body.flowsheet #side>*{flex:none}
 body.flowsheet #list{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;min-height:0}
 body.flowsheet #mobtog{display:block}
}
/* home */
.hsug{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;color:#11305D;border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.22);z-index:50;max-height:60vh;overflow:auto;text-align:left;padding:6px 0}
.hsug .hg{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#5b6b7b;padding:8px 14px 4px}
.hsug .ho{display:flex;flex-direction:column;padding:8px 14px;cursor:pointer;min-height:44px;justify-content:center}
.hsug .ho span{font-size:.82rem;color:#5b6b7b}
.hsug .ho.on,.hsug .ho:hover{background:#eaf3fc}
.hsug .hn{padding:10px 14px;font-size:.9rem}
.qchips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:10px 0 4px}
.qchips a{background:rgba(255,255,255,.92);color:#11305D;text-decoration:none;font-weight:700;font-size:.9rem;padding:8px 14px;border-radius:999px;min-height:40px;display:inline-flex;align-items:center}
.qchips a:focus-visible{outline:3px solid #fff;outline-offset:2px}
/* perf: skip layout/paint for off-screen result cards; no hidden in-page hero download on /pools/ */
#list .mc,#list .row,#list .card{content-visibility:auto;contain-intrinsic-size:auto 300px}
#home .hero{background-image:none!important}