.reading-guide { color: #dad6e8; font-size: 16px; line-height: 1.85; }
.reading-guide p { margin: 0 0 1.15em; }
.reading-guide h1 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(28px,5vw,42px); line-height:1.22; margin:20px 0 16px; color:#f0eeff; }
.reading-guide ul, .reading-guide ol { padding-left:24px; margin:16px 0 24px; }
.reading-guide li { margin-bottom:10px; }
.reading-guide .reading-subtitle { color:#e8d5b0; font-size:20px; line-height:1.5; }
.reading-card-pair { display:flex; align-items:center; justify-content:center; gap:24px; margin:25px 0 32px; }
.reading-card { display:flex; flex-direction:column; align-items:center; gap:10px; max-width:42%; text-align:center; font-size:14px; }
.reading-card img { max-width:100%; height:auto; border-radius:10px; border:1px solid #6b557d; }
.reading-picker { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.reading-picker select,.reading-picker button { font:inherit; width:100%; padding:12px; border:1px solid #9c86b8; border-radius:8px; background:#20182e; color:#fff; }
.reading-picker button { cursor:pointer; margin-top:8px; }
.reading-pair-list { list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr)); gap:16px; padding:0!important; }
.reading-pair-list li { padding:16px; border:1px solid #574664; border-radius:10px; margin:0; }
.reading-pair-list span { display:block; font-size:14px; line-height:1.6; margin-top:8px; color:#c4b9d4; }
.reading-guide h2 { color: #f0eeff; font-family: 'Playfair Display', Georgia, serif; font-size: clamp(23px, 3vw, 29px); line-height: 1.3; margin: 1.7em 0 .6em; }
.reading-guide h3 { color: #e8d5b0; font-size: 17px; line-height: 1.5; margin: 1.4em 0 .5em; }
.reading-guide a { color: #dcc391; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.reading-guide .reading-lead { font-size: 18px; line-height: 1.8; color: #eee9fa; }
.reading-guide .reading-example, .reading-guide .reading-note { background: rgba(139,92,246,.07); border: 1px solid rgba(139,92,246,.25); border-radius: 14px; padding: 20px; margin: 24px 0; }
.reading-guide .reading-example h2, .reading-guide .reading-note h2 { margin-top: 0; }
.reading-guide .reading-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; margin: 20px 0; }
.reading-guide .reading-facts > div { padding: 18px; border: 1px solid rgba(201,169,110,.25); border-radius: 12px; min-width: 0; }
.reading-guide dt { color: #e8d5b0; font-weight: 600; }
.reading-guide dd { margin: 6px 0 0; }
.reading-guide details { border-bottom: 1px solid rgba(255,255,255,.14); padding: 14px 0; }
.reading-guide summary { cursor: pointer; color: #eee9fa; font-weight: 500; }
.reading-guide details p { margin: 12px 0 4px; }
.reading-guide .reading-meta { color: #b9b2cb; font-size: 14px; }
.reading-guide :focus-visible { outline: 2px solid #dcc391; outline-offset: 4px; }
.birth-date-error { color: #ffd5cf; background: #321c28; border: 1px solid #dca29a; border-radius: 8px; padding: 10px 14px; margin: 12px 0; font-size: 14px; line-height: 1.5; }
.birth-date-error[hidden] { display: none; }
#forgetBirthCard { font:inherit; font-size:14px; color:#e8d5b0; background:#20182e; border:1px solid #9c86b8; border-radius:8px; padding:10px 16px; cursor:pointer; }
.reading-calculation { font-size:14px; line-height:1.7; color:#e8d5b0; padding:16px; margin:20px 0; border:1px solid #574664; border-radius:10px; }
.reading-guide table { border-collapse: collapse; width: 100%; font-size: 15px; }
.reading-table-scroll { overflow-x:auto; max-width:100%; margin:20px 0; }
.reading-guide td, .reading-guide th { padding: 10px; border-bottom: 1px solid rgba(255,255,255,.12); text-align: left; }
@media (max-width: 480px) { .reading-guide .reading-example, .reading-guide .reading-note { padding: 16px; } .reading-guide { font-size: 16px; } }