/* next-import.css (2026-11-07): Bring your data (#/import, next-import.js). The page is the house's own parts: the v89 header,
   cards, table, chips, notes and buttons, and the Receive page's drop box. This sheet only lays them out for the five steps, on
   the v89 tokens (spacing, type, greys, the control radius), so it reads in light and dark like every other page. */
#view .vimp { display: flex; flex-direction: column; gap: var(--s-4); }
#view .vimp-steps { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); margin: 0; padding: 0; list-style: none; counter-reset: none; }
#view .vimp-steps li { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-500); font-weight: var(--w-medium); }
#view .vimp-steps li[data-state="now"] { color: var(--gray-900); }
#view .vimp-steps li[data-state="done"] { color: var(--gray-700); }
#view .vimp-n { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--gray-300); font-size: var(--t-label-size); font-variant-numeric: tabular-nums; }
#view .vimp-steps li[data-state="now"] .vimp-n { border-color: var(--accent); color: var(--accent); }
#view .vimp-steps li[data-state="done"] .vimp-n { border-color: var(--gray-300); }
#view .vimp-n svg { width: 12px; height: 12px; }
#view .vimp-card .card-b { display: flex; flex-direction: column; gap: var(--s-4); }
#view .vimp-card .card-b > .tablewrap { margin: 0 calc(-1 * var(--s-4)); }
#view .vimp-foot { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-3) var(--s-4); border-top: 1px solid var(--gray-200); }
#view .vimp-foot .sp { flex: 1 1 auto; }
#view label.drop.vimp-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: var(--s-2); min-height: 180px; padding: var(--s-5); border: 1px dashed var(--gray-300); border-radius: var(--r-ctl); cursor: pointer; }
#view label.drop.vimp-drop.on { border-color: var(--accent); }
#view label.drop.vimp-drop div { display: flex; flex-direction: column; gap: var(--s-1); }
#view label.drop.vimp-drop b { font-weight: var(--w-semibold); color: var(--gray-900); }
#view label.drop.vimp-drop span { color: var(--gray-500); font-size: var(--t-small-size); }
#view label.drop.vimp-drop input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
#view .vimp-list { margin: 0; padding-left: var(--s-5); display: flex; flex-direction: column; gap: var(--s-2); color: var(--gray-700); font-size: var(--t-small-size); line-height: var(--t-small-lh); }
#view .vimp-small, #view .vimp-ev { margin: 0; color: var(--gray-500); font-size: var(--t-small-size); line-height: var(--t-small-lh); }
#view .vimp-sys { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); }
#view .vimp-facts { color: var(--gray-500); font-size: var(--t-small-size); }
#view .vimp-map select, #view .vimp-choice select { width: 100%; max-width: 320px; }
#view .vimp-map td .l2 { display: block; }
#view .vimp-needs h3, #view .vimp-choices h3, #view .vimp-issues h3 { margin: 0 0 var(--s-2); font-size: var(--t-body-size); font-weight: var(--w-semibold); color: var(--gray-900); }
#view .vimp-needs ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--s-2) var(--s-4); }
#view .vimp-needs li { display: flex; gap: var(--s-2); align-items: flex-start; font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-500); }
#view .vimp-needs li[data-ok="true"] { color: var(--gray-700); }
#view .vimp-needs li svg { flex: 0 0 auto; width: 14px; height: 14px; margin-top: 3px; }
#view .vimp-count { margin: 0; font-size: var(--t-body-size); line-height: var(--t-body-lh); font-weight: var(--w-medium); color: var(--gray-900); font-variant-numeric: tabular-nums; }
#view .vimp-choices { display: flex; flex-direction: column; gap: var(--s-3); }
#view .vimp-choice { padding: var(--s-3) var(--s-4); border: 1px solid var(--gray-200); border-radius: var(--r-ctl); display: flex; flex-direction: column; gap: var(--s-2); }
#view .vimp-choice p { margin: 0; font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-700); }
#view .vimp-radios { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); font-size: var(--t-small-size); }
#view .vimp-radios label { display: inline-flex; align-items: center; gap: var(--s-2); cursor: pointer; }
#view .vimp-row { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; }
#view .vimp-issues ul { margin: 0 0 var(--s-2); padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--s-1); max-height: 320px; overflow: auto; }
#view .vimp-issues li { display: flex; gap: var(--s-3); font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-700); }
#view .vimp-issues li .v89-id { flex: 0 0 72px; color: var(--gray-500); }
#view .vimp-acts { display: flex; flex-direction: column; gap: var(--s-2); }
#view .vimp-act { display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-3) var(--s-4); border: 1px solid var(--gray-200); border-radius: var(--r-ctl); cursor: pointer; }
#view .vimp-act[data-off="true"] { cursor: default; }
#view .vimp-act[data-off="true"] .vimp-act-t b { color: var(--gray-500); }
#view .vimp-act input { margin-top: 3px; flex: 0 0 auto; }
#view .vimp-act-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
#view .vimp-act-t b { font-weight: var(--w-semibold); color: var(--gray-900); }
#view .vimp-act-n { font-size: var(--t-small-size); color: var(--gray-700); font-variant-numeric: tabular-nums; }
#view .vimp-act-t .l2 { font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-500); }
#view .vimp-dones { display: flex; flex-direction: column; gap: var(--s-3); }
#view .vimp-done { padding: var(--s-3) var(--s-4); border: 1px solid var(--gray-200); border-radius: var(--r-ctl); display: flex; flex-direction: column; gap: var(--s-2); }
#view .vimp-done-h { display: flex; align-items: center; gap: var(--s-2); }
#view .vimp-done-h b { font-weight: var(--w-semibold); color: var(--gray-900); }
#view .vimp-done p { margin: 0; font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-700); }
#view .vimp-ship .vimp-ship-r { display: flex; justify-content: space-between; gap: var(--s-3); padding: var(--s-2) 0; border-top: 1px solid var(--gray-200); font-size: var(--t-small-size); }
#view .vimp-ship .vimp-ship-r:first-child { border-top: 0; }
#view .vimp-ship .vimp-ship-r span { display: flex; flex-direction: column; min-width: 0; }
#view .vimp-ship .vimp-ship-r small { color: var(--gray-500); }
#view .vimp-ship .vimp-ship-r em { font-style: normal; color: var(--gray-700); text-align: right; }
@media (max-width: 699px) {
  #view .vimp-foot { padding: var(--s-3); flex-wrap: wrap; }
  #view .vimp-foot .btn { flex: 1 1 auto; min-height: 44px; justify-content: center; }
  #view .vimp-foot .sp { display: none; }
  #view label.drop.vimp-drop { min-height: 152px; padding: var(--s-4); }
  #view .vimp-map select, #view .vimp-choice select { max-width: none; }
  #view .vimp-issues li .v89-id { flex-basis: 64px; }
}