:root{--bg:#f6f7f9;--card:#fff;--text:#1f2328;--muted:#6b7280;--border:#e3e5e8;--accent:#2563eb;--danger:#dc2626}@media (prefers-color-scheme:dark){:root{--bg:#16181c;--card:#1f2227;--text:#e6e8eb;--muted:#9aa0a8;--border:#2f333a;--accent:#60a5fa;--danger:#f87171}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,sans-serif}#app{max-width:480px;margin:48px auto;padding:0 16px}#new-todo{gap:8px;margin-bottom:16px;display:flex}#task-input{font:inherit;color:inherit;background:var(--card);border:1px solid var(--border);border-radius:8px;flex:1;padding:10px 12px}button{font:inherit;cursor:pointer;color:#fff;background:var(--accent);border:none;border-radius:8px;padding:8px 14px}#list{margin:0;padding:0;list-style:none}#list li{background:var(--card);border:1px solid var(--border);border-radius:8px;align-items:center;gap:12px;margin-bottom:8px;padding:10px 12px;display:flex}#list li span{flex:1}#list li button{color:var(--danger);background:0 0}#list li.done span{color:var(--muted);text-decoration:line-through}