/* Official character art, editorial layers, and optional motion. */
.cover-art img{height:calc(100% + 90px);max-width:none;margin-top:-45px}
.cover-art:after{inset:0;background:linear-gradient(110deg,#1d2a3330,transparent 55%,#12181833)}
.cover-art-caption{right:3.2rem;bottom:1.4rem;text-align:right;opacity:.75}
.cover-art-caption strong{font-size:clamp(5rem,12vw,12rem)}
.cover-art-caption>span:last-child,.cover-art-caption .kicker{display:none}
.cover-content{z-index:3;pointer-events:none}
.cover-content a{pointer-events:auto}
.cover-title{width:61%}
.cover-title .incarnation{font-size:clamp(3rem,7.2vw,7rem)}
.cover-character{position:absolute;z-index:2;inset:1rem 1.6rem -2.5rem 49%;pointer-events:none}
.cover-character img{height:100%;width:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(12px 9px 0 #1117161a)}
.cover-character figcaption{position:absolute;right:9%;bottom:12%;color:var(--ink);background:var(--yellow);padding:.65rem 1.2rem;border-bottom:5px solid var(--ink);transform:rotate(-5deg);box-shadow:5px 5px 0 #111}
.cover-character figcaption span,.story-character figcaption span{display:block;font:700 .59rem/1.6 var(--mono);text-transform:uppercase;letter-spacing:.07em}
.cover-character figcaption strong{font:3.4rem/1.2 var(--display);text-transform:uppercase;display:block}
.cover-coordinate{position:absolute;z-index:1;right:3.4rem;top:1.4rem;color:var(--paper);font:700 .65rem/1.4 var(--mono);letter-spacing:.24em;writing-mode:vertical-rl}
.cover-spine{z-index:4}
.motion-toggle{color:inherit;background:transparent;border:1px solid currentColor;padding:.65rem .8rem;min-height:44px;font:700 .6rem/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase}
.motion-toggle:before{content:'Ⅱ';margin-right:.6rem;color:#bd3214}
.motion-toggle[aria-pressed=true]:before{content:'▶'}
.motion-toggle:hover{background:var(--yellow);color:var(--ink)}
.motion-toggle[hidden]{display:none}
.character-story{position:relative;isolation:isolate;overflow:hidden;background:var(--ink);color:var(--paper);border-block:5px solid var(--orange)}
.story-backdrop{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:radial-gradient(#ffffff12 1px,transparent 1px);background-size:5px 5px}
.story-backdrop:after{content:'';position:absolute;width:48%;height:140%;top:-15%;right:-10%;background:var(--orange);transform:rotate(16deg);z-index:-1}
.story-type{position:absolute;top:8%;right:8%;font:clamp(8rem,20vw,21rem)/.92 var(--display);letter-spacing:-.025em;color:transparent;-webkit-text-stroke:1px #e9e8e04d}
.story-orbit{position:absolute;width:43vw;height:43vw;max-width:620px;max-height:620px;right:4%;top:12%;border:1px solid #f4f3ef90;border-radius:50%}
.story-orbit:after{content:'';position:absolute;inset:3rem;border:1px dashed #f4f3ef55;border-radius:50%}
.story-cross{position:absolute;left:49%;top:6%;font:3.2rem/1 var(--mono);color:var(--yellow)}
.story-layout{display:grid;grid-template-columns:1fr 1fr;min-height:740px;position:relative}
.story-copy{padding-block:5.5rem 6rem;align-self:center;z-index:2}
.story-copy .kicker{color:var(--yellow);margin-bottom:1.4rem;font-size:.66rem}
.story-copy h2{font-size:clamp(3.5rem,5.7vw,5.8rem);line-height:1.13}
.story-copy h2 span{color:var(--yellow)}
.story-copy>p:not(.kicker):not(.hand-note){font:1.15rem/1.6 var(--serif);max-width:25rem;margin-top:1.7rem;color:#dedfd7}
.story-copy .hand-note{color:#ff805e;font-size:2rem;margin:2.3rem 0 2rem .5rem}
.story-character{position:relative;align-self:stretch;margin-top:1.3rem;margin-bottom:-3rem;z-index:1;min-width:0}
.story-character img{width:100%;height:100%;max-height:820px;object-fit:contain;object-position:center top;filter:drop-shadow(12px 14px 0 #10111035)}
.story-character figcaption{position:absolute;bottom:12%;left:5%;padding:.7rem 1.1rem;background:var(--paper);color:var(--ink);transform:rotate(-5deg);box-shadow:6px 6px 0 var(--ink);border-left:7px solid var(--orange)}
.story-character figcaption strong{display:block;font:clamp(2rem,3.4vw,3.2rem)/1.3 var(--display);text-transform:uppercase}
.story-bottom{position:relative;z-index:3;display:flex;justify-content:space-between;gap:1rem;padding:1rem var(--gutter);border-top:1px solid #ffffff50;background:var(--ink);font:700 .59rem/1.5 var(--mono);text-transform:uppercase;letter-spacing:.1em}
/* Content remains visible without JS; only offscreen blocks are prepared. */
.motion-active [data-reveal].reveal-pending{opacity:0;transform:translateY(25px)}
.motion-active [data-reveal]{transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}
.motion-active [data-depth]{transform:translate3d(var(--layer-x,0px),var(--layer-y,0px),0)}
.motion-active .cover-title{animation:cover-title-in .8s cubic-bezier(.18,.8,.24,1) both}
.motion-active .realm-arrow,.motion-active .arrow{display:inline-block;transition:transform .2s ease}
.motion-active a:hover>.arrow,.motion-active .realm-card:hover .realm-arrow{transform:translate(3px,-3px)}
.motion-active .dossier-card{transition:background .2s,box-shadow .2s}
.motion-active .dossier-card:hover{box-shadow:7px 7px 0 var(--orange)}
@keyframes cover-title-in{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}
html.motion-off{scroll-behavior:auto}
html.motion-off *,html.motion-off *:before,html.motion-off *:after{animation:none!important;transition:none!important}
@media(min-width:1601px){.cover-character{right:calc((100vw - 1600px)/2 + 1.5rem);left:51%}.cover-title .incarnation{font-size:7rem}}
@media(max-width:1190px){.cover-title .incarnation{font-size:7.5vw}.cover-character{left:47%;right:0;top:2rem;bottom:-1rem}.cover-character figcaption{right:9%;bottom:9%}.story-layout{min-height:650px}.story-copy{padding-block:4rem}.story-copy h2{font-size:5.7vw}.story-copy .hand-note{font-size:1.8rem}.story-character{margin-left:-1rem;margin-right:-1rem}}
@media(max-width:940px){.cover-title .incarnation{font-size:8.4vw}.cover-title{width:70%}.cover-character{left:47%;right:-3.5rem;top:7rem;bottom:0}.cover-character figcaption{right:15%;bottom:8%}.cover-character figcaption strong{font-size:2.8rem}.cover-character figcaption span{font-size:.5rem}.cover-art-caption{right:2rem;bottom:.5rem}.cover-coordinate{right:2rem}.story-layout{min-height:580px}.story-copy h2{font-size:3.3rem}.story-copy>p:not(.kicker):not(.hand-note){font-size:1.05rem;max-width:19rem}.story-copy .hand-note{font-size:1.6rem}.story-character{margin-left:-2.7rem;margin-right:-1.5rem;margin-top:3rem}.story-character figcaption{left:10%;bottom:11%;padding:.6rem .8rem}.story-character figcaption strong{font-size:2.1rem}}
@media(max-width:650px){
 .cover-title{width:100%}.cover-title .incarnation{font-size:15.5vw}.cover-content{padding-bottom:1.2rem}.cover-art{height:490px;clip-path:polygon(0 8%,100% 0,100% 100%,0 100%)}
 .cover-character{inset:auto .6rem -.8rem;height:520px;z-index:2}.cover-character img{object-position:50% bottom}.cover-character figcaption{right:5%;bottom:11%;padding:.5rem 1rem}.cover-character figcaption strong{font-size:2.8rem}.cover-character figcaption span{font-size:.52rem}
 .cover-art-caption{bottom:.5rem;right:1rem}.cover-art-caption strong{font-size:8rem}.cover-coordinate{top:auto;bottom:22rem;right:1rem;font-size:.6rem}.cover .hand-note{margin-bottom:1.8rem}
 .motion-toggle{font-size:.52rem;padding:.6rem}.folio-strip{padding-block:.5rem}
 .story-layout{grid-template-columns:1fr;min-height:0}.story-copy{padding-block:3rem 1rem}.story-copy h2{font-size:clamp(3.3rem,11vw,4.5rem)}.story-copy>p:not(.kicker):not(.hand-note){max-width:29rem;font-size:1.1rem}.story-copy .hand-note{font-size:1.8rem;margin-block:1.9rem}.story-copy .button{font-size:1.05rem}
 .story-backdrop:after{width:60%;top:37%;height:100%;right:-33%;transform:rotate(17deg)}.story-type{top:auto;bottom:12%;right:1%;font-size:42vw}.story-orbit{top:auto;bottom:15%;width:85vw;height:85vw;right:-5%}.story-cross{top:1.6rem;left:auto;right:1rem}
 .story-character{height:590px;margin:0 -.4rem -2rem}.story-character img{object-position:center top}.story-character figcaption{left:5%;bottom:9%;padding:.6rem 1rem}.story-character figcaption strong{font-size:2.5rem}.story-bottom{font-size:.51rem}.story-bottom span:last-child{display:none}
}
@media(max-width:380px){.cover-art{height:420px}.cover-character{height:445px}.cover-character figcaption strong{font-size:2.3rem}.cover-character figcaption span{font-size:.45rem}.story-character{height:490px}.story-character figcaption strong{font-size:2.1rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important}[data-depth]{transform:none!important}[data-reveal]{opacity:1!important;transform:none!important}}
@media print{.cover-character,.cover-coordinate,.motion-toggle,.story-backdrop{display:none}.story-layout{display:block;min-height:0}.story-copy{padding:1rem 0}.character-story{background:white;color:black}.story-character{height:350px;margin:0}.story-character figcaption{background:white}.story-copy h2 span{color:black}.story-copy>p:not(.kicker):not(.hand-note){color:black}[data-reveal]{opacity:1!important;transform:none!important}[data-depth]{transform:none!important}}
