:root { color-scheme: dark; --fg: #f2f2f2; --dim: #8a8a8a; --line: #2a2a2a; }
* { box-sizing: border-box; }
body { margin: 0; background: #000; color: var(--fg); font: 16px/1.7 ui-monospace, "SF Mono", Menlo, monospace; }
main { max-width: 560px; margin: 0 auto; padding: max(32px, env(safe-area-inset-top)) 20px 48px; }
h1 { font-size: 28px; letter-spacing: .08em; margin: 0; }
h2 { font-size: 14px; color: var(--dim); font-weight: 500; margin: 0 0 8px; }
.lead { margin: 4px 0 32px; color: var(--dim); }
.block { border-top: 1px solid var(--line); padding: 20px 0; }
label { display: block; font-size: 14px; color: var(--dim); margin-bottom: 6px; }
input { width: 100%; font: inherit; color: var(--fg); background: #0d0d0d; border: 1px solid var(--line); padding: 12px; border-radius: 6px; margin-bottom: 12px; }
button { font: inherit; background: var(--fg); color: #000; border: 0; padding: 12px 18px; border-radius: 6px; cursor: pointer; margin: 4px 8px 4px 0; }
button.ghost { background: transparent; color: var(--fg); border: 1px solid var(--line); }
button:disabled { opacity: .4; cursor: default; }
.mono { font-size: 15px; word-break: break-all; margin: 0 0 8px; }
.note { font-size: 13px; color: var(--dim); margin: 8px 0 0; }
ol { padding-left: 20px; font-size: 14px; margin: 0; }
#message { min-height: 1.7em; color: var(--fg); }