/* A contained invitation to the full film; the existing gallery stays intact. */
.training-preview { width: 100%; max-width: 420px; margin-top: 28px; }
.training-preview-stage { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--line); background: #100d0e; }
.training-preview-stage video { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: cover; }
.training-preview-open { position: absolute; inset: 0; display: grid; place-items: center; width: 100%; height: 100%; padding: 0; border: 0; background: linear-gradient(0deg, rgba(12, 8, 10, .25), transparent 60%); color: #ead5ac; cursor: pointer; }
.training-preview-open svg { border-radius: 50%; background: rgba(18, 10, 14, .65); transition: background .2s; }
.training-preview-open circle { stroke: currentColor; }
.training-preview-open path { fill: currentColor; }
.training-preview-open:hover svg { background: rgba(121, 36, 59, .9); }
.training-preview-open:focus-visible { outline: 2px solid var(--gold); outline-offset: -5px; }
.training-preview-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 12px; min-height: 44px; }
.training-preview-note { color: var(--muted); font-size: 11px; }
#training-preview-toggle { min-width: 44px; min-height: 44px; padding: 8px 0 8px 12px; border: 0; background: transparent; color: var(--gold); font-size: 11px; cursor: pointer; }
#training-preview-toggle:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
#training-preview-toggle[hidden] { display: none; }
.training-preview + .text-link { margin-top: 4px; }
@media (max-width: 819px) { .training-preview { max-width: 540px; } }
@media (prefers-reduced-motion: reduce) { .training-preview-open svg { transition: none; } }