* { box-sizing: border-box; }

html {
  max-width: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  max-width: 100%;
  margin: 0;
  padding: 12px;
  padding:
    max(12px, env(safe-area-inset-top))
    max(12px, env(safe-area-inset-right))
    max(20px, env(safe-area-inset-bottom))
    max(12px, env(safe-area-inset-left));
  overflow-x: hidden;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

body > div[align="center"],
body > center,
center {
  width: min(100%, 1180px);
  margin-inline: auto;
}

img {
  max-width: 100%;
}

iframe,
video,
embed,
object {
  max-width: 100%;
}

iframe[width][height] {
  display: block;
  width: 100% !important;
  max-width: 853px;
  height: auto !important;
  margin-inline: auto;
  aspect-ratio: 16 / 9;
}

a:focus-visible {
  outline: 3px solid #ffd84d;
  outline-offset: 3px;
}

@media (max-width: 820px) {
  img[height] { height: auto !important; }
}