/* youtube — 납텍 유튜브. (데모에서 새로 만든 블록)

   채널(@nabtek)의 최신 영상 두 편을 나란히 둔다. 영상 칸은 blocks/video 와 같은 .nb-video(누르기 전에는 썸네일뿐).
   칸 나누기 — 모바일 1열, 태블릿 · PC 2열(8칸 · 12칸의 약수라 격자 선 위에 선다).
   제목(h2)을 가진 블록이라 skin-95.css 가 창틀과 제목 표시줄을 두른다. "채널 보기" 는 제목 표시줄 오른쪽 끝. */

.nb-yt__lead { margin: 0 0 var(--nb-s4); font-size: var(--nb-t-md); color: var(--nb-ink-2); }
.nb-yt__channel { margin-left: auto; font-size: var(--nb-t-sm); font-weight: 400; }
.nb-yt__channel::after { content: " \2197"; }          /* 밖으로 나가는 링크 */

.nb-yt {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: 1fr; gap: var(--nb-gutter);
}
.nb-yt__item {
  display: grid; gap: var(--nb-s2); align-content: start;
  padding: var(--nb-s3);
  background: var(--nb-surface);
  border: var(--nb-bw) solid var(--nb-line);
}
.nb-yt__title { margin: 0; font-size: var(--nb-t-md); font-weight: 700; line-height: 1.35; text-wrap: balance; }
.nb-yt__title a { color: var(--nb-ink); text-decoration: none; }
.nb-yt__title a:hover { color: var(--nb-accent); text-decoration: underline; text-underline-offset: 3px; }
.nb-yt__meta { margin: 0; font-size: var(--nb-t-xs); color: var(--nb-ink-3); font-variant-numeric: tabular-nums; }

@container nb-block (min-width: 640px) {
  .nb-yt { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* 랜덤으로 고르지 않은 영상 — 격자 칸을 차지하지 않는다 */
.nb-yt__item[hidden] { display: none; }
