*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;max-width:600px;margin:2rem auto;padding:0 1rem;background:#fafafa;color:#333}h1{margin-bottom:1.5rem;font-size:1.75rem}.add-form{display:flex;gap:.5rem;margin-bottom:1.5rem}.add-form input[name=title]{flex:1;padding:.75rem;border:1px solid #ddd;border-radius:6px;font-size:1rem;outline:none;transition:border-color .2s}.add-form input[name=title]:focus{border-color:#333}.add-form input[type=date]{padding:.75rem;border:1px solid #ddd;border-radius:6px;font-size:.9rem;outline:none;transition:border-color .2s;color:#555}.add-form input[type=date]:focus{border-color:#333}.add-form button{padding:.75rem 1.5rem;background:#333;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:1rem;transition:background .2s}.add-form button:hover{background:#555}ul{list-style:none}li{display:flex;align-items:center;gap:.5rem;padding:.75rem 0;border-bottom:1px solid #eee}li.completed .todo-title{text-decoration:line-through;opacity:.5}.todo-content{flex:1;display:flex;flex-direction:column;gap:.15rem}.todo-title{font-size:1rem}.due-date{font-size:.8rem;color:#888}.due-date.overdue{color:#c00;font-weight:500}li form{margin:0;display:flex}.toggle,.delete{background:none;border:none;font-size:1.25rem;cursor:pointer;padding:.25rem .5rem;border-radius:4px;transition:background .2s}.toggle:hover,.delete:hover{background:#eee}.delete{color:#c00}.empty{color:#999;text-align:center;margin-top:2rem;font-size:.95rem}