/* Compact presentation of the shared homepage demo in a feature column. */
.team-profile-demo { padding: 22px; container-type: inline-size; }
.team-profile-demo .autofill-demo-heading { flex-wrap: wrap; gap: 10px; }
.team-profile-demo .autofill-demo-heading h2 { font-size: 21px; }
.team-profile-demo .autofill-demo-label { display: none; }
.team-profile-demo .autofill-demo-grid { grid-template-columns: minmax(0, .9fr) 28px minmax(0, 1.1fr); margin: 24px 0; }
.team-profile-demo .autofill-profile-heading { padding: 14px 12px; }
.team-profile-demo .autofill-profile h3,
.team-profile-demo .autofill-forms h3 { font-size: 12px; }
.team-profile-demo .autofill-person { padding: 14px 12px; gap: 8px; flex-wrap: wrap; }
.team-profile-demo .autofill-person strong { font-size: 12px; }
.team-profile-demo .autofill-avatar { width: 32px; height: 32px; font-size: 11px; }
.team-profile-demo .autofill-profile dl { padding: 0 12px; }
.team-profile-demo .autofill-profile dl > div { flex-direction: column; gap: 3px; font-size: 10px; }
.team-profile-demo .autofill-profile dd { text-align: left; }
.team-profile-demo .autofill-profile-note { padding: 12px; font-size: 10px; }
.team-profile-demo .autofill-forms-heading { flex-wrap: wrap; gap: 4px; }
.team-profile-demo .autofill-form { padding: 12px; gap: 8px; }
.team-profile-demo .autofill-document { width: 24px; height: 34px; font-size: 17px; }
.team-profile-demo .autofill-form-top { flex-wrap: wrap; }
.team-profile-demo .autofill-form-top span { font-size: 9px; padding: 3px 6px; }
.team-profile-demo .autofill-demo-footer { padding-top: 16px; }
.team-profile-demo .autofill-feedback strong { font-size: 13px; }
.team-profile-demo .autofill-feedback span { font-size: 11px; }
.team-profile-demo .autofill-connection { height: auto; }
.team-profile-demo .autofill-connection i { transform: none; }
@container (max-width: 380px) {
  .team-profile-demo .autofill-demo-grid { grid-template-columns: 1fr; }
  .team-profile-demo .autofill-connection { height: 36px; justify-content: center; }
  .team-profile-demo .autofill-connection span { display: none; }
  .team-profile-demo .autofill-connection i { transform: rotate(90deg); animation: none; }
}