.dots{animation:1.2s 4.5s both fade-in}.arrival{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;min-height:100svh;padding:4.5rem 1.25rem 3rem;display:flex;position:relative;overflow-x:clip}.arrival>*{z-index:2;position:relative}.arrival>.arrival__dawn{z-index:0;pointer-events:none;background:#0d1420;animation:2.4s ease-in-out 2.8s both dawn;position:fixed;inset:0}.arrival__line{letter-spacing:.02em;max-width:16ch;font-size:clamp(1.7rem,1rem + 3.6vw,3.2rem);font-weight:700;line-height:1.1;animation:1.6s .5s both line-in,2s 3.2s both line-tone}.arrival__stage{isolation:isolate;width:min(66vw,17rem,31svh)}.arrival__rays{z-index:-2;pointer-events:none;opacity:.35;background:repeating-conic-gradient(#fff9 0 6deg, transparent 6deg 18deg);width:120vmax;height:120vmax;margin:-60vmax 0 0 -60vmax;animation:3s 3s both rays-in,150s linear 3s infinite rays-spin;position:absolute;top:50%;left:50%;-webkit-mask-image:radial-gradient(circle,#000 0,#0000 50%);mask-image:radial-gradient(circle,#000 0,#0000 50%)}.arrival__glow{z-index:-1;opacity:.5;background:radial-gradient(circle,#fffffff2 0,#ffcdb48c 38%,#0000 68%);border-radius:50%;animation:3.2s ease-out 2.8s both glow-burst;position:absolute;inset:-35%}.arrival__photo{animation:1.8s cubic-bezier(.2,.9,.25,1.15) 3s both photo-in,7s ease-in-out 5s infinite float;rotate:-2deg}.arrival__photo .smart{border:.55rem solid #fff5f8;border-radius:4px;max-width:none;box-shadow:0 0 60px #ffbeaacc,0 1.2rem 2.5rem #2a1a2e40}.arrival__photo .smart__ph{color:#b98aa3;gap:.75rem}.arrival__photo .smart__ph svg{width:50%;height:auto;margin:0 auto}.arrival__name{letter-spacing:.04em;color:var(--accent);margin:0;font-size:clamp(3.4rem,1.5rem + 11vw,8rem);font-weight:800;line-height:1}.arrival__name span[aria-hidden]{animation:letter-in .9s cubic-bezier(.2, .9, .25, 1.3) calc(4.6s + var(--i) * .12s) both;display:inline-block}.rain{animation:1.4s 2.4s both rain-out}.vitals{max-width:34rem;margin:0 auto;padding:3rem 1.25rem 2rem;position:relative}.vitals .collectible{position:absolute;top:.75rem;right:.75rem}.vitals h2{margin-bottom:1.75rem}.stats-list{gap:1.6rem;margin:0;padding:0;list-style:none;display:grid}.stat__top{justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.4rem;display:flex}.stat__label{color:var(--muted);flex:1}.stat__value{white-space:nowrap;font-family:var(--font-display);font-weight:700;font-size:var(--step-1);font-variant-numeric:tabular-nums}.stat__track{background:var(--bg-2);border-radius:999px;height:.8rem;overflow:hidden}.stat__fill{border-radius:inherit;background:var(--accent);transform-origin:0;height:100%;transform:scaleX(var(--pct));transition:transform 1.4s cubic-bezier(.2, .8, .2, 1) calc(var(--i) * .25s + .2s)}.stat--infinite .stat__fill{background:linear-gradient(90deg, var(--accent) 50%, #d95d92 50%) 0 0 / 2.4rem 100%;animation:1.1s linear infinite march}.stat--alarm .stat__fill{background:repeating-linear-gradient(-45deg,#2a1a2e 0 .7rem,#f2c14e .7rem 1.4rem)}.stat--alarm .stat__value{color:#b3261e}.js .stat{transition:opacity .6s ease calc(var(--i) * .25s), translate .6s ease calc(var(--i) * .25s)}.js .stat:not(.is-in){opacity:0;translate:-1rem}.js .stat:not(.is-in) .stat__fill{transform:scaleX(0)}.stat--infinite.is-in .stat__value{animation:pop 1.1s ease calc(var(--i) * .25s + .8s) both;display:inline-block}.stat--alarm.is-in .stat__value{animation:blink .5s steps(2) calc(var(--i) * .25s + 1.6s) 6}.stat--alarm.is-in .stat__track{animation:shake .4s ease calc(var(--i) * .25s + 1.6s) 3}@media (prefers-reduced-motion:reduce){.arrival__dawn,.arrival__rays{display:none}}@keyframes fade-in{0%{opacity:0}}@keyframes dawn{0%{opacity:1}to{opacity:0}}@keyframes rain-out{to{opacity:0}}@keyframes line-in{0%{opacity:0;transform:scale(.94)}}@keyframes line-tone{0%{color:#fff5f8}}@keyframes rays-in{0%{opacity:0}}@keyframes rays-spin{to{rotate:360deg}}@keyframes glow-burst{0%{opacity:0;transform:scale(.2)}40%{opacity:1}to{opacity:.5;transform:scale(1.25)}}@keyframes photo-in{0%{opacity:0;filter:blur(14px)brightness(2);transform:scale(.55)rotate(-8deg)}}@keyframes float{50%{translate:0 -8px}}@keyframes letter-in{0%{opacity:0;transform:translateY(2.5rem) scale(.5) rotate(calc(var(--i) * 6deg - 12deg))}}@keyframes pop{40%{transform:scale(1.8)rotate(200deg)}to{transform:rotate(360deg)}}@keyframes shake{25%{translate:-4px}75%{translate:4px}}@keyframes blink{50%{opacity:.25}}@keyframes march{to{background-position-x:2.4rem}}
