:root { --bg: #fafaf9; --fg: #1c1917; --accent: #0f766e; --muted: #78716c; }
@media (prefers-color-scheme: dark) { :root { --bg: #1c1917; --fg: #fafaf9; --accent: #2dd4bf; --muted: #a8a29e; } }
body { margin: 0; background: var(--bg); color: var(--fg); font: 17px/1.5 system-ui, sans-serif;
       word-break: keep-all; overflow-wrap: break-word; }
main { max-width: 480px; margin: 0 auto; padding: 24px 16px; }
h1 { margin: 0 0 8px; }
#state { color: var(--muted); min-height: 1.5em; }
button { width: 100%; padding: 16px; margin: 8px 0; font-size: 18px; border: 0; border-radius: 12px;
         background: var(--accent); color: var(--bg); }
#end { background: #b91c1c; color: #fff; }
#log { list-style: none; padding: 0; }
#log li { padding: 8px 0; border-bottom: 1px solid color-mix(in srgb, var(--muted) 30%, transparent); }