@layer modules {
  /* Importing screens: one row per screen found, with what to do with it. */
  .import-rows { list-style: none; margin: 1rem 0; padding: 0; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--surface); }
  .import-row { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; align-items: center; gap: 1rem; padding: .8rem 1rem .8rem 1.2rem; }
  .import-row + .import-row { border-top: 1px solid var(--line); }
  .import-screen { display: flex; align-items: center; gap: .7rem; min-width: 0; }
  .import-screen .kind-icon { width: 16px; height: 16px; flex: none; }
  .import-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 1.3rem; color: var(--ink-3); }
  .import-conflict { flex: none; padding: .1rem .7rem; border-radius: 999px; background: var(--warning-soft); color: var(--warning); font-size: 1.15rem; font-weight: 600; }
  .panel-head.is-import { border-top-color: var(--router); }
  @media (max-width: 599px) { .import-row { grid-template-columns: minmax(0, 1fr); } }
}
