body{margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:flex;justify-content:center;align-items:center;height:100vh}.app{background:rgba(255,255,255,.15);padding:25px;border-radius:20px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 8px 32px #0000004d;width:360px;animation:fadeIn .5s ease-in-out;color:#fff}.app h1{text-align:center;font-size:1.6rem;margin-bottom:20px;font-weight:700}.input-container{display:flex;gap:10px;margin-bottom:20px}.input-container input{flex:1;padding:10px;border-radius:8px;border:none;outline:none;font-size:.95rem;background:rgba(255,255,255,.8)}.input-container button{background:linear-gradient(135deg,#6a11cb,#2575fc);color:#fff;border:none;border-radius:8px;padding:10px 15px;cursor:pointer;font-size:.95rem;transition:transform .1s ease,box-shadow .3s ease}.input-container button:hover{box-shadow:0 4px 15px #0003}.input-container button:active{transform:scale(.95)}.todo-list{max-height:250px;overflow-y:auto;padding-right:5px}.todo-list::-webkit-scrollbar{width:6px}.todo-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.4);border-radius:3px}.todo{background:rgba(255,255,255,.9);padding:10px 12px;border-radius:10px;display:flex;align-items:center;gap:10px;margin-bottom:8px;transition:transform .2s ease,background .3s ease;color:#333}.todo:hover{transform:translateY(-2px);background:rgba(255,255,255,1)}.todo input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:#6a11cb;transform:scale(1);transition:transform .2s ease}.todo input[type=checkbox]:checked{transform:scale(1.2)}.todo span{flex:1}.todo span.completed{text-decoration:line-through;color:gray}.empty{text-align:center;font-style:italic;opacity:.8}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}h2{margin-top:20px;margin-bottom:10px;font-size:1.2rem;color:#fff}