* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body { font-family: "SF Pro Display", -apple-system, "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
       overflow-x: hidden; color: #fff; }

/* ---------- 轮播背景 ---------- */
.bg-stage { position: fixed; inset: 0; z-index: 0; background: #0B1E33; }
.bg-slide { position: absolute; inset: 0; background-size: cover; background-position: center;
            opacity: 0; transition: opacity 1.6s ease; }
.bg-slide.active { opacity: 1; }
.bg-dim { position: absolute; inset: 0; background: linear-gradient(160deg, rgba(6,18,32,.55), rgba(6,18,32,.28) 45%, rgba(6,18,32,.6)); }

/* 漂浮柔光斑（玻璃质感氛围） */
.blob { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .5; z-index: 1; pointer-events: none;
        animation: drift 14s ease-in-out infinite alternate; }
.b1 { width: 340px; height: 340px; background: #2BA3C7; top: 8%; left: 12%; }
.b2 { width: 280px; height: 280px; background: #E8863B; bottom: 10%; right: 14%; animation-delay: -5s; }
.b3 { width: 220px; height: 220px; background: #4BB5A0; bottom: 22%; left: 30%; animation-delay: -9s; }
@keyframes drift { from { transform: translate(0,0) scale(1); } to { transform: translate(40px, 30px) scale(1.12); } }

/* ---------- 布局：验证区按屏幕百分比 ---------- */
.stage { position: relative; z-index: 2; min-height: 100vh; display: flex; flex-direction: column;
         align-items: center; justify-content: center; padding: 4vh 4vw; }
.glass-card { width: min(620px, 92vw); min-height: 56vh; display: flex; flex-direction: column;
              align-items: center; justify-content: center; text-align: center;
              padding: clamp(28px, 5vh, 56px) clamp(22px, 5vw, 60px);
              background: rgba(255, 255, 255, 0.13);
              backdrop-filter: blur(22px) saturate(1.35);
              -webkit-backdrop-filter: blur(22px) saturate(1.35);
              border: 1px solid rgba(255, 255, 255, 0.32);
              border-radius: clamp(18px, 3vw, 30px);
              box-shadow: 0 30px 80px -30px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255,255,255,.35);
              animation: card-in .6s cubic-bezier(.22, 1.2, .36, 1); }
@keyframes card-in { from { opacity: 0; transform: translateY(24px) scale(.97); } }

.eyebrow { font-size: 12px; letter-spacing: 4px; color: rgba(255,255,255,.85); font-weight: 600; margin-bottom: 14px; }
h1 { font-size: clamp(30px, 5vw, 46px); font-weight: 700; letter-spacing: 1px; text-shadow: 0 2px 14px rgba(0,0,0,.35); }
.lede { font-size: 14.5px; color: rgba(255,255,255,.85); margin: 14px 0 34px; line-height: 1.8; text-shadow: 0 1px 8px rgba(0,0,0,.3); }

/* ---------- 表单 ---------- */
.form-row { display: flex; width: 100%; max-width: 460px; background: rgba(255,255,255,.16);
            border: 1px solid rgba(255,255,255,.4); border-radius: 999px; padding: 6px;
            transition: background .25s, border-color .25s, box-shadow .25s; }
.form-row:focus-within { background: rgba(255,255,255,.92); border-color: #fff;
                         box-shadow: 0 8px 30px -8px rgba(0,0,0,.4); }
.form-row:focus-within input { color: #16283C; }
.form-row:focus-within input::placeholder { color: #93A1AF; }
.form-row.err { border-color: rgba(255,110,110,.9); animation: shake .35s ease; }
@keyframes shake { 25% { transform: translateX(-7px); } 75% { transform: translateX(7px); } }
input { flex: 1; min-width: 0; border: none; outline: none; background: transparent; color: #fff;
        font-size: 16px; letter-spacing: 1px; padding: 12px 18px; transition: color .25s; }
input::placeholder { color: rgba(255,255,255,.65); transition: color .25s; }
.btn { border: none; border-radius: 999px; background: #fff; color: #0E2A44; font-size: 15px; font-weight: 700;
       letter-spacing: 3px; padding: 12px 30px; cursor: pointer; transition: transform .15s, box-shadow .2s; white-space: nowrap; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 10px 24px -8px rgba(0,0,0,.5); }
.btn:active { transform: scale(.97); }
.btn:disabled { background: rgba(255,255,255,.45); color: rgba(14,42,68,.5); cursor: not-allowed; }
.hint { font-size: 12px; color: rgba(255,255,255,.7); margin-top: 16px; letter-spacing: 1px; }

/* ---------- 状态区（半透明结果卡） ---------- */
.status { display: none; margin-top: 26px; width: 100%; max-width: 460px; border-radius: 16px; padding: 22px 20px;
          background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.3); }
.status.show { display: block; animation: rise .3s ease; }
@keyframes rise { from { opacity: 0; transform: translateY(10px); } }
.badge { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font-size: 25px;
         margin: 0 auto 12px; color: #fff; }
.status.ok .badge { background: rgba(46, 204, 113, .9); box-shadow: 0 0 0 6px rgba(46,204,113,.2); }
.status.warn .badge { background: rgba(240, 165, 40, .92); box-shadow: 0 0 0 6px rgba(240,165,40,.2); }
.status.bad .badge { background: rgba(235, 87, 87, .92); box-shadow: 0 0 0 6px rgba(235,87,87,.2); }
.status-title { font-size: 17px; font-weight: 700; letter-spacing: 1px; text-shadow: 0 1px 6px rgba(0,0,0,.3); }
.status-desc { font-size: 13.5px; color: rgba(255,255,255,.92); margin-top: 8px; line-height: 1.9; white-space: pre-line; }
.loader { display: none; margin-top: 26px; width: 32px; height: 32px; border: 3.5px solid rgba(255,255,255,.3);
          border-top-color: #fff; border-radius: 50%; animation: spin .8s linear infinite; }
.loader.show { display: block; }
@keyframes spin { to { transform: rotate(360deg); } }

.dots { position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 3; display: flex; gap: 9px; }
.dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.4); transition: all .3s; }
.dots i.on { background: #fff; width: 22px; border-radius: 999px; }
.brand { position: fixed; top: 22px; left: 26px; z-index: 3; font-weight: 800; letter-spacing: 2px; font-size: 18px; text-shadow: 0 1px 8px rgba(0,0,0,.4); }
.brand i { color: #7FD4EA; font-style: normal; }