/* reset & base */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
    font-family: PingFangSC-Regular, Roboto, "Helvetica Neue", Arial, "Microsoft YaHei";
    background-color:#f8f8f8;
    color:#fff;
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
    max-width:750px;
    margin:0 auto;
}

/* 错误覆盖层 */
.overlay-error{
    position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:10000;
    background:rgba(0,0,0,0.7);display:none;
}
.overlay-error-box{
    max-width:750px;padding:30px;background:rgba(0,0,0,0.8);color:#fff;border-radius:10px;font-size:18px;
}

/* modal overlay */
.modal-overlay{
    position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
    z-index:9999;background:rgba(0,0,0,0.7);
    color:#fff;
}

/* progress card */
.progress-area{width:100%}
.progress-card{
    background: rgb(5 16 26);
    border-radius:12px;
    padding:32px 18px;
    max-width:340px;
    margin:60px auto;
}

/* small title */
.progress-title{font-size:20px;font-weight:700;margin-bottom:18px}

/* progress list */
.progress-list{display:block}
.progress-item{margin-bottom:16px}
.progress-label{font-size:15px;color:#dfe7f5;margin-bottom:8px}

/* track & fill */
.track{
    background:#eee;border-radius:8px;height:16px;overflow:hidden;
}
.fill{
    height:100%;border-radius:8px;background:#00dcf4;width:0%;transition:width .08s linear;
}

/* result card (primary & secondary share same look) */
.result-area{display:none;width:100%}
.result-card{
    background: rgb(5 16 26);
    border-radius:12px;padding:32px 18px;max-width:340px;margin:60px auto;
}
.result-title{font-size:18px;font-weight:700;margin-bottom:12px}
.result-text{font-size:15px;margin-bottom:18px;color:#dfe7f5}

/* buttons */
.action-cta{
    display:flex;justify-content:center;align-items:center;width:100%;
    padding:12px 0;border-radius:8px;border:0;cursor:pointer;
    background:#15a223;color:#fff;font-weight:700;
	animation: btn-breath 1.8s ease-in-out infinite;
}
@keyframes btn-breath {
	0% {
		box-shadow: 0 2px 16px 0 rgba(30, 198, 230, 0.25),
		0 2px 8px rgba(30, 198, 230, 0.18);
		transform: scale(1);
	}
	50% {
		box-shadow: 0 4px 32px 0 rgba(30, 198, 230, 0.38),
		0 2px 16px rgba(30, 198, 230, 0.22);
		transform: scale(1.04);
	}
	100% {
		box-shadow: 0 2px 16px 0 rgba(30, 198, 230, 0.25),
		0 2px 8px rgba(30, 198, 230, 0.18);
		transform: scale(1);
	}
}

/* 主体内容 */
.hero-wrap{width:100%;height:100vh;position:relative;overflow:hidden;background:url('../images/bg.gif') no-repeat center/100% 100%}

#mainBlock{
    position:absolute;top:36%;left:9%;width:81%;z-index:10;
}

/* banner box (uses wenank.png background as original) */
.banner-box{
    width:100%;text-align:center;background-image:url('../images/wenank.png');
    background-repeat:no-repeat;background-size:100% 100%;padding:0;
}
.banner-inner{padding:5% 8%}
.headline{font-size:30px;text-align:center;font-weight:700;color:#fff}
.subline{margin-top:2%;font-size:20px;color:#fff;font-weight:700;line-height:22px}

/* responsive adjustments */
@media (max-width:767px){
    .banner-inner{padding:8% 6%}
    .headline{font-size:20px}
    .subline{font-size:14px}
    #mainBlock{left:6%;width:88%}
}

/* input & buttons */
.ticker-input{
    width:100%;padding:1rem 2rem;border-radius:2rem;border:0;background:rgba(17,67,92,0.5);
    color:#fff;font-size:14px;text-align:center;margin-top:1rem;outline:none;
}
.ticker-input::placeholder{color:#9ca8ce}

.start-cta, .premium-cta{
    width:100%;padding:14px 0;border-radius:24px;border:0;margin-top:15px;
    background:linear-gradient(90deg,#12ebd0 0%,#12ebd0 100%);color:#fff;font-size:1.1rem;font-weight:600;
    box-shadow:0 2px 8px rgba(30,198,230,0.18);cursor:pointer;animation:cta-breath 1.8s ease-in-out infinite;
}
.start-cta{margin-top:25px}

/* breathing animation */
@keyframes cta-breath{
    0%{box-shadow:0 2px 16px 0 rgba(30,198,230,0.25),0 2px 8px rgba(30,198,230,0.18);transform:scale(1)}
    50%{box-shadow:0 4px 32px 0 rgba(30,198,230,0.38),0 2px 16px rgba(30,198,230,0.22);transform:scale(1.04)}
    100%{box-shadow:0 2px 16px 0 rgba(30,198,230,0.25),0 2px 8px rgba(30,198,230,0.18);transform:scale(1)}
}

/* footer */
.page-footer{width:100%;margin:0 auto;padding:0 16px 24px 16px;box-sizing:border-box;text-align:center;font-size:0.92rem;color:#b8c6e0;background:#0c3956}
.page-footer a{color:#3eeaff;text-decoration:underline;margin:0 8px}