.entry-intro{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:24px;border:0;background:#080911;color:#f4f3ef;overflow:hidden;isolation:isolate;text-align:center;font-family:var(--display),sans-serif}
.entry-intro[open]{display:grid;place-items:center;animation:entry-exit .5s 5.9s both}
.entry-intro::backdrop{background:#080911}
.entry-atmosphere{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:-1}
.entry-nebula{position:absolute;inset:-30%;background:radial-gradient(ellipse at 32% 45%,#623baf75,transparent 32%),radial-gradient(ellipse at 70% 62%,#126a7455,transparent 28%),radial-gradient(ellipse at 48% 65%,#7ea22c20,transparent 32%);animation:nebula-drift 6.4s ease-out both}
.entry-floor{position:absolute;inset:45% -60% -65%;background:linear-gradient(#af8bfa30 1px,transparent 1px),linear-gradient(90deg,#af8bfa30 1px,transparent 1px);background-size:70px 70px;transform:perspective(450px) rotateX(65deg);mask-image:linear-gradient(transparent,#0008 30%,#000);animation:floor-stream 6.4s linear both}
.entry-particles{position:absolute;inset:0;width:100%;height:100%;opacity:.85}
.entry-shockwave{position:absolute;top:50%;left:50%;width:160px;aspect-ratio:1;border:1px solid #c2f970aa;border-radius:50%;box-shadow:0 0 40px #c2f97020;animation:shockwave 1.4s 1.65s both}
.entry-logo-stage{position:absolute;inset:0;display:grid;place-items:center;animation:logo-depart .4s 2.95s both}
.entry-emblem{display:block;width:clamp(220px,34vw,350px);height:auto;overflow:visible;background:transparent;filter:drop-shadow(0 0 16px #af8bfa55)}
.emblem-ring{transform-box:fill-box;transform-origin:center;stroke-dasharray:1;animation:ring-assemble 1.1s cubic-bezier(.16,1,.3,1) both,ring-energize 1s 1.45s both}
.ring-0{--rx:0px;--ry:-190px;animation-delay:0s,1.45s}.ring-1{--rx:-220px;--ry:70px;animation-delay:.14s,1.45s}.ring-2{--rx:220px;--ry:70px;animation-delay:.28s,1.45s}.ring-3{--rx:0px;--ry:200px;animation-delay:.42s,1.45s}
.emblem-word{transform-box:fill-box;transform-origin:center;animation:word-lock .75s cubic-bezier(.16,1,.3,1) both}.word-one{--wx:-90px;animation-delay:1s}.word-two{--wx:90px;animation-delay:1.25s}
.entry-reticle{position:absolute;width:clamp(300px,47vw,480px);aspect-ratio:1;border-radius:50%;border:1px dashed #af8bfa40;animation:reticle-orbit 3.35s ease-out both}
.entry-reticle:before,.entry-reticle:after{content:'';position:absolute;inset:20px;border:1px solid transparent;border-top-color:#c2f970a0;border-bottom-color:#c2f970a0;border-radius:50%;transform:rotate(35deg)}.entry-reticle:after{inset:-20px;border-top-color:#ad8bfa70;border-bottom-color:transparent;transform:rotate(-45deg)}
.entry-message{position:relative;width:min(100%,900px);opacity:0;animation:message-arrive .55s 3.45s both}
.entry-message p{font-size:clamp(31px,5.8vw,76px);line-height:1.14;font-weight:600;letter-spacing:-.04em;margin:0;color:#f4f3ef}
.entry-message strong{display:block;color:#c2f970;margin-block-start:18px;font-weight:600;font-size:.8em;animation:message-repair .65s 4.05s both;text-shadow:0 0 35px #c2f97018}
html[dir=rtl] .entry-message p{letter-spacing:0;line-height:1.45}
.entry-skip{position:absolute;inset-block-end:max(28px,env(safe-area-inset-bottom));inset-inline-end:max(24px,env(safe-area-inset-right));padding:12px 18px;background:#1c1c2580;border:1px solid #88868f;border-radius:6px;color:#f4f3ef;font:500 13px var(--font),sans-serif;min-height:44px;backdrop-filter:blur(10px)}
.entry-skip:hover{border-color:#c2f970;color:#c2f970}.entry-skip:focus-visible{outline:2px solid #c2f970;outline-offset:5px}
.entry-progress{position:absolute;inset-inline:0;inset-block-end:0;height:3px;background:#ffffff0d}.entry-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#af8bfa,#c2f970);transform-origin:left;animation:entry-progress 6.4s linear both}
html.entry-playing{overflow:hidden}
@keyframes ring-assemble{from{opacity:0;stroke-dashoffset:1;transform:translate(var(--rx),var(--ry)) scale(.5) rotate(-120deg)}to{opacity:1;stroke-dashoffset:0;transform:none}}
@keyframes ring-energize{0%,100%{stroke:white}45%{stroke:#c2f970}}
@keyframes word-lock{from{opacity:0;transform:translateX(var(--wx)) scaleX(1.13);clip-path:inset(0 100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes logo-depart{to{opacity:0;visibility:hidden;transform:scale(1.12);filter:blur(8px)}}
@keyframes reticle-orbit{from{opacity:0;transform:rotate(-90deg) scale(.8)}25%{opacity:1}to{opacity:.5;transform:rotate(60deg) scale(1)}}
@keyframes shockwave{from{opacity:0;transform:translate(-50%,-50%) scale(.2)}15%{opacity:.65}to{opacity:0;transform:translate(-50%,-50%) scale(7)}}
@keyframes nebula-drift{from{transform:rotate(-12deg) scale(1.15);opacity:.3}35%{opacity:1}to{transform:rotate(10deg) scale(1);opacity:.65}}
@keyframes floor-stream{from{background-position:0 0;opacity:0}25%{opacity:.65}to{background-position:0 220px;opacity:.3}}
@keyframes message-arrive{from{opacity:0;transform:translateY(12px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes message-repair{from{opacity:0;transform:translateY(14px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes entry-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes entry-exit{to{opacity:0;visibility:hidden}}
@media(max-width:600px){.entry-floor{background-size:45px 45px}.entry-reticle{width:300px}}
@media(prefers-reduced-motion:reduce){.entry-intro,.entry-intro *{animation:none!important}.entry-message{opacity:1}.entry-logo-stage,.entry-atmosphere{display:none}}
