@import url('https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&family=Gowun+Batang:wght@400;700&family=Noto+Serif+KR:wght@400;700;900&family=Noto+Sans+KR:wght@200;300;400&display=swap');
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#0A0A0F;--bg-card:#0e0e14;
  --text:#D4C8B0;--text-bright:#e8dcc6;
  --gold:#8B7D3C;--gold-dim:#7a6f45;--gold-glow:rgba(139,125,60,0.15);
  --text-dim:#9a9080;--system:#7a7368;--assistant:#a8a090;
  --wood:#4a7c59;--fire:#8b3a3a;--earth:#8b7355;--metal:#7a7a8a;--water:#3a5a8b;
  --safe-bottom:env(safe-area-inset-bottom, 0px)
}
html{height:100%;background:#000;overscroll-behavior:none}
body{height:100%;background:var(--bg);color:var(--text);font-family:'Gowun Batang',serif;font-size:20px;line-height:1.8;overflow:hidden;-webkit-font-smoothing:antialiased;word-break:keep-all;overscroll-behavior:none}
@media(min-width:500px){body{max-width:430px;margin:0 auto;transform:translateZ(0)}}

/* ═══════════════════════════════════
   ATMOSPHERIC LAYERS
   ═══════════════════════════════════ */

.grain{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:0.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:256px 256px}

.vignette{position:fixed;inset:0;z-index:3;pointer-events:none;
  background:radial-gradient(ellipse at 50% 45%,transparent 30%,rgba(0,0,0,0.55) 70%,rgba(0,0,0,0.85) 100%);
  transition:opacity 1.5s ease}
.vignette.soft{opacity:0.35}

/* 만세력→풀이 전환: 비네팅 강화 + 배경 약간 따뜻하게 */
body.reading-mode .vignette{
  background:radial-gradient(ellipse at 50% 45%,transparent 25%,rgba(0,0,0,0.6) 65%,rgba(0,0,0,0.9) 100%);
  transition:background 2s ease,opacity 2s ease}
body.reading-mode{transition:background-color 2s ease;background-color:#080706}

.breathing{position:fixed;inset:0;z-index:4;pointer-events:none;background:var(--bg);animation:breathe 8s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:0}50%{opacity:0.03}}

/* ── INCENSE SMOKE VIDEO ─── */
.smoke-video{position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  height:100vh;width:auto;min-width:30vw;
  z-index:1;pointer-events:none;object-fit:cover;
  mix-blend-mode:screen;opacity:0;transition:opacity 2s ease}
.smoke-video.visible{opacity:0.55}

/* ═══════════════════════════════════
   ATMOSPHERIC DYNAMICS — 점집 분위기
   ═══════════════════════════════════ */

/* 적중 시 황금빛 번쩍 */
.screen-flash{position:fixed;inset:0;z-index:5;pointer-events:none;
  background:radial-gradient(ellipse at 50% 50%,rgba(139,125,60,0.08) 0%,transparent 70%);
  opacity:0;transition:opacity 0.15s ease}
.screen-flash.active{opacity:1;transition:opacity 0.08s ease}

/* 불규칙 빛 깜빡임 — 촛불 바람에 흔들리는 느낌 */
.ambient-flicker{position:fixed;inset:0;z-index:6;pointer-events:none;
  background:rgba(212,200,176,0.015);opacity:0;transition:opacity 0.08s ease}
.ambient-flicker.active{opacity:1;transition:opacity 0.04s ease}

/* ═══════════════════════════════════
   SERVICE INTRO — 첫 진입 시 서비스 정체 표시
   ═══════════════════════════════════ */
.service-intro{position:fixed;top:38%;left:50%;transform:translate(-50%,-50%);
  z-index:15;text-align:center;pointer-events:none;
  opacity:0;animation:introFadeIn 2s ease 0.3s forwards}
.service-intro-title{font-family:'Noto Serif KR',serif;font-weight:900;font-size:28px;
  color:var(--text-bright);letter-spacing:4px;
  text-shadow:0 0 30px rgba(139,125,60,0.25),0 0 60px rgba(139,125,60,0.1)}
.service-intro-sub{font-family:'Gowun Batang',serif;font-size:14px;
  color:var(--text-dim);margin-top:8px;letter-spacing:2px}
.service-intro.fade-out{animation:introFadeOut 1.2s ease forwards}
body.reading-mode .service-intro{display:none}

/* 보살/법사 선택 후 전체화면 소개 */
.shaman-intro{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:rgba(0,0,0,0.92);text-align:center;pointer-events:none;
  opacity:0;animation:shamanIntroIn 1.5s ease 0.2s forwards}
.shaman-intro-tag{font-family:'Noto Sans KR',sans-serif;font-size:13px;color:var(--gold-dim);
  font-weight:300;letter-spacing:2px;margin-bottom:16px}
.shaman-intro-name{font-family:'Noto Serif KR',serif;font-weight:900;font-size:32px;
  color:var(--text-bright);letter-spacing:4px;
  text-shadow:0 0 30px rgba(139,125,60,0.25),0 0 60px rgba(139,125,60,0.1)}
.shaman-intro-desc{font-family:'Gowun Batang',serif;font-size:15px;
  color:var(--text-dim);margin-top:12px;line-height:1.8;letter-spacing:1px}
.shaman-intro.fade-out{animation:shamanIntroOut 1s ease forwards}
@keyframes shamanIntroIn{0%{opacity:0}100%{opacity:1}}
@keyframes shamanIntroOut{0%{opacity:1}100%{opacity:0}}
@keyframes introFadeIn{0%{opacity:0;transform:translate(-50%,-50%) translateY(8px)}100%{opacity:1;transform:translate(-50%,-50%) translateY(0)}}
@keyframes introFadeOut{0%{opacity:1}100%{opacity:0}}

/* ═══════════════════════════════════
   LOBBY MODE — 대기실 분위기 (상담실과 차별화)
   ═══════════════════════════════════ */
.lobby-mode{background:#0D0C08 url('/img/lobby-bg.webp') center/cover no-repeat;
  transition:background 1.5s ease}
.lobby-mode .incense{opacity:0;transition:opacity 1.5s ease}
.lobby-mode .breathing{animation-duration:12s}
/* 대기실 텍스트 가독성: 강한 text-shadow + 밝은 텍스트 */
.lobby-mode .assistant-text{color:#d0ccc2;
  text-shadow:0 0 12px rgba(0,0,0,1),0 0 24px rgba(0,0,0,0.9),0 1px 4px rgba(0,0,0,1),0 0 40px rgba(0,0,0,0.6)}
.lobby-mode .assistant-label{color:#9a958c;
  text-shadow:0 0 12px rgba(0,0,0,1),0 0 24px rgba(0,0,0,0.9)}
.lobby-mode .assistant-wrap{background:linear-gradient(90deg,rgba(0,0,0,0.55) 0%,rgba(0,0,0,0.3) 60%,transparent 100%)}
.lobby-mode .response-btn{background:rgba(0,0,0,0.5);backdrop-filter:blur(4px)}

/* Gemini 워터마크 가림 — 우측 하단 */
.lobby-mode::after{content:'';position:fixed;right:0;bottom:0;width:60px;height:30px;
  background:#0D0C08;z-index:6;pointer-events:none}

/* 대기실 어둡게 오버레이 + 격자문 빛 억제 */
.lobby-warmth{position:fixed;inset:0;z-index:7;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,0.55) 0%,rgba(5,3,0,0.45) 50%,rgba(10,5,0,0.50) 100%),
    radial-gradient(ellipse at 62% 62%,rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.50) 20%,rgba(0,0,0,0.20) 35%,transparent 50%);
  opacity:0;transition:opacity 2s ease}

/* 랜턴 불빛 — 전체 화면에 퍼지는 따뜻한 빛 + 흔들림 */
.lobby-lantern-glow{position:fixed;inset:0;
  z-index:8;pointer-events:none;
  background:radial-gradient(ellipse at 25% 35%,
    rgba(255,155,40,0.32) 0%,rgba(255,135,30,0.15) 22%,
    rgba(255,120,20,0.06) 45%,transparent 72%);
  opacity:0;transition:opacity 2s ease}
.lobby-lantern-glow.active{animation:lanternFlicker 7s ease-in-out infinite}

@keyframes lanternFlicker{
  0%,100%{opacity:0.80;transform:scale(1) translate(0,0)}
  14%{opacity:0.50;transform:scale(0.95) translate(-2px,1.5px)}
  30%{opacity:0.88;transform:scale(1.04) translate(1.5px,-1.5px)}
  44%{opacity:0.45;transform:scale(0.94) translate(-1px,2px)}
  58%{opacity:0.85;transform:scale(1.05) translate(2px,-1px)}
  72%{opacity:0.48;transform:scale(0.95) translate(-1.5px,1px)}
  86%{opacity:0.90;transform:scale(1.03) translate(1px,-1.5px)}
}

/* ═══════════════════════════════════
   HANJI NOTE — 한지 후기 오브젝트
   ═══════════════════════════════════ */
.hanji-note{position:fixed;bottom:calc(60px + var(--safe-bottom));right:20px;z-index:3;
  width:68px;height:82px;cursor:pointer;
  background:rgba(160,145,115,0.07);border:1px solid rgba(139,125,60,0.1);
  border-radius:2px 4px 6px 3px;
  box-shadow:inset 0 0 12px rgba(139,125,60,0.04),0 2px 8px rgba(0,0,0,0.3);
  transform:rotate(-2deg);opacity:0;transition:opacity 0.8s ease;
  animation:hanjiFloat 6s ease-in-out infinite}
.hanji-note.visible{opacity:1}
.hanji-note-text{writing-mode:vertical-rl;font-family:'Gowun Batang',serif;font-size:11px;
  color:rgba(212,200,176,0.35);padding:10px 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@keyframes hanjiFloat{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(-1.5deg) translateY(-4px)}}

/* ═══════════════════════════════════
   REVIEW PANEL — 후기 바텀시트
   ═══════════════════════════════════ */
.review-backdrop{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,0.5);
  opacity:0;transition:opacity 0.3s;pointer-events:none}
.review-backdrop.open{opacity:1;pointer-events:all}

.review-panel{position:fixed;bottom:0;left:0;right:0;z-index:101;
  max-height:60vh;background:#0D0C08;border-top:1px solid rgba(139,125,60,0.12);
  border-radius:12px 12px 0 0;padding:20px 24px calc(20px + var(--safe-bottom));
  transform:translateY(100%);transition:transform 0.4s ease;overflow-y:auto}
.review-panel.open{transform:translateY(0)}
.review-panel-handle{width:36px;height:4px;background:rgba(139,125,60,0.2);border-radius:2px;margin:0 auto 16px}
.review-panel-title{font-family:'Noto Sans KR',sans-serif;font-size:12px;color:var(--text-dim);font-weight:200;margin-bottom:16px;letter-spacing:1px}
.review-item{padding:14px 0;border-bottom:1px solid rgba(139,125,60,0.06);
  font-family:'Gowun Batang',serif;font-size:14px;line-height:1.8;color:var(--text-dim)}
.review-item-meta{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:var(--system);margin-top:6px;font-weight:200}

/* ═══════════════════════════════════
   SCREEN FADE (장면 전환)
   ═══════════════════════════════════ */
.screen-fade{position:fixed;inset:0;z-index:9999;background:#000;opacity:0;pointer-events:none;transition:opacity 1.5s ease}
.screen-fade.active{opacity:1;pointer-events:all}

/* ═══════════════════════════════════
   LAYOUT
   ═══════════════════════════════════ */
.container{height:100%;display:flex;flex-direction:column;max-width:620px;margin:0 auto;padding:0 28px;position:relative;z-index:10}
body.input-active .container{z-index:30}
.chat-area{flex:1;overflow-y:auto;padding:52px 0 24px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.top-bar{position:fixed;top:0;left:0;right:0;z-index:790;height:48px;
  background:linear-gradient(180deg,rgba(10,10,15,0.95) 0%,rgba(10,10,15,0.7) 70%,transparent 100%);
  pointer-events:none}
body.lobby-mode .top-bar{background:linear-gradient(180deg,rgba(13,12,8,0.95) 0%,rgba(13,12,8,0.7) 70%,transparent 100%)}
.chat-area::-webkit-scrollbar{display:none}

/* ═══════════════════════════════════
   MESSAGES
   ═══════════════════════════════════ */
.message{margin-bottom:28px;opacity:0;transform:translateY(10px);animation:fadeIn 0.8s ease forwards}
@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}

/* 문단 간격 차등 */
.message.gap-tight{margin-bottom:12px}
.message.gap-wide{margin-bottom:44px;margin-top:16px}

/* 무당 — 기본 */
.mudang-text{font-family:'Noto Serif KR',serif;font-size:22px;line-height:2;color:var(--text);
  text-shadow:0 0 20px var(--gold-glow);white-space:normal;word-break:keep-all;letter-spacing:0.01em}

/* 무당 — 강조 (적중, 핵심 한마디) */
.mudang-text.emphasis{font-size:28px;color:#E8D5A0;font-weight:700;line-height:1.75;
  letter-spacing:0.015em;
  text-shadow:0 0 30px rgba(200,160,70,0.4),0 0 60px rgba(200,160,70,0.15)}

/* 무당 — 속삭임 (전환) */
.mudang-text.whisper{font-size:19px;color:var(--text-dim);font-weight:400;letter-spacing:0.03em}

/* 무당 — 경고 (조심/위험/주의 — 크고 섬뜩하게) */
.mudang-text.warning{font-size:26px;color:#D4605A;font-weight:700;letter-spacing:0.02em;
  text-shadow:0 0 30px rgba(210,90,80,0.35),0 0 60px rgba(210,90,80,0.12)}

/* 무당 — 호흡/중얼거림 (감탄사) */
.mudang-text.mudang-breath{font-size:19px;color:var(--text-dim);opacity:0.75;letter-spacing:0.06em;font-weight:400}

/* 무당 — LLM 대기 필러 (맥동 효과) */
.mudang-text.mudang-filler{font-size:19px;color:var(--text-dim);letter-spacing:0.06em;font-weight:400;
  animation:fillerPulse 2.5s ease-in-out infinite}
@keyframes fillerPulse{
  0%,100%{opacity:0.4;text-shadow:0 0 10px rgba(139,125,60,0.05)}
  50%{opacity:0.85;text-shadow:0 0 25px rgba(139,125,60,0.2)}}

/* 대기 중 향 연기 점 애니메이션 */
.ritual-waiting{display:flex;gap:8px;padding:8px 0 4px;align-items:center}
.ritual-waiting-dot{width:4px;height:4px;border-radius:50%;background:var(--gold-dim);opacity:0.2;
  animation:ritualDotRise 3s ease-in-out infinite}
.ritual-waiting-dot:nth-child(2){animation-delay:0.8s}
.ritual-waiting-dot:nth-child(3){animation-delay:1.6s}
@keyframes ritualDotRise{
  0%,100%{opacity:0.15;transform:translateY(0) scale(1)}
  40%{opacity:0.7;transform:translateY(-6px) scale(1.3)}
  70%{opacity:0.3;transform:translateY(-10px) scale(0.8)}}

/* 대기 중 비네팅 호흡 강화 */
body.ritual-active .vignette{animation:vignetteBreath 4s ease-in-out infinite}
@keyframes vignetteBreath{
  0%,100%{opacity:1}
  50%{opacity:0.85}}

/* 안내선녀 대기 점 (쿨톤) */
.ritual-waiting.ast-waiting .ritual-waiting-dot{background:var(--system)}

/* 무당 — 주제 전환 */
.mudang-text.mudang-turn{padding-top:8px;border-top:1px solid rgba(139,125,60,0.06)}

/* 무당 — 짧은 문장 (≤25자) — 크고 또렷하게 */
.mudang-text.mudang-brief{font-size:27px;font-weight:600;color:var(--text-bright);line-height:1.85;
  letter-spacing:0.02em}

/* 무당 — 긴 설명 (>100자) — 차분하고 읽기 좋게 */
.mudang-text.mudang-lengthy{font-size:20px;font-weight:400;line-height:2.1;
  color:var(--text);opacity:0.88;letter-spacing:0.005em}

/* 무당 — 결론/마무리 ("결국~") — 깊고 울림 있게 */
.mudang-text.mudang-conclusion{font-size:26px;font-weight:600;color:var(--text-bright);line-height:1.9;
  letter-spacing:0.02em;text-shadow:0 0 28px rgba(180,150,80,0.25),0 0 55px rgba(180,150,80,0.1)}

/* 무당 — 질문 (<50자, ?로 끝남) — 부드럽게 던지기 */
.mudang-text.mudang-question{font-size:24px;font-weight:500;color:var(--text-bright);line-height:1.9;
  letter-spacing:0.015em}

/* 무당 — 숫자 예언 (나이/연도/개수) — 구체적 예측 강조 */
.mudang-text.mudang-numbered{font-size:25px;font-weight:500;color:#D4AA6A;line-height:1.9;
  letter-spacing:0.01em;text-shadow:0 0 22px rgba(200,160,80,0.35)}

/* 무당 — 선언형 ("이건", "사실") — 중요한 말 꺼내기 전 호흡 */
.mudang-text.mudang-declaration{font-size:22px;font-weight:500;color:var(--text-bright);
  line-height:1.9;letter-spacing:0.025em;opacity:0.9}

/* 무당 — 부정/긴장 키워드 쿨톤 — 경고보단 낮은 긴장감 */
.mudang-text.mudang-caution{font-size:22px;font-weight:400;color:#A8A8B8;line-height:2;
  letter-spacing:0.01em}

/* 무당 — emphasis([*]) pulse glow 애니메이션 */
@keyframes emphasisPulse{
  0%,100%{text-shadow:0 0 25px rgba(200,160,70,0.35),0 0 50px rgba(200,160,70,0.12)}
  50%{text-shadow:0 0 45px rgba(220,175,80,0.65),0 0 90px rgba(220,175,80,0.25),0 0 130px rgba(220,175,80,0.08)}
}
.mudang-text.emphasis{animation:emphasisPulse 2.5s ease-in-out infinite}

/* ═══════════════════════════════════
   안내선녀 — Gowun Batang + 쿨톤 + 좌측 세로선
   무아보살(세리프/웜톤)과 완전 다른 시각 아이덴티티
   ═══════════════════════════════════ */
.assistant-wrap{padding:10px 14px;border-left:2px solid rgba(180,178,170,0.25);
  background:linear-gradient(90deg,rgba(0,0,0,0.35) 0%,transparent 80%);
  border-radius:0 4px 4px 0}

.assistant-label{font-family:'Noto Sans KR',sans-serif;font-size:14px;color:#7a756d;
  font-weight:300;letter-spacing:2px;margin-bottom:6px;opacity:0.85}

.assistant-text{font-family:'Gowun Batang',serif;font-size:17px;line-height:1.9;
  color:#A8A49A;font-weight:400;letter-spacing:normal}

/* 사용자 */
.user-msg-wrap{text-align:right}
.user-msg{color:var(--text-dim);font-size:14px;font-family:'Noto Sans KR',sans-serif;font-weight:300;
  padding:6px 14px;border-radius:12px;background:rgba(139,125,60,0.04);display:inline-block}

/* ═══════════════════════════════════
   TEXT EFFECTS
   ═══════════════════════════════════ */
.flicker .mudang-text,.flicker.mudang-text{animation:candleFlicker 4s ease-in-out infinite}
@keyframes candleFlicker{
  0%,100%{text-shadow:0 0 20px var(--gold-glow)}
  25%{text-shadow:0 0 28px rgba(139,125,60,0.25),0 0 50px rgba(139,125,60,0.08)}
  50%{text-shadow:0 0 16px rgba(139,125,60,0.1)}
  75%{text-shadow:0 0 32px rgba(139,125,60,0.3),0 0 60px rgba(139,125,60,0.1)}}

.tremor{animation:tremor 5s ease-in-out infinite}
@keyframes tremor{0%,100%{transform:translate(0,0)}20%{transform:translate(0.3px,-0.2px)}40%{transform:translate(-0.2px,0.3px)}60%{transform:translate(0.2px,0.1px)}80%{transform:translate(-0.1px,-0.3px)}}

/* ═══════════════════════════════════
   SAJU DISPLAY — 사주팔자 표
   ═══════════════════════════════════ */
.saju-display{text-align:center;margin:40px 0 36px;opacity:0;animation:fadeIn 1.5s ease 0.3s forwards}

.saju-pillars{display:flex;justify-content:center;gap:0;margin-bottom:24px;padding:20px 0;position:relative}

.pillar{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;max-width:88px;padding:0 14px}
.pillar-label{font-family:'Noto Sans KR',sans-serif;font-size:12px;font-weight:400;color:var(--text-dim);
  letter-spacing:2px;margin-bottom:10px;opacity:0.8}
.hanja{font-family:'Noto Serif KR',serif;font-size:46px;font-weight:900;color:var(--gold);
  text-shadow:0 0 24px rgba(139,125,60,0.15);line-height:1.3;transition:text-shadow 0.3s}
.hanja-sub{font-family:'Noto Sans KR',sans-serif;font-size:10px;color:var(--gold-dim);font-weight:200;
  opacity:0.5;letter-spacing:1px}
.pillar-divider{width:20px;height:1px;background:linear-gradient(90deg,transparent,rgba(139,125,60,0.15),transparent);margin:10px 0}
.pillar{transition:background 1s ease-out,box-shadow 1s ease-out}
.pillar .hanja{transition:all 1s ease-out}
.pillar.scanning{background:rgba(139,125,60,0.12);box-shadow:0 0 30px rgba(139,125,60,0.4),inset 0 0 15px rgba(139,125,60,0.08);
  transition:background 0.8s ease-in,box-shadow 0.8s ease-in}
.pillar.scanning .hanja{opacity:1;color:#d4c070;text-shadow:0 0 50px rgba(139,125,60,1),0 0 20px rgba(139,125,60,0.6);
  transition:all 0.8s ease-in;transform:scale(1.05)}
.pillar.reading .hanja{animation:pillarPulse 4.5s ease-in-out infinite}
@keyframes pillarPulse{0%,100%{opacity:0.45;text-shadow:0 0 8px rgba(139,125,60,0.15)}
  50%{opacity:0.9;text-shadow:0 0 35px rgba(139,125,60,0.5),0 0 15px rgba(139,125,60,0.3)}}

/* ═══════════════════════════════════
   FIVE ELEMENTS BAR — 오행 분포
   ═══════════════════════════════════ */
.five-elements-bar{display:flex;height:6px;border-radius:3px;overflow:visible;margin:12px auto 0;max-width:300px;opacity:0.9;
  gap:3px;background:transparent}
.fe-segment{position:relative;min-width:6px;border-radius:3px;transform-origin:left}
.fe-label{position:absolute;top:12px;left:50%;transform:translateX(-50%);font-family:'Noto Sans KR',sans-serif;
  font-size:11px;font-weight:400;color:var(--text-dim);white-space:nowrap;opacity:0.85}
.fe-wood{background:var(--wood)}.fe-fire{background:var(--fire)}.fe-earth{background:var(--earth)}
.fe-metal{background:var(--metal)}.fe-water{background:var(--water)}

/* ═══════════════════════════════════
   INPUT
   ═══════════════════════════════════ */
.input-area{padding:16px 0 calc(20px + var(--safe-bottom));position:relative;z-index:25}
.input-row{display:flex;align-items:center;gap:12px;padding:8px 0}
.user-input{flex:1;background:transparent;border:none;border-bottom:1px solid rgba(139,125,60,0.15);color:var(--text);font-family:'Gowun Batang',serif;font-size:17px;padding:12px 0;outline:none;caret-color:var(--gold);transition:border-color 0.3s;
  overflow-y:hidden;min-height:22px;max-height:120px;line-height:1.5;word-break:keep-all;white-space:pre-wrap;-webkit-user-select:text;user-select:text}
.user-input:empty::before{content:attr(data-placeholder);color:var(--text-dim);font-weight:300;font-family:'Noto Sans KR',sans-serif;font-size:13px;pointer-events:none}
.user-input:focus{border-bottom-color:var(--gold-dim)}
.send-btn{background:none;border:none;color:var(--gold-dim);font-size:20px;cursor:pointer;padding:12px 16px;min-width:44px;min-height:44px;transition:color 0.3s;-webkit-tap-highlight-color:transparent}
.send-btn:hover{color:var(--gold)}

/* ═══════════════════════════════════
   TYPING INDICATOR
   ═══════════════════════════════════ */
.typing-indicator{display:inline-block;width:2px;height:18px;background:var(--gold-dim);margin-left:2px;animation:blink 1s step-end infinite;vertical-align:text-bottom}
.typing-indicator.ast{background:var(--system);height:14px}
@keyframes blink{50%{opacity:0}}

/* ═══════════════════════════════════
   CTA — 복채 결제 버튼
   ═══════════════════════════════════ */
.cta-container{text-align:center;margin:32px 0;opacity:0;animation:fadeIn 1s ease 0.5s forwards}
.cta-btn{background:rgba(0,0,0,0.3);border:1px solid var(--gold-dim);color:var(--gold);font-family:'Noto Sans KR',sans-serif;
  font-size:14px;font-weight:300;padding:14px 40px;cursor:pointer;transition:all 0.3s;letter-spacing:1px;
  border-radius:24px;position:relative;overflow:hidden}
.cta-btn:hover{border-color:var(--gold);background:rgba(139,125,60,0.06);color:var(--text-bright)}
.cta-btn:active{transform:scale(0.97)}
.cta-price{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:var(--text-dim);margin-top:10px;font-weight:200;letter-spacing:0.5px}
.cta-consent{display:flex;align-items:flex-start;gap:8px;margin-top:16px;cursor:pointer;max-width:360px;margin-left:auto;margin-right:auto}
.cta-consent input[type="checkbox"]{margin-top:2px;accent-color:var(--gold-dim);flex-shrink:0}
.cta-consent span{font-family:'Noto Sans KR',sans-serif;font-size:10px;color:var(--text-dim);font-weight:200;line-height:1.6;text-align:left}
.cta-btn:disabled{opacity:0.3;cursor:not-allowed}
.cta-skip{display:block;margin:12px auto 0;background:none;border:none;color:var(--text-dim);font-family:'Noto Sans KR',sans-serif;
  font-size:11px;cursor:pointer;padding:8px 16px;transition:color 0.3s;opacity:0.6}
.cta-skip:hover{color:var(--text);opacity:1}

/* ═══════════════════════════════════
   SHAMAN CHOICE — 보살 선택 카드
   ═══════════════════════════════════ */
.shaman-choice{display:flex;gap:14px;justify-content:center;margin:28px 0;opacity:0;animation:fadeIn 0.8s ease 0.3s forwards;
  position:relative;z-index:50;flex-wrap:wrap}
.shaman-card{flex:1;max-width:160px;padding:20px 16px;border:1px solid rgba(139,125,60,0.35);border-radius:8px;
  background:#0a0a0a;cursor:pointer;text-align:center;transition:all 0.3s;
  box-shadow:0 4px 24px rgba(0,0,0,0.8)}
.shaman-card:hover{border-color:var(--gold);background:#0e0e0e;
  box-shadow:0 4px 30px rgba(0,0,0,0.9),0 0 20px rgba(139,125,60,0.12)}
.shaman-card:active{transform:scale(0.97)}
.shaman-card-tag{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:var(--gold-dim);font-weight:300;
  letter-spacing:0.5px;margin-bottom:8px}
.shaman-card-hanja{font-family:'Ma Shan Zheng','Noto Serif KR',serif;font-size:13px;color:var(--gold-dim);
  letter-spacing:3px;margin-bottom:4px}
.shaman-card-name{font-family:'Noto Serif KR',serif;font-size:18px;color:#f0ead8;font-weight:700;
  margin-bottom:8px;letter-spacing:1px;
  text-shadow:0 0 8px rgba(139,125,60,0.4),0 1px 3px rgba(0,0,0,0.8)}
.shaman-card-desc{font-family:'Noto Sans KR',sans-serif;font-size:12px;color:#c4b478;font-weight:300;
  margin-bottom:6px;word-break:keep-all;
  text-shadow:0 1px 3px rgba(0,0,0,0.8)}
.shaman-card-highlight{font-family:'Noto Serif KR',serif;font-size:15px;color:#f0ead8;font-weight:700;
  margin:8px 0 4px;letter-spacing:1px;
  text-shadow:0 0 10px rgba(139,125,60,0.3),0 1px 3px rgba(0,0,0,0.8)}
.shaman-card-cost{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:#a89e8e;font-weight:200;margin-top:4px;word-break:keep-all;
  text-shadow:0 1px 2px rgba(0,0,0,0.8)}
.shaman-guide{width:100%;text-align:center;font-family:'Gowun Batang',serif;font-size:13px;color:#8a8578;
  margin-top:14px;word-break:keep-all;opacity:0;animation:fadeIn 0.8s ease 0.5s forwards}
.shaman-card.main{border-color:var(--gold-dim);position:relative}

/* === POST SESSION ACTIONS === */
.post-session-actions{display:flex;flex-direction:column;align-items:center;gap:10px;margin:32px auto;max-width:240px;
  opacity:0;animation:fadeIn 0.8s ease 0.5s forwards}
.post-action-btn{width:100%;background:transparent;border:1px solid rgba(139,125,60,0.2);color:var(--text-dim);
  font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:300;padding:13px 0;cursor:pointer;
  border-radius:24px;transition:all 0.3s;text-align:center;letter-spacing:0.5px}
.post-action-btn:hover{border-color:var(--gold-dim);color:var(--gold);background:rgba(139,125,60,0.04)}
.post-action-btn:active{transform:scale(0.97)}
.post-action-btn.primary{border-color:var(--gold-dim);color:var(--gold)}
.post-action-btn.secondary{border-color:rgba(139,125,60,0.1);font-size:12px;color:var(--system)}

/* ═══════════════════════════════════
   BUTTON SYSTEM — 통일된 디자인
   ═══════════════════════════════════ */
.response-buttons{display:flex;flex-direction:column;align-items:center;gap:8px;margin:24px auto;max-width:260px;
  opacity:0;animation:fadeIn 0.6s ease 0.3s forwards}
/* 버튼 기본 (secondary — 일반 선택지) */
.response-btn{width:100%;background:rgba(0,0,0,0.3);border:1px solid rgba(139,125,60,0.18);color:#A8A49A;
  font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:300;padding:14px 0;cursor:pointer;
  border-radius:24px;transition:all 0.3s;text-align:center;backdrop-filter:blur(2px);
  min-height:48px}
.response-btn:hover{border-color:var(--gold-dim);color:var(--gold);background:rgba(139,125,60,0.05)}
.response-btn:active{transform:scale(0.97)}
/* 버튼 primary (핵심 행동 — 더 여쭤보기, 내 사주 보기 등) */
.response-btn.primary{background:rgba(139,125,60,0.1);border-color:rgba(139,125,60,0.35);
  color:var(--gold);font-weight:400}
.response-btn.primary:hover{background:rgba(139,125,60,0.18);border-color:var(--gold)}
/* 버튼 ghost (보조 행동 — 돌아가기, 괜찮아요 등) */
.response-btn.ghost{background:transparent;border-color:rgba(139,125,60,0.08);
  color:var(--text-dim);font-size:13px}
.response-btn.ghost:hover{border-color:rgba(139,125,60,0.2);color:var(--text)}

/* ═══════════════════════════════════
   SOROM CARD — 소름 캡처 카드
   ═══════════════════════════════════ */
.sorom-card{background:var(--bg-card);border:1px solid rgba(139,125,60,0.12);border-radius:8px;padding:24px;margin:28px 0;text-align:center;
  opacity:0;animation:fadeIn 1s ease 0.3s forwards;position:relative}
.sorom-card::before{content:'';position:absolute;top:0;left:20%;right:20%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(139,125,60,0.3),transparent)}
.sorom-text{font-family:'Gowun Batang',serif;font-size:15px;line-height:1.9;color:var(--text);margin-bottom:16px;font-style:italic}
.sorom-share{background:transparent;border:1px solid rgba(139,125,60,0.15);color:var(--gold-dim);font-family:'Noto Sans KR',sans-serif;
  font-size:11px;padding:8px 20px;cursor:pointer;border-radius:4px;transition:all 0.3s;letter-spacing:0.5px}
.sorom-share:hover{border-color:var(--gold);color:var(--gold)}

/* ═══════════════════════════════════
   KAKAO LOGIN — 접수
   ═══════════════════════════════════ */
.kakao-login-wrap{text-align:center;margin:24px 0;opacity:0;animation:fadeIn 0.6s ease 0.3s forwards}
.kakao-login-btn{background:#FEE500;color:#191600;border:none;font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:400;
  padding:13px 36px;border-radius:24px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all 0.3s;letter-spacing:0.3px}
.kakao-login-btn:hover{background:#f5dc00;box-shadow:0 4px 20px rgba(254,229,0,0.15)}
.kakao-login-btn:active{transform:scale(0.97)}
.kakao-icon{vertical-align:middle}
.login-privacy-note{font-family:'Gowun Batang',serif;font-size:11px;color:#706b63;margin:14px 0 0;line-height:1.6;letter-spacing:-0.2px;opacity:0.7}

/* ═══════════════════════════════════
   REVIEW MEMO — 묵지 후기
   ═══════════════════════════════════ */
.review-memo{margin:20px 0;padding:16px 20px;border-radius:4px;
  background:rgba(139,125,60,0.03);border-left:2px solid rgba(139,125,60,0.12);
  opacity:0;animation:fadeIn 1.2s ease forwards}
.review-memo-text{font-family:'Gowun Batang',serif;font-size:14px;line-height:1.8;
  color:var(--text-dim);font-style:italic;letter-spacing:0.02em}

/* ═══════════════════════════════════
   DIVIDER
   ═══════════════════════════════════ */
.divider{border:none;height:1px;margin:36px 0;opacity:0;animation:fadeIn 1.2s ease forwards;
  background:linear-gradient(90deg,transparent,rgba(139,125,60,0.15),transparent)}

/* ═══════════════════════════════════
   INPUT AREA
   ═══════════════════════════════════ */
.input-area.hidden{opacity:0;pointer-events:none;transition:opacity 0.5s}
.follow-up-free-hint{
  font-family:'Gowun Batang',serif;font-size:12px;color:#A8A49A;
  text-align:center;padding:4px 0 8px;opacity:0.85;letter-spacing:0.3px;
}

/* ═══════════════════════════════════
   FOOTER
   ═══════════════════════════════════ */
.footer{position:fixed;bottom:0;left:0;right:0;z-index:20;
  text-align:center;padding:6px 16px calc(6px + var(--safe-bottom));
  font-family:'Noto Sans KR',sans-serif;font-size:10px;color:#5a5550;line-height:1.5;
  background:linear-gradient(transparent,rgba(10,10,15,0.7) 60%);pointer-events:auto;
  transition:opacity 0.5s}
body.input-active .footer{pointer-events:none;opacity:0}
.footer a{color:#6a6560;text-decoration:none}
.footer a:hover{text-decoration:underline;color:#8a8580}
.footer-disc{color:#4a4540}
body.reading-mode .footer{display:none}

/* ═══════════════════════════════════
   BIRTH FORM
   ═══════════════════════════════════ */
.birth-form{margin:20px 0;opacity:0;animation:fadeIn 0.8s ease 0.3s forwards;
  padding:20px;border:1px solid rgba(139,125,60,0.08);border-radius:8px;background:rgba(139,125,60,0.02)}
.birth-row{display:flex;gap:8px;margin-bottom:12px;align-items:center}
.birth-name-input{width:100%;background:rgba(10,10,15,0.6);border:1px solid rgba(139,125,60,0.15);color:var(--text);
  font-family:'Noto Sans KR',sans-serif;font-size:15px;padding:11px 14px;border-radius:6px;outline:none;transition:border-color 0.3s;
  caret-color:var(--gold)}
.birth-name-input::placeholder{color:var(--text-dim);font-weight:200}
.birth-name-input:focus{border-color:var(--gold-dim)}
.birth-select{background:rgba(10,10,15,0.6);border:1px solid rgba(139,125,60,0.15);color:var(--text);font-family:'Noto Sans KR',sans-serif;
  font-size:14px;padding:11px 12px;border-radius:6px;outline:none;appearance:none;cursor:pointer;flex:1;transition:border-color 0.3s}
.birth-select.wide{flex:2}
.birth-select:focus{border-color:var(--gold-dim)}
.birth-select option{background:var(--bg);color:var(--text)}
.birth-submit{background:rgba(0,0,0,0.3);border:1px solid var(--gold-dim);color:var(--gold);font-family:'Noto Sans KR',sans-serif;
  font-size:14px;font-weight:300;padding:13px 24px;cursor:pointer;transition:all 0.3s;border-radius:24px;width:100%;margin-top:12px;letter-spacing:1px}
.birth-submit:hover{background:rgba(139,125,60,0.06);border-color:var(--gold)}
.birth-submit:active{transform:scale(0.97)}
.birth-submit.ghost{background:transparent;border-color:rgba(139,125,60,0.08);color:var(--text-dim);font-size:13px;margin-top:8px}
.birth-submit.ghost:hover{border-color:rgba(139,125,60,0.2);color:var(--text)}
/* 시간 직접입력 */
.birth-time-row{display:flex;align-items:center;gap:8px}
.birth-time-wrap{display:flex;align-items:center;gap:4px;flex:1}
.birth-time-input{width:60px;background:rgba(10,10,15,0.6);border:1px solid rgba(139,125,60,0.15);color:var(--text);
  font-family:'Noto Sans KR',sans-serif;font-size:16px;padding:11px 12px;border-radius:6px;outline:none;text-align:center;
  -moz-appearance:textfield;transition:border-color 0.3s}
.birth-time-input::-webkit-outer-spin-button,.birth-time-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.birth-time-input:focus{border-color:var(--gold-dim)}
.birth-time-input:disabled{opacity:0.3}
.birth-time-sep{color:var(--text-dim);font-size:18px;font-weight:300}
.birth-time-unknown{background:transparent;border:1px solid rgba(139,125,60,0.15);color:var(--text-dim);font-family:'Noto Sans KR',sans-serif;
  font-size:13px;padding:11px 16px;border-radius:6px;cursor:pointer;transition:all 0.3s;white-space:nowrap}
.birth-time-unknown.active{border-color:var(--gold-dim);color:var(--gold);background:rgba(139,125,60,0.06)}

/* 입장 버튼 */
.entry-btn-wrap{text-align:center;margin:28px 0;opacity:0;animation:fadeIn 1s ease 0.3s forwards}
.entry-btn{background:rgba(0,0,0,0.4);border:1px solid var(--gold-dim);color:var(--gold);
  font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:300;padding:14px 48px;cursor:pointer;
  border-radius:24px;transition:all 0.4s ease;letter-spacing:1.5px;backdrop-filter:blur(4px);
  animation:entryPulse 3s ease-in-out infinite}
@keyframes entryPulse{0%,100%{box-shadow:0 0 15px rgba(139,125,60,0.08)}
  50%{box-shadow:0 0 30px rgba(139,125,60,0.2)}}
.entry-btn:hover{border-color:var(--gold);background:rgba(139,125,60,0.06)}
.entry-btn:active{transform:scale(0.97)}

.calendar-toggle{background:none;border:1px solid rgba(139,125,60,0.2);color:var(--gold-dim);font-family:'Noto Sans KR',sans-serif;
  font-size:12px;font-weight:300;padding:6px 12px;cursor:pointer;border-radius:16px;transition:all 0.3s;
  flex-shrink:0;white-space:nowrap}
.calendar-toggle:hover{border-color:var(--gold);color:var(--gold)}
.gender-row{display:flex;gap:8px}
.gender-btn{flex:1;background:rgba(0,0,0,0.2);border:1px solid rgba(139,125,60,0.15);color:var(--text-dim);font-family:'Noto Sans KR',sans-serif;
  font-size:14px;font-weight:300;padding:11px;cursor:pointer;border-radius:24px;transition:all 0.3s}
.gender-btn.active{border-color:var(--gold-dim);color:var(--gold);background:rgba(139,125,60,0.06)}

/* ═══════════════════════════════════
   REVEAL PATTERN
   ═══════════════════════════════════ */
.reveal-pending{opacity:0;transform:translateY(12px);transition:opacity 0.8s ease,transform 0.8s ease}
.reveal-pending.revealed{opacity:1;transform:translateY(0)}

/* ═══════════════════════════════════
   SUMMARY CARD (보살님이 적어주신 것)
   ═══════════════════════════════════ */
.summary-card{background:rgba(30,28,22,0.85);border:1px solid rgba(139,125,60,0.12);
  border-radius:10px;padding:20px;margin:16px 0;backdrop-filter:blur(4px)}
.summary-card-header{font-family:'Gowun Batang',serif;font-size:14px;color:var(--text-dim);
  margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid rgba(139,125,60,0.08)}
.summary-section{margin-bottom:14px}
.summary-section:last-child{margin-bottom:0}
.summary-label{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:var(--gold-dim);
  text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
.summary-content,.summary-value{font-family:'Gowun Batang',serif;font-size:15px;color:var(--text);line-height:1.8}

/* ═══════════════════════════════════
   MUDANG TABLE CARD — 보살이 그려주는 표
   ═══════════════════════════════════ */
.mudang-table-card{background:rgba(25,23,18,0.9);border:1px solid rgba(139,125,60,0.15);
  border-radius:8px;padding:16px 18px;margin:16px 0;backdrop-filter:blur(4px)}
.mtc-row{display:flex;justify-content:space-between;align-items:baseline;
  padding:8px 0;border-bottom:1px solid rgba(139,125,60,0.06)}
.mtc-row:last-child{border-bottom:none}
.mtc-label{font-family:'Noto Serif KR',serif;font-size:14px;font-weight:600;
  color:var(--gold-dim);min-width:60px;flex-shrink:0}
.mtc-value{font-family:'Noto Serif KR',serif;font-size:15px;color:var(--text);
  text-align:right;flex:1;margin-left:16px;line-height:1.6}

/* ═══════════════════════════════════
   SOUND TOGGLE
   ═══════════════════════════════════ */
.sound-toggle{text-align:center;padding:30vh 0 0;opacity:0;animation:fadeIn 1.5s ease 0.5s forwards}
.sound-prompt{font-family:'Gowun Batang',serif;font-size:15px;color:var(--text-dim);margin-bottom:28px;line-height:1.9}
.sound-options{display:flex;gap:16px;justify-content:center}
.sound-btn{background:transparent;border:1px solid rgba(139,125,60,0.15);color:var(--text-dim);font-family:'Gowun Batang',serif;
  font-size:13px;padding:12px 28px;cursor:pointer;border-radius:6px;transition:all 0.4s;letter-spacing:0.5px}
.sound-btn:hover{border-color:var(--gold-dim);color:var(--gold);background:rgba(139,125,60,0.04)}

/* ═══════════════════════════════════
   MOBILE
   ═══════════════════════════════════ */
@media(max-width:480px){
  body{font-size:18px}
  .container{padding:0 20px}
  .mudang-text{font-size:20px}
  .mudang-text.emphasis{font-size:26px}
  .mudang-text.warning{font-size:24px}
  .mudang-text.mudang-breath{font-size:17px}
  .mudang-text.mudang-brief{font-size:25px}
  .mudang-text.mudang-lengthy{font-size:18px}
  .mudang-text.mudang-conclusion{font-size:24px}
  .mudang-text.mudang-question{font-size:22px}
  .mudang-text.mudang-numbered{font-size:23px}
  .mudang-text.mudang-declaration{font-size:20px}
  .mudang-text.mudang-caution{font-size:20px}
  .assistant-text{font-size:19px}
  .hanji-note{width:58px;height:70px;right:16px}
  .hanja{font-size:36px}
  .saju-pillars{padding:16px 0}
  .pillar{padding:0 10px}
  .response-btn{padding:11px 0;font-size:13px}
  .cta-btn{padding:12px 28px;font-size:13px}
  .sorom-card{padding:18px}
  .birth-form{padding:16px}
  .birth-select{padding:9px 10px;font-size:13px}
  .kakao-login-btn{font-size:13px;padding:11px 28px}
  .five-elements-bar{max-width:240px}
  .sound-toggle{padding:25vh 0 0}
  .message.gap-wide{margin-bottom:36px}
}

@media(max-width:360px){
  .hanja{font-size:32px}
  .saju-pillars{padding:12px 0}
  .pillar{padding:0 8px}
}

/* ═══════════════════════════════════
   S6: SUBJECT LABEL INPUT
   ═══════════════════════════════════ */
.subject-label-wrap{display:flex;gap:10px;align-items:center;margin:16px 0;opacity:0;animation:fadeIn 0.6s ease 0.2s forwards}
.subject-input{background:rgba(255,255,255,0.04);border:1px solid rgba(139,125,60,0.2);color:var(--text-main);
  font-family:'Gowun Batang',serif;font-size:16px;padding:10px 16px;border-radius:8px;width:180px;outline:none}
.subject-input::placeholder{color:rgba(138,132,120,0.5)}
.subject-input:focus{border-color:var(--gold-dim)}
.subject-submit-btn{background:transparent;border:1px solid rgba(139,125,60,0.25);color:var(--text-dim);
  font-family:'Noto Sans KR',sans-serif;font-size:14px;padding:10px 20px;border-radius:8px;cursor:pointer;transition:all 0.3s}
.subject-submit-btn:hover{border-color:var(--gold-dim);color:var(--gold)}

/* ═══════════════════════════════════
   S8: HISTORY BOTTOM SHEET
   ═══════════════════════════════════ */
.history-backdrop{position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:900;opacity:0;animation:fadeIn 0.3s ease forwards}
.history-sheet{position:fixed;bottom:0;left:0;right:0;max-height:70vh;background:#0D0C08;border-top:1px solid rgba(139,125,60,0.15);
  border-radius:16px 16px 0 0;z-index:901;transform:translateY(100%);transition:transform 0.4s cubic-bezier(0.32,0.72,0,1);
  overflow-y:auto;padding:0 0 env(safe-area-inset-bottom)}
.history-sheet.open{transform:translateY(0)}
.history-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 12px;
  border-bottom:1px solid rgba(139,125,60,0.08);position:sticky;top:0;background:#0D0C08;z-index:1}
.history-header span{font-family:'Gowun Batang',serif;color:var(--text-dim);font-size:17px}
.history-close-btn{background:none;border:none;color:var(--text-dim);font-family:'Noto Sans KR',sans-serif;font-size:13px;cursor:pointer;opacity:0.6}
.history-close-btn:hover{opacity:1}
.history-group{padding:12px 24px}
.history-group-label{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:var(--gold-dim);text-transform:uppercase;
  letter-spacing:1px;margin-bottom:8px;opacity:0.7}
.history-item{padding:16px 0;border-bottom:1px solid rgba(139,125,60,0.06)}
.history-item:last-child{border-bottom:none}
.history-item-tags{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:rgba(138,132,120,0.5);letter-spacing:0.02em}
.history-item-relation{font-family:'Gowun Batang',serif;font-size:15px;color:var(--text);margin-top:5px;font-weight:400}
.history-item-preview{font-family:'Noto Sans KR',sans-serif;font-size:12px;color:rgba(139,125,60,0.5);margin-top:4px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:0.03em}
.history-item-actions{display:flex;gap:12px;margin-top:10px}
.history-detail-btn{background:rgba(139,125,60,0.04);border:1px solid rgba(139,125,60,0.12);color:var(--text-dim);
  font-family:'Noto Sans KR',sans-serif;font-size:13px;cursor:pointer;padding:10px 16px;border-radius:8px;
  transition:all 0.3s;min-height:44px;display:flex;align-items:center}
.history-detail-btn:hover{border-color:var(--gold-dim);color:var(--gold)}
.history-ask-btn{background:rgba(139,125,60,0.08);border:1px solid rgba(139,125,60,0.2);color:var(--gold);
  font-family:'Noto Sans KR',sans-serif;font-size:13px;cursor:pointer;padding:10px 16px;border-radius:8px;
  transition:all 0.3s;min-height:44px;display:flex;align-items:center}
.history-ask-btn:hover{background:rgba(139,125,60,0.14);border-color:var(--gold)}
.history-detail{font-family:'Noto Serif KR',serif;font-size:15px;color:var(--text-main);line-height:1.8;
  max-height:0;overflow:hidden;transition:max-height 0.4s ease;margin-top:0;white-space:pre-wrap}
.history-detail.open{max-height:2000px;margin-top:12px}
.report-section{margin-bottom:12px}
.report-label{font-family:'Noto Sans KR',sans-serif;font-size:11px;color:var(--gold-dim);margin-bottom:4px;letter-spacing:0.5px}
.report-content{font-family:'Gowun Batang',serif;font-size:14px;color:var(--text);line-height:1.7}
.history-question-wrap{padding:16px 24px 24px;position:sticky;bottom:0;background:linear-gradient(transparent,#0D0C08 30%)}
.history-question-btn{width:100%;background:rgba(139,125,60,0.08);border:1px solid rgba(139,125,60,0.25);
  color:var(--gold);font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:300;
  padding:14px 0;border-radius:12px;cursor:pointer;transition:all 0.3s;letter-spacing:0.5px}
.history-question-btn:hover{background:rgba(139,125,60,0.12);border-color:var(--gold)}

/* ═══════════════════════════════════
   복채 잔액 배지 (고정 UI)
   ═══════════════════════════════════ */
.token-badge{position:fixed;top:16px;right:16px;z-index:800;
  font-family:'Noto Sans KR',sans-serif;font-size:12px;font-weight:300;
  color:var(--gold);background:rgba(10,10,15,0.85);backdrop-filter:blur(8px);
  border:1px solid rgba(139,125,60,0.15);border-radius:20px;
  padding:6px 14px;opacity:0;transition:opacity 0.5s ease;pointer-events:none}
.token-badge.visible{opacity:1}
body.in-session .token-badge{opacity:0 !important}
.token-badge .token-count{font-weight:500;margin-left:2px}

/* ═══════════════════════════════════
   SETTINGS MENU
   ═══════════════════════════════════ */
.settings-btn{position:fixed;top:16px;left:16px;z-index:800;
  font-size:20px;color:var(--text-dim);cursor:pointer;opacity:0;transition:opacity 0.5s;
  padding:4px 8px;line-height:1}
.settings-btn.visible{opacity:0.6}
.settings-btn:hover{opacity:1}
.settings-overlay{position:fixed;inset:0;z-index:900;background:rgba(0,0,0,0.6);
  opacity:0;pointer-events:none;transition:opacity 0.3s}
.settings-overlay.active{opacity:1;pointer-events:auto}
.settings-panel{position:fixed;top:0;left:0;bottom:0;width:260px;z-index:901;
  background:rgba(14,14,20,0.97);backdrop-filter:blur(12px);
  border-right:1px solid rgba(139,125,60,0.1);
  transform:translateX(-100%);transition:transform 0.3s ease;
  padding:60px 24px 24px;display:flex;flex-direction:column;gap:8px}
.settings-panel.active{transform:translateX(0)}
.settings-title{font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:400;
  color:var(--text-dim);margin-bottom:16px;letter-spacing:1px}
.settings-item{display:block;width:100%;text-align:left;background:none;border:none;
  font-family:'Gowun Batang',serif;font-size:16px;color:var(--text);
  padding:12px 0;cursor:pointer;border-bottom:1px solid rgba(139,125,60,0.08)}
.settings-item:hover{color:var(--text-bright)}
.settings-item.danger{color:#a85454}
.settings-item.danger:hover{color:#c45454}
.settings-item.ghost{color:var(--text-dim);font-size:14px;border-bottom:none;margin-top:auto}

/* ═══════════════════════════════════
   OFFLINE BANNER
   ═══════════════════════════════════ */
.offline-banner{position:fixed;top:0;left:0;right:0;z-index:999;background:rgba(168,84,84,0.9);
  color:#fff;font-family:'Noto Sans KR',sans-serif;font-size:13px;text-align:center;padding:10px 16px;
  backdrop-filter:blur(4px);animation:fadeIn 0.3s ease}

/* ═══════════════════════════════════
   ACCESSIBILITY
   ═══════════════════════════════════ */
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
button:focus-visible{outline:2px solid var(--gold);outline-offset:2px;
  background:rgba(139,125,60,0.08)}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;
    transition-duration:0.01ms !important}
}

/* ═══════════════════════════════════
   SHARE BOTTOM SHEET
   ═══════════════════════════════════ */
.share-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:900;
  animation:fadeIn 0.2s ease}
.share-sheet{position:fixed;bottom:0;left:50%;transform:translateX(-50%);
  width:100%;max-width:420px;background:#1a1a1f;border-radius:16px 16px 0 0;
  padding:16px 24px 32px;z-index:901;
  animation:slideUp 0.3s ease}
@keyframes slideUp{from{transform:translateX(-50%) translateY(100%)}to{transform:translateX(-50%) translateY(0)}}
.share-sheet-handle{width:36px;height:4px;background:rgba(255,255,255,0.15);border-radius:2px;margin:0 auto 20px}
.share-sheet-title{font-family:'Noto Sans KR',sans-serif;font-size:15px;color:var(--text-dim);
  text-align:center;margin-bottom:20px;font-weight:400}
.share-kakao-btn{width:100%;background:#FEE500;color:#191600;border:none;
  font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:400;
  padding:14px 0;border-radius:12px;cursor:pointer;margin-bottom:10px;
  display:flex;align-items:center;justify-content:center;gap:8px;transition:all 0.2s}
.share-kakao-btn:hover{background:#f5dc00}
.share-kakao-btn:active{transform:scale(0.98)}
.share-image-btn{width:100%;background:rgba(90,70,30,0.18);border:1px solid rgba(139,125,60,0.3);
  color:var(--gold-dim);font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:300;
  padding:14px 0;border-radius:12px;cursor:pointer;margin-bottom:10px;transition:all 0.2s}
.share-image-btn:hover{background:rgba(90,70,30,0.28);color:var(--gold)}
.share-link-btn{width:100%;background:transparent;border:1px solid rgba(139,125,60,0.25);
  color:var(--text-dim);font-family:'Noto Sans KR',sans-serif;font-size:14px;font-weight:300;
  padding:14px 0;border-radius:12px;cursor:pointer;margin-bottom:10px;transition:all 0.2s}
.share-link-btn:hover{border-color:var(--gold-dim);color:var(--gold)}
.share-close-btn{width:100%;background:transparent;border:none;color:var(--system);
  font-family:'Noto Sans KR',sans-serif;font-size:13px;padding:10px 0;cursor:pointer}

/* ── Reveal 카드 ───────────────────────────── */
.reveal-cards-wrap{width:100%;overflow-x:auto;padding:16px 0 8px;
  -ms-overflow-style:none;scrollbar-width:none}
.reveal-cards-wrap::-webkit-scrollbar{display:none}
.reveal-cards-inner{display:flex;gap:12px;padding:0 16px;width:max-content}
.reveal-card{width:240px;min-height:120px;background:rgba(30,25,15,0.85);
  border:1px solid rgba(139,125,60,0.25);border-radius:12px;
  padding:20px 16px;display:flex;flex-direction:column;justify-content:space-between;
  opacity:0;transform:translateY(8px);transition:opacity 0.4s ease,transform 0.4s ease;
  flex-shrink:0}
.reveal-card.visible{opacity:1;transform:translateY(0)}
.reveal-card p{font-family:'Noto Serif KR',serif;font-size:15px;color:var(--mudang);
  line-height:1.7;word-break:keep-all}
.reveal-card-share{background:transparent;border:none;color:var(--gold-dim);
  font-family:'Noto Sans KR',sans-serif;font-size:11px;cursor:pointer;
  padding:4px 0 0;text-align:right;align-self:flex-end;transition:color 0.2s}
.reveal-card-share:hover{color:var(--gold)}