/* What is on the page before the app starts, and if it fails to. */

.boot {
  display: grid;
  align-content: center;
  gap: var(--s-3);
  min-height: 100%;
  max-width: 460px;
  margin: 0 auto;
  padding: var(--s-5);
}

#app > .boot { height: 100vh; }

.boot h1 {
  font-size: var(--t-xl);
  font-weight: 650;
  letter-spacing: -0.02em;
}

.boot p {
  font-size: var(--t-base);
  color: var(--c-on-ink-soft);
}

.boot--failed h1 { color: var(--c-on-ink); }
.boot--failed p { color: #cfd6de; }

.boot__detail {
  padding-top: var(--s-3);
  border-top: 1px solid var(--c-ink-line);
  font-family: var(--font-mono);
  font-size: var(--t-sm);
  overflow-wrap: anywhere;
}