:root {
  --bg: #f3f1f8;
  --panel: #ffffff;
  --text: #10071f;
  --muted: #746b82;
  --purple: #9137dc;
  --purple-dark: #3b145c;
  --border: #e4ddeb;
  --green: #009b67;
  --red: #d63c55;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  font-family: Inter, Segoe UI, Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
}

.shell {
  display: grid;
  grid-template-columns: 280px 1fr;
  min-height: 100vh;
}

.shell.logged-out {
  grid-template-columns: 1fr;
}

.shell.logged-out .sidebar {
  display: none;
}

.shell.logged-out .main {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 30px;
}

.shell.logged-out .login-card {
  width: min(460px, 100%);
  margin: 0;
}

.sidebar {
  background: #160d20;
  color: #fff;
  padding: 28px 22px;
}

.logo {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: var(--purple);
  font-size: 30px;
  font-weight: 900;
  margin-bottom: 24px;
}

.sidebar h1 {
  margin: 0 0 26px;
  font-size: 26px;
}

.eyebrow {
  margin: 0 0 8px;
  color: var(--purple);
  text-transform: uppercase;
  letter-spacing: .16em;
  font-weight: 800;
  font-size: 12px;
}

.sidebar .eyebrow { color: #c59cff; }

.nav {
  width: 100%;
  border: 0;
  color: #d9d2e5;
  background: transparent;
  text-align: left;
  padding: 16px 18px;
  border-radius: 16px;
  font-size: 18px;
  cursor: pointer;
}
.nav.active,
.nav:hover {
  background: var(--purple-dark);
  color: #fff;
}

.main {
  padding: 30px 36px;
}

.topbar,
.panel,
.login-card,
.card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 24px;
  box-shadow: 0 16px 45px rgba(25, 12, 50, .06);
}

.topbar {
  padding: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 22px;
}

h2, h3 { margin: 0 0 10px; }
.muted { color: var(--muted); margin: 0; line-height: 1.5; }

.login-card {
  max-width: 460px;
  margin: 8vh auto;
  padding: 34px;
}

.form {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

label {
  display: grid;
  gap: 7px;
  color: var(--muted);
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 13px 15px;
  font: inherit;
  background: #fff;
  color: var(--text);
}

textarea { resize: vertical; }

button {
  font: inherit;
}

.primary,
.ghost,
.danger-soft {
  border: 0;
  border-radius: 14px;
  padding: 13px 18px;
  cursor: pointer;
}

.primary {
  background: var(--purple);
  color: #fff;
  font-weight: 800;
}

.ghost {
  background: #f5effb;
  color: var(--purple-dark);
  border: 1px solid #d8c4ed;
}

.danger-soft {
  background: #fff2f4;
  color: var(--red);
  border: 1px solid #ffc9d2;
  font-weight: 800;
}

.cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 22px;
}

.card {
  padding: 24px;
}
.card span { color: var(--muted); }
.card strong {
  display: block;
  font-size: 38px;
  margin: 8px 0;
}
.card small { color: var(--green); }

.panel {
  padding: 24px;
  margin-bottom: 20px;
}

.server-storage-panel {
  display: grid;
  gap: 14px;
}

.server-storage-values {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.server-storage-values strong {
  font-size: 24px;
}

.server-storage-values span {
  color: var(--muted);
  font-weight: 700;
}

.server-storage-progress {
  width: 100%;
  height: 18px;
  overflow: hidden;
  border-radius: 999px;
  background: #eee6f6;
  box-shadow: inset 0 1px 3px rgba(25, 12, 50, .12);
}

.server-storage-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  transition: width .35s ease, background .2s ease;
}

.server-storage-progress span.safe { background: #20b875; }
.server-storage-progress span.warning { background: #f2a72b; }
.server-storage-progress span.danger { background: #ef4f64; }

.grid {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
  gap: 20px;
}

.features {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.features label {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #f8f4fc;
  border: 1px solid var(--border);
  padding: 10px;
  border-radius: 12px;
}
.features input { width: auto; }

.panel-head,
.shop-row,
.sync-controls {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
}

.shop-list {
  display: grid;
  gap: 12px;
}

.shop-row {
  background: #fbf9fd;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 16px;
}

.shop-row strong { display: block; }
.shop-meta {
  color: var(--muted);
  font-size: 14px;
  margin-top: 4px;
}

.shop-main {
  flex: 1 1 auto;
  min-width: 260px;
}

.password-row {
  align-items: flex-start;
}

.password-tools {
  display: grid;
  grid-template-columns: minmax(180px, 240px) auto auto;
  gap: 10px;
  align-items: center;
}

.password-tools input {
  padding: 10px 12px;
}

.badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.shop-feature-editor {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #dac9e8;
}

.shop-feature-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: auto;
  padding: 7px 10px;
  border: 1px solid #d8c4ed;
  border-radius: 999px;
  background: #fff;
  color: var(--purple-dark);
  font-size: 13px;
  font-weight: 800;
}

.shop-feature-pill input {
  width: 15px;
  height: 15px;
  margin: 0;
}

.shop-feature-editor small {
  color: var(--muted);
  font-weight: 800;
}

.shop-feature-editor small.ok { color: var(--green); }
.shop-feature-editor small.error { color: var(--red); }

.shop-production-editor {
  display: grid;
  grid-template-columns: minmax(210px, .7fr) minmax(560px, 2fr);
  gap: 10px;
  align-items: end;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid #d8c4ed;
  border-radius: 16px;
  background: #fbf8ff;
}

.shop-production-choices {
  display: grid;
  grid-template-columns: repeat(3, minmax(170px, 1fr));
  gap: 8px;
}

.production-choice {
  display: grid;
  gap: 4px;
  min-height: 72px;
  padding: 11px 13px;
  border: 1px solid #dfd1f5;
  border-radius: 14px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.production-choice:hover {
  border-color: var(--purple);
  background: #faf6ff;
}

.production-choice.active {
  border-color: var(--purple);
  background: #f1e7ff;
  box-shadow: inset 0 0 0 1px var(--purple);
}

.production-choice strong {
  font-size: 14px;
}

.production-choice span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.shop-production-editor-title {
  display: grid;
  gap: 4px;
}

.shop-production-editor-title small,
.shop-production-editor > small {
  color: var(--muted);
  font-weight: 700;
}

.shop-production-editor > small {
  grid-column: 1 / -1;
}

.shop-production-editor > label:not(.shop-production-check) {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.shop-production-editor select {
  min-width: 0;
  padding: 9px 11px;
}

.shop-production-check {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: auto;
  padding: 9px 11px;
  border: 1px solid #e0d2ed;
  border-radius: 12px;
  background: #fff;
  color: var(--purple-dark);
  font-size: 12px;
  font-weight: 800;
}

.shop-production-check input {
  width: 16px;
  height: 16px;
  margin: 0;
}

.shop-production-editor > small.ok { color: var(--green); }
.shop-production-editor > small.error { color: var(--red); }

.shop-matching-list-editor {
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(260px, 1fr) minmax(280px, 1fr);
  gap: 10px;
  align-items: end;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid #c9dcf3;
  border-radius: 16px;
  background: #f7fbff;
}

.shop-matching-list-title {
  display: grid;
  gap: 4px;
}

.shop-matching-list-title small,
.shop-matching-list-editor > small {
  color: var(--muted);
  font-weight: 700;
}

.shop-matching-list-editor > label:not(.shop-matching-list-check) {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.shop-matching-list-editor input[type="password"] {
  min-width: 0;
  padding: 9px 11px;
}

.shop-matching-list-check {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  color: var(--purple-dark);
  font-size: 12px;
  font-weight: 800;
}

.shop-matching-list-check input {
  width: 16px;
  height: 16px;
  margin: 0;
}

.shop-matching-list-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.shop-matching-list-editor > small {
  align-self: center;
}

.shop-matching-list-editor > small.ok { color: var(--green); }
.shop-matching-list-editor > small.error { color: var(--red); }

@media (max-width: 1300px) {
  .shop-production-editor,
  .shop-matching-list-editor {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .shop-production-editor,
  .shop-matching-list-editor {
    grid-template-columns: 1fr;
  }

  .shop-production-choices {
    grid-template-columns: 1fr;
  }
}

.badge {
  padding: 5px 9px;
  border-radius: 999px;
  background: #eadcf8;
  color: var(--purple-dark);
  font-size: 12px;
}
.badge.ok {
  background: #dff8ed;
  color: var(--green);
}
.badge.warn {
  background: #fff0d6;
  color: #9d5a00;
}

.sync-controls {
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-top: 16px;
}
.sync-controls select { max-width: 260px; }
.sync-controls.compact {
  margin-top: 0;
  justify-content: flex-end;
}

.message {
  min-height: 22px;
  color: var(--muted);
}
.message.error { color: var(--red); }
.message.ok { color: var(--green); }
.message.success { color: var(--green); }
.message.warn { color: #9d5a00; }

.logs {
  display: grid;
  gap: 10px;
}
.log-row {
  padding: 12px;
  border-radius: 14px;
  background: #fbf9fd;
  border: 1px solid var(--border);
}
.log-row small { color: var(--muted); }

.queue-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.queue-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 16px;
  background: #fff;
}

.queue-row:nth-child(odd) {
  background: #fbf9fd;
}

.queue-title {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 800;
  background: #eee8f6;
  color: var(--purple-dark);
}

.status-pill.running { background: #e2f2ff; color: #116399; }
.status-pill.processing,
.status-pill.submitted { background: #e9ddff; color: #6b1cc9; }
.status-pill.waiting { background: #fff0d6; color: #9d5a00; }
.status-pill.waiting_limit { background: #fff0d6; color: #9d5a00; }
.status-pill.completed { background: #dff8ed; color: var(--green); }
.status-pill.success { background: #dff8ed; color: var(--green); }
.status-pill.failed { background: #ffe1e7; color: var(--red); }
.status-pill.error { background: #ffe1e7; color: var(--red); }
.status-pill.delayed { background: #fff0d6; color: #9d5a00; }
.status-pill.skipped { background: #f3edf9; color: var(--muted); }
.status-pill.stopped,
.status-pill.stopping { background: #fff0d6; color: #9d5a00; }

.progress-track {
  height: 9px;
  background: #eadff2;
  border-radius: 999px;
  overflow: hidden;
  margin-top: 10px;
}

.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--purple), #bd61ff);
  border-radius: inherit;
}

.queue-actions {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.admin-card-queues-list { display: grid; gap: 12px; margin-top: 16px; }
.admin-card-queue-row { border: 1px solid #ded3f2; border-left: 4px solid #8f42df; border-radius: 14px; padding: 16px; background: #fff; }
.admin-card-queue-row.limit { border-left-color: #e5a020; background: #fffaf0; }
.admin-card-queue-row.error { border-left-color: #db4d69; background: #fff8fa; }
.admin-card-queue-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.admin-card-queue-head strong { display: block; font-size: 17px; }
.admin-card-queue-head small { display: block; margin-top: 4px; color: #776b8d; }
.admin-card-queue-head > b { color: #6f2bb4; white-space: nowrap; }
.admin-card-queue-row.limit .admin-card-queue-head > b { color: #9a6200; }
.admin-card-queue-row.error .admin-card-queue-head > b { color: #c63250; }
.admin-card-queue-stages { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.admin-card-queue-stages > span { min-width: 90px; padding: 8px 10px; border-radius: 10px; background: #f6f1fc; }
.admin-card-queue-stages small { display: block; color: #776b8d; font-size: 11px; }
.admin-card-queue-stages b { display: block; margin-top: 2px; font-size: 17px; }
.admin-card-queue-footer { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 14px; color: #665a7a; font-size: 13px; }
.admin-card-queue-footer .done { color: #0b8c57; }
.admin-card-queue-footer .retry { color: #9a6200; }
.admin-card-queue-footer .error { color: #c63250; }

.card-queue-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 20px;
}

.card-queue-live {
  display: grid;
  grid-template-columns: minmax(280px, 1.2fr) minmax(420px, 1.8fr);
  gap: 16px;
  margin-top: 18px;
  padding: 18px;
  border: 1px solid #d9bdf8;
  border-radius: 22px;
  background: linear-gradient(135deg, #f8efff 0%, #fff 62%);
}

.card-queue-live-state {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.card-queue-live-dot {
  width: 12px;
  height: 12px;
  margin-top: 7px;
  border-radius: 50%;
  background: #9f8bac;
  box-shadow: 0 0 0 5px rgba(159, 139, 172, 0.14);
}

.card-queue-live-state.running .card-queue-live-dot {
  background: #16a36b;
  box-shadow: 0 0 0 5px rgba(22, 163, 107, 0.14);
  animation: card-queue-pulse 1.8s ease-in-out infinite;
}

.card-queue-live-state.waiting_limit .card-queue-live-dot {
  background: #e4a11b;
  box-shadow: 0 0 0 5px rgba(228, 161, 27, 0.16);
}

.card-queue-live-state.attention .card-queue-live-dot {
  background: #df4063;
  box-shadow: 0 0 0 5px rgba(223, 64, 99, 0.14);
}

@keyframes card-queue-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(0.78); opacity: 0.65; }
}

.card-queue-live-state small,
.card-queue-live-facts span,
.card-queue-live-facts small {
  display: block;
  color: #756b82;
  font-size: 12px;
}

.card-queue-live-state strong {
  display: block;
  margin-top: 3px;
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.15;
}

.card-queue-live-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.card-queue-limit-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border: 1px solid #efbf62;
  border-radius: 999px;
  background: #fff4dc;
  color: #8d5200;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.card-queue-limit-badge b {
  min-width: 68px;
  font-variant-numeric: tabular-nums;
  color: #bc6100;
}

.card-queue-live-state p {
  margin: 7px 0 0;
  color: #554a62;
  font-size: 14px;
  line-height: 1.45;
}

.card-queue-live-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.card-queue-live-facts > div {
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #eadcf8;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.82);
}

.card-queue-live-facts strong {
  display: block;
  margin: 6px 0 4px;
  overflow-wrap: anywhere;
  font-size: 16px;
}

.queue-summary-card {
  min-height: 118px;
  padding: 16px;
}

.queue-summary-card strong {
  font-size: 30px;
}

.queue-summary-card.clickable {
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.queue-summary-card.clickable:hover,
.queue-summary-card.clickable:focus-visible {
  transform: translateY(-2px);
  border-color: #df718b;
  box-shadow: 0 12px 28px rgba(170, 48, 82, .13);
  outline: none;
}

.queue-summary-open {
  display: block;
  margin-top: 8px;
  color: #b62e51;
  font-size: 12px;
}

.queue-errors-modal {
  width: min(920px, 96vw);
  max-height: 92vh;
  overflow: auto;
  padding: 22px;
  border: 1px solid #efbdca;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(24, 10, 40, .32);
}

.queue-error-groups {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.queue-error-group {
  padding: 16px;
  border: 1px solid #f0ccd5;
  border-radius: 18px;
  background: #fff8fa;
}

.queue-error-group.automatic {
  border-color: #efd49b;
  background: #fffaf0;
}

.queue-error-group.technical {
  border-color: #d8dce8;
  background: #f8f9fc;
}

.queue-error-group.automatic .queue-error-group-head span {
  background: #ffedc4;
  color: #8a5b00;
}

.queue-error-group.technical .queue-error-group-head span {
  background: #e8ebf3;
  color: #566078;
}

.queue-error-group-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
}

.queue-error-group-head strong {
  font-size: 18px;
}

.queue-error-group-head span {
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  background: #f6dce3;
  color: #a32648;
  font-weight: 800;
  font-size: 12px;
}

.queue-error-group p {
  margin: 10px 0;
  color: #4f4358;
  line-height: 1.45;
}

.queue-error-action {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .78);
  line-height: 1.45;
}

.queue-error-group details {
  margin-top: 12px;
}

.queue-error-group summary {
  cursor: pointer;
  color: var(--purple-dark);
  font-weight: 800;
}

.queue-error-examples {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0;
}

.queue-error-examples code {
  padding: 5px 8px;
  border: 1px solid #eadbf5;
  border-radius: 9px;
  background: #fff;
  color: #382744;
}

.queue-error-group > small {
  display: block;
  margin-top: 10px;
  color: #7b6d84;
}

.queue-summary-1 { border-color: #afe3c9; background: #f3fff8; }
.queue-summary-2 { border-color: #cbb0f5; background: #fbf7ff; }
.queue-summary-3 { border-color: #e6c879; background: #fffaf0; }
.queue-summary-4 { border-color: #f0bdc9; background: #fff6f8; }

.card-queue-section {
  margin: 20px 0;
  padding-top: 18px;
  border-top: 1px solid #eee4f6;
}

.card-queue-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
  margin-bottom: 12px;
}

.card-queue-section-head h4 {
  margin: 0 0 4px;
  font-size: 18px;
}

.card-queue-section-head p {
  margin: 0;
}

.card-queue-batches-section {
  margin-top: 16px;
}

.card-queue-batches {
  display: grid;
  gap: 10px;
}

.card-queue-details,
.card-queue-batch-history {
  margin-top: 16px;
  border: 1px solid #e6dced;
  border-radius: 16px;
  background: #fbf9fd;
}

.card-queue-details > summary,
.card-queue-batch-history > summary {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
}

.card-queue-details > summary::-webkit-details-marker,
.card-queue-batch-history > summary::-webkit-details-marker { display: none; }

.card-queue-details > summary span,
.card-queue-batch-history > summary span {
  display: grid;
  gap: 3px;
}

.card-queue-details > summary small,
.card-queue-batch-history > summary small {
  color: #756b82;
  font-weight: 400;
}

.card-queue-details > summary b,
.card-queue-batch-history > summary b {
  color: var(--purple-dark);
  font-size: 12px;
}

.card-queue-details[open],
.card-queue-batch-history[open] { padding-bottom: 14px; }

.card-queue-details > .card-queue-section,
.card-queue-details > .card-queue-section-head,
.card-queue-details > .card-queue-list {
  margin-right: 16px;
  margin-left: 16px;
}

.card-queue-batch-history-list {
  display: grid;
  gap: 10px;
  padding: 0 12px;
}

.card-queue-detail-head {
  display: grid;
  gap: 3px;
  margin: 18px 0 12px;
  padding: 13px 16px;
  border: 1px solid #b6e4cc;
  border-radius: 14px;
  background: linear-gradient(135deg, #f1fff7, #fbfffd);
}

.card-queue-detail-head > span,
.card-queue-detail-head > small {
  color: #6f7d75;
  font-size: 12px;
}

.card-queue-detail-head > strong {
  color: #12653e;
  font-size: 17px;
}

.card-queue-design-fallback {
  padding: 14px 16px;
  border: 1px solid #e4daeb;
  border-radius: 14px;
  background: #fff;
}

.card-queue-design-fallback p {
  margin: 7px 0;
  color: #4f4658;
  word-break: break-word;
}

.card-queue-design-fallback small {
  color: #7c7285;
}

.card-queue-batch-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(210px, 1.5fr) repeat(6, minmax(86px, 0.7fr));
  gap: 10px;
  align-items: center;
  padding: 14px 16px 20px;
  border: 1px solid #e7dcef;
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}

.card-queue-batch-row.collecting {
  border-color: #c9a7ef;
  background: #fbf7ff;
}

.card-queue-batch-row.current {
  border-color: #a9dec5;
  background: #f6fff9;
  box-shadow: 0 0 0 2px rgba(45, 177, 108, 0.08);
}

.card-queue-batch-title strong,
.card-queue-batch-title small,
.card-queue-batch-stat span,
.card-queue-batch-stat b {
  display: block;
}

.card-queue-batch-title > div {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.card-queue-batch-title strong {
  font-size: 17px;
}

.card-queue-batch-title small,
.card-queue-batch-stat span,
.card-queue-batch-stat small,
.card-queue-batch-designs {
  color: #756b82;
  font-size: 11px;
}

.card-queue-batch-role {
  padding: 4px 8px;
  border-radius: 999px;
  background: #eee7f4;
  color: #6d577c;
  font-size: 11px;
  font-weight: 800;
}

.card-queue-batch-role.collecting { background: #eadbfa; color: #6f2bb4; }
.card-queue-batch-role.current { background: #d8f3e6; color: #087847; }

.card-queue-batch-stat b {
  margin-top: 3px;
  font-size: 18px;
}

.card-queue-batch-stat small {
  display: block;
  margin-top: 2px;
}

.card-queue-batch-stat.done b { color: #0c9960; }
.card-queue-batch-stat.error b { color: #d53b60; }
.card-queue-batch-stat.automatic b { color: #9a6200; }
.card-queue-batch-stat.remaining b,
.card-queue-batch-stat.queued b { color: #9a6200; }

.card-queue-batch-designs {
  grid-column: 1 / -1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.card-queue-batch-designs span {
  font-weight: 800;
  color: #564460;
}

.card-queue-batch-progress {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 5px;
  background: #f0ebf4;
}

.card-queue-batch-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #8b36d8, #23b875);
}

.card-queue-stages {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.card-queue-stage {
  position: relative;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 10px;
  min-height: 142px;
  padding: 14px;
  border: 1px solid #e8ddf1;
  border-radius: 18px;
  background: #faf8fc;
}

.card-queue-stage.active {
  border-color: #cbb0f5;
  background: #fbf7ff;
  box-shadow: 0 9px 24px rgba(117, 61, 169, 0.08);
}

.card-queue-stage.queued.active { border-color: #e6c879; background: #fffaf0; }
.card-queue-stage.price.active { border-color: #e1bd73; background: #fffaf1; }
.card-queue-stage.media.active,
.card-queue-stage.stock.active { border-color: #9eddbd; background: #f3fff8; }

.card-queue-stage-number {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #eee5f6;
  color: #6b557d;
  font-size: 13px;
  font-weight: 900;
}

.card-queue-stage.active .card-queue-stage-number {
  color: #fff;
  background: var(--purple);
}

.card-queue-stage span:not(.card-queue-stage-number),
.card-queue-stage small {
  display: block;
  color: #756b82;
  font-size: 12px;
  line-height: 1.35;
}

.card-queue-stage strong {
  display: block;
  margin: 4px 0 7px;
  font-size: 29px;
  line-height: 1;
}

.card-queue-stage .card-queue-stage-detail {
  display: inline-block;
  margin: 0 0 7px;
  padding: 5px 8px;
  border-radius: 999px;
  color: #087a4e;
  background: #dff8eb;
  font-size: 11px;
  line-height: 1.2;
}

.queue-stage-detail {
  display: block;
  margin-top: 4px;
  color: #756b82;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.35;
}

.card-queue-design-table-wrap {
  overflow-x: auto;
  border: 1px solid #e6d8f2;
  border-radius: 18px;
  background: #fff;
}

.card-queue-design-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
}

.card-queue-design-table th,
.card-queue-design-table td {
  padding: 12px 13px;
  border-bottom: 1px solid #eee5f5;
  text-align: center;
  white-space: nowrap;
}

.card-queue-design-table th {
  color: #756b82;
  background: #faf7fc;
  font-size: 12px;
}

.card-queue-design-table th:first-child,
.card-queue-design-table td:first-child {
  min-width: 170px;
  text-align: left;
}

.card-queue-design-table tbody tr:last-child td {
  border-bottom: 0;
}

.queue-design-state {
  display: inline-block;
  margin-left: 8px;
  padding: 3px 7px;
  border-radius: 999px;
  color: #70408e;
  background: #f0e4fa;
  font-size: 10px;
  font-weight: 800;
}

.queue-design-state.done { color: #087a4e; background: #ddf8e9; }
.queue-design-state.error { color: #bd2548; background: #ffe4eb; }

.queue-design-percent {
  float: right;
  margin-left: 10px;
  color: #67457d;
  font-size: 11px;
  font-weight: 900;
}

.queue-design-progress {
  width: 100%;
  height: 5px;
  margin-top: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #eee5f5;
}

.queue-design-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--purple), #41bd81);
  transition: width 0.45s ease;
}

.queue-design-progress i.active {
  background: linear-gradient(90deg, var(--purple) 0%, #bd61ff 35%, #41bd81 70%, var(--purple) 100%);
  background-size: 220% 100%;
  animation: queue-design-live-progress 2.3s linear infinite;
}

@keyframes queue-design-live-progress {
  from { background-position: 100% 0; }
  to { background-position: -120% 0; }
}

.queue-design-caption {
  display: block;
  margin-top: 5px;
  color: #756b82;
  font-size: 10px;
  font-weight: 600;
}

.queue-good { color: #087a4e; font-weight: 800; }
.queue-bad { color: #c52c50; font-weight: 800; }

.card-queue-management {
  margin: 18px 0;
  padding: 13px 16px;
  border: 1px solid #e5d7f0;
  border-radius: 16px;
  background: #fcf9ff;
}

.card-queue-management > summary {
  cursor: pointer;
  font-weight: 800;
}

.card-queue-management > p {
  margin: 10px 0 0;
}

.card-queue-items-head {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #eee4f6;
}

.card-queue-updated {
  color: #756b82;
  font-size: 12px;
  white-space: nowrap;
}

.card-queue-work-group {
  overflow: hidden;
  border: 1px solid #e5d7f0;
  border-radius: 18px;
  background: #fff;
}

.card-queue-work-group > summary {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 15px 18px;
  cursor: pointer;
  list-style: none;
  background: #faf7fc;
}

.card-queue-work-group > summary::-webkit-details-marker { display: none; }

.card-queue-work-group > summary::before {
  content: "›";
  flex: 0 0 auto;
  color: var(--purple);
  font-size: 26px;
  line-height: 1;
  transition: transform 0.18s ease;
}

.card-queue-work-group[open] > summary::before { transform: rotate(90deg); }

.card-queue-work-group > summary > span {
  flex: 1;
  min-width: 0;
}

.card-queue-work-group > summary strong,
.card-queue-work-group > summary small {
  display: block;
}

.card-queue-work-group > summary small {
  margin-top: 3px;
  color: #756b82;
  font-weight: 500;
}

.card-queue-work-group > summary > b {
  min-width: 42px;
  padding: 7px 11px;
  border-radius: 999px;
  color: #643284;
  background: #eee0fa;
  text-align: center;
  font-size: 16px;
}

.card-queue-work-items {
  display: grid;
  gap: 8px;
  padding: 10px;
  border-top: 1px solid #eee5f5;
}

.card-queue-controls,
.operation-log-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 10px;
  margin: 14px 0;
}

.card-queue-controls label {
  display: grid;
  gap: 6px;
  min-width: 210px;
  color: #756b82;
  font-size: 13px;
  font-weight: 700;
}

.card-queue-controls input {
  min-height: 42px;
}

.card-queue-list,
.operation-log-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.card-queue-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid #eadcf8;
  border-radius: 16px;
  background: #fff;
}

.card-queue-row.processing,
.card-queue-row.submitted {
  border-color: #d7bcff;
  background: #fbf7ff;
}

.card-queue-row.completed {
  border-color: #bdeed4;
  background: #f4fff8;
}

.card-queue-row.failed {
  border-color: #ffbfd0;
  background: #fff5f8;
}

.card-queue-row-actions {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.operation-log-filters select {
  min-width: 210px;
}

.operation-log-row {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 13px 15px;
  border: 1px solid #eadcf8;
  border-radius: 16px;
  background: #fff;
}

.operation-log-row p {
  margin: 7px 0 0;
}

.operation-log-mark {
  width: 10px;
  height: 10px;
  margin-top: 6px;
  border-radius: 50%;
  background: #9c78bd;
}

.operation-log-row.success .operation-log-mark {
  background: #19a66f;
}

.operation-log-row.error .operation-log-mark {
  background: #e13d64;
}

.operation-log-row.waiting .operation-log-mark {
  background: #e4a11b;
}

@media (max-width: 760px) {
  #shop-card-queue-view .panel-head {
    align-items: flex-start;
    flex-direction: column;
  }

  #shop-card-queue-view .panel-head > button {
    align-self: flex-start;
  }

  .card-queue-live {
    grid-template-columns: 1fr;
    padding: 14px;
  }

  .card-queue-live-facts {
    grid-template-columns: 1fr;
  }

  .card-queue-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .card-queue-stages {
    grid-template-columns: 1fr;
  }

  .card-queue-batch-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .card-queue-batch-title,
  .card-queue-batch-designs {
    grid-column: 1 / -1;
  }

  .card-queue-stage {
    min-height: 0;
  }

  .card-queue-section-head,
  .card-queue-items-head {
    align-items: start;
    flex-direction: column;
  }

  .card-queue-work-group > summary {
    padding: 13px 14px;
  }

  .card-queue-row,
  .operation-log-row {
    grid-template-columns: 1fr;
  }

  .card-queue-row-actions {
    justify-items: start;
  }
}

@media (min-width: 761px) and (max-width: 1250px) {
  .card-queue-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .card-queue-live {
    grid-template-columns: 1fr;
  }

  .card-queue-stages {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .card-queue-batch-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .card-queue-batch-title,
  .card-queue-batch-designs {
    grid-column: 1 / -1;
  }
}

.ghost.danger {
  color: var(--red);
  border-color: #f0b9c3;
  background: #fff5f7;
}

.grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 18px;
}

#shop-advice-view {
  max-width: 1180px;
}

#shop-advice-view .panel {
  padding: 16px 18px;
  margin-bottom: 12px;
}

#shop-advice-view .advice-hero h3 {
  font-size: 26px;
  margin: 4px 0;
}

#shop-advice-view .advice-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

#shop-advice-view .advice-summary .card {
  padding: 14px 16px;
}

#shop-advice-view .advice-summary .card strong {
  font-size: 26px;
  margin: 4px 0;
}

.advice-main-panel .panel-head {
  margin-bottom: 10px;
}

.grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
}

.today-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.today-card {
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 16px;
  background: #fff;
  display: grid;
  gap: 14px;
}

#shop-advice-view .today-grid {
  gap: 10px;
}

#shop-advice-view .today-card {
  padding: 12px;
  gap: 10px;
}

#shop-advice-view .today-card-head {
  grid-template-columns: 38px 1fr;
  gap: 10px;
}

#shop-advice-view .today-card-head strong {
  font-size: 15px;
}

#shop-advice-view .today-card-head p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#shop-advice-view .advice-count {
  min-width: 38px;
  height: 38px;
  border-radius: 13px;
  font-size: 16px;
}

.today-card.high {
  border-color: #e9b0bd;
  background: #fff8fa;
}

.today-card-head {
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 12px;
  align-items: start;
}

.today-card-head strong {
  display: block;
  font-size: 18px;
  line-height: 1.15;
  margin-bottom: 6px;
}

.today-target {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-radius: 16px;
  background: #fbf9fd;
}

.today-target img {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  object-fit: cover;
  background: #efe6f7;
}

.today-target .product-placeholder {
  width: 44px;
  height: 44px;
  border-radius: 12px;
}

.advice-grid {
  display: grid;
  gap: 10px;
}

.advice-card {
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 18px;
  background: #fbf9fd;
}

#shop-advice-view .advice-card {
  padding: 12px;
  border-radius: 16px;
}

#shop-advice-view .advice-head strong {
  font-size: 16px;
}

#shop-advice-view .advice-head p,
#shop-advice-view .advice-action {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#shop-advice-view .advice-action {
  margin: 8px 0;
  padding: 8px 10px;
  font-size: 13px;
}

#shop-advice-view .advice-action.small {
  display: none;
}

.advice-card.high {
  border-color: #e9b0bd;
  background: #fff8fa;
}

.advice-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}

.advice-head strong {
  display: block;
  font-size: 20px;
  margin-bottom: 6px;
}

.advice-count {
  min-width: 46px;
  height: 46px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: var(--purple);
  color: #fff;
  font-size: 20px;
  font-weight: 900;
}

.advice-action {
  margin: 12px 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: #fff;
  color: var(--purple-dark);
  border: 1px solid var(--border);
}

.advice-action.small {
  margin: 8px 0;
  padding: 8px 10px;
  font-size: 13px;
}

.row-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.ad-score,
.action-pill {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 800;
  background: #efe2ff;
  color: var(--purple-dark);
}

.action-pill {
  margin: 4px 0;
  background: #e9f9ef;
  color: #00844b;
}

.product-list.mini {
  max-height: 320px;
  overflow: auto;
  padding-right: 4px;
}

.advice-details {
  display: grid;
  gap: 10px;
}

.advice-details-panel {
  padding: 0 !important;
  overflow: hidden;
}

.advice-details-panel > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  cursor: pointer;
  padding: 14px 18px;
  list-style: none;
}

.advice-details-panel > summary::-webkit-details-marker {
  display: none;
}

.advice-details-panel > summary::after {
  content: "раскрыть";
  color: var(--purple);
  font-size: 13px;
  font-weight: 800;
}

.advice-details-panel[open] > summary::after {
  content: "свернуть";
}

.advice-details-panel > summary span {
  font-size: 18px;
  font-weight: 900;
}

.advice-details-panel > summary small {
  color: var(--muted);
}

.advice-details-panel > .advice-grid,
.advice-details-panel > .product-list,
.advice-details-panel > .grid,
.advice-details-panel > p {
  margin-left: 18px;
  margin-right: 18px;
  margin-bottom: 16px;
}

.design-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.design-row {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 10px;
  background: #fff;
}

.design-row:nth-child(odd) {
  background: #fbf9fd;
}

.design-row.bad-review {
  border-color: #f0c2cb;
  background: #fff8fa;
}

.design-row img {
  width: 58px;
  height: 58px;
  border-radius: 14px;
  object-fit: cover;
  background: #efe6f7;
}

.category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.catalog-tabs {
  display: flex;
  gap: 8px;
  margin-top: 16px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
}

.catalog-tab {
  border: 1px solid var(--border);
  background: #fff;
  color: var(--purple-dark);
  border-radius: 999px;
  padding: 9px 14px;
  font-weight: 800;
  cursor: pointer;
}

.catalog-tab.active {
  background: var(--purple);
  color: #fff;
  border-color: var(--purple);
}

.shops-tabs {
  margin-bottom: 18px;
}

.shop-statistics-table-wrap {
  overflow-x: auto;
}

.shop-statistics-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 720px;
}

.shop-statistics-table th,
.shop-statistics-table td {
  padding: 16px 18px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: middle;
}

.shop-statistics-table th {
  color: var(--muted);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.shop-statistics-table tbody tr:nth-child(even) {
  background: #fbf9ff;
}

.shop-statistics-table td strong,
.shop-statistics-table td small {
  display: block;
}

.shop-statistics-table td small {
  margin-top: 5px;
  color: var(--muted);
}

.shop-statistics-table td.num {
  font-size: 20px;
  font-weight: 800;
}

.shop-statistics-table tbody tr.shop-statistics-total-row {
  background: #f1e8ff;
}

.shop-statistics-table .shop-statistics-total-row td {
  border-top: 2px solid var(--purple);
  font-weight: 800;
}

.design-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px) auto;
  gap: 10px;
  align-items: center;
  margin-top: 16px;
}

.design-toolbar input,
.design-toolbar select {
  width: 100%;
}

.design-profile-import-form {
  display: grid;
  grid-template-columns: minmax(250px, 1fr) minmax(280px, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-top: 16px;
  padding: 14px;
  border: 1px solid #d9c6ef;
  border-radius: 18px;
  background: linear-gradient(135deg, #fbf7ff, #fff);
}

.design-profile-import-form div {
  display: grid;
  gap: 4px;
}

.design-profile-import-form small {
  color: var(--muted);
  line-height: 1.35;
}

.design-profile-import-errors {
  margin: 10px 0 0;
  padding: 12px 14px;
  border: 1px solid #f0b6c0;
  border-radius: 16px;
  background: #fff7f8;
}

.design-profile-import-errors summary {
  color: var(--red);
  font-weight: 800;
  cursor: pointer;
}

.design-profile-import-errors div {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.design-profile-import-errors p {
  display: grid;
  grid-template-columns: minmax(80px, auto) minmax(160px, auto) 1fr;
  gap: 10px;
  margin: 0;
  padding-top: 8px;
  border-top: 1px solid #f3d4da;
}

.design-profile-import-errors span,
.design-profile-import-errors em {
  color: var(--muted);
  font-style: normal;
}

.design-settings-panel {
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(320px, 1.6fr);
  gap: 16px;
  align-items: start;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: linear-gradient(135deg, #fff, #fbf6ff);
}

.design-settings-panel h4 {
  margin: 4px 0 6px;
}

.design-source-upload-panel {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(320px, .9fr);
  gap: 14px;
  align-items: center;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid #d9c6ef;
  border-radius: 20px;
  background: linear-gradient(135deg, #fbfff9, #fff);
}

.design-source-upload-panel h4 {
  margin: 4px 0 6px;
}

.design-sources-form {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}

.design-sources-form input {
  min-width: 260px;
  flex: 1;
  padding: 12px;
  border: 1px dashed #cfb2eb;
  border-radius: 14px;
  background: #fff;
}

.design-sources-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
  width: 100%;
}

.design-sources-mode-note {
  width: 100%;
  color: var(--muted);
  line-height: 1.45;
  text-align: right;
}

.design-sources-result {
  grid-column: 1 / -1;
  padding: 14px;
  border: 1px solid #d6f1df;
  border-radius: 18px;
  background: #f5fff8;
  font-size: 15px;
}

.design-sources-created {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #eaf9ef;
  color: #17633a;
}

.design-sources-result.compact {
  padding: 10px 14px;
}

.design-sources-result.compact .design-sources-result-head {
  margin-bottom: 0;
}

.design-sources-result-head {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.design-sources-result-head strong {
  font-size: 18px;
}

.design-sources-result-head span {
  color: var(--muted);
}

.design-sources-result-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  gap: 12px;
}

.design-sources-result-grid > div {
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fff;
  min-width: 0;
}

.design-sources-result-grid ul {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
  padding-left: 18px;
}

.design-sources-result-grid li span {
  color: var(--muted);
}

.design-sources-progress-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #b9efcc;
  border-radius: 18px;
  background: linear-gradient(135deg, #f0fff5, #fff);
}

.design-sources-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.design-sources-progress-head strong {
  font-size: 18px;
}

.design-sources-progress-head span {
  font-size: 22px;
  font-weight: 900;
  color: var(--green);
}

.design-sources-progress-bar {
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: #e8dcef;
}

.design-sources-progress-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green), var(--purple));
  transition: width .25s ease;
}

.design-sources-progress-meta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  color: var(--muted);
}

.design-sources-progress-card small {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
}

.design-settings-grid {
  display: grid;
  grid-template-columns: minmax(220px, 300px) 1fr auto;
  gap: 12px;
  align-items: end;
}

.design-settings-grid label {
  display: grid;
  gap: 6px;
  color: var(--muted);
}

.field-label {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
}

.design-category-settings {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-height: 120px;
  overflow: auto;
  padding-right: 4px;
}

.design-category-pill {
  display: inline-flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 7px !important;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: #fff;
  color: #17101f !important;
  cursor: pointer;
}

.design-category-pill input {
  width: 16px;
  height: 16px;
}

.design-category-pill span {
  font-weight: 800;
}

.design-category-pill em {
  font-style: normal;
  color: var(--green);
  font-size: 12px;
}

.design-sort-panel {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fbf9fd;
}

.design-sort-panel-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.design-sort-panel-row input {
  min-width: 260px;
  flex: 1;
}

button.small {
  padding: 9px 14px;
  border-radius: 14px;
}

.ghost.danger,
button.danger {
  color: #c2253d;
  border-color: #f0b6c0;
}

.shop-design-card {
  position: relative;
}

.shop-design-card input[type="checkbox"] {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 18px;
  height: 18px;
}

.shop-design-card.selected {
  border-color: var(--purple);
  box-shadow: 0 10px 30px rgba(145, 55, 220, .18);
}

.shop-design-card.system {
  background: #fff8f0;
  border-color: #f3d6a7;
}

.shop-design-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.shop-design-card {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 210px auto;
  align-items: stretch;
  gap: 0;
  min-height: 310px;
  text-align: center;
  border: 1px solid var(--border);
  border-radius: 22px;
  padding: 0;
  background: #fff;
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(30, 12, 45, .06);
}

.shop-design-card:hover {
  border-color: #c69be9;
  box-shadow: 0 18px 38px rgba(145, 55, 220, .16);
  transform: translateY(-1px);
}

.shop-design-card img,
.shop-design-card .category-placeholder {
  width: 100%;
  height: 210px;
  border-radius: 0;
  object-fit: contain;
  background: linear-gradient(180deg, #f8f3fb, #fff);
  padding: 10px;
  border-bottom: 1px solid #eadff2;
}

.shop-design-card > span:not(.category-placeholder) {
  display: grid;
  gap: 3px;
  align-content: start;
  padding: 10px 12px 12px;
  min-width: 0;
}

.shop-design-card strong,
.shop-design-card small,
.shop-design-card em {
  display: block;
}

.shop-design-card strong {
  font-size: 20px;
  line-height: 1.1;
}

.shop-design-card small {
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.shop-design-card em {
  font-style: normal;
  color: var(--green);
  font-size: 13px;
  font-weight: 800;
  margin-top: 2px;
}

.shop-design-card .source-badge {
  display: inline-flex;
  width: fit-content;
  justify-self: center;
  margin-top: 5px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

.shop-design-card .source-badge.ok {
  background: #dff8ed;
  color: var(--green);
}

.shop-design-card .source-badge.missing {
  background: #ffe4e8;
  color: var(--red);
}

.scale-design-grid {
  margin-top: 14px;
}

.scale-design-card {
  grid-template-rows: 230px auto;
}

.scale-design-card img,
.scale-design-card .category-placeholder {
  height: 230px;
}

.scale-main-panel {
  margin-top: 14px;
  margin-bottom: 16px;
  border-color: #d9b7f5;
  background: linear-gradient(180deg, #fff, #fbf7ff);
}

.design-profile-form {
  margin-top: 14px;
  padding: 16px;
  border: 1px solid #e5d1f7;
  border-radius: 18px;
  background: #fff;
}

.design-profile-head,
.design-profile-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.design-profile-head h4 {
  margin: 2px 0 4px;
  font-size: 18px;
}

.design-profile-status,
.profile-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: #ffe4e8;
  color: var(--red);
  font-size: 12px;
  font-weight: 800;
}

.design-profile-status.complete,
.profile-badge.ok {
  background: #dff8ed;
  color: var(--green);
}

.design-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.design-profile-grid label {
  display: grid;
  gap: 7px;
  color: #4e435d;
  font-size: 13px;
  font-weight: 700;
}

.design-profile-grid label span b {
  color: var(--red);
}

.design-profile-grid input {
  width: 100%;
}

.design-profile-grid input[readonly] {
  background: #f4eff8;
  color: #766b80;
}

.design-profile-grid label.design-profile-adult {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  min-width: 180px;
  padding: 10px 12px;
  border: 1px solid #e5d1f7;
  border-radius: 14px;
  background: #fbf7ff;
  cursor: pointer;
}

.design-profile-grid label.design-profile-adult input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--purple);
}

.template-stock-destination {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 10px 10px;
  border: 1px solid #e5d1f7;
  border-radius: 14px;
  background: #fbf7ff;
}

.template-stock-destination legend {
  padding: 0 4px;
  color: #4e435d;
  font-size: 13px;
  font-weight: 700;
}

.design-profile-grid .template-stock-destination label {
  display: inline-flex;
  flex: 1 1 0;
  grid-template-columns: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid #e5d1f7;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
}

.design-profile-grid .template-stock-destination input {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--purple);
}

.design-profile-adult span {
  display: grid;
  gap: 2px;
}

.design-profile-adult strong {
  font-size: 14px;
  color: #4e435d;
}

.design-profile-adult small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
}

.design-profile-footer {
  margin-top: 14px;
}

.design-profile-footer .muted {
  font-size: 13px;
}

.scale-design-card .profile-badge {
  justify-self: center;
  margin-top: 4px;
  padding: 4px 9px;
  font-size: 11px;
}

@media (max-width: 760px) {
  .design-profile-grid {
    grid-template-columns: 1fr;
  }

  .design-profile-head,
  .design-profile-footer {
    align-items: stretch;
    flex-direction: column;
  }
}

.product-row.sortable-product {
  grid-template-columns: 26px 58px 1fr;
}

.product-row.sortable-product.selected {
  border-color: var(--purple);
  background: #fbf4ff;
}

.product-select input {
  width: 18px;
  height: 18px;
}

.product-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.product-actions button {
  border-radius: 12px;
  padding: 7px 10px;
  font-size: 13px;
}

body.modal-open {
  overflow: hidden;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  overflow: auto;
  background: rgba(18, 10, 28, .58);
  backdrop-filter: blur(6px);
}

.modal-backdrop[hidden] {
  display: none;
}

.design-modal {
  width: min(1760px, 99vw);
  height: auto;
  max-height: 98vh;
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 10px;
  padding: 18px;
  border: 1px solid rgba(214, 190, 236, .95);
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 30px 90px rgba(24, 10, 40, .32);
  overflow: auto;
  overscroll-behavior: contain;
  scroll-padding-bottom: 120px;
}

.design-modal-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.design-modal-head h3 {
  font-size: 28px;
  margin: 2px 0;
}

.modal-close {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 16px;
  background: #f5effb;
  color: var(--purple-dark);
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}

.modal-close:hover {
  background: #ead9f7;
}

.design-modal-actions {
  display: grid;
  grid-template-columns: auto auto auto minmax(240px, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fbf9fd;
}

.design-modal-actions input {
  min-width: 220px;
}

#shop-design-modal-message {
  min-height: 0;
  margin: 0;
  padding: 0;
}

#shop-design-modal-message:not(:empty) {
  display: block;
  padding: 10px 12px;
  border: 1px solid #ead8f7;
  border-radius: 14px;
  background: #fff;
  font-weight: 800;
  line-height: 1.35;
  position: relative;
  z-index: 4;
}

#shop-design-modal-message.error:not(:empty) {
  border-color: #f0b6c0;
  background: #fff5f7;
  color: var(--red);
}

#shop-design-modal-message.success:not(:empty),
#shop-design-modal-message.ok:not(:empty) {
  border-color: #bfe9cc;
  background: #f4fff8;
  color: var(--green);
}

.template-upload-form,
.design-source-form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.template-upload-form + .template-upload-form {
  margin-top: 10px;
}

.template-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.template-upload-card {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: linear-gradient(135deg, #fff, #fbf7ff);
}

.template-upload-title {
  display: grid;
  gap: 4px;
}

.template-upload-title h4 {
  margin: 0;
  font-size: 18px;
}

.template-upload-form input,
.design-source-form input {
  flex: 1;
  min-width: 260px;
  padding: 12px;
  border: 1px dashed #d8b7f0;
  border-radius: 16px;
  background: #fbf7ff;
}

.template-list {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.shop-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(168px, 210px));
  gap: 18px;
  align-items: start;
  margin-top: 18px;
}

.shop-media-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(30, 12, 45, .06);
}

.shop-media-card > img,
.shop-media-card > video {
  display: block;
  width: 100%;
  height: 210px;
  object-fit: contain;
  background: linear-gradient(180deg, #f8f3fb, #fff);
  border-bottom: 1px solid #eadff2;
}

.shop-media-card > div {
  min-width: 0;
  padding: 10px;
}

.shop-media-card strong,
.shop-media-card small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shop-media-card small {
  margin-top: 3px;
  color: var(--muted);
}

.shop-media-card .draft-publish-controls {
  justify-content: flex-start;
  gap: 6px;
  margin-top: 8px;
}

.template-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(140px, 1fr));
  gap: 12px;
}

.template-filter-row {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(180px, 260px);
  gap: 12px;
  margin-top: 16px;
}

.template-filter-row input,
.template-filter-row select {
  width: 100%;
  padding: 13px 16px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: #fff;
  font: inherit;
}

.template-stat {
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(67, 18, 98, 0.05);
}

.template-stat span,
.template-stat strong {
  display: block;
}

.template-stat span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.template-stat strong {
  margin-top: 5px;
  font-size: 30px;
  line-height: 1;
}

.template-stat.ok strong,
.template-stat.full strong {
  color: var(--green);
}

.template-stat.warn {
  background: #fff8e8;
  border-color: #ffe4b7;
}

.template-stat.warn strong {
  color: #9a5b00;
}

.template-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(160px, 1fr) auto minmax(170px, auto) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: #fff;
}

.template-row small,
.template-row span {
  color: var(--muted);
}

.template-delete {
  justify-self: end;
  padding: 8px 12px;
}

.template-matrix {
  display: grid;
  gap: 10px;
}

.template-matrix-head,
.template-matrix-row {
  display: grid;
  grid-template-columns: minmax(145px, .55fr) minmax(250px, 1fr) minmax(180px, .62fr) minmax(260px, 1.05fr) minmax(260px, 1.05fr);
  gap: 10px;
  align-items: stretch;
}

.shop-mockup-matrix .template-matrix-head,
.shop-mockup-matrix .template-matrix-row {
  grid-template-columns: minmax(150px, .55fr) minmax(250px, 1fr) minmax(280px, 1.1fr);
}

.template-matrix-head {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 14px 16px;
  border-radius: 18px;
  background: #fbf7ff;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.template-matrix-row {
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 22px;
  background: #fff;
}

.template-matrix-row:nth-child(odd) {
  background: #fcf9ff;
}

.template-model-name {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: #fff;
  font-size: 18px;
  word-break: break-word;
}

.template-name-editor {
  display: grid;
  gap: 8px;
  align-content: center;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #e4d5f2;
  border-radius: 18px;
  background: #fff;
}

.template-name-editor.missing {
  border-color: #f0d59c;
  background: #fff9ed;
}

.template-name-editor.pending {
  border-color: #d9c1ef;
  background: #fbf7ff;
}

.template-camera-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-content: center;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fff;
}

.template-camera-editor select {
  min-width: 0;
  padding: 8px 9px;
}

.template-camera-editor small {
  grid-column: 1 / -1;
  color: var(--muted);
}

.template-camera-editor small.success { color: var(--green); }
.template-camera-editor small.error { color: var(--red); }
.template-camera-editor.missing,
.template-camera-editor.pending {
  grid-template-columns: 1fr;
  border-color: #f0d59c;
  background: #fff9ed;
}

.template-name-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.template-name-controls input {
  min-width: 0;
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
}

.template-name-controls button {
  white-space: nowrap;
  padding: 10px 12px;
}

.template-name-preview {
  display: block;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.template-name-preview.success {
  color: var(--green);
  font-weight: 800;
}

.template-name-preview.error {
  color: var(--red);
  font-weight: 800;
  white-space: normal;
}

.template-asset {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid #d9f0df;
  background: #f6fff8;
}

.template-asset strong {
  font-size: 16px;
}

.template-asset small {
  font-size: 13px;
}

.template-asset strong,
.template-asset small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.template-asset small {
  margin-top: 3px;
  color: var(--muted);
}

.template-asset .prepared-status {
  margin-top: 6px;
  font-weight: 800;
}

.template-asset .prepared-status.ok {
  color: #009b63;
}

.template-asset .prepared-status.warn {
  color: #b46a00;
}

.template-asset .prepared-status.danger {
  color: #f02f56;
}

.template-asset.missing {
  grid-template-columns: 1fr;
  border-color: #ffe4b7;
  background: #fff8e8;
  color: #9a5b00;
}

.template-asset.missing small {
  color: #9a5b00;
}

.template-asset.neutral {
  border-color: #e9ddf5;
  background: #fbf7ff;
}

.design-print-panel {
  display: grid;
  grid-template-columns: minmax(260px, 1.2fr) minmax(300px, 1fr) auto auto auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid #d9f0df;
  border-radius: 18px;
  background: linear-gradient(135deg, #fbfff9, #fff);
}

.design-print-panel[hidden] {
  display: none;
}

.design-print-panel strong,
.design-print-panel small {
  display: block;
}

.design-print-panel small {
  margin-top: 4px;
  color: var(--muted);
}

.design-source-preview {
  grid-column: 1 / -1;
}

.design-source-preview[hidden] {
  display: none;
}

.design-source-preview-card {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  max-width: 540px;
  padding: 10px;
  border: 1px solid #bfe9cc;
  border-radius: 18px;
  background: #f5fff8;
}

.design-source-preview-card img {
  display: block;
  width: 92px;
  height: 122px;
  object-fit: cover;
  border-radius: 14px;
  background: #f2eef8;
  box-shadow: 0 10px 22px rgba(31, 13, 50, .08);
}

.design-source-preview-card strong,
.design-source-preview-card small {
  display: block;
}

.design-source-preview-card strong {
  font-size: 18px;
}

.design-source-delete {
  margin-top: 10px;
  padding: 8px 12px;
  border-radius: 12px;
}

.design-source-preview-card.missing {
  grid-template-columns: 1fr;
  border-color: #ffd99a;
  background: #fff8e8;
  color: #8b5600;
}

.design-source-preview-card.missing small {
  color: #8b5600;
}

.design-print-progress {
  height: 9px;
  margin-top: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e4f3e7;
}

.design-print-progress[hidden] {
  display: none;
}

.design-print-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #00a86b, var(--purple));
  transition: width .35s ease;
}

.download-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.design-print-preview {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #d9f0df;
  border-radius: 18px;
  background: linear-gradient(135deg, #fbfff9, #fff);
}

.design-print-preview[hidden] {
  display: none;
}

.missing-template-panel {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #d9f0df;
  border-radius: 18px;
  background: linear-gradient(135deg, #f7fff9, #fff);
}

.missing-template-panel[hidden] {
  display: none;
}

.missing-template-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.missing-template-head strong,
.missing-template-head small {
  display: block;
}

.missing-template-head small {
  margin-top: 4px;
  color: var(--muted);
}

.missing-template-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.missing-template-list {
  display: grid;
  gap: 10px;
  max-height: 420px;
  overflow: auto;
  padding-right: 4px;
}

.missing-template-row {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(260px, .7fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #d8eeda;
  border-radius: 16px;
  background: #fff;
}

.missing-template-info strong,
.missing-template-info small {
  display: block;
}

.missing-template-info small {
  margin-top: 4px;
  color: var(--muted);
}

.missing-template-samples {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.missing-template-samples span {
  display: inline-grid;
  grid-template-columns: 34px minmax(54px, 92px);
  gap: 6px;
  align-items: center;
  min-width: 86px;
  max-width: 140px;
  padding: 5px;
  border-radius: 12px;
  background: #f7f1fc;
}

.missing-template-samples img {
  width: 34px;
  height: 34px;
  object-fit: cover;
  border-radius: 9px;
  background: #eee;
}

.missing-template-samples em {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.missing-template-row select {
  width: 100%;
}

.print-preview-header {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.print-preview-header strong,
.print-preview-header small {
  display: block;
}

.print-preview-header small {
  margin-top: 4px;
  color: var(--muted);
}

.print-preview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.print-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(135px, 1fr));
  gap: 12px;
  max-height: 520px;
  overflow: auto;
  padding: 2px 4px 4px 2px;
}

.print-preview-collapsed-note {
  margin: 12px 0 0;
  padding: 12px 14px;
  border: 1px dashed #d8bdf2;
  border-radius: 14px;
  background: #fbf7ff;
}

.print-upload-panel {
  display: grid;
  gap: 12px;
  margin: 12px 0;
  padding: 14px;
  border: 1px solid #d7f0df;
  border-radius: 18px;
  background: linear-gradient(135deg, #f7fff9, #fff);
}

.print-upload-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
}

.print-upload-head strong,
.print-upload-head small {
  display: block;
}

.print-upload-head small {
  color: #74687f;
  margin-top: 4px;
}

.print-upload-message {
  padding: 10px 12px;
  border: 1px solid #e6d8f2;
  border-radius: 12px;
  background: #fbf7ff;
  color: #5d4d68;
  font-weight: 700;
}

.print-upload-message.success {
  border-color: #ade7c3;
  background: #effff5;
  color: #008753;
}

.print-upload-message.error {
  border-color: #ffc3ce;
  background: #fff3f5;
  color: #dd2947;
}

.print-upload-settings {
  display: grid;
  grid-template-columns: minmax(160px, 1.2fr) 90px minmax(140px, 1fr) minmax(170px, 1fr) minmax(180px, 1.2fr) auto auto auto;
  gap: 8px;
  align-items: end;
}

.print-upload-settings label {
  display: grid;
  gap: 5px;
  color: #6f6278;
  font-size: 12px;
}

.print-upload-settings input {
  min-width: 0;
}

.print-upload-settings .checkbox-line {
  display: flex;
  gap: 6px;
  align-items: center;
  padding-bottom: 10px;
  color: #21152b;
}

.bulk-print-upload-status {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid #c5ebd4;
  border-radius: 18px;
  background: linear-gradient(135deg, #f4fff8, #fff);
}

.bulk-print-upload-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}

.bulk-print-upload-head strong,
.bulk-print-upload-head small {
  display: block;
}

.bulk-print-upload-head small {
  margin-top: 4px;
  color: var(--muted);
}

.bulk-print-upload-controls {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex: 0 0 auto;
}

.bulk-print-upload-ok {
  color: var(--green);
  font-size: 24px;
}

.bulk-print-upload-bad {
  color: var(--red);
  font-size: 24px;
}

.bulk-print-upload-bar {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #eadff1;
}

.bulk-print-upload-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #00a86b, var(--purple));
  transition: width .25s ease;
}

.bulk-print-upload-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 8px;
}

.bulk-print-upload-stats span {
  padding: 10px 12px;
  border: 1px solid #e4ddeb;
  border-radius: 14px;
  background: #fff;
  color: var(--muted);
}

.bulk-print-upload-stats b {
  color: var(--text);
}

.bulk-print-preflight-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.bulk-missing-template-list {
  max-height: 520px;
}

.bulk-missing-template-list .missing-template-row {
  grid-template-columns: minmax(320px, 1fr) minmax(260px, .65fr);
}

.bulk-print-problem-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.bulk-print-problem-list span {
  padding: 7px 10px;
  border: 1px solid #eadbf7;
  border-radius: 999px;
  background: #fff;
}

.bulk-unclear-products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 8px;
  max-height: 460px;
  overflow: auto;
  margin-top: 10px;
}

.bulk-unclear-product {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid #ffd6de;
  border-radius: 14px;
  background: #fff;
}

.bulk-unclear-product img {
  width: 42px;
  height: 42px;
  object-fit: cover;
  border-radius: 10px;
  background: #f1ebf6;
}

.bulk-unclear-product b,
.bulk-unclear-product small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bulk-unclear-product small {
  margin-top: 3px;
  color: var(--muted);
}

.bulk-unclear-product input {
  width: 100%;
  margin-top: 7px;
  padding: 7px 9px;
  border-radius: 10px;
  font-size: 12px;
}

.bulk-unclear-product-skip {
  color: var(--red) !important;
}

.bulk-print-upload-details {
  border: 1px solid #d8c4ed;
  border-radius: 14px;
  padding: 10px 12px;
  background: #fbf7ff;
}

.bulk-print-upload-details.error {
  border-color: #ffc3ce;
  background: #fff5f7;
}

.bulk-print-upload-details > div:not([class]) {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 10px;
  padding: 7px 0;
  border-top: 1px solid rgba(120, 80, 160, .12);
}

.bulk-print-upload-details summary {
  cursor: pointer;
  font-weight: 800;
}

.print-preview-card {
  position: relative;
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 1px solid #eadbf7;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(87, 55, 120, .06);
  cursor: pointer;
}

.print-preview-card input {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 20px;
  height: 20px;
  z-index: 2;
}

.print-preview-card img {
  width: 100%;
  height: 150px;
  object-fit: contain;
  border-radius: 12px;
  background: #f4f1f7;
}

.print-preview-card span,
.print-preview-card strong,
.print-preview-card small,
.print-preview-card em {
  display: block;
  min-width: 0;
}

.print-preview-card strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.print-preview-card small,
.print-preview-card em {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.print-skipped-details {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid #ffcdd8;
  border-radius: 14px;
  background: #fff5f7;
  color: #df2454;
}

.print-skipped-details summary {
  cursor: pointer;
  font-weight: 800;
}

.print-skipped-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  max-height: 220px;
  overflow: auto;
}

.print-skipped-list div {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(120px, 1fr) minmax(200px, 2fr);
  gap: 10px;
  padding: 8px;
  border-radius: 12px;
  background: #fff;
}

.print-skipped-list small,
.print-skipped-list em {
  color: var(--muted);
  font-style: normal;
}

.design-scale-panel {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #ddd3f5;
  border-radius: 18px;
  background: linear-gradient(135deg, #fbf7ff, #fff);
}

.design-scale-panel[hidden] {
  display: none;
}

.scale-panel-head {
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
}

.scale-panel-head strong,
.scale-panel-head small {
  display: block;
}

.scale-panel-head small {
  margin-top: 4px;
  color: var(--muted);
}

.scale-plan-body {
  margin-top: 12px;
}

.scale-plan-modal {
  width: min(1500px, 98vw);
  gap: 14px;
}

.scale-plan-modal-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
}

.scale-plan-modal .design-profile-form {
  margin-top: 0;
}

.scale-plan-modal .scale-plan-body {
  margin-top: 0;
  padding-bottom: 12px;
}

.scale-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.scale-stat-grid div {
  padding: 10px 12px;
  border: 1px solid #eadbf7;
  border-radius: 14px;
  background: #fff;
}

.scale-stat-grid strong,
.scale-stat-grid small {
  display: block;
}

.scale-stat-grid strong {
  font-size: 22px;
}

.scale-stat-grid small {
  color: var(--muted);
}

.scale-note {
  margin: 8px 0 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: #fff7e8;
  color: #8a5800;
  font-weight: 700;
}

.scale-prepare-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 14px 0 8px;
  padding: 14px;
  border: 1px solid #d8b9f4;
  border-radius: 16px;
  background: #fbf7ff;
}

.scale-model-scope {
  display: flex;
  align-items: end;
  gap: 14px;
  flex-wrap: wrap;
  padding: 14px 16px;
  margin-bottom: 14px;
  border: 1px solid #d9c1ef;
  border-radius: 16px;
  background: #fbf7ff;
}

.scale-model-scope label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.scale-model-scope select {
  min-width: 250px;
  padding: 9px 11px;
}

.scale-model-scope > small {
  color: var(--muted);
  padding-bottom: 9px;
}

.scale-prepare-actions span {
  color: #746b80;
  font-size: 14px;
}

.scale-live-progress {
  display: grid;
  gap: 8px;
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid #dfd2ea;
  border-radius: 14px;
  background: #fbf7ff;
}

.scale-live-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #392747;
}

.scale-live-progress-head span,
.scale-live-progress small {
  color: #746b80;
}

.scale-live-progress-bar {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e9ddf2;
}

.scale-live-progress-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #8f36dc, #b55cf0);
  transition: width 0.25s ease;
}

.scale-prepared {
  margin: 12px 0 18px;
}

.scale-prepared-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.scale-prepared-head div,
.scale-prepared-card {
  display: grid;
  gap: 4px;
}

.scale-prepared-head small,
.scale-prepared-card small {
  color: #746b80;
}

.scale-prepared-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 14px;
}

.scale-prepared-card {
  padding: 12px;
  border: 1px solid #dfd2ea;
  border-radius: 18px;
  background: #fff;
}

.scale-prepared-images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.scale-prepared-images figure {
  display: grid;
  gap: 6px;
  margin: 0;
}

.scale-prepared-images img {
  width: 100%;
  height: 300px;
  object-fit: contain;
  border-radius: 12px;
  background: #f5f1f8;
}

.scale-prepared-images figcaption {
  color: #746b80;
  font-size: 12px;
  text-align: center;
}

.scale-table-wrap {
  max-height: 360px;
  overflow: auto;
  border: 1px solid #eadbf7;
  border-radius: 16px;
  background: #fff;
}

.scale-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.scale-table th,
.scale-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #f0e6fb;
  text-align: left;
  vertical-align: top;
}

.scale-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #fbf7ff;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.scale-table tbody tr:nth-child(even) {
  background: #fcf9ff;
}

.scale-status {
  display: inline-flex;
  padding: 4px 8px;
  border-radius: 999px;
  background: #dff8eb;
  color: #067647;
  font-size: 12px;
  font-weight: 900;
}

.scale-status.no_source,
.scale-status.no_design_name,
.scale-status.no_template,
.scale-status.no_mockup,
.scale-status.needs_new_group,
.scale-status.no_imt_group {
  background: #fff0cf;
  color: #9a5b00;
}

.scale-status.vendor_conflict {
  background: #ffe1e8;
  color: #d11f4b;
}

.scale-status.submitted {
  background: #e9ddff;
  color: #6b1cc9;
}

.scale-status.media_uploaded {
  background: #dff8eb;
  color: #067647;
}

.scale-status.stock_pending {
  background: #fff0cf;
  color: #9a5b00;
}

.scale-status.failed,
.scale-status.media_failed {
  background: #ffe1e8;
  color: #d11f4b;
}

.draft-publish-panel {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 18px 0;
  padding: 18px;
  border: 1px solid #eadcf8;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(142, 55, 226, 0.08), rgba(255, 255, 255, 0.96));
}

.draft-publish-panel h4 {
  margin: 4px 0 8px;
  font-size: 20px;
}

.draft-publish-controls {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  align-items: end;
}

.draft-publish-controls label {
  display: grid;
  gap: 5px;
  color: #756b82;
  font-size: 13px;
}

.draft-publish-controls select {
  min-width: 150px;
}

.draft-filters {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px) 120px auto;
  gap: 12px;
  align-items: center;
  margin: 18px 0 10px;
}

.draft-delete-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin: 8px 0 0;
  padding: 10px 12px;
  border: 1px solid #eadcf8;
  border-radius: 16px;
  background: #fcf9ff;
}

.draft-delete-toolbar label {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-weight: 700;
}

.draft-delete-toolbar label input,
.draft-select input {
  width: 18px;
  height: 18px;
}

.draft-delete-toolbar > span {
  margin-left: auto;
}

.card-drafts-summary {
  margin-top: 18px;
}

.compact-card {
  min-height: 120px;
}

.draft-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.draft-row {
  display: grid;
  grid-template-columns: 28px 76px minmax(0, 1fr) 120px;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid #eadcf8;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(31, 11, 55, 0.05);
}

.draft-select {
  display: grid;
  place-items: center;
  align-self: stretch;
  min-height: 32px;
}

.draft-select.locked {
  cursor: default;
}

.draft-row:nth-child(even) {
  background: #fcf8ff;
}

.draft-row.no_source,
.draft-row.no_design_name,
.draft-row.no_template,
.draft-row.no_mockup,
.draft-row.no_imt_group {
  border-color: #ffd98b;
  background: #fffaf0;
}

.draft-row.vendor_conflict {
  border-color: #ffbfd0;
  background: #fff5f8;
}

.draft-row.submitted {
  border-color: #d7bcff;
  background: #fbf7ff;
}

.draft-row.media_uploaded {
  border-color: #bdeed4;
  background: #f4fff8;
}

.draft-row.stock_pending {
  border-color: #ffd98b;
  background: #fffaf0;
}

.draft-row.failed,
.draft-row.media_failed {
  border-color: #ffbfd0;
  background: #fff5f8;
}

.draft-image {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  overflow: hidden;
  background: #f2ebf8;
  display: grid;
  place-items: center;
}

.draft-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.draft-image-placeholder {
  color: #8f43dc;
  font-weight: 900;
}

.draft-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.draft-title-line {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.draft-title-line strong {
  font-size: 18px;
}

.draft-meta {
  color: #756b82;
  font-size: 14px;
}

.draft-error {
  color: #d11f4b;
  font-weight: 800;
  font-size: 13px;
}

.draft-assets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.asset-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.asset-pill.ok {
  background: #dff8eb;
  color: #067647;
}

.asset-pill.bad {
  background: #ffe1e8;
  color: #d11f4b;
}

.draft-side {
  display: grid;
  gap: 6px;
  justify-items: end;
  color: #756b82;
  text-align: right;
}

.draft-side strong {
  color: #12091f;
  font-size: 12px;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .draft-publish-panel {
    grid-template-columns: 1fr;
  }

  .draft-publish-controls {
    justify-content: flex-start;
  }
}

@media (max-width: 900px) {
  .draft-filters {
    grid-template-columns: 1fr;
  }

  .draft-row {
    grid-template-columns: 28px 64px minmax(0, 1fr);
  }

  .draft-side {
    grid-column: 1 / -1;
    justify-items: start;
    text-align: left;
  }
}

.design-picker-dropdown {
  position: fixed;
  z-index: 2500;
  display: grid;
  gap: 6px;
  padding: 8px;
  overflow: auto;
  border: 1px solid #dec5f4;
  border-radius: 18px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 24px 70px rgba(35, 18, 55, .24);
}

.design-picker-dropdown[hidden] {
  display: none;
}

.design-picker-option {
  width: 100%;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.design-picker-option:hover,
.design-picker-option:focus {
  outline: none;
  background: #f5effb;
}

.design-picker-option img,
.design-picker-placeholder {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  object-fit: cover;
  background: #efe6f7;
}

.design-picker-placeholder {
  display: grid;
  place-items: center;
  color: var(--purple);
  font-weight: 900;
}

.design-picker-text {
  min-width: 0;
}

.design-picker-text strong,
.design-picker-text small {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.design-picker-text strong {
  color: var(--text);
  font-size: 16px;
}

.design-picker-text small {
  color: var(--muted);
  font-size: 12px;
}

.design-picker-option em {
  justify-self: end;
  color: var(--green);
  font-style: normal;
  font-weight: 800;
}

.design-picker-empty,
.design-picker-hint {
  padding: 10px 12px;
  color: var(--muted);
  font-size: 13px;
}

.design-picker-hint {
  border-top: 1px solid #efe3f8;
}

.design-modal-sort-helper {
  display: grid;
  grid-template-columns: minmax(260px, 1.25fr) repeat(auto-fit, minmax(150px, .55fr));
  gap: 12px;
  align-items: end;
  padding: 10px;
  border: 1px solid #ead8f7;
  border-radius: 18px;
  background: linear-gradient(135deg, #fff, #fbf6ff);
}

.design-modal-sort-helper[hidden] {
  display: none;
}

.design-modal-sort-helper strong,
.design-modal-sort-helper small {
  display: block;
}

.design-modal-sort-helper small {
  margin-top: 3px;
  color: var(--muted);
}

.design-modal-sort-helper input,
.design-modal-sort-helper select {
  width: 100%;
}

.design-modal-sort-helper button {
  white-space: nowrap;
}

.ai-folder-matches {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid #cdeedc;
  border-radius: 18px;
  background: linear-gradient(135deg, #f4fff8, #fff);
}

.ai-folder-matches[hidden] {
  display: none;
}

.ai-folder-matches-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ai-folder-matches-head strong,
.ai-folder-matches-head small {
  display: block;
}

.ai-folder-matches-head small,
.ai-folder-matches-loading {
  margin-top: 4px;
  color: var(--muted);
}

.ai-folder-match-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 10px;
}

.ai-folder-match {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 66px;
  padding: 8px;
  border: 1px solid #bdebd1;
  border-radius: 16px;
  background: #fff;
  color: inherit;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(21, 185, 129, .08);
}

.ai-folder-match:hover {
  border-color: #15b981;
  transform: translateY(-1px);
}

.ai-folder-match img,
.ai-folder-match .category-placeholder {
  width: 54px;
  height: 54px;
  border-radius: 12px;
  object-fit: cover;
  background: #f7f2fb;
}

.ai-folder-match strong,
.ai-folder-match small {
  display: block;
}

.ai-folder-match small {
  color: var(--muted);
  font-size: 12px;
}

.ai-folder-match em {
  justify-self: end;
  padding: 4px 8px;
  border-radius: 999px;
  background: #dff8ea;
  color: #047857;
  font-style: normal;
  font-weight: 900;
}

.design-modal-products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(122px, 1fr));
  align-content: start;
  gap: 12px;
  overflow: visible;
  min-height: 0;
  padding: 2px 6px 10px 0;
}

.design-product-tile {
  position: relative;
  display: grid;
  grid-template-rows: 170px auto;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(35, 18, 55, .06);
}

.design-product-tile.selected {
  border-color: var(--purple);
  background: #fbf4ff;
  box-shadow: 0 12px 30px rgba(145, 55, 220, .18);
}

.design-product-tile.similarity-anchor {
  border-color: #15b981;
  box-shadow: 0 0 0 3px rgba(21, 185, 129, .18), 0 12px 30px rgba(21, 185, 129, .18);
}

.design-product-tile.similarity-anchor::after {
  content: "образец";
  position: absolute;
  left: 8px;
  top: 8px;
  z-index: 3;
  padding: 3px 8px;
  border-radius: 999px;
  background: #15b981;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}

.design-product-tile-check {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 9px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 4px 14px rgba(20, 8, 35, .16);
}

.design-product-tile-check input {
  width: 18px;
  height: 18px;
}

.design-product-tile-badge {
  position: absolute;
  left: 8px;
  top: 8px;
  z-index: 2;
  max-width: calc(100% - 46px);
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(145, 55, 220, .92);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 5px 16px rgba(78, 24, 122, .2);
}

.design-product-tile-ai-badge {
  position: absolute;
  left: 8px;
  top: 36px;
  z-index: 2;
  max-width: calc(100% - 46px);
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(21, 185, 129, .94);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 5px 16px rgba(21, 185, 129, .2);
}

.design-product-tile-image {
  display: block;
  width: 100%;
  min-height: 170px;
  height: 170px;
  padding: 8px;
  background: linear-gradient(180deg, #f8f4fb, #fff);
  cursor: pointer;
}

.design-product-tile-image img,
.design-product-tile-image .product-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 12px;
}

.design-product-tile-body {
  display: grid;
  gap: 3px;
  padding: 9px;
  min-width: 0;
}

.design-product-tile-body strong,
.design-product-tile-body small {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.design-product-tile-body strong {
  font-size: 13px;
}

.design-product-tile-body small {
  color: var(--muted);
  font-size: 11px;
}

.design-product-tile-body button {
  margin-top: 4px;
  padding: 6px 8px;
  border-radius: 10px;
  font-size: 12px;
}

.design-modal-foot {
  display: flex;
  justify-content: center;
}

@media (max-width: 900px) {
  .modal-backdrop {
    padding: 10px;
  }

  .design-modal {
    width: 100%;
    max-height: 96vh;
    padding: 14px;
    border-radius: 22px;
  }

  .design-modal-actions {
    grid-template-columns: 1fr;
  }

  .design-print-panel,
  .template-row,
  .template-matrix-head,
  .template-matrix-row {
    grid-template-columns: 1fr;
  }

  .template-upload-grid {
    grid-template-columns: 1fr;
  }

  .template-stats {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }

  .template-filter-row {
    grid-template-columns: 1fr;
  }

  .template-matrix-head {
    display: none;
  }

  .template-model-name {
    background: #fbf7ff;
  }

  .print-preview-header {
    align-items: stretch;
    flex-direction: column;
  }

  .print-preview-actions {
    justify-content: stretch;
  }

  .print-preview-actions button {
    flex: 1;
  }

  .scale-panel-head {
    align-items: stretch;
    flex-direction: column;
  }

  .scale-stat-grid {
    grid-template-columns: repeat(2, minmax(120px, 1fr));
  }

  .design-modal-sort-helper {
    grid-template-columns: 1fr;
  }

  .design-modal-products {
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  }

  .design-product-tile {
    grid-template-rows: 150px auto;
  }

  .design-product-tile-image {
    min-height: 150px;
    height: 150px;
  }
}

.category-card {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fbf9fd;
  padding: 12px;
  text-align: left;
  cursor: pointer;
}

.category-card:hover {
  border-color: #c69be9;
  box-shadow: 0 10px 28px rgba(145, 55, 220, .12);
}

.category-card img,
.category-placeholder,
.product-row img,
.product-placeholder {
  width: 58px;
  height: 58px;
  border-radius: 14px;
  object-fit: cover;
  background: #efe6f7;
}

.category-placeholder,
.product-placeholder {
  display: grid;
  place-items: center;
  color: var(--muted);
  font-size: 12px;
}

.category-card strong {
  display: block;
  font-size: 18px;
}

.category-card small {
  color: var(--muted);
}

.product-list {
  display: grid;
  gap: 10px;
}

.product-row {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 10px;
  background: #fff;
}

#shop-advice-view .product-row,
#shop-advice-view .design-row {
  grid-template-columns: 46px 1fr;
  padding: 8px;
  border-radius: 14px;
}

#shop-advice-view .product-row img,
#shop-advice-view .design-row img,
#shop-advice-view .product-placeholder {
  width: 46px;
  height: 46px;
  border-radius: 12px;
}

#shop-advice-view .shop-meta,
#shop-advice-view .product-row small {
  font-size: 12px;
}

.more-note {
  color: var(--muted);
  font-size: 12px;
  margin: 8px 0 0;
}

.product-row:nth-child(odd) {
  background: #fbf9fd;
}

.product-row small {
  color: var(--muted);
}

@media (max-width: 900px) {
  .shell { grid-template-columns: 1fr; }
  .sidebar { position: static; }
  .cards, .grid, .grid.three, .today-grid { grid-template-columns: 1fr; }
  .design-settings-panel,
  .design-settings-grid,
  .design-source-upload-panel,
  .design-profile-import-form,
  .design-toolbar {
    grid-template-columns: 1fr;
  }
}

#shop-design-modal-products.design-modal-products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  align-items: start !important;
  align-content: start !important;
  gap: 18px !important;
  padding: 8px 10px 32px 0 !important;
}

#shop-design-modal-products .design-product-tile {
  display: grid !important;
  grid-template-rows: 198px minmax(68px, auto) !important;
  min-height: 266px !important;
  height: auto !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

#shop-design-modal-products .design-product-tile-image {
  display: block !important;
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 198px !important;
  min-height: 198px !important;
  max-height: none !important;
  overflow: hidden !important;
  border-bottom: 1px solid #eadff2 !important;
}

#shop-design-modal-products .design-product-tile-image img,
#shop-design-modal-products .design-product-tile-image .product-placeholder {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

#shop-design-modal-products .design-product-tile-body {
  position: relative !important;
  z-index: 2 !important;
  min-height: 72px !important;
  background: linear-gradient(180deg, #fff, #fbf8fd) !important;
}

#shop-designs-list.shop-design-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
  gap: 20px !important;
  align-items: start !important;
}

#shop-designs-list .shop-design-card {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 240px auto !important;
  min-height: 350px !important;
  height: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  text-align: center !important;
  border-radius: 24px !important;
}

#shop-designs-list .shop-design-card > img,
#shop-designs-list .shop-design-card > .category-placeholder {
  display: block !important;
  width: 100% !important;
  height: 240px !important;
  min-height: 240px !important;
  padding: 12px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  border-bottom: 1px solid #eadff2 !important;
  background: linear-gradient(180deg, #f8f3fb, #fff) !important;
}

#shop-designs-list .shop-design-card > span:not(.category-placeholder) {
  display: grid !important;
  gap: 4px !important;
  align-content: start !important;
  padding: 12px 14px 14px !important;
  min-width: 0 !important;
}

#shop-designs-list .shop-design-card strong {
  font-size: 22px !important;
}

#shop-designs-list .shop-design-card em {
  font-size: 14px !important;
  font-weight: 900 !important;
}

.stock-upload-form {
  display: grid;
  grid-template-columns: minmax(260px, 360px) 1fr auto;
  gap: 14px;
  align-items: end;
  margin-top: 18px;
}

.stock-file-input input {
  min-height: 52px;
}

.stock-upload-file-map {
  margin-top: 16px;
}

.stock-file-map-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  color: var(--muted);
  margin-bottom: 10px;
}

.stock-file-map-head strong {
  color: var(--text);
}

.stock-file-map-list {
  display: grid;
  gap: 10px;
}

.stock-file-map-row {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 420px);
  gap: 12px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: #fbf9fd;
  padding: 12px;
}

.stock-file-map-row strong,
.stock-file-map-row small {
  display: block;
}

.stock-file-map-row small {
  color: var(--muted);
  margin-top: 3px;
}

.stock-upload-summary.cards {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#new-orders-summary.stock-upload-summary.cards {
  grid-template-columns: repeat(auto-fill, minmax(170px, 200px));
  gap: 10px;
  align-items: stretch;
  margin-bottom: 14px;
}

#new-orders-summary .card {
  padding: 14px 16px;
  border-radius: 16px;
  min-height: 82px;
}

#new-orders-summary .card span {
  font-size: 13px;
}

#new-orders-summary .card strong {
  font-size: 30px;
  line-height: 1;
  margin: 6px 0;
}

#new-orders-summary .card small {
  display: block;
  font-size: 12px;
  line-height: 1.25;
}

#new-orders-summary .new-orders-filtered-toggle {
  width: 100%;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

#new-orders-summary .new-orders-filtered-toggle:hover {
  border-color: #f0445c;
  transform: translateY(-1px);
}

.new-orders-filtered-details {
  grid-column: 1 / -1;
  padding: 14px;
  border: 1px solid #ffc3cc;
  border-radius: 18px;
  background: #fff7f8;
}

.new-orders-filtered-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.new-orders-filtered-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
}

.new-orders-filtered-list article {
  display: flex;
  gap: 10px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #f4d7dc;
  border-radius: 14px;
  background: #fff;
}

.new-orders-filtered-list img {
  width: 54px;
  height: 72px;
  flex: 0 0 auto;
  object-fit: cover;
  border-radius: 9px;
  background: #f4f0f7;
}

.new-orders-filtered-list article div {
  display: grid;
  align-content: start;
  gap: 3px;
  min-width: 0;
}

.new-orders-filtered-list strong,
.new-orders-filtered-list span,
.new-orders-filtered-list small {
  overflow-wrap: anywhere;
}

.new-orders-filtered-list span,
.new-orders-filtered-list small {
  color: var(--muted);
}

.stock-upload-table {
  margin-top: 16px;
}

.stock-copy-controls {
  margin-top: 16px;
  padding: 14px;
  border: 1px solid #eadcf5;
  border-radius: 18px;
  background: #fbf7ff;
  display: grid;
  grid-template-columns: 1fr minmax(240px, 360px) auto;
  gap: 12px;
  align-items: center;
}

.stock-copy-controls strong,
.stock-copy-controls small {
  display: block;
}

.stock-copy-controls small {
  margin-top: 4px;
  color: var(--muted);
}

.stock-bulk-progress {
  margin-top: 14px;
}

.stock-bulk-progress:empty {
  display: none;
}

.stock-bulk-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 1px solid #d8c4ed;
  border-radius: 18px 18px 0 0;
  background: linear-gradient(135deg, #fbf7ff, #fff);
}

.stock-bulk-head strong,
.stock-bulk-head small {
  display: block;
}

.stock-bulk-head small {
  margin-top: 4px;
  color: var(--muted);
}

.stock-bulk-bar {
  height: 12px;
  overflow: hidden;
  background: #f0e4fa;
  border-left: 1px solid #d8c4ed;
  border-right: 1px solid #d8c4ed;
}

.stock-bulk-bar span {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--purple), #f04adf);
  transition: width .35s ease;
}

.stock-bulk-items {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid #d8c4ed;
  border-top: 0;
  border-radius: 0 0 18px 18px;
  background: #fff;
}

.stock-bulk-item {
  display: inline-flex;
  border-radius: 999px;
  padding: 7px 10px;
  background: #f7f1fc;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.stock-bulk-item.running {
  background: #efe0ff;
  color: var(--purple-dark);
}

.stock-bulk-item.completed,
.stock-bulk-item.sent {
  background: #e9f8f1;
  color: #008456;
}

.stock-bulk-item.failed,
.stock-bulk-item.partially_sent {
  background: #ffecef;
  color: var(--red);
}

.danger-text {
  color: var(--red) !important;
}

.stock-table-wrap {
  max-height: 62vh;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fff;
}

.stock-table {
  width: 100%;
  min-width: 1180px;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 14px;
}

.stock-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f6effc;
  color: var(--muted);
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--border);
}

.stock-table td {
  padding: 12px;
  border-bottom: 1px solid #efe8f4;
  vertical-align: top;
}

.stock-table tr:nth-child(even) td {
  background: #fcf9ff;
}

.stock-table td small {
  display: block;
  color: var(--muted);
  margin-top: 4px;
}

.stock-table .num {
  font-weight: 900;
  font-size: 18px;
}

.stock-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 10px;
  font-weight: 900;
  font-size: 12px;
}

.stock-status.ready {
  background: #e9f8f1;
  color: #008456;
}

.stock-status.sent {
  background: #e8f1ff;
  color: #2164c7;
}

.stock-status.error,
.stock-status.failed {
  background: #ffecef;
  color: var(--red);
}

.stock-status.duplicate {
  background: #fff4d6;
  color: #9b6500;
}

.stock-row-error td,
.stock-row-failed td {
  background: #fff7f8 !important;
}

.stock-row-duplicate td {
  background: #fffaf0 !important;
}

.stock-history-row {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: 14px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fff;
  padding: 14px;
  margin-bottom: 10px;
  text-align: left;
  cursor: pointer;
}

.stock-history-row.active,
.stock-history-row:hover {
  border-color: #c99eed;
  box-shadow: 0 10px 28px rgba(145, 55, 220, .12);
}

.stock-history-row strong,
.stock-history-row small {
  display: block;
}

.stock-history-row small {
  color: var(--muted);
  margin-top: 4px;
}

.new-orders-print-panel {
  border-color: #c9f3d9;
  background: linear-gradient(180deg, #fbfffd 0%, #fff 100%);
}

.new-order-category-card.printable {
  border-color: #bdebcf;
  background: #f3fff8;
}

.new-order-category-card.ignored {
  border-color: #f1dfb3;
  background: #fffaf0;
}

.new-order-print-empty,
.new-order-print-progress,
.new-order-missing-block,
.new-order-skip-block {
  border: 1px solid #eadbf7;
  border-radius: 18px;
  background: #fff;
  padding: 14px;
}

.new-order-print-progress {
  display: grid;
  gap: 10px;
}

.new-order-print-progress-head,
.new-order-print-preview-head,
.new-order-missing-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}

.new-order-print-progress-head strong {
  font-size: 18px;
}

.new-order-print-progress-head span {
  color: var(--purple);
  font-weight: 1000;
  font-size: 24px;
}

.new-order-print-progress .progress {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #eee4f5;
}

.new-order-print-progress .progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0bb978, #9b31df);
  transition: width .25s ease;
}

.new-order-print-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 8px;
}

.new-order-print-stats span {
  border: 1px solid #eadbf7;
  border-radius: 14px;
  padding: 10px;
  color: var(--muted);
}

.new-order-print-stats strong {
  display: block;
  color: var(--text);
  font-size: 18px;
}

.new-order-missing-block,
.new-order-skip-block {
  margin-top: 12px;
}

.new-order-error-block {
  border-color: #f2aeb9;
  background: #fff5f7;
}

.new-order-error-block summary {
  color: #d92d4b;
}

.new-order-missing-block summary,
.new-order-skip-block summary {
  cursor: pointer;
  font-weight: 900;
}

.new-order-missing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.new-order-missing-card {
  display: grid;
  gap: 10px;
  border: 1px solid #bfeecd;
  border-radius: 18px;
  background: #f6fff9;
  padding: 12px;
}

.new-order-missing-card.loading {
  border-color: #d8b7f0;
  background: #fbf7ff;
}

.new-order-missing-card.error {
  border-color: #f0b6c0;
  background: #fff5f7;
}

.new-order-missing-ready {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  color: var(--green);
}

.new-order-missing-ready strong,
.new-order-missing-ready small {
  display: block;
}

.new-order-missing-title img,
.new-order-missing-title .design-fallback {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  object-fit: cover;
  background: #f2e9fa;
}

.missing-source-reference {
  display: block;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  border-radius: 14px;
  background: transparent;
  cursor: zoom-in;
}

.missing-source-reference:hover img {
  transform: scale(1.05);
  box-shadow: 0 8px 18px rgba(52, 24, 78, .18);
}

.missing-source-reference img {
  display: block;
  transition: transform .15s ease, box-shadow .15s ease;
}

.missing-source-lightbox {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  padding: 32px;
  background: rgba(8, 6, 15, .88);
  cursor: zoom-out;
}

.missing-source-lightbox[hidden] {
  display: none;
}

.missing-source-lightbox img {
  width: min(88vw, 1200px);
  max-width: 88vw;
  max-height: 90vh;
  object-fit: contain;
  border-radius: 16px;
  box-shadow: 0 20px 80px rgba(0, 0, 0, .5);
}

.missing-source-lightbox-close {
  position: absolute;
  top: 18px;
  right: 22px;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 50%;
  color: #fff;
  background: rgba(255, 255, 255, .12);
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}

.new-order-missing-title .design-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--purple);
  font-weight: 1000;
}

.new-order-missing-title strong,
.new-order-missing-title small {
  display: block;
}

.new-order-missing-title small {
  color: var(--muted);
}

.new-order-missing-products {
  display: flex;
  gap: 6px;
  overflow-x: auto;
}

.new-order-missing-products img {
  width: 44px;
  height: 58px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #dcebdc;
}

.new-order-source-upload {
  display: grid;
  gap: 6px;
  color: var(--purple);
  font-weight: 900;
}

.new-order-source-upload input {
  border: 1px dashed #c7a1ec;
  border-radius: 14px;
  padding: 10px;
  background: #fff;
  width: 100%;
  min-width: 0;
}

.new-order-source-status {
  display: block;
  min-height: 18px;
  color: var(--muted);
  font-weight: 800;
}

.new-order-missing-card.loading .new-order-source-status {
  color: var(--purple);
}

.new-order-missing-card.error .new-order-source-status {
  color: var(--red);
}

.new-order-missing-templates {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}

.new-order-missing-templates strong {
  width: 100%;
}

.new-order-missing-templates span {
  border-radius: 999px;
  background: #fff3d8;
  color: #9a6500;
  padding: 7px 10px;
  font-weight: 800;
}

.new-order-print-preview {
  margin-top: 12px;
}

.new-order-print-preview-head {
  margin-bottom: 12px;
}

.new-order-print-preview-head strong,
.new-order-print-preview-head small {
  display: block;
}

.new-order-print-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 12px;
}

.new-order-print-card {
  position: relative;
  display: grid;
  gap: 8px;
  border: 1px solid #eadbf7;
  border-radius: 18px;
  background: #fff;
  padding: 10px;
  box-shadow: 0 10px 22px rgba(87, 55, 120, .06);
  cursor: pointer;
}

.new-order-print-card > input {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 22px;
  height: 22px;
  z-index: 2;
}

.new-order-print-images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.new-order-print-images figure {
  margin: 0;
  display: grid;
  gap: 5px;
}

.new-order-print-images img,
.new-order-print-images span {
  width: 100%;
  height: 190px;
  border-radius: 14px;
  background: #f4f1f7;
  object-fit: contain;
}

.new-order-print-images span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  text-align: center;
}

.new-order-print-images figcaption {
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}

.new-order-print-card strong,
.new-order-print-card small,
.new-order-print-card em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.new-order-print-card small,
.new-order-print-card em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

#admin-new-orders-summary.stock-upload-summary.cards {
  grid-template-columns: repeat(auto-fill, minmax(190px, 220px));
  gap: 10px;
  margin-bottom: 14px;
}

#admin-new-orders-summary .card {
  padding: 14px 16px;
  min-height: 88px;
}

#admin-new-orders-summary .card.printable {
  border-color: #bdebcf;
  background: #f3fff8;
}

#admin-new-orders-summary .card.ignored {
  border-color: #f1dfb3;
  background: #fffaf0;
}

.admin-new-orders-list,
.admin-new-orders-job-shops {
  display: grid;
  gap: 12px;
}

.admin-new-orders-list {
  gap: 22px;
}

.admin-new-orders-group {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid #e5dbea;
  border-radius: 20px;
  background: #faf8fc;
}

.admin-new-orders-group.main {
  border-color: #d8c1f2;
  background: linear-gradient(180deg, #fbf7ff 0%, #fff 100%);
}

.admin-new-orders-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.admin-new-orders-group-head h4 {
  margin: 0 0 3px;
  font-size: 18px;
}

.admin-new-orders-group-head small {
  color: var(--muted);
}

.admin-new-orders-group-head > span {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 7px 11px;
  background: #eee7f4;
  color: var(--purple-dark);
  font-size: 12px;
  font-weight: 800;
}

.admin-new-orders-group.main .admin-new-orders-group-head > span {
  background: var(--purple);
  color: #fff;
}

.admin-new-orders-group-list {
  display: grid;
  gap: 12px;
}

.admin-new-orders-group-empty {
  margin: 0;
  padding: 10px 2px;
}

.admin-new-orders-shop,
.admin-new-orders-job-shop {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: stretch;
  border: 1px solid #eadbf7;
  border-radius: 18px;
  background: #fff;
  padding: 14px;
}

.admin-new-orders-shop.failed,
.admin-new-orders-job-shop.failed {
  border-color: #f2bac5;
  background: #fff7f8;
}

.admin-new-orders-shop.collapsed {
  padding-bottom: 12px;
  background: linear-gradient(180deg, #fff 0%, #fbf7ff 100%);
}

.admin-new-orders-shop strong,
.admin-new-orders-shop small,
.admin-new-orders-job-shop strong,
.admin-new-orders-job-shop small {
  display: block;
}

.admin-new-orders-shop small,
.admin-new-orders-job-shop small {
  color: var(--muted);
  margin-top: 4px;
}

.admin-new-orders-shop-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.admin-new-orders-shop-head > div:first-child strong {
  font-size: 18px;
}

.admin-new-orders-shop-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.admin-new-orders-shop-actions .admin-new-orders-ready,
.admin-new-orders-shop-actions .admin-new-orders-ready:disabled {
  background: var(--green);
  color: #fff;
  opacity: 1;
  cursor: default;
}

.admin-new-orders-shop-metrics,
.admin-new-orders-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-new-orders-shop-metrics span,
.admin-new-orders-categories span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: 999px;
  background: #f7f0fd;
  color: var(--muted);
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 800;
}

.admin-new-orders-categories span.good {
  background: #e9f8f1;
  color: #008456;
}

.admin-new-orders-shop-check {
  margin: 0;
  padding: 9px 12px;
  border-radius: 12px;
}

.admin-new-orders-shop-empty,
.admin-new-order-no-preview {
  margin: 0;
}

.admin-new-orders-shop-empty {
  color: #c62828;
  font-weight: 700;
}

.admin-new-order-shop-print {
  display: grid;
  gap: 12px;
}

.admin-shop-missing-block {
  background: #fafffc;
  border-color: #c9f3d9;
}

.admin-shop-missing-grid {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

.admin-new-order-print-preview {
  border: 1px solid #eadbf7;
  border-radius: 18px;
  background: #fff;
  padding: 14px;
}

.admin-new-orders-action {
  border-color: #c9f3d9;
  background: linear-gradient(180deg, #fbfffd 0%, #fff 100%);
}

.admin-all-progress {
  margin-bottom: 14px;
}

.admin-new-orders-job-shop {
  grid-template-columns: 1fr;
}

.admin-new-orders-job-shop-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.admin-new-orders-job-shop-head span {
  border-radius: 999px;
  background: #f0e2fb;
  color: var(--purple-dark);
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 900;
}

.admin-new-orders-job-shop .progress {
  height: 9px;
  border-radius: 999px;
  background: #eee4f5;
  overflow: hidden;
}

.admin-new-orders-job-shop .progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0bb978, #9b31df);
  transition: width .25s ease;
}

.model-alias-toolbar {
  grid-template-columns: minmax(260px, 1fr) minmax(180px, 240px) auto;
}

.model-alias-list {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.model-alias-row {
  display: grid;
  grid-template-columns: 86px minmax(260px, 1.3fr) minmax(280px, 0.9fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: #fff;
}

.model-alias-row.warn {
  background: #fffaf0;
  border-color: #f5d792;
}

.model-alias-row.bad {
  background: #fff7f7;
  border-color: #f5bbc4;
}

.model-alias-row.ok {
  background: #f7fffb;
  border-color: #bee9cf;
}

.model-alias-image {
  width: 74px;
  height: 96px;
  border-radius: 14px;
  background: #f4eef8;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 1px solid #eadbf7;
}

.model-alias-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.model-alias-placeholder {
  color: var(--muted);
  font-weight: 900;
}

.model-alias-info {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.model-alias-title {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.model-alias-title strong {
  font-size: 18px;
}

.model-alias-control label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-weight: 800;
}

.model-alias-control input {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 0 14px;
  font-weight: 900;
  color: var(--ink);
  background: #fff;
}

.model-alias-control small {
  display: block;
  margin-top: 6px;
}

.model-alias-actions {
  justify-self: end;
  display: grid;
  gap: 6px;
}

@media (max-width: 1100px) {
  .stock-upload-form,
  .stock-upload-summary.cards,
  .stock-file-map-row,
  .stock-copy-controls,
  .stock-history-row,
  .new-order-print-stats,
  .new-order-print-preview-head,
  .admin-new-orders-shop,
  .admin-new-orders-shop-head,
  .model-alias-toolbar,
  .model-alias-row {
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .admin-new-orders-shop-actions {
    justify-content: flex-start;
  }

  .model-alias-actions {
    justify-self: stretch;
  }

  .model-alias-actions .primary {
    width: 100%;
  }
}
input[type="file"] {
  max-width: 100%;
  min-height: 42px;
  padding: 7px 10px;
  border: 1px solid #decaf4;
  border-radius: 12px;
  background: #fcf9ff;
  color: #756486;
  font: inherit;
  cursor: pointer;
}

input[type="file"]::file-selector-button {
  margin-right: 10px;
  padding: 8px 14px;
  border: 0;
  border-radius: 9px;
  background: #9333df;
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}

input[type="file"]::file-selector-button:hover {
  background: #7e22ce;
  transform: translateY(-1px);
}
.trend-radar-summary {
  margin: 18px 0;
}

.trend-radar-date {
  font-size: 18px !important;
}

.trend-source-list,
.trend-topic-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.trend-radar-toolbar {
  margin: 18px 0 6px;
}

.trend-safe-filter {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
}

.trend-radar-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.trend-topic-card {
  overflow: hidden;
  display: grid;
  grid-template-columns: 112px 1fr;
  min-height: 190px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--panel);
}

.trend-topic-card.not-recommended {
  opacity: 0.68;
}

.trend-topic-card > img,
.trend-topic-placeholder {
  width: 112px;
  height: 100%;
  min-height: 190px;
  object-fit: cover;
  background: linear-gradient(145deg, #ede9fe, #f5f3ff);
}

.trend-topic-placeholder {
  display: grid;
  place-items: center;
  color: #7c3aed;
  font-size: 42px;
  font-weight: 800;
}

.trend-topic-body {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 14px;
}

.trend-topic-body p,
.trend-topic-body h4 {
  margin: 0;
}

.trend-topic-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.trend-score {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  height: 42px;
  border-radius: 12px;
  background: #6d28d9;
  color: white;
  font-size: 18px;
  font-weight: 800;
}

.trend-warning {
  color: var(--muted);
}

@media (max-width: 620px) {
  .trend-topic-card {
    grid-template-columns: 82px 1fr;
  }
  .trend-topic-card > img,
  .trend-topic-placeholder {
    width: 82px;
  }
}