/* «Станция сборки» (спека 029, T012): поле скана, итог скана, лист подбора с картинками, коробы.
   Размеры - из токенов склада; янтарь только на главной кнопке экрана. */

.st-scan label { margin-bottom: var(--sp-1); }
.st-scan-row { display: flex; gap: var(--gap); align-items: stretch; }
.st-scan-row input { flex: 1 1 auto; min-width: 0; font-family: var(--mono); letter-spacing: .02em; }
.st-scan-row .btn { flex: none; min-width: 320px; }
.st-scan.is-err input { border-color: var(--danger-ink); background: var(--err-bg); }

/* Итог скана и шагов: слово крупно, ниже что делать */
.st-res { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4);
  background: var(--surface); border-radius: var(--radius-card); box-shadow: var(--shadow-soft); }
.st-ok { background: var(--ok-bg); }
.st-err { background: var(--err-bg); }
.st-ok .sumline-word { color: var(--green-ink); }
.st-err .sumline-word { color: var(--danger-ink); }

/* Лист подбора */
.st-sheet { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4);
  background: var(--surface); border-radius: var(--radius-card); box-shadow: var(--shadow-soft); }
.st-cur { display: flex; align-items: center; gap: var(--sp-4); }
.st-cur-txt { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.st-cur-name { font-family: var(--display); font-weight: 700; font-size: var(--fs-title); line-height: 1.1; overflow-wrap: anywhere; }
.st-cur-size { font-family: var(--display); font-weight: 700; font-size: var(--fs-status); line-height: 1.15; }
.st-cur-take { font-size: var(--fs-text); color: var(--ink-dim); }
.st-cur-act { flex: none; }
.st-photo { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 150px; height: 150px;
  background: var(--surface-2); border-radius: var(--radius-card); }
.st-photo svg { width: 78%; height: 78%; fill: var(--line); stroke: var(--ink-dim); stroke-width: 1.5; stroke-linejoin: round; }
.st-photo-s { width: 56px; height: 56px; border-radius: var(--radius); }
.st-rest { list-style: none; display: flex; flex-direction: column; border-top: 2px solid var(--surface-2); }
.st-rest li { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-1) 0; font-size: var(--fs-text); }
.st-r-name { flex: 1 1 auto; font-weight: 700; }
.st-r-take { color: var(--ink-dim); white-space: nowrap; }

/* Число коробов: минус, число, плюс */
.st-boxes-row { display: flex; gap: var(--gap); align-items: stretch; }
.st-boxes-row .btn { flex: none; min-width: 120px; font-size: var(--fs-status); }
.st-boxes-n { flex: none; width: 200px; text-align: center; font-family: var(--display); font-weight: 700; font-size: var(--fs-status); }

/* Сайт: фото из карточки WB вместо контура, полоса «Собрано N из M», подсказка (общие правила future-экранов макета) */
.st-photo { overflow: hidden; }
.st-photo img { width: 100%; height: 100%; object-fit: cover; }
.st-photo-s .st-nophoto { display: none; }
.st-nophoto { padding: var(--sp-1); text-align: center; font-size: var(--fs-caption); color: var(--ink-dim); }
.fut-bar { display: flex; flex-direction: column; gap: 4px; }
.fut-bar-text { font-size: var(--fs-caption); color: var(--ink); }
.fut-hint { font-size: var(--fs-caption); color: var(--ink-dim); line-height: 1.35; }
/* CSP не пускает style="": ширина полосы - классом, шаг 5% */
.st-pct-0 > span { width: 0%; }
.st-pct-5 > span { width: 5%; }
.st-pct-10 > span { width: 10%; }
.st-pct-15 > span { width: 15%; }
.st-pct-20 > span { width: 20%; }
.st-pct-25 > span { width: 25%; }
.st-pct-30 > span { width: 30%; }
.st-pct-35 > span { width: 35%; }
.st-pct-40 > span { width: 40%; }
.st-pct-45 > span { width: 45%; }
.st-pct-50 > span { width: 50%; }
.st-pct-55 > span { width: 55%; }
.st-pct-60 > span { width: 60%; }
.st-pct-65 > span { width: 65%; }
.st-pct-70 > span { width: 70%; }
.st-pct-75 > span { width: 75%; }
.st-pct-80 > span { width: 80%; }
.st-pct-85 > span { width: 85%; }
.st-pct-90 > span { width: 90%; }
.st-pct-95 > span { width: 95%; }
.st-pct-100 > span { width: 100%; }
.st-ack { margin-bottom: var(--sp-3); }
