/* The opening screen uses the same mark, ink and accent as the workspace. */
.startup-splash {
  position:fixed;inset:0;z-index:200;background:#fafafb;
  display:grid;place-items:center;padding:28px;
  opacity:1;transition:opacity 240ms ease;
}
.startup-identity {display:flex;flex-direction:column;align-items:center;text-align:center;transform:translateY(-14px)}
.startup-logo.logo-mark {
  width:68px;height:68px;border-radius:19px;font-size:56px;
  letter-spacing:-4px;box-shadow:0 9px 24px #2021270a,inset 0 1px 0 #ffffff12;
  animation:startup-mark-in 480ms cubic-bezier(.22,.8,.22,1) both;
}
.startup-logo.logo-mark>span {font-size:17px;right:11px;top:10px}
.startup-name {
  font-size:23px;line-height:1.4;font-weight:650;letter-spacing:-.7px;
  margin-top:21px;animation:startup-word-in 440ms 90ms ease both;
}
.startup-track {width:88px;height:3px;background:#e5e9e7;border-radius:3px;overflow:hidden;margin-top:27px}
.startup-track>span {
  display:block;width:38%;height:100%;background:var(--accent,#166761);border-radius:3px;
  animation:startup-glide 1250ms cubic-bezier(.45,0,.35,1) infinite;
}
.startup-status {font-size:12px;line-height:1.7;color:var(--muted,#696c76);margin:13px 0 0;letter-spacing:.03em}
.startup-splash.is-ready .startup-track>span {animation:none;width:100%;transform:none}
.startup-splash.is-leaving {opacity:0}
.startup-splash.is-failed .startup-track {display:none}
.startup-splash.is-failed #startup-retry {margin-top:19px}
@keyframes startup-mark-in {from{opacity:0;transform:translateY(9px) scale(.94)}to{opacity:1;transform:none}}
@keyframes startup-word-in {from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes startup-glide {0%{transform:translateX(-110%)}100%{transform:translateX(365%)}}
@media(prefers-reduced-motion:reduce) {
  .startup-splash,.startup-splash * {animation:none!important;transition:none!important}
  .startup-track>span {transform:none;width:40%}
}
