/* moon-reunion(카엘) 생성 대기 맛보기 화면. 공용 카드(.cli-card…)는 saju-chart.css, 여기서는 달빛 색과 카엘 전용 카드만. */
.moon-teaser{--moon-ink:#e3e9f7;--moon-soft:#aebbd8;--moon-accent:#c9d8ff;--moon-line:#2c3a5e;--moon-thread:#e06a6e;background:#0e1220}
.moon-teaser .cli-card{background:#141b30;border-color:var(--moon-line);color:var(--moon-ink)}
.moon-teaser .cli-teaser-status,.moon-teaser .cli-teaser-note{color:var(--moon-soft)}
.moon-teaser .cli-person-head small,.moon-teaser .cli-traits small,.moon-teaser .cli-traits div+div small{color:var(--moon-accent)}
.moon-teaser .cli-traits div{background:#ffffff08}
.moon-teaser .cli-el-summary{border-top-color:var(--moon-line)}
.moon-kicker{display:block;margin-bottom:6px;font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--moon-accent)}
.moon-teaser h3{margin:18px 0 8px;font-size:13px;color:var(--moon-accent)}
/* 두 실 */
.moon-thread-art{position:relative;margin:18px 0 0;overflow:hidden;background:#0e1220}
.moon-thread-art video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
/* 서로에게 남아 있는 결 */
.moon-letter{margin-top:12px;padding:14px 16px;border-radius:14px;border:1px solid var(--moon-line);background:linear-gradient(180deg,#1a2340,#141b30)}
.moon-letter small{display:block;margin-bottom:6px;font-size:11px;font-weight:700;color:var(--moon-accent)}
.moon-letter p{margin:0;font-size:14px;line-height:1.85}
/* 달이 열어 주는 때 */
.moon-day-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.moon-day-list li{display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:8px;padding:10px 12px;border-radius:12px;background:#ffffff08;border:1px solid var(--moon-line)}
.moon-day-list li strong{font-size:14px;color:var(--moon-ink)}
.moon-day-list li small{font-size:11px;color:var(--moon-soft)}
.moon-day-list li span b{font-weight:700;color:var(--moon-accent);margin-right:2px}
.moon-day-list li span{grid-column:1/-1;font-size:13px;line-height:1.6;color:var(--moon-soft)}
.moon-day-list.is-avoid li{border-style:dashed;background:transparent}
.moon-timing-note{margin:12px 0 0;font-size:12px;line-height:1.7;color:var(--moon-soft)}
/* 달이 차오르는 목차 */
.moon-phase-card ol{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.moon-phase-card ol>li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:14px;border:1px solid var(--moon-line)}
.moon-phase-card ol>li.is-full{border-color:#c9d8ff66;background:#c9d8ff0d}
.moon-phase-card small{display:block;font-size:11px;color:var(--moon-soft)}
.moon-phase-card strong{display:block;margin-top:2px;font-size:15px;line-height:1.5;white-space:pre-line}
.moon-phase-card ul{list-style:none;margin:6px 0 0;padding:0}
.moon-phase-card ul li{padding:2px 0;font-size:12px;color:var(--moon-soft)}
.moon-phase{flex:none;width:22px;height:22px;margin-top:2px;border-radius:50%;background:#e9efff;box-shadow:inset var(--shade) 0 0 0 #232c48}
.moon-phase.phase-1{--shade:16px}.moon-phase.phase-2{--shade:11px}.moon-phase.phase-3{--shade:6px}.moon-phase.phase-4{--shade:3px}
.moon-phase.phase-5{--shade:0px;box-shadow:0 0 12px #c9d8ff99}
/* 모든 페이지 맨 위 카엘 대사 줄(cli-preview.js .cli-teaser-bar): 그림 없이 말풍선만. */
.moon-teaser .cli-teaser-bar{margin:24px 16px 6px;padding:18px 20px;border-radius:18px;border:1px solid var(--moon-line);background:linear-gradient(180deg,#1a2340,#141b30)}
.moon-teaser .cli-teaser-bar small{color:var(--moon-accent)}
.moon-teaser .cli-teaser-bar p{font-size:16px;color:var(--moon-ink)}
.moon-teaser .result-page-dots>span{background:#2c3a5e}.moon-teaser .result-page-dots>.active{background:var(--moon-accent)}
.moon-teaser .episode-navigation button{border-color:var(--moon-line);background:#141b30;color:var(--moon-ink)}
.moon-teaser .episode-navigation .next{background:var(--moon-accent);border-color:var(--moon-accent);color:#101830}
.moon-teaser .episode-navigation .next:disabled{opacity:.55}
/* 본편 읽기 쉼표(.read-break.is-moon / .read-cut.is-moon)의 달빛 색은 saju-chart.css에서 정한다. */