:root {
  --banner-position-x: 50%;
  --banner-position-y: 50%;
  --banner-zoom: 1;
}

.login-hero,
.dashboard-banner,
.banner-preview {
  background: var(--navy);
}

.login-hero img,
.banner-preview img {
  object-fit: contain;
  object-position: var(--banner-position-x) var(--banner-position-y);
  transform: scale(var(--banner-zoom));
  transform-origin: var(--banner-position-x) var(--banner-position-y);
}

.dashboard-banner img {
  object-fit: cover;
  object-position: var(--banner-position-x) var(--banner-position-y);
  transform: scale(var(--banner-zoom));
  transform-origin: var(--banner-position-x) var(--banner-position-y);
}

.branding-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.authorized-voice-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(210px, 1fr) auto auto;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.authorized-voice-row input { min-width: 0; }
.voice-primary-choice { display: flex !important; grid-auto-flow: column; align-items: center; white-space: nowrap; margin: 0 !important; }
.voice-primary-choice input { width: auto !important; }

@media (max-width: 760px) {
  .authorized-voice-row { grid-template-columns: 1fr; }
}

.production-history {
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.production-history summary { cursor: pointer; font-weight: 800; }
.production-history dl { display: grid; grid-template-columns: minmax(150px, auto) 1fr; gap: 8px 14px; margin-bottom: 0; }
.production-history dt { font-weight: 800; }
.production-history dd { margin: 0; overflow-wrap: anywhere; }

@media (max-width: 620px) {
  .production-history dl { grid-template-columns: 1fr; }
  .production-history dd { margin-bottom: 8px; }
}

.banner-preview {
  height: clamp(180px, 24vw, 360px);
  overflow: hidden;
  border-radius: 16px;
  margin: 16px 0;
}

.banner-preview img {
  width: 100%;
  height: 100%;
  display: block;
}