*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}body{background:linear-gradient(135deg,#1e1e2f,#2a2a40);min-height:100vh;display:flex;justify-content:center;align-items:center;color:#fff;transition:.3s}.container{background:linear-gradient(135deg,#3a3a52,#2a2a40);width:100%;max-width:550px;padding:40px;border-radius:18px;box-shadow:0 12px 35px #000000b3;transition:.3s}.container:hover{transform:translateY(-8px)}.container form{display:flex;gap:12px;justify-content:space-between;align-items:center;position:relative}input[type=text]{flex:1;padding:14px 20px;font-size:16px;background:#1c1c2e;color:#fff;border:none;border-radius:12px 0 0 12px;outline:none;transition:.3s;box-shadow:inset 0 0 10px #111,0 0 15px #00000080}input[type=text]:focus{box-shadow:0 0 12px #4caf50,0 0 18px #81c784;border:1px solid #4caf50;transform:scale(1.02)}input::placeholder{color:#aaa;font-style:italic}button{padding:14px 28px;font-size:16px;color:#fff;background:linear-gradient(135deg,#ff9800,#ff5722);border:none;border-radius:0 12px 12px 0;cursor:pointer;transition:.3s;box-shadow:0 4px 15px #ff980080,0 0 15px #ff5722;position:relative;overflow:hidden}button:hover{background:linear-gradient(135deg,#ff5722,#ff9800);box-shadow:0 0 20px #ff9800,0 0 25px #ff5722;transform:scale(1.05)}button:before{content:"";position:absolute;top:50%;left:50%;width:400%;height:400%;background:radial-gradient(circle,#fff,transparent);transition:.5s;transform:translate(-50%,-50%) scale(0);opacity:.5}button:hover:before{transform:translate(-50%,-50%) scale(1);opacity:0}.todos-list{list-style:none;margin-top:20px}.todo{display:flex;justify-content:space-between;align-items:center;background:#292940;padding:18px 20px;border:1px solid #444;border-radius:12px;margin:12px 0;transition:.3s;box-shadow:0 8px 20px #00000080}.todo:hover{transform:scale(1.05);border:1px solid #ff9800}.todo span{font-size:18px;font-weight:500;color:#f1f1f1}.close{background:linear-gradient(135deg,#e91e63,#ff1744);color:#fff;border:none;width:42px;height:42px;font-size:18px;font-weight:700;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.3s;box-shadow:0 0 10px #ff1744}.close:hover{background:linear-gradient(135deg,#ff1744,#e91e63);box-shadow:0 0 15px #e91e63;transform:scale(1.1)}@media (max-width: 768px){.container{width:90%;padding:30px}.container form{flex-direction:column}input[type=text]{width:100%;border-radius:12px}button{width:60%;border-radius:12px;margin:10px auto 0;display:block;text-align:center}.close{width:36px;height:36px;font-size:14px}}