.app{max-width:500px;margin:50px auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}h1{text-align:center;color:#333;margin-bottom:30px}.input-container{display:flex;gap:10px;margin-bottom:20px}input{flex:1;padding:12px;border:2px solid #ddd;border-radius:6px;font-size:16px}input:focus{outline:none;border-color:#4caf50}button{padding:12px 24px;background:#4caf50;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:16px;font-weight:500}button:hover{background:#45a049}.todo-list{list-style:none;padding:0}.todo-list li{display:flex;justify-content:space-between;align-items:center;padding:12px;margin-bottom:8px;background:#f9f9f9;border-radius:6px;transition:all .2s}.todo-list li:hover{background:#f0f0f0}.todo-list li.done{opacity:.6}.todo-list li.done span{text-decoration:line-through}.todo-list li span{flex:1;cursor:pointer;-webkit-user-select:none;user-select:none}.todo-list li button{background:#f44336;padding:8px 16px;font-size:14px}.todo-list li button:hover{background:#da190b}*{margin:0;padding:0;box-sizing:border-box}body{background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;padding:20px}