/* consult-chibi.css — Android 상담 화면(청운 도사집 랜딩 · 하연 사주집 랜딩) 미니미 정리 (1.1.1 · 2026-10-10)
   실사풍 큰 초상(landing-scene.jpg · saju-night.jpg 에 구워진 합성본) 대신 → 이웃 전신 아틀라스 정면 칸(가게 방과 같은 비율) + 그 가게 방 배경을 흐리게.
   ★ html.cs-chibi-on 일 때만 적용된다(consult-chibi.js 가 Android·웹에서만 붙인다 — iOS 는 클래스가 안 붙어 옛 화면 그대로).
   ★ 버튼·카드·대사·저장 데이터는 건드리지 않는다. 실사풍 그림 파일은 지우지 않는다(iOS·옛 판용으로 남는다). */

/* ── 전신 아틀라스 정면 칸: assets/owners/<id>/<id>_full_atlas.webp 1600x2560 · 칸 400x640 · idle_front = 0,0 ── */
html.cs-chibi-on .cs-chibi{
  position: absolute; pointer-events: none; z-index: 6;
  aspect-ratio: 400 / 640;
  background-repeat: no-repeat; background-size: 400% 400%; background-position: 0 0;
  filter: drop-shadow(0 10px 12px rgba(30,18,8,.38));
}

/* ── 청운 도사집 랜딩 — 배경 = 찻집 방 그림(흐리게) · 청운 = 전신 칸 ── */
html.cs-chibi-on body.dj-on.dj-landing .dj-landing-scene.is-room{
  object-position: 50% 50%;
  filter: blur(7px) brightness(.88); transform: scale(1.05);
}
html.cs-chibi-on body.dj-on.dj-landing .cs-chibi.cs-oracle{
  left: 4%; bottom: 3%; height: 74%; z-index: 6;
}

/* ── 하연 사주집 랜딩 — 배경 = 책방 방 그림(흐리게) · 하연 = 전신 칸 ── */
html.cs-chibi-on body.sj-landing-active .sj-landing-bg{
  background: #3a2a22 url("assets/rooms/hayeon/back.webp") center 40% / cover no-repeat !important;
  filter: blur(7px) brightness(.9); transform: scale(1.05);
}
html.cs-chibi-on body.sj-landing-active .sj-landing-bg-glow{ display: none; }   /* 구워진 그림의 창·등불 위치에 맞춘 빛 — 새 배경에는 안 맞는다 */
html.cs-chibi-on body.sj-landing-active .cs-chibi.cs-saju{
  left: 3%; bottom: 2%; height: 70%;
}
html.cs-chibi-on body.sj-landing-active .sj-landing-bubble{ left: 46%; top: 9%; z-index: 7; }      /* 하연 전신 칸이 왼쪽에 서므로 말풍선은 오른쪽 위로(칸이 말풍선을 가리지 않게) */

/* ── 상담이 시작된 뒤 무대(.tj-stage.tj-chibi — shop-stage.js 치비무대) — 첫 화면과 같은 방 배경 + 전신 칸 ──
   영상 무대가 서던 위 띠(청운 --dj-stage-h · 하연 --sj-stage-h)를 그대로 쓴다 — 크기·자리는 각 상점 CSS 가 이미 정한다.
   타로집 base.jpg 바탕·곱하기 색·카메라 변형은 여기서 걷는다(공용 셀렉터라 덮어쓴다). */
html.cs-chibi-on .tj-stage.tj-chibi{
  background: #3a2a22 !important;
  background-blend-mode: normal;
  overflow: hidden;
}
html.cs-chibi-on .tj-stage.tj-chibi .tj-chibi-bg{
  position: absolute; inset: -4%;
  background-size: cover; background-position: center 40%; background-repeat: no-repeat;
  filter: blur(7px) brightness(.9);
}
html.cs-chibi-on .tj-stage.tj-chibi .tj-cam{ transform: none !important; transition: none !important; }
html.cs-chibi-on .tj-stage.tj-chibi .cs-chibi.tj-chibi-fig{
  left: 50%; bottom: 3%;
  height: calc(100% - 60px - env(safe-area-inset-top, 0px) - 3%);     /* 위 바(← 마을 · 이름표) 아래에서만 서게 — 머리가 바 뒤로 들어가지 않는다 */
  transform: translateX(-50%);
}
/* 하연 상담 화면은 은화·불꽃·음악·마이크 알약이 무대 아랫단(bottom: 8px · 높이 ~44px)에 얹힌다(saju-stage.css:230~256) —
   전신 칸의 발이 그 위에서 서게 한다(치마가 알약에 가리지 않게). 청운 화면은 그대로. */
html.cs-chibi-on body.sj-on .tj-stage.tj-chibi .cs-chibi.tj-chibi-fig{
  bottom: 52px;
  height: max(0px, calc(100% - 60px - env(safe-area-inset-top, 0px) - 52px));
}
/* 하연 상담 화면 360폭 — 가운데 정렬된 이름표("하연 · AI 사주상담")가 왼쪽 ← 마을 알약(고정 · 약 12~135px)에 앞 글자를 가린다.
   머리말 왼쪽 여백을 알약 폭만큼 잡아 이름표를 오른쪽으로 비킨다(알약 뒤 남은 폭의 가운데). 컴팩트(아래 줄 이름표)는 그대로. */
@media (max-width: 420px){
  html.cs-chibi-on body.sj-on:not(.sj-compact) header.char-header{ padding-left: 144px; }
}
html.cs-chibi-on .tj-stage.tj-chibi::after{ height: 14%; }     /* 띠 아랫단 페이드를 낮춘다 — 발 아래만 대화창과 잇는다 */

/* ── 숨쉬기 (2026-10-14 · 움직임 복구 — shop-stage.js 치비무대 가 is-breath / is-talk 를 건다) ──
   새 그림 없이 전신 칸 한 장이 대기 2px(3.6초) · 말할 때 4px + scale 1.01(1.5초) 오르내린다. 기존 transform(translateX(-50%))을 키프레임에도 그대로 둔다. */
@keyframes tj-breath{ 0%,100%{ transform: translateX(-50%) translateY(0) scale(1); } 50%{ transform: translateX(-50%) translateY(-2px) scale(1.004); } }
@keyframes tj-breath-talk{ 0%,100%{ transform: translateX(-50%) translateY(0) scale(1); } 50%{ transform: translateX(-50%) translateY(-4px) scale(1.01); } }
html.cs-chibi-on .tj-stage.tj-chibi .cs-chibi.tj-chibi-fig.is-breath{ transform-origin: 50% 100%; animation: tj-breath 3.6s ease-in-out infinite; }
html.cs-chibi-on .tj-stage.tj-chibi .cs-chibi.tj-chibi-fig.is-breath.is-talk{ animation: tj-breath-talk 1.5s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce){
  html.cs-chibi-on .tj-stage.tj-chibi .cs-chibi.tj-chibi-fig.is-breath{ animation: none; }
}
