/* 주문서: 사주 먼저 → 재질 추천 · 한자 고르기 (seal-saju.js) */
.saju-first { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 14px; margin-bottom: 16px; }
.saju-first h3.sub { margin-top: 0; }
.saju-first .btn { margin-top: 6px; }
.saju-out { margin-top: 10px; }
.saju-sum .pp { display: flex; gap: 6px; }
.saju-sum .pp span { flex: 1; text-align: center; font-size: 22px; font-weight: 800; background: var(--paper); border: 1px solid var(--line); border-radius: 10px; padding: 4px 0; }
.mat .rank { font-size: 11px; line-height: 1.35; color: var(--sub); margin-top: 4px; }
.mat .rank b { display: inline-block; color: #fff; border-radius: 6px; padding: 0 6px; margin-right: 2px; background: #9a8f86; }
.mat .rank.r1 b { background: #1b5e20; } .mat .rank.r2 b { background: #2e7d32; } .mat .rank.r3 b { background: #b8892e; } .mat .rank.r4 b { background: #c62828; }
.hj-slots { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.hj-slot { min-width: 64px; border: 1px dashed var(--line); border-radius: 12px; background: var(--paper); color: var(--ink); padding: 6px 8px; cursor: pointer; font: inherit; display: flex; flex-direction: column; align-items: center; }
.hj-slot.on { border-style: solid; border-color: var(--red); }
.hj-slot .c { font-size: 26px; font-weight: 800; line-height: 1.2; }
.hj-head { font-size: 14px; font-weight: 700; margin: 10px 0 6px; }
.hj-head .link { background: none; border: 0; color: var(--red); cursor: pointer; font: inherit; font-size: 13px; text-decoration: underline; }
.hj-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 6px; max-height: 360px; overflow: auto; }
.hj-list button { text-align: left; border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: var(--ink); padding: 6px 8px; cursor: pointer; font: inherit; font-size: 12px; display: flex; flex-direction: column; gap: 1px; }
.hj-list button b { font-size: 24px; }
.hj-list button small { color: var(--sub); }
.hj-list em { font-style: normal; font-size: 11px; font-weight: 700; color: #fff; border-radius: 6px; padding: 0 5px; align-self: flex-start; }
.hj-list em.b1 { background: #1b5e20; } .hj-list em.b2 { background: #2e7d32; } .hj-list em.b4 { background: #c62828; }
/* 화면 정리 */
.sticky-buy.off { display: none; }
details.fold > summary { font-size: 22px; font-weight: 700; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }
details.fold > summary::-webkit-details-marker { display: none; }
details.fold > summary::after { content: "펼치기 ▾"; font-size: 13px; font-weight: 500; color: var(--sub); }
details.fold[open] > summary::after { content: "접기 ▴"; }