.header {
	width: 100%;
	padding: 20px;
}



.banner{
margin-top:15px;
	position: relative;
	width: 100%;
	height: 158px;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: 50px;
	background-image: url(https://api.suyanw.cn/api/comic3.php);/*更多图片api地址：https://api.suyanw.cn/自行替换，或者用自己图片链接即可*/
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50%;
	padding: 20px;
	border-radius: 16px
}

 .logo {
	position: absolute;
	left: 50%;
	bottom: -50px;
	width: 100px;
	height: 100px;
	background-repeat: no-repeat;
	background-size: contain;
	margin-left: -50px;
	border: 5px solid #fff;
	border-radius: 50%;
	box-shadow: 0 10px 20px 5px #e6e8ea
}
 .logo img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	-o-object-fit: cover;
	object-fit: cover
}

.author-name {
     display:flex;
     width:100%;
     justify-content: center;
	align-items: center;
	font-size: 25px;
	line-height: 36px;
	font-weight: 500;
	margin-top: 13px
}
.gender-icon{
	display: inline-block;
	width: 22px;
	height: 22px;
	margin: 0 10px 6px 0;
	background-size: contain;
	background-position: 50%;
	background-repeat: no-repeat
}
.man {
	background-image: url(data:image/png;base64,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)
}

 .female {
	background-image: url(data:image/png;base64,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)
}






.desc {
    width: 100%
	padding: 0 12px;
	font-size: 14px;
	text-align: center;
	color: #aaa;
	line-height: 20px;
	margin-top: 4px
}


 .tab-list {

	width: 100%;
	padding: 0 20px;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start
}

 .tab-item, .tab-list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center
}
 .tab-item {
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	height: 35px;
	padding: 0 12px;
	width:34%;
	background: #fff;
	border-radius: 17px;
	font-size: 14px;
	line-height: 20px;
	margin-right: 10px
}
 
 .tab-item .text {
	margin-left: 6px
}
 .tab-item:before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	background-size: contain;
	background-position: 50%;
	background-repeat: no-repeat
}

.lx:before {

	background-image: url(../assets/lx.png)
}

.dh:before {
	background-image: url(../assets/dh.png)
}

.zy:before {
	background-image: url(../assets/zy.png)
}


.app-list {
	width: 100%;
	background: #f4f6f8;
	padding: 12px;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}
.item,
.app-list{
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center
}

.item{
	width: 50%;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	padding: 8px;
	position: relative;
	color: #222
}

 .content-wrap {
	width: 100%;
	background: #fff;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 14px 16px;
	border-radius: 17px
}

 .img-wrap{
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 45px;
	height: 45px;
	margin-right: 10px
}

 .item:hover{
    width: 48%;
    transform: scale(1.5);
}



 .img-wrap img{
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
	border-radius: 12px
}

.app-name{
	font-size: 15px;
	line-height: 20px;
	width: 100%;
	word-break: break-all;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	font-family: PingFang SC;
	font-weight: 500
}

/* ===== QSD compact preview v1 ===== */
.settings-button{
 position:absolute;top:18px;right:18px;z-index:20;width:38px;height:38px;border:0;border-radius:13px;background:rgba(255,255,255,.9);box-shadow:0 8px 22px rgba(44,55,77,.12);font-size:18px;color:#596273;cursor:pointer;transition:.18s
}
.settings-button:hover{transform:rotate(22deg) scale(1.04)}
#app{position:relative}
.header{padding:16px 18px 10px}
.banner{height:126px;margin-top:8px;margin-bottom:38px;padding:16px;border-radius:15px}
.logo{width:82px;height:82px;bottom:-41px;margin-left:-41px;border-width:4px;box-shadow:0 8px 20px rgba(67,77,96,.16)}
.author-name{font-size:22px;line-height:30px;margin-top:8px}
.desc{font-size:12px;margin-top:2px;line-height:18px}
.tab-list{padding:0 18px}
.tab-item{height:32px;font-size:12px;border-radius:16px;margin-right:8px}
.app-list{padding:8px 10px 16px}
.item{padding:6px}
.content-wrap{padding:11px 13px;border-radius:14px;box-shadow:0 6px 16px rgba(65,75,91,.045)}
.img-wrap{width:40px;height:40px;margin-right:9px}
.app-name{font-size:13px;line-height:18px}
.item:hover{width:50%;transform:none}
.item:hover .content-wrap{transform:translateY(-2px);box-shadow:0 10px 24px rgba(65,75,91,.10)}
.content-wrap{transition:.18s ease}

.settings-overlay{display:none;position:fixed;inset:0;z-index:999999}
.settings-overlay.show{display:block}
.settings-mask{position:absolute;inset:0;background:rgba(31,38,50,.24);backdrop-filter:blur(10px)}
.settings-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(620px,calc(100% - 28px));max-height:86vh;overflow:auto;background:rgba(249,250,252,.97);border:1px solid rgba(255,255,255,.95);border-radius:24px;padding:22px;box-shadow:0 34px 90px rgba(38,50,73,.28)}
.settings-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px}.settings-head small{font-size:9px;letter-spacing:.18em;color:#9aa4b4;font-weight:700}.settings-head h3{margin:4px 0 0;font-size:22px;color:#313949}.settings-close{width:36px;height:36px;border:0;border-radius:12px;background:#edf1f5;font-size:22px;color:#667284}
.settings-grid,.music-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.settings-panel label{display:block;font-size:11px;color:#778294}.settings-panel input[type=text],.settings-panel input:not([type]){width:100%}.settings-panel input[name=title],.settings-panel input[name=subtitle],.settings-panel input[name=music_songlist]{display:block;width:100%;height:40px;margin-top:6px;border:1px solid #e1e6ed;border-radius:12px;padding:0 12px;background:#fff;outline:0;color:#303847}.settings-panel input:focus{border-color:#9eb7e5;box-shadow:0 0 0 3px rgba(111,146,212,.10)}
.upload-group{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.upload-card{position:relative;display:flex!important;align-items:center;justify-content:space-between;padding:12px 13px;border:1px dashed #d8dee8;border-radius:13px;background:#fff;cursor:pointer}.upload-card.wide{margin-top:10px}.upload-card input{position:absolute;opacity:0;pointer-events:none}.upload-card span{font-weight:600;color:#52627a}.settings-section-title{font-size:11px;font-weight:700;color:#69768a;margin:18px 0 9px}.wallpaper-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.radio-card{display:flex!important;align-items:center;gap:8px;padding:11px 12px;border-radius:12px;background:#fff;border:1px solid #e4e8ef}.radio-card input{margin:0}.switch-line{display:flex!important;align-items:center;justify-content:space-between;height:40px;padding:0 12px;border-radius:12px;background:#fff;border:1px solid #e4e8ef;margin-top:17px}.switch-line input{display:none}.switch-line i{width:38px;height:22px;border-radius:999px;background:#d6dce4;position:relative;transition:.2s}.switch-line i:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;left:2px;top:2px;box-shadow:0 2px 5px rgba(0,0,0,.15);transition:.2s}.switch-line input:checked+i{background:#5b91ea}.switch-line input:checked+i:after{transform:translateX(16px)}
.save-settings{width:100%;height:44px;border:0;border-radius:13px;background:#2f72df;color:#fff;font-weight:700;margin-top:18px;box-shadow:0 10px 22px rgba(47,114,223,.18)}.save-settings:disabled{opacity:.55}.settings-tip{text-align:center;font-size:10px;color:#9aa4b2;margin-top:9px}
.toast{position:fixed;right:20px;top:20px;z-index:1000000;opacity:0;transform:translateY(-8px);pointer-events:none;padding:12px 16px;border-radius:13px;background:#fff;color:#455166;box-shadow:0 16px 40px rgba(33,45,67,.18);transition:.2s}.toast.show{opacity:1;transform:none}.toast.error{border-left:4px solid #ef7183}
.modal{z-index:999998}.modal-content{background:#fff;border:0;border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.18)}
@media(max-width:600px){.settings-button{top:12px;right:12px}.settings-panel{padding:18px;border-radius:20px}.settings-grid,.music-row,.upload-group{grid-template-columns:1fr}.wallpaper-row{grid-template-columns:1fr 1fr}.header{padding:12px 14px 8px}.banner{height:116px;margin-bottom:34px}.logo{width:74px;height:74px;bottom:-37px;margin-left:-37px}.author-name{font-size:20px}.app-list{padding:7px}.content-wrap{padding:10px}.img-wrap{width:37px;height:37px}.app-name{font-size:12px}}