.tipps-rules-page {
  --rules-surface: #fff;
  --rules-soft: #f3f5f8;
  --rules-text: #111827;
  --rules-muted: #667085;
  --rules-line: rgba(15, 23, 42, .09);
  color: var(--rules-text);
}

html[data-theme="dark"] .tipps-rules-page {
  --rules-surface: #181818;
  --rules-soft: #242424;
  --rules-text: #f5f5f5;
  --rules-muted: #b5b5b5;
  --rules-line: rgba(255, 255, 255, .11);
}

.tipps-rules-section-card {
  background: var(--rules-surface);
  border-radius: 20px;
}

.tipps-rules-section-head > div > span {
  display: block;
  margin-bottom: 7px;
  color: var(--rules-muted);
  font-size: .76rem;
  font-weight: 850;
  letter-spacing: .09em;
  line-height: 1;
  text-transform: uppercase;
}

.tipps-rules-section-head h2 {
  margin: 0;
  color: var(--rules-text);
  font-family: 'World Condensed', 'Causten', system-ui, sans-serif;
  font-weight: 400;
  letter-spacing: 0;
  line-height: .98;
  text-transform: uppercase;
}

.tipps-rules-section {
  margin-bottom: 1.25rem;
  scroll-margin-top: 130px;
}

.tipps-rules-section-card {
  --rules-card-padding: clamp(20px, 3vw, 34px);
  padding: var(--rules-card-padding);
}

.tipps-rules-section-head {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  margin: 0 0 .65rem;
}

.tipps-rules-section-head h2 {
  font-size: 1.45rem;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
}

.tipps-text-rules h3 {
  margin: 0;
  color: var(--rules-text);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.2;
}

.tipps-text-rules article + article {
  margin-top: 26px;
}

.tipps-text-rules p {
  max-width: 780px;
  margin: 8px 0 0;
  color: var(--rules-muted);
  font-size: .95rem;
  line-height: 1.55;
}

.tipps-rules-lead {
  max-width: 780px;
  margin: 0 0 22px;
  color: var(--rules-muted);
  line-height: 1.5;
}

.tipps-rules-examples-card {
  margin-top: 0;
}

.tipps-rules-example-table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--rules-text);
  width: 100%;
  color: var(--rules-text);
}

.tipps-rules-example-table thead th {
  padding: 8px 0 10px;
  color: var(--rules-muted);
  background: transparent;
  border: 0;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tipps-rules-example-table tbody td {
  padding: 9px 0;
  color: var(--rules-text);
  background: transparent;
  border: 0;
}

.tipps-rules-example-table th:nth-child(2),
.tipps-rules-example-table td:nth-child(2) {
  text-align: center;
}

.tipps-rules-example-table th:last-child,
.tipps-rules-example-table td:last-child {
  text-align: right;
}

.tipps-rules-score {
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.tipps-rules-points {
  display: inline;
  color: var(--rules-text);
  background: transparent;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
}

@media (max-width: 767.98px) {
  .tipps-rules-section-head {
    margin-bottom: .5rem;
  }

  .tipps-rules-section-head h2 {
    font-size: 1.08rem;
  }

}