.zone-lore { margin: 18px 0; border: 1px solid #342d42; border-radius: 8px; background: #15131c; overflow: hidden; }
.lore-grid { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid #342d42; }
.lore-grid > div { padding: 12px; }
.lore-grid > div + div { border-left: 1px solid #342d42; }
.lore-grid span, .lore-sequence span, .syzygy-card > span { display: block; color: #9b8caf; font: 9px var(--mono); letter-spacing: 1.2px; }
.lore-grid strong { display: block; margin-top: 5px; color: #e2d6f5; font: 13px Georgia, serif; }
.lore-region { margin: 0; padding: 11px 12px; color: #a9a3b3; font-size: 11px; line-height: 1.55; }
.lore-sequence { margin: 0; padding: 11px 12px; border-top: 1px solid #342d42; color: #d2c5e4; font: 11px var(--mono); line-height: 1.7; }
.lore-sequence span { margin-bottom: 4px; }
.syzygy-card { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 12px; border-top: 1px solid #342d42; background: #1b1723; }
.syzygy-card strong { color: #e7ddf8; font: 17px Georgia, serif; }
.syzygy-card em { grid-column: 1 / -1; color: #aea2c2; font-size: 11px; font-style: normal; }
.door-card { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 12px; border-top: 1px solid #342d42; background: #18151f; }
.door-card > span { display: block; color: #9b8caf; font: 9px var(--mono); letter-spacing: 1.2px; }
.door-card strong { color: #e7ddf8; font: 17px Georgia, serif; }
.door-card em { grid-column: 1 / -1; color: #aea2c2; font-size: 11px; font-style: normal; }
.lore-context { margin: 0; padding: 11px 12px; border-top: 1px solid #342d42; color: #8e8998; font-size: 10px; line-height: 1.55; }