:root{--color-bg:#f8fafc;--color-surface:#fff;--color-text:#0f172a;--color-muted:#64748b;--color-border:#e2e8f0;--color-accent:#6366f1;--color-on-accent:#fff;--color-danger:#dc2626;--color-focus:var(--color-accent);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-8:2rem;--radius-md:.5rem;--font-family:system-ui, sans-serif}body{font-family:var(--font-family);background:var(--color-bg);color:var(--color-text);margin:0}main{max-width:32rem;margin:var(--space-8) auto;padding:0 var(--space-4)}form{gap:var(--space-2);margin-bottom:var(--space-4);display:flex}input,button{font:inherit;padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md)}form input{flex:1}button{background:var(--color-accent);color:var(--color-on-accent);cursor:pointer;border-color:#0000}:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}ul{margin:0;padding:0;list-style:none}li{justify-content:space-between;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);margin-bottom:var(--space-2);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);display:flex}li label{align-items:center;gap:var(--space-2);display:flex}li button{color:var(--color-danger);padding:0 var(--space-2);background:0 0}.done{color:var(--color-muted);text-decoration:line-through}.muted{color:var(--color-muted)}