#series-app .zbd-series-zoom-select,
#series-app #zbd-series-labels-toggle {
  min-height: 36px;
}

#series-app #zbd-series-labels-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: 100%;
  padding: 0.42rem 0.64rem;
  border-radius: 0.72rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
  color: rgba(222, 231, 241, 0.92);
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
}

#series-app #zbd-series-labels-toggle:focus-visible {
  outline: none;
  border-color: rgba(88, 166, 255, 0.42);
  background: rgba(255, 255, 255, 0.05);
  color: #eef6ff;
  box-shadow: 0 0 0 0.16rem rgba(88, 166, 255, 0.18);
}

@media (hover: hover) and (pointer: fine) {
  #series-app #zbd-series-labels-toggle:hover {
    border-color: rgba(88, 166, 255, 0.42);
    background: rgba(88, 166, 255, 0.12);
    color: #eef6ff;
  }
}

#series-app #zbd-series-labels-toggle.is-active {
  border-color: rgba(88, 166, 255, 0.4);
  background: rgba(88, 166, 255, 0.18);
  color: var(--zbd-text-primary, #f0f6fc);
}

#series-app .cards-sortable-container.zbd-series-display-controlled {
  --zbd-series-col-width: 50%;
  --zbd-series-card-width: 140px;
  --zbd-item-card-width: clamp(58px, var(--zbd-series-card-width), 260px);
  --zbd-floating-chip-card-width: var(--zbd-item-card-width);
  transition: gap 0.16s ease;
}

#series-app .cards-sortable-container.zbd-series-display-controlled > .col[data-item-id] {
  flex: 0 0 var(--zbd-series-col-width) !important;
  width: var(--zbd-series-col-width) !important;
  max-width: var(--zbd-series-col-width) !important;
}

#series-app .cards-sortable-container.zbd-series-display-controlled > [data-item-id] > .zbd-card {
  --zbd-item-card-radius: max(4px, calc(14px * var(--zbd-zoom-scale, 1)));
  --zbd-item-panel-radius: max(3px, calc(10px * var(--zbd-zoom-scale, 1)));
  --zbd-item-chip-radius: max(2px, calc(8px * var(--zbd-zoom-scale, 1)));
  --zbd-item-card-pad-x: max(2px, calc(6px * var(--zbd-zoom-scale, 1)));
  --zbd-item-card-pad-top: max(2px, calc(6px * var(--zbd-zoom-scale, 1)));
  --zbd-item-card-pad-bottom: max(3px, calc(8px * var(--zbd-zoom-scale, 1)));
  --zbd-item-inline-gap: max(1px, calc(4px * var(--zbd-zoom-scale, 1)));
  --zbd-item-shadow-card: 0 max(2px, calc(4px * var(--zbd-zoom-scale, 1)))
    max(5px, calc(12px * var(--zbd-zoom-scale, 1))) rgba(0, 0, 0, 0.3);
  --zbd-item-shadow-panel: 0 max(3px, calc(10px * var(--zbd-zoom-scale, 1)))
    max(6px, calc(18px * var(--zbd-zoom-scale, 1))) rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  border-radius: var(--zbd-item-card-radius);
  padding: var(--zbd-item-card-pad-top) var(--zbd-item-card-pad-x) var(--zbd-item-card-pad-bottom);
  box-shadow: var(--zbd-item-shadow-card);
}

#series-app .cards-sortable-container.zbd-series-display-controlled > [data-item-id] > .zbd-card .zbd-card-header {
  --zbd-status-stripe-step-a: clamp(3px, calc(var(--zbd-item-card-width, 140px) / 11.5), 12px);
  --zbd-status-stripe-step-b: clamp(6px, calc(var(--zbd-item-card-width, 140px) / 6.4), 22px);
  --zbd-status-accent-width: clamp(2px, calc(var(--zbd-item-card-width, 140px) / 35), 4px);
  border-radius: var(--zbd-item-panel-radius) !important;
  padding: clamp(3px, calc(var(--zbd-item-card-width, 140px) / 22), 9px)
    clamp(4px, calc(var(--zbd-item-card-width, 140px) / 15), 12px) !important;
  margin-bottom: clamp(2px, calc(var(--zbd-item-card-width, 140px) / 28), 6px) !important;
  box-shadow: var(--zbd-item-shadow-panel) !important;
}

#series-app .cards-sortable-container.zbd-series-display-controlled .zbd-card-title {
  font-size: clamp(0.38rem, calc(var(--zbd-item-card-width, 140px) / 12), 0.82rem);
}

#series-app .cards-sortable-container.zbd-series-display-controlled .zbd-card-seriesname {
  font-size: clamp(0.34rem, calc(var(--zbd-item-card-width, 140px) / 13), 0.78rem);
}

#series-app .cards-sortable-container.zbd-series-display-controlled .zbd-card-status {
  gap: var(--zbd-item-inline-gap);
  font-size: clamp(0.34rem, calc(var(--zbd-item-card-width, 140px) / 15), 0.74rem);
}

#series-app .cards-sortable-container.zbd-series-display-controlled .zbd-owned-items-trigger {
  --zbd-header-affordance-icon-size: clamp(0.42rem, calc(var(--zbd-item-card-width, 140px) / 22), 0.64rem);
}

#series-app .cards-sortable-container.zbd-series-display-controlled .zbd-image-box {
  border-radius: var(--zbd-item-panel-radius);
  box-shadow: var(--zbd-item-shadow-panel);
}

#series-app .cards-sortable-container.zbd-series-display-controlled > [data-item-id] > .zbd-card .zbd-card-owned-badge {
  width: max(1.28rem, calc(2rem * var(--zbd-owned-badge-scale, 1)));
  height: max(1.28rem, calc(2rem * var(--zbd-owned-badge-scale, 1)));
  padding: max(0.1rem, calc(0.18rem * var(--zbd-owned-badge-scale, 1)));
  border-width: max(1px, calc(1px * var(--zbd-zoom-scale, 1)));
  box-shadow:
    0 0 0 1px rgba(255, 193, 7, 0.28),
    0 max(5px, calc(10px * var(--zbd-owned-badge-scale, 1)))
      max(10px, calc(22px * var(--zbd-owned-badge-scale, 1))) rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

#series-app .cards-sortable-container.zbd-series-display-controlled.zbd-labels-hidden {
  --bs-gutter-x: 3px !important;
  --bs-gutter-y: 3px !important;
}

#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card .zbd-code-badge-outside,
#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card .zbd-card-header,
#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card .zbd-chip-margin,
#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card .zbd-variant-mini-icons,
#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card .zbd-card-owned-badge {
  display: none !important;
}

#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card .zbd-image-box {
  border: 0;
  background: transparent;
  box-shadow: none;
}

#series-app .cards-sortable-container.zbd-labels-hidden > [data-item-id] > .zbd-card .zbd-thumb {
  border-radius: 6px !important;
}