.lore-collection { margin-top: 3rem; scroll-margin-top: 7rem; }
.lore-collection-title { margin: 0 0 1.5rem; text-align: center; font: 700 2.25rem/1.2 Impact, "Arial Black", sans-serif; color: #ffff00; overflow-wrap: anywhere; }
.lore-collection > .lore-characters { max-width: 48rem; margin: 0 auto 1.5rem; padding: 1.25rem 0; border-block: 1px solid currentColor; }
.lore-characters a { display: inline-block; padding: .35rem .15rem; overflow-wrap: anywhere; }
.lore-story h4 { font: 700 2rem/1.25 Impact, "Arial Black", sans-serif; color: #ffff00; margin: 0 0 1rem; overflow-wrap: anywhere; }
.lore-source, .lore-return { font: 400 .875rem/1.6 Arial, sans-serif; }
.lore-return a { color: #6fddd0; text-underline-offset: 4px; }
.lore-media { width: min(100%, 38rem); display: block; margin: 1.75rem auto; background: #111; border: 0; aspect-ratio: 1 / 1; object-fit: cover; }
.lore-media-frame--echo { width: min(100%, 38rem); aspect-ratio: 1 / 1; margin: 1.75rem auto; overflow: hidden; background: #111; }
.lore-media-frame--echo .lore-media--echo { width: 100%; height: 100%; margin: 0; object-fit: contain; object-position: center; transform: scaleX(-1) rotate(90deg) scale(1.24); }
#wrong-robbies .lore-media, #galaxy-head .lore-media, #nips .lore-media { transform: rotate(90deg); }
#black-opal .lore-media, #grape-wrath .lore-media, #jester .lore-media { transform: none; }
#galaxy-head .lore-media { transform: scaleX(-1) rotate(90deg); }
#naezo .lore-media, #veekra .lore-media { transform: scaleX(-1); }
#greenbare-escape .lore-media { object-position: 50% 125%; }
.lore-media--feature { width: min(100%, 44rem); }
.lore-media-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; max-width: 48rem; margin: 2rem auto 0; }
.lore-media-grid .lore-media { width: 100%; margin: 0; }
.lore-media-caption { margin: .5rem 0 0; text-align: center; font-size: .875rem; color: #bdbdbd; }
.lore-main .lore-collection-title, .lore-main .lore-story h4, .lore-main .lore-return a { color: #161616; }
.lore-main .lore-collection { background: #faf9f7; }
.kk-lore-content { position: relative; z-index: 3; width: min(100%, 64rem); margin: auto; padding: 0 2rem 4rem; }
.kk-lore-content h1 { text-align: center; font-size: 2.75rem; line-height: 1.15; margin: 0 0 2rem; overflow-wrap: anywhere; }
.kk-lore-content .lore-collection-title { color: var(--rust); }
.kk-lore-content .lore-story { max-width: 46rem; margin: auto; padding: 2.5rem 0; border-bottom: 1px solid var(--teal); scroll-margin-top: 2rem; }
.kk-lore-content .lore-story h4 { color: var(--ink); }
.kk-lore-content .lore-prose { font: 400 1.125rem/1.8 Arial, sans-serif; overflow-wrap: anywhere; }
.kk-lore-content .lore-prose p { margin: 0 0 1.25rem; white-space: pre-line; }
.kk-lore-content a { color: #294c49; text-decoration: underline; text-underline-offset: 4px; }
.kk-lore-content .lore-characters { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.5rem; font: 700 1rem/1.6 Arial, sans-serif; }
.kk-lore-page .kk-hero { min-height: 0; padding: 2rem 1.5rem; }
.kk-lore-page .kk-hero-art { min-height: 0; }
.kk-lore-page .kk-hero-art::before, .kk-lore-page .kk-hero-art::after { display: none; }
.kk-lore-page .kk-hero-logo { width: min(100%, 30rem); animation: kk-lore-float 5s ease-in-out infinite; }
.kk-lore-page a:focus-visible, .kk-lore-page button:focus-visible, .kk-lore-page input:focus-visible { outline: 3px solid var(--rust); outline-offset: 4px; }
.kk-lore-page .kk-email { font-size: .875rem; }
@keyframes kk-lore-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@media (prefers-reduced-motion: reduce) { .kk-lore-page .kk-hero-logo { animation: none; } }
@media (max-width: 600px) {
 .lore-collection-title { font-size: 1.75rem; }
 .lore-story h4 { font-size: 1.5rem; }
 .lore-media-grid { grid-template-columns: 1fr; }
 .kk-lore-content { padding: 0 1.5rem 3rem; }
 .kk-lore-content h1 { font-size: 2rem; }
 .kk-lore-content .lore-prose { font-size: 1rem; }
 .kk-lore-page .kk-hero-logo { width: min(100%, 23rem); }
 .kk-lore-page .kk-topbar { height: auto; min-height: 76px; }
 .kk-lore-page .kk-topbar-inner { display: flex; flex-wrap: wrap; justify-content: center; padding: 14px 18px; gap: 10px; }
 .kk-lore-page .kk-mark-link, .kk-lore-page .kk-sun-link { display: none; }
 .kk-lore-page .kk-nav-links { flex-wrap: wrap; gap: 12px; }
 .kk-lore-page .kk-back { min-width: 0; width: 128px; }
 .kk-lore-page .kk-footer-controls { grid-template-columns: minmax(0, 1fr) 54px 24px; }
 .kk-lore-page .kk-stay { display: none; }
 .kk-lore-page .kk-form { min-width: 0; }
 .kk-lore-page .kk-email { font-size: .75rem; }
}