:root { --ink:#1a1d24; --muted:#5b6472; --line:#e3e6ec; --accent:#3a6ff7; --bg:#f6f7f9; --ok:#1f9d63; }
* { box-sizing: border-box; }
body {
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  display:flex; min-height:100vh; align-items:flex-start; justify-content:center;
}
.wrap { width:760px; max-width:94vw; margin:48px 0; }
.brand { color:var(--accent); font-weight:800; letter-spacing:.3px; }
h1 { font-size:28px; margin:6px 0 4px; }
.sub { color:var(--muted); margin:0 0 28px; }
.plans { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.plan {
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px;
  display:flex; flex-direction:column;
}
.plan.featured { border-color:var(--accent); box-shadow:0 6px 22px rgba(58,111,247,.12); }
.plan h2 { margin:0 0 2px; font-size:18px; }
.price { font-size:30px; font-weight:800; margin:6px 0; }
.price small { font-size:14px; font-weight:500; color:var(--muted); }
.feat { color:var(--muted); font-size:14px; margin:0 0 16px; }
.btns { margin-top:auto; min-height:46px; }
.note { color:var(--muted); font-size:13px; margin-top:22px; }
.alt { text-align:center; margin-top:18px; }
.alt a { color:var(--accent); }
.card {
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:28px; margin-top:10px;
}
.token {
  display:flex; gap:8px; margin:14px 0;
}
.token input {
  flex:1; font:14px/1.4 ui-monospace,Menlo,Consolas,monospace;
  padding:12px; border:1px solid var(--line); border-radius:10px; background:#fbfcfe;
}
.btn {
  cursor:pointer; border:none; font:inherit; font-weight:600; padding:12px 16px;
  border-radius:10px; background:var(--accent); color:#fff;
}
.btn.ghost { background:transparent; border:1px solid var(--line); color:var(--ink); }
.status { padding:12px 14px; border-radius:10px; background:#eef6f0; color:var(--ok); font-weight:600; }
.status.wait { background:#fff7e6; color:#9a6b00; }
ol { padding-left:20px; } ol li { margin:6px 0; }
.warn { color:#9a6b00; background:#fff7e6; padding:12px 14px; border-radius:10px; }
.support { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:26px; }
.sbtn {
  text-decoration:none; font-weight:600; font-size:14px; padding:10px 16px;
  border-radius:999px; border:1px solid var(--line); color:var(--ink); background:#fff;
}
.sbtn:hover { border-color:var(--accent); color:var(--accent); }
.sbtn.wa { background:#25d366; color:#fff; border-color:#25d366; }
.sbtn.wa:hover { filter:brightness(1.05); color:#fff; }
