*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}body{width:100%;height:100vh;background-color:#f0f0f0}.layout-container{display:flex;flex-direction:column;justify-content:space-between;height:100vh;opacity:0;transform:translateY(10px) scale(.9);animation:fadeIn .8s ease-out forwards;animation-delay:.2s}.layout-header{flex:.5;background-image:linear-gradient(to right,#fa709a,#fee140);color:#fff;padding:20px;text-align:center}.layout-main{flex:8;padding:20px;background-image:linear-gradient(-20deg,#e9defa,#fbfcdb)}.hero-page{width:100%;height:100%;opacity:0;transform:translateY(10px) scale(.98);animation:fadeIn .8s ease-out forwards;animation-delay:.4s;display:flex;justify-content:center;align-items:center;text-align:center}.hero-page .hero-sub p{margin-bottom:15px;color:#47668a}.hero-page .hero-sub div{display:flex;justify-content:center;gap:20px}.hero-page .hero-sub div button{padding:10px 20px;border:none;border-radius:5px;cursor:pointer;background-color:#3d8ef9;color:#fff;font-size:16px;transition:background-color .3s ease}.hero-page .hero-sub div button:hover{background-color:#043b7e}.layout-footer{flex:.5;background-color:#50545b;color:#fff;padding:10px;text-align:center}.todo-container{opacity:0;transform:translateY(10px) scale(.9);animation:fadeIn .8s ease-out forwards;animation-delay:.3s}.todo-container h2{text-align:center;font-size:2rem;color:#333;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;letter-spacing:1px;position:relative}.todo-container h2:after{content:"";display:block;width:60px;height:3px;background-color:#007bff;margin:10px auto 0;border-radius:2px}.todos{max-width:80%;width:100%;min-height:300px;margin:20px auto 0;padding:20px;background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.todo-list{margin-top:10px}.todo-list .top{display:flex;justify-content:space-between;align-items:center;padding:10px}.todo-list .top h3{font-size:18px;color:#201b66}.todo-list .top input{padding:6px 8px;border:1px solid #ccc;border-radius:4px;font-size:16px;outline:none;transition:border-color .3s}.todo-list .top input:focus{border-color:#007bff;box-shadow:0 0 5px #007bff66}.todo-item{padding:12px 16px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center}.todo-item .actions{display:flex;gap:10px}.todo-item .actions button{padding:6px 12px;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s}.todo-item .actions button:nth-child(1){background-color:#07a82d;color:#fff}.todo-item .actions button:nth-child(1):hover{background-color:#218838}.todo-item .actions button:nth-child(2){background-color:#dc3545;color:#fff}.todo-item .actions button:nth-child(2):hover{background-color:#c82333}.todo-item:last-child{border-bottom:none}.input-box{display:flex;align-items:center;justify-content:center;gap:10px;margin:20px auto;width:90%;max-width:500px}.input-box input{flex:1;padding:10px 15px;border:1px solid #ccc;border-radius:8px;font-size:16px;outline:none;transition:.3s}.input-box input:focus{border-color:#007bff;box-shadow:0 0 5px #007bff66}.input-box button{padding:10px 20px;background-color:#007bff;color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer;transition:.3s}.input-box button:hover{background-color:#0056b3}@media (max-width: 768px){.todo-container{width:100%}.todos{max-width:unset}.input-box{width:95%}}@keyframes fadeIn{to{opacity:1;transform:translateY(0) scale(1)}}.github-container{opacity:0;transform:translateY(10px) scale(.9);animation:fadeIn .8s ease-out forwards;animation-delay:.4s}.github-container h2{text-align:center;font-size:2rem;color:#333;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;letter-spacing:1px;position:relative}.github-container h2:after{content:"";display:block;width:270px;height:3px;background-color:#007bff;margin:10px auto 0;border-radius:2px}.github{max-width:80%;width:100%;min-height:300px;margin:20px auto 0;padding:20px;background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.github .github-form{display:flex;justify-content:center;align-items:center;gap:10px;margin:30px auto;max-width:500px;padding:10px}.github .github-input{flex:1;padding:10px 15px;font-size:16px;border:2px solid #ddd;border-radius:8px;transition:border-color .3s ease}.github .github-input:focus{border-color:#007bff;outline:none}.github button{padding:10px 20px;background-color:#24292e;color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer;transition:background-color .3s ease}.github button:hover{background-color:#0366d6}.github-card{margin-top:2rem;padding:1.5rem;border:1px solid #ddd;border-radius:10px;background-image:linear-gradient(to top,#fbc2eb,#a6c1ee);box-shadow:0 4px 12px #00000014;text-align:center;max-width:400px;margin-left:auto;margin-right:auto;animation:fadeIn .5s ease-in-out}.github-avatar{width:100px;height:100px;border-radius:50%;object-fit:cover;margin-bottom:1rem}.github-card h3{font-size:1.3rem;margin:.5rem 0}.github-card p{font-size:.95rem;margin:.3rem 0;color:#333}.profile-link{display:inline-block;margin-top:1rem;padding:.4rem .8rem;background-color:#24292e;color:#fff;border-radius:5px;text-decoration:none;font-size:.9rem;transition:background-color .3s}.profile-link:hover{background-color:#0366d6}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}