.migration-plan-page { max-width: 960px; }
.migration-plan-form { display: grid; gap: 1rem; }
.migration-role-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: .75rem; }
.migration-role { display: grid; grid-template-columns: minmax(0, 1fr) 5.5rem 6.5rem; align-items: center; gap: .7rem; padding: 1rem; border: 1px solid var(--line); border-radius: .8rem; background: linear-gradient(150deg, var(--panel), #0d1422); color: var(--text); transition: border-color .15s, background-color .15s; }
.migration-role:hover, .migration-role:focus-within { border-color: #4a6a95; }
.migration-role:has(input[type="checkbox"]:checked) { border-color: #3b82f6; background: linear-gradient(150deg, #14264a, #0f1a30); }
.migration-role label:first-child { display: flex; align-items: flex-start; gap: .6rem; color: var(--text); font-weight: 650; line-height: 1.4; cursor: pointer; }
.migration-role label:first-child input { flex: none; margin-top: .15rem; }
.migration-role label:nth-child(2) { color: var(--muted); font-size: .85rem; text-align: right; }
.migration-role input[type="number"] { width: 100%; min-height: 40px; padding: 6px 10px; }
.migration-plan-note { margin: 0 0 1rem; padding: 1rem; border-left: 4px solid #2dd4bf; border-radius: 0 .6rem .6rem 0; background: #0f2a30; color: #d3eeee; }
.migration-plan-note strong { color: #fff; }
.migration-plan-form button[type="submit"] { justify-self: start; min-width: 14rem; min-height: 46px; padding: 10px 22px; border: 1px solid #3b82f6; border-radius: 9px; background: #2563eb; color: #fff; font: 700 15px system-ui; cursor: pointer; }
.migration-plan-form button[type="submit"]:hover { background: #1d4ed8; }
.migration-plan-output { margin-top: 1.25rem; }
.migration-plan-output ol { display: grid; gap: 1rem; padding-left: 1.5rem; }
.migration-plan-output ol > li { padding: 1rem 1rem 1rem 1.25rem; border: 1px solid var(--line); border-radius: .8rem; background: var(--panel); color: var(--text); }
.migration-plan-output ol > li::marker { color: #93c5fd; font-weight: 700; }
.migration-plan-output h3 { margin-top: 0; color: #fff; }
.migration-plan-output p, .migration-plan-output li { color: var(--text); }
.migration-plan-output ul { padding-left: 1.25rem; }
.migration-plan-output a { overflow-wrap: anywhere; }
@media (max-width: 480px) {
  .migration-role { grid-template-columns: minmax(0, 1fr) 6.5rem; }
  .migration-role label:first-child { grid-column: 1 / -1; }
  .migration-role label:nth-child(2) { grid-column: 1; text-align: left; }
  .migration-role input[type="number"] { grid-column: 2; }
  .migration-plan-form button[type="submit"] { justify-self: stretch; }
}