.auth-page{
    position:relative;
    min-height:calc(100vh - 66px);
    display:flex;
    align-items:stretch;
    justify-content:center;
    overflow:hidden;
    padding:28px clamp(18px,3vw,56px) 34px;
    background:#07111f;
    color:#dbeafe;
    isolation:isolate;
}
.auth-page,.auth-page *,.auth-page:before,.auth-page:after{
    box-sizing:border-box;
}
body:has(.auth-page){background:#07111f;}
.auth-page ~ .wave-box,.auth-page ~ .bg-one{display:none!important;}
.auth-page:before{
    content:"";
    position:absolute;
    inset:-20%;
    z-index:0;
    background:
        linear-gradient(rgba(125,211,252,.08) 1px,transparent 1px),
        linear-gradient(90deg,rgba(125,211,252,.08) 1px,transparent 1px),
        linear-gradient(135deg,#06101d 0%,#0a223b 42%,#0b7fc9 100%);
    background-size:42px 42px,42px 42px,100% 100%;
    animation:authGridFlow 28s linear infinite;
}
.auth-page:after{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:
        radial-gradient(circle at 14% 18%,rgba(21,135,232,.35),transparent 28%),
        radial-gradient(circle at 80% 24%,rgba(245,166,35,.2),transparent 24%),
        radial-gradient(circle at 56% 84%,rgba(16,185,129,.16),transparent 30%),
        linear-gradient(180deg,rgba(3,7,18,.15),rgba(3,7,18,.42));
    animation:authLightSweep 10s ease-in-out infinite alternate;
}
.auth-bg{
    position:absolute;
    inset:0;
    z-index:0;
    overflow:hidden;
    pointer-events:none;
}
.auth-data-strip{
    position:absolute;
    display:inline-flex;
    align-items:center;
    height:34px;
    padding:0 22px;
    border:1px solid rgba(125,211,252,.18);
    border-radius:999px;
    background:rgba(8,17,31,.46);
    color:rgba(219,234,254,.62);
    font-family:Consolas,Monaco,monospace;
    font-size:12px;
    white-space:nowrap;
    box-shadow:0 18px 44px rgba(0,0,0,.18);
    animation:authDataDrift 20s linear infinite;
}
.auth-data-strip.strip-1{top:14%;left:-16%;animation-duration:24s;}
.auth-data-strip.strip-2{top:72%;left:-28%;animation-duration:30s;animation-delay:-7s;}
.auth-data-strip.strip-3{top:42%;left:-22%;animation-duration:26s;animation-delay:-14s;}
.auth-ball{
    position:absolute;
    display:flex;
    align-items:center;
    justify-content:center;
    width:62px;
    height:62px;
    border-radius:50%;
    color:#fff;
    font-size:24px;
    font-weight:800;
    box-shadow:inset 0 10px 18px rgba(255,255,255,.28),inset 0 -10px 20px rgba(0,0,0,.22),0 18px 38px rgba(0,0,0,.28);
    animation:authFloat 8s ease-in-out infinite;
}
.auth-ball.blue{background:radial-gradient(circle at 34% 28%,#b8f0ff 0%,#25a8f2 34%,#075da9 100%);}
.auth-ball.red{background:radial-gradient(circle at 34% 28%,#ffd1d1 0%,#f04438 36%,#9b1c1c 100%);}
.auth-ball.green{background:radial-gradient(circle at 34% 28%,#c6ffe8 0%,#10b981 38%,#047857 100%);}
.auth-ball.gold{background:radial-gradient(circle at 34% 28%,#fff3bf 0%,#f5a623 38%,#a15c00 100%);}
.auth-ball.ball-1{top:17%;left:7%;animation-delay:-1s;}
.auth-ball.ball-2{top:69%;left:10%;width:48px;height:48px;font-size:19px;animation-delay:-5s;}
.auth-ball.ball-3{top:18%;right:7%;width:52px;height:52px;font-size:20px;animation-delay:-3s;}
.auth-ball.ball-4{right:16%;bottom:10%;width:72px;height:72px;font-size:27px;animation-delay:-7s;}
.auth-ticket{
    position:absolute;
    display:flex;
    align-items:center;
    gap:10px;
    min-width:220px;
    height:48px;
    padding:0 16px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:8px;
    background:rgba(255,255,255,.08);
    color:rgba(255,255,255,.72);
    box-shadow:0 18px 50px rgba(0,0,0,.2);
    animation:authFloat 9s ease-in-out infinite;
}
.auth-ticket strong{font-size:14px;color:#fff;}
.auth-ticket span{font-family:Consolas,Monaco,monospace;font-size:13px;color:#7dd3fc;}
.auth-ticket.ticket-1{left:15%;bottom:15%;animation-delay:-2s;}
.auth-ticket.ticket-2{right:12%;top:26%;animation-delay:-6s;}
.auth-shell{
    position:relative;
    z-index:1;
    width:min(1880px,100%);
    min-height:min(760px,calc(100vh - 128px));
    display:grid;
    grid-template-columns:minmax(0,1fr) clamp(430px,28vw,540px);
    overflow:hidden;
    border:1px solid rgba(148,163,184,.22);
    border-radius:18px;
    background:rgba(5,12,22,.72);
    box-shadow:0 42px 110px rgba(0,0,0,.42);
}
.auth-shell:before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:
        linear-gradient(120deg,rgba(255,255,255,.08),transparent 24%,transparent 70%,rgba(255,255,255,.1)),
        repeating-linear-gradient(90deg,transparent 0 84px,rgba(255,255,255,.03) 84px 85px);
    pointer-events:none;
}
.auth-copy{
    position:relative;
    z-index:1;
    min-height:640px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    overflow:hidden;
    padding:clamp(44px,5vw,88px);
    background:
        linear-gradient(115deg,rgba(4,10,20,.92) 0%,rgba(9,31,54,.86) 50%,rgba(10,128,202,.58) 100%);
    color:#fff;
}
.auth-copy:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
    background-size:44px 44px;
    opacity:.28;
    animation:authGridFlow 22s linear infinite reverse;
}
.auth-copy:after{
    content:"";
    position:absolute;
    width:64%;
    height:46%;
    right:-18%;
    bottom:-18%;
    background:radial-gradient(circle,rgba(14,165,233,.44),transparent 68%);
    filter:blur(2px);
}
.auth-copy>*{position:relative;z-index:1;}
.auth-eyebrow{
    display:inline-flex;
    align-items:center;
    width:max-content;
    min-height:32px;
    padding:0 13px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:7px;
    background:rgba(255,255,255,.1);
    color:#fff;
    font-size:12px;
    font-weight:800;
}
.auth-copy h1{
    max-width:720px;
    margin:24px 0 16px;
    color:#fff;
    font-size:clamp(36px,3.6vw,62px);
    line-height:1.12;
    font-weight:900;
    letter-spacing:0;
}
.auth-copy p{
    max-width:720px;
    margin:0;
    color:#dbeafe;
    font-size:17px;
    line-height:1.9;
}
.auth-visual-grid{
    display:grid;
    grid-template-columns:minmax(320px,1fr) minmax(260px,.72fr);
    gap:18px;
    max-width:860px;
    margin-top:34px;
}
.auth-live-panel,.auth-code-panel,.auth-video-panel{
    border:1px solid rgba(125,211,252,.18);
    border-radius:10px;
    background:rgba(8,17,31,.42);
    box-shadow:0 18px 52px rgba(0,0,0,.22);
    backdrop-filter:blur(8px);
}
.auth-live-panel{padding:18px;}
.auth-panel-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
    color:#dbeafe;
    font-size:13px;
    font-weight:800;
}
.auth-panel-title span{
    display:inline-flex;
    align-items:center;
    gap:7px;
}
.auth-panel-title span:before{
    content:"";
    width:8px;
    height:8px;
    border-radius:50%;
    background:#22c55e;
    box-shadow:0 0 0 5px rgba(34,197,94,.13);
}
.auth-draw-row{
    display:grid;
    grid-template-columns:100px 1fr;
    gap:12px;
    align-items:center;
    min-height:42px;
    border-top:1px solid rgba(255,255,255,.08);
    color:#cbd5e1;
    animation:authRowGlow 4s ease-in-out infinite;
}
.auth-draw-row:first-of-type{border-top:0;}
.auth-draw-row:nth-child(3){animation-delay:-1.3s;}
.auth-draw-row:nth-child(4){animation-delay:-2.6s;}
.auth-draw-row strong{
    color:#fff;
    font-size:14px;
    white-space:nowrap;
}
.auth-draw-row em{
    display:block;
    overflow:hidden;
    color:#7dd3fc;
    font-family:Consolas,Monaco,monospace;
    font-size:14px;
    font-style:normal;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.auth-code-panel{
    padding:16px 17px;
    font-family:Consolas,Monaco,monospace;
    color:#dbeafe;
}
.auth-code-panel span{
    display:block;
    margin-bottom:8px;
    color:#f5a623;
    font-size:13px;
}
.auth-code-panel code{
    display:block;
    color:#7dd3fc;
    font-size:13px;
    line-height:1.7;
    white-space:normal;
    word-break:break-word;
}
.auth-video-panel{
    display:flex;
    align-items:center;
    gap:13px;
    margin-top:18px;
    padding:16px 17px;
    color:#dbeafe;
}
.auth-video-panel i{
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    flex:0 0 42px;
    border-radius:10px;
    background:linear-gradient(135deg,#f5a623,#f97316);
    color:#fff;
    box-shadow:0 12px 28px rgba(249,115,22,.28);
}
.auth-video-panel strong{display:block;margin-bottom:3px;color:#fff;font-size:14px;}
.auth-video-panel span{display:block;color:#bfd2e8;font-size:12px;}
.auth-points{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    max-width:860px;
    margin-top:30px;
}
.auth-point{
    display:flex;
    align-items:flex-start;
    gap:12px;
    min-width:0;
    padding:15px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:9px;
    background:rgba(255,255,255,.08);
    color:#e7f2ff;
}
.auth-point i{
    display:flex;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    flex:0 0 30px;
    border-radius:8px;
    background:rgba(245,166,35,.16);
    color:#f5a623;
}
.auth-point strong{display:block;margin-bottom:3px;color:#fff;font-size:14px;}
.auth-point span{display:block;color:#bfd2e8;font-size:12px;line-height:1.55;}
.auth-metrics{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    max-width:720px;
    margin-top:32px;
    padding-top:24px;
    border-top:1px solid rgba(255,255,255,.18);
}
.auth-metric strong{display:block;color:#fff;font-size:28px;line-height:1;font-weight:900;}
.auth-metric span{display:block;margin-top:8px;color:#cbd5e1;font-size:13px;}
.auth-panel{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:clamp(38px,4vw,70px) clamp(34px,3.4vw,58px);
    border-left:1px solid rgba(125,211,252,.16);
    background:
        linear-gradient(180deg,rgba(8,17,31,.86),rgba(7,17,31,.78)),
        radial-gradient(circle at 72% 18%,rgba(19,136,232,.22),transparent 34%);
    color:#dbeafe;
    box-shadow:inset 1px 0 0 rgba(255,255,255,.05);
    backdrop-filter:blur(10px);
}
.auth-panel:before{
    content:"";
    position:absolute;
    inset:0 0 auto;
    height:4px;
    background:linear-gradient(90deg,#f04438,#f5a623,#10b981,#1388e8);
}
.auth-panel>*{
    position:relative;
    width:100%;
    max-width:460px;
    margin-left:auto;
    margin-right:auto;
}
.auth-register-page .auth-shell{grid-template-columns:minmax(0,1fr) clamp(560px,37vw,690px);}
.auth-register-page .auth-panel>*{max-width:590px;}
.auth-register-page .auth-copy{min-height:700px;}
.auth-panel-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:26px;
}
.auth-panel-head h2{
    color:#fff;
    font-size:30px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:0;
}
.auth-panel-head a,.auth-links a,.auth-agreement a{color:#7dd3fc!important;font-weight:800;}
.auth-form .layui-form-item{margin-bottom:16px;}
.auth-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.auth-input{position:relative;}
.auth-input i{
    position:absolute;
    left:15px;
    top:50%;
    width:18px;
    transform:translateY(-50%);
    color:#9fb5cd;
    font-size:16px;
    text-align:center;
}
.auth-input .layui-input{
    height:50px;
    border:1px solid rgba(125,211,252,.22);
    border-radius:8px;
    padding-left:44px;
    background:rgba(255,255,255,.08);
    color:#eef7ff;
    font-size:15px;
    box-shadow:none;
}
.auth-input .layui-input::placeholder{color:rgba(203,213,225,.68);}
.auth-input .layui-input:focus{
    border-color:#1388e8!important;
    background:rgba(255,255,255,.12);
    box-shadow:0 0 0 3px rgba(19,136,232,.18);
}
.auth-captcha{display:grid;grid-template-columns:1fr 128px;gap:12px;align-items:center;}
.auth-codeimg{
    width:128px;
    height:50px;
    border:1px solid rgba(125,211,252,.22);
    border-radius:8px;
    background:rgba(255,255,255,.9);
    object-fit:cover;
    cursor:pointer;
}
.auth-links,.auth-agreement{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:4px 0 18px;
    color:#cbd5e1;
    font-size:14px;
}
.auth-agreement-left{display:flex;align-items:center;gap:6px;min-width:0;}
.auth-submit{
    height:50px!important;
    border-radius:8px!important;
    background:linear-gradient(135deg,#23a8f2,#0b74df)!important;
    font-size:16px!important;
    font-weight:800!important;
    box-shadow:0 16px 30px rgba(19,136,232,.24);
}
.auth-submit:hover{filter:brightness(.96);}
.auth-divider{
    display:flex;
    align-items:center;
    gap:12px;
    margin:26px 0 16px;
    color:#cbd5e1;
    font-size:13px;
}
.auth-divider:before,.auth-divider:after{content:"";height:1px;background:rgba(125,211,252,.18);flex:1;}
.auth-social-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.auth-social{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    height:44px;
    border:1px solid rgba(125,211,252,.2);
    border-radius:8px;
    background:rgba(255,255,255,.08);
    color:#eef7ff!important;
    font-weight:800;
    transition:all .18s ease;
}
.auth-social:hover{
    border-color:#1388e8;
    background:rgba(19,136,232,.14);
    box-shadow:0 10px 24px rgba(0,0,0,.18);
    transform:translateY(-1px);
}
.auth-social i{font-size:16px;}
.auth-google i{color:#ea4335;}
.auth-github i{color:#eef7ff;}
.auth-telegram i{color:#229ed9;}
.tipslayer .guize_html{padding:26px 28px;color:#dbeafe;line-height:1.8;}
.tipslayer h3{font-size:20px;font-weight:800;}
@keyframes authGridFlow{
    from{transform:translate3d(0,0,0);}
    to{transform:translate3d(42px,42px,0);}
}
@keyframes authLightSweep{
    from{opacity:.72;transform:scale(1);}
    to{opacity:1;transform:scale(1.04);}
}
@keyframes authDataDrift{
    from{transform:translateX(0);}
    to{transform:translateX(150vw);}
}
@keyframes authFloat{
    0%,100%{transform:translate3d(0,0,0) rotate(0deg);}
    50%{transform:translate3d(12px,-18px,0) rotate(8deg);}
}
@keyframes authRowGlow{
    0%,100%{opacity:.72;}
    50%{opacity:1;}
}
@media screen and (max-width:1280px){
    .auth-shell{grid-template-columns:minmax(0,1fr) 430px;}
    .auth-register-page .auth-panel>*{max-width:680px;}
}
@media screen and (max-width:1020px){
    .auth-page{display:block;min-height:calc(100vh - 60px);padding:18px 14px 42px;}
    .auth-shell{grid-template-columns:1fr;min-height:auto;border-radius:14px;}
    .auth-register-page .auth-shell{grid-template-columns:1fr;}
    .auth-register-page .auth-copy{min-height:auto;}
    .auth-copy{min-height:auto;padding:34px 28px;}
    .auth-copy h1{font-size:32px;}
    .auth-copy p{font-size:14px;}
    .auth-visual-grid{grid-template-columns:1fr;}
    .auth-video-panel{margin-top:0;}
    .auth-points{grid-template-columns:1fr;}
    .auth-metrics{grid-template-columns:repeat(3,1fr);margin-top:24px;}
    .auth-panel{padding:32px 24px;}
    .auth-ball,.auth-ticket{display:none;}
}
@media screen and (max-width:620px){
    .auth-copy{padding:28px 22px 24px;}
    .auth-copy h1{font-size:28px;}
    .auth-copy p{line-height:1.7;}
    .auth-visual-grid,.auth-points{display:none;}
    .auth-metrics{
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:10px;
        margin-top:18px;
        padding-top:18px;
    }
    .auth-metric strong{font-size:22px;}
    .auth-metric span{font-size:12px;}
    .auth-form-grid,.auth-social-grid{grid-template-columns:1fr;}
    .auth-panel{padding:26px 20px 28px;}
    .auth-panel-head h2{font-size:26px;}
    .auth-input .layui-input,.auth-codeimg,.auth-submit{height:46px!important;}
    .auth-panel-head,.auth-links,.auth-agreement{display:block;}
    .auth-panel-head a,.auth-agreement>a{display:inline-block;margin-top:10px;}
    .auth-captcha{grid-template-columns:1fr;}
    .auth-codeimg{width:100%;}
    .auth-links{line-height:2;}
}
@media (prefers-reduced-motion:reduce){
    .auth-page:before,.auth-page:after,.auth-copy:before,.auth-data-strip,.auth-ball,.auth-ticket,.auth-draw-row{
        animation:none!important;
    }
}