:root{--bg: #0f172a;--card: #1e293b;--accent: #22c55e;--text: #e2e8f0;--muted: #94a3b8}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text)}.wrap{max-width:520px;margin:0 auto;padding:1.5rem 1rem 3rem}header h1{margin:0;font-size:1.6rem}.sub{margin:.25rem 0 1rem;color:var(--muted)}.add{display:flex;gap:.5rem;margin-bottom:1rem}.add input{flex:1;padding:.7rem .9rem;border:1px solid #334155;border-radius:10px;background:var(--card);color:var(--text);font-size:1rem}.add button{padding:0 1.1rem;border:none;border-radius:10px;background:var(--accent);color:#06210f;font-weight:600;cursor:pointer}.filters{display:flex;gap:.4rem;margin-bottom:1rem}.filters button{flex:1;padding:.45rem;border:1px solid #334155;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}.filters button.active{background:var(--card);color:var(--text);border-color:var(--accent)}.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem}.list li{display:flex;align-items:center;justify-content:space-between;padding:.7rem .9rem;background:var(--card);border-radius:10px}.list li label{display:flex;align-items:center;gap:.6rem;cursor:pointer;flex:1}.list li input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}.list li.done span{text-decoration:line-through;color:var(--muted)}.list .empty{justify-content:center;color:var(--muted);background:transparent}.del{background:none;border:none;color:var(--muted);font-size:1rem;cursor:pointer}.del:hover{color:#ef4444}.clear{margin-top:1rem;width:100%;padding:.6rem;border:1px dashed #334155;border-radius:10px;background:transparent;color:var(--muted);cursor:pointer}.foot{margin-top:1.5rem;text-align:center;color:var(--muted);font-size:.8rem}.link{background:none;border:none;color:var(--accent);padding:0;font:inherit;cursor:pointer;text-decoration:underline}
