/* =============================================================
Secret Number — 6효 네온 오버레이 + 리포트 레이아웃
자동 생성: images/overlay.ps1 -Mode export (2026-09-12)
정본: images/overlay_spec.json — 수치는 그 파일에서만 고친다.
============================================================= */
/* ── 레이아웃: 히어로 고정 + 텍스트 카드 스크롤 (결정 ③) ── */
/* 네온 선은 반드시 .sn-hero 안에 둔다. 다른 레이어에 두면 mix-blend-mode: screen 이 배경 이미지와 섞이지 않는다. */
.sn-hero { position: fixed; inset: 0; z-index: 0; background: #0A0A0E center / cover no-repeat; }
.sn-card { position: relative; z-index: 2; margin-top: 56.0vh; min-height: 44.0vh;
background: linear-gradient(to bottom, rgba(10,10,14,0) 0, rgba(10,10,14,0.82) 7.0vh, rgba(10,10,14,0.9) 100%);
padding: 8.5vh 7.0vw 12vh; color: #F2EEE6;
font-size: 3.85vw; line-height: 1.62; word-break: keep-all; }
.sn-label { display: block; font-size: 0.82em; font-weight: 700; color: #C9C3B8; margin: 1.6em 0 0.4em; }
.sn-label:first-child { margin-top: 0; }
/* ── 규칙 ⑨: 형세·처신 해설 블록과 🔒 Secret Number 블록의 구조적 분리 ── */
.sn-reading p { margin: 0; }
.sn-secret { margin-top: 2.4em; padding: 1.1em 1.2em; border: 1px solid rgba(242,238,230,0.18);
border-radius: 12px; background: rgba(255,255,255,0.04); }
.sn-secret h3 { margin: 0 0 0.6em; font-size: 0.86em; letter-spacing: 0.04em; color: #C9C3B8; }
.sn-disclaimer { display: block; margin-top: 0.6em; font-size: 0.8em; color: #C9C3B8; }
.sn-report-link { display: block; margin-top: 2em; font-size: 0.8em; color: #C9C3B8; text-decoration: underline; }
/* ── 6효 네온 선 ──
구조: .sn-yao > i.seg(1~2개) > b(코어). seg::before = 밑그림자, seg::after = 번짐, b = 코어.
⚠ .sn-yao / .seg 에 transform·opacity·filter·z-index 를 걸지 말 것 — 격리 그룹이 생겨 screen 블렌딩이 배경과 분리된다.
세로 위치는 transform 대신 calc 로 중앙을 맞춘다. (::before·::after·b 자신의 filter/opacity 는 괜찮다.)
승인 샘플 렌더러(overlay.ps1)와 같게: 번짐·그림자 끝단은 각지게(border-radius 없음), 코어 가장자리는 blur(0.15vw). */
.sn-yao { position: absolute; left: 20vw; width: 60vw; height: var(--thick); top: calc(var(--top) - var(--thick) / 2); pointer-events: none; }
.sn-yao .seg { position: absolute; top: 0; height: 100%; }
.sn-yao.yang .seg:nth-child(1) { left: 0; width: 100%; } .sn-yao.yang .seg:nth-child(2) { display: none; }
.sn-yao.yin .seg:nth-child(1) { left: 0; width: 26vw; } .sn-yao.yin .seg:nth-child(2) { left: 34vw; width: 26vw; }
.sn-yao .seg::before { content: ""; position: absolute; left: 0; right: 0;
top: calc(-1 * var(--spread) * var(--sh-spread-mul)); bottom: calc(-1 * var(--spread) * var(--sh-spread-mul));
background: var(--shadow); opacity: var(--sh-alpha); filter: blur(calc(var(--blur) * var(--sh-blur-mul))); }
.sn-yao .seg::after { content: ""; position: absolute; left: 0; right: 0;
top: calc(-1 * var(--spread)); bottom: calc(-1 * var(--spread));
background: var(--glow); opacity: var(--glow-alpha); filter: blur(var(--blur)); mix-blend-mode: screen; }
.sn-yao .seg > b { position: absolute; inset: 0; z-index: 1; border-radius: 999px;
background: var(--core); opacity: var(--core-alpha); filter: blur(0.15vw); mix-blend-mode: screen; }
/* 색 (음양의 성질 — 길흉 아님, 툴팁으로 안내) */
.sn-yao.yang { --core: #FFD680; --glow: #F5A623; --shadow: #1C1206; } /* 앰버 골드 */
.sn-yao.yin { --core: #B8F4FF; --glow: #3CC8E8; --shadow: #06101A; } /* 오로라 블루 */
.sn-yao { --sh-spread-mul: 1.4; --sh-blur-mul: 1.6; }
/* 효 위치별 수치 (1효 하단 → 6효 상단 / 초효 은은 → 5효 절정 → 상효 톤다운·흩어짐) */
.sn-yao.p1 { --top: 50vh; --thick: 0.55vw; --core-alpha: 0.45; --glow-alpha: 0.28; --blur: 1.2vw; --spread: 1.8vw; --sh-alpha: 0.108; } /* 은은함 */
.sn-yao.p2 { --top: 42.4vh; --thick: 0.55vw; --core-alpha: 0.58; --glow-alpha: 0.36; --blur: 1.6vw; --spread: 2.4vw; --sh-alpha: 0.138; } /* 약함 */
.sn-yao.p3 { --top: 34.8vh; --thick: 0.65vw; --core-alpha: 0.7; --glow-alpha: 0.46; --blur: 2.1vw; --spread: 3vw; --sh-alpha: 0.177; } /* 중간 */
.sn-yao.p4 { --top: 27.2vh; --thick: 0.7vw; --core-alpha: 0.82; --glow-alpha: 0.56; --blur: 2.6vw; --spread: 3.6vw; --sh-alpha: 0.215; } /* 다소 강함 */
.sn-yao.p5 { --top: 19.6vh; --thick: 0.8vw; --core-alpha: 1; --glow-alpha: 0.78; --blur: 3.4vw; --spread: 4.8vw; --sh-alpha: 0.3; } /* 절정 */
.sn-yao.p6 { --top: 12vh; --thick: 0.5vw; --core-alpha: 0.55; --glow-alpha: 0.38; --blur: 4.4vw; --spread: 5.6vw; --sh-alpha: 0.146; } /* 톤다운·흩어짐 */
/* 사용 예 (export/report_preview.html 참조):
*/