@import url('https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@700&family=Gowun+Dodum&family=Nanum+Myeongjo:wght@800&display=swap');
@font-face { font-family: 'MaruBuri'; font-weight: 700; font-display: swap; src: url('https://hangeul.pstatic.net/hangeul_static/webfont/MaruBuri/MaruBuri-Bold.woff2') format('woff2'); }
/* 모던 액자 시험: 한지 배경·수묵 산수를 걷고 단색 바탕, 헤더와 탭바는 차콜 계열, 카드만 일러스트로 남긴다. 이 파일을 빼면 원래대로 돌아간다. */
:root { --paper: #faf8f5; --mf-ink: #222; --mf-mute: #8d8a85; --mf-line: #ece8e1; }
html, body { background: #faf8f5; }
body::before { background-image: none; background: #faf8f5; }

/* 상단 헤더: 베이지 띠를 없애고 바탕과 한 덩어리로 */
.site-header { background: #faf8f5; border-bottom: 0; box-shadow: 0 8px 8px -6px rgba(60, 40, 30, .12); -webkit-backdrop-filter: none; backdrop-filter: none; }

/* 하단 탭바: 차콜과 쿨 그레이. 탭바 안의 색 변수만 바꿔서 활성 글자·아이콘 바탕이 따라오게 한다. */
.home-tabbar { --ui-action: #222; --ui-muted: #8d8a85; --ui-soft: #f1efeb; background: #fff !important; border-top: 1px solid var(--mf-line) !important; box-shadow: 0 -4px 20px rgba(0, 0, 0, .04) !important; }
.home-tab.is-current { color: var(--mf-ink); }

/* 메인 카드: 액자처럼 은은한 그림자와 가는 테두리 */
#home-screen .landing-main-card { box-shadow: 0 12px 32px rgba(0, 0, 0, .08), 0 0 0 1px rgba(0, 0, 0, .06); }

/* 부제목: 따옴표를 걷고 자간을 모아 산세리프로 */
#home-screen .landing-card-story small { font-weight: 600; letter-spacing: -.03em; }
#home-screen .landing-card-story i { background: #fff; opacity: .75; }

/* 카드 제목: 상품마다 다른 명조. 못 불러오면 Noto Serif KR 로 물러난다 */
#home-screen .landing-card-story em { color: transparent; background: linear-gradient(180deg, #ffffff 0%, #ffffff 56%, #f1dcd5 76%, #8f5344 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-stroke: 0; text-shadow: none; filter: drop-shadow(0 1px 0 rgba(58, 22, 36, .75)) drop-shadow(0 2px 5px rgba(58, 22, 36, .65)) drop-shadow(0 5px 16px rgba(58, 22, 36, .5)); }

/* ── 다크 변형 ── 기본은 깊은 밤하늘색(남색 #181A20). ?mf=ink 는 먹색(#1C1B1A), ?mf=light 는 밝은 쪽. 고른 값은 브라우저가 기억한다. */
html[data-mf="dark"] { --mf-bg: #181a20; --mf-bar: #1e2128; --mf-surface: #1f222a; --mf-soft: #272b34; --mf-line: #2f333d; --mf-line2: #454b57; --mf-mute: #8b909c; --mf-text: #eceef2; }
html[data-mf="ink"] { --mf-bg: #1c1b1a; --mf-bar: #242321; --mf-surface: #232220; --mf-soft: #2b2a28; --mf-line: #34322f; --mf-line2: #4a4743; --mf-mute: #8d8a85; --mf-text: #f2f0ec; }
html:is([data-mf="dark"], [data-mf="ink"]) { color-scheme: dark; --paper: var(--mf-bg); --ink: var(--mf-text); --muted: var(--mf-mute); --line: var(--mf-line); --card: var(--mf-surface); --mf-ink: var(--mf-text);
  --ui-ink: var(--mf-text); --ui-muted: var(--mf-mute); --ui-line: var(--mf-line); --ui-surface: var(--mf-surface); --ui-soft: var(--mf-soft); --ui-gold: #d6b97c; }
html:is([data-mf="dark"], [data-mf="ink"]), html:is([data-mf="dark"], [data-mf="ink"]) body { background: var(--mf-bg); color: var(--mf-text); }
html:is([data-mf="dark"], [data-mf="ink"]) body::before { background: var(--mf-bg); }
html:is([data-mf="dark"], [data-mf="ink"]) .site-header { background: var(--mf-bg); color: var(--mf-text); }
html:is([data-mf="dark"], [data-mf="ink"]) .site-header * { color: inherit; }
html:is([data-mf="dark"], [data-mf="ink"]) .site-menu-button span { background: var(--mf-text); box-shadow: none; }
html:is([data-mf="dark"], [data-mf="ink"]) .home-tabbar { --ui-action: var(--mf-text); --ui-muted: var(--mf-mute); --ui-soft: var(--mf-line); background: var(--mf-bar) !important; border-top: 1px solid var(--mf-line) !important; box-shadow: 0 -4px 20px rgba(0, 0, 0, .4) !important; }
html:is([data-mf="dark"], [data-mf="ink"]) .home-tab.is-current { color: var(--mf-text); }
html:is([data-mf="dark"], [data-mf="ink"]) #home-screen .landing-main-card { box-shadow: 0 12px 32px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .08); }
html:is([data-mf="dark"], [data-mf="ink"]) #home-screen .landing-card-prev, html:is([data-mf="dark"], [data-mf="ink"]) #home-screen .landing-card-next { background: var(--mf-surface); color: var(--mf-text); border-color: var(--mf-line); }
html:is([data-mf="dark"], [data-mf="ink"]) .today-panel { background: var(--mf-surface); border-color: var(--mf-line); color: var(--mf-text); }
html:is([data-mf="dark"], [data-mf="ink"]) .today-symbol { background: var(--mf-soft) !important; border-color: var(--mf-line2) !important; color: var(--mf-text) !important; box-shadow: none !important; }
html:is([data-mf="dark"], [data-mf="ink"]) .today-symbol * { color: var(--mf-text); }
html:is([data-mf="dark"], [data-mf="ink"]) #home-screen .landing-card-dots button::after { background: var(--mf-line2); }
html:is([data-mf="dark"], [data-mf="ink"]) #home-screen .landing-card-dots button[aria-pressed="true"]::after { background: var(--mf-text); }

/* 카드 좌우 화살표: 동그라미 테두리·바탕을 없애고 화살표만 */
#home-screen .landing-card-prev, #home-screen .landing-card-next { border: 0; background: transparent; box-shadow: none; color: var(--mf-ink); }
/* 좌우 화살표는 화면에서 걷는다(옆으로 밀어서 넘기고 점으로도 고른다). 버튼은 문서에 남는다. */
#home-screen .landing-card-prev, #home-screen .landing-card-next { display: none; }
#home-screen .landing-main-card[aria-label^="정통"] .landing-card-story em { font-family: 'MaruBuri', 'Noto Serif KR', serif; font-weight: 700; letter-spacing: 0; }
#home-screen .landing-main-card[aria-label*="신년"] .landing-card-story em { font-family: 'Gowun Batang', 'Noto Serif KR', serif; font-weight: 700; letter-spacing: 0; }
#home-screen .landing-main-card[aria-label^="핵심"] .landing-card-story em { font-family: 'Nanum Myeongjo', 'Noto Serif KR', serif; font-weight: 800; letter-spacing: 0; }
/* 세 카드 모두 정통사주 카드와 같은 글자색(흰색 부제목). 글자는 원래 자리(위쪽)에 두고 위쪽에 어둡힘을 깐다 */
#home-screen .landing-card-story i { display: none; }
#home-screen .landing-card-story small { font-family: 'Gowun Batang', 'Noto Serif KR', serif; font-weight: 700; letter-spacing: -.01em; margin-top: 2.5cqw; color: transparent; background: linear-gradient(180deg, #ffffff 0%, #ffffff 55%, #fbe6ea 100%); -webkit-background-clip: text; background-clip: text; text-shadow: none; filter: drop-shadow(0 1px 0 rgba(10, 8, 18, .85)) drop-shadow(0 1px 4px rgba(10, 8, 18, .8)) drop-shadow(0 3px 12px rgba(10, 8, 18, .7)); }

#home-screen .landing-main-card::after { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 56%; z-index: 0; pointer-events: none; background: linear-gradient(180deg, rgba(10, 8, 14, .62) 0%, rgba(10, 8, 14, .42) 55%, rgba(10, 8, 14, 0) 100%); }

/* TOP 리본: 작게, 분홍으로 */
#home-screen .landing-card-rank { right: 14px; width: 27px; padding: 5px 0 9px; background: #b8365a; }
#home-screen .landing-card-rank small { font-size: 7.5px; }
#home-screen .landing-card-rank b { font-size: 16px; }
#home-screen .landing-card-grid .landing-card-rank { right: 6px; width: 21px; padding: 3px 0 6px; }
#home-screen .landing-card-grid .landing-card-rank small { font-size: 6px; }
#home-screen .landing-card-grid .landing-card-rank b { font-size: 12px; }

/* 헤더와 영상 카드 사이 간격 줄이기: main.shell 위 여백 8px + 캐러셀 위 여백 2px = 10px (원래 28px) */
#home-screen .landing-carousel { margin-top: 12px; }

/* ── 랜딩(홈) 위젯 카드 통일 ──
   바깥 카드: 흰 바탕 + 1px 연한 테두리 + 둥근 모서리 20px + 아주 옅은 그림자. 그라데이션·질감은 걷는다.
   안쪽 블록: 웜 화이트 바탕 + 같은 테두리 + 14px, 그림자 없음. 버튼: 모서리 14px 로 맞춘다. */
:root { --mf-card: #fff; --mf-card-in: #faf8f5; --mf-card-line: #ece8e1; --mf-card-radius: 20px; --mf-card-shadow: 0 8px 24px rgba(60, 40, 30, .06); }
#home-screen :is(.today-panel, .home-consult, .home-pond, .sal-test-banner, .review-card, .engine-proof, .engine-story, .chat-care) {
  background: var(--mf-card) !important; background-image: none !important; border: 1px solid var(--mf-card-line) !important; border-radius: var(--mf-card-radius) !important; box-shadow: var(--mf-card-shadow) !important; }
#home-screen .home-pond::before { display: none; }
#home-screen :is(.pond-quest-visual, .pond-recent-ticker, .engine-proof-stats, .engine-proof-specs, .chat-care-quote) {
  background: var(--mf-card-in) !important; background-image: none !important; border: 1px solid var(--mf-card-line) !important; border-radius: 14px !important; box-shadow: none !important; }
#home-screen :is(.asset-action, .promo-cta-button) { border-radius: 14px; }

/* ── 로딩 화면: 한지 배경 그림 삭제, 단색 ── */
#page-loader, .calc-overlay { background: #faf8f5 !important; }

/* ── 랜딩(홈)의 모든 글자는 프리텐다드 ── 명조(Noto Serif KR·마루부리·고운바탕·나눔명조)로 지정된 제목까지 한꺼번에 덮는다. */
#home-screen, #home-screen *, #home-screen *::before, #home-screen *::after { font-family: 'Pretendard Variable', Pretendard, system-ui, 'Apple SD Gothic Neo', sans-serif !important; }
/* 단, 상품 카드(정통·신년·핵심) 안의 글씨는 앞서 고른 폰트 그대로 둔다. */
#home-screen .landing-main-card[aria-label^="정통"] .landing-card-story em { font-family: 'MaruBuri', 'Noto Serif KR', serif !important; font-weight: 700; letter-spacing: 0; }
#home-screen .landing-main-card[aria-label*="신년"] .landing-card-story em { font-family: 'Gowun Batang', 'Noto Serif KR', serif !important; font-weight: 700; letter-spacing: 0; }
#home-screen .landing-main-card[aria-label^="핵심"] .landing-card-story em { font-family: 'Nanum Myeongjo', 'Noto Serif KR', serif !important; font-weight: 800; letter-spacing: 0; }
#home-screen .landing-main-card .landing-card-story small { font-family: 'Gowun Batang', 'Noto Serif KR', serif !important; font-weight: 700; letter-spacing: -.01em; }

/* 영상 카드(점 표시 포함)와 오늘의 일진 위젯 사이 간격 좁히기: 90px → 약 32px */
#home-screen .landing-carousel-controls { padding: 2px 0 0; }
#home-screen .landing-card-dots button { height: 24px; }
#home-screen .landing-card-dots button::after { top: 9px; }
#home-screen #today-panel:not([hidden]) { margin-top: 16px; }

/* ── 랜딩 포인트 색: 딥 로즈 #B8365A (흰 글씨 대비 5.7). 버튼·태그·링크가 var(--ui-action) 을 쓰는 곳도 따라오게 한다. ── */
#home-screen { --ui-action: #b8365a; --ui-action-hover: #9e2c4d; }

/* 랜딩 버튼 제거: 달빛 연못 찾아가기 / 테스트 시작하기 / 무료로 내 운명 확인하기 (카드 전체 링크는 그대로 눌린다) */
#home-screen .pond-quest .asset-action, #home-screen .sal-test-banner b[aria-hidden="true"], #home-screen .promo-cta { display: none !important; }

/* 히어로(영상 카드) 높이 20% 낮추기: 가로세로비 1 : 1.22 → 1 : 0.976 */
#home-screen .landing-deck { aspect-ratio: 1 / 0.976; }

/* 헤더 아래 바로가기: 정통사주 / 신년운세 / 평생사주 / 사주상담. 스크롤해도 헤더 밑에 붙어 있다. */
#home-screen .home-subnav { position: sticky; top: var(--site-header-height, 64px); z-index: 20; display: grid; grid-template-columns: repeat(4, 1fr); margin: -8px calc(-1 * var(--app-gutter, 20px)) 0; padding: 0 var(--app-gutter, 20px); background: #faf8f5; border-bottom: 1px solid var(--mf-line, #ece8e1); }
#home-screen .home-subnav a { display: block; padding: 11px 0 10px; text-align: center; color: #3b3a38; font-size: 14px; font-weight: 700; letter-spacing: -.02em; text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; line-height: 1.2; }
#home-screen .home-subnav a:active, #home-screen .home-subnav a:focus-visible { color: #b8365a; border-bottom-color: #b8365a; outline: none; }
@media (hover: hover) { #home-screen .home-subnav a:hover { color: #b8365a; } }

/* 홈에서는 헤더 그림자를 바로가기 줄 아래로 옮긴다 */
body:has(#home-screen.active) .site-header { box-shadow: none; }
#home-screen .home-subnav { border-bottom: 0; box-shadow: 0 8px 8px -6px rgba(60, 40, 30, .12); }
#home-screen .home-subnav a { margin-bottom: 0; }

/* 월화담 상담소 위젯 (히어로 아래) */
#home-screen .home-consult { position: relative; display: grid; grid-template-columns: 48px 1fr; gap: 4px 14px; align-items: center; margin: 14px 0 0; padding: 14px 64px 0 14px; overflow: hidden; }
#home-screen .home-consult-face { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; border: 1px solid var(--mf-card-line); background: #fbf6ea; }
#home-screen .home-consult-kicker { margin: 0; color: #b8365a; font-size: 12px; font-weight: 700; letter-spacing: -.01em; }
#home-screen .home-consult-title { margin: 0; color: #222; font-size: 16px; font-weight: 800; letter-spacing: -.03em; line-height: 1.3; }
#home-screen .home-consult-lead { margin: 2px 0 0; color: #6d6a65; font-size: 13px; line-height: 1.5; word-break: keep-all; }
#home-screen .home-consult-go { position: absolute; top: 20px; right: 14px; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border-radius: 50%; background: #b8365a; color: #fff; text-decoration: none; }
#home-screen .home-consult-go:active { background: #9e2c4d; }

/* 헤더에서 돌아가는 공지(뉴스 티커) 제거. 공지는 스피커 버튼으로 그대로 볼 수 있다. */
.site-header .home-notice-roll { display: none !important; }
.site-header .site-logo { margin-right: auto; }
@media (max-width: 380px) {
  #home-screen .home-consult { grid-template-columns: 44px 1fr; gap: 4px 12px; padding: 14px 58px 14px 14px; }
  #home-screen .home-consult-face { width: 44px; height: 44px; }
  #home-screen .home-consult-title { font-size: 15px; }
  #home-screen .home-consult-go { top: 19px; right: 12px; width: 34px; height: 34px; }
}
#home-screen .home-consult-price { grid-column: 1 / -1; margin: 10px -64px 0 -14px; padding: 9px 14px; background: #fbeef1; border-top: 1px solid #f3d9e0; display: flex; justify-content: space-around; gap: 8px; color: #b8365a; font-size: 12.5px; font-weight: 700; letter-spacing: -.01em; }
#home-screen .home-consult-price span { flex: 1; text-align: center; }
#home-screen .home-consult-price span + span { border-left: 1px solid #f0c9d4; }
@media (max-width: 380px) { #home-screen .home-consult { padding: 14px 58px 0 14px; } #home-screen .home-consult-price { margin: 10px -58px 0 -14px; } }
/* 상담소 위젯과 아래 카드 목록 사이 간격 */
#home-screen .home-consult { margin-bottom: 18px; }

/* 후기: 가로로 흐르던 띠 대신 세로 카드 3개 */
#home-screen .review-list { overflow: visible; -webkit-mask-image: none; mask-image: none; padding: 0; margin-top: 16px; }
#home-screen .review-track { display: grid; width: auto; gap: 12px; animation: none !important; transform: none !important; }
#home-screen .review-track > .review-card { flex: none; width: auto; }
#home-screen .review-track > .review-card:nth-child(n+4) { display: none; }
/* 후기 제목 줄(평점·별)이 오른쪽 끝에 닿지 않게 안쪽으로 */
#home-screen .review-heading { padding-right: 14px; }

/* 하단 카드 목록: 이름과 설명을 이미지 안쪽 아래로 넣고 흰 글씨로 */
#home-screen .landing-card-grid button { position: relative; }
#home-screen .landing-card-grid button::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 58%; border-radius: 0 0 14px 14px; pointer-events: none; background: linear-gradient(180deg, rgba(10, 8, 14, 0) 0%, rgba(10, 8, 14, .72) 100%); }
#home-screen .landing-card-grid .landing-grid-name, #home-screen .landing-card-grid .landing-grid-desc { position: absolute; left: 8px; right: 8px; z-index: 2; color: #fff; text-shadow: 0 1px 6px rgba(8, 6, 12, .7); }
#home-screen .landing-card-grid .landing-grid-desc { bottom: 9px; margin: 0; font-size: 10.5px; font-weight: 600; line-height: 1.4; opacity: 1; }
#home-screen .landing-card-grid .landing-grid-name { bottom: 60px; margin: 0; font-size: 14px; font-weight: 800; letter-spacing: -.02em; }

/* 후기 제목 위의 작은 "후기" 글씨 삭제 */
#home-screen .review-heading .section-kicker { display: none; }

/* 달빛 연못 ~ 후기 사이 글씨 크기 줄이기 (연못 · 오늘의 일진 · 살 테스트) */
#home-screen .home-pond h2 { font-size: 17px; }
#home-screen .home-pond .pond-quest-count { font-size: 10.5px; }
#home-screen .home-pond :is(.pond-quest-intro, .pond-quest-reward) { font-size: 12px; line-height: 1.55; }
#home-screen .home-pond .pond-quest-visual small { font-size: 9px; }
#home-screen .home-pond h3 { font-size: 12.5px; }
#home-screen .home-pond :is(.pond-recent-ticker-text, .pond-recent-ticker-reply, .pond-recent-ticker-reply strong) { font-size: 12px; line-height: 1.5; }
#home-screen .home-pond :is(time, .pond-recent-ticker span) { font-size: 9px; }
#home-screen .home-pond a:not(.asset-action) { font-size: 10px; }
#home-screen #today-panel .today-say { font-size: 13px; line-height: 1.5; }
#home-screen #today-panel .today-meta span { font-size: 9px; }
#home-screen #today-panel #today-tip-open { font-size: 10.5px; }
#home-screen .sal-test-banner small { font-size: 9.5px; }
#home-screen .sal-test-banner strong { font-size: 16px; line-height: 1.35; }
#home-screen .sal-test-banner em { font-size: 12px; }

/* 프로모션 네 카드 글씨 줄이기: 밤마다 혼자 삼키던 고민 · 세 가지 원칙 · 정밀한 계산 · 풀이로 다 담지 못한 속마음 */
#home-screen .engine-proof h3 { font-size: 22px; line-height: 1.3; }
#home-screen .engine-proof :is(.engine-proof-kicker, .engine-proof-hero span) { font-size: 11px; }
#home-screen .engine-proof :is(p, li) { font-size: 12px; line-height: 1.55; }
#home-screen .engine-proof .engine-proof-stats strong, #home-screen .engine-proof-stats strong { font-size: 15px; }
#home-screen .engine-proof-stats span { font-size: 10px; }
#home-screen .engine-proof :is(li strong, .engine-proof-list strong) { font-size: 14px; }
#home-screen .engine-proof-index { font-size: 10px; }
#home-screen .engine-proof :is(.engine-proof-specs li, .engine-proof-specs p) { font-size: 10.5px; }

#home-screen .reading-principles-kicker { font-size: 10px; }
#home-screen .reading-principles h3 { font-size: 19px; line-height: 1.35; }
#home-screen .reading-principles-lead { font-size: 12px; line-height: 1.55; }
#home-screen .reading-principles strong { font-size: 14.5px; }
#home-screen .reading-principles li p, #home-screen .reading-principles p:not(.reading-principles-kicker):not(.reading-principles-lead) { font-size: 12px; line-height: 1.6; }
#home-screen .reading-principles b { font-size: 14.5px; }
#home-screen .reading-principles span { font-size: 11px; }

#home-screen .engine-story h3 { font-size: 19px; line-height: 1.35; }
#home-screen .engine-story :is(p) { font-size: 12px; line-height: 1.6; }
#home-screen .engine-story strong { font-size: 13.5px; }
#home-screen .engine-story > p:first-of-type, #home-screen .engine-story-kicker { font-size: 10.5px; }

#home-screen .chat-care h3 { font-size: 19px; line-height: 1.35; }
#home-screen .chat-care :is(p) { font-size: 12px; line-height: 1.6; }
#home-screen .chat-care strong { font-size: 13.5px; }
#home-screen .chat-care span { font-size: 10.5px; }

/* 후기: 제목 더 작게, 위(살 테스트 카드)와 간격을 다른 카드 사이(24px)와 같게 */
#home-screen .review-section { margin-top: 0; }
#home-screen .review-heading h3 { font-size: 15px; }
#home-screen .review-summary b { font-size: 15px; }
#home-screen .review-summary .review-stars { font-size: 11px; }
#home-screen .review-list { margin-top: 10px; }

/* ── 달빛 연못 이하 위젯의 작은 글씨를 상담소 설명(13px)에 맞춘다 ──
   설명·본문류는 13px, 날짜·단계 같은 아주 작은 라벨은 11px 이상으로 */
#home-screen :is(.home-pond, #today-panel, .sal-test-banner, .engine-proof, .reading-principles, .engine-story, .chat-care, .review-card) { --mf-body: 13px; --mf-label: 11px; }
#home-screen .home-pond :is(.pond-quest-intro, .pond-quest-reward, .pond-recent-ticker-text, .pond-recent-ticker-reply, .pond-recent-ticker-reply strong, h3) { font-size: 13px; }
#home-screen .home-pond :is(.pond-quest-count, .pond-quest-visual small, time, .pond-recent-ticker span, a:not(.asset-action)) { font-size: 11px; }
#home-screen #today-panel .today-say { font-size: 13px; }
#home-screen #today-panel :is(.today-meta span, #today-tip-open, .today-symbol small) { font-size: 11px; }
#home-screen .sal-test-banner :is(em, small) { font-size: 13px; }
#home-screen .sal-test-banner small { font-size: 11px; }
#home-screen .engine-proof :is(p, li), #home-screen .reading-principles :is(p, li span), #home-screen .engine-story p, #home-screen .chat-care p { font-size: 13px; }
#home-screen .engine-proof-kicker, #home-screen .reading-principles-kicker, #home-screen .engine-proof-hero span, #home-screen .engine-proof-stats span, #home-screen .engine-proof-specs p, #home-screen .engine-proof-specs li, #home-screen .chat-care span, #home-screen .engine-story > p:first-of-type { font-size: 11px; }
#home-screen .review-card :is(.review-body) { font-size: 13px; }
#home-screen .review-card :is(time, .review-foot) { font-size: 11px; }

/* 숨김: "월화담을 만든 마음"(세 가지 원칙) / "사이다 같은 팩폭 뒤에 숨겨진 이야기"(정밀한 계산을 고집하는 진짜 이유) */
#home-screen .reading-principles, #home-screen .engine-story { display: none !important; }

/* 홈 하단 여백 줄이기: 위젯과 푸터 사이(186px → 약 50px), 푸터 아래(탭바에 가리지 않을 만큼만) */
body:has(#home-screen.active) main.shell { padding-bottom: 8px; }
body:has(#home-screen.active) .site-footer { margin-top: 26px; padding-bottom: calc(var(--home-tabbar-height, calc(81px + env(safe-area-inset-bottom, 0px))) + 10px); }

/* "월화담 정밀 분석 기준" 박스(분석 기준 칩 모음) 삭제 */
#home-screen .engine-proof-specs { display: none !important; }

/* 이미지 위의 "直說 · 솔직한 풀이" 동그라미(도장) 삭제 */
#home-screen .engine-proof-seal { display: none !important; }

/* 속마음 카드 이미지 위 말풍선("글로는 다 풀지 못한 속이야기…") 삭제 */
#home-screen .chat-care-opening p { display: none !important; }
/* 속마음 카드 이미지: 주월이 작게 나오는 노을 장면. 말풍선이 없으니 오른쪽 어둡힘도 걷는다. */
#home-screen .chat-care-opening::after { display: none; }
#home-screen .chat-care-opening img { object-position: 50% 100%; }

/* 월화담 상담소 위젯: 분홍 테두리 */
#home-screen .home-consult { border: 1.5px solid #d4829a !important; }

/* ── 만세력 / 소원빌기 / 채팅 / 보관함 : 홈과 같은 기준(흰 카드, 얇은 테두리, 딥 로즈 포인트)으로 ── */
:is(#zodiac-today-screen, #wishes-screen, #chat-list-screen, #archive-screen) { --ui-action: #b8365a; --ui-action-hover: #9e2c4d; --ui-soft: #f4f1ec; }

/* 카드 */
:is(#zodiac-today-screen, #wishes-screen, #chat-list-screen, #archive-screen) :is(.ms-account, .ms-form, #wishes-pond, .pond-wish-hint, .chat-room, .self-card, .archive-empty, .asset-card) {
  background: #fff !important; background-image: none !important; border: 1px solid var(--mf-card-line, #ece8e1) !important; border-radius: 20px !important; box-shadow: 0 8px 24px rgba(60, 40, 30, .06) !important; }
:is(#zodiac-today-screen, #wishes-screen, #chat-list-screen, #archive-screen) :is(.pond-quest-visual, .wishes-main-tabs, .ms-account select, .ms-form :is(input, select)) {
  background: #faf8f5 !important; background-image: none !important; border-color: var(--mf-card-line, #ece8e1) !important; }
#wishes-screen .pond-quest-visual, #wishes-screen .wishes-main-tabs { border: 1px solid var(--mf-card-line, #ece8e1) !important; border-radius: 14px !important; }
#wishes-pond::before { display: none; }
#chat-list-screen .chat-room-juwol-human { background: #faf8f5 !important; box-shadow: none !important; opacity: .85; }

/* 버튼·선택 상태: 갈색 → 딥 로즈. 선택된 것만 분홍, 선택 안 된 것은 흰 바탕에 얇은 테두리 */
#zodiac-today-screen .ms-pill { background: #fff !important; border: 1px solid var(--mf-card-line, #ece8e1) !important; color: #55524d !important; border-radius: 14px !important; }
#zodiac-today-screen .ms-pill[aria-pressed="true"] { background: #b8365a !important; border-color: #b8365a !important; color: #fff !important; }
:is(#zodiac-today-screen, #archive-screen) :is(.ms-submit, .self-open, .ui-button--primary) { background: #b8365a !important; border-color: #b8365a !important; color: #fff !important; border-radius: 14px !important; }
#wishes-screen .asset-action { background: #b8365a !important; border-color: #b8365a !important; border-radius: 14px !important; }
:is(#wishes-screen, #archive-screen) [role="tab"][aria-selected="true"] { background: #fff !important; color: #b8365a !important; box-shadow: 0 2px 8px rgba(60, 40, 30, .08) !important; }
:is(#wishes-screen, #archive-screen) [role="tab"][aria-selected="false"] { background: transparent !important; color: #77736d !important; }
/* 홈 상품 카드(정통·신년·핵심) 제목·부제목은 앞서 고른 폰트를 지켜야 하므로 전역 프리텐다드보다 앞에 오도록 한 번 더 선언 */
body #home-screen .landing-main-card[aria-label^="정통"] .landing-card-story em { font-family: 'MaruBuri', 'Noto Serif KR', serif !important; }
body #home-screen .landing-main-card[aria-label*="신년"] .landing-card-story em { font-family: 'Gowun Batang', 'Noto Serif KR', serif !important; }
body #home-screen .landing-main-card[aria-label^="핵심"] .landing-card-story em { font-family: 'Nanum Myeongjo', 'Noto Serif KR', serif !important; }
body #home-screen .landing-main-card .landing-card-story small { font-family: 'Gowun Batang', 'Noto Serif KR', serif !important; }

/* 소원빌기의 "카카오로 로그인" 버튼: 카카오 노란색 */
#wishes-screen a.asset-action[href*="/api/auth/kakao"] { background: #fee500 !important; border-color: #fee500 !important; color: #191919 !important; font-weight: 800 !important; }
#wishes-screen a.asset-action[href*="/api/auth/kakao"]:active { background: #f0d800 !important; }

/* ── 소원 둘러보기 / 만세력 로그인 위젯 / 채팅 띠 / 보관함 빈 화면 보정 ── */
/* 소원 둘러보기: 소원 카드를 흰 카드로, 안쪽 구획은 웜 화이트 */
#wishes-screen .wish-history-card { background: #fff !important; background-image: none !important; border: 1px solid var(--mf-card-line, #ece8e1) !important; border-radius: 20px !important; box-shadow: 0 8px 24px rgba(60, 40, 30, .06) !important; }
#wishes-screen .wish-history-card :is([class*="reply"], [class*="answer"], [class*="body"], blockquote) { background-color: transparent !important; }
#wishes-screen :is(.wishes-tabs, .wishes-main-tabs) { background: #f4f1ec !important; border: 1px solid var(--mf-card-line, #ece8e1) !important; }
#wishes-screen .wish-history-card :is(.wish-history-badge, [class*="example"], [class*="badge"], time + span) { background: #f4f1ec !important; color: #77736d !important; border-color: transparent !important; }
#wishes-screen .wish-history-card [class*="kicker"], #wishes-screen .wish-history-card [class*="label"] { color: #b8365a !important; }

/* 만세력: 비로그인 안내 위젯이 위 카드와 붙지 않게, 분홍 테두리 카드로 */
#zodiac-today-screen .ms-guest-notice { margin-top: 16px !important; background: #fbeef1 !important; border: 1px solid #f0c9d4 !important; border-radius: 16px !important; color: #b8365a !important; }
#zodiac-today-screen .ms-guest-notice * { color: inherit !important; }

/* 채팅: "오늘의 공양 하시고 10엽전 받아오세요!" 노란 띠 → 분홍 띠 */
#chat-list-screen .chat-list-offering { background: #fbeef1 !important; border: 1px solid #f0c9d4 !important; color: #b8365a !important; border-radius: 14px !important; }
#chat-list-screen .chat-list-offering * { color: inherit !important; }

/* 보관함 빈 화면: 위쪽 한자 月 아이콘 삭제 */
#archive-screen .archive-empty-mark { display: none !important; }

/* 같은 금갈색을 직접 값으로 쓰는 곳도 딥 로즈로 */
:is(#wishes-screen, #chat-list-screen, #archive-screen, #zodiac-today-screen, #home-screen) :is(h3, small, .ui-page-kicker, .chat-room-arrow, .section-kicker) { }
#wishes-screen .wish-history-card h3, #home-screen .sal-test-banner small, .ui-page-kicker, .chat-room-arrow { color: #b8365a !important; }

/* "10월 엽전 50% 할인 이벤트 중!" 배너: 노란색 → 분홍 */
.chat-room-copy > .chat-room-discount-banner { background: #fbeef1 !important; border-color: #f0c9d4 !important; color: #b8365a !important; }
#chat-list-screen .chat-room-juwol-human small { color: #b8365a !important; }

/* 채팅방(말풍선 보기) 배경: 아주 은은한 핑크. 다크 소설형(view-novel)은 그대로 */
body #chat-screen:not(.view-novel) { background: #fdf6f7 !important; }
body #chat-screen:not(.view-novel) .chat-form { background: #fdf6f7 !important; }
body #chat-screen:not(.view-novel) .chat-topbar { background: rgba(255, 251, 252, .98) !important; border-bottom-color: #f3e4e8 !important; }

/* 입력 화면 상단 소개의 "내 정보 입력하고 무료로 보기 ↓" 버튼 삭제 */
#input-pitch-cta { display: none !important; }

/* 만세력 양력/음력/몰라요: 안쪽 버튼 둥글기를 바깥 틀(9px, 안쪽 여백 2px)에 맞춰 7px 로 */
#zodiac-today-screen .ms-pills .ms-pill { border-radius: 7px !important; }

/* 입력 화면 선택 버튼(여성/남성, 양력/음력, 윤달): 선택·포커스 색을 딥 로즈로 */
#input-screen :is(.gender-choice, .calendar-choice, .leap-month-choice) > label:has(input:checked) { background: #b8365a !important; border-color: #b8365a !important; color: #fff !important; box-shadow: 0 5px 12px rgba(184, 54, 90, .22) !important; }
#input-screen :is(.gender-choice, .calendar-choice, .leap-month-choice) > label:has(input:focus-visible) { outline: 2px solid rgba(184, 54, 90, .45) !important; outline-offset: 2px; }
#input-screen :is(.gender-choice, .calendar-choice, .leap-month-choice) > label:hover { border-color: #d4829a !important; }
#input-screen :is(.gender-choice, .calendar-choice, .leap-month-choice) > label:has(input:checked):hover { border-color: #b8365a !important; }
#input-screen :is(input[type="text"], input[type="number"], input[type="tel"], input:not([type]), select, textarea):focus { border-color: #b8365a !important; box-shadow: 0 0 0 3px rgba(184, 54, 90, .14) !important; }

/* 입력 화면 소개 배지 "무료 태어난 정보를 넣고, 가장 궁금한 고민을 골라 주세요" 삭제 */
.input-pitch-badge { display: none !important; }

/* 입력 대화(신년·핵심·정통 등 "주월과 대화하며 입력") : 본채 채팅과 같은 핑크 배경·헤더 */
body #conv-input { background: #fdf6f7 !important; }
body #conv-input .conv-head { background: rgba(255, 251, 252, .98) !important; border-bottom: 1px solid #f3e4e8 !important; }
body #conv-input .conv-answer { background: #fdf6f7 !important; border-top: 1px solid #f3e4e8 !important; }

/* 입력 화면(정통사주 등) 맨 위 뒤로가기 화살표: 위로 붙지 않게 내린다 (위 6px → 약 24px) */
@media (max-width: 430px) { #input-screen > .screen-topbar { margin-top: 6px; } }

/* ══ 무료 결과 페이지(정통·핵심·신년): 누런 베이지·금갈색을 홈과 같은 톤으로 ══
   바깥 카드 = 흰 바탕·#ECE8E1 테두리·옅은 그림자 / 안쪽 구획 = 웜 화이트 / 포인트 = 딥 로즈 / 보조 글씨 = 회색
   본캐 판정서 카드(.bc-card)와 웹툰 컷은 그림 자체의 색이라 건드리지 않는다. */
body #chart-screen {
  --ui-action: #b8365a; --ui-action-hover: #9e2c4d; --ui-gold: #b8365a; --ui-soft: #f4f1ec; --ui-line: #ece8e1; --ui-surface: #fff; --ui-muted: #6d6a65;
}
/* 바깥 카드 */
body #chart-screen :is(.rt-card, .rt-fold, .rt-golden, .rt-attach, .rt-lock, .rt-ask, .rt-chapter, .rt-chapter-card, .ov-section.ov-sales, .ov-card-feature, .ov-chat-sub-hook, .engine-proof, .chat-care, .rt-quip-text, .ov-ny-score, .pg-listcard) {
  background: #fff !important; background-image: none !important; border-color: #ece8e1 !important; box-shadow: 0 6px 20px rgba(60, 40, 30, .05) !important; }
body #chart-screen :is(.rt-card, .rt-fold, .rt-golden, .rt-attach, .rt-lock, .rt-ask, .rt-chapter-card, .ov-sales, .ov-card-feature, .engine-proof, .chat-care) { border-radius: 18px !important; }
/* 안쪽 구획 */
body #chart-screen :is(.ov-pillars, .ov-bars, .ov-scale, .ov-toc-list, .engine-proof-stats, .engine-proof-specs, .rt-cal-cell, .ov-quote, .rt-quote, .rt-card-verdict, .chat-care-quote, .ov-chips, .rt-chat-end, .rt-row, .rt-row.is-locked, .ov-doc-badge, .ov-chat-perk, .rt-ask-chip, .ov-ny-month, .ov-chat-free-btn, .rt-cta-sub, .engine-spec-key) {
  background: #faf8f5 !important; background-image: none !important; border-color: #ece8e1 !important; }
body #chart-screen .ov-pillar.is-day { background: #f1efeb !important; }
body #chart-screen :is(th.is-mine, td.is-mine) { background: #fbeef1 !important; }
body #chart-screen .rt-ask-input { border-color: #ece8e1 !important; background: #fff !important; }
body #chart-screen :is(.rt-row, .rt-area-row, .rt-card details, .ov-benefit-item, .ov-toc-part, li) { border-color: #ece8e1; }
/* 버튼·포인트: 딥 로즈 */
body #chart-screen :is(.ov-cta, .rt-cta-main, .rt-ask-send, .promo-cta-button) { background: #b8365a !important; border-color: #b8365a !important; color: #fff !important; }
body #chart-screen :is(.ov-card-link, .ov-chat-free-btn, th.is-mine, .rt-chapter-no, .rt-row-lock, .rt-lock-go, .rt-card-tag, .rt-row-label, .rt-area-name, .pg-listcard-title, .engine-proof-kicker, .chart-kicker, .ov-pillar-god, .engine-proof-index, .ov-toc-count, .rt-card-next, .is-more, span.pg-mark) { color: #b8365a !important; }
body #chart-screen span.pg-mark { border-color: #b8365a !important; }
/* 보조 글씨: 누런 갈색 → 회색 */
body #chart-screen :is(.rt-quote, .ov-bar-label, .rt-golden-tag, .rt-golden-hint, .rt-golden-next, .rt-attach-label, .rt-lock-label, .ov-kicker, .ov-offer-hook, .ov-ny-score-label, .engine-proof p, .chat-care p, .ov-benefit-item, .ov-toc-list small) { color: #6d6a65 !important; }
body #chart-screen .rt-card-next { border-color: #f0c9d4 !important; }
/* 남은 누런 곳 보정 */
body #chart-screen :is(.ov-pillars, .ov-bars, .rt-card, .rt-golden, .ov-sales) li { background: transparent !important; }
body #chart-screen :is(.ov-quote, .rt-quote) small, body #chart-screen .rt-golden-hint, body #chart-screen .rt-cal-cell :is(small, b), body #chart-screen :is(.rt-lock, .rt-card, .rt-golden) li, body #chart-screen .rt-chapter span { color: #6d6a65 !important; }
body #chart-screen span.ov-scale-dot { border-color: #b8365a !important; }
body #chart-screen .ov-ny-stars { color: #d9a441 !important; }
body #chart-screen :is(.rt-card, .rt-golden, .rt-lock, .rt-row) b { color: inherit; }

/* ══ 정통사주 정보 입력: 정통사주 랜딩 영상 위에 투명(유리) 입력창만 올린다. 광고 문구 없이 2페이지(1: 생년월일, 2: 고민) ══ */
#input-screen .input-bg-video, #input-screen .input-full-intro { display: none; }
#input-screen.active:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) { min-height: calc(100svh - 24px); display: flex; flex-direction: column; }
/* 배경: 영상(없으면 포스터). 앱 폭 안에 고정, 어둡힘은 아주 약하게 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-bg-video { display: block; position: fixed; z-index: -1; top: 0; bottom: 0; left: 50%; width: min(100%, 448px); height: 100%; transform: translateX(-50%); object-fit: cover; object-position: 50% 30%; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"]))::after { content: ''; position: fixed; z-index: -1; pointer-events: none; top: 0; bottom: 0; left: 50%; width: min(100%, 448px); transform: translateX(-50%); background: linear-gradient(180deg, rgba(8, 10, 18, .22) 0%, rgba(8, 10, 18, .06) 30%, rgba(8, 10, 18, .06) 62%, rgba(8, 10, 18, .30) 100%); }
/* 광고·안내 문구와 소개 그림 숨김(윗부분 한 줄 소개만 남긴다) */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) :is(#input-pitch, .input-hero-art, [data-step-lead], #input-juwol-bubble) { display: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-hero { margin: 0 !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-hero { display: none !important; }
/* 윗부분 소개 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-full-intro { display: block; margin: 64px 0 0; padding: 0 12px; text-align: center; color: #fff; text-shadow: 0 2px 14px rgba(0, 0, 0, .65); }
.input-full-eyebrow { margin: 0 0 8px; color: #ffd9e2; font-size: 12.5px; font-weight: 700; letter-spacing: .18em; }
.input-full-title { margin: 0; font-size: 34px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; color: #fff; }
.input-full-desc { margin: 10px auto 0; max-width: 330px; font-size: 14.5px; font-weight: 500; line-height: 1.6; word-break: keep-all; color: #fff; }
/* 입력창: 더 투명한 유리, 아래 여백을 두고 남는 위쪽을 영상이 차지 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card { position: relative; isolation: isolate; margin-top: auto; margin-bottom: 44px; background: rgba(12, 16, 28, .26) !important; border: 1px solid rgba(255, 255, 255, .26) !important; border-radius: 22px !important; box-shadow: 0 10px 36px rgba(0, 0, 0, .25) !important; color: #fff !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(label, legend, .field-heading, .field-heading span, .input-step-heading p, .input-step-heading b, summary, h3, h4, p) { color: #fff !important; text-shadow: 0 1px 6px rgba(0, 0, 0, .55); }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.field-help, small, .input-step-heading small) { color: rgba(255, 255, 255, .82) !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(input[type="text"], input[type="number"], input[type="tel"], input:not([type]), select, textarea) { background: rgba(255, 255, 255, .12) !important; border: 1px solid rgba(255, 255, 255, .34) !important; color: #fff !important; box-shadow: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(input, textarea)::placeholder { color: rgba(255, 255, 255, .62) !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card select option { color: #222; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(input[type="text"], input[type="number"], input[type="tel"], select, textarea):focus { border-color: #fff !important; box-shadow: 0 0 0 3px rgba(255, 255, 255, .18) !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.gender-choice, .calendar-choice, .leap-month-choice, .relationship-options, .concern-chips) > :is(label, button), #input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card [data-time-known] { background: rgba(255, 255, 255, .12) !important; border: 1px solid rgba(255, 255, 255, .34) !important; color: #fff !important; box-shadow: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.gender-choice, .calendar-choice, .leap-month-choice) > label:has(input:checked), #input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.concern-chips button.is-active, .concern-chips button[aria-pressed="true"], [data-time-known][aria-pressed="true"]) { background: #b8365a !important; border-color: #b8365a !important; color: #fff !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.concern-chips button, .relationship-options label span) { color: #fff !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.calendar-choice, .leap-month-choice, .time-knowledge) { background: rgba(255, 255, 255, .10) !important; border: 1px solid rgba(255, 255, 255, .30) !important; box-shadow: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .time-knowledge button { background: transparent !important; border-color: transparent !important; color: #fff !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .time-knowledge button[aria-pressed="true"] { background: #b8365a !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .calendar-options { background: rgba(255, 255, 255, .10) !important; border: 1px solid rgba(255, 255, 255, .30) !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .calendar-choice { background: transparent !important; border: 0 !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .calendar-choice > label { border-color: transparent !important; background: transparent !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .calendar-choice > label:has(input:checked) { background: #b8365a !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.relationship-choice, .topic-details) label > span { background: rgba(255, 255, 255, .12) !important; border: 1px solid rgba(255, 255, 255, .34) !important; color: #fff !important; box-shadow: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.relationship-choice, .topic-details) label > input { background: transparent !important; border-color: transparent !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.relationship-choice, .topic-details) label:has(input:checked) > span, #input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.relationship-choice, .topic-details) input:checked + span { background: #b8365a !important; border-color: #b8365a !important; color: #fff !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .relationship-options > label { background: transparent !important; border: 0 !important; box-shadow: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-nav { background: transparent !important; border-top: 0 !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-nav #input-prev { background: rgba(255, 255, 255, .14) !important; border-color: rgba(255, 255, 255, .38) !important; color: #fff !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-progress span { background: rgba(255, 255, 255, .38); }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-progress span.is-active { background: #fff; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .screen-back { color: #fff !important; text-shadow: 0 1px 8px rgba(0, 0, 0, .6); }
/* 오류 문구: 입력창 안이 아니라 화면 맨 위 고정 자리에 뜬다(정통사주 입력) */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) #form-error { position: fixed; z-index: 3000; top: calc(10px + env(safe-area-inset-top, 0px)); left: 50%; transform: translateX(-50%); width: min(calc(100% - 32px), 416px); box-sizing: border-box; margin: 0 !important; padding: 12px 16px; border-radius: 14px; background: #fff; color: #b8365a !important; border: 1px solid #f0c9d4; box-shadow: 0 8px 28px rgba(0, 0, 0, .28); font-size: 14px; font-weight: 700; text-align: center; text-shadow: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) #form-error:empty { display: none; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card::before { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); pointer-events: none; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) #form-error { height: auto !important; min-height: 0 !important; bottom: auto !important; right: auto !important; }
/* 하단 버튼 띠를 화면 바닥 고정에서 입력창 안으로 넣어 바닥에 붙지 않게 한다 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card { padding-bottom: 20px !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-nav { position: static !important; left: auto !important; right: auto !important; bottom: auto !important; transform: none !important; width: auto !important; max-width: none !important; margin: 16px 0 0 !important; padding: 0 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; box-shadow: none !important; }
/* 블러 제거: 입력창 뒤 영상이 선명하게 그대로 보인다. 글씨가 읽히도록 옅은 어둠막만 둔다. */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card::before { display: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card { background: rgba(10, 14, 26, .34) !important; }
/* 페이지 표시(점)가 입력창 윗선에 붙지 않게 위 여백을 준다 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card { padding-top: 24px !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-heading { margin: 0 0 14px !important; }
/* 입력 칸에만 약한 블러 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(input[type="text"], input[type="number"], input[type="tel"], input:not([type]), select, textarea) { -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
/* 상단 공백 줄이기: 소개 글을 위로 (64px → 34px) */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-full-intro { margin-top: 34px !important; }
/* 2페이지 선택 칩: 바깥 label 에는 배경을 주지 않고 안쪽 둥근 칩(span)만 분홍으로 (네모가 겹쳐 보이던 것 수정) */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .relationship-options > label, #input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .relationship-options > label:has(input:checked) { background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 10px !important; }
/* 정통사주 입력: 하단 "이전" 버튼 삭제(상단 ‹ 화살표가 있다). 다음 버튼은 폭을 채운다 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) #input-prev { display: none !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-nav { display: block !important; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .input-step-nav #input-next { width: 100%; }
/* 선택 버튼(성별·양력/음력·몰라요·고민 칩·관계·직업): 선택 안 한 상태에도 약한 블러 */
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card :is(.gender-choice, .calendar-choice, .leap-month-choice) > label,
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .concern-chips > button,
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .relationship-options > label > span,
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .time-knowledge,
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .form-card .calendar-options { -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }

/* 평생사주: 영상과 소개 문구를 평생사주 것으로 */
#input-screen:has(#input-pitch[data-product="simple"]) .input-bg-video { object-position: 50% 28%; }
#input-screen:has(#input-pitch[data-product="newyear"], [data-product="reunion"]) .input-bg-video { object-position: 50% 24%; }
/* 밝은 영상(평생사주)에서도 소개 글씨가 읽히게: 그림자 강화 + 위쪽에 옅은 어둠막 */
#input-screen:has(#input-pitch[data-product="simple"]) .input-full-intro { text-shadow: 0 1px 3px rgba(0, 0, 0, .75), 0 2px 16px rgba(0, 0, 0, .7); }
#input-screen:has(#input-pitch[data-product="simple"]) .input-full-title { font-size: clamp(23px, 6.2vw, 30px); letter-spacing: -.03em; line-height: 1.3; }
#input-screen:has(#input-pitch[data-product="simple"]) .input-full-desc { font-size: 14px; line-height: 1.6; max-width: 340px; margin-top: 8px; }
#input-screen:has(#input-pitch[data-product="simple"])::after { background: linear-gradient(180deg, rgba(8, 10, 18, .42) 0%, rgba(8, 10, 18, .18) 32%, rgba(8, 10, 18, .06) 60%, rgba(8, 10, 18, .30) 100%) !important; }

/* 평생사주 입력 진입 시: 상단 격국·병약 문구가 먼저 시선을 잡고, 폼이 부드럽게 안착 (입력 방해 없는 2초 시선 유도) */
@keyframes simpleIntroReveal {
  0% { opacity: 0; transform: translateY(-8px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes simpleFormSlideUp {
  0% { opacity: 0; transform: translateY(22px); }
  35% { opacity: .25; transform: translateY(16px); }
  100% { opacity: 1; transform: translateY(0); }
}
#input-screen.active:has(#input-pitch[data-product="simple"]) .input-full-intro {
  animation: simpleIntroReveal .8s cubic-bezier(.16, 1, .3, 1) both;
}
#input-screen.active:has(#input-pitch[data-product="simple"]) .form-card {
  animation: simpleFormSlideUp 1.1s cubic-bezier(.16, 1, .3, 1) both;
}


/* 결과 등 다른 화면에서 입력 화면의 영상·소개·어둠막이 비치지 않게: 입력 화면이 활성일 때만 보인다 */
#input-screen:not(.active) .input-bg-video, #input-screen:not(.active) .input-full-intro, #input-screen:not(.active) #form-error { display: none !important; }
#input-screen:not(.active)::after, #input-screen:not(.active)::before { display: none !important; }

#input-screen:not(.active) { display: none !important; }
/* 2페이지 위쪽 주제 칩 위의 "고민" 제목 */
.concern-chips-title { margin: 0 0 8px; font-size: 14px; font-weight: 600; }
#input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .concern-chips-title, #input-screen:has(#input-pitch:is([data-product="full"], [data-product="simple"], [data-product="newyear"], [data-product="reunion"])) .concern-chips-title span { color: #fff !important; text-shadow: 0 1px 6px rgba(0, 0, 0, .55); }

/* 무료 결과 하단 플로팅 버튼: 딥 로즈, 더 높게, 둥글게 */
body #ov-floats { bottom: calc(6px + env(safe-area-inset-bottom, 0px)); }
body #ov-floats .ov-float-cta { background: #b8365a !important; background-image: none !important; color: #fff !important; -webkit-text-fill-color: #fff !important; min-height: 54px; padding: 0 20px !important; border-radius: 18px !important; font-size: 15.5px !important; font-weight: 800 !important; letter-spacing: -.01em; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 26px rgba(184, 54, 90, .38), 0 2px 8px rgba(0, 0, 0, .12) !important; }
body #ov-floats .ov-float-cta:hover, body #ov-floats .ov-float-cta:active { background: #9e2c4d !important; filter: none; }
body #ov-floats .ov-float-cta .ov-float-text { color: inherit !important; -webkit-text-fill-color: inherit !important; }
body #ov-floats.is-core-design .ov-float-cta { border-radius: 18px !important; background: #b8365a !important; }
/* 플로팅 버튼 폭을 좁게: 화면 가운데에 글자에 맞춘 알약 폭 */
body #ov-floats { justify-content: center; }
body #ov-floats .ov-float-cta { flex: 0 0 auto !important; width: auto !important; min-width: 220px; max-width: calc(100% - 96px); margin: 0 !important; padding: 0 26px !important; }

/* 계산 중 화면("사주 원국을 세우고…"): 가운데 위쪽에 월화담 로고 */
.calc-overlay { position: fixed; }
.calc-overlay .calc-logo { position: absolute; top: 14vh; left: 50%; transform: translateX(-50%); width: 132px; height: auto; pointer-events: none; }
@media (max-height: 640px) { .calc-overlay .calc-logo { top: 8vh; width: 104px; } }

/* 결과 이야기 중간의 "도사 주월에게 상담실에서 바로 물어보기" 카드: 랜딩 상담소 위젯과 같은 분홍 테두리 */
body #chart-screen section.rt-ask.rt-ask { border: 1.5px solid #d4829a !important; box-shadow: 0 6px 20px rgba(184, 54, 90, .10) !important; }

/* ══ 무료 결과의 "가려 둔 글" 개선 ══
   글자 모양은 완전히 뭉개고(읽을 수 없게), 회색 얼룩 대신 분홍 번짐이 문장 끝으로 갈수록 부드럽게 사라지게 한다. */
body #chart-screen .ov-blur {
  display: inline; padding: 0 .2em; -webkit-box-decoration-break: clone; box-decoration-break: clone;
  color: transparent !important; text-shadow: 0 0 11px rgba(184, 54, 90, .55); filter: none; opacity: 1;
  background: rgba(184, 54, 90, .13); border-radius: 8px;
  user-select: none;
}
body #chart-screen .ov-area-veil { color: transparent !important; text-shadow: 0 0 10px rgba(109, 106, 101, .55); filter: none; opacity: .9; -webkit-mask-image: none; mask-image: none; }
body #chart-screen .ov-blurred { color: transparent !important; text-shadow: 0 0 9px rgba(109, 106, 101, .6); filter: none; }

/* "글로는 다 풀지 못한 속이야기…" 말풍선: 홈뿐 아니라 무료 결과 하단(복제본)에서도 삭제 */
.chat-care-opening p { display: none !important; }
.chat-care-opening::after { display: none !important; }

/* 결과 페이지: 상담소 위젯 여백, 이야기 끝의 "주월에게 바로 물어보기"·"무료 3회" 버튼은 위젯으로 대체되어 숨김 */
#chart-screen .rt-cta-sub, #chart-screen .ov-chat-sub-hook { display: none !important; }
/* 맨 아래 CTA(플로팅 버튼과 중복) 삭제 */
#chart-screen .promo-cta { display: none !important; }
body #chart-screen #chart-overview .rt-cta .rt-cta-sub, body #chart-screen .ov-chat-sub-hook, body #chart-screen .ov-chat-free-btn { display: none !important; }
body #chart-screen .promo-cta, body #chart-screen .free-promo-flow .promo-cta, body #chart-screen a.promo-cta-button { display: none !important; }

/* "읽고 나면 달라지는 3가지": 번호 동그라미 갈색 → 딥 로즈, 작은 라벨 금갈색 → 딥 로즈, 구분선 → 연한 회색 */
body #chart-screen .ov-benefit-item::before { background: #b8365a !important; color: #fff !important; }
body #chart-screen .ov-benefit-item small { color: #b8365a !important; }
body #chart-screen .ov-benefit-item { border-top-color: #ece8e1 !important; }
body #chart-screen .ov-benefit-item b { color: #222 !important; }
body #chart-screen .ov-benefit-item span { color: #5f5c57 !important; }

/* 월화담 상담소 위젯: 어디를 눌러도 채팅으로 이동(위젯 전체를 덮는 투명 링크). 화살표 단추는 그 위에서 그대로 보인다. */
#home-screen .home-consult-hit { position: absolute; inset: 0; z-index: 1; border-radius: inherit; -webkit-tap-highlight-color: rgba(184, 54, 90, .12); }
#home-screen .home-consult-go { z-index: 2; }
#home-screen .home-consult { cursor: pointer; }

/* 채팅방 묶음: 사주 상담은 단정한 흰 카드, 주월과 이야기는 따뜻한 베이지 카드로 구분한다. */
#chat-list-screen .chat-room-group { display: flex; align-items: center; gap: 8px; margin: 18px 2px 2px; color: #4f4b44; font: 700 13px/1.4 var(--sans); letter-spacing: .02em; }
#chat-list-screen .chat-room-group:first-child { margin-top: 4px; }
#chat-list-screen .chat-room-group::after { content: ''; flex: 1; height: 1px; background: #ebe6de; }
#chat-list-screen .chat-room-group.is-story { color: #8c6e53; }
#chat-list-screen .chat-room-group.is-story::after { background: #e8dcc8; }
#chat-list-screen .chat-room-story:not(.chat-room-juwol-human) { background: #f8f1e6 !important; border-color: #e6d8bf !important; }
#chat-list-screen .chat-room-story:not(.chat-room-juwol-human):hover { background: #f5ecdd !important; border-color: #dccaa8 !important; }
#chat-list-screen .chat-room-story .chat-room-arrow { color: #a8875a !important; }

/* 무료 결과 화면: report.css 가 html·body 를 투명으로 두고 색을 고정 레이어(body::before)에만 맡겼다.
   모바일 크롬에서 주소창이 접히는 동안 그 레이어는 옛 화면 높이로 잘려, 새로 드러난 아랫부분에 투명한 바탕이 비친다(실측: html·body 모두 rgba(0,0,0,0)).
   html·body 가 직접 칠하면 레이어와 상관없이 같은 색이 깔린다. */
html:has(:is(#chart-screen, #home-screen, #chat-screen).active), body:has(:is(#chart-screen, #home-screen, #chat-screen).active) { background-color: var(--paper, #faf8f5) !important; }

/* 랜딩은 문서 배경만 사용한다. 단색을 중복해서 그리는 fixed 레이어는
   주소창이 접힐 때 이전 뷰포트 경계를 남길 수 있다. */
body:has(#home-screen.active)::before { content: none; }

/* 하단 바 가운데 "상담소": 바 위로 솟은 프리미엄 딥로즈 원형 버튼. 레이아웃 높이는 그대로 두고 시각적 원형만 위로 올린다. */
.home-tabbar { overflow: visible !important; }
.home-tab[data-tab="chat"] { position: relative; z-index: 1; color: #b8365a; font-weight: 700; }
.home-tab[data-tab="chat"] svg {
  box-sizing: border-box; width: 50px; height: 50px; margin: -13px 0; padding: 11px;
  border-radius: 50%;
  background: linear-gradient(135deg, #d84570 0%, #b8365a 55%, #9e2a4d 100%);
  color: #fff;
  box-shadow: 0 0 0 3.5px #fff, 0 6px 18px rgba(184, 54, 90, .36);
  transform: translateY(-11px);
  transition: transform .18s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow .18s ease;
}
.home-tab[data-tab="chat"]:active svg {
  transform: translateY(-8px) scale(0.95);
  box-shadow: 0 0 0 3.5px #fff, 0 4px 12px rgba(184, 54, 90, .28);
}
.home-tab[data-tab="chat"].is-current { color: #b8365a; font-weight: 800; }
.home-tab[data-tab="chat"].is-current svg {
  background: linear-gradient(135deg, #e04f7c 0%, #c43b62 55%, #a82e52 100%);
  box-shadow: 0 0 0 3.5px #fff, 0 8px 22px rgba(184, 54, 90, .45);
  transform: translateY(-12px) scale(1.03);
}
html:is([data-mf="dark"], [data-mf="ink"]) .home-tab[data-tab="chat"] { color: #f0a9bd; }
html:is([data-mf="dark"], [data-mf="ink"]) .home-tab[data-tab="chat"] svg {
  background: linear-gradient(135deg, #b8365a 0%, #87203e 100%);
  color: #fff;
  box-shadow: 0 0 0 3.5px var(--mf-bar), 0 6px 18px rgba(0, 0, 0, .45);
}


/* 재회비책 입장 화면: 영상 풀스크린 위에 한 줄과 단추 하나. 나머지 입력 요소는 모두 숨긴다. */
.reunion-gate { display: none; }
#input-screen[data-gate="reunion"] > :not(.screen-topbar):not(.input-bg-video):not(.input-full-intro):not(.reunion-gate), html[data-gate-boot="1"] #input-screen > :not(.screen-topbar):not(.input-bg-video):not(.input-full-intro):not(.reunion-gate) { display: none !important; }
/* 로딩 없이 열릴 때, 제목 글자가 정해지기 전에는 가린다(app.js 가 정한 뒤 data-gate-boot 를 뗀다). */
html[data-gate-boot="1"] .input-full-title { visibility: hidden; }
#input-screen[data-gate="reunion"] .reunion-gate, html[data-gate-boot="1"] #input-screen .reunion-gate { display: block; position: fixed; z-index: 5; left: 50%; transform: translateX(-50%); bottom: max(28px, env(safe-area-inset-bottom)); width: min(calc(100vw - 32px), 420px); }
.reunion-gate-go { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 58px; padding: 0; border: 0 !important; border-radius: 16px; background: #b8365a !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font: inherit; font-size: 17.5px; font-weight: 800; cursor: pointer; box-shadow: 0 8px 28px rgba(0, 0, 0, .45); }   /* 랜딩 '월화담 입장하기'(.product-start)와 같은 모양 */
.reunion-gate-go:hover { background: #9e2c4d !important; }
.reunion-gate-go:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
/* 로그인 팝업 */
.reunion-login { position: fixed; border: 0; border-radius: 20px; padding: 44px 18px 24px; width: min(calc(100vw - 40px), 360px); background: #fffaf3; color: #2b2119; text-align: center; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); }
.reunion-login::backdrop { background: rgba(0, 0, 0, .6); }
.reunion-login h3 { margin: 0 0 8px; font: 700 clamp(17px, 5.2vw, 21px)/1.35 var(--sans, system-ui, sans-serif); letter-spacing: -.03em; word-break: keep-all; }   /* 긴 제목이 두 줄로 꺾이지 않는 폭(모바일 한 줄) */
.reunion-login p { margin: 0 0 20px; font: 500 15px/1.5 var(--sans, system-ui, sans-serif); color: #5f5146; word-break: keep-all; }
/* 로그인 단추는 카카오 노랑(kakao-login.css 의 공용 규칙)을 그대로 쓰고, 이 팝업에서는 폭만 넓힌다. */
html body a.reunion-login-go[href^="/api/auth/kakao"]:not(#kakao-login) { width: 100%; min-height: 54px; border-radius: 14px; font-size: 16.5px; font-weight: 800; }
.reunion-login-skip { display: block; width: 100%; margin-top: 10px; min-height: 48px; border: 1px solid #d9cdbd; border-radius: 14px; background: transparent; color: #5f5146; font: 700 15px/1.3 var(--sans, system-ui, sans-serif); cursor: pointer; }
.reunion-login-skip:hover { background: rgba(0, 0, 0, .04); }
.reunion-login-x { position: absolute; top: 8px; right: 8px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: none; color: #7a6c60; font: 400 28px/1 var(--sans, system-ui, sans-serif); cursor: pointer; }
.reunion-login-x:hover { background: rgba(0, 0, 0, .06); }
/* 로딩 없이 열리는 동안(html[data-boot]) 홈 화면이 아직 활성이라 약관 푸터가 먼저 비친다. 화면이 정해져 data-boot 가 걷힌 뒤에 규칙대로 보인다. */
html[data-boot] .site-footer, html[data-gate-boot="1"] .site-footer { display: none !important; }
/* 입장 화면 페이드: 부팅 동안은 투명하게 두고, 배경 포스터가 준비되면 서서히 나타난다. 입장 단추를 누르면 입력 폼도 같은 식으로 열린다. */
html[data-gate-boot="1"] #input-screen { opacity: 0; }
#input-screen[data-gate="reunion"] { animation: reunion-fade .55s ease backwards; }
#input-screen.reunion-enter { animation: reunion-fade .4s ease backwards; }
@keyframes reunion-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { #input-screen[data-gate="reunion"], #input-screen.reunion-enter { animation: none; } }
/* 입장 화면: 영상 위 자막. 글자는 모두 제목 크기 한 줄이고, 줄이 떠오른 뒤 단추가 나타난다. 영상 어둡기는 랜딩(.simple-landing)과 같다. */
#input-screen[data-gate="reunion"] .input-full-desc, html[data-gate-boot="1"] .input-full-desc { display: none; }
#input-screen[data-gate-page="1"] .input-full-title, #input-screen[data-gate-page="2"] .input-full-title, #input-screen[data-gate-page="3"] .input-full-title { font-size: clamp(21px, 5.6vw, 26px); font-weight: 700; letter-spacing: -.03em; line-height: 1.4; word-break: keep-all; white-space: pre-line; }   /* 랜딩 제목(우리가 헤어진 진짜 이유)과 같은 크기 */
html body #input-screen[data-gate="reunion"]::after, html[data-gate-boot="1"] body #input-screen::after { background: linear-gradient(180deg, rgba(9, 12, 18, .76) 0%, rgba(9, 12, 18, .48) 40%, rgba(9, 12, 18, .06) 66%, rgba(9, 12, 18, .55) 100%) !important; }
.input-full-intro.gate-line-in .input-full-eyebrow, .input-full-intro.gate-line-in .input-full-title { animation: reunion-line .9s ease backwards; }
.reunion-gate.gate-line-in { animation: reunion-fade .7s ease 1.2s backwards; }   /* 단추는 가운데 정렬용 transform 을 쓰므로 투명도만 바꾼다(옆에서 미끄러져 오지 않게) */
#input-screen[data-gate-page="3"] .reunion-gate.gate-line-in { animation-delay: .7s; }
@keyframes reunion-line { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .input-full-intro.gate-line-in :is(.input-full-eyebrow, .input-full-title), .reunion-gate.gate-line-in { animation: none; } }

/* 엽전 충전을 꺼 둔 동안 랜딩의 월화담 상담소 위젯(위·아래 두 곳)을 숨긴다. 다시 열 때 이 한 줄만 지운다. */
#home-screen .home-consult { display: none !important; }