:root { color-scheme: light dark; --bg: #fbfaf7; --fg: #1d1b18; --muted: #6b665e; --line: #d9d4ca; --err: #a3271b; }
@media (prefers-color-scheme: dark) { :root { --bg: #171614; --fg: #ece8e1; --muted: #a39d93; --line: #3a3732; --err: #f08a7e; } }
body { background: var(--bg); color: var(--fg); font: 16px/1.5 system-ui, sans-serif; margin: 0; padding: 24px 16px; }
main { max-width: 36rem; margin: 0 auto; }
p { color: var(--muted); }
button { display: block; width: 100%; text-align: left; font: inherit; padding: 12px 14px; margin: 8px 0;
  background: none; color: inherit; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; }
#err { color: var(--err); }