@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";body{font-family:Roboto,Arial,sans-serif;line-height:1.6;margin:0;padding:0;background-color:#f0f2f5;color:#333}.container{max-width:800px;margin:2rem auto;padding:2rem;background-color:#fff;border-radius:8px;box-shadow:0 4px 6px #0000001a}h1{color:#2c3e50;text-align:center;margin-bottom:2rem;font-size:2.5rem}form{display:grid;gap:1.5rem}.form-group{display:flex;flex-direction:column}label{font-weight:500;margin-bottom:.5rem;color:#34495e}input[type=text],input[type=number]{width:100%;padding:.8rem;border:1px solid #bdc3c7;border-radius:4px;font-size:1rem;transition:all .3s ease}input[type=text]:focus,input[type=number]:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 2px #3498db33}input[readonly]{background-color:#ecf0f1;cursor:not-allowed}input.invalid{border-color:#e74c3c;background-color:#fdf1f0;box-shadow:0 0 0 2px #e74c3c33}button{display:block;width:100%;padding:1rem;background:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1.1rem;font-weight:500;transition:background-color .3s ease}button:hover{background:#2980b9}#output{margin-top:2rem;background:#ffffff;padding:1.5rem;border-radius:8px;box-shadow:0 2px 4px #0000001a}.hidden{display:none}pre{background:#f8f9fa;border:1px solid #e9ecef;border-radius:4px;padding:1rem;white-space:pre-wrap;word-wrap:break-word;font-family:Courier New,Courier,monospace;font-size:.9rem}.error-messages{color:#e74c3c;background-color:#fadbd8;border:1px solid #f1948a;border-radius:4px;padding:1rem;margin-bottom:1rem;font-weight:500;display:none;opacity:0;transform:translateY(-10px);transition:opacity .3s ease,transform .3s ease}.error-messages.show{display:block;opacity:1;transform:translateY(0)}.error-list{margin:0;padding-left:1.5rem}.error-list li{margin-bottom:.5rem}.error-list li:last-child{margin-bottom:0}@media (max-width: 600px){.container{padding:1rem}h1{font-size:2rem}input[type=text],input[type=number]{font-size:16px}}