*{
box-sizing:border-box;
}


body{

margin:0;

font-family:
"Microsoft YaHei",
"PingFang SC",
sans-serif;

color:#243447;

min-height:100vh;

overflow-x:hidden;

}


/* 背景 */

.background{

position:fixed;

width:100%;
height:100%;

background:

linear-gradient(
135deg,
#f7f4ed,
#eef3f8
);

z-index:-2;

}



/* 浮动光点 */

.background::before{

content:"";

position:absolute;

width:300px;
height:300px;

background:#d4af37;

opacity:0.12;

border-radius:50%;

top:10%;
left:15%;

filter:blur(50px);

animation:float 8s infinite alternate;

}



.background::after{

content:"";

position:absolute;

width:250px;
height:250px;

background:#12355b;

opacity:0.12;

border-radius:50%;

bottom:15%;
right:15%;

filter:blur(60px);

animation:float 10s infinite alternate;

}


@keyframes float{

from{

transform:translateY(0);

}

to{

transform:translateY(40px);

}

}




.container{

width:90%;

max-width:900px;

margin:auto;

padding-top:90px;

text-align:center;

}



.logo{

font-size:36px;

font-weight:bold;

letter-spacing:6px;

color:#12355b;

}



.line{

width:80px;

height:3px;

background:#d4af37;

margin:25px auto;

}



h1{

font-size:52px;

margin:20px 0;

color:#12355b;

animation:fade 1s;

}



.subtitle{

font-size:20px;

color:#687684;

letter-spacing:4px;

}



/* 测试版页面入口按钮 */

.beta-button{

display:inline-block;

margin-top:34px;

padding:16px 42px;

border-radius:50px;

background:

linear-gradient(
90deg,
#12355b,
#d4af37
);

color:#fff;

font-size:18px;

font-weight:bold;

letter-spacing:2px;

text-decoration:none;

box-shadow:

0 12px 30px rgba(18,53,91,0.25);

transition:0.3s;

}


.beta-button:hover{

transform:translateY(-3px);

box-shadow:

0 18px 40px rgba(18,53,91,0.32);

}


.beta-hint{

display:block;

margin-top:6px;

font-size:12px;

font-weight:normal;

letter-spacing:1px;

opacity:0.85;

}


@media(max-width:600px){

.beta-button{

padding:14px 30px;

font-size:16px;

letter-spacing:1px;

}

}




.card{

margin-top:50px;

background:

rgba(255,255,255,0.75);

backdrop-filter:blur(10px);

padding:40px;

border-radius:20px;

box-shadow:

0 20px 50px rgba(0,0,0,0.08);

text-align:left;

animation:up 1s;

}


.card h2{

text-align:center;

color:#12355b;

}


.card p{

line-height:2;

}




.progress{

margin-top:40px;

}


.status{

margin-bottom:15px;

}


.status span{

color:#b08b25;

font-weight:bold;

}



.bar{

height:12px;

background:#ddd;

border-radius:20px;

overflow:hidden;

}


.fill{

height:100%;

width:35%;

background:

linear-gradient(
90deg,
#12355b,
#d4af37
);

animation:loading 2s;

}


@keyframes loading{

from{

width:0;

}

}



.notice{

margin-top:40px;

font-size:14px;

color:#777;

line-height:2;

}



footer{

margin-top:80px;

padding-bottom:40px;

font-size:14px;

color:#999;

}



@keyframes fade{

from{

opacity:0;

}

to{

opacity:1;

}

}



@keyframes up{

from{

transform:translateY(30px);

opacity:0;

}

to{

transform:none;

opacity:1;

}

}




@media(max-width:600px){


.container{

padding-top:50px;

}


.logo{

font-size:26px;

}


h1{

font-size:38px;

}


.card{

padding:25px;

}


}

/* 友情链接 */

.links{

margin-top:40px;

text-align:left;

}


.links h2{

text-align:center;

}


.link-desc{

text-align:center;

font-size:14px;

color:#888;

margin-bottom:30px;

}



.link-group{

margin-top:25px;

}



.link-group h3{

color:#12355b;

font-size:18px;

margin-bottom:15px;

}



.link-group a{

display:inline-block;

margin-right:15px;

margin-bottom:12px;

padding:8px 16px;

background:rgba(255,255,255,0.8);

border-radius:20px;

text-decoration:none;

color:#12355b;

transition:0.3s;

border:1px solid rgba(18,53,91,0.1);

}



.link-group a:hover{

transform:translateY(-3px);

box-shadow:0 8px 20px rgba(0,0,0,0.08);

color:#b08b25;

}



@media(max-width:600px){


.link-group a{

display:block;

margin-right:0;

text-align:center;

}


}