body{font-family:Arial,sans-serif;background-color:#f4f4f4;margin:0;padding:20px;overflow-x:hidden}html{overflow-x:hidden}h1,h2{color:#1f2937}p{color:#374151}.app-container{max-width:700px;margin:0 auto}form{background:#fff;padding:20px;border-radius:10px;box-shadow:0 2px 6px #0000001a;margin-bottom:20px}input{padding:10px;width:60%;margin-right:10px;border:1px solid #ccc;border-radius:6px;box-sizing:border-box}button{padding:10px 14px;border:none;border-radius:6px;background-color:#2563eb;color:#fff;cursor:pointer}button:hover{background-color:#1d4ed8}.task-item{background:#fff;padding:16px;border-radius:8px;box-shadow:0 1px 4px #0000001a;margin-bottom:16px;list-style:none}.task-item span{display:block;font-size:16px;margin-bottom:10px}.completed{text-decoration:line-through;color:#777}.task-item-buttons{display:flex;gap:10px;flex-wrap:wrap}.task-item-buttons button{padding:10px 16px;border:none;border-radius:8px;cursor:pointer}.message{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb;padding:12px 16px;border-radius:8px;margin-bottom:20px;font-weight:600;position:sticky;top:10px;z-index:1000}@media (max-width: 768px){.app-container{width:100%;max-width:100%;margin:20px auto;padding:16px;box-sizing:border-box;overflow-x:hidden}h1{font-size:2.2rem;line-height:1.2;word-break:break-word}form{width:100%;box-sizing:border-box}input{width:100%;max-width:100%;margin-right:0;margin-bottom:12px;font-size:16px;padding:14px;box-sizing:border-box}form button{width:100%;padding:14px;font-size:18px}.task-item{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:16px}.task-item span{width:100%;font-size:18px;word-break:break-word;overflow-wrap:break-word;margin-bottom:4px}.task-item-buttons{display:flex;flex-direction:column;gap:10px;width:100%}.task-item-buttons button{width:100%;max-width:100%;margin:0;padding:12px;font-size:16px;box-sizing:border-box}}
