/* Match the reference's actual font stack; it does not load Space Mono. */
* { box-sizing: border-box; margin: 0; padding: 0; }
:root { color-scheme: light dark; background: #fff; color: #171717; font-family: "Space Mono", monospace; }
body { min-width: 280px; }
main { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 32px; }
picture, img { display: block; width: 96px; height: 96px; }
.readout { position: relative; text-align: center; }
.counter { font-size: 30px; line-height: 36px; font-weight: 400; font-variant-numeric: tabular-nums; white-space: nowrap; }
h1 { position: absolute; top: calc(100% + 18px); left: 50%; transform: translateX(-50%); width: max-content; max-width: calc(100vw - 24px); font-size: 12px; line-height: 20px; font-weight: 400; color: #737373; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (prefers-color-scheme: dark) { :root { background: #0a0a0a; color: #fff; } h1 { color: #737373; } }
@media (max-width: 359px) { .counter { font-size: 25px; } }