:root { --bg:#f4f5f7; --surface:#fff; --border:#e4e7ec; --text:#16202c; --muted:#667085; --primary:#2563eb; --primary-dark:#1d4ed8; --ok:#16a34a; --danger:#dc2626; --gold:#f6b73c; --gold-bg:#fff7e6; --gold-ink:#7a4e08; }
* { box-sizing:border-box; } html,body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:16px;}
.wrap { max-width:480px; margin:0 auto; padding:max(env(safe-area-inset-top,0px),20px) 16px 40px; }
.brand { text-align:center; font-weight:800; font-size:20px; margin:14px 0 4px; }
.brand span { color:var(--primary); }
.lead { text-align:center; color:var(--muted); margin-bottom:18px; font-size:14px; }
.card { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:20px; box-shadow:0 1px 3px rgba(16,24,40,.05); }
h1 { font-size:21px; margin:0 0 4px; } h2{font-size:18px;margin:0;}
.field { margin-bottom:14px; } label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px;}
label .opt { color:var(--muted); font-weight:400; }
input { width:100%; padding:13px; font-size:16px; border:1px solid #c8cdd6; border-radius:10px; background:var(--surface); }
input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(37,99,235,.12);}
input.invalid{border-color:var(--danger);}
.hint{font-size:12px;color:var(--muted);margin-top:5px;}
.err{color:var(--danger);font-size:12.5px;margin-top:5px;}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:15px;border-radius:11px;border:1px solid var(--primary);background:var(--primary);color:#fff;font-size:17px;font-weight:700;cursor:pointer;min-height:54px;}
.btn:disabled{opacity:.6;cursor:not-allowed;}
.terms{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--text);}
.terms input{width:20px;height:20px;margin-top:1px;flex:none;}
.refbox{background:var(--gold-bg);border:1px solid #f3d690;border-radius:10px;padding:12px;margin-bottom:14px;font-size:14px;color:var(--gold-ink);}
.refbox b{font-weight:700;}
.success{text-align:center;padding:30px 10px;}
.success .ic{width:64px;height:64px;border-radius:50%;background:#ecfdf5;color:var(--ok);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.success .ic svg{width:34px;height:34px;}
.linkbtn{background:none;border:none;color:var(--primary);font-size:15px;cursor:pointer;padding:10px;}
.toasts{position:fixed;left:0;right:0;bottom:20px;display:flex;flex-direction:column;align-items:center;gap:8px;}
.toast{background:#16202c;color:#fff;padding:11px 18px;border-radius:999px;font-size:14px;}
.toast.err{background:var(--danger);} .toast.ok{background:var(--ok);}
.muted{color:var(--muted);}

/* join → sign-in CTA */
.signin-cta { text-align:center; margin:18px 0 8px; font-size:15px; }
.signin-cta a { color:var(--primary); font-weight:600; text-decoration:none; }
.signin-cta a:hover { text-decoration:underline; }
