.studio-thumb-divider {
  display: block !important;
  width: 44px;
  height: 1px;
  background: #94a3b8;
  box-shadow: 0 -5px 0 #e5ebf3, 0 5px 0 #e5ebf3;
}

.studio-thumb-key-value {
  display: grid !important;
  grid-template-columns: 17px 22px;
  gap: 5px 4px;
  align-content: center;
}

.studio-thumb-key-value i,
.studio-thumb-key-value b {
  display: block;
  height: 3px;
  border-radius: 999px;
  background: #94a3b8;
}

.studio-thumb-key-value b {
  background: #cbd5e1;
}

.studio-thumb-detail {
  display: grid !important;
  grid-template-columns: 16px 25px;
  gap: 5px 5px;
  align-content: center;
  width: 46px;
  height: 38px;
  padding: 4px 5px;
  border: 1px solid #cbd7e5;
  border-radius: 4px;
  background: #ffffff;
}

.studio-thumb-detail i,
.studio-thumb-detail b {
  display: block;
  height: 3px;
  border-radius: 999px;
  background: #94a3b8;
}

.studio-thumb-detail b {
  background: #cbd5e1;
}

.studio-thumb-list {
  display: grid !important;
  align-content: center;
  gap: 5px;
  width: 45px;
}

.studio-thumb-list i {
  position: relative;
  display: block;
  height: 7px;
  border-bottom: 1px solid #cbd5e1;
}

.studio-thumb-list i::before {
  position: absolute;
  top: 1px;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #3b82f6;
  content: "";
}

.studio-thumb-table {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
  gap: 2px;
  width: 45px;
  height: 28px;
  border: 1px solid #b9c9dc;
  border-radius: 3px;
  background: #ffffff;
}

.studio-thumb-table i {
  display: block;
  border-right: 1px solid #dbe4ef;
  border-bottom: 1px solid #dbe4ef;
  background: #f1f5f9;
}

.studio-thumb-table i:nth-child(n + 3) {
  background: #ffffff;
}

.studio-thumb-navigation {
  position: relative;
  display: flex !important;
  align-items: flex-end;
  justify-content: space-around;
  width: 48px;
  height: 27px;
  padding: 0 3px 4px;
  border-top: 1px solid #dbe4ef;
  background: #ffffff;
}

.studio-thumb-navigation i {
  width: 7px;
  height: 7px;
  border: 1px solid #8fa4bb;
  border-radius: 2px;
  background: #ffffff;
}

.studio-thumb-navigation i:first-child {
  border-color: #4b8df8;
  background: #e5efff;
}

.studio-thumb-pagination {
  display: flex !important;
  align-items: center;
  gap: 3px;
}

.studio-thumb-pagination i {
  display: block;
  width: 10px;
  height: 10px;
  border: 1px solid #b9c9dc;
  border-radius: 3px;
  background: #ffffff;
}

.studio-thumb-pagination i:nth-child(2) {
  border-color: #111827;
  background: #111827;
}

.studio-thumb-filter {
  display: flex !important;
  align-items: center;
  gap: 3px;
}

.studio-thumb-filter i {
  display: block;
  width: 13px;
  height: 17px;
  border: 1px solid #b9c9dc;
  border-radius: 3px;
  background: #ffffff;
}

.studio-thumb-filter b {
  display: block;
  width: 10px;
  height: 8px;
  border-radius: 999px;
  background: #111827;
}

.studio-thumb-feedback {
  padding: 6px;
  border: 1px solid #c9d8e8;
  border-radius: 5px;
  background: #ffffff;
}

.studio-thumb-feedback i,
.studio-thumb-feedback b,
.studio-thumb-feedback em {
  display: block;
  border-radius: 999px;
}

.studio-thumb-feedback i {
  width: 11px;
  height: 5px;
  margin-bottom: 5px;
  border-radius: 3px;
  background: #3b82f6;
}

.studio-thumb-feedback b {
  width: 31px;
  height: 3px;
  background: #64748b;
}

.studio-thumb-feedback em {
  width: 22px;
  height: 3px;
  margin-top: 4px;
  background: #cbd5e1;
}

.studio-thumb-feedback-error i,
.studio-thumb-feedback-error b {
  background: #d84c43;
}

.studio-thumb-feedback-loading i,
.studio-thumb-feedback-skeleton i,
.studio-thumb-feedback-skeleton b,
.studio-thumb-feedback-skeleton em {
  background: #dbe4ef;
}

.studio-thumb-feedback-empty i {
  width: 16px;
  height: 11px;
  border: 1px dashed #94a3b8;
  background: transparent;
}

.studio-thumb-progress {
  display: block !important;
  width: 45px;
  height: 7px;
  border: 1px solid #b9c9dc;
  border-radius: 999px;
  background: #edf2f7;
}

.studio-thumb-progress i {
  display: block;
  width: 62%;
  height: 100%;
  border-radius: inherit;
  background: #4b8df8;
}

.studio-thumb-component {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
  align-content: center;
  padding: 5px;
}

.studio-thumb-component i {
  display: block;
  height: 10px;
  border: 1px dashed #94a3b8;
  border-radius: 3px;
  background: #ffffff;
}

.studio-palette-copy {
  display: grid !important;
  min-width: 0;
  gap: 3px;
}

.studio-palette-copy strong,
.studio-palette-copy span {
  min-width: 0;
}

.studio-palette-copy span {
  margin: 0;
}