/* A brief decorative arrival. The page never waits for this layer. */
@property --arrival-aperture { syntax: '<length>'; inherits: false; initial-value: 0px; }
.luminous-arrival { display:none; position:fixed; inset:0; z-index:12000; pointer-events:none; overflow:hidden; color:#076b68; font-family:Jost,system-ui,sans-serif; }
html[data-arrival="pending"] .luminous-arrival,
html[data-arrival="leaving"] .luminous-arrival { display:grid; place-items:center; animation:arrival-rescue .01s 2.4s forwards; }
.arrival-veil { position:absolute; inset:0; background:radial-gradient(ellipse at 75% 35%,#d1f2ea 0,transparent 58%),radial-gradient(ellipse at 25% 70%,#fff5e8 0,transparent 55%),#f5f3ee; mask-image:radial-gradient(circle at 50% 46%,transparent var(--arrival-aperture),#000 calc(var(--arrival-aperture) + 80px)); }
.arrival-world { position:absolute; inset:-4%; background:url('/luminous/scenes/local-harbor-768.webp') center 64%/cover; opacity:.15; mask-image:linear-gradient(transparent 20%,#000 100%); }
.arrival-center { position:relative; display:flex; flex-direction:column; align-items:center; transform:translateY(-3vh); }
.arrival-portal { position:relative; width:clamp(205px,24vw,280px); aspect-ratio:1; isolation:isolate; }
.arrival-emblem { display:block; width:100%; height:100%; border-radius:50%; object-fit:cover; box-shadow:0 20px 60px #0b686d25; }
.arrival-orbit { position:absolute; inset:-20%; border:1px solid #188c8855; border-radius:50%; z-index:-1; }
.arrival-orbit--one { transform:rotate(-28deg) scaleY(.54); }
.arrival-orbit--two { inset:-30%; transform:rotate(42deg) scaleY(.71); border-color:#188c8826; }
.arrival-corona { position:absolute; inset:-7px; border-radius:50%; background:conic-gradient(from 30deg,transparent 0 12%,#e8fff5 16%,#42d5ce 19%,transparent 27% 58%,#e8fff5 62%,#0d8a87 66%,transparent 75%); mask-image:radial-gradient(transparent 65%,#000 68% 70%,transparent 73%); animation:arrival-orbit 2.1s linear infinite; }
.arrival-spark { position:absolute; inset:-21%; border-radius:50%; transform:rotate(-35deg); animation:arrival-orbit 3s linear infinite; }
.arrival-spark::after { content:''; position:absolute; left:50%; top:7%; width:5px; height:5px; border-radius:50%; background:#0d8a87; box-shadow:0 0 14px #0fdbd5; }
.arrival-message { margin:52px 0 16px; font-size:clamp(17px,2vw,20px); font-weight:450; letter-spacing:.035em; }
.arrival-signal { display:flex; align-items:center; gap:5px; height:12px; }
.arrival-signal i { width:2px; height:4px; background:#0d8a87; opacity:.45; animation:arrival-signal 1s ease-in-out infinite alternate; }
.arrival-signal i:nth-child(3n) { height:10px; animation-delay:-.35s; }
.arrival-signal i:nth-child(3n + 1) { height:7px; animation-delay:-.65s; }
html[data-arrival="leaving"] .arrival-veil { animation:arrival-open .68s cubic-bezier(.16,1,.3,1) forwards; }
html[data-arrival="leaving"] .arrival-world { animation:arrival-world-exit .55s ease-out forwards; }
html[data-arrival="leaving"] .arrival-center { animation:arrival-flight .55s cubic-bezier(.16,1,.3,1) forwards; }
@keyframes arrival-orbit { to { transform:rotate(325deg); } }
@keyframes arrival-signal { to { transform:scaleY(.4); opacity:1; } }
@keyframes arrival-open { to { --arrival-aperture:140vmax; } }
@keyframes arrival-flight { to { transform:translateY(-3vh) scale(1.22); opacity:0; filter:blur(7px); } }
@keyframes arrival-world-exit { to { opacity:0; transform:scale(1.06); } }
@keyframes arrival-rescue { to { visibility:hidden; opacity:0; } }
@media (max-width:600px) { .arrival-center { transform:translateY(-4vh); } .arrival-world { opacity:.1; } }
@media (prefers-reduced-motion:reduce) { html[data-arrival] .luminous-arrival { display:none; } }
@media (prefers-reduced-transparency:reduce) { .arrival-world { display:none; } }
@media print { html[data-arrival] .luminous-arrival { display:none; } }