body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0;padding:0;background:#f5f7fa;display:flex;justify-content:center;align-items:flex-start;min-height:100vh}.app{background:#fff;padding:2rem;margin-top:3rem;border-radius:12px;box-shadow:0 4px 16px #0000001a;width:90%;max-width:500px;text-align:center}h1{color:#333;margin-bottom:1.5rem}input{padding:.5rem 1rem;border:1px solid #ccc;border-radius:8px;width:70%;font-size:1rem;margin-right:.5rem}button{padding:.5rem 1rem;background:#4caf50;color:#fff;border:none;border-radius:8px;font-size:1.5rem;cursor:pointer;transition:background .2s ease-in-out}button:hover{background:#45a049}.list-container{margin-top:2rem;text-align:left}ul{list-style:none;padding:0}li{background:#f1f1f1;margin-bottom:.75rem;padding:.75rem 1rem;border-radius:8px;display:flex;justify-content:space-between;align-items:center}li button{background:#ff4d4d;font-size:1rem;padding:.4rem .8rem}li button:hover{background:#e63946}p{color:#777;font-style:italic}li.done span{text-decoration:line-through;color:#888}.btn-group{display:flex;gap:.5rem}li button:first-child{background:#2196f3}li button:first-child:hover{background:#1976d2}li input{margin-right:.5rem;padding:4px 8px;font-size:1rem;border:1px solid #ccc;border-radius:4px}li input:focus{outline:none;border-color:#2196f3}li button{margin-left:5px;padding:4px 8px;border:none;border-radius:4px;cursor:pointer}li button:hover{opacity:.9}.inputDiv{display:flex}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center}.modal{background:#fff;padding:2rem;border-radius:10px;box-shadow:0 0 15px #0003;text-align:center}.modal button{margin-top:1rem;padding:6px 12px;background-color:#2196f3;color:#fff;border:none;border-radius:5px;cursor:pointer}.modal button:hover{background-color:#1976d2}.editButton{background-color:#ffc74d}.editButton:hover{background-color:#ffae00}.animated-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden;pointer-events:none}.box{position:absolute;background-color:#d3d3d399;border:1px solid black;animation:spinAndFade 6s ease-out forwards;border-radius:2px;transform-origin:center}@keyframes spinAndFade{0%{transform:rotate(0) scale(1);opacity:1}to{transform:rotate(360deg) scale(1.5);opacity:0}}