:root{--bg:#F5F5F7;--card:#FFFFFF;--text:#1D1D1F;--muted:#6E6E73;--line:#E5E5EA;--accent:#0071E3;--ok:#34C759;--bad:#FF3B30;--grad:linear-gradient(135deg,#5B4BFF,#C63DF5 55%,#FF7A59)}
@media (prefers-color-scheme:dark){:root{--bg:#000;--card:#1C1C1E;--text:#F5F5F7;--muted:#A1A1A6;--line:#38383A;--accent:#0A84FF}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Tahoma,Arial,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
.hero{background:var(--grad);color:#fff;text-align:center;padding:40px 16px 34px}
.logo{display:inline-block;direction:ltr;text-align:left;text-decoration:none;color:#fff}
.logo b{display:block;font-size:44px;font-weight:800;letter-spacing:-1.5px;line-height:1}
.logo span{display:block;text-align:right;font-size:17px;font-weight:600;letter-spacing:1px;opacity:.9}
.wrap{max-width:560px;margin:-18px auto 40px;padding:0 16px}
.card{background:var(--card);border-radius:22px;padding:28px 24px;box-shadow:0 8px 30px rgba(0,0,0,.06)}
h1{font-size:24px;margin:0 0 8px}
h2{font-size:18px;margin:26px 0 6px}
p,li{color:var(--muted);font-size:15px}
.btn{display:block;width:100%;border:0;border-radius:14px;min-height:52px;padding:14px 18px;font-size:17px;font-weight:700;cursor:pointer;text-align:center;text-decoration:none;font-family:inherit}
.btn.primary{background:var(--accent);color:#fff}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--line);margin-top:10px}
.btn[disabled]{opacity:.6;cursor:default}
.center{text-align:center}
.badge{width:92px;height:92px;border-radius:50%;margin:4px auto 16px;display:flex;align-items:center;justify-content:center;transform:scale(0);animation:pop .45s cubic-bezier(.2,1.4,.4,1) forwards}
.badge.ok{background:var(--ok)}.badge.bad{background:var(--bad)}
.badge svg{width:46px;height:46px;stroke:#fff;stroke-width:4;fill:none;stroke-linecap:round;stroke-linejoin:round}
@keyframes pop{to{transform:scale(1)}}
input{width:100%;min-height:50px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);padding:0 14px;font-size:16px;margin:6px 0 12px;font-family:inherit}
.err{color:var(--bad);font-size:14px;min-height:20px}
.lang{display:flex;justify-content:center;gap:8px;margin-top:18px}
.lang button{background:none;border:0;color:var(--muted);font-size:14px;cursor:pointer;padding:8px;font-family:inherit}
.lang button.on{color:var(--text);font-weight:700}
footer{text-align:center;color:var(--muted);font-size:13px;padding:0 16px 30px}
footer a{color:var(--muted)}
.hide{display:none}