/* 길흉점 결과 스타일 — iching.html 과 consult-result.html 이 **같이** 쓴다.
 *
 * 왜 따로 냈나 (2026-08-17):
 *   길흉점 결과를 상담 기록에서 다시 보려면 consult-result.html 도 이 규칙이 필요하다.
 *   그런데 iching.html 은 styles.css 를 안 읽는다 — 자기 <style> 에 :root · * · body 를
 *   따로 갖고 있어서, styles.css(1.1MB)를 읽게 하면 토큰·리셋·body 가 셋 다 겹친다.
 *   그래서 **결과에 쓰는 34개만** 여기로 옮겼다. page-stage.css 와 같은 방식이다.
 *
 * ⚠️ 복사가 아니라 **이사**다. iching.html <style> 에서 이 규칙들을 뺐다.
 *    두 곳에 두면 한쪽만 고쳐서 두 화면이 달라진다.
 * ⚠️ 고를 때 손으로 안 골랐다 — 결과를 그리는 함수 넷(renderV3Body ·
 *    detectVerdictPolarity · renderPolarityClosing · renderSajuCta)이 쓰는
 *    클래스 32개로 기계가 추렸다. @media 중첩에 걸리는 것은 0개였다.
 *
 * 📋 docs/SPEC_ICHING_REVIEW_2026-08-17.md
 */

.result-block {
        background: var(--paper);
        border: 1px solid var(--line);
        border-radius: 18px;
        padding: 20px 18px 22px;
        margin-bottom: 14px;
      }

.result-block-empty { text-align: center; color: var(--muted); font-size: 18px; line-height: 1.8; }

.result-block-label {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 18px;
        font-weight: 800;
        color: var(--muted);
        letter-spacing: 0.02em;
        margin-bottom: 12px;
      }

.result-block-label.tag-gold { color: #a8791f; }

.advice-avatar { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }

.result-block p { margin: 0 0 12px; font-size: 18px; line-height: 1.8; color: var(--ink); }

.result-block p:last-child { margin-bottom: 0; }

.trigram-reveal-wrap { text-align: center; margin: 4px 0 16px; }

.trigram-reveal { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; }

.tr-label { font-size: 18px; color: var(--muted); letter-spacing: 0.15em; }

.tr-hanja { font-size: 26px; font-weight: 800; color: var(--navy); }

.block-verdict { text-align: center; border-radius: 14px; padding: 18px 16px; background: rgba(185, 243, 221, 0.18); }

.block-verdict.is-unlucky, .block-verdict.is-greatmisfortune { background: rgba(247, 182, 201, 0.22); }

.verdict-polarity-tag { display: inline-block; font-size: 18px; font-weight: 800; color: #a8791f; margin-bottom: 8px; }

.verdict-hanja { font-size: 24px; font-weight: 800; color: var(--navy); }

.verdict-hangul { font-size: 18px; color: var(--muted); margin-top: 4px; }

.verdict-korean { font-size: 19px; margin-top: 12px; line-height: 1.7; }

.verdict-quote-inline { margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--line); text-align: left; }

.verdict-quote-divider { display: none; }

.verdict-quote-label { font-size: 18px; color: var(--muted); letter-spacing: 0.1em; }

.verdict-quote-text { font-size: 18px; color: var(--muted); line-height: 1.8; margin-top: 8px; }

.verdict-quote-by { font-size: 18px; color: var(--muted); margin-top: 8px; text-align: right; }

.verdict-quote-text .hanja { color: var(--navy); }

.saju-advice-sublabel { display: block; font-size: 18px; font-weight: 800; color: #a8791f; margin-bottom: 8px; }

.saju-advice-divider { height: 1px; background: var(--line); margin: 16px 0; }

.saju-advice-real .hanja { color: var(--navy); font-weight: 700; }

.block-closing { text-align: center; padding: 20px 18px; border-radius: 18px; background: var(--navy); color: #fff; margin-bottom: 14px; }

.closing-title { font-size: 19px; font-weight: 800; margin-bottom: 8px; }

.closing-body { font-size: 18px; opacity: 0.9; line-height: 1.7; }

.block-saju-cta { text-align: center; padding: 20px 18px; border-radius: 18px; border: 1.5px dashed var(--pink-strong); }

.saju-cta-headline { font-size: 19px; font-weight: 800; color: var(--navy); margin-bottom: 6px; line-height: 1.4; }

.saju-cta-subline { font-size: 18px; color: var(--muted); margin-bottom: 16px; line-height: 1.5; }

.saju-cta-btn { border: none; border-radius: 999px; padding: 13px 22px; background: var(--pink-strong); color: #fff; font-size: 18px; font-weight: 800; cursor: pointer; }

.result-block, .block-verdict { background: rgba(255, 251, 244, 0.96); }
