:root { color-scheme: light dark; font-family: system-ui, sans-serif; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; padding: 24px; height: 100vh; display: flex; flex-direction: column; gap: 12px; }
header, footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
h1, p { margin: 0; }
h1 { font-size: 24px; }
small { opacity: .75; overflow-wrap: anywhere; }
pre { flex: 1; min-height: 80px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid #718096; border-radius: 8px; padding: 16px; line-height: 1.55; font: inherit; margin: 0; user-select: text; }
.consent { display: flex; align-items: flex-start; gap: 10px; }
.consent-copy { display: grid; gap: 8px; }
input { margin-top: 5px; }
button, select { font: inherit; padding: 9px 14px; border: 1px solid #718096; border-radius: 6px; }
button { cursor: pointer; }
#accept { background: #1761b1; color: white; }
button:disabled { opacity: .45; cursor: default; }
#error { color: #d54242; }