/* Bescheid Einbettung — Grundgestalt. Bewusst mit niedriger Spezifität
   (:where), damit jedes Theme sie ohne Kampf überschreiben kann. Farben über
   Variablen: --einbettung-akzent, --einbettung-tinte, --einbettung-rahmen. */

:where(.einbettung) { position: relative; max-width: 100%; }
:where(.einbettung-flaeche) {
  position: relative; overflow: hidden; background: #0A0A0A;
  aspect-ratio: 9 / 16;
  border: var(--einbettung-rahmenbreite, 3px) solid var(--einbettung-rahmen, #0A0A0A);
}
:where(.einbettung--quer .einbettung-flaeche) { aspect-ratio: 16 / 9; }
:where(.einbettung-bild) { display: block; width: 100%; height: 100%; object-fit: cover; }
:where(.einbettung-bild--leer) { background: repeating-linear-gradient(-45deg, #FFD400 0 18px, #F2C600 18px 36px); }
:where(.einbettung-flaeche iframe) { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

:where(.einbettung-start) {
  position: absolute; left: 0; right: 0; bottom: 0;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  padding: 16px; border: 0; cursor: pointer;
  background: var(--einbettung-akzent, #FFD400); color: var(--einbettung-tinte, #0A0A0A);
  font: 700 15px/1 system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase;
}
:where(.einbettung-start svg) { width: 18px; height: 18px; flex: none; }
:where(.einbettung-dauer) { opacity: .75; }
:where(.einbettung-start:focus-visible) { outline: 3px solid currentColor; outline-offset: -6px; }

:where(.einbettung-leiste) { margin-top: 10px; display: grid; gap: 8px; }
:where(.einbettung-wahl) { display: flex; flex-wrap: wrap; gap: 6px; }
:where(.einbettung-wahl button) {
  font: 600 13px/1 system-ui, sans-serif; padding: 8px 10px; cursor: pointer;
  background: transparent; color: inherit; border: 1.5px solid currentColor;
}
:where(.einbettung-wahl button[aria-pressed="true"]) { background: currentColor; }
:where(.einbettung-wahl button[aria-pressed="true"]) { color: inherit; }
:where(.einbettung-hinweis) { margin: 0; font-size: 13px; line-height: 1.45; opacity: .8; }
:where(.einbettung--laeuft .einbettung-hinweis) { display: none; }
