.video-block { margin: 38px 0; }

.markdown-video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--line-dark);
  border-radius: 12px;
  background: var(--ink);
}

.external-video-placeholder {
  display: grid;
  min-height: 300px;
  align-content: center;
  justify-items: start;
  border: 1px solid var(--line-dark);
  border-radius: 12px;
  background: var(--ink);
  color: var(--paper);
  padding: clamp(28px, 6vw, 54px);
}

.external-video-placeholder p { max-width: 600px; margin: 0 0 12px; color: #b9c6c8; font-size: 15px; line-height: 1.6; }
.external-video-placeholder p:first-child { color: var(--lime); font-family: var(--mono); font-size: 12px; text-transform: uppercase; }
.external-video-placeholder a { color: var(--paper); }

.external-video-load {
  min-height: 48px;
  margin-top: 12px;
  border: 1px solid var(--lime);
  border-radius: 8px;
  background: var(--lime);
  color: var(--ink);
  padding: 0 18px;
  font: 800 14px/1 var(--display);
  cursor: pointer;
}

.external-video-load:hover { background: transparent; color: var(--lime); }
.external-video-load:focus-visible { outline: 3px solid var(--paper); outline-offset: 3px; }