<style>
#pipette-quote {
max-width: 480px;
margin: 0 auto;
font-family: Inter, sans-serif;
color: #000;
background: #fff;
border: 1px solid #000;
padding: 20px;
border-radius: 0;
}
#pipette-quote h3 {
margin: 0 0 12px 0;
font-size: 20px;
font-weight: 600;
}
#pipette-quote label {
font-size: 14px;
font-weight: 500;
}
#pipette-quote input,
#pipette-quote select {
width: 100%;
padding: 8px;
margin: 4px 0 12px 0;
border: 1px solid #000;
border-radius: 0;
font-size: 14px;
background: #fff;
}
#pipette-quote button {
width: 100%;
padding: 12px;
border-radius: 0;
font-size: 15px;
font-weight: 600;
cursor: pointer;
}
#calcBtn {
background: #000;
color: #fff;
border: none;
margin-bottom: 16px;
}
/* Pipette button row — matches balance calculator */
#pipetteButtonsRow {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
}

#pipetteButtonsRow button {
  padding: 12px;
  border: 1px solid #000;
  background: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

/* Desktop: horizontal row */
@media (min-width: 600px) {
  #pipetteButtonsRow {
    flex-direction: row;
  }
  #pipetteButtonsRow button {
    width: 33.33%;
  }
}


#certDetails {
display: none;
padding: 12px;
border: 1px solid #000;
margin-bottom: 16px;
}
#emailFields {
display: none;
padding: 12px;
border: 1px solid #000;
margin-top: 16px;
}
#results {
display: none;
border-top: 1px solid #000;
padding-top: 12px;
}
.error {
color: #b00000;
font-size: 13px;
margin: -8px 0 8px 0;
}
</style>