/* sicht-fertig: Feed, Bibliothek und Schnittarten (schirm-6.png). Paket-Datei,
   nur ihr Paket ändert sie. Farben und Formen kommen aus den Tokens in stil.css. */

/* Feed: drei Spalten über die ganze Breite, bündig bis an den Rand. Das Polster
   von #haupt wird mit negativem Rand zurückgenommen. */
.fertig-raster {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2px;
  margin: 0 calc(var(--rand) * -1);
}

.fertig-kachel {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  background: transparent;
  color: var(--schrift);
  font: inherit;
  cursor: pointer;
  touch-action: manipulation;
}

/* Titelbild frei, die Aufrufzahl steht in eigener Zeile darunter. */
.fertig-cover { position: relative; background: var(--flaeche); width: 100%; aspect-ratio: 9 / 14; flex: 0 0 auto; border-radius: 0; overflow: hidden; }
.fertig-cover.cover-hook {
  padding: 10px;
  align-items: flex-start;
  font-size: 14px;
  line-height: 1.15;
  overflow: hidden;
}

.fertig-zahl {
  padding: 6px 8px 10px;
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  text-align: left;
  font-variant-numeric: tabular-nums;
}

.fertig-skelett-kachel { aspect-ratio: 9 / 14; height: auto; margin: 0; border-radius: 0; }
.fertig-skelett-liste { height: 112px; margin: 0; border-radius: var(--r-gross); }

/* Bibliothek: Zeilen im Baustein Liste. */
.fertig-zeile-pfeil { flex: 0 0 auto; color: var(--schrift-leise); }

/* Schnittarten: Karten im Baustein Block, Video 9 zu 16, Hauptknopf als helle Pille. */
.sa-karte {
  background: var(--flaeche);
  border: 0;
  border-radius: var(--r-mittel);
  padding: 14px;
}

.sa-knopf {
  min-height: 52px;
  border-radius: 999px;
}

/* Überschriften der Unterseiten (Bibliothek, Schnittarten) wie die der anderen
   Ansichten: ein ruhiger Satz in Grau statt Versalien. */
#bereich-fertig .abschnitt-kopf {
  margin: 24px 0 10px;
  font-size: 22px;
  text-transform: none;
  letter-spacing: -0.015em;
  color: var(--grau);
}

#bereich-fertig > .abschnitt-kopf:first-child,
#bereich-fertig > *:first-child > .abschnitt-kopf:first-child { margin-top: 0; }
