*{box-sizing:border-box;margin:0;padding:0}body{background:#f5f5f5;font-family:sans-serif}.app{max-width:900px;margin:0 auto;padding:24px}header{margin-bottom:24px}button{cursor:pointer;padding:10px 18px}section{margin-top:24px}.toolbar{gap:16px;margin:20px 0;display:flex}.toolbar input{flex:1;padding:10px}.checkbox{margin-bottom:20px;display:block}.task-list{flex-direction:column;gap:16px;display:flex}.task-card{background:#fff;border-radius:8px;padding:16px;box-shadow:0 2px 6px #0000001a}.task-card h3{margin-bottom:10px}body{background-color:#f5f5f5;margin:0;font-family:Arial,Helvetica,sans-serif}h1{text-align:center;margin:30px 0}.toolbar{justify-content:center;gap:10px;margin-bottom:20px;display:flex}.toolbar input{width:250px;padding:8px}.toolbar button{cursor:pointer;padding:8px 16px}.checkbox{text-align:center;margin-bottom:20px;display:block}.task-list{width:80%;margin:auto}.task-card{text-align:left;background:#fff;border-radius:10px;margin-bottom:15px;padding:15px;box-shadow:0 2px 8px #00000026}.task-card h3{margin-top:0}.task-card button{cursor:pointer;margin-right:10px;padding:6px 12px}form{background:#fff;border-radius:10px;width:80%;margin:30px auto;padding:20px;box-shadow:0 2px 8px #00000026}form input,form textarea{box-sizing:border-box;width:100%;padding:8px}form button{margin-top:15px;padding:10px 20px}.priority{color:#fff;border-radius:20px;padding:4px 10px;font-size:14px;font-weight:700;display:inline-block}.priority-high{background-color:#e74c3c}.priority-medium{background-color:#f39c12}.priority-low{background-color:#27ae60}.deadline-warning{color:#fff;background-color:#e74c3c;border-radius:10px;margin-left:10px;padding:4px 8px;font-size:12px;font-weight:700}.completed{color:#999;text-decoration:line-through}.task-card:has(.completed){opacity:.7}.modal-overlay{background:#0006;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.modal-content{background:#fff;border-radius:12px;width:400px;padding:25px;box-shadow:0 4px 15px #0000004d}.modal-content h2{margin-top:0}.modal-content button{cursor:pointer;margin-top:15px;padding:8px 20px}.react-calendar{background:#fff;border-radius:10px;width:700px;max-width:90%;margin:30px auto;padding:20px}.react-calendar__tile{height:80px;overflow:hidden}.calendar-task{white-space:nowrap;font-size:12px;overflow:hidden}.calendar-high{color:red}.calendar-medium{color:orange}.calendar-low{color:green}