@charset "UTF-8";
/* 일주론 공개 사전(palja/ilju). 열 폭은 layout.css(.pm-page)가 정하고 여기서는 정하지 않는다. 색·모서리는 tokens.css 토큰만 쓴다. */
.ij { --ij-el: var(--pm-line); }
.ij-el--wood { --ij-el: var(--pm-wood); }
.ij-el--fire { --ij-el: var(--pm-fire); }
.ij-el--earth { --ij-el: var(--pm-earth); }
.ij-el--metal { --ij-el: var(--pm-sub); }
.ij-el--water { --ij-el: var(--pm-water); }

.ij-hanja { font-family: var(--pm-font-body); font-size: .62em; font-weight: 400; color: var(--pm-sub-text); white-space: nowrap; }
.ij-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--pm-gap-item); }
.ij-tag { display: inline-flex; align-items: center; min-height: 32px; padding: 4px 12px; border-radius: var(--pm-r-pill); border: 2px solid var(--ij-el, var(--pm-line)); background: var(--pm-cream); font-size: 14px; line-height: 1.4; }

.ij-p { margin: 0 0 14px; font-size: 16px; line-height: 1.85; }
.ij-sec > .ij-p:last-child, .ij-cta > .ij-p:last-child { margin-bottom: 0; }
.ij-nb-h { margin: 12px 2px 8px; }
.ij-more { display: flex; flex-wrap: wrap; gap: var(--pm-gap-item); margin: 6px 0 12px; }
.ij-more .pm-btn { flex: 1 1 160px; justify-content: center; text-align: center; }

/* 한눈에 보기 */
.ij-facts { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--pm-gap-item); }
.ij-facts > div { padding: 10px 14px; border-radius: var(--pm-r-input); background: var(--pm-cream); border: 1px solid var(--pm-line); }
.ij-facts dt { margin: 0 0 2px; font-size: 13px; font-weight: 700; color: var(--pm-fire-deep); }
.ij-facts dd { margin: 0; font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; }
@media (min-width: 720px) { .ij-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.ij-basis { margin: 0 0 12px; padding: 0 0 0 20px; font-size: 15.5px; line-height: 1.8; }
.ij-basis li { margin: 0 0 6px; }

/* 마을 동무 */
.ij-cp-row { display: flex; align-items: center; gap: 14px; margin-bottom: 8px; }
.ij-cp-row > div { min-width: 0; }
.ij-cp-img { display: block; flex: none; width: 96px; height: 96px; object-fit: contain; }
.ij-cp-name { margin: 0 0 6px; font-size: 17px; line-height: 1.5; }
.ij-cp-name small { font-size: 13.5px; color: var(--pm-sub-text); }
@media (max-width: 480px) { .ij-cp-row { flex-direction: column; align-items: flex-start; } }

/* 60갑자 칩 */
.ij-xun { margin: 16px 2px 8px; font-family: var(--pm-font-head); font-weight: 400; font-size: 20px; line-height: 1.3; }
.ij-xun small { font-family: var(--pm-font-body); font-size: 14px; color: var(--pm-sub-text); }
.ij-grid { list-style: none; margin: 0 0 4px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: var(--pm-gap-item); }
.ij-chip { display: flex; flex-direction: column; justify-content: center; gap: 1px; min-height: 54px; padding: 6px 10px; border-radius: var(--pm-r-input); border: 2px solid var(--pm-line); border-left: 8px solid var(--ij-el, var(--pm-line)); background: var(--pm-cream); color: var(--pm-ink); text-decoration: none; }
.ij-chip b { font-family: var(--pm-font-head); font-weight: 400; font-size: 18px; line-height: 1.3; }
.ij-chip span { font-size: 13px; color: var(--pm-sub-text); line-height: 1.4; }
.ij-chip:hover { background: var(--pm-soft); }
.ij-chip:focus-visible { outline: 3px solid var(--pm-focus); outline-offset: 2px; }

/* 내 일주 찾기 */
.ij-steps { margin: 0 0 14px; padding: 0 0 0 22px; font-size: 15.5px; line-height: 1.8; }
.ij-steps li { margin: 0 0 6px; }
.ij-find { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--pm-gap-card); }
.ij-find .pm-field { margin: 0; }
.ij-find .pm-btn { justify-content: center; }
@media (min-width: 720px) { .ij-find { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; } .ij-find .pm-btn { grid-column: 1 / -1; } }