/* The original silver 369 and cyan/violet orbit, finished with clear glass. */
.wordmark > span {
  color: #e8efff;
  text-shadow: 0 1px 0 #ffffff40, 0 0 18px #67dfff30;
}
[data-theme=light] .wordmark > span { color: #294a85; text-shadow: none; }
.wordmark img { border-radius: 22%; object-fit: contain; }
.brand-launch { overflow: hidden; border-radius: 26px; }
.brand-art, [data-theme=light] .brand-art {
  border-radius: 26px;
  margin: 0;
  mix-blend-mode: normal;
  box-shadow: 0 14px 36px #0012394d;
}
.brand-launch::before, .intro-emblem::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border: 1px solid #d7efff52;
  border-top-color: #f0f7ff8c;
  border-radius: inherit;
  background: linear-gradient(145deg, #eff8ff12, transparent 32%, transparent 70%, #81dfff08);
  box-shadow: inset 0 1px 1px #ffffff4d, inset 0 -1px 1px #91a3ff33;
}
.brand-launch::after, .intro-emblem::after {
  content: "";
  position: absolute;
  inset: -50%;
  z-index: 4;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 39%, #eaf8ff04 44%, #eefaff21 49%, #ffffff08 53%, transparent 59%);
  transform: translateX(-65%);
}
.brand-launch::after { transition: transform 1s ease; }
.brand-launch:focus-visible::after { transform: translateX(65%); }
.brand-launch:focus-visible { outline-offset: 5px; }
.brand-play {
  position: absolute;
  z-index: 5;
  color: #d9f5ff;
  background: linear-gradient(145deg, #f0f8ff24, transparent 70%), #102349cc;
  border-color: #9adfff70;
}
.brand-visual .brand-caption { margin-top: 17px; }
.brand-visual .brand-caption::before, .brand-visual .brand-caption::after { background: #8fceff; }
.intro-stage { isolation: isolate; }
.intro-emblem {
  position: relative;
  z-index: 2;
  display: block;
  width: 72%;
  max-width: 370px;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 28px;
  background: #03071c;
  box-shadow: 0 15px 55px #00071f66, 0 0 38px #6288ff20;
  animation: intro-mark 6.4s cubic-bezier(.22,.65,.25,1) both;
}
.intro-emblem .intro-mark {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  animation: none;
  will-change: auto;
  mask-image: none;
  -webkit-mask-image: none;
  mix-blend-mode: normal;
}
.intro-emblem::after { animation: original-glass-sweep 6.4s ease both; }
.intro-orbit { border-top-color: #67dfff; border-bottom-color: #a596ff; }
.intro-orbit-two { border-color: #a596ff; border-left-color: transparent; }
.intro-wordmark { color: #eef5ff; text-shadow: 0 0 28px #67dfff35; }
.intro-progress span { background: linear-gradient(90deg, #67dfff, #a596ff); }
.brand-intro .intro-close { position: absolute; color: #eef5ff; background-color: #10203adb; }
@keyframes original-glass-sweep {
  0%, 34% { transform: translateX(-65%); opacity: 0; }
  44% { opacity: 1; }
  82%, 100% { transform: translateX(65%); opacity: 0; }
}
@media (hover: hover) and (pointer: fine) {
  .brand-launch:hover::after { transform: translateX(65%); }
}
@media (max-width: 540px) {
  .brand-launch, .brand-art, [data-theme=light] .brand-art { border-radius: 18px; }
  .intro-emblem { width: 88%; border-radius: 24px; }
  .brand-visual .brand-caption { margin-top: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .intro-emblem, .intro-emblem::after { animation: none; }
  .brand-launch::after { transition: none; display: none; }
  .intro-emblem::after { display: none; }
  .intro-orbit, .intro-halo, .intro-atmosphere, .intro-wordmark, .intro-caption { animation: none; }
}