*{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#f0f4f8;margin:0;padding:20px;line-height:1.6;color:#333}.learn h1{text-align:center;transform:rotateX(10deg);font-size:1.8rem;color:#10b981;margin-bottom:20px}.flex{display:flex;justify-content:space-between;align-items:center}.container{max-width:500px;margin:auto;background:#fff;padding:20px;border-radius:12px;box-shadow:0 4px 30px #0000001a}.input-group{display:flex;justify-content:space-between;margin-bottom:20px}input{flex:1;padding:10px;margin-right:5px;border:1px solid #ccc;border-radius:8px;font-size:1rem;transition:border-color .3s}input:focus{border-color:#10b981;outline:none}button{padding:10px 15px;background:#10b981;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:background .3s}button:hover{background:#059669}ul{list-style:none;padding:0}li{background:#e5e7eb;margin:5px 0;padding:10px;border-radius:8px;transition:background .3s}li:hover{background:#d1d5db}.completed-item{text-decoration:line-through;color:gray;background:#f0f0f0}.actions{display:flex}.actions button{margin-left:5px;padding:5px 10px;background:#3b82f6;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:.9rem}.actions button:hover{background:#2563eb}.actions button:nth-child(2){background:#ef4444}.actions button:nth-child(2):hover{background:#dc2626}.message{background:#d1fae5;color:#065f46;text-align:center;padding:10px;border-radius:8px;margin:20px 0;font-weight:700}.progress-container{background:#d1fae5;border-radius:20px;overflow:hidden;margin:20px 0}.progress{background:#34d399;height:25px;line-height:25px;text-align:center;color:#fff;font-weight:700;transition:width .5s}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;display:flex;justify-content:center;align-items:center;z-index:10}.modal{background:#fff;padding:20px;border-radius:8px;width:90%;max-width:400px}.modal input{width:100%;margin:10px 0;padding:8px}.modal-buttons{display:flex;justify-content:flex-end}.modal-buttons button{margin-left:10px}.accordion-content{padding:10px;background:#f9fafb;border-top:1px solid #e5e7eb}@media (max-width: 768px){.container{max-width:90%;padding:15px}.input-group{flex-direction:column}input{width:100%;margin:0 0 10px}button{width:100%;margin-bottom:10px}.flex{flex-direction:column;align-items:flex-start}.actions{margin-top:10px}}@media (max-width: 480px){.learn h1{font-size:1.5rem}input,button{font-size:.95rem}}
