/* Mobile and dynamic viewport refinements */
.auth-locked .layout,.auth-locked #openForm{display:none}
.auth-gate{max-width:440px;margin:50px auto;padding:24px;background:white;border:1px solid #dce5dd;border-radius:14px;line-height:1.6}
.auth-gate[hidden]{display:none}
.auth-gate h1{font:600 30px 'Playfair Display',serif;margin:8px 0}
.auth-gate>p{font-size:14px;color:#536359}
.auth-gate .submit-button{margin-top:10px}
.auth-gate #authModeButton{display:block;margin:12px auto;min-height:44px}
.account-content{overflow:auto;min-height:0;padding-bottom:18px}
.account-content h3{margin:24px 0 8px;font-size:17px}
.account-content .outline-button{min-height:44px;margin:8px 0}
#accountButton{min-height:40px;flex:none}
#familyAdmin[hidden],#inviteResult[hidden],#passwordHelp[hidden],#passwordConfirmField[hidden],#authUsernameField[hidden]{display:none}
@media(max-width:680px){.auth-gate{margin:24px 12px;padding:20px}.topbar{gap:8px}.topbar #accountButton{margin-left:auto;padding:8px;font-size:11px}.topbar .brand{font-size:16px;gap:5px}.topbar .brand-mark{width:22px;height:22px}.topbar #openForm{font-size:11px;padding:8px}}
.my-position-marker{background:none;border:0}
.my-position{position:relative;width:38px;height:38px}
.my-position-dot{position:absolute;left:10px;top:10px;width:18px;height:18px;border:3px solid white;border-radius:50%;background:#1879ef;box-shadow:0 0 0 1px #1260b64d,0 2px 7px #14385a55}
.my-position-heading{position:absolute;left:0;top:0;width:38px;height:38px;transform-origin:center}
.my-position-heading::before{content:'';position:absolute;left:12px;top:-5px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:14px solid #1879ef}
.my-position.is-stale .my-position-dot{background:#7b8792}
#locateButton[aria-pressed=true]{color:#126bd1;font-weight:700}
#stopPosition[hidden]{display:none}
.net-marker{width:30px;height:30px;display:grid;place-items:center;background:#235e86;border:2px solid #fff;border-radius:7px;color:white;font:bold 15px sans-serif;box-shadow:0 2px 7px #10251e66}
.net-marker.is-lifted{background:#6b7772;border-style:dashed}
.net-popup-action{display:block;margin-top:12px;min-height:44px}
.net-help{font-size:12px;line-height:1.5;color:#536359;margin:8px 0}
.map-layer-panel .imagery-toolbar{display:flex;flex-direction:column;align-items:stretch;gap:8px;max-height:calc(100svh - 240px);overflow:auto}
.map-layer-panel select{width:100%;min-height:44px;padding:8px;border:1px solid #dce5dd;border-radius:7px;font:14px 'DM Sans',sans-serif;background:white;color:#254f37}
.map-layer-panel .field-label{margin:0}
.net-checkbox{display:flex;gap:8px;align-items:center;font-size:12px;min-height:44px}
.net-checkbox input[type=checkbox]{width:18px;min-height:18px;height:18px;flex:none;accent-color:#235e86}
.catch-item-row+.catch-item-row{border-top:1px solid #dce5dd;margin-top:14px;padding-top:2px}
.catch-items-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0}
#haulTotal{font-size:12px;color:#254f37}
#catchNetField{padding:1px 12px 12px;border-radius:8px;background:#edf3f6}
#catchNetField[hidden],#netFilterLabel[hidden],#catchLocationField[hidden]{display:none}
.map-layer-panel{position:absolute;left:10px;top:10px;z-index:460}
.map-layer-panel>summary,.map-heat-toggle{min-height:44px;border:1px solid #dce5dd;border-radius:9px;background:#fffffff5;box-shadow:0 2px 9px #10251e22;color:#254f37;font:600 12px 'DM Sans',sans-serif;cursor:pointer;padding:10px 13px}
.map-layer-panel>summary{display:flex;align-items:center;gap:14px;list-style:none}
.map-layer-panel>summary::-webkit-details-marker,.heatmap-legend>summary::-webkit-details-marker{display:none}
.map-layer-panel .imagery-toolbar{position:absolute;left:0;top:50px;width:min(310px,calc(100vw - 48px));margin:0;padding:10px;background:#fff;border:1px solid #dce5dd;border-radius:9px;box-shadow:0 4px 18px #10251e30}
.map-heat-toggle{position:absolute;right:10px;top:10px;z-index:450}
.map-heat-toggle[aria-pressed=true]{background:#254f37;color:#fff;border-color:#254f37}
.heatmap-legend{position:absolute;left:10px;bottom:24px;z-index:450;max-width:min(280px,calc(100% - 78px));padding:0 10px;border:1px solid #dfe6df;border-radius:9px;box-shadow:0 2px 9px #10251e22;background:#fffffff2;color:#536359;font-size:11px;line-height:1.45}
.heatmap-legend[hidden]{display:none}
.heatmap-legend>summary{display:flex;align-items:center;gap:7px;min-height:44px;font-weight:600;list-style:none;cursor:pointer}
.heatmap-gradient{display:inline-block;width:72px;height:7px;border-radius:9px;background:linear-gradient(90deg,#2563eb,#06b6d4,#facc15,#f97316,#dc2626)}
.heatmap-legend p{margin:0 0 8px}
.heatmap-active .map-hint{display:none}
.satellite-active .heatmap-legend{bottom:64px}
.catch-heat-tiles .leaflet-tile{filter:none}
.catch-heat-tiles{pointer-events:none}
.dialog select{width:100%;min-height:44px;border:1px solid #e1e7e1;border-radius:7px;padding:11px 12px;font:12px 'DM Sans',sans-serif;color:var(--ink);background:#fff}
.dialog select:focus{outline:none;border-color:#84b290;box-shadow:0 0 0 3px #84b29020}
.photo-status{font-size:11px;line-height:1.5;color:#536359;margin:7px 0}
.photo-status:empty{display:none}
.photo-preview{display:block;max-width:100%;max-height:150px;object-fit:contain;object-position:left center;border-radius:7px;margin:8px 0}
.photo-preview[hidden]{display:none}
#fileName{overflow-wrap:anywhere}
.catch-map-popup .leaflet-popup-content{margin:12px;max-width:calc(100vw - 80px);overflow-wrap:anywhere}
.catch-map-photo{display:block;width:100%;height:clamp(110px,22svh,170px);object-fit:contain;background:#edf3ed;border-radius:7px;margin-bottom:9px}
.catch-map-title{display:block;font-size:14px;line-height:1.4;padding-right:10px}
.catch-map-popup .catch-map-meta{margin:4px 0 0;color:#68796d;font-size:11px;line-height:1.5}
html{overflow-x:hidden}
body{overflow-x:hidden}
button,.upload-box{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:focus-visible,.upload-box:focus-within{outline:3px solid #80c998;outline-offset:2px}
.feed-toggle{display:none}
@media(max-width:680px){
  .dialog select{min-height:46px;font-size:16px}
  .topbar{position:sticky;top:0;padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
  .add-button{min-height:44px;padding:10px 12px;font-size:12px;white-space:nowrap}
  .layout,.map-area,.sidebar{width:100%;min-width:0}
  .map-area{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .map-heading{gap:8px}
  .map-heading>div:first-child{min-width:0}
  .map-counter{flex:none}
  .map-heading h1{font-size:clamp(21px,6vw,25px)}
  .map-frame{height:clamp(300px,48svh,430px);min-height:300px}
  .map-foot{gap:10px;flex-wrap:wrap}
  .text-button{min-height:44px;padding:9px 4px;font-size:12px}
  .sidebar{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
  .sidebar-top{gap:8px;margin-bottom:14px}
  .sidebar-top>div{min-width:0}
  .sidebar-top h2{font-size:20px;white-space:nowrap}
  .feed-toggle{display:flex;align-items:center;justify-content:center;gap:7px;flex:none;min-height:44px;padding:0 11px;border:1px solid #dfe6df;border-radius:8px;background:#fff;color:#365c43;font:600 11px 'DM Sans',sans-serif;cursor:pointer}
  .feed-toggle:active{background:#edf4ee}
  .feed-toggle-icon{font-size:16px;line-height:1}
  #refreshButton{display:none}
  .sidebar.is-collapsed{min-height:0;padding-top:13px;padding-bottom:13px}
  .sidebar.is-collapsed .sidebar-top{margin-bottom:0}
  .sidebar.is-collapsed .feed,.sidebar.is-collapsed .empty-state,.sidebar.is-collapsed .sidebar-bottom{display:none}
  .icon-button{width:44px;height:44px;flex:none}
  .catch-card{grid-template-columns:58px minmax(0,1fr);gap:10px;padding:11px}
  .catch-photo,.catch-placeholder{width:58px;height:64px}
  .modal-backdrop{inset:auto 0 auto;top:var(--visual-top,0px);height:var(--visual-height,100dvh);padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);place-items:start center;overflow-y:auto;overscroll-behavior:contain}
  .dialog{width:100%;height:calc(var(--visual-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-height:calc(var(--visual-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:0;border-radius:0 0 14px 14px;padding:14px max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;overflow:hidden}
  .dialog-head{flex:none;align-items:center;margin:0 0 8px;padding-bottom:9px;border-bottom:1px solid var(--line)}
  .dialog-head h2{font-size:21px}
  .dialog form{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:0 2px 14px}
  .field-label{font-size:12px;margin:12px 0 6px}
  input:not([type=file]),textarea{min-height:46px;font-size:16px;padding:11px 12px}
  textarea{min-height:76px}
  .form-row{grid-template-columns:minmax(0,1fr);gap:0}
  .field{min-width:0}
  .location-row{align-items:flex-start;flex-wrap:wrap;gap:7px 10px}
  .location-button{min-height:44px;font-size:12px}
  .location-row span{align-self:center;overflow-wrap:anywhere}
  .upload-box{min-height:54px;padding:10px;gap:9px}
  .upload-action{font-size:11px;min-height:32px;display:flex;align-items:center}
  .form-actions{position:sticky;bottom:0;background:#fff;padding:8px 0 calc(10px + env(safe-area-inset-bottom));margin-top:4px;border-top:1px solid var(--line)}
  .form-error{margin-top:0;min-height:0}
  .submit-button{min-height:50px;font-size:14px}
  .privacy-note{font-size:10px;margin:8px 3px 0}
}
@media(max-width:380px){
  .brand{gap:7px;font-size:17px}
  .brand-mark{width:25px;height:25px}
  .add-button{padding:9px 10px;font-size:11px}
  .map-counter strong{font-size:20px}
  .eyebrow{font-size:8px;letter-spacing:1.2px}
  .map-frame{height:clamp(285px,45svh,380px);min-height:285px}
}

/* Keep the mobile catch list entirely outside the page flow while closed. */
.map-feed-toggle,.close-feed-button{display:none}
@media(max-width:680px){
  .map-foot{display:flex;flex-direction:column;align-items:stretch;gap:2px;padding-top:8px}
  .map-attribution{font-size:9px}
  .map-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
  .map-feed-toggle{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 11px;border:1px solid #dfe6df;border-radius:8px;background:#fff;color:#365c43;font:600 11px 'DM Sans',sans-serif;cursor:pointer;touch-action:manipulation}
  .map-feed-toggle:active{background:#edf4ee}
  .map-feed-toggle-icon{font-size:16px;line-height:1}
  .sidebar.is-collapsed{display:none}
  .sidebar:not(.is-collapsed){position:fixed;z-index:850;left:0;right:0;bottom:0;width:auto;min-height:0;max-height:min(calc(var(--visual-height,100dvh) * .62),520px);padding:16px max(15px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(15px,env(safe-area-inset-left));border:1px solid var(--line);border-radius:16px 16px 0 0;box-shadow:0 -14px 42px #10251e35;overflow:hidden}
  .sidebar-top{flex:none;margin-bottom:12px}
  .sidebar-actions{display:flex;align-items:center;gap:8px}
  .close-feed-button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 12px;border:1px solid #dfe6df;border-radius:8px;background:#fff;color:#365c43;font:600 11px 'DM Sans',sans-serif;cursor:pointer}
  .sidebar .feed{flex:1;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .sidebar .sidebar-bottom{flex:none;margin-top:10px}
}

/* Put the viewing controls on the map and use the available phone height. */
@media(max-width:680px){
  .map-area{padding-top:14px;min-height:0}
  .map-heading{padding-bottom:12px;align-items:center}
  .map-heading .eyebrow{display:none}
  .map-heading h1{font-size:clamp(19px,5.5vw,23px);margin:0}
  .map-frame{height:calc(100svh - 204px);min-height:280px;max-height:none;flex:none}
}
