/* XREM Next: seconda direzione, più radicale e senza banda cromatica. */
.story-top{z-index:5}
.brand-plate{padding:11px 52px 11px 14px;background:var(--paper);clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,0 100%);box-shadow:16px 16px 0 var(--cyan)}
.brand-plate img{width:205px}
.brand-plate .next-tag{position:absolute;right:-18px;bottom:-15px;padding:8px 12px 7px}
.auth-logo{width:max-content;margin:0 0 48px;filter:none}
.auth-logo img{width:225px}
.auth-logo .next-tag{position:static;flex:0 0 auto;margin-left:5px;padding:8px 12px 7px}
.next-monument{position:absolute;right:-12px;top:122px;bottom:86px;z-index:1;display:flex;flex-direction:column;justify-content:center;color:transparent;font-size:clamp(92px,9vw,150px);font-weight:900;line-height:.67;letter-spacing:-.09em;-webkit-text-stroke:1px rgba(255,255,255,.075);transform:skewY(-7deg);pointer-events:none}
.next-monument span:nth-child(3){-webkit-text-stroke-color:rgba(237,0,140,.28)}
.signal{width:420px;height:420px;right:-180px;top:58%;transform:translateY(-50%) rotate(-12deg);opacity:.72;z-index:2}
.node{will-change:transform,opacity;animation-duration:7s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}
.node.cyan{animation-name:node-cyan}
.node.lime{animation-name:node-lime;animation-duration:8.5s;animation-delay:-2s}
.node.orange{animation-name:node-orange;animation-duration:9.5s;animation-delay:-5s}
.node.magenta{animation-name:node-magenta;animation-duration:6.5s;animation-delay:-3s}
@keyframes node-cyan{0%{transform:translate(-12px,-18px) scale(.72);opacity:.4}45%{transform:translate(24px,5px) scale(1.18);opacity:1}100%{transform:translate(4px,34px) scale(.86);opacity:.62}}
@keyframes node-lime{0%{transform:translate(-25px,16px) rotate(0) scale(.8);opacity:.55}55%{transform:translate(18px,36px) rotate(45deg) scale(1.25);opacity:1}100%{transform:translate(38px,-8px) rotate(90deg) scale(.68);opacity:.42}}
@keyframes node-orange{0%{transform:translate(14px,-28px) scale(.65);opacity:.38}50%{transform:translate(-36px,4px) scale(1.12);opacity:.95}100%{transform:translate(-8px,30px) scale(.84);opacity:.58}}
@keyframes node-magenta{0%{transform:translate(-28px,8px) rotate(0) scale(.78);opacity:.45}48%{transform:translate(8px,-38px) rotate(45deg) scale(1.3);opacity:1}100%{transform:translate(34px,-5px) rotate(90deg) scale(.72);opacity:.5}}
.auth-panel{overflow:hidden}
.auth-panel:before{width:36px;height:190px;left:0;top:0;background:var(--magenta);clip-path:polygon(0 0,100% 0,0 100%)}
.auth-panel:after{content:"NEXT";position:absolute;right:-26px;bottom:-34px;color:rgba(23,19,21,.035);font-size:170px;font-weight:900;letter-spacing:-.1em;line-height:1;pointer-events:none}
.form-wrap{z-index:1}
.primary{min-height:59px;color:var(--ink);background:var(--lime);transition:transform .2s,box-shadow .2s}
.primary:hover{background:var(--lime);transform:translate(-3px,-3px);box-shadow:7px 7px 0 var(--ink)}
@media(max-width:980px){.next-monument{right:12px;top:90px;bottom:auto;font-size:105px}.signal{right:-210px}}
@media(max-width:560px){.auth-story{min-height:330px}.auth-logo{margin-bottom:40px}.auth-logo img{width:185px}.auth-logo .next-tag{margin-left:0}.brand-plate{padding:8px 38px 8px 10px;box-shadow:9px 9px 0 var(--cyan)}.brand-plate img{width:155px}.brand-plate .next-tag{right:6px;bottom:-12px}.next-monument{display:none}.auth-panel:after{font-size:105px}}
@media(prefers-reduced-motion:reduce){.node,.orbit.two{animation:none!important}}