.connection-dialog-backdrop { position: fixed; inset: 0; z-index: 65; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(17,19,26,.48); }
.connection-dialog-backdrop[hidden] { display: none; }
.connection-dialog { display: flex; flex-direction: column; width: min(600px, 100%); max-height: calc(100dvh - 48px); min-width: 0; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow-md); }
.connection-dialog-header { display: flex; align-items: center; gap: 16px; padding: 20px 24px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.connection-dialog-header .card-title { flex: 1; min-width: 0; margin: 0; }
.connection-dialog-close { flex: 0 0 40px; min-height: 40px; padding: 0; font-size: 26px; line-height: 1; }
.connection-dialog-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 24px; }
.connection-dialog-body .channel-details { padding: 0; }
.connection-dialog-body .channel-details > .field:first-child { margin-top: 0; }
.connection-dialog-body .channel-account-add-form { border: 0; padding: 0; margin: 0; max-width: none; width: 100%; }
.connection-dialog-body .integration-actions, .connection-dialog-body .channel-account-form-actions { margin-top: 8px; }
.connection-dialog-body .channel-details > .connection-dialog-actions { margin-top: 20px; display: flex; justify-content: flex-end; gap: 8px; }
@media (max-width: 560px) {
  .connection-dialog-backdrop { padding: 8px; }
  .connection-dialog { max-height: calc(100dvh - 16px); }
  .connection-dialog-header { padding: 16px; gap: 8px; }
  .connection-dialog-body { padding: 16px; }
  .connection-dialog-body input, .connection-dialog-body textarea { font-size: 16px; }
}

.connection-dialog-footer { flex-shrink: 0; border-top: 1px solid var(--border); padding: 16px 24px; }
.connection-dialog-footer[hidden] { display: none; }
.connection-dialog-footer > div { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin: 0; }
@media(max-width:560px) { .connection-dialog-footer { padding: 12px 16px; } }