





















button, a, [role="button"], .v4-btn, .v4-btn-primary, .v4-btn-secondary,
.v4-ic-tab, .v4-ic-pill, .v4-ic-action-btn,
.chip, .eg-dir-btn, .eg-go,
input[type="checkbox"], input[type="radio"], select {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;  
}


@media (max-width: 780px) {

  

  button:not(.v4-ic-tab):not(.eg-dir-btn):not(.section-print-btn),
  .v4-btn, .v4-btn-primary, .v4-btn-secondary,
  a.v4-btn, a.v4-btn-secondary,
  .v4-ic-pill,
  .eg-go,
  .chip {
    min-height: 44px;
    min-width: 44px;
  }
  
  .v4-ic-pill, .v4-ic-close { min-width: 40px; min-height: 40px; }

  


  input[type="text"], input[type="email"], input[type="password"],
  input[type="tel"],  input[type="number"], input[type="search"],
  input[type="url"],  input[type="date"],   input[type="time"],
  input[type="datetime-local"],
  textarea, select {
    font-size: 16px !important;
  }

  
  body { padding-bottom: env(safe-area-inset-bottom); }
  #download-fab, #submit-fab, #map-style-toggle {
    bottom: calc(16px + env(safe-area-inset-bottom)) !important;
  }
  
  .info-bar { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }

  

  .v4-ic-edit-actions,
  .v4-sf-foot,
  .v4-rw-foot {
    position: sticky;
    bottom: 0;
    background: #fff;
    box-shadow: 0 -1px 0 rgba(0,0,0,.06), 0 -8px 16px -8px rgba(0,0,0,.08);
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
    z-index: 5;
  }

  
  #sidebar {
    width: min(92vw, 380px) !important;
    transition: transform .22s cubic-bezier(.4,.0,.2,1) !important;
  }
  
  #sidebar-backdrop {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.4);
    z-index: 850;
    opacity: 0; pointer-events: none;
    transition: opacity .2s ease;
  }
  body[data-mobile-sidebar="open"] #sidebar-backdrop {
    opacity: 1; pointer-events: auto;
  }

  
  #mobile-header {
    height: 52px;
    padding: 0 8px;
    box-shadow: 0 1px 0 rgba(0,0,0,.06);
  }
  #mobile-menu-btn, #mobile-print-btn {
    min-width: 44px; min-height: 44px;
    font-size: 22px;
    background: transparent;
    border: 0;
  }
  #mobile-menu-btn:active { background: rgba(0,0,0,.06); border-radius: 8px; }

  
  .v4-row2, .v4-card-grid, .v4-hub-grid { grid-template-columns: 1fr !important; }
  .v4-hub-nav button { min-height: 44px; }

  

  .v4-info-card.open .v4-ic-overlay { background: rgba(0,0,0,.5); }
  





  

  body.has-botnav { --v4-botnav-inset: calc(54px + env(safe-area-inset-bottom)); }
  body.has-botnav .v4-info-card { bottom: var(--v4-botnav-inset); }

  
















  body.has-botnav .v4-info-card:not(.open) .v4-ic-panel {
    transform: translateY(calc(100% + var(--v4-botnav-inset)));
  }
  

  .v4-ic-panel { height: 88% !important; }
  


  .v4-ic-body { min-height: 0; padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
  
  .v4-ic-tab { padding: 14px 8px; font-size: 15px; }

  
  .v4-rw-panel, .v4-sf-panel {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    border-radius: 0 !important;
    inset: 0 !important;
  }
  .v4-rw-body, .v4-sf-body {
    -webkit-overflow-scrolling: touch;
  }

  
  .eg-card {
    max-height: calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .eg-go { min-height: 50px; font-size: 16px; }

  
  .leaflet-popup-content { font-size: 14px !important; line-height: 1.5 !important; }
  .leaflet-popup-close-button {
    width: 32px !important; height: 32px !important;
    font-size: 22px !important;
    padding: 0 !important;
  }

  
  .leaflet-control-zoom a {
    width: 40px !important; height: 40px !important;
    line-height: 40px !important;
    font-size: 22px !important;
  }

  






}


@media (max-width: 480px) {
  
  #download-fab, #submit-fab {
    padding: 10px 14px !important;
    font-size: 13px !important;
  }
  #download-fab .icon, #submit-fab .icon { font-size: 16px; }

  
  .eg-card { padding: 18px 16px !important; }
  .eg-head h2 { font-size: 18px !important; }
  .eg-head p { font-size: 13px !important; }

  
  .v4-ic-flag { width: 40px !important; height: 40px !important; font-size: 26px !important; flex: 0 0 40px !important; }
  .v4-ic-title { font-size: 17px !important; }

  
  .v4-hub-nav { gap: 4px !important; padding: 8px !important; overflow-x: auto; }
  .v4-hub-nav button { white-space: nowrap; font-size: 12.5px !important; padding: 8px 10px !important; }
}


@media (max-width: 900px) and (orientation: landscape) {
  .info-bar { max-height: 50vh !important; }
  .v4-ic-panel { height: 100% !important; }   
  .v4-info-card { align-items: stretch !important; justify-content: flex-end !important; }
  .v4-ic-panel { width: min(420px, 60vw) !important; max-width: 420px !important; transform: translateX(-100%) !important; }
  .v4-info-card.open .v4-ic-panel { transform: translateX(0) !important; }
}













#fab-trigger { display: none; }            
#fab-stack {
  position: fixed; top: 12px; inset-inline-end: 14px; z-index: 999;
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
}
#fab-stack > #download-fab,
#fab-stack > #submit-fab,
#fab-stack > #uman-city-cta,
#fab-stack > #map-style-toggle {
  position: static !important;
  inset: auto !important; top: auto !important; bottom: auto !important;
  inset-inline-start: auto !important; inset-inline-end: auto !important;
  margin: 0 !important;
}










@media (max-width: 780px) {
  





  #fab-trigger, #fab-stack,
  #download-fab, #submit-fab, #uman-city-cta, #map-style-toggle,
  #fab-stack > #download-fab, #fab-stack > #submit-fab,
  #fab-stack > #uman-city-cta, #fab-stack > #map-style-toggle {
    display: none !important;
  }

  
  .info-bar { max-height: 56vh !important; }
  .info-bar .close { width: 42px !important; height: 42px !important;
    display: inline-flex; align-items: center; justify-content: center; }

  
  .v4-ann-banner { padding: 6px 10px; font-size: 12.5px; }
  #v4-imsg-banner a { font-size: 13px !important; padding: 0 4px; }

  
  #admin-toolbar {
    left: auto; right: 8px; transform: none;
    max-width: calc(100vw - 16px); overflow-x: auto;
  }
  #admin-toolbar .lbl, #admin-toolbar #lang-label { font-size: 0; }
}


#mobile-legend-btn { display: none; }
@media (max-width: 780px) {
  #mobile-legend-btn {
    display: inline-flex; align-items: center; justify-content: center;
    background: none; border: 0; font-size: 20px; cursor: pointer;
    min-width: 44px; min-height: 44px;
  }
}





#v4-botnav { display: none; }
@media (max-width: 780px) {
  #v4-botnav {
    display: flex; justify-content: space-around; align-items: flex-end;
    position: fixed; inset-inline: 0; bottom: 0; z-index: 1300;
    background: #fff; border-top: 1px solid #e3ddd1;
    padding: 5px 4px calc(6px + env(safe-area-inset-bottom));
    box-shadow: 0 -6px 18px -12px rgba(0,0,0,.3);
  }
  #v4-botnav button, #v4-botnav a {
    flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
    background: none; border: 0; text-decoration: none; cursor: pointer;
    color: #5C5648; font: inherit; font-size: 11px;   
  }
  

  #v4-botnav .ic { position: relative; display: flex; align-items: center; justify-content: center; height: 24px; line-height: 1; }
  #v4-botnav .ic svg { display: block; }
  
  #v4-botnav .v4-nav-badge {
    position: absolute; top: -5px; inset-inline-end: -9px;
    min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px;
    background: #dc2626; color: #fff; font-size: 10px; font-weight: 800; line-height: 16px;
    text-align: center; box-shadow: 0 0 0 2px #fff; pointer-events: none;
  }
  #v4-botnav .cta .ic {
    background: #0b3d2e; color: #fff; width: 42px; height: 42px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; margin-top: -16px;
    box-shadow: 0 6px 14px -6px rgba(11,61,46,.6); font-size: 22px;
  }
  
  body.has-botnav #fab-stack,
  body.has-botnav #fab-trigger { display: none !important; }
  


  body.has-botnav .info-bar { bottom: calc(54px + env(safe-area-inset-bottom)); }
}

#v4-more-sheet { position: fixed; inset: 0; z-index: 1400; }
#v4-more-sheet .v4-more-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.35); }
#v4-more-sheet .v4-more-card {
  position: absolute; inset-inline: 0; bottom: 0; background: #fff;
  border-radius: 16px 16px 0 0; padding: 8px 14px calc(14px + env(safe-area-inset-bottom));
  display: flex; flex-direction: column; gap: 8px; box-shadow: 0 -10px 30px -8px rgba(0,0,0,.4);
  



  max-height: 85vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;   
}

#v4-more-sheet .v4-more-card button { flex: 0 0 auto; }
#v4-more-sheet .v4-more-grip { width: 40px; height: 4px; border-radius: 4px; background: #d8d2c4; margin: 4px auto 6px; }
#v4-more-sheet .v4-more-card button {
  background: #f7f4ed; border: 1px solid #e3ddd1; border-radius: 10px;
  padding: 13px 14px; font: inherit; font-size: 14px; text-align: start; cursor: pointer; color: #1f1d18;
}
#v4-more-sheet .v4-more-card button[data-more="logout"] { color: #b91c1c; border-color: #f3c9c4; background: #fef2f2; }


#v4-more-sheet .v4-more-x {
  position: absolute; inset-inline-start: 10px; top: 10px; width: 34px; height: 34px;
  min-height: 0; padding: 0; border-radius: 999px; background: #f2efe6; border: 0;
  font-size: 15px; line-height: 34px; text-align: center; color: #5C5648; z-index: 2;
}








@media (max-width: 780px) {
  
  #admin-toolbar { display: none !important; }

  

  #mh-auth-pill {
    margin-inline-start: 4px;
    border: 0; border-radius: 999px;
    background: #0b3d2e; color: #fff;
    padding: 6px 12px; font: inherit; font-size: 12px; font-weight: 700;
    white-space: nowrap; max-width: 42vw; overflow: hidden;
    cursor: pointer; flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: 6px;
  }
  #mh-auth-pill.in { background: #7f1d1d; padding: 4px 11px 4px 5px; }
  
  #mh-auth-pill .mh-av { width: 24px; height: 24px; border-radius: 50%; object-fit: cover;
    flex: 0 0 auto; border: 1px solid rgba(255,255,255,.55); background: #0b3d2e; }
  #mh-auth-pill .mh-av-fallback { display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
  #mh-auth-pill .mh-name { max-width: 86px; overflow: hidden; text-overflow: ellipsis; }

  






  #sidebar { overflow: hidden; display: flex; flex-direction: column; }
  #sidebar #sb-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  #sidebar #routes-container { flex: 0 0 auto; overflow: visible; }
  



  #sidebar #filters { position: static; }
}
@media (max-width: 780px) {
  
  body.has-botnav #sidebar { bottom: 54px; }
}
