.radix-welcome {
  display: grid;
}

.radix-welcome[hidden] {
  display: none;
}

.radix-welcome:not([hidden]) {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #101311;
  outline: none;
  opacity: 1;
  transition: opacity 300ms cubic-bezier(.4, 0, .2, 1);
}

.radix-welcome[data-leaving="true"] {
  opacity: 0;
}

.radix-welcome-identity {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  transition: opacity 200ms ease, transform 280ms cubic-bezier(.4, 0, .2, 1);
}

.radix-welcome[data-leaving="true"] .radix-welcome-identity {
  opacity: 0;
  transform: translateY(-6px) scale(.97);
}

.radix-welcome-mark {
  display: block;
  width: 76px;
  height: 76px;
  overflow: visible;
}

.radix-welcome-name {
  color: #f0f2ee;
  font-family: 'Geist Variable', Geist, system-ui, -apple-system, sans-serif;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.025em;
}

.radix-welcome-piece {
  transform: translate(var(--welcome-x), var(--welcome-y)) rotate(var(--welcome-turn));
}

.radix-welcome-piece-top {
  --welcome-x: -3px;
  --welcome-y: -5px;
  --welcome-turn: -4deg;
  --welcome-delay: 0ms;
  transform-origin: 52px 57px;
}

.radix-welcome-piece-left {
  --welcome-x: -4px;
  --welcome-y: 3px;
  --welcome-turn: 0deg;
  --welcome-delay: 40ms;
}

.radix-welcome-piece-right {
  --welcome-x: 6px;
  --welcome-y: 3px;
  --welcome-turn: 8deg;
  --welcome-delay: 90ms;
  transform-origin: 52px 57px;
}

.radix-welcome[role="dialog"] .radix-welcome-piece {
  animation: radix-welcome-align 420ms cubic-bezier(.22, 1, .36, 1) both;
  animation-delay: var(--welcome-delay, 0ms);
}

@keyframes radix-welcome-align {
  from { transform: translate(var(--welcome-x), var(--welcome-y)) rotate(var(--welcome-turn)); }
  to { transform: translate(0, 0) rotate(0); }
}

@media (max-width: 640px) {
  .radix-welcome-mark { width: 64px; height: 64px; }
  .radix-welcome-identity { gap: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .radix-welcome:not([hidden]), .radix-welcome-identity { transition: none; }
  .radix-welcome-piece { transform: translate(var(--welcome-x), var(--welcome-y)) rotate(var(--welcome-turn)); }
  .radix-welcome[role="dialog"] .radix-welcome-piece { animation: none; }
}