:root{--bg:#f5f7fb;--card:#fff;--fg:#0f172a;--muted:#64748b;--accent:#10b981;}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0; font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
   background:var(--bg); color:var(--fg); display:grid; place-items:center;}
.shell{width:min(960px,92vw); margin:auto;}
.card{background:var(--card); border-radius:18px; padding:48px; text-align:center;
      box-shadow:0 10px 25px rgba(2,6,23,.08),0 2px 6px rgba(2,6,23,.06);}
h1{font-size:clamp(28px,3vw,42px); line-height:1.15; margin:0 0 10px}
p.lead{color:var(--muted); font-size:18px; margin:0 0 24px}
.code{display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:20px;
      padding:12px 16px; border-radius:12px; background:#f0fdf4; border:1px solid #dcfce7; color:#059669;}
.divider{height:1px; background:linear-gradient(90deg,transparent,#e5e7eb,transparent); margin:28px 0}
.btn{appearance:none; border:none; background:#0f172a; color:#fff; padding:12px 18px; border-radius:12px; cursor:pointer; font-weight:600}
.btn.secondary{background:#0ea5e9}
.btn:disabled{opacity:.6; cursor:not-allowed}
footer{margin-top:18px; text-align:center; color:var(--muted); font-size:12px}
.flag{font-size:26px}
@media (max-width:560px){ .card{padding:28px;} }