:root { --fg:#0f172a; --muted:#475569; --ok:#0ea5e9; --err:#dc2626; --bd:#e2e8f0; --bg:#ffffff; --codebg:#0f172a; --codefg:#e2e8f0; }
* { box-sizing:border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol"; color:var(--fg); background:var(--bg); }
.wrap { max-width: 560px; margin: 8vh auto; padding: 24px; }
.card { border:1px solid var(--bd); border-radius: 16px; padding: 24px; box-shadow: 0 8px 24px rgba(2,6,23,.06); background:#fff; }
h1 { margin:0 0 8px; font-size: 1.25rem; font-weight: 700; letter-spacing: -0.01em; }
p.lead { margin:0 0 16px; color:var(--muted); }
.row { display:flex; gap:12px; align-items:center; flex-wrap: wrap; }
button { appearance:none; border:1px solid var(--bd); background:#fff; padding:10px 14px; border-radius:12px; font-weight:600; cursor:pointer; transition:transform .02s ease, box-shadow .2s ease, border-color .2s ease; }
button:hover { box-shadow: 0 6px 16px rgba(2,6,23,.08); }
button:disabled { opacity:.6; cursor: not-allowed; box-shadow:none; }
.btn-primary { background:var(--ok); color:#fff; border-color: transparent; }
.btn-secondary { background:#f8fafc; }
.btn-danger { background: #fee2e2; border-color:#fecaca; color:#991b1b; }
.codebox {
  display:none;
  margin: 16px 0;
  padding: 18px 20px;
  background: var(--codebg);
  color: var(--codefg);
  border-radius: 14px;
  font: 700 28px/1.2 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  letter-spacing: .16em;
  text-align: center;
  user-select: text;
}
.hint { font-size:.9rem; color:var(--muted); margin-top: 6px; }
.alert { margin-top: 12px; padding: 12px 14px; border-radius: 12px; display:none; }
.alert.show { display:block; }
.alert.err { background:#fef2f2; color:#7f1d1d; border:1px solid #fecaca; }
.alert.ok { background:#ecfeff; color:#0c4a6e; border:1px solid #bae6fd; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }