/* 김해담 신년사주 — 김해담 전통사주 꾸밈(../haedam/*.css) 위에 신년사주에만 있는 모양을 더한다.
   색은 김해담 사주첩과 같은 한지 바탕·먹색 글씨·금빛 선·붉은 인주. 오행 색은 --e0~--e4(theme-simple.css) */

/* 첫 화면: 제목 그림 대신 한자 한 줄 */
.sn-gate .sn-brand{font:700 15px/1.4 var(--serif);letter-spacing:.42em;color:var(--gold-l,#d2b77f);text-shadow:0 2px 10px #000;margin:0 0 10px}
.sn-gate #opening-title small{display:block;margin-top:4px;font-size:.62em;letter-spacing:.12em;opacity:.85}

/* 장 표지: 큰 한자 하나를 옅게 깐다 */
#reader .sn-cover{position:relative;overflow:hidden}
#reader .sn-cover-hj{position:absolute;right:-6px;top:-18px;font:900 120px/1 var(--serif);color:#8a6a3a;opacity:.1;pointer-events:none}

/* 김해담이 건네는 말 (웹툰 말풍선 대신 조용한 편지 말투) */
.sn-say{display:flex;gap:10px;align-items:flex-start;margin:18px 0}
.sn-face{flex:none;width:42px;height:42px;border-radius:50%;background:url('../haedam/assets/haedam-bw.jpg') 50% 32%/cover no-repeat;box-shadow:0 0 0 1px #1c161033}
.sn-bub{position:relative;flex:1;min-width:0;background:#faf4e4;border:1px solid #1c161026;border-radius:4px 14px 14px 14px;padding:10px 14px}
.sn-bub p{margin:0 0 6px;line-height:1.75}
.sn-bub p:last-child{margin-bottom:0}
.sn-who{display:block;font-size:12px;letter-spacing:.08em;color:#8a6a3a;margin-bottom:4px}

/* 풀이 카드: 한지 바탕 + 겹선 테두리 */
.sn-card{margin:22px 0;padding:20px 18px;background:#f7f0dc;border:1px solid #1c16104d;box-shadow:inset 0 0 0 4px #f7f0dc,inset 0 0 0 5px #1c161026}
.sn-card-k{margin:0 0 6px;text-align:center;font-size:12px;letter-spacing:.14em;color:#8a6a3a}
#reader .sn-card-t,#teaser .sn-card-t,.sn-card-t{margin:0 0 14px;text-align:center;font:700 19px/1.45 var(--serif);color:#1c1610}
#reader .chapter .sn-card-t:before{display:none}
.sn-card-t span{color:#8a6a3a;font-size:.7em;vertical-align:.12em}
.sn-q{padding:14px 0 4px;border-top:1px dashed #1c161033}
.sn-q:first-of-type{border-top:0;padding-top:0}
.sn-q h4,.sn-sub{margin:0 0 8px;font:700 16px/1.5 var(--serif);color:#1c1610}
.sn-q h4 small{display:block;font:400 12.5px/1.5 var(--sans);color:#6a5a42;margin-top:2px}
.sn-q p{margin:0 0 10px;line-height:1.85}
.sn-sub{margin-top:18px;font-size:15px}
.sn-note{font-size:13px;color:#6a5a42;margin:6px 0 0}
#reader .sn-up,.sn-up{color:#2f7a4a;margin-right:4px}#reader .sn-down,.sn-down{color:#a5402f;margin-right:4px}
.sn-do{padding:8px 12px;background:#efe5cc;border-left:3px solid #8a6a3a;font-size:14.5px}

/* 사주 상식: 찢은 종이처럼 톱니 위선 */
.sn-lore{margin:30px 0 10px;padding:22px 16px 16px;background:#ebe2c9;position:relative;font-family:var(--sans)}
.sn-lore:before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px;background:linear-gradient(-45deg,#ebe2c9 4px,transparent 0) 0 0/12px 8px repeat-x,linear-gradient(45deg,#ebe2c9 4px,transparent 0) 0 0/12px 8px repeat-x}
.sn-lore-k{margin:0;font-size:12px;letter-spacing:.12em;color:#8a6a3a}
#reader .sn-lore h3{margin:4px 0 12px;font:700 17px/1.5 var(--serif)}
#reader .sn-lore h3:before{display:none}
.sn-lore h4{margin:12px 0 4px;font-size:14.5px}
.sn-lore p{margin:0;font-size:14px;line-height:1.8;color:#3a2e20}

/* 다른 상품 안내 */
.sn-banner{display:block;margin:22px 0;padding:14px 16px;border:1px solid #8a6a3a80;border-radius:10px;background:#1c1610;color:#ece0c4!important;text-decoration:none}
.sn-banner span,.sn-banner b,.sn-banner em{display:block}
.sn-banner-k{font-size:12px;color:#d2b77f}
.sn-banner b{font:700 17px/1.5 var(--serif);margin:2px 0}
.sn-banner span:not(.sn-banner-k){font-size:13px;color:#c4b596}
.sn-banner em{font-style:normal;font-size:13px;color:#d2b77f;margin-top:6px;text-align:right}

/* 별점 */
.sn-stars{color:#b8862b;letter-spacing:1px;white-space:nowrap}
.sn-stars i{font-style:normal}
.sn-stars .off{color:#1c161026}
.sn-stars .half{background:linear-gradient(90deg,#b8862b 50%,#1c161026 50%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sn-field{display:flex;justify-content:space-between;align-items:center;margin:14px 0 0;padding:10px 14px;border:1px solid #1c161026;background:#faf4e4;font-weight:700}

/* 다음 장 */
#reader .sn-next{display:block;width:100%;margin:26px 0 0;padding:14px;border:1px solid #1c161066;background:#1c1610;color:#ece0c4;font:700 15px/1.4 var(--serif);cursor:pointer;border-radius:6px}

/* 여는 장: 올해 + 나의 사주 = 신수 */
.sn-eq{display:flex;align-items:center;justify-content:center;gap:6px;margin:18px 0;flex-wrap:wrap}
.sn-eq i{font-style:normal;color:#8a6a3a;font-size:18px}
.sn-eq-b{display:grid;justify-items:center;padding:8px 12px;border:1px solid #1c161033;background:#faf4e4;min-width:64px}
.sn-eq-b small{font-size:11px;color:#6a5a42}
.sn-eq-b b{font:700 20px/1.3 var(--serif);letter-spacing:.06em}
.sn-eq-b b.e1{color:var(--e1)}.sn-eq-b b.e2{color:var(--e2)}
.sn-eq-r{background:#1c1610;color:#ece0c4}.sn-eq-r small{color:#d2b77f}
#reader .sn-eq-r b{color:#ece0c4}

/* 다섯 기운 카드 */
.sn-five .bar-row.sn-top span:first-child{font-weight:700}
.sn-roles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sn-roles li{display:grid;justify-items:center;gap:2px;padding:10px 4px;border:1px solid #1c161026;background:#faf4e4;text-align:center}
.sn-roles small{font-size:11.5px;color:#6a5a42}
.sn-roles b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;font:700 22px/1 var(--serif);color:#fff}
.sn-roles b.e0{background:var(--e0)}.sn-roles b.e1{background:var(--e1)}.sn-roles b.e2{background:var(--e2)}.sn-roles b.e3{background:var(--e3)}.sn-roles b.e4{background:var(--e4)}
.sn-roles span{font-size:12.5px}
.sn-roles .gi b{box-shadow:0 0 0 2px #faf4e4,0 0 0 3px #a5402f}
.sn-scale{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);position:relative}
.sn-scale:before{content:"";position:absolute;left:10%;right:10%;top:8px;height:2px;background:#1c161026}
.sn-scale li{display:grid;justify-items:center;gap:4px;position:relative;font-size:11.5px;color:#6a5a42;text-align:center}
.sn-scale i{width:16px;height:16px;border-radius:50%;background:#efe5cc;border:2px solid #1c161040}
.sn-scale li.on{color:#1c1610;font-weight:700}
.sn-scale li.on i{background:#8a2c1f;border-color:#8a2c1f}

/* 열두 달 흐름 그래프 */
.sn-flow{margin:18px 0;padding:12px 10px 8px;border:1px solid #1c161026;background:#faf4e4}
.sn-flow figcaption{font:700 14px/1.4 var(--serif);text-align:center;margin-bottom:6px}
.sn-flow svg{display:block;width:100%;height:auto}
.sn-flow .zero{stroke:#1c161040;stroke-width:1}
.sn-flow .up{fill:#2f7a4a}.sn-flow .down{fill:#a5402f}.sn-flow .flat{fill:#b8a77f}
.sn-flow .lab{font-size:9px;text-anchor:middle;fill:#6a5a42}
.sn-legend,#reader .sn-legend{margin:6px 0 0;font-size:12px;line-height:1.6;color:#6a5a42;text-align:center}
.sn-legend i{display:inline-block;width:9px;height:9px;margin:0 3px 0 8px;vertical-align:-1px}
.sn-legend i.up{background:#2f7a4a}.sn-legend i.down{background:#a5402f}.sn-legend i.flat{background:#b8a77f}

/* 총운 등급 */
.sn-seal{display:grid;place-items:center;width:112px;height:112px;margin:6px auto 10px;border:3px double #8a2c1f;border-radius:10px;color:#8a2c1f;transform:rotate(-3deg);background:#fbf1ea}
.sn-seal b,#reader .sn-seal b,#teaser .sn-seal b{font:900 38px/1 var(--serif);color:#8a2c1f}
.sn-seal span{font-size:13px;letter-spacing:.3em;margin-top:-18px}
.sn-verdict{text-align:center;font:700 15.5px/1.7 var(--serif);margin:0 0 12px}
.sn-grades{list-style:none;margin:0 0 4px;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.sn-grades li{display:grid;justify-items:center;padding:5px 0;border:1px solid #1c16101f;font-size:10.5px;color:#6a5a42;background:#faf4e4}
.sn-grades b{font:700 13px/1.2 var(--serif);color:#4a3b28}
.sn-grades li.on{background:#8a2c1f;border-color:#8a2c1f;color:#f5e6d8}
.sn-grades li.on b{color:#fff}
.sn-starlist{list-style:none;margin:0;padding:0}
.sn-starlist li{display:flex;justify-content:space-between;align-items:center;padding:8px 2px;border-bottom:1px dashed #1c161026;font-size:14.5px}
.sn-starlist li:last-child{border-bottom:0}

/* 재물 세 열쇠 */
.sn-keys{list-style:none;margin:16px 0 0;padding:0;display:flex;justify-content:center;gap:14px}
.sn-keys li{display:grid;justify-items:center;font-size:12.5px;color:#4a3b28}
.sn-keys b{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#e9cd8a,#b8862b);color:#4a2e08;font:900 22px/1 var(--serif);box-shadow:inset 0 0 0 3px #f3dfa8,0 2px 6px #0002;margin-bottom:4px}

.sn-warn{font-size:12.5px;color:#6a5a42;background:#efe5cc;padding:8px 12px;margin:12px 0}

/* 열두 달 */
.sn-month h4 small{display:inline;margin-left:6px}
.sn-month.good h4 small{color:#2f7a4a}.sn-month.bad h4 small{color:#a5402f}

/* 세 복 세 고비 */
.sn-good .sn-q h4{color:#2f5a3a}
.sn-bad{background:#f3ebe0}
.sn-bad .sn-q h4{color:#7a2c1f}
.sn-rx .bk-table th{width:38%;text-align:left}

/* 편지: 손님의 물음 */
.sn-ask{position:relative;text-align:center}
.sn-askq{font:700 18px/1.6 var(--serif);margin:4px 0 0}
.sn-wax{position:absolute;right:12px;bottom:-14px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#8a2c1f;color:#f5e6d8;font:700 16px/1 var(--serif);box-shadow:0 2px 6px #0003;transform:rotate(-8deg)}
.sn-letter .bk-letter p{line-height:1.95}

/* 맛보기 */
#teaser .sn-seal-t{margin:12px auto}
#teaser .sn-teaser-stars{margin:8px 0 10px;padding:8px 12px;background:#faf4e4;border:1px solid #1c161026}
#teaser .sn-teaser-stars li.lock{color:#6a5a42}
.sn-lock3{list-style:none;margin:8px 0;padding:10px 12px;background:#faf4e4;border:1px solid #1c161026}
.sn-lock3 li{padding:6px 0;border-bottom:1px dashed #1c161026;font-size:14px}
.sn-lock3 li:last-child{border-bottom:0}
.sn-lock3 b{margin-right:8px;color:#7a2c1f}
.sn-toc{list-style:none;margin:12px 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px;text-align:left}
.sn-toc li{display:flex;gap:6px;align-items:center;padding:7px 8px;border:1px solid #1c161026;background:#faf4e4;font-size:13px;line-height:1.35}
.sn-toc b{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#1c1610;color:#ece0c4;font:700 12px/1 var(--serif)}
.sn-tail-ms{padding:10px 0 4px}
.sn-cap{font-size:12.5px;color:#6a5a42;text-align:center;margin:0 0 8px}

@media(max-width:380px){
 .sn-card{padding:16px 13px}
 .sn-grades li{font-size:9.5px}.sn-grades b{font-size:12px}
 .sn-toc{grid-template-columns:1fr}
 .sn-keys{gap:10px}
}
