:root { color-scheme: light dark; --testo: #1b1b1b; --fondo: #f6f5f2; --accento: #1f6f5c; --tenue: #666; }
@media (prefers-color-scheme: dark) { :root { --testo: #eee; --fondo: #161616; --accento: #4fb79b; --tenue: #aaa; } }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; font: 17px/1.45 -apple-system, system-ui, sans-serif; color: var(--testo); background: var(--fondo); }
main { max-width: 34rem; margin: 0 auto; padding: 24px 16px 48px; }
h1 { font-size: 1.4rem; margin: 0 0 12px; }
.tag { font-size: .75rem; font-weight: 600; color: var(--tenue); border: 1px solid currentColor; border-radius: 6px; padding: 1px 6px; vertical-align: middle; }
.nota { color: var(--tenue); font-size: .9rem; }
.nascosto { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.scegli { display: block; text-align: center; background: var(--accento); color: #fff; font-weight: 600; border-radius: 12px; padding: 16px; margin: 16px 0; cursor: pointer; }
progress { width: 100%; height: 14px; }
#stato { font-weight: 600; min-height: 1.5em; }
button { font: inherit; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--tenue); background: transparent; color: var(--testo); }
dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 16px 0; word-break: break-all; }
dt { color: var(--tenue); }
dd { margin: 0; font-family: ui-monospace, monospace; font-size: .9rem; }