/* Available before the application bundle, including on a cold connection. */
.page-loader {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #0d0d0d;
  color: #e7e0d6;
  opacity: 1;
  transition: opacity 420ms cubic-bezier(.22, 1, .36, 1), visibility 420ms;
  font-family: Arial, sans-serif;
}
.page-loader[hidden] { display: none; }
.page-loader::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 46%, #ee46230d, transparent 52%);
  pointer-events: none;
}
.page-loader.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.page-loader__content { width: min(72vw, 490px); position: relative; text-align: center; }
.page-loader__logo { display: block; width: 100%; height: auto; overflow: visible; }
.page-loader__caption { margin: 38px 0 0; font-size: 11px; letter-spacing: .16em; color: #aca69e; }
.page-loader__track { width: 56px; height: 2px; margin: 23px auto 0; overflow: hidden; background: #e7e0d61a; }
.page-loader__track::after { content: ""; display: block; width: 25px; height: 100%; background: #ee4623; animation: loader-scan 1.4s ease-in-out infinite; }
.page-loader__recovery { position: absolute; bottom: max(36px, env(safe-area-inset-bottom)); text-align: center; font-size: 12px; color: #aca69e; opacity: 0; visibility: hidden; }
.is-active .page-loader__recovery { animation: loader-recovery 0s 15s forwards; }
.page-loader__recovery a { display: block; color: #e7e0d6; text-underline-offset: 5px; margin-top: 12px; }
.loader-mark { transform: translate(20px, 32px); }
.loader-wordmark { transform: translate(20px, 32px); fill: #e7e0d6; }
.loader-top { x: 0; y: 0; width: 238.76px; height: 82.22px; fill: #e7e0d6; }
.loader-left { x: 0; y: 80px; width: 82.22px; height: 158.76px; fill: #e7e0d6; }
.loader-accent { x: 119.38px; y: 119.38px; width: 119.38px; height: 119.38px; fill: #ee4623; }
.loader-ring { x: 119.38px; y: 119.38px; width: 119.38px; height: 119.38px; fill: none; stroke: #ee4623; stroke-width: 3px; opacity: 0; }
.loader-sheen { opacity: 0; }
.loader-top, .loader-left, .loader-accent, .loader-ring, .loader-sheen { transform-box: fill-box; transform-origin: center; }
.is-active .loader-mark { animation: loader-position 2400ms cubic-bezier(.76, 0, .24, 1) both; }
/* Geometry (dot -> square -> logo block) and motion (pop, spin, squeeze, settle) run as two layers. */
.is-active .loader-top { animation: loader-top 2400ms cubic-bezier(.65, 0, .25, 1) both, loader-box-motion 2400ms cubic-bezier(.45, 0, .2, 1) both; }
.is-active .loader-left { animation: loader-left 2400ms cubic-bezier(.65, 0, .25, 1) both, loader-box-motion 2400ms cubic-bezier(.45, 0, .2, 1) 96ms both; }
.is-active .loader-accent { animation: loader-accent 2400ms cubic-bezier(.65, 0, .25, 1) both, loader-box-motion 2400ms cubic-bezier(.45, 0, .2, 1) 192ms both; }
.is-active .loader-ring { animation: loader-ring 900ms cubic-bezier(.2, .7, .2, 1) 1980ms both; }
.is-active .loader-sheen { animation: loader-sheen 2600ms cubic-bezier(.45, 0, .25, 1) 2020ms infinite both; }
.is-active .loader-wordmark { animation: loader-wordmark 2400ms cubic-bezier(.22, 1, .36, 1) both; }
.is-active .page-loader__caption, .is-active .page-loader__track { animation: loader-caption 2400ms ease both; }
@keyframes loader-position { 0%, 62% { transform: translate(440px, 32px); } 84%, 100% { transform: translate(20px, 32px); } }
@keyframes loader-top {
  0%, 5% { x: 0; y: 105px; width: 28px; height: 28px; rx: 14px; opacity: 0; }
  9%, 12% { x: 0; y: 105px; width: 28px; height: 28px; rx: 14px; opacity: 1; }
  22%, 27% { x: 0; y: 88px; width: 62px; height: 62px; rx: 0; }
  44%, 100% { x: 0; y: 0; width: 238.76px; height: 82.22px; rx: 0; opacity: 1; }
}
@keyframes loader-left {
  0%, 9% { x: 105px; y: 105px; width: 28px; height: 28px; rx: 14px; opacity: 0; }
  13%, 16% { x: 105px; y: 105px; width: 28px; height: 28px; rx: 14px; opacity: 1; }
  26%, 31% { x: 88px; y: 88px; width: 62px; height: 62px; rx: 0; }
  48%, 100% { x: 0; y: 80px; width: 82.22px; height: 158.76px; rx: 0; opacity: 1; }
}
@keyframes loader-accent {
  0%, 13% { x: 210px; y: 105px; width: 28px; height: 28px; rx: 14px; opacity: 0; }
  17%, 20% { x: 210px; y: 105px; width: 28px; height: 28px; rx: 14px; opacity: 1; }
  30%, 35% { x: 176px; y: 88px; width: 62px; height: 62px; rx: 0; }
  52%, 100% { x: 119.38px; y: 119.38px; width: 119.38px; height: 119.38px; rx: 0; opacity: 1; }
}
/* Drop in with a spring, spin a half turn while squaring up, squeeze, then overshoot into place. */
@keyframes loader-box-motion {
  0%, 5% { transform: translateY(-26px) rotate(-90deg) scale(0); }
  9% { transform: translateY(4px) rotate(-12deg) scale(1.22); }
  12% { transform: translateY(0) rotate(0) scale(1); }
  22% { transform: translateY(0) rotate(180deg) scale(1); }
  27% { transform: translateY(0) rotate(180deg) scale(.86); }
  38% { transform: translateY(0) rotate(180deg) scale(1.045); }
  44% { transform: translateY(0) rotate(180deg) scale(.992); }
  50%, 100% { transform: translateY(0) rotate(180deg) scale(1); }
}
@keyframes loader-ring {
  0% { opacity: 0; transform: scale(1); stroke-width: 4px; }
  12% { opacity: .9; }
  100% { opacity: 0; transform: scale(1.6); stroke-width: 1px; }
}
@keyframes loader-sheen {
  0% { opacity: 1; transform: translateX(0) skewX(-18deg); }
  32%, 100% { opacity: 1; transform: translateX(560px) skewX(-18deg); }
}
@keyframes loader-wordmark { 0%, 82% { opacity: 0; transform: translate(42px, 32px); filter: blur(3px); } 100% { opacity: 1; transform: translate(20px, 32px); filter: blur(0); } }
@keyframes loader-caption { 0%, 65% { opacity: 0; transform: translateY(6px); } 100% { opacity: 1; transform: translateY(0); } }
@keyframes loader-scan { 0% { transform: translateX(-26px); } 100% { transform: translateX(57px); } }
@keyframes loader-recovery { to { opacity: 1; visibility: visible; } }
@media (prefers-reduced-motion: reduce) {
  .page-loader { transition-duration: 120ms; }
  .page-loader .loader-mark, .page-loader .loader-top, .page-loader .loader-left,
  .page-loader .loader-accent, .page-loader .loader-wordmark,
  .page-loader .page-loader__caption, .page-loader .page-loader__track { animation: none; }
  .page-loader .loader-ring, .page-loader .loader-sheen { animation: none; opacity: 0; }
  .page-loader__track::after { animation: none; width: 100%; }
}
html:has(.page-loader.is-active:not([hidden])) { overflow: hidden; }
