.shell--pipeline-hub {
  width: min(100%, 880px);
}

.pipeline-hub {
  display: grid;
  gap: 18px;
}

.pipeline-tabs {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.pipeline-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: inherit;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}

.pipeline-tab.is-active {
  background: linear-gradient(135deg, var(--line-green), var(--line-green-deep));
  color: #f8fff9;
  border-color: transparent;
}

.pipeline-panels {
  display: grid;
}

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

.pipeline-select {
  max-width: 100%;
  text-overflow: ellipsis;
}

.req {
  color: var(--accent-red);
}

@media (prefers-color-scheme: dark) {
  .pipeline-tab,
  .field-control,
  .field-select,
  .field-textarea,
  .choice-card {
    background: rgba(14, 29, 18, 0.88);
  }
}
