:root { color-scheme: light dark; }
body { font: 16px/1.6 system-ui, sans-serif; margin: 0; color: #1c1c1c; background: #fff; }
.site-header, main, .site-footer { max-width: 44rem; margin: 0 auto; padding: 1rem 1.25rem; }
.brand { font-weight: 700; font-size: 1.25rem; text-decoration: none; color: inherit; }
h1 { font-size: 1.75rem; line-height: 1.25; }
h2 { font-size: 1.25rem; margin-top: 2rem; }
a { color: #0b57d0; }
code { background: #f1f1f1; padding: 0 .25em; border-radius: 3px; }
.price { font-size: 2rem; font-weight: 700; margin: .25rem 0; }
.site-footer { border-top: 1px solid #ddd; margin-top: 3rem; font-size: .9rem; }
.site-footer nav a, .site-footer nav span { margin-right: 1rem; }
.hidden { display: none; }
button { font: inherit; padding: .6rem 1.2rem; border: 0; border-radius: 6px; background: #0b57d0; color: #fff; cursor: pointer; }
button:disabled { opacity: .6; cursor: default; }
.restore-code { font: 1.25rem monospace; background: #f1f1f1; padding: .75rem; border-radius: 6px; word-break: break-all; }
.error { color: #b3261e; }
@media (prefers-color-scheme: dark) {
  body { color: #e6e6e6; background: #151515; }
  a { color: #8ab4f8; }
  code, .restore-code { background: #2a2a2a; }
  .site-footer { border-color: #333; }
}