/* Native field composition. Authored labels, values, precision and feedback
   wording stay in each study; there is no form-event or announcement adapter. */
.experiment-site [data-ui-field] { min-width:0; max-width:100%; }
.experiment-site :is([data-ui-field=range],[data-ui-field=number],[data-ui-field=select]) {
  display:inline-flex; flex-direction:row; align-items:center; flex-wrap:wrap; gap:6px 12px;
}
.experiment-site [data-ui-field=range] { flex:1 1 200px; }
.experiment-site [data-ui-field=range] > [data-ui-input=range] { flex:1 1 96px; width:auto; min-width:80px; }
.experiment-site [data-ui-field=text] { display:grid; gap:6px; }
.experiment-site [data-ui-field=text] > [data-ui-input] { width:100%; }
.experiment-site [data-ui-field] > [data-ui-label] { margin:0; }
.experiment-site [data-ui-field=check] {
  display:inline-flex; align-items:center; gap:8px; min-height:44px;
  min-width:44px; cursor:pointer;
}
.experiment-site [data-ui-input] { max-width:100%; min-width:0; }
.experiment-site [data-ui-input=check] { flex:none; }
.experiment-site [data-ui-input=range] { min-height:44px; }
.experiment-site [data-ui-output] { font-variant-numeric:tabular-nums; line-height:1.4; }
.experiment-site [data-ui-choice-group] { min-width:0; max-width:100%; }
/* No status color, visibility or aria-live override: a saved note, a temporary
   model state and microphone privacy are different kinds of information. */
.experiment-site [data-ui-feedback] { max-width:100%; overflow-wrap:break-word; }
.experiment-site :is([data-ui-feedback=hint],[data-ui-feedback=privacy]) {
  font:var(--ds-weight-body) var(--ds-font-body)/var(--ds-line-body) var(--ds-font);
}
.experiment-site [data-ui-dialog] { max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); overflow:auto; }
.experiment-site [data-ui-dialog-heading] { display:flex; align-items:start; justify-content:space-between; gap:16px; }
.experiment-site [data-ui-dialog-heading] > :first-child { min-width:0; }
.experiment-site [data-ui-dialog-close] { flex:none; }
.experiment-site [data-ui-dialog-actions] { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; }
@media(max-width:700px) {
  .experiment-site [data-ui-field=range] { flex-basis:100%; }
  .experiment-site [data-ui-input]:is(textarea,select,[type=number],[type=text]) { font-size:16px; }
  .experiment-site [data-ui-dialog] { padding:16px; }
}