/* Talstrom Designsystem v1 · Schicht 1/2: Komponenten. */
.ts-c-masthead { padding-top: var(--ts-space-6); }
.ts-c-masthead__row { padding-block: var(--ts-space-3); border-bottom: var(--ts-line-hair) solid var(--ts-line); }
.ts-c-masthead__wordmark {
  color: var(--ts-ink);
  font-family: var(--ts-face-display);
  font-size: clamp(32px, 5vw, 50px);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.025em;
}
.ts-c-masthead__meta { align-items: flex-end; text-align: right; }

.ts-c-headlead { padding-block: var(--ts-space-8); }
.ts-c-headlead__title { max-width: 18ch; }
.ts-c-headlead__deck { max-width: 46ch; }
.ts-c-headmetric { grid-template-columns: minmax(0, auto) minmax(16rem, 1fr); align-items: end; gap: var(--ts-space-6); }
.ts-c-headmetric__metric { color: var(--ts-ink); }
.ts-c-headmetric__copy { padding-bottom: 0.16em; }
.ts-c-headmetric--stack { grid-template-columns: minmax(0, 1fr); }
.ts-c-headcounter { grid-template-columns: minmax(0, 1.4fr); gap: var(--ts-space-3); }
.ts-c-headcounter--split { grid-template-columns: minmax(0, 1fr) 0 minmax(14rem, 0.7fr); gap: var(--ts-space-5); }
.ts-c-headcounter__limit { max-width: 34ch; }
.ts-c-headsection { padding-top: var(--ts-space-6); }

.ts-c-metriclead { min-width: 0; }
.ts-c-metricpair__body { align-items: stretch; }
.ts-c-metricpair__side { flex: 1 1 0; min-width: 0; }
.ts-c-metricrange { position: relative; padding-top: var(--ts-space-4); }
.ts-c-metricrange__mark { position: relative; width: max-content; max-width: 100%; }
.ts-c-metricrange__mark--start { transform: none; }
.ts-c-metricrange__mark--mid { transform: translateX(-50%); }
.ts-c-metricrange__mark--end { transform: translateX(-100%); }
.ts-c-metricrange__track { height: 18px; background: var(--ts-paper-soft); border-block: var(--ts-line-hair) solid var(--ts-line); }
.ts-c-metricrange__fill { height: 100%; background: var(--ts-ink); }
.ts-c-metricevidence__grid { grid-template-columns: max-content minmax(0, 1fr); gap: var(--ts-space-2) var(--ts-space-4); }
.ts-c-metricrail { grid-template-columns: 2fr repeat(3, minmax(0, 1fr)); gap: 0; border-block: var(--ts-line-hair) solid var(--ts-line); }
.ts-c-metricrail__item { min-width: 0; padding: var(--ts-space-4); border-left: var(--ts-line-hair) solid var(--ts-line); }
.ts-c-metricrail__item--first { border-left: 0; }
.ts-c-metricrail--field { border-color: var(--ts-field-line); }
.ts-c-metricrail--field .ts-c-metricrail__item { border-color: var(--ts-field-line); }
.ts-c-metricrail--field .ts-a-text--label,
.ts-c-metricrail--field .ts-a-text--small,
.ts-c-metricrail--field .ts-a-num__unit { color: var(--ts-field-muted); }
.ts-c-metricrail--field .ts-a-num { color: var(--ts-field-text); }
.ts-c-metricrail--field .ts-a-num--lead { color: var(--ts-lead); }
.ts-c-metricrail--field .ts-a-num--fall { color: var(--ts-alarm-field); }
.ts-c-metricrail--field .ts-a-num--rise { color: var(--ts-ok-field); }
.ts-c-metricrail--field .ts-c-metricrail__item--lead .ts-a-num { color: var(--ts-signal); }

.ts-c-tablewrap { width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.ts-c-table { min-width: 42rem; }
.ts-c-tablewrap--dense { --ts-table-block-space: var(--ts-space-1); }
.ts-c-table__caption { caption-side: top; padding-bottom: var(--ts-space-2); text-align: left; }
.ts-c-table__cell--lead { background: var(--ts-paper-soft); }
.ts-c-compare__table { min-width: 34rem; table-layout: fixed; }
.ts-c-compare__cell { padding-left: var(--ts-space-4); }
.ts-c-matrix__table { min-width: 38rem; }
.ts-c-matrix__cell {
  background: color-mix(in srgb, var(--ts-ink) var(--ts-cell-level, 0%), var(--ts-paper));
  border-right: var(--ts-line-hair) solid var(--ts-paper);
  color: var(--ts-ink);
  padding-inline: var(--ts-space-3);
}

.ts-c-evidence { padding-top: var(--ts-space-3); border-top: var(--ts-line-hair) solid var(--ts-line); }
.ts-c-evidence__row { align-items: baseline; }
.ts-c-evidence__label { flex: 0 0 8.5rem; color: var(--ts-ink); }
.ts-c-figure { margin-top: var(--ts-space-8); }
.ts-c-figure__canvas { min-height: 360px; padding: var(--ts-space-4); background: var(--ts-field); color: var(--ts-field-text); }
.ts-c-chartchrome { height: 100%; min-height: 0; }
.ts-c-chartchrome__canvas { flex: 1 1 auto; min-height: 320px; }
.ts-c-chartchrome__heading[hidden] { display: none; }
.ts-c-chartchrome__heading .ts-a-text--section { color: var(--ts-field-text); font-size: var(--ts-font-lead); }
.ts-c-chartchrome__heading .ts-a-text--small { color: var(--ts-field-muted); font-family: var(--ts-face-data); }
.ts-c-chartlegend {
  min-height: 1.5rem;
  padding-inline: var(--ts-space-1);
  color: var(--ts-field-muted);
  font-family: var(--ts-face-data);
}
.ts-c-chartlegend[hidden] { display: none; }
.ts-c-chartlegend__item {
  display: inline-flex;
  align-items: center;
  gap: var(--ts-space-1);
  padding: 0;
  border: 0;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.ts-c-chartlegend__item .ts-a-text--small { color: inherit; }
.ts-c-chartlegend__item[aria-pressed="false"] { color: var(--ts-faint); text-decoration: line-through; }
.ts-c-chartlegend__item:focus-visible { outline: var(--ts-line-heavy) solid var(--ts-signal); outline-offset: 3px; }
.ts-c-chartlegend__swatch {
  width: 1.25rem;
  height: 0;
  border-top: 2px solid var(--ts-chart-series);
}
.ts-c-explorer { width: 100%; min-width: 0; margin-top: var(--ts-space-8); }
.ts-c-explorer__tabs {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  align-items: stretch;
  overflow-x: auto;
  border-bottom: var(--ts-line-hair) solid var(--ts-line);
  overscroll-behavior-inline: contain;
}
.ts-c-explorer__tab {
  flex: 0 0 auto;
  padding: var(--ts-space-2) var(--ts-space-4);
  border: 0;
  border-top: var(--ts-line-signal) solid transparent;
  color: var(--ts-muted);
  white-space: nowrap;
}
.ts-c-explorer__tab:hover { color: var(--ts-ink); }
.ts-c-explorer__tab--active {
  border-top-color: var(--ts-ink);
  background: var(--ts-ink);
  color: var(--ts-paper);
}
.ts-c-explorer__tab--active:hover { color: var(--ts-paper); }
.ts-c-explorer__field { background: var(--ts-field); color: var(--ts-field-text); }
.ts-c-explorer__canvas { display: flex; min-height: 620px; padding: var(--ts-space-4); }
.ts-c-explorer__canvas > .ts-c-chartchrome { flex: 1 1 auto; }
.ts-c-viewswitch {
  width: max-content;
  max-width: 100%;
  overflow-x: auto;
  border: var(--ts-line-hair) solid var(--ts-field-line, #353c40);
}
.ts-c-viewswitch__tab {
  flex: 0 0 auto;
  padding: var(--ts-space-2) var(--ts-space-3);
  border: 0;
  color: var(--ts-field-muted, #b7c0c4);
  white-space: nowrap;
}
.ts-c-viewswitch__tab + .ts-c-viewswitch__tab { border-left: var(--ts-line-hair) solid var(--ts-field-line, #353c40); }
.ts-c-viewswitch__tab:hover { color: var(--ts-field-text, #f7f8f7); }
.ts-c-viewswitch__tab--active {
  background: var(--ts-signal);
  color: var(--ts-field);
}
.ts-c-viewswitch__tab--active:hover { color: var(--ts-field); }
.ts-c-plate { margin-top: var(--ts-space-8); }
.ts-c-plate__field { padding: var(--ts-space-4); background: var(--ts-field); color: var(--ts-field-text); }
.ts-c-plate__canvas { min-height: 520px; }
.ts-c-footer { margin-top: var(--ts-space-9); padding-block: var(--ts-space-4) var(--ts-space-6); border-top: var(--ts-line-heavy) solid var(--ts-ink); }

@media (max-width: 48rem) {
  .ts-c-masthead__meta { align-items: flex-start; text-align: left; }
  .ts-c-headlead { padding-block: var(--ts-space-7); }
  .ts-c-headmetric,
  .ts-c-headcounter--split { grid-template-columns: minmax(0, 1fr); }
  .ts-c-headcounter__rule { width: 100%; border-left: 0; border-top: var(--ts-line-hair) solid var(--ts-line); }
  .ts-c-metricpair__body { flex-direction: column; }
  .ts-c-metricpair__rule { width: 100%; border-left: 0; border-top: var(--ts-line-hair) solid var(--ts-line); }
  .ts-c-figure__canvas { min-height: 320px; padding: var(--ts-space-3); }
  .ts-c-chartchrome__canvas { min-height: 300px; }
  .ts-c-explorer__canvas { min-height: 520px; padding: var(--ts-space-3); }
  .ts-c-metricrail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ts-c-metricrail__item { border-left: 0; border-top: var(--ts-line-hair) solid var(--ts-line); }
  .ts-c-metricrail__item:nth-child(even) { border-left: var(--ts-line-hair) solid var(--ts-line); }
  .ts-c-metricrail__item--lead { grid-column: 1 / -1; border-top: 0; }
  .ts-c-metricrail--field .ts-c-metricrail__item { border-color: var(--ts-field-line); }
  .ts-c-plate__field { padding: var(--ts-space-3); }
  .ts-c-plate__canvas { min-height: 500px; }
}

@media (max-width: 32rem) {
  .ts-c-masthead__wordmark { font-size: 32px; }
  .ts-c-masthead__meta { width: 100%; }
  .ts-c-headmetric { gap: var(--ts-space-3); }
  .ts-c-metricevidence__grid { grid-template-columns: minmax(0, 1fr); }
  .ts-c-evidence__row { flex-direction: column; gap: var(--ts-space-1); }
  .ts-c-evidence__label { flex-basis: auto; }
  .ts-c-figure__canvas { min-height: 300px; }
  .ts-c-explorer__canvas { min-height: 460px; }
  .ts-c-metricrail { grid-template-columns: minmax(0, 1fr); }
  .ts-c-metricrail__item,
  .ts-c-metricrail__item:nth-child(even) { border-left: 0; }
  .ts-c-plate__canvas { min-height: 470px; }
}