.video-guide-band { padding-block: .8rem 1.2rem; }
.video-guide { border-block: 1px solid var(--line); padding: .8rem 0; }
.video-guide > summary { cursor: pointer; min-height: 48px; padding: .5rem; color: var(--ink); }
.video-guide > summary > span { font-size: 1.05rem; font-weight: 750; }
.video-guide > summary > small { display: block; margin-top: .35rem; font-size: .85rem; color: var(--muted); }
.video-guide-content { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 1.5rem; align-items: start; padding: 1rem .5rem .5rem; }
.video-guide-player { min-width: 0; }
.video-guide-player video, .video-guide-player img { display: block; width: 100%; max-width: 280px; height: auto; aspect-ratio: 9 / 16; object-fit: contain; border: 1px solid var(--line); border-radius: 6px; background: #071a16; }
.video-guide-player [hidden], .video-guide [hidden] { display: none !important; }
.video-guide-player > a { margin-top: .8rem; min-height: 48px; text-align: center; }
.video-guide-text { min-width: 0; max-width: 65ch; }
.video-guide-text > p { margin-top: 0; }
.video-guide-text a, .video-guide-transcript > summary { min-height: 44px; padding-block: .6rem; display: inline-block; cursor: pointer; }
.video-guide-transcript li { margin-block: .6rem; }
.video-guide-transcript ol { padding-inline-start: 1.5rem; }
.video-guide :is(summary, a, video):focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }
.video-guide [role="status"] { padding: .6rem; border-inline-start: 3px solid var(--brand); }
@media (max-width: 620px) {
  .video-guide-content { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .video-guide-player { width: min(100%, 280px); margin-inline: auto; }
  .video-guide > summary > span { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) { .video-guide * { scroll-behavior: auto; } }
.video-guide, .video-guide :is(summary, a, video) { scroll-margin-block-start: 6rem; }