body { margin: 0; background: #1b1530; color: #f1e9d8; font-family: system-ui, "Malgun Gothic", sans-serif; }
main { max-width: 420px; margin: 0 auto; padding: 32px 16px; text-align: center; }
.card { width: 220px; height: 360px; margin: 0 auto 24px; border-radius: 12px; overflow: hidden;
        border: 2px solid #c9a96e; background: #2a2145; display: flex; align-items: center; justify-content: center; }
.card.is-reversed { transform: rotate(180deg); }
.card img { width: 100%; height: 100%; object-fit: cover; }
.placeholder { padding: 16px; font-size: 1.4rem; color: #c9a96e; transform: none; }
.card.is-reversed .placeholder { transform: rotate(180deg); }
h1 { margin: 0 0 4px; }
.dir { margin: 0 0 16px; color: #c9a96e; }
.reading { line-height: 1.7; }
a { color: #c9a96e; margin: 0 8px; }