*{font-family:Roboto,sans-serif;margin:0;padding:0;box-sizing:border-box;color:#333}body{background-color:#f2d1b3;padding-top:80px;padding-bottom:40px}.header{position:fixed;top:0;left:0;width:100%;background-color:#bf8563;padding:15px 0;z-index:1000;display:flex;justify-content:center;align-items:center}.header h2{text-align:center;text-transform:uppercase;letter-spacing:2px;color:#fff;margin:0;padding:0;border:none;font-size:clamp(1.5rem,5vw,2.5rem);width:100%}.footer{background-color:#bf8563;color:#fff;text-align:center;padding:10px 0;position:fixed;bottom:0;width:100%}.footer p{margin:0;font-size:14px}#root{display:flex;justify-content:center;padding:40px}#root>div{display:flex;gap:40px;width:100%}#root>div>div{flex:1;background-color:#d9b5a0;border-radius:12px;padding:30px;box-shadow:0 4px 6px #0000001a}h2{margin-bottom:25px;font-size:28px;font-weight:700;color:#bf8563;text-align:center;text-transform:uppercase;letter-spacing:2px;border-bottom:2px solid #BF8563;padding-bottom:10px}header{display:flex;margin-bottom:25px;box-shadow:0 2px 4px #0000001a;overflow:hidden;border-radius:8px}header input{flex:1;padding:12px 15px;border:none;font-size:16px;background-color:#f2d1b3;min-width:0}header button{padding:12px 25px;background-color:#bf8563;color:#fff;border:none;cursor:pointer;font-size:16px;transition:background-color .3s ease;white-space:nowrap}header button:hover{background-color:#a66d4f}.main{list-style-type:none}.todoItem{display:flex;align-items:center;padding:15px;border-bottom:1px solid #BF8563;transition:background-color .3s ease}.todoItem:hover{background-color:#e6c6b1}.todoItem p{flex:1;font-size:18px}.actionsContainer{display:flex;gap:15px}.actionsContainer button{background-color:transparent;border:none;cursor:pointer;font-size:20px;color:#bf8563;transition:color .3s ease}.actionsContainer button:hover{color:#a66d4f}.content-wrapper{max-width:1200px;margin:0 auto;padding:0 20px}#root>div>div:first-child .todoItem:before{content:"✓";color:#4caf50;margin-right:15px;font-size:20px}#root>div>div:last-child .todoItem:before{content:"✗";color:#f44336;margin-right:15px;font-size:20px}@media (max-width: 768px){body{padding-top:60px}#root>div{flex-direction:column}.content-wrapper{padding:0 10px}}