*{box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}body{background:#f1f3f6}.box{background:#fff;border-radius:8px;width:380px;margin:50px auto;padding:20px;box-shadow:0 4px 10px #00000014}h2{text-align:center;color:#333;margin-bottom:15px}.form input{border:1px solid #ccc;border-radius:5px;outline:none;width:100%;margin-bottom:8px;padding:10px}.form input:focus{border-color:#4f46e5}.form button{color:#fff;cursor:pointer;background:#4f46e5;border:none;border-radius:5px;width:100%;padding:10px}.form button:hover{background:#4338ca}.card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:6px;margin-top:12px;padding:12px}.card.completed{background:#ecfdf5}.card.pending{background:#fff7ed}.card h4{color:#111;margin:0}.card p{color:#555;margin:5px 0;font-size:14px}.card small{color:#666;font-size:12px}.btns{gap:8px;margin-top:8px;display:flex}.btns button{cursor:pointer;border:none;border-radius:4px;flex:1;padding:6px;font-size:13px}.btns button:first-child{color:#fff;background:#0ea5e9}.btns button:nth-child(2){color:#fff;background:#22c55e}.btns button:nth-child(3){color:#fff;background:#ef4444}.btns button:hover{opacity:.9}.error{color:red;margin-bottom:6px;font-size:12px}