*{box-sizing:border-box}
body{font-family:Inter,sans-serif;background:#f4f6fa;margin:0;color:#333}
.content{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:30px;gap:30px;min-height:100vh}
img.logotipo{width:100%;max-width:220px;display:block}
.card{background:#fff;padding:35px;border-radius:16px;box-shadow:0 4px 15px rgba(0,0,0,.08);width:100%;max-width:450px}
h2{margin:0 0 25px 0;color:#06457a;font-size:24px;font-weight:700;text-align:left}
.form-group{margin-bottom:10px}
label{display:block;font-size:14px;font-weight:500;margin-bottom:8px;color:#555}
input[type=password],input[type=text],select{width:100%;padding:12px 15px;border:1px solid #ddd;border-radius:6px;font-size:16px;font-family:inherit;transition:border-color .2s;background-color:#fff;display:block;outline:0}
input:focus,select:focus{border-color:#1ca8e0}
select{appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;padding-right:40px}
button{width:100%;padding:14px;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}
.btn-primary{background:#1ca8e0;color:#fff;margin-top:10px}
.btn-secondary{background:hsl(2deg 64% 58% / 10%);color:#d9534f;margin-top:15px}
#gerador-vindi-result{width:100%;max-width:450px}
.error{color:#d9534f;background:hsl(2deg 64% 58% / 10%);padding:12px;border-radius:6px;font-size:14px;text-align:center;margin:0;margin-top:15px;font-weight:500}
.bill-item{padding:15px;background:#f4f7f9;border-radius:10px;font-size:16px}
.bill-item a{background:hsl(197deg 78% 49% / 10%);color:#06457a;text-decoration:none;font-weight:600;line-height:1;padding:10px 15px;display:inline-block;margin-top:10px;border-radius:5px}
.copyright{color:grey;font-size:14px;margin-top:0}
#results{display:grid;gap:10px}
@media screen and (max-width:767px){
.content{padding:20px}
.card{padding:20px}
h2{font-size:17px;margin-bottom:20px}
img.logotipo{max-width:180px}
.copyright{font-size:12px}
.bill-item,button,input,select{font-size:14px!important}
}