*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}html,body{height:100%;width:100%;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16px;line-height:1.5;background-color:#f9f9f9;color:#333}button{font:inherit;background:none;border:none;cursor:pointer}input,textarea{font:inherit;border:none;outline:none}a{text-decoration:none;color:inherit}ul{list-style:none;padding:0;margin:0}img{max-width:100%;display:block}.app-container{max-width:600px;margin:40px auto;padding:20px;background-color:#fff;border-radius:12px;box-shadow:0 0 12px #0000000d;display:flex;flex-direction:column;gap:24px;transition:all .3s ease-in-out}@media (max-width: 640px){.app-container{margin:20px 16px;padding:16px;gap:16px}}.header{text-align:center;padding:1.5rem;background-color:#f4f4f4;border-bottom:2px solid #ddd;margin-bottom:1rem}.header-title{font-size:1.8rem;color:#333;font-weight:600;margin:0}.tab-container{display:flex;justify-content:center;gap:1.5rem;margin-bottom:1.5rem;border-bottom:1px solid #ddd}.tab-button{background:none;border:none;font-size:1rem;color:#555;padding:.8rem 0;cursor:pointer;position:relative;transition:color .3s ease}.tab-button:hover{color:#007bff}.active-tab{color:#007bff;font-weight:600}.active-tab:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background-color:#007bff;border-radius:2px}.todo-item{background-color:#fff;padding:1rem;margin-bottom:1rem;border-radius:10px;box-shadow:0 2px 6px #0000001a;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.todo-text{flex:1 1 60%;font-size:1rem;margin:0}.todo-buttons{display:flex;gap:.5rem;margin-top:.5rem;flex:1 1 35%;justify-content:flex-end}.btn{padding:.4rem .8rem;font-size:.9rem;border-radius:5px;border:none;cursor:pointer;transition:background .2s ease}.done-btn{background-color:#4caf50;color:#fff}.done-btn:disabled{background-color:#a5d6a7;cursor:not-allowed}.delete-btn{background-color:#f44336;color:#fff}@media (max-width: 600px){.todo-item{flex-direction:column;align-items:flex-start}.todo-buttons{width:100%;justify-content:flex-start}}.input-container{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;width:100%}.input-container input{flex-grow:1;flex-shrink:1;min-width:0;height:40px;padding:.5rem 1rem;border:2px solid #ccc;border-radius:8px;font-size:1rem;outline:none;transition:border .2s ease;box-sizing:border-box}.input-container input:focus{border-color:#007bff}.input-container button{height:40px;padding:.5rem 1rem;background-color:#007bff;color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:background-color .2s ease}.input-container button:disabled{background-color:#ccc;cursor:not-allowed}@media (max-width: 500px){.input-container{flex-direction:column;align-items:stretch}.input-container input,.input-container button{width:100%}}