* {
  font-family: Arial, Verdana, Geneva, Tahoma, sans-serif;
}

#notice {
  display: none;
  position: fixed;
  background-color: #37353fd7;
  color: white;
  padding: 5px 10px;
  bottom: 0;
  gap: 10px;
  width: 100%;
  font-size: 10px;
}
#notice a {
  color: white;
  text-decoration: underline;
}

button {
  cursor: pointer;
}

h1 {
  font-size: 1.5rem;
  font-weight: bold;
}

h1:first-of-type {
  border-bottom: 2px solid #46434d;
  background-color: #f8f4ff;
  text-align: center;
  text-wrap: balance;
}
h1:first-of-type,
main footer {
  margin: -20px -20px 0;
  padding: 20px;
  width: calc(100% + 40px);
}

body.notice footer,
body.offline footer {
  margin-bottom: 75px;
}

h2 {
  font-size: 1.25rem;
  font-weight: bold;
}


h3 {
  font-size: 1rem;
  font-weight: bold;
}


h4 {
  font-size: 0.875rem;
  font-weight: bold;
}


h5 {
  font-size: 0.75rem;
  font-weight: bold;
}


h6 {
  font-size: 0.625rem;
  font-weight: bold;
}

p {
  font-size: 1rem;
  padding-bottom: 1rem;
}

p + ul {
  margin-top: -2rem;
}

table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  max-width: 100%;
}

td,
th {
  padding: 4px 6px;
  text-align: left;
  border: 1px solid #ddd;
}

th {
  background-color: #21153c;
  color: white;
}

tr:nth-child(even) {
  background-color: #f7f6f9;
}

thead tr:first-child th:first-child { border-top-left-radius: 8px; }
thead tr:first-child th:last-child { border-top-right-radius: 8px; }
tbody tr:last-child td:first-child { border-bottom-left-radius: 8px; }
tbody tr:last-child td:last-child { border-bottom-right-radius: 8px; }

footer {
  border-top: 2px solid #2c2932;
  text-align: center;
  padding-top: 0.5rem;
  background-color: #f8f4ff;
}

footer * {
  font-size: 0.75rem;
}

footer ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  align-items: center;
}

footer #version {
  margin-top: 32px;
  font-size: 8px;
  color: #2c2932;
}

pre {
  background-color: #fafafa;
  padding: 1rem;
  white-space: pre-wrap;
}
code {
  font-family: Monaco, Consolas, "Courier New", "Andale Mono", "Ubuntu Mono", monospace;
  font-size: 0.875rem;
}

p {
  padding-bottom: 0;
}

main p:has(+ *:not(p):not(iframe):not(pre)) {
  padding-bottom: 1rem;
}

blockquote {
  border: 4px solid #2b9127;
  background-color: #d8fcd7;
  border-radius: 4px;
  margin: 8px 0;
  padding: 0 1rem;
}

p + blockquote {
  margin-top: 0;
}

blockquote * {
  font-size: 0.8rem;
}
blockquote p {
  padding-bottom: 0.8rem;
}
blockquote p:last-of-type {
  padding-bottom: 0;
}

blockquote p + ul {
  margin-top: 0;
}

blockquote ul {
  padding-left: 15px;
}

blockquote ul:has(.persistent-checkbox) {
  list-style: none;
}

blockquote.quote {
  border: none;
  border-left: 2px solid #9b9b9b;
  background-color: #fefefe;
  color: #46434d;
  border-radius: 0;
}

.current-page {
  text-decoration: none;
  outline: 1px solid black;
  outline-offset: 0.5rem;
  border-radius: 0.5rem;
  color: black !important;
}

a,
a:hover,
a:visited {
  color: #531fff;
}

.splash {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: #f8f4ff;
}

.splash .logo {
  width: 100%;
  max-width: 230px;
}

.iframe-fallback {
  display: none;
}

body.offline iframe,
body.slow iframe:not(.manual-load) {
  display: none;
}

body.offline .iframe-fallback,
body.slow .iframe-fallback:not(.manual-load) {
  color: rgb(77, 77, 77);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  justify-content: center;
  background-color: #f2f2f2;
  height: 150px;
  width: 100%;
}
.iframe-fallback a {
  color: rgb(77, 77, 77);
}

body.offline .iframe-fallback .message::before {
  content: "Unable to load map preview.";
}
/* body.offline .iframe-fallback a::before {
  content: "Try opening directly in Maps";
} */
body.offline .iframe-fallback button { display: none; }

body.slow .iframe-fallback .message::before {
  content: "Slow connection detected.";
}
body.slow .iframe-fallback button::before {
  content: "Load map manually";
}
/* body.slow .iframe-fallback a { display: none; } */

.persistent-checkbox {
  display: inline-flex;
  vertical-align: baseline;
  align-items: baseline;
  gap: .5em;
}

.persistent-checkbox input[type="checkbox"] {
  scale: 1.5;
}

blockquote .persistent-checkbox {
  align-items: flex-start;
}

blockquote .persistent-checkbox input[type="checkbox"] {
  scale: 1.2;
}


dl {
  display: grid;
  grid-template-columns: max-content auto;
  gap: 4px;
  width: fit-content;
  margin: 0 auto;
  align-items: baseline;
}

dt {
  font-weight: bold;
  text-align: right;
}
dd {
  text-align: left;
  margin-inline-start: 8px;
}