/* Vereinsabzeichen der Journey-Stationen (browser/station-badges.js): aus
   Karton geschnitten, Fläche im Karton der Station (data-heft-cover am
   Abzeichen), aufgeklebtes Papier, dunkle Druckkontur. Platz und Größe
   bestimmt der Ort, an dem das Abzeichen steht (Kopf, Heftrücken). */

/* Doppelte Klasse: Die Kopfleiste setzt für ihre Symbole svg-Regeln
   (Breite 20 px, Strich in Schriftfarbe), die hier nicht gelten dürfen. */
.station-badge.station-badge {
  --sb-fill: var(--heft-cover);
  --sb-ink: var(--heft-cover-ink);
  display: inline-grid;
  flex: none;
  width: var(--station-badge-size, 64px);
  height: var(--station-badge-size, 64px);
}

.station-badge.station-badge > svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  fill: #000;
  stroke: none;
  stroke-width: 1;
}

.station-badge text {
  font-family: var(--fm-font-heading);
  font-weight: 700;
}

.sb-word {
  letter-spacing: 0.06em;
}

.sb-fibre {
  opacity: 0.55;
  mix-blend-mode: overlay;
}

.sb-fill {
  fill: var(--sb-fill);
}

.sb-on-fill {
  fill: var(--sb-ink);
}

/* Motiv: Fläche in Schriftfarbe, ausgestanzt in Kartonfarbe. */
.sb-motif {
  fill: var(--sb-ink);
}

.sb-motif .hole {
  fill: var(--sb-fill);
}

.sb-motif .line {
  fill: none;
  stroke: var(--sb-ink);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sb-motif .line.thick {
  stroke-width: 3.4;
}

/* Harte Schnittkante, Papierband. */
.sb-edge {
  fill: color-mix(in srgb, var(--sb-fill) 50%, #000);
}

.sb-band {
  fill: var(--sb-ink);
}

.sb-on-band {
  fill: var(--sb-fill);
}

.sb-motif .line.spoke {
  stroke-width: 1.1;
}

/* Papierkante innen. */
.sb-rule {
  stroke: var(--sb-ink);
  stroke-width: 1.4;
}

.sb-inset {
  fill: none;
  opacity: 0.9;
}

/* Druckkontur und Zweitfarbe des Vereins; --sb-line, --sb-accent und
   --sb-paper setzt die Zeichnung selbst (station-badges.js). */
.sb-outline {
  fill: none;
  stroke: var(--sb-line);
  stroke-width: 2.4;
  stroke-linejoin: round;
}

.sb-ringline {
  stroke: var(--sb-line);
  stroke-width: 1.8;
}

.sb-stroked {
  stroke: var(--sb-line);
  stroke-width: 1.2;
  stroke-linejoin: round;
}

.sb-hair {
  stroke: var(--sb-line);
  stroke-width: 0.6;
}

.sb-leaf {
  stroke: var(--sb-line);
  stroke-width: 0.7;
}

.sb-cut {
  stroke: var(--sb-line);
  stroke-width: 2.4;
}

.sb-wave {
  fill: none;
  stroke: var(--sb-ink);
  stroke-width: 1.7;
  stroke-linecap: round;
}

.sb-piece {
  fill: var(--sb-paper);
}

.sb-on-ring {
  fill: var(--sb-ink);
}

/* Blätter etwas dunkler als der Grund des Kranzes. */
.sb-leafwork {
  fill: color-mix(in srgb, var(--sb-accent) 82%, #6b655c);
}

.sb-on-piece,
.sb-line-fill {
  fill: var(--sb-line);
}

.sb-accent {
  fill: var(--sb-accent);
}

.sb-wide {
  letter-spacing: 0.16em;
  font-weight: 800;
}

/* Aufkleber auf dem Karton: heller Schnittrand rund um die Form. */
.sb-sticker {
  fill: #f3ede2;
  stroke: #f3ede2;
  stroke-width: 11;
  stroke-linejoin: round;
}

.sb-sticker-shadow {
  fill: rgb(0 0 0 / 0.38);
  stroke: rgb(0 0 0 / 0.38);
}

/* Haarlinien und umrandete Motive. */
.sb-hairline {
  fill: none;
  stroke: var(--sb-line);
  stroke-width: 0.8;
}

.sb-outlined .sb-motif > :not(.hole) {
  stroke: var(--sb-line);
  stroke-width: 0.9;
  paint-order: stroke;
}
