/* Shared surfaces for every app dialog and overlay. */
:root{--peak-dialog-bg:#111c25;--peak-dialog-border:rgba(190,218,223,.13);--peak-dialog-text:#f0f6f6;--peak-dialog-muted:#9aadb8;--peak-dialog-accent:#5ce0ba;--peak-dialog-radius:22px;--peak-dialog-shadow:0 28px 85px rgba(0,0,0,.5)}
body dialog[open],body :is(.weather-modal,.legal-modal,.interactive-elevation-overlay,.places-overview-overlay,.places-list-overlay,.email-verification-overlay,.modal-overlay,.save-confirmation-overlay,.pwa-install-overlay){background:rgba(5,12,18,.72)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important}
body :is(dialog .card,dialog .login-card,dialog .share-modal-card,dialog .place-details-card,dialog .peak-dialog-card,.weather-modal-content,.legal-modal-content,.interactive-elevation-modal,.places-overview-card,.places-list-card,.email-verification-modal,.vemarcus-modal,.save-confirmation-card,.pwa-install-modal){background:var(--peak-dialog-bg)!important;color:var(--peak-dialog-text)!important;border:1px solid var(--peak-dialog-border)!important;border-radius:var(--peak-dialog-radius)!important;box-shadow:var(--peak-dialog-shadow)!important;backdrop-filter:none!important}
body :is(dialog h2,.weather-modal-title,.legal-modal-title,.places-overview-title,.places-list-title,.modal-title){color:var(--peak-dialog-text);font-size:20px!important;font-weight:650!important;letter-spacing:-.5px;line-height:1.25}
body :is(dialog,.weather-modal,.legal-modal,.places-overview-overlay,.places-list-overlay,.email-verification-overlay,.modal-overlay) :is(.modal-header,.share-modal-header,.place-details-header,.weather-modal-header,.legal-modal-header){border-bottom-color:var(--peak-dialog-border)!important;background:transparent!important}
body :is(dialog,.weather-modal,.legal-modal,.places-overview-overlay,.places-list-overlay,.email-verification-overlay,.modal-overlay) :is(.share-modal-close,.place-details-close,.weather-modal-close,.legal-modal-close,.modal-close,.close-btn){width:32px!important;height:32px!important;border-radius:50%!important;border:1px solid var(--peak-dialog-border)!important;background:transparent!important;color:var(--peak-dialog-muted)!important;box-shadow:none!important}
body .peak-dialog-card{width:min(100%,440px)!important;max-height:calc(100dvh - 40px);overflow-y:auto;padding:25px!important;margin:auto;box-sizing:border-box}
.peak-dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.peak-dialog-header h2{margin:6px 0 0}.peak-dialog-eyebrow{display:block;font-size:10px;font-weight:650;letter-spacing:1.65px;color:var(--peak-dialog-accent)}.peak-dialog-close{flex-shrink:0;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--peak-dialog-border);border-radius:50%;background:transparent;color:var(--peak-dialog-muted);font-size:22px;line-height:1;font-family:inherit;cursor:pointer}.peak-dialog-close:hover{color:white;background:rgba(255,255,255,.06)}.peak-dialog-close:focus-visible,.peak-dialog-actions button:focus-visible{outline:2px solid var(--peak-dialog-accent);outline-offset:3px}
#peakMessageText{margin:0;color:var(--peak-dialog-muted);font-size:14px;line-height:1.7;white-space:pre-line;overflow-wrap:anywhere}.peak-dialog-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding-top:23px;margin-top:23px;border-top:1px solid var(--peak-dialog-border)}.peak-dialog-actions button{padding:10px 16px;border-radius:10px;font-size:13px;font-weight:600;font-family:inherit;cursor:pointer;border:1px solid var(--peak-dialog-border);color:var(--peak-dialog-text);background:transparent}.peak-dialog-actions button[type=submit]{background:var(--peak-dialog-accent);border-color:var(--peak-dialog-accent);color:#08291f}.peak-dialog-actions button[hidden]{display:none}#peakMessageFields:empty{display:none}#peakMessageFields label{display:block;margin-top:18px;font-size:12px;color:var(--peak-dialog-muted)}#peakMessageFields input{display:block;margin-top:8px;padding:11px 12px;width:100%;box-sizing:border-box;border:1px solid var(--peak-dialog-border);border-radius:10px;background:#0c151d;color:var(--peak-dialog-text);font-size:14px;font-family:inherit}#peakMessageFields input:focus{outline:2px solid var(--peak-dialog-accent);outline-offset:1px}
@media(max-width:480px){body .peak-dialog-card{padding:22px!important;width:100%!important}.peak-dialog-header{margin-bottom:18px}.peak-dialog-actions{gap:8px}.peak-dialog-actions button{flex:1}}

@media (max-width:768px), (max-height:500px) and (max-width:1024px) {
  body dialog[open],body :is(.weather-modal,.legal-modal,.interactive-elevation-overlay,.places-overview-overlay,.places-list-overlay,.email-verification-overlay,.modal-overlay,.save-confirmation-overlay,.pwa-install-overlay) {
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
}

@media (max-width:768px) {
  html body #addInstructionsModal {
    padding:16px !important;
    background:rgba(5,12,18,.32) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    filter:none !important;
  }
  html body #addInstructionsModal::backdrop {
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
  html body #addInstructionsModal .add-place-card {
    width:min(100%,320px) !important;
    padding:16px !important;
    border-radius:18px !important;
  }
  #addInstructionsModal .peak-dialog-header { margin-bottom:10px; gap:10px; }
  #addInstructionsModal .peak-dialog-eyebrow { display:none; }
  html body #addInstructionsModal h2 { font-size:18px !important; margin:4px 0 0; }
  #addInstructionsModal .peak-dialog-close { width:28px; height:28px; }
  #addInstructionsModal .place-import-copy { font-size:12px; margin-bottom:6px; }
  #addInstructionsModal .place-import-choices { gap:2px; }
  #addInstructionsModal .place-import-choices button { padding:8px 2px; gap:10px; min-height:52px; }
  #addInstructionsModal .import-choice-icon { width:32px; height:32px; border-radius:10px; }
  #addInstructionsModal .import-choice-icon svg { width:19px; height:19px; }
  #addInstructionsModal .import-choice-copy { gap:2px; }
  #addInstructionsModal .import-choice-copy strong { font-size:13px; }
  #addInstructionsModal .import-choice-copy > span { font-size:10px; }
  #addInstructionsModal .add-place-footer { margin-top:8px; padding-top:10px; font-size:10px; }
}

/* Keep the map unchanged behind every window, including legacy overlays. */
html body :is(dialog:not(#tutorialOverlay),.weather-modal,.legal-modal,.interactive-elevation-overlay,.places-overview-overlay,.places-list-overlay,.email-verification-overlay,.modal-overlay,.save-confirmation-overlay,.pwa-install-overlay,#backdrop) {
  background:transparent !important;
  background-image:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  filter:none !important;
  -webkit-filter:none !important;
  box-shadow:none !important;
}
html body :is(dialog,#peakMessageDialog)[id]::backdrop {
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
html body :is(.weather-modal,.legal-modal,.interactive-elevation-overlay,.places-overview-overlay,.places-list-overlay,.email-verification-overlay,.modal-overlay,.save-confirmation-overlay,.pwa-install-overlay)::before,
html body :is(.weather-modal,.legal-modal,.interactive-elevation-overlay,.places-overview-overlay,.places-list-overlay,.email-verification-overlay,.modal-overlay,.save-confirmation-overlay,.pwa-install-overlay)::after {
  content:none !important;
  display:none !important;
}
