/* shop-entry-cinema.css — 상담소 진입 시네마틱 공통 오버레이(타로집·도사집·사주관 셋이 공유).
   2026-09-12 [3개 상담소 진입신 최종 구현]. dosajip-entry-cinema.css·sajujip-entry-cinema.css
   둘을 이 한 파일로 합쳤다(규칙 6 — 같은 것은 한 자리에만).

   ★ html.secine-pending 이 붙었을 때만 동작한다 — 그 클래스는 shop-entry-cinema.js 가
   [village.js 가 그 상점 문을 탭한 순간 심어 둔 1회용 플래그가 있을 때]만 <head> 안에서
   동기로 붙인다. 재진입(플래그 없음)에는 이 파일의 규칙이 단 한 줄도 안 걸린다 —
   선택자 전부가 html.secine-pending 으로 시작해서다. */

html.secine-pending body > *:not(#shop-entry-cine){
  /* 기존 랜딩·상담 DOM 은 평소처럼 완전히 만들어지되(요청 §9 논리 초기화와 시각 표시 분리),
     화면에만 안 보인다 — display:none 이 아니라 opacity 라 레이아웃·getBoundingClientRect
     계산은 평소처럼 돈다(이 앱 전역이 그 값에 기대는 카메라·인셋 코드가 많다). !important 는
     개별 화면 CSS(그 상담 UI 각자의 opacity 애니메이션)보다 반드시 이겨야 하기 때문이다. */
  opacity:0 !important;
}

#shop-entry-cine{
  position:fixed; inset:0; z-index:9999;
  background:#0d0a12;                 /* 밝은 낮이라도 영상 로드 전 첫 프레임은 이 톤 — 흰 플래시 방지 */
  overflow:hidden;
  opacity:1;
  transition:opacity .22s ease;       /* 요청 §8 — 약 0.15~0.25초 cross-dissolve */
}
#shop-entry-cine[hidden]{ display:none; }
#shop-entry-cine.secine-fading{ opacity:0; }

#shop-entry-cine video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center center;   /* 상점별 조정은 JS 가 인라인 style 로 덮는다 */
  opacity:0;
  /* transform 이 아니라 opacity 만 쓴다 — VIDEO01→VIDEO02 사이 [검은 화면 없이] 요구를
     레이아웃 흔들림 없이 지킨다(두 video 모두 같은 inset:0 자리에 겹쳐 있다가 opacity 만 바뀐다).
     2026-09-12 FINAL QA §5 — 타로집·사주관은 v1 마지막 프레임과 v2 첫 프레임 사이에 카메라
     줌/색온도 점프가 실측으로 확인됐다(도사집은 거의 동일 프레임이라 점프가 없었다). 새 영상을
     새로 만들지 않고(요청 §5 금지) 크로스디졸브를 .12s → .2s 로 늘려 점프를 부드럽게 덮는다 —
     여전히 요청 §8 의 0.15~0.25초 범위 안이라 검은 화면 없이 자연스럽던 도사집도 그대로 유지된다. */
  transition:opacity .2s linear;
}
#shop-entry-cine video.secine-show{ opacity:1; z-index:1; }