*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,sans-serif;background:linear-gradient(135deg,#fce4ec,#f8bbd0);min-height:100vh;overflow-x:hidden}.app{width:100%;max-width:700px;margin:0 auto;padding:20px 15px}h1{text-align:center;margin-bottom:25px;color:#333}.container{display:flex;gap:20px;width:100%}form,.output{flex:1;background:#fff;padding:25px;border-radius:15px;box-shadow:0 8px 20px #00000014;width:100%}input{width:100%;padding:12px;margin-bottom:15px;border-radius:8px;border:1px solid #ccc;font-size:14px}input:focus{outline:none;border-color:#d81b60}button{width:100%;padding:12px;border:none;border-radius:8px;background:#d81b60;color:#fff;font-weight:700;cursor:pointer;transition:.3s}button:hover{background:#ad1457}.output{max-height:420px;overflow-y:auto}.output h2{margin-bottom:10px}.output h3{margin-bottom:15px}ul{list-style:none}li{background:#fce4ec;padding:10px;margin-bottom:8px;border-radius:6px;font-size:14px}.footer{margin-top:25px;text-align:center;opacity:0;transition:.4s ease}.footer.visible{opacity:1}.footer a{color:#ad1457;font-weight:600;text-decoration:none}.footer a:hover{text-decoration:underline}@media(max-width:992px){.container{flex-direction:column}.output{max-height:none}}@media(max-width:600px){.app{padding:15px}form,.output{padding:18px}h1{font-size:20px}}@media screen and (max-width:375px)and (max-height:667px){html,body{margin:0;padding-bottom:2rem;height:100dvh}.app{height:90%;padding:14px 12px;display:flex;flex-direction:column;justify-content:flex-start}.container{flex-direction:column;gap:16px;width:100%}.form-section,.output-section{width:100%;padding:14px}.output,.output-section{max-height:none;overflow:visible}h1{font-size:1.4rem;margin-bottom:16px;text-align:center}input,button{width:100%;padding:10px;font-size:14px}.footer{margin-top:12px;text-align:center}}
