/* 예고픽 — 원문 HTML 프리렌더(빌드 스냅숏)·FAQ·소개 보조 스타일 (scripts/build-static.mjs)
   tokens.css 변수만 사용. .pr-* 는 JS 가 기존 UI 로 하이드레이트하기 전(또는 JS 없는 환경)에만 보인다. */

.pr-title { font-size: var(--fs-h1); line-height: var(--lh-h1); font-weight: var(--fw-black); letter-spacing: var(--ls-tight); margin-top: var(--sp-2); }
.pr-def { margin-top: var(--sp-2); color: var(--c-text); max-width: 68ch; }
.pr-note { margin-top: var(--sp-1); font-size: var(--fs-caption); line-height: var(--lh-caption); color: var(--c-text-muted); }
.pr-h3 { font-size: var(--fs-body); font-weight: var(--fw-bold); margin-top: var(--sp-3); }
.pr-section { margin-top: var(--sp-6); }
.pr-crumbs { display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-2); align-items: center; font-size: var(--fs-caption); color: var(--c-text-muted); margin-bottom: var(--sp-3); }
.pr-crumbs a { color: var(--c-text-muted); text-decoration: underline; text-underline-offset: 3px; min-height: var(--touch); display: inline-flex; align-items: center; }

/* 순위 목록(스냅숏) */
.pr-rank { list-style: none; margin: var(--sp-3) 0 0; padding: 0; display: grid; gap: var(--sp-2); }
.pr-rank__link { display: grid; grid-template-columns: 36px 112px minmax(0, 1fr); align-items: center; gap: var(--sp-3); padding: var(--sp-2); border-radius: var(--r-md); background: var(--c-surface); border: 1px solid var(--c-line); }
.pr-rank__link:hover { background: var(--c-surface-2); }
.pr-rank__num { font-size: 28px; line-height: 1; font-weight: var(--fw-black); text-align: center; color: var(--c-text); }
.pr-rank__item:first-child .pr-rank__num { color: var(--c-gold-text); }
.pr-rank__thumb { width: 112px; height: 63px; object-fit: cover; border-radius: var(--r-xs); background: #000; }
.pr-rank__text { display: grid; gap: 2px; min-width: 0; }
.pr-rank__text b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pr-rank__text small { color: var(--c-text-muted); font-size: var(--fs-caption); line-height: var(--lh-caption); }

/* 영화 기준 페이지 */
.pr-movie .movie-head { margin-bottom: var(--sp-2); }
.pr-movie .player-slot { margin-top: var(--sp-3); }
.pr-trailers { list-style: none; margin: var(--sp-3) 0 0; padding: 0; display: grid; gap: var(--sp-2); }
.pr-trailer a { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: var(--sp-3); align-items: center; min-height: var(--touch); padding: 4px; border-radius: var(--r-sm); }
.pr-trailer a:hover { background: var(--c-surface-2); }
.pr-trailer img { width: 120px; height: 68px; object-fit: cover; border-radius: var(--r-xs); background: #000; }
.pr-trailer__text { display: grid; gap: 2px; min-width: 0; }
.pr-trailer__text small { color: var(--c-text-muted); font-size: var(--fs-caption); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-near { list-style: none; padding: 0; margin: var(--sp-2) 0 0; display: grid; gap: var(--sp-1); }
.pr-near li { min-height: var(--touch); display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.pr-links ul, .pr-links__row { list-style: none; padding: 0; margin: var(--sp-3) 0 0; display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); }
.pr-links li { min-height: var(--touch); display: inline-flex; align-items: center; }

/* 캘린더 스냅숏 */
.pr-cal { list-style: none; padding: 0; margin: var(--sp-2) 0 0; display: grid; gap: 2px; }
.pr-cal__row { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: var(--sp-3); align-items: baseline; min-height: var(--touch); padding: 6px 0; border-bottom: 1px solid var(--c-line); }
.pr-cal__row small { grid-column: 2; }
.pr-cal__date { font-weight: var(--fw-bold); color: var(--c-gold-text); }

/* 홈: 한 문장 정의(하단) · 평론 섹션 */
.home-intro { margin-top: var(--sp-8); font-size: var(--fs-caption); line-height: var(--lh-caption); }
.home-critique .section-head, .movie-critique .section-head { align-items: center; }
.link-more { display: inline-flex; align-items: center; gap: 2px; min-height: var(--touch); font-size: var(--fs-sm); font-weight: var(--fw-semibold); color: var(--c-text-muted); }
.link-more:hover { color: var(--c-text); }
.critique-row .chip { flex: none; }

/* FAQ */
.faq-item { padding-block: var(--sp-4); border-bottom: 1px solid var(--c-line); }
.faq-item:last-child { border-bottom: 0; }
.faq-item__q { font-size: var(--fs-body); line-height: var(--lh-body); font-weight: var(--fw-bold); }
.faq-item__q::before { content: "Q. "; color: var(--c-gold-text); }
.faq-item__a { margin-top: var(--sp-2); color: var(--c-text); }
.faq-item__more { margin-top: var(--sp-1); font-size: var(--fs-sm); }
.faq-item__more a { min-height: var(--touch); display: inline-flex; align-items: center; }

@media (min-width: 900px) {
  .pr-rank { grid-template-columns: 1fr 1fr; }
  .pr-rank__item:first-child { grid-column: 1 / -1; }
}

/* [seo] 장르·카테고리 랜딩 영화 목록(scripts/build-static.mjs filmRow — 사용자 지시 2026-10-14) */
.pr-films { list-style: none; margin: var(--sp-3) 0 0; padding: 0; display: grid; gap: var(--sp-2); }
.pr-film__link { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: center; gap: var(--sp-3); padding: var(--sp-2); border-radius: var(--r-md); background: var(--c-surface); border: 1px solid var(--c-line); min-height: var(--touch); }
.pr-film__link--text { grid-template-columns: minmax(0, 1fr); }
.pr-film__link:hover { background: var(--c-surface-2); }
.pr-film__thumb { width: 112px; height: 63px; object-fit: cover; border-radius: var(--r-xs); background: #000; }
.pr-film__text { display: grid; gap: 2px; min-width: 0; }
.pr-film__text b { overflow-wrap: anywhere; }
.pr-film__text small { color: var(--c-text-muted); font-size: var(--fs-caption); line-height: var(--lh-caption); }
/* 화면 JS 가 다시 그린 뒤 남기는 프리렌더 보존 블록(카테고리 소개·FAQ — ranking.js #rk-seo · movie.js .movie-seo) */
.rk-seo, .movie-seo { margin-top: var(--sp-8); }
.rk-seo:empty { display: none; }
@media (min-width: 900px) {
  .pr-films { grid-template-columns: 1fr 1fr; }
}
