* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: #F8F6F2;
    color: #111111;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;background:#f8f7f4;color:#111;display:flex;justify-content:center;align-items:center;min-height:100vh;padding:24px}
.wrap{width:100%;max-width:390px}
.logo{text-align:center;font-size:36px;font-weight:700;letter-spacing:2px}
.logo span{display:block;margin-top:8px;font-size:12px;color:#888;letter-spacing:4px}
h1{text-align:center;margin:42px 0 14px;font-size:34px}
.sub{text-align:center;color:#777;line-height:1.6;margin-bottom:34px}
.item{display:flex;align-items:center;gap:12px;padding:12px 0;font-size:17px}
.btn{display:block;margin-top:36px;background:#25D366;color:#fff;text-decoration:none;text-align:center;padding:18px;border-radius:16px;font-size:20px;font-weight:700;box-shadow:0 8px 18px rgba(37,211,102,.18)}
.foot{text-align:center;margin-top:24px;color:#888;font-size:14px}
#loading{position:fixed;inset:0;background:rgba(255,255,255,.96);display:flex;flex-direction:column;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:.2s}
#loading.show{opacity:1;visibility:visible}
.spinner{width:42px;height:42px;border:4px solid #ddd;border-top-color:#25D366;border-radius:50%;animation:s .8s linear infinite;margin-bottom:20px}
@keyframes s{to{transform:rotate(360deg)}}