/* Settings-only vertical rhythm. Layout/visibility belong to each component. */
#settings-modal {
  --settings-section-gap: 24px;
  --settings-field-gap: 16px;
  --settings-content-gap: 12px;
}
#settings-modal .settings-panel {gap: var(--settings-field-gap)}
#settings-modal .settings-panel > :is(h3,h4,h5,p) {margin-block: 0}
#settings-modal .settings-panel .btn-new {margin-inline: 0}
#settings-modal .settings-panel :is(.settings-card,.channel-section) {
  padding: 16px;
  gap: var(--settings-content-gap);
}
#settings-modal .settings-panel :is(.settings-card,.channel-section) > :is(h3,h4,h5,p) {margin-block: 0}
#settings-modal .settings-panel .settings-row {padding: 14px 16px}
#settings-modal .settings-row > small {display: block;line-height: 1.5}
#settings-modal .settings-row > small + small {margin-top: 8px}
#settings-modal .settings-panel :is(.channel-form,.channel-subpanel,.voice-settings-grid) {gap: var(--settings-field-gap)}
#settings-modal .settings-panel :is(.backup-actions,.channel-actions,.person-source-actions,.infra-maintenance-controls) {
  gap: var(--settings-content-gap);
}
#settings-modal .settings-field {display: flex;flex-direction: column;gap: 6px;min-width: 0}
#settings-modal .settings-stack {
  display: flex;
  flex-direction: column;
  gap: var(--settings-section-gap);
  min-width: 0;
}
#settings-modal .settings-stack > :is(.backup-grid,.backup-card,.backup-disclosure,.infra-grid,.infra-card) {margin-block: 0}
#settings-modal .settings-panel details > summary {
  box-sizing: border-box;
  min-height: 44px;
  padding: 12px 16px;
  line-height: 1.5;
  cursor: pointer;
}
#settings-modal .settings-panel details > summary:focus-visible {outline: 2px solid var(--ac);outline-offset: 3px}
#settings-modal .settings-panel details[open] > summary + :is(p,ul,ol,.voice-settings-grid) {margin-block-start: 12px}
#settings-modal .backup-disclosure > .backup-card {padding: 16px}
#settings-modal .backup-table th {white-space: nowrap;overflow-wrap: normal}
@media(max-width: 768px) {
  #settings-modal {--settings-section-gap: 16px;--settings-field-gap: 12px}
  #settings-modal .settings-panel :is(.settings-card,.channel-section,.settings-row) {padding: 14px}
  #settings-modal .settings-panel details > summary {padding: 12px}
  #settings-modal .backup-disclosure > .backup-card {padding: 14px}
}
