/* 손님용 궁합 리포트. 칸 모양은 재회 리포트(reunion-story.css의 rs-*)를 그대로 쓰고, 여기서는 궁합 색·표지·미리보기만 입힌다.
   색: 따뜻한 종이 바탕 + 장미빛 강조. 표지: 원본 그림 한 장을 크게, 아래쪽 어두운 자리에 흰 글. */

#result-section .rs-report[data-reunion-theme="compat"] {
  --rs-bg: #fbf6f2; --rs-surface: #ffffff; --rs-surface-2: #f7eee9; --rs-ink: #2a1f22; --rs-muted: #75646a;
  --rs-accent: #c4466f; --rs-accent-ink: #ffffff; --rs-line: rgba(80, 40, 50, 0.11);
  --rs-good: #2f9e75; --rs-care: #d4644f; --rs-calm: #9a8f9f; --rs-shadow: 0 14px 34px rgba(80, 40, 50, 0.09);
}

/* ── 표지: 그림 한 장 전체, 아래쪽 어두운 자리에 글 ── */
#result-section [data-reunion-theme="compat"] .rs-cover { min-height: 560px; background-position: center 16%; }
#result-section [data-reunion-theme="compat"] .rs-cover::before { background: linear-gradient(180deg, rgba(34, 18, 24, 0) 0%, rgba(34, 18, 24, 0.12) 38%, rgba(34, 18, 24, 0.78) 74%, rgba(34, 18, 24, 0.94) 100%); }
#result-section [data-reunion-theme="compat"] .rs-cover h1, #result-section [data-reunion-theme="compat"] .rs-pair { --rs-c: #fff8f2; }
#result-section [data-reunion-theme="compat"] .rs-kicker { --rs-c: #f3cf9a; }
#result-section [data-reunion-theme="compat"] .rs-question { background: rgba(255, 248, 242, 0.14); --rs-c: #fff8f2; backdrop-filter: blur(4px); }
#result-section [data-compat-art="blossom"] .rs-cover { background-position: center 18%; }
#result-section [data-compat-art="flower"] .rs-cover { background-position: center 14%; }
#result-section [data-compat-art="tea"] .rs-cover { background-position: center 22%; }
#result-section [data-compat-art="picnic"] .rs-cover { background-position: center 26%; }
@media (max-width: 640px) { #result-section [data-reunion-theme="compat"] .rs-cover { min-height: 460px; } }

/* ── 연애·결혼 ── */
#result-section .cp-love-part { margin-bottom: 8px; }
#result-section .cp-love-part .rs-metric { margin: 2px 0 12px; }
#result-section .cp-love-part .rs-metric-head span { font-family: var(--rs-serif); font-size: 17px; font-weight: 900; }
#result-section .cp-love .rs-traits { margin-top: 4px; }
#result-section .cp-sees { margin-top: 22px; padding-top: 18px; border-top: 1px dashed var(--rs-line); }

/* ── 리포트 끝 단추 ── */
#result-section .cp-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
#result-section .cp-actions button { min-height: 48px; padding: 12px 22px; border-radius: 999px; border: 1px solid var(--rs-line); background: var(--rs-surface); font-size: 15px; font-weight: 700; cursor: pointer; }
#result-section .cp-actions .cp-pdf-btn { background: var(--rs-accent); border-color: var(--rs-accent); --rs-c: var(--rs-accent-ink); }

/* ── 결제 전 미리보기 ── */
#result-section .cp-preview { padding-bottom: 18px; }
#result-section .cp-preview .rs-cover { min-height: 420px; }
#result-section .cp-gauge-locked .rs-gauge-track { stroke-dasharray: 6 8; }
#result-section .cp-gauge-locked .rs-gauge-text strong { --rs-c: var(--rs-accent); }
#result-section .cp-preview-verdict .rs-chance strong { font-size: 16px; }
#result-section .cp-preview-verdict .rs-pane { margin: 4px 0 6px; }
#result-section .cp-locked-list { margin: 16px 0 0; padding: 0; list-style: none; counter-reset: cp-lock; }
#result-section .cp-locked-list li { counter-increment: cp-lock; position: relative; display: grid; gap: 2px; padding: 12px 0 12px 40px; border-top: 1px solid var(--rs-line); }
#result-section .cp-locked-list li::before { content: "🔒"; position: absolute; left: 6px; top: 12px; font-size: 15px; }
#result-section .cp-locked-list b { font-size: 15px; font-weight: 800; }
#result-section .cp-locked-list span { font-size: 13.5px; line-height: 1.65; --rs-c: var(--rs-muted); }
@media (max-width: 640px) {
  #result-section .cp-preview .rs-cover { min-height: 340px; }
  #result-section .cp-locked-list li { padding-left: 34px; }
}

/* 결제 잠금 상자: 미리보기 바로 아래, 리포트와 같은 폭 */
#result-section:has(> .cp-preview) #lock-overlay { max-width: 780px; margin: 16px auto 0; }
#lock-overlay .lock-box.cp-lock .lock-title { word-break: keep-all; }

/* 작성 중 화면: 그림 한 장과 한 줄 */
#drawing-section.cp-drawing { max-width: 520px; margin: 40px auto; padding: 0 0 26px; overflow: hidden; text-align: center; }
#drawing-section .cp-drawing-art { height: 280px; background: url('/images/compat/sn-cherry-blossom-1024.webp') center 20% / cover no-repeat; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 55%, transparent 100%); animation: cp-breathe 3.2s ease-in-out infinite; }
#drawing-section.cp-drawing .drawing-text { margin: 4px 22px 0; font-size: 16px; line-height: 1.7; word-break: keep-all; }
@keyframes cp-breathe { 0%, 100% { opacity: 1; } 50% { opacity: 0.82; } }
@media (prefers-reduced-motion: reduce) { #drawing-section .cp-drawing-art { animation: none; } }
@media print { #result-section .cp-actions { display: none !important; } }

/* 결제 잠금 상자: 사이트 공통 상자는 밝은 화면에서 어두운 바탕에 어두운 글자가 겹쳐, 궁합 미리보기에서는 리포트와 같은 밝은 종이 모양으로 바꾼다. */
#result-section:has(> .cp-preview) #lock-overlay .lock-box { background: #ffffff !important; border: 1px solid rgba(80, 40, 50, 0.14) !important; box-shadow: 0 14px 34px rgba(80, 40, 50, 0.10) !important; color: #2a1f22 !important; }
#result-section:has(> .cp-preview) #lock-overlay .lock-title { color: #2a1f22 !important; -webkit-text-fill-color: #2a1f22; font-family: 'Noto Serif KR', Batang, serif !important; word-break: keep-all; }
#result-section:has(> .cp-preview) #lock-overlay :is(.lock-desc, .lock-note, .lock-resume) { color: #75646a !important; -webkit-text-fill-color: #75646a; word-break: keep-all; }
#result-section:has(> .cp-preview) #lock-overlay .lock-pay-btn { background: linear-gradient(135deg, #d4578a 0%, #e0805a 100%) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff; border: 0 !important; box-shadow: 0 12px 26px rgba(201, 79, 124, 0.24) !important; }

/* 등급 이름이 길어 '우리 궁합'과 나란히 두면 좁은 칸에서 갈라지므로, 위아래 두 줄로 둔다. */
#result-section .cp-report .rs-chance { flex-direction: column; align-items: flex-start; gap: 2px; }
#result-section .cp-report .rs-chance strong { line-height: 1.35; word-break: keep-all; }