/* YouTube mit Zwei-Klick-Lösung – Farben über Variablen, damit jede
   Gestaltungsschicht sie übernehmen kann. Die Fläche bleibt dunkel,
   weil Videos auf dunklem Grund gezeigt werden. */
.yt-box{position:relative;aspect-ratio:16/9;max-width:100%;border-radius:var(--yt-radius,8px);overflow:hidden;background:#0d0d12;color:#f2f0ec}
.yt-flaeche{position:absolute;inset:0}
.yt-bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.42}
.yt-hinweis{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:clamp(14px,3vw,22px);background:linear-gradient(rgba(10,10,16,.1) 5%,rgba(10,10,16,.94) 72%)}
.yt-hinweis p{margin:0;font-size:15px;line-height:1.5;max-width:62ch;color:#f2f0ec}
.yt-hinweis a{color:#c9ceff;text-underline-offset:3px}
.yt-zeile{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.yt-laden{display:inline-flex;align-items:center;gap:10px;border:0;cursor:pointer;font:600 15px/1 var(--hb-f-ui,system-ui,sans-serif);padding:12px 18px;border-radius:999px;background:#f2f0ec;color:#111116}
.yt-laden:hover{background:#fff}
.yt-laden:focus-visible,.yt-immer:focus-visible{outline:2px solid #9ea8ff;outline-offset:3px}
.yt-dreieck{width:0;height:0;border-left:10px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}
.yt-immer-label{display:flex;gap:8px;align-items:center;font-size:14px;color:#c8c5cf;cursor:pointer}
.yt-immer{width:17px;height:17px;accent-color:#9ea8ff;margin:0}
.yt-direkt{font-size:13px}
.yt-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width:520px){.yt-hinweis p{font-size:13px}.yt-direkt{display:none}}
.yt-widerruf-status{font-size:15px}
[data-yt-meldung]:empty{display:none}