#maptelio-update-banner {
  background: #fffdf8;
  border: 1px solid #cbd8ce;
  border-radius: 14px;
  bottom: max(80px, env(safe-area-inset-bottom));
  box-shadow: 0 8px 32px #243d3a24;
  color: #243d3a;
  font: 15px/1.5 system-ui, sans-serif;
  max-width: 390px;
  padding: 18px;
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  z-index: 1500;
}
#maptelio-update-banner[hidden] { display: none; }
#maptelio-update-banner p { margin: 0 0 12px; }
#maptelio-update-banner button {
  background: #243d3a;
  border: 1px solid #243d3a;
  border-radius: 8px;
  color: white;
  cursor: pointer;
  font: inherit;
  margin-right: 8px;
  padding: 7px 13px;
}
#maptelio-update-banner button:last-child { background: transparent; color: #243d3a; }
#maptelio-update-banner button:disabled { cursor: wait; opacity: .65; }
#maptelio-update-banner button:focus-visible { outline: 3px solid #d86f3e; outline-offset: 3px; }
#maptelio-update-progress {
  background: #fffdf8;
  border: 1px solid #cbd8ce;
  border-radius: 16px;
  color: #243d3a;
  font: 16px/1.6 system-ui, sans-serif;
  max-width: min(420px, calc(100vw - 48px));
  padding: 24px;
}
#maptelio-update-progress::backdrop { background: #152e2bd9; }
#maptelio-update-progress p { margin: 0; }
@media (max-width: 480px) {
  #maptelio-update-banner { left: 12px; right: 12px; }
}