/* ============================================================
   상담소 입장 연출 — 2026-08-28 사람 직접 지시 9차·10차
   ------------------------------------------------------------
   사람 원문:
     "타로집 / 사주집 / 도사집은 실내에 들어가자마자 버튼 UI를 먼저 보여주지 않는다.
      실내 등장 → 상담사가 사용자 바라봄 → 짧은 표정 또는 미소 → 그 다음 상담 UI 등장.
      UI는 아래쪽에서 부드럽게 올라오거나 fade + slide 방식으로 표시한다.
      사용자가 느껴야 하는 경험은 [메뉴 화면을 열었다] 가 아니라 [상담사를 만나러 들어왔다] 이다."

   ★ 이미 있는 것을 다시 만들지 않았다
     입력창(`#composer`)·카드부채(`#card-fan`)는 **원래부터 `.hidden` 으로 시작해서**
     상담사가 첫 말을 건 뒤에야 열린다(reading.js:783·848 · saju.js:379 · physiognomy.js:437).
     그러니까 [UI를 먼저 보여주지 않는다]는 이미 지켜지고 있었다 — 없던 것은 **그 등장이
     아무 연출 없이 툭 나타난다**는 것뿐이다. 그래서 이 파일은 그 순간에만 연출을 얹는다.
     화면 스크립트는 한 줄도 안 고쳤다(기존 기능 삭제 금지 · CLAUDE.md 규칙 6).

   ★ transition 이 아니라 animation 인 이유
     `.hidden` 은 `display:none` 이다. display 가 바뀌는 순간에는 transition 이 재생되지
     않는다 — 그래서 [보이는 상태]에 animation 을 걸어 나타나는 그 프레임부터 돌게 한다.

   ★ 상담사 스프라이트(`.npc-sprite`)
     지금 이 세 화면에는 상담사 원화가 **아직 없다**(npc.js 명부의 `프로필: null` —
     `자산\신버전\캐릭터\루나_타로집.png` 등은 03_디자인팀 채점 대기라 앱에 안 들어와 있다).
     그림이 들어오면 dialogue.js:110 이 `.npc-sprite` 를 세우고, 그 순간부터 아래
     [바라봄 → 미소] 연출이 **저절로** 붙는다. 지금은 규칙만 미리 놓아 둔다.
   ============================================================ */

/* ── ① 실내 등장 — 화면 전체가 아주 짧게 밝아진다 ─────────────
   씬전환 오버레이(scene-manager)가 걷힌 직후의 한 호흡. 0.42초뿐이다. */
@media (prefers-reduced-motion: no-preference){
  /* body 클래스로 좁히지 않는다 — physiognomy.html 은 `premium-hud` 를 안 쓴다(2026-08-28 실측).
     이 파일은 상담 화면 셋에서만 읽히므로 선택자를 넓혀도 다른 화면에 새지 않는다. */
  #chat,
  header.char-header{
    animation: se-room .42s ease-out both;
  }
}
@keyframes se-room{
  from{ opacity:0; transform:translate3d(0,6px,0); }
  to  { opacity:1; transform:none; }
}

/* ── ② 상담사가 사용자를 바라본다 → 짧은 미소 ────────────────
   원화가 들어오는 날 저절로 붙는다(위 ★). 스프라이트가 없으면 아무 일도 없다.
   지시 10차 표의 [2.2~3.0 바라봄 · 3.0~3.5 미소]를 실내 기준 0 초로 당긴 값이다 —
   마을 쪽 0~2.2초는 village-react.js 가 이미 쓴다. */
@media (prefers-reduced-motion: no-preference){
  .npc-sprite{ animation: se-npc-in .78s cubic-bezier(.22,.9,.3,1) both,
                          se-npc-smile .54s ease-in-out .86s 1 both; }
}
@keyframes se-npc-in{
  from{ opacity:0; transform:translate3d(0,10px,0) scale(.985); }
  to  { opacity:1; transform:none; }
}
/* [미소] 는 표정 그림이 없으므로 **숨 한 번**으로 대신한다 — 얼굴을 지어내지 않는다.
   눈감음 컷이 앱에 들어오면 이 규칙을 그 프레임 교체로 바꾸면 된다. */
@keyframes se-npc-smile{
  0%,100%{ transform:none; }
  45%    { transform:translate3d(0,-3px,0) scale(1.006); }
}

/* ── ③ 상담 UI 가 아래에서 부드럽게 올라온다 ─────────────────
   지시: "UI는 아래쪽에서 부드럽게 올라오거나 fade + slide 방식으로 표시한다." */
@media (prefers-reduced-motion: no-preference){
  #composer:not(.hidden),
  #card-fan:not(.hidden),
  .npc-choice-slot > *{
    animation: se-rise .44s cubic-bezier(.22,.9,.3,1) both;
  }
  /* 카드부채는 한 박자 늦게 — 입력창과 같이 올라오면 두 덩어리가 부딪혀 보인다. */
  #card-fan:not(.hidden){ animation-delay:.10s; }
}
@keyframes se-rise{
  from{ opacity:0; transform:translate3d(0,16px,0); }
  to  { opacity:1; transform:none; }
}

/* ── 모션 축소 ───────────────────────────────────────────────
   지시 [prefers-reduced-motion 대응]. 위 규칙은 전부 no-preference 안에 있으므로
   여기서는 되돌릴 것이 없다 — 값이 그대로(연출 0) 나온다. */