/* Reviewed mockup composition; approved source artwork remains intact. */
:root { --al-header-height: 91px; scroll-padding-top: 7rem; }
.appearance-toggle { flex: 0 0 44px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid #776674; border-radius: 50%; color: #fff; background: #121016c9; }
.appearance-toggle:hover { background: #492338; }
.appearance-toggle[aria-pressed="true"] { color: #ffdb8a; }
.home-intro { background: #0b0b0f; color: #f6f6f8; }
.hero-quote { padding: 1rem; background: #0b0b0fe8; margin: 0; }
.hero-quote blockquote { font-size: clamp(1rem,1.6vw,1.5rem); font-style: italic; font-weight: 400; }
.home-hero.has-artwork .hero-atmosphere { display: none; }
.quick-start-section { position: relative; z-index: 2; }
.quick-start-guide { position: relative; align-self: end; min-width: 0; }
.quick-start-guide img { display: block; width: 100%; max-width: 240px; margin: auto; }
.guide-bubble { position: absolute; right: -.6rem; top: .5rem; max-width: 145px; padding: .7rem; border: 1px solid #decbd4; border-radius: 1rem 1rem 1rem 0; color: #17151b; background: #fff; font-size: .72rem; line-height: 1.35; transform: rotate(-5deg); }
.quick-start { grid-template-columns: minmax(0,1fr) minmax(0,.8fr) minmax(0,2fr); gap: 1.5rem; }
.quick-start .experience-card { padding: 1.15rem; gap: .8rem; }
.quick-start .experience-copy h3 { font-size: 1.1rem; }
.quick-start .experience-number { display: none; }
.quick-start .experience-copy .text-link { display: inline-flex; padding: .5rem 1rem; background: #a6192e; color: #fff; border-radius: 999px; text-decoration: none; }
.genre-grid { grid-template-columns: repeat(9,minmax(0,1fr)); gap: .65rem; }
.genre-tile { flex-direction: column; justify-content: end; align-items: center; gap: .8rem; min-height: 130px; }
.genre-icon { flex-shrink: 0; }
@media (min-width: 75rem) {
 .site-header { position: sticky; top: 0; background: #0b0b0ff2; backdrop-filter: blur(8px); z-index: 50; }
 .admin-bar .site-header { top: 32px; }
 .header-inner { gap: 1.25rem; }
 .primary-panel { gap: 1rem; flex-basis: auto; }
 .primary-navigation > .menu { gap: 1rem; }
 .site-header .search-form { width: 210px; }
 .home #main-content { margin-top: calc(-1 * var(--al-header-height)); }
 .home-intro { position: relative; isolation: isolate; }
 .home-hero.has-artwork .hero-inner { align-items: start; padding-top: calc(var(--al-header-height) + 3rem); padding-bottom: 16rem; }
 .home-hero.has-artwork .hero-copy { width: 55%; max-width: 650px; }
 .home-hero.has-artwork .hero-copy h1 { font-size: clamp(2.7rem,4.3vw,4rem); }
 .hero-title-lead { display: block; }
 .home-hero.has-artwork .hero-copy > .eyebrow { display: none; }
 .home-hero.has-artwork .hero-atmosphere { position: absolute; display: block; right: 0; bottom: 15rem; min-height: 0; width: 25%; }
 .home .quick-start-section { background: #0b0b0fbf; width: min(calc(100% - 3rem),1200px); margin: -12rem auto 0; border: 1px solid #765365; border-radius: 14px; }
 .home .quick-start { width: calc(100% - 2rem); padding-block: 1.25rem; }
 .home .quick-start .section-heading h2 { font-size: 1.9rem; }
 .home .quick-start-guide img { max-width: 210px; }
}
@media (max-width: 74.99rem) {
 .genre-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .quick-start { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
 .quick-start .experience-grid { grid-column: 1 / -1; }
 .home-hero .hero-atmosphere { min-height: 0; }
}
@media (max-width: 63.99rem) {
 .appearance-toggle { order: 2; margin-left: auto; }
 .menu-toggle { order: 3; margin-left: 0; }
 .primary-panel { order: 4; }
 .header-inner { flex-wrap: wrap; gap: .75rem; }
}
@media (max-width: 40rem) {
 .quick-start { gap: 1rem; }
 .quick-start .experience-grid { grid-template-columns: minmax(0,1fr); }
 .guide-bubble { position: relative; right: auto; top: auto; margin: -.5rem 0 .5rem; }
 .genre-tile { font-size: .8rem; min-height: 115px; }
 .home-hero.has-artwork .hero-copy h1 { font-size: clamp(2rem,8vw,2.8rem); }
}
/* Mode preference is retained for the browser tab session only. Hero/header/footer retain the approved cinematic identity. */
html[data-color-mode="dark"] { color-scheme: dark; --al-text-light: #f6f6f8; --al-muted: #c8bdce; --al-link: #ff9aaa; }
html[data-color-mode="dark"] body { background: #0b0b0f; color: #f6f6f8; }
html[data-color-mode="dark"] main a:not(.button):not(.genre-tile):not(.experience-card):not(.topic-card):not(.page-numbers):not(.post-page-numbers):not(.card-title a):not(.character-card-body h2 a):not(.wallpaper-categories a):not(.wallpaper-tags-nav a):not(.wallpaper-page .eyebrow a):not(.wallpaper-gallery-more):not(.character-badge):not(.card-category-link) { color: #ff9aaa; }
html[data-color-mode="dark"] main :is(.story-card,.character-card,.topic-card,.experience-card,.character-facts,.directory-filters,.quiet-empty,.wp-block-details) { background: #1b1821; border-color: #615268; color: #f6f6f8; }
html[data-color-mode="dark"] main :is(.card-title a,.character-card-body h2 a,.topic-card h2,.experience-copy h3) { color: #f6f6f8; }
html[data-color-mode="dark"] main :is(.card-excerpt,.card-meta,.character-card-body > p:not(.eyebrow),.topic-card p,.experience-copy p,.result-count) { color: #cfc4d1; }
html[data-color-mode="dark"] .character-feature-section { background: #14121a; border-color: #51434f; }
html[data-color-mode="dark"] .entry-content pre { background: #1b1821; }
html[data-color-mode="dark"] .search-field { color: #fff; background: #17151c; }
html[data-color-mode="dark"] .search-submit { color: #fff; }
html[data-color-mode="dark"] .search-field::placeholder { color: #c1b9c6; }
html[data-color-mode="dark"] main :focus-visible { outline-color: #ff9aaa; }
html[data-color-mode="light"] { color-scheme: light; }
html[data-color-mode="light"] body { background: #f6f6f8; color: #17151b; }
@media (prefers-reduced-transparency: reduce) {
 .site-header,.home .quick-start-section { background: #0b0b0f; backdrop-filter: none; }
}
/* Explicit dark surfaces also cover plugin markup without changing its standalone defaults. */
html[data-color-mode="dark"] main :is(.experience-copy .text-link,.character-facts dt) { color: #ff9aaa; }
html[data-color-mode="dark"] main .button { color: #fff; background: #a6192e; }
html[data-color-mode="dark"] main .al-tool { background: #1b1821; color: #f6f6f8; border-color: #615268; }
html[data-color-mode="dark"] main .al-tool :is(.al-tool-small,.al-quiz-progress) { color: #cfc4d1; }
html[data-color-mode="dark"] main .al-tool :is(.al-tool-eyebrow,.al-quiz-error,a) { color: #ff9aaa; }
html[data-color-mode="dark"] main .al-tool :is(.al-quiz-message,.al-quiz-choice:has(input:checked)) { background: #38212e; }
html[data-color-mode="dark"] main .al-tool :is(button,select,a):focus-visible { outline-color: #ff9aaa; }
@media (min-width: 75rem) { .home .guide-bubble { top: -1.5rem; } }
html[data-color-mode="dark"] .quick-start .experience-copy .text-link { color: #fff; }
html[data-color-mode="dark"] main .button-outline { background: transparent; color: #fff; }
/* Owner's thirteen homepage refinements, 15 October 2026. */
:root { --al-page-surface: #f6f6f8; }
html[data-color-mode="dark"] { --al-page-surface: #0b0b0f; }
.home-intro, .home-hero { background: transparent; }
.home-hero.has-artwork .hero-artwork::after { content: ""; position: absolute; inset: auto 0 0; height: 32%; background: linear-gradient(transparent,var(--al-page-surface)); pointer-events: none; }
.home-hero.has-artwork::after { mask-image: linear-gradient(#000 55%,transparent); }
.appearance-toggle { border: 0; border-radius: 0; background: transparent; }
.appearance-toggle:hover { background: transparent; color: #ff9aaa; }
.hero-quote { border: 1px solid #f6dce538; border-left-color: transparent; background: linear-gradient(90deg,#0b0b0f08,#0b0b0f9e 25%,#0b0b0fb8); border-radius: 0 12px 12px 0; }
.hero-quote blockquote, .hero-quote > p { text-shadow: 0 1px 4px #000,0 0 12px #000; }
.quick-start .experience-card { align-items: center; padding: .9rem; gap: .8rem; }
.experience-icon { flex: 0 0 42px; width: 42px; height: 42px; color: #ff6889; filter: drop-shadow(0 0 7px #ff396b66); }
.quick-start .experience-card:first-child .experience-icon { transform: rotate(-12deg); }
.quick-start .experience-copy { flex: 1; }
.quick-start .experience-copy h3 { margin-bottom: .4rem; }
.quick-start .experience-copy p { margin-bottom: .65rem; line-height: 1.45; }
.quick-start .experience-copy .text-link { display: flex; width: 100%; min-height: 36px; justify-content: center; }
.home-stories .story-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.home .home-stories .story-card { position: relative; isolation: isolate; display: flex; align-items: end; aspect-ratio: 1; min-height: 340px; background: var(--al-page-surface); border-color: #80677266; }
.home-stories .card-image-link { position: absolute; inset: 0 0 auto; height: 62%; z-index: -2; }
.home-stories .card-image { height: 100%; aspect-ratio: auto; object-fit: cover; object-position: center 28%; }
.home-stories .card-image-link::after { content: ""; position: absolute; inset: 18% 0 -1px; background: linear-gradient(transparent,var(--al-page-surface)); }
.home-stories .card-body { width: 100%; padding: 9rem 1.1rem 1.1rem; background: linear-gradient(transparent,var(--al-page-surface) 50%); }
.home-stories .card-title { font-size: 1.25rem; margin-bottom: .6rem; }
.home-stories .card-excerpt { font-size: .8rem; line-height: 1.45; margin-bottom: .8rem; }
.home-stories .eyebrow { font-size: .6rem; letter-spacing: .1em; margin-bottom: .5rem; }
.home-stories .card-meta { font-size: .65rem; padding-top: .65rem; gap: .3rem .7rem; }
.zerumiya-teaser { position: relative; isolation: isolate; overflow: hidden; border: 0; background: #0b0b0f; }
.zerumiya-teaser::before { content: ""; position: absolute; inset: 0 0 auto; height: 4rem; z-index: 2; background: linear-gradient(var(--al-page-surface),transparent); pointer-events: none; }
.zerumiya-banner-art { position: absolute; inset: 0 auto 0 0; width: 45%; z-index: -1; }
.zerumiya-banner-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 32%; }
.zerumiya-banner-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,transparent 50%,#0b0b0f); }
.zerumiya-teaser-inner { position: relative; grid-template-columns: minmax(0,1.4fr) minmax(0,.85fr); gap: 2rem; padding-block: 4.5rem 2.5rem; padding-inline-start: 38%; min-height: 320px; }
.zerumiya-teaser h2 { font-size: 2.5rem; }
.zerumiya-teaser p:not(.eyebrow) { font-size: .9rem; line-height: 1.5; }
.zerumiya-teaser blockquote { font-size: clamp(1.25rem,1.8vw,1.75rem); border: 1px solid #f6dce538; border-radius: 12px; padding: 1rem; background: #0b0b0f99; }
.zerumiya-teaser cite { display: block; font: italic .8rem/1.4 var(--al-font-body); margin-top: .7rem; }
.footer-main { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,.85fr) minmax(0,1.1fr) minmax(0,.8fr); gap: 2rem; padding-block: 1.5rem; }
.footer-brand { margin: 0; }
.footer-brand p { font-size: .75rem; line-height: 1.4; margin-block: .5rem 0; }
.footer-heading { margin-bottom: .4rem; }
.site-footer li a { display: block; padding-block: .3rem; font-size: .75rem; line-height: 1.35; min-height: 28px; }
.footer-bottom { padding-block: .7rem; line-height: 1.35; }
@media (min-width: 75rem) {
 :root { --al-header-height: 77px; }
 .header-inner { min-height: 76px; gap: 1.75rem; }
 .brand { position: relative; width: 240px; align-self: stretch; }
 .brand .custom-logo-link { position: absolute; top: 8px; left: 0; }
 .brand .custom-logo.al-compact-v2 { width: 240px; }
 .primary-panel { margin-left: 0; justify-content: flex-start; flex: 1; flex-wrap: nowrap; gap: 1.25rem; }
 .primary-navigation > .menu { flex-wrap: nowrap; gap: 1rem; }
 .site-header .search-form { width: 260px; flex: 0 0 260px; margin-left: auto; }
 .home .quick-start { padding-block: .9rem; grid-template-columns: minmax(0,1fr) minmax(0,.7fr) minmax(0,2.7fr); gap: 1.2rem; }
 .home .quick-start-guide img { max-width: 160px; }
 .home .quick-start .section-heading h2 { font-size: 1.65rem; }
 .home .quick-start .section-heading p:last-child { font-size: .85rem; line-height: 1.45; }
 .home .guide-bubble { top: -1.2rem; font-size: .65rem; max-width: 130px; }
}
@media (max-width: 74.99rem) {
 .home-stories .story-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .zerumiya-banner-art { position: relative; display: block; width: 100%; max-height: none; }
 .zerumiya-banner-art img { height: auto; width: 100%; max-height: 640px; object-fit: contain; }
 .zerumiya-banner-art::after { background: linear-gradient(transparent 70%,#0b0b0f); }
 .zerumiya-teaser-inner { padding: 1.5rem 0 2.5rem; grid-template-columns: minmax(0,1fr) minmax(0,1fr); min-height: 0; }
 .footer-main { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 40rem) {
 .home-stories .story-grid { grid-template-columns: minmax(0,1fr); }
 .home-stories .story-card { min-height: 350px; }
 .zerumiya-teaser-inner { grid-template-columns: minmax(0,1fr); }
 .footer-main { gap: 1.5rem; padding-block: 1.5rem; }
 .footer-brand { grid-column: 1 / -1; }
 .site-footer li a { min-height: 44px; display: flex; align-items: center; }
 .footer-bottom { min-height: 44px; }
 .quick-start .experience-copy .text-link { min-height: 44px; }
}

.home .home-stories .story-card { width: 100%; }
.home .home-stories.site-container { width: min(calc(100% - 3rem),1320px); }
@media (max-width: 74.99rem) {
 .home-hero.has-artwork .hero-inner { background: #0b0b0f; }
 .home-hero.has-artwork .hero-artwork::after { background: linear-gradient(transparent,#0b0b0f); }
 .home-intro { background: #0b0b0f; }
 .home-intro::after { content: ""; display: block; height: 3rem; background: linear-gradient(#0b0b0f,var(--al-page-surface)); }
}
/* Second annotated review: compact rhythm, stable card text and full-width scenes. */
.home .quick-start .experience-card { background: #0e0d13; border-color: #554453; }
.home-genres { padding-block: 2rem; }
.home-genres .section-heading { margin-bottom: 1.2rem; }
.home-genres .genre-tile { min-height: 112px; }
.home .home-stories.site-container { width: min(calc(100% - 3rem),var(--al-content-width)); }
.home-stories { padding-block: 1.75rem; }
.home-stories .section-heading { margin-bottom: 1.2rem; }
.home .home-stories .story-card { display: block; aspect-ratio: auto; min-height: 0; height: 100%; }
.home-stories .card-image-link { height: 100%; }
.home-stories .card-image-link::after { inset: 0; background: linear-gradient(transparent 35%,#f6f6f8e8 65%,#f6f6f8 100%); }
html[data-color-mode="dark"] .home-stories .card-image-link::after { background: linear-gradient(transparent 35%,#0b0b0fe8 65%,#0b0b0f 100%); }
.home-stories .card-body { display: grid; align-content: start; gap: .4rem; padding: 7rem .9rem .8rem; background: none; }
.home-stories .eyebrow { width: fit-content; margin: 0; padding: .15rem .35rem; border-radius: 4px; background: #f6f6f8ed; line-height: 1.3; }
html[data-color-mode="dark"] .home-stories .eyebrow { background: #0b0b0fed; }
.home-stories .card-title { font-size: 1.1rem; line-height: 1.2; min-block-size: 3.6em; margin: 0; }
.home-stories .card-excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; font-size: .8rem; line-height: 1.4; block-size: 4.2em; margin: 0; }
.home-stories .card-meta { padding-top: .5rem; margin: .2rem 0 0; }
.home-play { position: relative; z-index: 1; padding-block: 1.5rem; }
.home-play .section-heading { margin-bottom: 1.2rem; }
.home .home-play .experience-card { padding: 1.15rem; background: #eae5eb; border-color: #afa4b2; color: #17151b; }
html[data-color-mode="dark"] .home .home-play .experience-card { background: #101016; border-color: #554453; color: #f6f6f8; }
.home-play .experience-copy h3 { font-size: 1.15rem; margin-bottom: .4rem; }
.home-play .experience-copy p { margin-bottom: .65rem; }
.experience-number { font-family: var(--al-font-body); font-size: .95rem; font-variant-numeric: tabular-nums; line-height: 1; text-align: center; }
/* Bottom-anchored scene extends into the preceding whitespace, with a soft top mask. */
.zerumiya-teaser { overflow: visible; background: transparent; }
.zerumiya-teaser::before { display: none; }
.zerumiya-banner-art { position: absolute; inset: auto 0 0; width: 100%; height: calc(100% + 6rem); max-height: none; mask-image: linear-gradient(transparent,#000 32%); }
.zerumiya-banner-art img { width: 100%; height: 100%; max-height: none; object-fit: cover; object-position: center 28%; }
.zerumiya-banner-art::after { background: linear-gradient(90deg,#0b0b0f05 20%,#0b0b0fcc 48%,#0b0b0fb8); }
.zerumiya-teaser-inner { padding: 3rem 0; min-height: 370px; grid-template-columns: minmax(0,.9fr) minmax(0,1.25fr) minmax(250px,.8fr); gap: 2rem; }
.zerumiya-teaser-inner::before { content: ""; }
.zerumiya-teaser-inner > div { max-width: 470px; }
.zerumiya-teaser blockquote { min-width: 0; font-size: clamp(1.25rem,1.6vw,1.6rem); line-height: 1.35; overflow-wrap: normal; }
.site-footer { position: relative; isolation: isolate; background: #0b0b0f; }
.footer-scene { position: absolute; inset: 0; z-index: -1; }
.footer-scene img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; display: block; }
.footer-scene::after { content: ""; position: absolute; inset: 0; background: #0b0b0fd4; }
@media (max-width: 74.99rem) {
 .zerumiya-teaser-inner { grid-template-columns: minmax(0,1.3fr) minmax(240px,1fr); padding-block: 3rem; }
 .zerumiya-teaser-inner::before { display: none; }
 .zerumiya-teaser-inner > div { padding: 1rem; background: #0b0b0fba; border-radius: 12px; }
 .zerumiya-banner-art::after { background: #0b0b0f88; }
 .zerumiya-teaser blockquote { background: #0b0b0fba; }
}
@media (max-width: 40rem) {
 .zerumiya-teaser-inner { grid-template-columns: minmax(0,1fr); gap: 1.25rem; }
 .zerumiya-teaser-inner > div { max-width: none; }
 .zerumiya-banner-art img { object-position: 30% bottom; }
 .zerumiya-teaser blockquote { max-width: none; }
 .home-stories .card-title { min-block-size: 0; }
}


.home-stories .card-body { background: linear-gradient(transparent 7rem,#f6f6f8e8 10rem,#f6f6f8); }
html[data-color-mode="dark"] .home-stories .card-body { background: linear-gradient(transparent 7rem,#0b0b0fe8 10rem,#0b0b0f); }
.zerumiya-banner-art img { object-position: center top; }
.footer-scene img { object-position: center; }
@media (max-width: 40rem) { .zerumiya-banner-art img { object-position: 30% top; } }

/* Footer-only annotated corrections. */
.footer-scene::after { background: radial-gradient(circle,rgba(0, 0, 0, 1) 0%, rgba(252, 70, 107, 0) 100%); }
.site-footer { border-top: 1px solid #eadce55c; }
.footer-brand .custom-logo.al-compact-v2 { width: 220px; max-width: 100%; height: auto; }
.site-footer .footer-play li a { padding-block: .15rem; min-height: 24px; }
@media (max-width: 40rem) {
 .footer-brand .custom-logo.al-compact-v2 { width: 180px; }
 .site-footer .footer-play li a { min-height: 44px; }
}
.site-footer { text-shadow: 0 1px 2px #000,0 0 5px #000; }

/* Transparent homepage quiz cards and uniformly compact footer navigation. */
.home .home-play .experience-card,
html[data-color-mode="dark"] .home .home-play .experience-card { background: transparent; }
.site-footer .footer-main li a { padding-block: .15rem; min-height: 24px; }
.footer-main { padding-block: 1rem; }
.footer-bottom { padding-block: .5rem; }
@media (max-width: 40rem) {
 .site-footer .footer-main li a { min-height: 44px; }
}

/* Owner-supplied genre art, with compact bottom-aligned captions. */
.home-genres .genre-tile { min-height: 140px; border-radius: 6px; gap: .25rem; padding: .65rem .4rem; }
.genre-image { position: absolute; inset: 0; z-index: -2; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.home-genres .genre-tile::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(transparent 25%,#0b0b0f55 45%,#0b0b0fe8 75%,#0b0b0ff5); }
.home-genres .genre-icon { filter: drop-shadow(0 1px 2px #000); }
.home-genres .genre-tile > span { line-height: 1.25; text-align: center; text-shadow: 0 1px 2px #000; }

/* Compact homepage heading rhythm and intentional quote line breaks. */
.home :is(.home-genres,.home-stories,.character-feature-section,.home-play) .section-heading { margin-bottom: .75rem; }
.home :is(.home-genres,.home-stories,.character-feature-section,.home-play) .section-heading h2 { font-size: clamp(1.6rem,3vw,2.25rem); margin-bottom: 0; }
.home :is(.home-genres,.home-stories,.character-feature-section,.home-play) .section-heading .eyebrow { font-size: .6rem; letter-spacing: .1em; line-height: 1.3; margin: 0 0 .25rem; padding: 0; background: none; }
.home-genres { padding-bottom: 0; }
.character-feature-section .home-section { padding-block: 1.75rem; }
.hero-quote > p:last-child { text-align: right; color: #ff8b99; }
.teaser-quote-line { display: block; overflow-wrap: anywhere; }
.teaser-quote-indent { margin-inline-start: 2ch; }
.zerumiya-teaser cite { text-align: right; }

/* Compact Quick Start copy and consistent homepage action arrows. */
.action-arrow { display: inline-block; flex: 0 0 18px; width: 18px; height: 18px; vertical-align: -.2em; }
.home :is(.section-heading > .text-link,.home-play .text-link) { text-decoration: none; }
.home .section-heading > .text-link { display: inline-flex; align-items: center; gap: .3rem; }
.home .experience-copy .text-link { display: inline-flex; align-items: center; gap: .3rem; }
.home .quick-start .section-heading .eyebrow { margin-bottom: .3rem; line-height: 1.2; }
.home .quick-start .section-heading h2 { font-size: 1.55rem; line-height: 1.08; margin-bottom: .4rem; }
.home .quick-start .section-heading p:last-child { font-size: .8rem; line-height: 1.3; }
.home .quick-start .experience-card { padding: .8rem; gap: .65rem; }
.home .quick-start .experience-copy h3 { font-size: 1.05rem; line-height: 1.15; margin-bottom: .25rem; }
.home .quick-start .experience-copy p { font-size: .8rem; line-height: 1.3; margin-bottom: .4rem; }
.home .quick-start .experience-copy .text-link { display: flex; font-size: .78rem; line-height: 1.2; padding-block: .4rem; }
.home .quick-start .experience-icon { flex-basis: 48px; width: 48px; height: 48px; filter: drop-shadow(0 0 5px #ff6889a6) drop-shadow(0 0 12px #ff396b70); }
.home .guide-bubble { left: -1.5rem; right: auto; border-radius: 1rem 1rem 0 1rem; transform: rotate(5deg); }
.guide-bubble::after { content: ""; position: absolute; right: .8rem; bottom: -5px; width: 8px; height: 8px; background: #fff; border-right: 1px solid #decbd4; border-bottom: 1px solid #decbd4; transform: rotate(45deg); }
.bubble-heart { display: inline-block; color: #d92746; vertical-align: -.15em; }
@media (max-width: 40rem) {
 .home .guide-bubble { left: auto; top: auto; margin: 0 0 .5rem; }
 .quick-start-guide { display: flex; flex-direction: column; align-items: center; }
 .guide-bubble { order: -1; }
}

/* Reference-aligned Quick Start: clear callout, consistent card rows. */
.home .quick-start .experience-card { align-items: stretch; }
.home .quick-start .experience-icon { align-self: center; }
.home .quick-start .experience-copy { display: grid; grid-template-rows: auto 1fr auto; gap: .35rem; }
.home .quick-start .experience-copy h3 { margin: 0; font-size: 1.1rem; font-weight: 600; }
.home .quick-start .experience-copy p { margin: 0; min-block-size: 2.6em; font-size: .85rem; }
.home .quick-start .section-heading h2 { font-size: 1.9rem; font-weight: 700; line-height: 1.08; }
.home .quick-start .section-heading p:last-child { font-size: .9rem; font-weight: 400; line-height: 1.35; }
.home .quick-start .section-heading .eyebrow { font-size: .7rem; font-weight: 600; }
.home .quick-start-guide { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); align-self: center; align-items: start; gap: .25rem; }
.home .quick-start-guide img { grid-column: 2; grid-row: 1; align-self: end; }
.home .guide-bubble { position: relative; grid-column: 1; grid-row: 1; left: auto; right: auto; top: auto; max-width: none; margin: .5rem 0 0; padding: .55rem; font-size: .65rem; transform: rotate(-5deg); }
.zerumiya-teaser .button { display: inline-flex; align-items: center; gap: .35rem; }
@media (min-width: 75rem) {
 .home .quick-start { grid-template-columns: minmax(0,1fr) minmax(0,1.15fr) minmax(0,2.85fr); gap: 1rem; }
}
@media (max-width: 40rem) {
 .home .quick-start-guide { grid-template-columns: minmax(0,1fr); }
 .home .quick-start-guide img { grid-column: 1; grid-row: 2; }
 .home .guide-bubble { margin: 0 0 .7rem; }
 .home .quick-start .section-heading h2 { font-size: 1.65rem; }
 .home .quick-start .section-heading p:last-child { font-size: .85rem; }
}

/* Final chibi callout placement: two lines, no pointer. */
.home .guide-bubble { width: max-content; max-width: calc(100% + 1rem); transform: translate(-.75rem,-.75rem) rotate(-5deg); }
.home .guide-bubble::after { display: none; }
.home .quick-start-guide img { align-self: center; transform: scale(1.2); transform-origin: center; }

@media (min-width: 75rem) { .home .quick-start-guide img { transform: translateX(.25rem) scale(1.2); } }

/* One persistent top bar across home, articles, archives and inner pages. */
.site-header { position: sticky; top: 0; z-index: 50; background: #0b0b0ff2; backdrop-filter: blur(8px); }
.admin-bar .site-header { top: 32px; }
@media (max-width: 48.875rem) { .admin-bar .site-header { top: 46px; } }
@media (max-width: 37.5rem) { .admin-bar .site-header { top: 0; } }
@media (max-width: 63.99rem) {
 .site-header:has(.primary-panel[data-open="true"]) { max-height: 100dvh; overflow-y: auto; }
 .admin-bar .site-header:has(.primary-panel[data-open="true"]) { max-height: calc(100dvh - 46px); }
}
@media (prefers-reduced-transparency: reduce) { .site-header { background: #0b0b0f; backdrop-filter: none; } }

/* Shared bottom hero: allow its upward fade without covering inner-page copy. */
body:not(.home) .zerumiya-teaser { margin-top: 6rem; }
.zerumiya-teaser :focus-visible { outline-color: #ff9aaa; }

/* Desktop transparent top bar and owner's shorter homepage hero. */
@media (min-width: 64rem) {
 .site-header { background: transparent; backdrop-filter: none; border-bottom: 0; box-shadow: none; transition: background-color .25s ease,backdrop-filter .25s ease,box-shadow .25s ease; }
 .site-header.is-scrolled { background: #0b0b0fa1; backdrop-filter: blur(8px); box-shadow: black 0 1px 10px; }
 html[data-color-mode="light"] body:not(.home) .site-header:not(.is-scrolled) .primary-navigation > .menu > li > a,
 html[data-color-mode="light"] body:not(.home) .site-header:not(.is-scrolled) .appearance-toggle { color: #17151b; }
 html[data-color-mode="light"] body:not(.home) .site-header:not(.is-scrolled) .primary-navigation > .menu > .current-menu-item > a { color: #a6192e; }
 .site-header.is-scrolled .primary-navigation a { color: #f6f6f8; }
 .site-header.is-scrolled .primary-navigation :is(.current-menu-item > a,a:hover) { color: #ffe3ea; }
}
@media (min-width: 75rem) {
 .home-hero.has-artwork { height: 33.768vw; min-height: 420px; grid-template-rows: minmax(0,1fr); }
 .home-hero.has-artwork .hero-artwork { height: 100%; align-self: stretch; }
 .home-hero.has-artwork .hero-artwork img { height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 70% top; }
 .home-hero.has-artwork .hero-inner { height: 100%; padding-top: calc(var(--al-header-height) + 1.5rem); padding-bottom: 2rem; }
 .home-hero.has-artwork .hero-copy h1 { font-size: clamp(2.43rem,3.87vw,3.6rem); line-height: 1.02; margin-bottom: 0; }
 .home-hero.has-artwork .hero-copy h1 em { font-size: 1.35em; line-height: 1; margin-top: -.05em; }
 .home-hero.has-artwork .hero-description { margin-top: .6rem; margin-bottom: 0; }
 .home-hero.has-artwork .hero-actions { margin-top: .75rem; }
 .home-hero.has-artwork .hero-atmosphere { bottom: 4.5rem; }
 .home .quick-start-section { margin-top: -2rem; }
 .home-hero.has-artwork .hero-artwork::after { height: 28%; }
}
@media (prefers-reduced-motion: reduce) { .site-header { transition: none; } }
@media (min-width: 64rem) and (prefers-reduced-transparency: reduce) {
 .site-header.is-scrolled { background: #0b0b0f; backdrop-filter: none; }
}

@media (min-width: 64rem) and (max-width: 74.99rem) {
 html[data-color-mode="light"] .home .site-header:not(.is-scrolled) .primary-navigation > .menu > li > a,
 html[data-color-mode="light"] .home .site-header:not(.is-scrolled) .appearance-toggle { color: #17151b; }
 html[data-color-mode="light"] .home .site-header:not(.is-scrolled) .primary-navigation > .menu > .current-menu-item > a { color: #a6192e; }
}

/* Owner-marked desktop quote and Quick Start positions. */
.hero-quote { border: 0; }
@media (min-width: 75rem) {
 .home-hero.has-artwork .hero-atmosphere { bottom: calc(4.5rem + clamp(0px,calc(22.5vw - 288px),110px)); }
 .home .quick-start-section { margin-top: calc(-2rem - clamp(0px,calc(24.5vw - 313.6px),120px)); }
}

/* Tighter marked homepage headings and character copy, without a section panel. */
.home .character-feature-section,
html[data-color-mode="dark"] .home .character-feature-section { background: transparent; border: 0; }
.home :is(.home-genres,.home-stories,.character-feature-section) .section-heading .eyebrow { margin-bottom: .1rem; line-height: 1.15; }
.home :is(.home-genres,.home-stories,.character-feature-section) .section-heading h2 { line-height: 1.1; }
.home .character-feature-section .character-card-body .eyebrow { margin-bottom: .4rem; line-height: 1.3; }
.home .character-feature-section .character-card-body h2 { margin-bottom: .5rem; line-height: 1.12; }
.home .character-feature-section .character-card-body > p:not(.eyebrow) { line-height: 1.45; margin-bottom: .65rem; }

/* One content-section gap, matching the space above Guides. */
.home :is(.home-genres,.home-stories,.home-play),
.home .character-feature-section .home-section { padding-block: 1.75rem 0; }
.site-header .search-field { min-height: 40px; padding-block: .4rem; line-height: 1.4; }
.site-header .search-submit { inset-block: 0; }
@media (max-width: 63.99rem) { .site-header .search-field { min-height: 44px; } }

.home .home-intro { position: relative; }
.home .home-intro::after { position: absolute; inset: 100% 0 auto; height: 1.75rem; pointer-events: none; }

/* Native featured-image headers and blended article cards. */
.page-intro,.article-header,.character-profile-header { border-bottom: 0; }
.has-featured-hero #main-content { margin-top: calc(-1 * var(--al-header-height)); }
:is(.page-intro,.article-header,.character-profile-header).has-featured-art { position: relative; isolation: isolate; overflow: hidden; background: #0b0b0f; color: #f6f6f8; padding-top: calc(var(--al-header-height) + clamp(2.75rem,6vw,5rem)); padding-bottom: 5rem; }
.featured-header-art { position: absolute; inset: 0; z-index: -2; }
.featured-header-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
:is(body.category,body.tax-al_wallpaper_category,body.tax-al_wallpaper_tag,body.post-type-archive-al_wallpaper,body.post-type-archive-al_character) .page-intro .featured-header-art img { object-position: center top; }
.has-featured-art::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#0b0b0fe8,#0b0b0fcc 55%,#0b0b0f88); }
.has-featured-art::after { content: ""; position: absolute; inset: auto 0 0; height: 4rem; background: linear-gradient(transparent,var(--al-page-surface)); pointer-events: none; }
.has-featured-art > :is(.reading-container,.site-container) { position: relative; z-index: 1; }
.featured-header-credit { position: absolute; z-index: 2; right: 1rem; bottom: .6rem; max-width: calc(100% - 2rem); padding: .25rem .5rem; margin: 0; border-radius: 4px; background: #0b0b0fe8; color: #f6f6f8; font-size: .75rem; }
.featured-header-credit a,.featured-header-credit a:visited { color: #ffb9c6; }
html[data-color-mode="light"] body.has-featured-hero .site-header:not(.is-scrolled) .primary-navigation > .menu > li > a,
html[data-color-mode="light"] body.has-featured-hero .site-header:not(.is-scrolled) .appearance-toggle { color: #f6f6f8; }
html[data-color-mode="light"] body.has-featured-hero .site-header:not(.is-scrolled) .primary-navigation > .menu > .current-menu-item > a { color: #ffe3ea; }
body:not(.home) .story-grid .story-card { background: var(--al-page-surface); }
html[data-color-mode="dark"] body:not(.home) main .story-grid .story-card { background: var(--al-page-surface); }
body:not(.home) .story-card .card-image-link { position: relative; }
body:not(.home) .story-card .card-image-link::after { content: ""; position: absolute; inset: auto 0 -1px; height: 45%; background: linear-gradient(transparent,var(--al-page-surface)); pointer-events: none; }
body:not(.home) .story-card .card-body { position: static; background: var(--al-page-surface); }
body:not(.home) .story-card .card-title { min-block-size: 2.4em; line-height: 1.2; }
body:not(.home) .story-card .card-excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; line-height: 1.45; block-size: 4.35em; }

/* Editorial review: softer hero fade, compact body start and quiet table grid. */
:is(.page-intro,.article-header,.character-profile-header).has-featured-art { padding-bottom: 8rem; }
.has-featured-art::after { bottom: -1px; height: calc(8rem + 1px); }
.article-body { padding-top: 0; }
.page-numbers:is(.next,.prev) { display: inline-flex; align-items: center; gap: .35rem; }
.pagination-arrow-prev .action-arrow { transform: rotate(180deg); }
html[data-color-mode="dark"] main table,
html[data-color-mode="dark"] main :is(th,td) { border-color: #514a58; }
html[data-color-mode="dark"] main tr:has(> th):not(:has(> td)) > th { border-bottom-color: #d5cfd9; }

/* Keep article and character header-to-content spacing 25% more compact. */
.article-header:not(.has-featured-art) { padding-bottom: clamp(2.0625rem,4.5vw,3.75rem); }
.character-profile-header:not(.has-featured-art) { padding-bottom: 2.25rem; }
.character-profile-body { padding-top: 2.25rem; }
:is(.article-header,.character-profile-header).has-featured-art { padding-bottom: 6rem; }
:is(.article-header,.character-profile-header).has-featured-art::after { height: calc(6rem + 1px); }
@media (max-width: 40rem) {
 .character-profile-header:not(.has-featured-art) { padding-bottom: 1.5rem; }
}

/* Discover and Play: continuous opening artwork and compact section rhythm. */
:is(.discover-page,.play-page) .home-section { padding-block: 0; }
:is(.discover-page,.play-page) > .home-section { margin-top: 1.75rem; }
:is(.discover-page,.play-page,.tool-page) .hub-intro.has-featured-art { position: relative; isolation: isolate; background: #0b0b0f; }
:is(.discover-page,.play-page,.tool-page) .hub-intro > .page-intro.has-featured-art { background: transparent; isolation: auto; overflow: visible; }
:is(.discover-page,.play-page,.tool-page) .hub-intro > .page-intro.has-featured-art::before,
:is(.discover-page,.play-page,.tool-page) .hub-intro > .page-intro.has-featured-art::after { content: none; }
:is(.discover-page,.play-page,.tool-page) .hub-intro > .featured-header-art img { object-position: center top; }
:is(.discover-page,.play-page,.tool-page) .hub-intro.has-featured-art::before { background: linear-gradient(90deg,#0b0b0fd1,#0b0b0fa8 55%,#0b0b0f59); }
:is(.discover-page,.play-page,.tool-page) .hub-intro.has-featured-art::after { height: clamp(8rem,12vw,14rem); }
.discover-page .discover-topics { position: relative; z-index: 1; }
.discover-page .topic-card { background: #ffffffd9; }
html[data-color-mode="dark"] main.discover-page .topic-card { background: #1b1821bf; }
.discover-page .topic-card > .topic-arrow { color: #a6192e; }
html[data-color-mode="dark"] main.discover-page .topic-card > .topic-arrow { color: #ffb9c6; }
.discover-page .topic-arrow .action-arrow { width: 24px; height: 24px; transform: rotate(-45deg); }

/* Discover genre and tool cards follow the approved homepage details. */
:is(.discover-page,.play-page) .home-section .section-heading { margin-bottom: .75rem; }
:is(.discover-page,.play-page) .home-section .section-heading h2 { font-size: clamp(1.6rem,3vw,2.25rem); line-height: 1.1; margin-bottom: 0; }
.discover-page .home-genres .section-heading .eyebrow { font-size: .6rem; letter-spacing: .1em; line-height: 1.15; margin: 0 0 .1rem; padding: 0; background: none; }
:is(.discover-page,.play-page) .experience-card { align-items: center; background: #eeebf0; }
html[data-color-mode="dark"] main:is(.discover-page,.play-page) .experience-card { background: #101016; }
:is(.discover-page,.play-page,.home-play) .experience-icon { flex-basis: 48px; width: 48px; height: 48px; filter: drop-shadow(0 0 5px #ff6889a6) drop-shadow(0 0 12px #ff396b70); }
:is(.discover-page,.play-page) .experience-card:first-child .experience-icon { transform: rotate(-12deg); }

.play-page .play-intro > .home-section { position: relative; z-index: 1; }
.play-page .play-intro.has-featured-art .section-heading h2 { color: #f6f6f8; }

/* Play cards: translucent surfaces and upright quiz symbols. */
.play-page .experience-card { background: #eeebf0d9; }
html[data-color-mode="dark"] main.play-page .experience-card { background: #101016bf; }
.play-page > .home-section .experience-card:first-child .experience-icon { transform: none; }

/* About only: artwork continues behind editorial copy and fades before its end. */
.about-page.has-about-art { position: relative; isolation: isolate; }
.about-page.has-about-art > .featured-header-art { bottom: 4rem; }
.about-page.has-about-art > .featured-header-art img { object-position: center top; }
.about-page.has-about-art::before { content: ""; position: absolute; inset: 0 0 4rem; z-index: -1; background: linear-gradient(180deg,#0b0b0f70,#0b0b0f99 16rem,#0b0b0fcc 40rem,#0b0b0ff0); }
.about-page.has-about-art::after { content: ""; position: absolute; inset: auto 0 4rem; height: clamp(8rem,15vw,16rem); z-index: -1; background: linear-gradient(transparent,var(--al-page-surface)); pointer-events: none; }
.about-page.has-about-art > .article-header { background: transparent; isolation: auto; overflow: visible; }
.about-page.has-about-art > .article-header::before,
.about-page.has-about-art > .article-header::after { content: none; }
html[data-color-mode="light"] .about-page.has-about-art::before { background: linear-gradient(180deg,#0b0b0f70,#0b0b0f94 12rem,#f6f6f8d1 28rem,#f6f6f8e0 65%); }
.about-brand-name { color: #ff8b99; white-space: nowrap; }
@supports (background-clip: text) or (-webkit-background-clip: text) {
 .about-brand-name { background: linear-gradient(105deg,#fff8ed,#f5e5c8 52%,#ff8a9b 58%,#ff4664 80%,#f73354); background-clip: text; -webkit-background-clip: text; color: transparent; }
}
@media (forced-colors: active) {
 .about-brand-name { background: none; color: CanvasText; }
}

/* Play tool pages: translucent darker panels over the continuous artwork. */
.tool-page .home-section { position: relative; z-index: 1; padding-block: 0 1.75rem; }
.tool-page .al-tool { background: #eeebf0e0; }
html[data-color-mode="dark"] main.tool-page .al-tool { background: #101016d1; }
.tool-page .al-tool > h2 { margin-top: 1rem; }

/* Match category artwork headers to the Characters archive, allowing longer copy to grow. */
:is(body.category,body.tax-al_wallpaper_category,body.tax-al_wallpaper_tag,body.post-type-archive-al_wallpaper) .page-intro.has-featured-art { min-height: 30.6rem; }
@media (max-width: 40rem) {
 :is(body.category,body.tax-al_wallpaper_category,body.tax-al_wallpaper_tag,body.post-type-archive-al_wallpaper) .page-intro.has-featured-art { min-height: 30.85rem; }
}

/* Compact directory controls and quieter character card surfaces. */
.post-type-archive-al_character .directory-content { padding-top: 1rem; }
.post-type-archive-al_character .directory-filters { background: #eeebf0d9; }
.character-card-body { flex: 1; background: #f1eef3; }
html[data-color-mode="dark"] main .directory-filters { background: #101016bf; }
html[data-color-mode="dark"] main .character-card-body { background: #101016; }

.contact-page .article-header.has-featured-art .featured-header-art img { object-position: center top; }

/* Zerumiya-only continuous artwork behind the complete introduction. */
.zerumiya-page > .page-intro.has-featured-art { padding-bottom: 4rem; background: transparent; isolation: auto; }
.zerumiya-page > .home-section { position: relative; z-index: 1; padding-top: 0; }
.zerumiya-page.has-zerumiya-art { position: relative; isolation: isolate; }
.zerumiya-page > .featured-header-art img { object-position: center top; }
.zerumiya-page.has-zerumiya-art::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg,#0b0b0f99,#0b0b0fc7 28rem,#0b0b0fdd 80%,var(--al-page-surface)); }
.zerumiya-page.has-zerumiya-art::after { content: ""; position: absolute; inset: auto 0 0; height: clamp(6rem,15vw,12rem); z-index: -1; background: linear-gradient(transparent,var(--al-page-surface)); pointer-events: none; }
.zerumiya-page > .page-intro.has-featured-art::before,
.zerumiya-page > .page-intro.has-featured-art::after { content: none; }
html[data-color-mode="light"] .zerumiya-page.has-zerumiya-art::before { background: linear-gradient(180deg,#0b0b0f99,#0b0b0f99 12rem,#f6f6f8e6 25rem,#f6f6f8eb 80%,var(--al-page-surface)); }

/* Native wallpaper posts keep their authored images and download controls in the reading flow. */
.wallpaper-page .featured-header-art img { object-position: center top; }
.wallpaper-body { padding-top: 2rem; }
.wallpaper-body .entry-content img { max-width: 100%; height: auto; }
.wallpaper-card-action { display: flex; align-items: center; gap: .35rem; font-size: .85rem; margin-bottom: 0; }

.wallpaper-categories { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.wallpaper-categories a { color: var(--al-link); display: inline-flex; align-items: center; min-height: 44px; padding: .5rem .85rem; border: 1px solid #a89baa; border-radius: 24px; text-decoration: none; }
.wallpaper-categories a[aria-current="page"] { font-weight: 700; }
.wallpaper-categories a:is(:hover,:focus-visible,[aria-current="page"]) { background: #a6192e; border-color: #a6192e; color: #fff; text-decoration: none; }

/* Image-only wallpaper archive masonry; native image ratios determine each tile's height. */
.wallpaper-masonry { columns: 3; column-gap: .75rem; }
.wallpaper-tile { display: block; width: 100%; margin: 0 0 .75rem; break-inside: avoid; border-radius: 12px; overflow: hidden; background: #101016; }
.wallpaper-tile-link { position: relative; display: block; color: #fff; text-decoration: none; }
.wallpaper-tile-image { display: block; width: 100%; height: auto; }
.wallpaper-tile-placeholder { aspect-ratio: 4 / 3; background: linear-gradient(135deg,#451b29,#101016); }
.wallpaper-tile-overlay { position: absolute; inset: 0; display: grid; place-items: center; padding: 1.25rem; background: #0006; opacity: 0; transition: opacity .2s ease; pointer-events: none; }
.wallpaper-tile-overlay h2 { margin: 0; color: #fff; text-align: center; font-size: clamp(1.25rem,2vw,1.8rem); line-height: 1.2; text-shadow: 0 1px 4px #000c; }
.wallpaper-tile-link:is(:hover,:focus-visible,:active) .wallpaper-tile-overlay { opacity: 1; }
.wallpaper-tile:focus-within { outline: 3px solid #ff6889; outline-offset: 4px; }
.wallpaper-tile-link:focus-visible { outline: none; }
@media (max-width: 64rem) { .wallpaper-masonry { columns: 2; } }
@media (max-width: 36rem) { .wallpaper-masonry { columns: 1; } }
@media (prefers-reduced-motion: reduce) { .wallpaper-tile-overlay { transition: none; } }


/* Small shaded tag pills below the category navigation. */
.wallpaper-tags-nav { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: 0; margin: 0 0 1.5rem; font-size: .85rem; }
.wallpaper-tags-nav a { color: var(--al-link); display: inline-flex; align-items: center; min-height: 32px; padding: .25rem .75rem; background: #eeebf0; border: 0; border-radius: 999px; text-decoration: none; }
.wallpaper-tags-nav a:is(:hover,:focus-visible,[aria-current="page"]) { background: #a6192e; color: #fff; text-decoration: none; }
.wallpaper-tags-nav a[aria-current="page"] { font-weight: 700; }
:where(html[data-color-mode="dark"]) .wallpaper-tags-nav a { background: #101016; }
@media (pointer: coarse) { .wallpaper-tags-nav a { min-height: 44px; } }

/* Single wallpaper artwork shows its full vertical extent behind the reading flow. */
.wallpaper-article.has-wallpaper-art { position: relative; isolation: isolate; min-height: calc(100vw / var(--wallpaper-art-ratio)); }
.wallpaper-article.has-wallpaper-art > .featured-header-art { inset: 0; }
.wallpaper-article.has-wallpaper-art > .featured-header-art img { object-fit: cover; object-position: center top; }
.wallpaper-article.has-wallpaper-art::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg,#0b0b0f70,#0b0b0f99 25%,#0b0b0fd9 70%,var(--al-page-surface)); }
.wallpaper-article.has-wallpaper-art > .article-header.has-featured-art { background: transparent; isolation: auto; overflow: visible; }
.wallpaper-article.has-wallpaper-art > .article-header.has-featured-art::before,
.wallpaper-article.has-wallpaper-art > .article-header.has-featured-art::after { content: none; }
.wallpaper-article.has-wallpaper-art > .wallpaper-body { position: relative; z-index: 1; }
html[data-color-mode="light"] .wallpaper-article.has-wallpaper-art::before { background: linear-gradient(180deg,#0b0b0f70,#0b0b0f94 12rem,#f6f6f8d1 28rem,#f6f6f8e6 70%,var(--al-page-surface)); }

/* Wallpaper reading links stay quiet; the eyebrow replaces the removed breadcrumb. */
.wallpaper-page .al-wallpaper-download a,
.wallpaper-page .al-wallpaper-content noscript a,
.wallpaper-page .wallpaper-topics a { text-decoration: none; }
.wallpaper-page .article-header .eyebrow a,
.wallpaper-page .article-header .eyebrow a:is(:hover,:visited,:active) { color: inherit; text-decoration: none; background: none; border: 0; }

/* Native footer widgets inherit the existing column typography and spacing. */
.footer-column { min-width: 0; }
.footer-widget + .footer-widget { margin-top: 1.25rem; }
.footer-widget :is(h2,h3,.wp-block-heading) { font-family: var(--al-font-body); font-size: .9rem; font-weight: 600; line-height: 1.17; margin-bottom: .4rem; color: #fff; }
.footer-widget .wp-block-navigation { font-size: .75rem; }
.footer-widget .wp-block-navigation__container { display: block; }
.footer-widget .wp-block-navigation-item { display: block; }
.footer-widget .wp-block-navigation-item__content { color: #d0c8d5; }
.footer-widget .wp-block-navigation-item__content:hover { color: #ff8b99; }
.footer-heart { color: var(--al-primary); width: 1.1em; height: 1.1em; vertical-align: -.15em; margin-left: .25em; }
.back-to-top { position: fixed; z-index: 30; right: max(1.25rem,env(safe-area-inset-right)); bottom: calc(max(1.25rem,env(safe-area-inset-bottom)) + var(--al-top-footer-offset,0px)); display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 1px solid #a6192e66; border-radius: 50%; background: #fff3f5; color: #a6192e; box-shadow: 0 4px 20px #a6192e33; transition: background .2s, box-shadow .2s, transform .2s; }
.back-to-top svg { width: 24px; height: 24px; }
html[data-color-mode="dark"] .back-to-top { background: #201820; color: #ff8b99; border-color: #ff8b9966; }
.back-to-top:hover { background: #ffe3ea; box-shadow: 0 4px 24px #a6192e66; transform: translateY(-2px); }
html[data-color-mode="dark"] .back-to-top:hover { background: #35202b; }
.back-to-top:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }

/* The shortcode uses the same masonry tiles as archives inside authored content. */
.al-wallpaper-gallery { margin-block: 1.5rem 2.5rem; }
/* Shortcode-only archive-link tile participates in the existing masonry flow. */
.al-wallpaper-gallery .wallpaper-gallery-more { display: grid; align-content: center; justify-items: center; gap: .6rem; aspect-ratio: 16 / 9; min-height: 9rem; padding: 1.5rem; background: linear-gradient(135deg,#f8e7ec,#eee9f0); border: 1px solid #a6192e44; color: #a6192e; text-align: center; text-decoration: none; font-size: 1.1rem; font-weight: 600; }
.al-wallpaper-gallery .wallpaper-gallery-more:hover { background: #f8d7e0; border-color: #a6192e; }
html[data-color-mode="dark"] .al-wallpaper-gallery .wallpaper-gallery-more { background: linear-gradient(135deg,#2e1824,#15131e); border-color: #ff8b9944; color: #ff9aaa; }
html[data-color-mode="dark"] .al-wallpaper-gallery .wallpaper-gallery-more:hover { background: #3c1d2b; border-color: #ff8b99; }
.al-wallpaper-gallery .wallpaper-gallery-more:focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
.entry-content .wallpaper-tile-overlay h2 { margin: 0; }


.originals-page > .page-intro .featured-header-art img { object-fit: cover; object-position: center top; }

body.blog .page-intro .featured-header-art img { object-fit: cover; object-position: center top; }

/* Native stretched title links cover cards; secondary result links stay above them. */
.story-card,.character-card { position: relative; isolation: isolate; }
.card-primary-link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.story-card .card-title a:is(:hover,:focus-visible),
.character-card-body h2 a:is(:hover,:focus-visible) { text-decoration: none; }
.card-primary-link:focus-visible { outline: none; }
.card-primary-link:focus-visible::after { outline: 3px solid #ff6889; outline-offset: -4px; }
.card-category-link,.character-card .character-badge { position: relative; z-index: 2; }
.card-category-link,.card-category-link:visited { color: inherit; text-decoration: none; }
a.character-badge,a.character-badge:visited { color: #93213a; text-decoration: none; }
a.character-badge:hover { background: #f8d7e0; border-color: #a6192e; }

/* Compact controls share the same surface, labels and corner treatment. */
.tool-page .al-tool,.wallpaper-page .al-wallpaper-download,.directory-filters,.pagination,.page-links { --al-control-bg: #ffffffd9; --al-control-ink: #251e29; --al-control-border: #b9aeba; --al-control-label: #514857; --al-control-accent: #a6192e; }
html[data-color-mode="dark"] :is(.tool-page .al-tool,.wallpaper-page .al-wallpaper-download,.directory-filters,.pagination,.page-links) { --al-control-bg: #211c28eb; --al-control-ink: #f6f0f7; --al-control-border: #766778; --al-control-label: #d8cedf; --al-control-accent: #ff9aaa; }
.tool-page .al-tool-controls { align-items: end; gap: 1rem; }
.tool-page .al-tool-controls > div { align-content: end; gap: .4rem; }
.tool-page .al-tool-controls label,.wallpaper-page .al-wallpaper-download label,.directory-filters label { color: var(--al-control-label); font-size: .8rem; font-weight: 500; letter-spacing: .02em; line-height: 1.4; }
.wallpaper-page .al-wallpaper-download label { margin-bottom: .5rem; }
.tool-page .al-tool legend { font-size: .85rem; font-weight: 600; }
.tool-page .al-tool select,.wallpaper-page .al-wallpaper-download select,.directory-filters input,.directory-filters select { min-height: 44px; border: 1px solid var(--al-control-border); border-radius: 10px; padding: .6rem .8rem; background: var(--al-control-bg); color: var(--al-control-ink); font-size: .875rem; line-height: 1.4; box-shadow: inset 0 1px 2px #00000008; }
.tool-page .al-tool select option,.wallpaper-page .al-wallpaper-download select option,.directory-filters select option { background: #fff; color: #251e29; }
html[data-color-mode="dark"] :is(.tool-page .al-tool select option,.wallpaper-page .al-wallpaper-download select option,.directory-filters select option) { background: #211c28; color: #f6f0f7; }
.tool-page .al-tool button,.wallpaper-page .al-wallpaper-download button,.directory-filters button { min-height: 44px; padding: .6rem 1.1rem; border: 1px solid #a6192e; border-radius: 10px; background: #a6192e; color: #fff; font-size: .875rem; font-weight: 600; line-height: 1.4; box-shadow: 0 2px 10px #a6192e22; }
.tool-page .al-tool button:not(:disabled):hover,.wallpaper-page .al-wallpaper-download button:not(:disabled):hover,.directory-filters button:not(:disabled):hover { background: #bd2039; border-color: #bd2039; }
.tool-page .al-tool button:is([type=reset],[data-retry]) { background: var(--al-control-bg); color: var(--al-control-accent); border-color: var(--al-control-border); box-shadow: none; }
.tool-page .al-tool button:is([type=reset],[data-retry]):not(:disabled):hover { border-color: var(--al-control-accent); background: var(--al-control-bg); }
.wallpaper-page .al-wallpaper-download { background: #f5f1f5d9; border-color: #a89baa66; backdrop-filter: blur(8px); }
html[data-color-mode="dark"] .wallpaper-page .al-wallpaper-download { background: #101016cc; border-color: #b19cb344; }
.wallpaper-page .al-wallpaper-content figure.wp-block-image { float: none; margin-inline: auto; text-align: center; }
.wallpaper-page .al-wallpaper-content img[data-al-wallpaper-src] { display: block; margin-inline: auto; }
.primary-navigation > .menu > .menu-item-has-children > a::after { content: ""; display: inline-block; width: .4em; height: .4em; margin-left: .65em; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-.2em) rotate(45deg); }
@media (max-width: 40rem) { .tool-page .al-tool select,.wallpaper-page .al-wallpaper-download select,.directory-filters input,.directory-filters select { font-size: 1rem; } }

/* Directory controls and all native paging share the compact control language. */
.post-type-archive-al_character .directory-filters { background: #f5f1f5d9; border-color: #a89baa66; backdrop-filter: blur(8px); }
html[data-color-mode="dark"] main .directory-filters { background: #101016cc; border-color: #b19cb344; }
.directory-filters .filter-reset { min-height: 44px; padding: .6rem .9rem; border: 1px solid var(--al-control-border); border-radius: 10px; background: var(--al-control-bg); color: var(--al-control-accent); font-size: .875rem; font-weight: 500; line-height: 1.4; text-decoration: none; }
.directory-filters .filter-reset:hover { border-color: var(--al-control-accent); }
.pagination .page-numbers,.page-links a,.page-links > span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: .5rem .9rem; border: 1px solid var(--al-control-border); border-radius: 10px; background: var(--al-control-bg); color: var(--al-control-ink); font-size: .875rem; font-weight: 500; line-height: 1.4; text-decoration: none; }
.pagination .page-numbers.current,.page-links [aria-current="page"],.pagination a.page-numbers:hover,.page-links a:hover { background: #a6192e; border-color: #a6192e; color: #fff; }
.pagination .page-numbers.current,.page-links [aria-current="page"] { font-weight: 600; }
.pagination .page-numbers.dots { background: transparent; border-color: transparent; color: var(--al-control-label); }
.pagination a:focus-visible,.page-links a:focus-visible { outline: 3px solid var(--al-control-accent); outline-offset: 3px; }

/* Compact related-content headings and the shared return arrow. */
.related-section .section-heading .eyebrow { margin: 0 0 .1rem; line-height: 1.15; }
.related-section .section-heading h2 { margin-top: 0; line-height: 1.1; }
.character-facts .character-back-link { display: inline-flex; align-items: center; gap: .35rem; }
.character-back-link .action-arrow { transform: rotate(180deg); }

/* The external-link glyph inherits link colors in both color modes. */
.al-external-indicator { display: inline-block; width: .85em; height: .85em; margin-inline-start: .3em; vertical-align: -.05em; background: currentColor; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 3h7v7M21 3l-11 11M10 4H4v16h16v-6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }

/* About-only spacing and media/text paragraph alignment. */
.about-page > .page-reading { padding-top: 0; }
.about-page .entry-content > .wp-block-media-text:first-child > .wp-block-media-text__content,
.about-page .entry-content > .wp-block-media-text.has-media-on-the-right > .wp-block-media-text__content { padding-left: 0; }
.about-page .wp-block-media-text__content p { text-align: justify; }

/* Mobile-only opening composition and compact footer menus. */
@media (max-width: 40rem) {
 .home-hero.has-artwork { position: relative; isolation: isolate; background: #14121a; }
 .home-hero.has-artwork .hero-artwork { position: absolute; inset: 0; height: 100%; z-index: 0; }
 .home-hero.has-artwork .hero-artwork img { height: 100%; aspect-ratio: auto; object-fit: cover; object-position: center top; }
 .home-hero.has-artwork .hero-artwork::after { inset: 0; height: 100%; background: linear-gradient(180deg,#0b0b0f99,#0b0b0fbf 55%,#14121a); }
 .home-hero.has-artwork .hero-inner { padding-block: 2.5rem; background: transparent; }
 .home .guide-bubble { display: none; }
 .home .quick-start { padding-top: 1.25rem; }
 .home .quick-start-guide img { transform: none; grid-row: 1; }
 .home .quick-start .experience-grid { margin-top: .75rem; }
 .site-footer .footer-main li { margin-block: 0; }
 .site-footer .footer-main li a { min-height: 24px; padding-block: .15rem; line-height: 1.35; }
 .footer-widget .wp-block-navigation__container { gap: 0; }
}

/* Mobile header mirrors the desktop's transparent-to-blurred scroll state. */
@media (max-width: 40rem) {
 .site-header { background: transparent; backdrop-filter: none; border-bottom: 0; box-shadow: none; }
 .site-header.is-scrolled { background: #0b0b0fa1; backdrop-filter: blur(8px); box-shadow: black 0 1px 10px; }
 .site-header .menu-toggle { background: #0b0b0f99; }
 .site-header .primary-panel { background: #0b0b0ff2; padding: 1rem; border-radius: 10px; }
 .home #main-content { margin-top: calc(-1 * var(--al-header-height)); }
 .home-hero.has-artwork .hero-inner { padding-top: calc(var(--al-header-height) + 2.5rem); }
 html[data-color-mode="light"] body:not(.home):not(.has-featured-hero) .site-header:not(.is-scrolled) .appearance-toggle { color: #17151b; }
}
@media (max-width: 40rem) and (prefers-reduced-transparency: reduce) {
 .site-header.is-scrolled { background: #0b0b0f; backdrop-filter: none; }
 .site-header .menu-toggle { background: #0b0b0f; }
}

/* Compact oversized mobile heroes; keep Home and editorial/profile singles intact. */
@media (max-width: 40rem) {
 body:not(.home) .page-intro.has-featured-art { padding-bottom: 4rem; min-height: 0; }
 body:not(.home) .page-intro.has-featured-art::after { height: calc(4rem + 1px); }
 body:not(.single-post):not(.single-al_character) .article-header.has-featured-art { padding-bottom: 3rem; }
 body:not(.single-post):not(.single-al_character) .article-header.has-featured-art::after { height: calc(3rem + 1px); }
}

/* Mobile hub artwork uses an opening-sized canvas rather than the full card stack. */
@media (max-width: 40rem) {
 .originals-page > .hub-copy { padding-top: 0; }
 .originals-page > .hub-copy .entry-content > :first-child { margin-top: 0; }
 :is(.discover-page,.play-page,.tool-page) .hub-intro > .featured-header-art { bottom: auto; height: clamp(26rem,100vw,32rem); }
 :is(.discover-page,.play-page,.tool-page) .hub-intro > .featured-header-art img { object-fit: cover; object-position: center top; }
 :is(.discover-page,.play-page,.tool-page) .hub-intro > .featured-header-art::after { content: ""; position: absolute; inset: auto 0 0; height: 8rem; background: linear-gradient(transparent,#0b0b0f); pointer-events: none; }
}

/* Keep Zerumiya's mobile opening artwork at the same scale as Discover/Play. */
@media (max-width: 40rem) {
 .zerumiya-page.has-zerumiya-art > .featured-header-art { bottom: auto; height: clamp(26rem,100vw,32rem); }
 .zerumiya-page.has-zerumiya-art > .featured-header-art::after { content: ""; position: absolute; inset: auto 0 0; height: 8rem; background: linear-gradient(transparent,var(--al-page-surface)); pointer-events: none; }
 html[data-color-mode="light"] .zerumiya-page.has-zerumiya-art::before { background: linear-gradient(180deg,#0b0b0f99,#0b0b0f99 19rem,#f6f6f8e6 24rem,#f6f6f8eb 80%,var(--al-page-surface)); }
}

/* Intermediate screens: one continuous hero and room for navigation/content to reflow. */
@media (min-width: 40.001rem) and (max-width: 74.99rem) {
 .site-header { background: transparent; backdrop-filter: none; border-bottom: 0; box-shadow: none; }
 .site-header.is-scrolled { background: #0b0b0fa1; backdrop-filter: blur(8px); box-shadow: black 0 1px 10px; }
 .site-header:has(.primary-panel[data-open="true"]) { overflow: visible; max-height: none; }
 .site-header .primary-panel { position: absolute; inset: 100% 24px auto; width: auto; margin: 0; padding: 1rem; border: 1px solid #615268; border-radius: 10px; background: #0b0b0ff2; max-height: calc(100dvh - var(--al-header-height) - 1rem); overflow-y: auto; }
 .site-header .menu-toggle { background: #0b0b0f99; }
 .home #main-content { margin-top: calc(-1 * var(--al-header-height)); }
 .home-hero.has-artwork { position: relative; isolation: isolate; display: block; height: auto; background: #14121a; }
 .home-hero.has-artwork .hero-artwork { position: absolute; inset: 0; height: 100%; z-index: 0; }
 .home-hero.has-artwork .hero-artwork img { height: 100%; aspect-ratio: auto; object-fit: cover; object-position: center top; }
 .home-hero.has-artwork .hero-artwork::after { inset: 0; height: 100%; background: linear-gradient(0deg,#14121a,transparent 40%),linear-gradient(90deg,#0b0b0fe6,#0b0b0fb3 50%,#0b0b0f33); }
 .home-hero.has-artwork::after { display: none; }
 .home-hero.has-artwork .hero-inner { display: flex; min-height: 28rem; padding-block: calc(var(--al-header-height) + 2rem) 2rem; background: transparent; }
 .home-hero.has-artwork .hero-copy { width: 100%; max-width: 600px; }
 .home-hero.has-artwork .hero-copy h1 { font-size: clamp(2.4rem,4.3vw,3.25rem); }
 .home-hero .hero-title-lead { display: block; }
 .home .quick-start { grid-template-columns: minmax(0,1fr) minmax(160px,.6fr); gap: 1.25rem; padding-block: 1.5rem; }
 .home .quick-start-guide { display: grid; grid-template-columns: minmax(0,1fr); justify-items: center; gap: .75rem; }
 .home .quick-start-guide img { grid-area: 2 / 1; max-width: 180px; transform: none; }
 .home .guide-bubble { grid-area: 1 / 1; max-width: 170px; margin: 0; transform: rotate(-5deg); }
 .home .quick-start .experience-grid { grid-column: 1 / -1; grid-template-columns: repeat(2,minmax(0,1fr)); }
 .footer-main { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.25rem 1.5rem; }
 .footer-brand { grid-column: 1 / -1; max-width: none; }
 html[data-color-mode="light"] .home .site-header:not(.is-scrolled) .appearance-toggle { color: #fff; }
 html[data-color-mode="light"] body:not(.home):not(.has-featured-hero) .site-header:not(.is-scrolled) .appearance-toggle { color: #17151b; }
 html[data-color-mode="light"] body:not(.home) .site-header:not(.is-scrolled) .primary-navigation > .menu > li > a { color: #f6f6f8; }
 html[data-color-mode="light"] body:not(.home) .site-header:not(.is-scrolled) .primary-navigation > .menu > .current-menu-item > a { color: #ffe3ea; }
}
@media (min-width: 60rem) and (max-width: 74.99rem) {
 .home-hero.has-artwork .hero-copy { width: 58%; }
 .home .quick-start { grid-template-columns: minmax(0,1fr) 160px minmax(0,1.6fr); }
 .home .quick-start .experience-grid { grid-column: auto; grid-template-columns: minmax(0,1fr); }
 .footer-main { grid-template-columns: minmax(0,1.3fr) minmax(0,.8fr) minmax(0,1.2fr) minmax(0,.8fr); }
 .footer-brand { grid-column: auto; }
}
/* Collapse navigation before the desktop links/search row runs out of space. */
@media (min-width: 64rem) and (max-width: 74.99rem) {
 .header-inner { min-height: 78px; flex-wrap: wrap; gap: .75rem; padding-block: 1rem; }
 .site-header .custom-logo.al-compact-v2 { width: 144px; }
 .site-header .appearance-toggle { order: 2; margin-left: auto; }
 .site-header .menu-toggle { order: 3; margin-left: 0; }
 .site-header .menu-toggle:not([hidden]) { display: inline-flex !important; }
 .site-header .primary-panel { order: 4; display: block; }
 .nav-ready .primary-panel[data-open="false"],.al-js .site-header .primary-panel[data-open="false"] { display: none; }
 .primary-navigation > .menu { flex-direction: column; align-items: stretch; gap: 0; }
 .primary-navigation a { min-height: 44px; padding: .65rem .25rem; font-size: 1rem; }
 .primary-navigation .sub-menu { position: static; visibility: visible; opacity: 1; padding-inline-start: 1.25rem; }
 .site-header .search-form { width: 100%; max-width: none; margin-top: 1rem; }
}
@media (min-width: 40.001rem) and (max-width: 74.99rem) and (prefers-reduced-transparency: reduce) {
 .site-header.is-scrolled,.site-header .primary-panel { background: #0b0b0f; backdrop-filter: none; }
}