/* Abendmahl-Tafel im Aprostel-Reiter (A-181): ein gemaltes Bild im Goldrahmen – Refektorium als Kulisse,
   die Aprostel als gemalte Brustbilder hinter gedeckten Tafeln (js/laden.js UI.tafel).
   Fehlen die Bilder (img/hd/apo_saal.png, apo_tisch.png), bleiben dunkler Saal und Holztafel als CSS-Verlauf. */
#apTeam { padding: 8px 8px 10px; background: linear-gradient(#2a1a0a, #1a0e05); border-bottom: 3px solid #0e0703; }
#apTeam[hidden] { display: none; }
.apt-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; margin: 0 2px 6px; }
.apt-head > b { font-family: var(--pix); font-size: 11px; color: var(--gold); }
.apt-sum { font-size: 13px; color: var(--cream); }

/* der Rahmen: schmale Goldleiste mit dunkler Kante, innen der Saal */
.apt-saal {
  position: relative; display: flex; flex-direction: column; gap: 4px; padding: 54px 4px 8px; overflow: hidden;
  background: #1b0f07; border: 3px solid #c8942a; outline: 2px solid #3a2208;
  box-shadow: inset 0 0 0 2px #6a4410, inset 0 0 24px rgba(0, 0, 0, .7);
}
.apt-saal::before {
  content: ''; position: absolute; inset: 0 0 auto 0; aspect-ratio: 2 / 3; pointer-events: none;
  background: url(../img/hd/apo_saal.png) center top / cover, radial-gradient(ellipse at 50% 0, #4a2c12, transparent 70%);
  image-rendering: pixelated; opacity: .8;
  -webkit-mask-image: linear-gradient(#000 55%, transparent 98%); mask-image: linear-gradient(#000 55%, transparent 98%);
}

/* eine Reihe: Porträts, davor die Tafel, darunter die Fähigkeit */
.apt-reihe { position: relative; display: flex; justify-content: center; }
/* Tafel: oben 14 px Krüge, Brezen und Kerzen (davor durchsichtig), darunter das Tischtuch – es verdeckt die Brust der Aprostel */
.apt-tisch {
  position: absolute; left: -4px; right: -4px; top: 40px; height: 40px; z-index: 2; pointer-events: none;
  /* darunter (nur sichtbar, wenn das Bild fehlt): schlichtes Tischtuch mit roter Borte */
  background: url(../img/hd/apo_tisch.png) 0 0 / 160px 40px repeat-x,
    linear-gradient(#f2e8d0 0 4px, #d8ccb0 4px 18px, #8a1019 18px 21px, #c8942a 21px 23px, #d8ccb0 23px) 0 14px / 100% 26px no-repeat;
  filter: drop-shadow(0 4px 3px rgba(0, 0, 0, .5));
}
.apt-platz { position: relative; width: 64px; margin: 0 1px; display: flex; flex-direction: column; align-items: center; cursor: help; }
.apt-fig { position: relative; z-index: 1; width: 64px; height: 64px; image-rendering: pixelated; animation: aptWipp 3.2s ease-in-out infinite; transform-origin: 50% 100%; }
.apt-platz:nth-child(2n) .apt-fig { animation-delay: -1.1s; }
.apt-platz:nth-child(3n) .apt-fig { animation-delay: -2.3s; }
.apt-platz small {
  position: relative; z-index: 3; margin-top: 19px; max-width: 66px; min-height: 22px; font-size: 10.5px; line-height: 1.05; text-align: center;
  color: var(--cream); text-shadow: 0 1px 0 #000, 0 0 3px #000;
}
@keyframes aptWipp { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-2px) rotate(-1.5deg); } }
@media (hover: hover) { .apt-platz:hover .apt-fig { filter: brightness(1.2) drop-shadow(0 0 4px rgba(255, 220, 120, .6)); } }
@media (prefers-reduced-motion: reduce) { .apt-fig { animation: none; } }