/* 222VPN Motion — progressive enhancement; no content depends on animation. */
:root{--motion-mint:#7ce0cb;--motion-blue:#639aff;--motion-ease:cubic-bezier(.22,1,.36,1)}
body{background-image:radial-gradient(ellipse at 8% 0%,#35ccb00b,transparent 45%),radial-gradient(ellipse at 95% 20%,#367ce90b,transparent 50%);background-attachment:fixed}
.vpn-header,.masthead{border-bottom-color:#7ce0cb20!important}
.vpn-header,.masthead,.desk-heading{position:relative}
.vpn-header:after,.masthead:after{content:"";position:absolute;bottom:-1px;left:0;width:35%;height:1px;background:linear-gradient(90deg,transparent,#7ce0cb80,transparent);pointer-events:none;animation:motion-line 9s ease-in-out 2}
.site-shell,.wrap{--motion-card:#132339}
.site-button,.game-link,.btn,.promo-open-btn,#support-contact,#support-existing,#support-new,.shift-controls button{transition:box-shadow .25s,border-color .25s,background-color .25s,transform .3s var(--motion-ease)!important}
.site-button:focus-visible,.game-link:focus-visible,.btn:focus-visible{outline:2px solid #91eddb;outline-offset:4px}
.vpn-header nav a,.hero-nav a,.sidebar nav a,.sidebar nav button{transition:color .2s,background-color .25s,border-color .25s!important}
.vpn-header nav a:hover,.hero-nav a:hover{color:#b2ffeb}
.motion-surface{position:relative;isolation:isolate;transition:border-color .35s,box-shadow .35s!important}
.motion-surface:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;background:radial-gradient(360px circle at var(--mx,50%) var(--my,0%),#80e9d415,transparent 75%);opacity:0;transition:opacity .4s}
.motion-surface:hover:after,.motion-surface:focus-within:after{opacity:1}
.motion-surface:focus-within{border-color:#78dcc756!important}
.game-card,.price-card,.account-panel,.quality-card,.glass,.metric,.panel{box-shadow:0 12px 36px #00000016}
.hero-copy h1,.auth-aside h1,.games-heading h1,.daily h1{letter-spacing:-.045em;text-wrap:balance}
.hero-copy h1 em,.hero-copy h1 span,.auth-aside h1 span{background:linear-gradient(110deg,#7ce0cb 15%,#c5fff1 45%,#79baff 70%,#7ce0cb 95%);background-size:220% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:motion-tint 8s ease-in-out 2}
.hero-visual{background:radial-gradient(ellipse,#286e7750,transparent 68%)}
.floating-device{animation:motion-float 6s ease-in-out 3;will-change:auto}.laptop-device{animation-delay:-2s}.tv-device{animation-delay:-4s}
.connection-lock{animation:motion-halo 5s ease-in-out 3}.visual-orbit{border-color:#91d7e223}
.game-art span{animation:motion-float 5s ease-in-out 2}.game-art span:nth-child(2){animation-delay:-1.5s}.game-art span:nth-child(3){animation-delay:-3s}
.games-wallet img{filter:drop-shadow(0 0 9px #2fbdff55)}
#support-window{box-shadow:0 24px 90px #0008,0 0 0 1px #7ce0cb0a}
#support-window:not([hidden]){animation:motion-chat .25s var(--motion-ease)}
#support-toggle{transition:box-shadow .25s,transform .25s!important}#support-toggle:hover{box-shadow:0 9px 32px #43d2b12b}
#support-unread:not([hidden]){animation:motion-badge .35s var(--motion-ease)}
.site-footer{border-top-color:#7ce0cb18}
@media(hover:hover) and (pointer:fine){.motion-surface:hover{border-color:#70cfc64a!important;box-shadow:0 18px 44px #0003,0 0 0 1px #7ce0cb09}.site-button:hover,.game-link:hover,.btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #35bfa31b}.site-button:active,.game-link:active,.btn:active{transform:translateY(0) scale(.98)}}
@keyframes motion-line{0%,100%{translate:0 0;opacity:.3}50%{translate:180% 0;opacity:1}}
@keyframes motion-float{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes motion-halo{0%,100%{box-shadow:0 20px 60px #0003,0 0 40px #71d5c610}50%{box-shadow:0 20px 60px #0003,0 0 75px #71d5c62b}}
@keyframes motion-tint{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes motion-chat{from{opacity:.3;translate:0 8px}to{opacity:1;translate:0 0}}
@keyframes motion-badge{from{scale:.6}to{scale:1}}
html.motion-paused .floating-device,html.motion-paused .game-art span,html.motion-paused .connection-lock,html.motion-paused .vpn-header:after,html.motion-paused .masthead:after{animation-play-state:paused}
@media(max-width:600px){body{background-attachment:scroll}.floating-device{animation-iteration-count:1}.motion-surface:after{display:none}}
@media(prefers-reduced-motion:reduce){.vpn-header:after,.masthead:after,.floating-device,.connection-lock,.game-art span,.hero-copy h1 em,.hero-copy h1 span,.auth-aside h1 span,#support-window:not([hidden]),#support-unread:not([hidden]){animation:none!important}.motion-surface,.motion-surface:after,.site-button,.game-link,.btn,#support-toggle{transition:none!important}.site-button:hover,.game-link:hover,.btn:hover{transform:none}}

/* Aurora layers move with scroll on every page, behind all content. */
html{background:#080f1b}body{isolation:isolate;background-color:transparent!important;background-image:none!important}
#motion-aurora{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#080f1b}
#motion-aurora:after{content:"";position:absolute;inset:0;background-image:linear-gradient(#8ddfd205 1px,transparent 1px),linear-gradient(90deg,#8ddfd205 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(#0009,transparent 90%)}
#motion-aurora i{position:absolute;width:85vmax;height:85vmax;border-radius:50%;left:-35vmax;top:-45vmax;background:radial-gradient(ellipse,#29c9ad30,transparent 65%);transform:translate3d(0,var(--aurora-y,0px),0);transition:transform .25s linear}
#motion-aurora i:nth-child(2){left:45vw;top:5vh;background:radial-gradient(ellipse,#326be53a,transparent 65%);transform:translate3d(0,calc(var(--aurora-y,0px) * -.7),0)}
#motion-aurora i:nth-child(3){left:-25vw;top:55vh;background:radial-gradient(ellipse,#22a7b51f,transparent 65%);width:65vmax;height:65vmax}
#motion-aurora i:after{content:"";position:absolute;inset:0;border-radius:inherit;background:inherit;animation:aurora-breathe 14s ease-in-out infinite}
@keyframes aurora-breathe{50%{transform:translate(4%,5%) scale(1.1);opacity:.5}}
.glass,.account-panel,.game-card{background-color:#101f30e8;backdrop-filter:blur(12px)}
.modal-content{animation:motion-chat .35s var(--motion-ease)}
#motion-success{position:fixed;z-index:10001;top:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:14px 18px;max-width:calc(100vw - 28px);width:max-content;background:#102f30f5;border:1px solid #76e8cc77;border-radius:20px;box-shadow:0 16px 65px #0007;color:#e8fff9;backdrop-filter:blur(18px);font:14px/1.4 system-ui}
#motion-success[hidden]{display:none}#motion-success svg{width:38px;height:38px;flex:none}#motion-success circle{stroke:#7ce0cb;stroke-width:1.5;fill:#7ce0cb15}#motion-success path{stroke:#8fffe0;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:30;stroke-dashoffset:0;animation:motion-check .55s var(--motion-ease)}
#motion-success button{background:none;border:0;color:#94eada;cursor:pointer;font:inherit;padding:8px}#motion-success a{color:#9cffe6}
@keyframes motion-check{from{stroke-dashoffset:30}to{stroke-dashoffset:0}}
.motion-device-success{animation:motion-card-success 1.6s ease-out!important}@keyframes motion-card-success{20%{box-shadow:0 0 0 2px #7ce0cb80,0 0 45px #47ddc229}100%{box-shadow:none}}
html.motion-paused #motion-aurora i:after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){#motion-aurora i,#motion-aurora i:after{animation:none;transition:none;transform:none}#motion-success path,.motion-device-success{animation:none!important}}