.knit-erl { display: flex; flex-direction: column; gap: 12px; min-width: 0; max-width: 100%; }
.knit-erl-head h3 { margin: 0; font-size: 1.05rem; }
.knit-erl-tabs, .knit-erl-filters, .knit-erl-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.knit-erl-tabs button, .knit-erl-filters button, .knit-erl-form button, .knit-erl-detail button {
  border: 1px solid var(--knit-line, #d7dbe3);
  background: transparent;
  border-radius: 999px;
  padding: 6px 12px;
  cursor: pointer;
}
.knit-erl-tabs button.is-active, .knit-erl-filters button.is-active { background: var(--knit-text, #1c1f26); color: var(--knit-page-bg, #fff); }
.knit-erl-tools input[type="search"] { flex: 1 1 16rem; min-width: min(100%, 16rem); }
.knit-erl-filters--quick { width: 100%; }
.knit-erl-chips { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
.knit-erl-chips button { border: 0; border-radius: 999px; background: var(--knit-chip-bg, #e8eaee); color: inherit; padding: 0.2rem 0.55rem; font: inherit; cursor: pointer; }
.knit-erl-dims { display: flex; flex-wrap: wrap; gap: 6px; }
.knit-erl-dims button { border: 0; background: transparent; color: #6d7582; font: inherit; cursor: pointer; padding: 0.2rem 0.15rem; }
.knit-erl-dims button.is-active { color: var(--knit-text, #1c1f26); font-weight: 650; }
.knit-erl-adv__domain { margin-top: 0.35rem; font-size: 0.78rem; color: #6d7582; }
.knit-erl-tools input, .knit-erl-form input, .knit-erl-form select {
  border: 1px solid var(--knit-line, #d7dbe3);
  border-radius: 8px;
  padding: 8px 10px;
  background: transparent;
  color: inherit;
  max-width: 100%;
  min-width: 0;
}
.knit-erl-grid { display: grid; gap: 12px; }
.knit-erl-grid--samples { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.knit-erl-grid--patterns { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.knit-erl-card {
  display: flex; flex-direction: column; gap: 4px; text-align: left;
  border: 0; padding: 0; background: transparent; color: inherit; cursor: pointer;
  min-width: 0; max-width: 100%;
}
.knit-erl-card img, .knit-erl-ph {
  width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 10px; background: #eceff4;
}
.knit-erl-grid--patterns .knit-erl-card img, .knit-erl-grid--patterns .knit-erl-ph { aspect-ratio: 1 / 1; }
.knit-erl-ph { display: grid; place-items: center; color: #7b8494; }
.knit-erl-card strong { font-size: 0.92rem; overflow-wrap: anywhere; }
.knit-erl-card em, .knit-erl-card span { font-style: normal; color: #6d7582; font-size: 0.78rem; overflow-wrap: anywhere; }
.knit-erl-card button, .knit-erl-card label { max-width: 100%; white-space: normal; }
.knit-erl-card input[type="file"] { max-width: 100%; font-size: 0.72rem; }
.knit-erl-hero { width: min(100%, 420px); max-width: 100%; height: auto; max-height: 70vh; object-fit: contain; border-radius: 12px; }
.knit-erl-photos { display: flex; gap: 8px; overflow-x: auto; max-width: 100%; }
.knit-erl-photos img { height: 96px; width: auto; max-width: 140px; object-fit: cover; flex: 0 0 auto; border-radius: 8px; }
.knit-erl-empty { color: #6d7582; margin: 0; }
.knit-erl-adv { display: flex; flex-direction: column; gap: 10px; width: 100%; }
.knit-erl-adv[hidden] { display: none; }
.knit-erl-adv__group { display: flex; flex-direction: column; gap: 6px; }
.knit-erl-adv__group > span { font-size: 0.75rem; color: #6d7582; }
.knit-erl-upload {
  border: 0;
  border-radius: 999px;
  background: var(--knit-text, #1c1f26);
  color: var(--knit-page-bg, #fff);
  padding: 8px 14px;
  cursor: pointer;
  flex: 0 0 auto;
}
.knit-erl-manage-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.knit-erl-manage-head h3 { margin: 0; font-size: 1.2rem; }
.knit-erl-manage-head p { margin: 0.3rem 0 0; color: #6d7582; font-size: 0.82rem; }
.knit-erl-manage-tools { display: flex; flex-direction: column; gap: 8px; }
.knit-erl-collections {
  border: 1px solid var(--knit-line, #d7dbe3);
  border-radius: 12px;
  padding: 0.7rem 0.85rem;
}
.knit-erl-collections summary { cursor: pointer; font-weight: 650; }
.knit-erl-collections .knit-erl-form,
.knit-erl-collections .knit-erl-empty { margin-top: 8px; }
.knit-erl-file { position: relative; overflow: hidden; }
.knit-erl-file input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  max-width: none;
  font-size: 0;
}
.knit-erl-manage-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--knit-line, #d7dbe3);
  border-radius: 12px;
  padding: 8px;
}
.knit-erl-manage-open {
  display: flex;
  flex-direction: column;
  gap: 4px;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.knit-erl-manage-open img,
.knit-erl-manage-ph {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 8px;
  background: #eceff4;
}
.knit-erl-grid--patterns .knit-erl-manage-open img,
.knit-erl-grid--patterns .knit-erl-manage-ph { aspect-ratio: 1 / 1; }
.knit-erl-manage-ph { display: grid; place-items: center; color: #7b8494; }
.knit-erl-manage-open strong { font-size: 0.92rem; overflow-wrap: anywhere; }
.knit-erl-manage-open em,
.knit-erl-manage-open span { font-style: normal; color: #6d7582; font-size: 0.78rem; overflow-wrap: anywhere; }
.knit-erl-manage-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.knit-erl-manage-actions button,
.knit-erl-manage-actions label {
  border: 1px solid var(--knit-line, #d7dbe3);
  background: transparent;
  color: inherit;
  border-radius: 999px;
  padding: 4px 10px;
  font: inherit;
  font-size: 0.75rem;
  cursor: pointer;
}
.knit-erl-manage-actions .knit-erl-file input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  max-width: none;
  opacity: 0;
  cursor: pointer;
  font-size: 0;
}
.knit-erl--manage .knit-erl-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.knit-erl-form { display: flex; flex-wrap: wrap; gap: 8px; max-width: 100%; }
.knit-erl-detail { min-width: 0; max-width: 100%; }
@media (max-width: 720px) {
  .knit-erl-grid--samples, .knit-erl-grid--patterns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .knit-erl-form input, .knit-erl-form select, .knit-erl-tools input { flex: 1 1 100%; }
}
