/* Original artwork integration; conventional exports of supplied files. */
.brand{display:block;flex-shrink:0;width:255px;text-align:center;text-decoration:none;line-height:1.2}
.brand>span{display:block;font-size:12px;font-weight:800;letter-spacing:.07em;margin:0 0 -2px}
.brand img{display:block;width:100%;height:auto}
.site-header{padding-top:12px;padding-bottom:12px;min-height:114px;gap:24px}
.hero{grid-template-columns:45% 55%;min-height:685px}
.hero-copy{padding:45px 0 52px 11%}
.hero h1{font-size:clamp(90px,9.3vw,143px);margin-top:22px;margin-bottom:20px}
.world-tagline{font:22px/1.3 var(--display);letter-spacing:.035em;margin:0 0 14px}
.hero-intro{font-size:16px;margin:0 0 26px}
.hero-art{margin:0;transform:none;border:0;background:#101923;isolation:isolate;clip-path:polygon(6% 0,100% 0,100% 100%,0 100%)}
.hero-art::before{display:none}
.hero-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:44% center}
.hero-character-label{position:absolute;top:35px;right:25px;font:30px/1 var(--display);letter-spacing:.08em;color:white;background:var(--black);padding:13px 17px;transform:rotate(3deg);border:2px solid white}
.hero-character-label small{font:10px/1 var(--font-body);letter-spacing:.04em}
.cover-slot{display:block;width:170px;height:auto;aspect-ratio:3300/5100;right:30px;bottom:48px;transform:rotate(7deg);padding:0;background:var(--black);border:3px solid var(--black);box-shadow:6px 6px 0 white}
.cover-slot img{width:100%;height:100%;object-fit:contain;display:block}
.art-caption{transform:none;bottom:16px;left:auto;right:26px;max-width:none;background:#111218dd;color:white;padding:4px 8px;font-size:9px;letter-spacing:.1em}
.book-art{margin:0;padding:34px;background:#edf2ff;border:0;min-width:0;gap:14px;justify-content:center}
.book-art img{width:100%;max-width:315px;height:auto;display:block;box-shadow:9px 12px 0 #11121822}
.book-art figcaption{font-size:10px;letter-spacing:.09em;font-weight:700;text-transform:uppercase;margin-top:8px}
.comic-copy{display:flex;flex-direction:column;justify-content:center;padding:42px 45px}
.comic-copy h3{font-size:clamp(42px,5.1vw,72px)}
.comic-copy .actions{margin-top:15px}
.comic-copy .review-note{margin-bottom:0}
.preview-peek{margin-top:28px;display:flex;align-items:center;gap:22px;text-decoration:none;border:2px solid var(--black);background:#f4f5f8;overflow:hidden;max-width:420px}
.preview-peek>img{width:94px;height:140px;object-fit:cover;object-position:top}
.preview-peek>span{font-size:10px;letter-spacing:.07em;font-weight:800;padding:12px 12px 12px 0;line-height:1.8}
.preview-peek strong{display:block;font:24px/1.1 var(--display);margin-top:3px;letter-spacing:0}
.preview-peek small{display:block;font-size:11px;letter-spacing:0;margin-top:8px;text-decoration:underline}
.faction-section{grid-template-columns:47% 53%;padding:72px 5% 30px;gap:0 22px}
.faction-copy h2{font-size:clamp(42px,4.8vw,72px)}
.faction-stack{display:flex;align-items:center;justify-content:center;min-height:370px;transform:none;gap:0;padding:10px 4px 35px}
.faction-tile{position:relative;inset:auto;margin:0 -5px;width:34%;height:280px;padding:0;display:block;flex-shrink:0;overflow:hidden;background:var(--black);color:white;border:3px solid var(--black);box-shadow:5px 5px 0 var(--black)}
.faction-tile img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.faction-tile figcaption{position:absolute;bottom:0;left:0;right:0;background:var(--black);padding:13px 8px;font:20px/1 var(--display);letter-spacing:.01em;text-align:center}
.tile-back{transform:rotate(-9deg);margin-top:10px;z-index:1}
.tile-mid{transform:rotate(0);margin-top:65px;z-index:2}
.tile-front{transform:rotate(9deg);margin-top:10px;z-index:1}
.faction-more{grid-column:1/-1;border-top:1px solid #ffffff55;padding-top:22px;margin:24px 0 0;color:white;font-size:11px;letter-spacing:.03em;line-height:1.9}
.portrait-space{padding:0;height:295px;position:relative;background:var(--black)}
.portrait-space img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 15%;transition:transform .25s}
.blue-card .portrait-space img{object-position:center 35%}
.explore-card:hover .portrait-space img{transform:scale(1.025)}
.fieldbook-art img{object-position:center 17%;opacity:.75}
.fieldbook-art>span{position:absolute;bottom:22px;left:20px;font:44px/.95 var(--display);color:white;text-shadow:2px 3px 0 var(--black);letter-spacing:.02em}
.campaign-section{grid-template-columns:minmax(0,43%) minmax(0,1fr);gap:55px}
.campaign-art{margin:0;padding:0;background:#172434;border:3px solid white;min-height:0;position:relative;aspect-ratio:1.05;overflow:hidden;transform:rotate(-2deg);box-shadow:10px 10px 0 var(--blue)}
.campaign-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 24%}
.campaign-art figcaption{position:absolute;bottom:0;left:0;right:0;padding:10px;background:#111218e8;color:white;font-size:11px;letter-spacing:.06em;text-align:center}
.campaign-section h2{font-size:clamp(38px,4.5vw,65px)}
.campaign-section h2 span{display:block;color:white;margin-top:12px}
footer .brand{width:240px}
@media(min-width:1500px){.hero-art{clip-path:polygon(5% 0,100% 0,100% 100%,0 100%)}.hero-scene{object-position:center 40%}.hero-copy{padding-top:52px;padding-bottom:60px}}
@media(max-width:1050px) and (min-width:761px){.brand{width:220px}.site-header{gap:14px}nav{gap:12px}.hero-copy{padding-left:9%}.hero h1{font-size:90px}.world-tagline{font-size:20px}.hero{min-height:650px}.cover-slot{width:138px;right:25px}.comic-copy{padding:30px}.book-art{padding:25px}.faction-tile{height:245px}.faction-tile figcaption{font-size:17px}.portrait-space{height:240px}.card-copy{padding:20px}.card-copy h3{font-size:27px}.campaign-section{gap:35px}}
@media(max-width:760px){
  .brand{width:214px}.brand>span{font-size:10px}.site-header{padding:12px 5%;min-height:94px;gap:12px}.menu-toggle{padding:8px 11px;gap:16px}
  .hero{grid-template-columns:1fr;min-height:0}.hero-copy{padding:27px 6% 32px}.hero .eyebrow{margin-bottom:10px}.hero h1{font-size:clamp(68px,18vw,109px);margin:15px 0 16px;line-height:.88}.hero h1 br:nth-of-type(2){display:none}.hero h1>span::before{content:' '}
  .hero h1>span{margin-left:.06em}.world-tagline{font-size:20px;margin-bottom:12px}.hero-intro{font-size:15px;margin-bottom:22px}.hero .actions{gap:18px}.hero .button{padding:12px 15px;gap:18px;font-size:14px;min-height:50px}
  .hero-art{height:385px;clip-path:none;margin:0;border-top:4px solid var(--black)}.hero-scene{object-position:50% 20%}.hero-character-label{top:18px;right:18px;font-size:23px;padding:10px 12px}.hero-character-label small{font-size:9px}.cover-slot{width:112px;right:21px;bottom:36px;transform:rotate(7deg)}.art-caption{bottom:7px;right:17px;font-size:8px;left:auto}
  .book-art{padding:26px;gap:10px}.book-art img{max-width:270px}.comic-copy{padding:30px 23px}.comic-copy h3{font-size:49px}.preview-peek{gap:15px}.preview-peek strong{font-size:23px}.preview-peek>img{width:80px;height:133px}
  .faction-section{grid-template-columns:1fr;padding:46px 6% 27px;gap:10px}.faction-copy h2{font-size:46px}.faction-stack{height:330px;min-height:330px;width:100%;max-width:440px;transform:none;padding:12px 5px 35px;margin:auto}.faction-tile{height:230px;width:34%;margin-left:-3px;margin-right:-3px}.faction-tile figcaption{font-size:16px;padding:12px 3px}.tile-mid{margin-top:45px}.faction-more{margin-top:4px;padding-top:18px;font-size:10px}.portrait-space{height:280px}
  .campaign-section{grid-template-columns:1fr;padding:45px 6%;gap:38px}.campaign-art{width:100%;min-height:0;max-width:480px;margin:auto;aspect-ratio:1.1}.campaign-section h2{font-size:49px}.campaign-section .button{font-size:14px;gap:17px;padding:14px 17px}
  footer .brand{width:245px}footer p{font-size:12px}
}
@media(max-width:359px){.brand{width:183px}.menu-toggle{font-size:12px;gap:10px}.hero h1{font-size:61px}.faction-tile figcaption{font-size:14px}.faction-copy h2{font-size:41px}}
@media(prefers-reduced-motion:reduce){.explore-card:hover .portrait-space img{transform:none}}

/* The cast fills the masthead; controls sit on a solid ink strip for contrast. */
.site-header.character-header{display:block;padding:0;background:var(--black);border-bottom:4px solid var(--black)}
.character-banner{width:100%;aspect-ratio:32/5;max-height:290px;overflow:hidden;border-bottom:3px solid var(--red);background:var(--black)}
.character-banner picture,.character-banner img{display:block;width:100%;height:100%}
.character-banner img{object-fit:cover;object-position:center}
.header-controls{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:11px 4% 8px;min-height:98px}
.character-header .brand{color:white;width:250px}
.character-header .brand>span{font-size:11px;color:white}
.character-header nav a{color:white}
.character-header nav a:hover{color:#fff;text-decoration:underline;text-decoration-color:#ef3043;text-decoration-thickness:3px}
.character-header a:focus-visible,.character-header button:focus-visible{outline-color:#fff}
.character-header .menu-toggle{background:var(--black);color:white;border-color:#fff}
@media(max-width:1050px) and (min-width:761px){.header-controls{gap:15px}.character-header .brand{width:218px}}
@media(max-width:760px){
  .character-banner{aspect-ratio:32/15;max-height:270px}
  .header-controls{flex-wrap:wrap;padding:12px 5%;gap:12px;min-height:93px}
  .character-header .brand{width:210px}.character-header .brand>span{font-size:10px}
  .character-header nav a{border-top-color:#414552}
}
@media(max-width:359px){.character-header .brand{width:181px}.character-header .brand>span{font-size:9px}}

/* Current direction: black throughout, white type, and red emphasis. */
:root{--accent-text:#ff4356;--surface:#191a20;--muted:#c6c7ce;--dark-line:#3a3b43}
body{background:var(--black);color:#f7f7f9}
a:focus-visible,button:focus-visible{outline-color:white}
.skip{color:var(--black)}
.review-bar{background:#1b1c23;color:#c6c7ce;border-bottom:1px solid #303139}
.review-bar b{color:white}
.chapter-strip{border-bottom:1px solid var(--dark-line)}
.section-heading>p{color:var(--muted)}
.red-text{color:var(--accent-text)}
.comic-feature{background:var(--surface);border:1px solid var(--dark-line);border-top:3px solid var(--red);box-shadow:8px 8px 0 #050507}
.book-art{background:#090a0e;color:var(--muted)}
.book-art img{box-shadow:10px 12px 0 #000}
.comic-copy{border-left:1px solid var(--dark-line)}
.comic-copy>p:not(.eyebrow):not(.review-note){color:#dddde3}
.comic-copy h3{color:white}
.review-note{color:#b6b7c0;border-color:var(--dark-line)}
.preview-peek{background:#101115;color:white;border:1px solid #555661;border-left:3px solid var(--red)}
.preview-peek>span{color:var(--accent-text)}
.preview-peek strong,.preview-peek small{color:white}
.comic-copy .button.red,.faction-copy .button.white{background:var(--red);border-color:var(--red);color:white;box-shadow:4px 4px 0 white}
.comic-copy .button.red:hover,.faction-copy .button.white:hover{box-shadow:6px 6px 0 white}
.comic-copy .text-link,.explore-section .text-link{color:white;text-decoration-color:var(--accent-text);text-decoration-thickness:2px}
.preview-peek:hover,.explore-card:hover{border-color:var(--accent-text)}
.faction-section{background:#0b0c10;border-top:1px solid var(--dark-line);border-bottom:1px solid var(--dark-line);border-left:5px solid var(--red)}
.faction-copy h2 span{color:var(--accent-text)}
.faction-copy>p:not(.eyebrow):not(.small-light){color:#dddde3}
.faction-copy .eyebrow{color:var(--accent-text)}
.small-light{color:var(--muted)}
.faction-tile{border:2px solid #dedee4;box-shadow:6px 7px 0 #000}
.faction-tile figcaption{border-top:2px solid var(--red);background:#111218;color:white}
.faction-more{border-color:var(--dark-line);color:var(--muted)}
.explore-card{background:var(--surface);border:1px solid #484951;box-shadow:5px 5px 0 #050507}
.portrait-space,.blue-card .portrait-space{background:#0b0c10;border-bottom:3px solid var(--red)}
.card-copy .eyebrow{color:var(--accent-text)}
.card-copy h3{color:white}
.card-copy h3>span{color:var(--accent-text)}
.card-copy p{color:var(--muted)}
.campaign-art{box-shadow:10px 10px 0 var(--red)}
footer{background:#0b0c10;color:white}
footer .brand{color:white}
footer p{color:var(--muted)}
footer>a:last-child{text-decoration-color:var(--accent-text)}
@media(max-width:760px){.comic-copy{border-left:0;border-top:1px solid var(--dark-line)}.comic-feature{box-shadow:5px 5px 0 #050507}}

/* Sparse, static stars stay behind the open page areas. Reading surfaces stay solid. */
main,.faction-section,.campaign-section{
  background-image:url('artwork/starfield.svg?v=4');
  background-size:1600px 1100px;
  background-repeat:repeat;
}
main{background-position:0 0}
.faction-section{background-position:173px -249px}
.campaign-section{background-position:-283px -571px}
.section-heading>div,.section-heading>p,.section-heading>.text-link,.campaign-section>div{background-color:var(--black)}
.faction-copy,.faction-more{background-color:#0b0c10}

/* Quiet purchase-help entrances; primary comic actions stay prominent. */
.reader-help-strip{padding:24px 27px;border:1px solid #654454;border-left:4px solid var(--red);background:#14131a;margin:30px 0;display:flex;align-items:center;justify-content:space-between;gap:24px}
.reader-help-strip>strong{font-size:16px;line-height:1.5}.reader-help-strip>div{display:flex;flex-wrap:wrap;gap:9px 24px}.reader-help-strip a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:700;text-decoration-color:var(--accent-text);line-height:1.7}.reader-help-strip a:hover{color:#ff91a2}
footer .publisher-footer{line-height:2;font-size:12px;font-weight:700}
@media(max-width:760px){.reader-help-strip{padding:22px;display:block;margin:25px 0}.reader-help-strip>div{margin-top:15px;gap:13px 22px}}
