/* Click-to-play YouTube (shared with /yt-facade.js). */
.ytf{--ytf-r:4/3;position:relative;display:block;width:100%;aspect-ratio:var(--ytf-r);margin:0;padding:0;
  border:0;border-radius:2px;background:#0f1d19;color:#fff;cursor:pointer;overflow:hidden;
  font:inherit;-webkit-tap-highlight-color:transparent}
.ytf[data-ratio="9/16"]{--ytf-r:9/16}
.ytf img{display:block;width:100%;height:100%;object-fit:cover}
.ytf-fill{position:absolute;inset:0;height:100%;aspect-ratio:auto}
.ytf-fill img{object-fit:contain}
.ytf-play{box-sizing:border-box;position:absolute;right:12px;bottom:12px;width:64px;height:64px;border-radius:50%;
  background:rgba(18,42,36,.86);border:2px solid #fff;box-shadow:0 4px 18px rgba(0,0,0,.35);transition:background .18s ease}
.ytf-play::before{content:"";position:absolute;left:22px;top:18px;border-style:solid;border-width:12px 0 12px 20px;
  border-color:transparent transparent transparent #fff}
.ytf:hover .ytf-play,.ytf:focus-visible .ytf-play{background:#b08640}
.ytf:focus-visible,.ytf-open:focus-visible{outline:3px solid #b08640;outline-offset:3px}
.ytf-tag{position:absolute;left:12px;bottom:12px;padding:5px 10px;border-radius:2px;background:rgba(0,0,0,.72);
  font-size:13px;font-weight:600;line-height:1.3;letter-spacing:.02em}
.ytf-live{cursor:auto;background:#000}
.ytf-live iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ytf-open{display:inline-flex;align-items:center;gap:9px;min-height:44px;margin:10px 0 0;padding:9px 16px;
  border:1px solid currentColor;border-radius:2px;background:transparent;color:inherit;cursor:pointer;
  font:inherit;font-size:15px;font-weight:600;line-height:1.2}
.ytf-open::before{content:"";border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent currentColor}
.ytf-open:hover{background:rgba(176,134,64,.14)}
.ytf-dialog{--ytf-r:4/3;width:min(92vw,820px,calc((100vh - 120px) * var(--ytf-r)));max-width:none;padding:0;border:0;
  background:#0f1d19;color:#fff}
.ytf-dialog::backdrop{background:rgba(8,16,13,.82)}
.ytf-dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 8px 8px 16px}
.ytf-dialog-title{margin:0;font-size:15px;line-height:1.35}
.ytf-close{flex:none;min-height:44px;padding:8px 14px;border:1px solid rgba(255,255,255,.6);border-radius:2px;
  background:transparent;color:#fff;font:inherit;font-size:15px;cursor:pointer}
.ytf-close:focus-visible{outline:3px solid #b08640;outline-offset:2px}
.ytf-dialog-frame{position:relative;aspect-ratio:var(--ytf-r);background:#000}
.ytf-dialog-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ytf-transcript{margin:12px 0 0;font-size:15px;line-height:1.6}
.ytf-transcript summary{cursor:pointer;font-weight:600;min-height:44px;display:flex;align-items:center}
.ytf-transcript p{margin:8px 0 0}
details.ytf-transcript p b{display:inline;margin:0;font:inherit;font-weight:700;color:inherit}
.ytf-quote{margin:16px 0 0;padding:0 0 0 16px;border-left:3px solid #b08640;font-style:italic}
.ytf-quote p{margin:0}
.ytf-quote cite{display:block;margin-top:6px;font-style:normal;font-size:14px}
/* 30px on top of the shared 80px html scroll-padding (site-navigation.css). */
.ytf-figure{margin:28px 0 0;scroll-margin-top:30px}
.ytf-figure figcaption{margin-top:14px}
.ytf-story{scroll-margin-top:30px;display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:28px;align-items:start;margin:40px 0 0}
.ytf-story figcaption{font-size:16px}
.ytf-story figcaption>b{display:block;font-size:1.15rem;line-height:1.35}
/* Phones: keep the 9:16 card short (about 390px tall) so the form below it stays close. */
@media(max-width:640px){.ytf-story{grid-template-columns:minmax(0,1fr)}.ytf-story .ytf{max-width:220px;margin:0 auto}}
/* Small screens: a smaller play button so it covers less of the speaker. */
@media(max-width:480px){.ytf-play{right:8px;bottom:8px;width:48px;height:48px}
  .ytf-play::before{left:16px;top:13px;border-width:9px 0 9px 15px}}
@media(prefers-reduced-motion:reduce){.ytf-play{transition:none}}