:root { color-scheme: light dark; }
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  line-height: 1.7;
  background: #f7f8fa;
  color: #1f2328;
}
.page {
  max-width: 640px;
  margin: 10vh auto;
  padding: 32px;
  border: 1px solid #e3e6ea;
  border-radius: 12px;
}
.success-mark {
  width: 48px;
  height: 48px;
  margin: 0 0 16px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #1a7f37;
  color: #fff;
  font-size: 26px;
  font-weight: 700;
}
h1 { margin: 0 0 8px; font-size: 28px; }
.lead { margin: 0 0 24px; opacity: .7; }
dl { display: grid; grid-template-columns: 120px 1fr; gap: 8px 16px; margin: 0 0 24px; }
dt { opacity: .65; }
dd { margin: 0; }
.badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  background: #eaecef;
  font-family: ui-monospace, monospace;
  font-size: 14px;
}
.badge.ok { background: #dafbe1; color: #1a7f37; }
.badge.error { background: #ffebe9; color: #cf222e; }
.hint { margin: 0; font-size: 13px; opacity: .55; }
a { color: #0969da; }

@media (prefers-color-scheme: dark) {
  body { background: #14171c; color: #e6e8eb; }
  .page { border-color: #2c313a; }
  .badge { background: #2c313a; }
  .badge.ok { background: #1b3a25; color: #7ee787; }
  .badge.error { background: #3d1c1c; color: #ff7b72; }
  .success-mark { background: #238636; }
  a { color: #7cb0ff; }
}