.navigation-replacement-modal {
  width: min(980px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  min-width: 0;
  box-sizing: border-box;
}
.navigation-replacement-modal fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.navigation-replacement-modal [hidden] { display: none !important; }
.navigation-replacement-modal .replace-note { margin: 0 0 20px; padding: 16px; border-radius: 12px; background: #f0f5ff; color: #344564; line-height: 1.65; }
.navigation-replacement-modal .replace-sites { max-height: 240px; overflow: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid #dfe6f2; border-radius: 12px; margin: 12px 0 20px; }
.replace-sites label { display: flex; align-items: center; gap: 12px; padding: 12px; cursor: pointer; min-width: 0; }
.replace-sites label:hover { background: #f4f7fd; }
.replace-sites label span { display: grid; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
.replace-sites small { color: #596a86; }
.replace-sites input, .replace-confirm input { width: 18px; height: 18px; flex: 0 0 18px; }
.replace-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 12px; }
.replace-message { margin: 16px 0; padding: 12px 16px; border-radius: 12px; background: #f0f5ff; color: #344564; line-height: 1.6; overflow-wrap: anywhere; }
.replace-message.is-error { color: #9d2145; background: #fff0f3; }
.replace-preview { margin-top: 20px; padding-top: 20px; border-top: 1px solid #dfe6f2; }
.replace-preview h3, .replace-history h3 { font-size: 17px; margin: 0 0 12px; }
.replace-preview td { overflow-wrap: anywhere; white-space: normal; min-width: 130px; }
.replace-confirm { display: flex; align-items: flex-start; gap: 10px; line-height: 1.7; margin-top: 20px; }
.replace-confirm input { margin-top: 4px; }
.replace-history { margin-top: 24px; border-top: 1px solid #dfe6f2; padding-top: 20px; }
.replace-task { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0; border-bottom: 1px solid #edf0f6; }
.replace-task > div { min-width: 0; }
.replace-task span, .replace-detail li span { display: block; color: #596a86; font-size: 13px; line-height: 1.6; margin-top: 4px; }
.replace-task p { color: #9d2145; margin: 4px 0 0; overflow-wrap: anywhere; }
.replace-detail { border-radius: 12px; padding: 16px; background: #f4f7fd; margin-top: 16px; overflow-wrap: anywhere; }
.replace-detail li { margin-bottom: 12px; }
@media (max-width: 600px) {
  .navigation-replacement-modal .replace-sites { grid-template-columns: 1fr; }
  .navigation-replacement-modal { width: calc(100vw - 16px); max-width: calc(100vw - 16px); }
  .replace-task { align-items: flex-start; flex-direction: column; }
  .navigation-replacement-modal .modal-foot { flex-wrap: wrap; }
  .navigation-replacement-modal .modal-foot .button { flex: 1; white-space: nowrap; font-size: 14px; padding: 10px 12px; }
  .navigation-replacement-modal .modal-foot .button:first-child { flex: 0 0 auto; }
}
/* Dialog colour and spacing follow the selected admin skin in both modes. */
.navigation-replacement-modal .replace-note,.replace-message{margin-bottom:12px;padding:11px 13px;background:var(--blue-soft);color:var(--blue)}
.navigation-replacement-modal .replace-sites{margin:10px 0 12px;border-color:var(--line)}
.replace-sites label{gap:9px;padding:9px 11px}
.replace-sites label:hover{background:var(--panel-soft)}
.replace-sites small,.replace-task span,.replace-detail li span{color:var(--muted)}
.replace-message.is-error,.replace-task p{color:var(--red)}
.replace-message.is-error{background:var(--red-soft)}
.replace-preview{margin-top:14px;padding-top:14px;border-color:var(--line)}
.replace-confirm{margin-top:14px}
.replace-history{margin-top:16px;padding-top:14px;border-color:var(--line)}
.replace-task{padding:10px 0;border-color:var(--line)}
.replace-detail{margin-top:12px;padding:12px;background:var(--panel-soft)}