/* NEXAR UX 5.0 Stage 02 — CSS-only narrative on the decorative auth side.
   Sign-in form never waits for the animation; skip is available at t=0. */
.nx5-auth .auth-scene{position:relative;isolation:isolate;background:
 radial-gradient(ellipse 68% 40% at 55% 27%,#2C5E9A7A,transparent 72%),
 radial-gradient(ellipse 48% 42% at 5% 90%,#543B9652,transparent 95%),
 linear-gradient(135deg,#071329 5%,#0D2447 56%,#172958 100%)}
.nx5-auth .auth-scene:after{display:none}
.nx5-auth .nx4-auth-art{opacity:.68}
.nx5-auth .nx4-auth-art-ring{border-color:#87C7F026;box-shadow:0 0 0 76px #FFFFFF04,0 0 0 156px #FFFFFF02}
.nx5-cinema{position:absolute;z-index:6;inset:0;display:grid;place-items:center;overflow:hidden;
 pointer-events:none;isolation:isolate;background:radial-gradient(ellipse at 50% 44%,#234F9175,transparent 57%),linear-gradient(145deg,#071329,#10234A 73%,#111E3A);
 animation:nx5-cinema-exit .58s cubic-bezier(.25,.82,.25,1) 2.42s forwards}
.nx5-cinema:before{content:"";position:absolute;inset:-24%;opacity:.45;transform:rotate(-14deg);
 background-image:linear-gradient(#ABCCF012 1px,transparent 1px),linear-gradient(90deg,#ABCCF012 1px,transparent 1px);
 background-size:58px 58px;animation:nx5-cinema-grid 2.8s cubic-bezier(.22,.72,.22,1) both}
.nx5-cinema:after{content:"";position:absolute;inset:0;opacity:0;background:linear-gradient(115deg,transparent 30%,#DEF5FF17 51%,transparent 67%);animation:nx5-cinema-sweep .62s ease-out 1.58s both}
.nx5-cinema-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;direction:ltr}
.nx5-cinema-geometry{width:clamp(156px,24vw,300px);height:clamp(156px,24vw,300px);overflow:visible;filter:drop-shadow(0 8px 27px #66A7E03E)}
.nx5-cinema-geometry .nx5-draw{fill:none;stroke-width:13;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:145;stroke-dashoffset:145;animation:nx5-stroke .82s cubic-bezier(.32,.02,.43,.99) both}
.nx5-cinema-geometry .nx5-draw-left{animation-delay:.22s}
.nx5-cinema-geometry .nx5-draw-bridge{stroke-dasharray:170;stroke-dashoffset:170;animation-delay:.59s}
.nx5-cinema-geometry .nx5-draw-right{animation-delay:.91s}
.nx5-cinema-geometry .nx5-mark-glow{opacity:0;animation:nx5-mark-glow .65s ease-out 1.27s both}
.nx5-cinema-word{font-family:Arial,Helvetica,sans-serif;font-size:clamp(31px,4.1vw,52px);font-weight:850;letter-spacing:.23em;margin-inline-end:-.23em;line-height:1.3;color:#F2F9FF;opacity:0;transform:translateY(8px);animation:nx5-word-in .58s cubic-bezier(.25,.82,.25,1) 1.23s both}
.nx5-cinema-tagline{font-family:Arial,Helvetica,sans-serif;font-size:clamp(8px,.85vw,12px);letter-spacing:.26em;color:#B1CCE7;opacity:0;animation:nx5-word-in .46s ease-out 1.55s both}
.nx5-cinema-skip{position:absolute;z-index:8;top:clamp(23px,3.5vw,52px);left:clamp(22px,4vw,66px);
 min-height:42px;padding:9px 13px;border:1px solid #B8D5F348;border-radius:9px;color:#F2F9FF;background:#FFFFFF14;
 backdrop-filter:none;font:800 12px Cairo,sans-serif;cursor:pointer;
 animation:nx5-skip-exit .3s ease 2.5s forwards}
.nx5-cinema-skip:hover{background:#FFFFFF26;border-color:#C3E8FF94}
.nx5-cinema-skip:focus-visible{outline:3px solid #8BE9FF;outline-offset:3px}
.nx5-intro-playing .scene-copy{animation:nx5-content-entrance .6s cubic-bezier(.22,.72,.22,1) 2.5s both!important}
.nx5-intro-playing .auth-scene>.brand{animation:nx5-content-entrance .46s cubic-bezier(.22,.72,.22,1) 2.4s both}
.nx5-intro-playing .scene-footer{animation:nx5-content-entrance .5s cubic-bezier(.22,.72,.22,1) 2.65s both}
.nx5-intro-skipped .nx5-cinema,.nx5-intro-skipped .nx5-cinema-skip{display:none!important}
.nx5-intro-skipped .scene-copy,.nx5-intro-skipped .auth-scene>.brand,.nx5-intro-skipped .scene-footer{animation:none!important}
@keyframes nx5-cinema-grid{from{opacity:0;transform:translate3d(8%,-5%,0) rotate(-14deg)}to{opacity:.45;transform:translate3d(0,0,0) rotate(-14deg)}}
@keyframes nx5-stroke{to{stroke-dashoffset:0}}
@keyframes nx5-mark-glow{0%{opacity:0}50%{opacity:.6}100%{opacity:.19}}
@keyframes nx5-word-in{to{opacity:1;transform:translateY(0)}}
@keyframes nx5-content-entrance{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes nx5-cinema-sweep{35%{opacity:.65}100%{opacity:0}}
@keyframes nx5-cinema-exit{0%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@keyframes nx5-skip-exit{to{opacity:0;visibility:hidden;pointer-events:none}}
@media(max-width:840px){
 .nx5-cinema-geometry{width:115px;height:115px}
 .nx5-cinema-word{font-size:25px}
 .nx5-cinema-tagline{font-size:7px}
 .nx5-cinema-content{gap:2px}
 .nx5-cinema-skip{top:17px;left:17px;font-size:11px;min-height:40px}
}
@media(max-width:620px){
 .nx5-cinema-geometry{width:85px;height:85px}
 .nx5-cinema-word{font-size:21px}
 .nx5-cinema-tagline{font-size:6px;letter-spacing:.17em}
 .nx5-cinema-content{gap:0}
 .nx5-cinema-skip{top:10px;left:12px;min-height:40px}
 .nx5-intro-playing .scene-copy{animation-duration:.3s}
}
@media(prefers-reduced-motion:reduce){
 .nx5-cinema,.nx5-cinema-skip{display:none!important;animation:none!important}
 .nx5-intro-playing .scene-copy,.nx5-intro-playing .auth-scene>.brand,.nx5-intro-playing .scene-footer{animation:none!important}
}