/* The import wizard (import-wizard.js): one dialog, five steps, scoped to .import-wizard so nothing shared changes. */
.import-wizard { width: min(1120px, calc(100vw - 32px)); max-width: calc(100vw - 32px); max-height: 94dvh; padding: 0; border: 1px solid var(--border-strong); border-radius: 14px; color: var(--ink); background: var(--bg); box-shadow: 0 24px 80px var(--shadow-strong); }
.import-wizard[open] { display: flex; flex-direction: column; }
.import-wizard::backdrop { background: var(--scrim); }
.import-wizard h2 { margin: 4px 0 0; font-family: var(--brand-font); font-size: var(--font-xl); font-weight: 600; letter-spacing: -.3px; color: var(--ink); }
.import-wizard h3 { margin: 0 0 10px; font-size: 15px; }
.iw-head { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; padding: 16px 24px; background: var(--panel); border-bottom: 1px solid var(--border); border-radius: 14px 14px 0 0; }
.iw-steps { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.iw-steps li { padding: 5px 11px; border: 1px solid var(--border-strong); border-radius: 999px; font-size: 12px; color: var(--muted); background: var(--surface); }
.iw-steps li.iw-done { color: var(--pass-ink); border-color: var(--pass-border); background: var(--pass-wash); }
.iw-steps li.iw-current { color: var(--accent-ink); border-color: var(--accent); background: var(--accent-soft); font-weight: 600; }
.iw-body { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 18px 24px; }
.iw-body > div > .muted:first-child { margin-top: 0; }
.iw-error { margin: 0 24px 8px; }
.iw-foot { display: flex; align-items: center; gap: 10px; padding: 12px 24px; background: var(--panel); border-top: 1px solid var(--border); border-radius: 0 0 14px 14px; }
.iw-spacer { flex: 1; }
.import-wizard label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; margin: 10px 0; }
.import-wizard label.checkbox-row { flex-direction: row; align-items: center; }
.import-wizard input:not([type=checkbox]):not([type=radio]), .import-wizard select, .import-wizard textarea { box-sizing: border-box; width: 100%; min-width: 0; border: 1px solid var(--border-strong); border-radius: 7px; background: var(--surface); color: var(--text); padding: 8px 10px; font: inherit; }
.import-wizard input[type=checkbox] { width: 16px; height: 16px; flex: none; accent-color: var(--accent); }
.iw-drop { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 26px 20px; border: 2px dashed var(--border-firm); border-radius: 12px; background: var(--surface); text-align: center; }
.iw-drop .muted { max-width: 620px; font-size: 12px; line-height: 1.6; }
.iw-drop.iw-drop-over { border-color: var(--accent); background: var(--accent-soft); }
.iw-files { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.iw-files li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--surface); }
.iw-files li > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; min-width: 0; }
.iw-files strong { overflow-wrap: anywhere; }
.iw-files small { flex-basis: 100%; font-size: 12px; }
.iw-files li.iw-file-error small { color: var(--fail); }
.iw-kind { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--surface-hover); color: var(--text-2); }
.iw-segment-fields { margin-top: 12px; }
.iw-card { margin: 0 0 14px; padding: 14px 16px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--surface); }
.iw-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; }
.iw-card-head .checkbox-row { margin: 0; font-size: 13px; }
.iw-card-head strong { overflow-wrap: anywhere; }
.import-wizard label.iw-inline { flex-direction: row; align-items: center; gap: 8px; margin: 0; white-space: nowrap; }
.import-wizard label.iw-inline select { width: auto; max-width: 340px; }
.iw-columns, .iw-routes { width: 100%; border-collapse: collapse; margin-top: 10px; font-size: 13px; }
.iw-columns th, .iw-columns td, .iw-routes th, .iw-routes td { padding: 6px 8px; border-top: 1px solid var(--border-subtle); text-align: left; vertical-align: top; }
.iw-columns thead th { border-top: 0; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.iw-columns tbody th { width: 24%; font-weight: 600; overflow-wrap: anywhere; }
.iw-columns td:nth-child(2) { width: 230px; }
.iw-columns td.muted { overflow-wrap: anywhere; font-size: 12px; }
.iw-columns tr.iw-ignored th { color: var(--muted); font-weight: 500; }
.iw-first { margin: 0; padding-left: 20px; display: grid; gap: 8px; font-size: 13px; }
.iw-first ol { margin: 4px 0 0; padding-left: 18px; color: var(--text-2); }
.iw-summary { margin: 0 0 12px; font-weight: 600; }
.iw-cases { display: grid; gap: 12px; }
.iw-case { padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--surface); }
.iw-case.iw-left-out { background: var(--surface-muted); border-style: dashed; }
.iw-case-head { display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; }
.iw-case-head > input:not([type=checkbox]) { flex: 1 1 260px; width: auto; font-weight: 600; }
.iw-chips { display: flex; flex-wrap: wrap; gap: 6px; flex-basis: 100%; }
.iw-chips span { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--surface-hover); color: var(--text-2); overflow-wrap: anywhere; }
.iw-flags { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 4px; font-size: 12px; }
.iw-flag { padding: 5px 9px; border-left: 3px solid var(--border-firm); border-radius: 4px; background: var(--bg); }
.iw-flag.iw-problem { border-color: var(--fail); background: var(--fail-soft); }
.iw-flag.iw-warning { border-color: var(--warn-ink); background: var(--warn-soft); }
.iw-flag-level { font-weight: 700; margin-right: 6px; }
.iw-case details { margin-top: 8px; font-size: 13px; }
.iw-case summary { cursor: pointer; color: var(--accent); }
.iw-rows { margin: 8px 0 0; padding-left: 22px; display: grid; gap: 6px; }
.iw-row { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 4px 16px; padding: 6px 0; border-top: 1px solid var(--border-subtle); }
.iw-row-text, .iw-row-result { display: flex; flex-direction: column; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.iw-expected { color: var(--text-2); }
.iw-row-result small { font-size: 12px; color: var(--text-2); }
.iw-row-result small.iw-reason { color: var(--warn-ink); }
.iw-pill { align-self: flex-start; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 5px; background: var(--pass-soft); color: var(--pass-ink); }
.iw-needs-steps .iw-pill, .iw-created .iw-pill { background: var(--warn-soft); color: var(--warn-ink); }
.iw-needs-check .iw-pill { background: var(--warn-soft); color: var(--warn-ink); }
.iw-choices { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.import-wizard .iw-choices label { flex-direction: row; align-items: center; gap: 6px; margin: 0; padding: 6px 12px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--surface); cursor: pointer; }
.import-wizard .iw-choices label:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-ink); font-weight: 600; }
.import-wizard .iw-choices label:has(input:disabled) { opacity: .55; cursor: not-allowed; }
.import-wizard .iw-choices input[type=radio] { margin: 0; accent-color: var(--accent); }
.iw-routes tbody th { width: 30%; font-weight: 600; overflow-wrap: anywhere; }
.iw-routes th small { display: block; font-weight: 400; }
.iw-env-fields { display: grid; grid-template-columns: minmax(0, 1fr) 150px minmax(0, 1.4fr); gap: 0 10px; }
.iw-env-fields label { margin: 8px 0 0; }
.iw-personas { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 13px; }
.iw-personas li { padding: 8px 10px; border: 1px solid var(--border-subtle); border-radius: 8px; }
.iw-personas label.checkbox-row { margin: 6px 0 0; }
.iw-plan { margin: 0 0 12px; padding-left: 20px; display: grid; gap: 6px; }
.iw-created { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
.iw-created li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 8px 10px; border: 1px solid var(--border-subtle); border-radius: 8px; background: var(--surface); }
.iw-created .ai-btn { margin: 0; }
.iw-draft { flex-basis: 100%; font-size: 13px; }
.iw-attention ul { margin: 0; padding-left: 20px; display: grid; gap: 4px; }
@media (max-width: 760px) {
  .import-wizard { width: 100vw; max-width: 100vw; max-height: 100dvh; border-radius: 0; }
  .iw-head, .iw-foot { border-radius: 0; padding: 12px 16px; }
  .iw-body { padding: 14px 16px; }
  .iw-row, .iw-env-fields { grid-template-columns: minmax(0, 1fr); }
  .iw-columns td:nth-child(2) { width: auto; }
  .import-wizard label.iw-inline { white-space: normal; flex-wrap: wrap; }
}