/* 도메인별 화면 루트와 반응형 레이아웃 경계를 정의하는 스타일 */
[data-ui-domain] {
  min-inline-size: 0;
  container-type: inline-size;
}

[data-ui-domain] :where(.surface-panel, .surface-card, form, fieldset, table) {
  min-inline-size: 0;
}

[data-ui-domain] :where(input, select, textarea, button) {
  max-inline-size: 100%;
}

[data-ui-domain="finance"] :where(.finance-workspace-layout, .finance-layout),
[data-ui-domain="documents"] :where(.info-layout, .document-layout),
[data-ui-domain="sharing"] :where(.shared-resource-layout),
[data-ui-domain="prep"] :where(.prep-layout, .prep-manager-layout),
[data-ui-domain="auth"] :where(.users-layout, .account-workspace) {
  min-inline-size: 0;
}

@container (max-width: 44rem) {
  [data-ui-domain] :where(.toolbar, .section-actions, .form-actions) {
    flex-wrap: wrap;
  }
}