*{text-decoration : none;font-size:14px;}
body{background:#3d3d3d}
.center{max-width:350px;position: absolute;top:calc(50% - 200px);left:calc(50% - 175px);width:350px;text-align:center;overflow:hidden;}
.logo{overflow:hidden;border-radius:18px;width:100px;height:100px;margin:auto;border:0}
.logo img{width:100%;height:100%;}
.title{margin-left:10px;color:#fff;letter-spacing: 12px;font-size:32px;text-align:center;font-weight:bold;margin-top:23px;}
.btns{width:200px;margin:auto;overflow:hidden;margin-top:20px;}
.btn{border:1px solid #999;display:block;border-radius:8px;padding:12px 8px;width:100%;background:#666;margin:20px 0;box-sizing:border-box;color:#fff;}
.green{background:#2cb177;}
.btns .btn:hover{background:#6669;}
.btns .green:hover{background:#2cb17799;}
.foot{color:#999;position:fixed;bottom:10px;width:100%;left:20px;font-size:12px;text-align:center;}
.foot a{font-size:12px;color:#999}
.wranning{text-align:center;color:#fff;position:fixed;top:0;padding:30px 0;width:100%;}
.wranning svg{    width: 15px;    height: 15px;    color: #ff7b8c;    flex: none;}
.wranning .con{display: inline-flex;    align-items: center;    gap: 7px;    padding: 9px 16px;    border: 1px solid rgba(255, 255, 255, .07);
    background: rgba(72, 38, 47, .65);    backdrop-filter: blur(12px);    -webkit-backdrop-filter: blur(12px);    border-radius: 30px;
    color: #ddd;    font-size: 12px;    box-shadow: 0 8px 30px rgba(0, 0, 0, .2);}
.subtitle{margin-top: 10px;    color: #888;    font-size: 13px;    letter-spacing: 1px;}



.code-qj{padding-left:10px;letter-spacing:10px;padding-bottom:10px;}

.x-layer-shade{
	position:fixed;
	inset:0;
	background:rgba(0,0,0,0);
	z-index:1000;
	transition:background .2s ease;
}

.x-layer-shade.x-layer-shade-show{
	background:rgba(0,0,0,.3);
}

.x-layer{
	position:fixed;
	left:0;
	top:0;
	background:#fff;
	border-radius:4px;
	box-shadow:0 8px 40px rgba(0,0,0,.3);
	z-index:1001;
	overflow:hidden;

	opacity:0;
	transform:translateY(-20px) scale(.96);
	transition:opacity .2s ease,transform .2s ease;
}

.x-layer-title{
	height:42px;
	line-height:42px;
	padding:0 45px 0 15px;
	border-bottom:1px solid #eee;
	font-size:14px;
	color:#efefef;
}
.x-layer.x-layer-show{
	opacity:1;
	transform:translateY(0) scale(1);
}
.x-layer-close{
	position:absolute;
	right:8px;
	top:5px;
	width:32px;
	height:32px;
	line-height:30px;
	text-align:center;
	font:26px/32px Arial;
	color:#ccc;
	cursor:pointer;
	z-index:10;
}

.x-layer-close:hover{
	color:#aaa;
}

.x-layer-content{
	overflow:auto;
}

.x-layer-btn{
	padding:10px 12px;
	border-top:1px solid #eee;
	text-align:right;
}

.x-layer-btn a{
	display:inline-block;
	height:30px;
	line-height:30px;
	padding:0 16px;
	margin-left:8px;
	border:1px solid #ddd;
	border-radius:3px;
	background:#fff;
	color:#333;
	cursor:pointer;
	text-decoration:none;
}

.x-layer-btn .x-layer-btn0{
	background:#009688;
	border-color:#009688;
	color:#fff;
}

.x-layer-msg{
	position:fixed;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	padding:10px 18px;
	max-width:80%;
	background:rgba(0,0,0,.78);
	color:#fff;
	border-radius:4px;
	font-size:14px;
	line-height:22px;
	text-align:center;
	z-index:9999999;
}


/* 你的弹窗 */

.alert-skin{width:400px;height:260px;background:#3d3d3d;color:#fff;}

.alert-skin .x-layer-content{
	background:#3d3d3d;
	color:#fff;
	height:100%;
	border-radius:12px;
}
.alert-skin h3{font-size:16px}
.alert-skin .code{	text-align:center;	padding:20px;}
.alert-skin .code-num{color:#2cb177;font-size:150%;letter-spacing:5px;margin-left: 10px;}
.alert-skin .code-copy{letter-spacing:2px;color:#f80}




.x-layer-load{position:fixed;z-index:2666;background:transparent;}
.x-spin{
	width:40px;height:40px;
	border:4px solid #e5e5e5;
	border-top-color:#2cb177;
	border-radius:50%;
	animation: spin 0.8s linear infinite;
}
@keyframes spin{
	to{transform:rotate(360deg);}
}


.alert-skin .code-box{
	position:relative;
	width:240px;
	margin:16px auto;
}
.alert-skin .getinput{
	width:210px;
	padding:5px 3px;
	height:30px;
	border:1px solid #555;
	border-radius:6px;
	background:#3d3d3d;
	color:#fff;
	text-align:center;
	outline:none;
	font-size:20px;	
	letter-spacing:20px; /* 拉开字间距，模拟5格 */
	caret-color:transparent;
	padding-left:20px;
}
.alert-skin .getinput:focus{
	border-color:#2cb177;
	box-shadow:0 0 0 2px rgba(44,177,119,0.25);
}
.alert-skin .btn{
	display:block;
	width:50%;
	margin:22px auto 0 auto;
	padding:8px;
	background:#2cb177;
	color:#fff;
	border-radius:5px;
	cursor:pointer;
	text-decoration:none;
	text-align:center;
	font-size:16px;
}

.alert-skin .btn:hover{
	background:#2cb17799;
}