/* Keep the first application frame assembled behind the opaque loading screen. */
html.boot-pending,
html.boot-pending body { background: #141518; }
html.boot-pending body { overflow: hidden; }
html.boot-pending .app-shell, html.boot-pending .dock-wrap { visibility: hidden; }
html.boot-pending.boot-painted .app-shell, html.boot-pending.boot-painted .dock-wrap { visibility: visible; }
.boot-loader { display: none; }
html.boot-pending.boot-visible .boot-loader {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-content: center;
  justify-items: center;
  padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
  background: #141518;
  color: #eef0f4;
  opacity: 1;
  transition: opacity 560ms cubic-bezier(.77, 0, .175, 1);
}
html.boot-pending.boot-leaving .boot-loader { opacity: 0; pointer-events: none; }
.boot-brand { position: relative; width: min(60vw, 232px); aspect-ratio: 3; }
.boot-wordmark { display: block; width: 100%; height: 100%; overflow: visible; }
/* These broad strokes reveal the original bitmap; they never replace its lettering. */
.boot-ink {
  fill: none; stroke: #fff; stroke-width: 138; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: boot-ink-draw 850ms ease-in both;
}
/* The long first stroke gathers speed; subsequent letters follow more quickly. */
.boot-ink[class*="boot-ink--"] { animation-timing-function: linear; }
.boot-ink--g-bar { animation-duration: 240ms; animation-delay: 720ms; }
.boot-ink--r { animation-duration: 200ms; animation-delay: 900ms; }
.boot-ink--e { animation-duration: 160ms; animation-delay: 1060ms; }
.boot-ink--a { animation-duration: 120ms; animation-delay: 1180ms; }
.boot-ink--t { animation-duration: 130ms; animation-delay: 1260ms; }
.boot-ink--t-bar { animation-duration: 90ms; animation-delay: 1360ms; }
.boot-ink-complete { fill: #fff; opacity: 0; animation: boot-ink-finish 80ms linear 1450ms both; }
@keyframes boot-ink-draw { to { stroke-dashoffset: 0; } }
@keyframes boot-ink-finish { to { opacity: 1; } }
@keyframes boot-ink-error-draw { to { stroke-dashoffset: 0; } }
@keyframes boot-ink-error-finish { to { opacity: 1; } }
html:is([data-boot-state="error"], [data-boot-state="timeout"]) .boot-logo-art { filter: url(#boot-logo-red); }
html:is([data-boot-state="error"], [data-boot-state="timeout"]) .boot-ink { animation-name: boot-ink-error-draw; }
html:is([data-boot-state="error"], [data-boot-state="timeout"]) .boot-ink-complete { animation-name: boot-ink-error-finish; }
.boot-accessible,
.boot-status { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.boot-error-hint {
  position: absolute;
  top: calc(100% + 20px);
  inset-inline: -24px;
  margin: 0;
  color: rgba(238, 240, 244, .5);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 240ms cubic-bezier(.23, 1, .32, 1);
}
html:is([data-boot-state="error"], [data-boot-state="timeout"]) .boot-error-hint { opacity: 1; }
.boot-retry { position: absolute; inset: -12px; padding: 0; border: 0; border-radius: 12px; background: transparent; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.boot-retry:focus-visible { outline: 2px solid #ef4f5f; outline-offset: 8px; }
.boot-loader [hidden] { display: none; }
@media (prefers-reduced-motion: reduce) {
  .boot-ink, .boot-ink-complete { animation: none !important; }
  .boot-ink { stroke-dashoffset: 0; }
  .boot-ink-complete { opacity: 1; }
  .boot-wordmark { animation: boot-logo-fade 180ms linear both; }
  .boot-error-hint { transition-duration: 180ms; }
  html.boot-pending.boot-visible .boot-loader { transition: none; }
}
@keyframes boot-logo-fade { from { opacity: 0; } to { opacity: 1; } }