:root{--paper:#e8e0c0;--paper-light:#f4edcf;--ink:#15191b;--cyan:#0e7884;--pink:#ff006e;--line:#1d2526}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
body::before{content:"";position:fixed;inset:0;z-index:20;pointer-events:none;opacity:.14;background-image:radial-gradient(#1d2526 0.55px,transparent .7px);background-size:5px 5px;mix-blend-mode:multiply}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit}
:focus-visible{outline:3px solid var(--pink);outline-offset:4px}
.reading-progress{position:fixed;top:0;left:0;right:0;height:5px;z-index:50;background:rgba(232,224,192,.7)}
.reading-progress span{display:block;height:100%;width:0;background:var(--pink)}
.site-header{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,5vw,70px);border-bottom:3px solid var(--ink);position:relative;z-index:2;background:var(--paper)}
.wordmark{font:bold 26px/1 Arial,Helvetica,sans-serif;text-decoration:none;letter-spacing:-.075em;white-space:nowrap}.wordmark-dot{color:var(--pink)}
.site-header nav{display:flex;gap:28px}.site-header nav a,.issue-mark{font:700 12px/1.2 'Courier New',monospace;letter-spacing:.04em;text-transform:uppercase}.site-header nav a{text-decoration:none;border-bottom:2px solid transparent;padding:8px 0}.site-header nav a:hover{border-color:var(--ink)}
.issue-mark{border:2px solid var(--ink);padding:9px 12px;transform:rotate(3deg)}
.hero{min-height:min(780px,calc(100svh - 74px));position:relative;overflow:hidden;background:#0c1b24;color:var(--paper-light);display:flex;align-items:center}
.hero-art,.hero-shade{position:absolute;inset:0}.hero-art{background:url('/assets/capa.webp') center/cover no-repeat}.hero-shade{background:linear-gradient(90deg,rgba(8,17,24,.87) 0%,rgba(8,17,24,.54) 38%,rgba(8,17,24,.06) 75%),linear-gradient(0deg,rgba(8,17,24,.4),transparent 48%)}
.hero-content{position:relative;z-index:1;padding:70px clamp(20px,7vw,118px);max-width:1050px}.hero-eyebrow{font:700 13px 'Courier New',monospace;letter-spacing:.13em;margin:0 0 26px;background:var(--paper);color:var(--ink);display:inline-block;padding:8px 12px;transform:rotate(-2deg)}
h1,h2,p{margin-top:0}.hero h1{font:900 clamp(72px,10vw,160px)/.79 Arial,Helvetica,sans-serif;letter-spacing:-.09em;margin:0 0 42px;text-shadow:4px 0 var(--pink),-3px 0 var(--cyan);max-width:850px}.hero h1 em{font-family:'Times New Roman',serif;font-weight:400;letter-spacing:-.07em}.hero-subtitle{font:italic clamp(20px,2.3vw,30px)/1.25 'Times New Roman',serif;max-width:575px;margin-bottom:34px}
.start-button{display:inline-flex;gap:35px;align-items:center;background:var(--paper);color:var(--ink);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--pink);text-decoration:none;padding:17px 21px;font:700 15px/1 'Courier New',monospace;transform:rotate(-2deg);transition:transform .2s,box-shadow .2s}.start-button:hover{transform:rotate(0deg) translate(2px,2px);box-shadow:3px 3px 0 var(--pink)}.start-button span{font:700 24px/0 Arial,sans-serif}
.cover-corner{position:absolute;right:35px;bottom:30px;font:700 12px 'Courier New',monospace;letter-spacing:.12em;writing-mode:vertical-rl}
.edition-line{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:16px clamp(18px,5vw,70px);background:var(--paper);border-block:3px solid var(--ink);font:700 12px 'Courier New',monospace;letter-spacing:.12em}
.intro-strip{max-width:1180px;margin:auto;padding:100px clamp(20px,4vw,45px) 82px;text-align:center}.section-kicker{display:inline-block;background:var(--pink);color:white;padding:8px 12px;transform:rotate(-3deg);font:700 13px 'Courier New',monospace;text-transform:uppercase}.intro-strip h2{font:italic clamp(45px,6vw,78px)/.95 'Times New Roman',serif;letter-spacing:-.045em;margin:26px 0}.intro-strip>p:last-child{font:20px/1.55 Arial,Helvetica,sans-serif;max-width:720px;margin:0 auto}
.comic{max-width:1400px;padding:0 clamp(15px,4vw,55px);margin:0 auto}.chapter{padding:0 0 90px;scroll-margin-top:30px}.chapter-heading{display:flex;align-items:flex-start;gap:28px;border-top:4px solid var(--ink);padding:20px 4px 34px;margin-bottom:12px}.chapter-number{font:900 clamp(72px,9vw,132px)/.75 Arial,sans-serif;letter-spacing:-.1em;color:var(--cyan);text-shadow:4px 0 var(--pink);min-width:145px}.chapter-title-group h2{font:900 clamp(37px,5vw,72px)/.93 Arial,sans-serif;letter-spacing:-.065em;margin:0 0 12px}.chapter-title-group p{font:italic 22px/1.3 'Times New Roman',serif;margin:0}
.panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 28px}.panel{border:4px solid var(--ink);background:var(--paper-light);box-shadow:7px 7px 0 var(--ink);min-width:0}.panel-wide{grid-column:1/-1}.panel:nth-child(3n+2){transform:rotate(-.5deg)}.panel:nth-child(4n+3){transform:rotate(.55deg)}
.panel-image-button{appearance:none;border:0;padding:0;background:var(--ink);display:block;width:100%;cursor:zoom-in;overflow:hidden}.panel-image{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform .35s}.panel-image-button:hover .panel-image{transform:scale(1.025)}
.panel-copy{padding:26px clamp(22px,3vw,44px) 30px}.panel-label{display:inline-block;font:700 12px/1.2 'Courier New',monospace;text-transform:uppercase;letter-spacing:.06em;border-bottom:2px solid var(--ink);padding-bottom:6px;margin-bottom:20px}.narration{font:clamp(18px,1.65vw,23px)/1.48 'Times New Roman',serif;max-width:1000px;margin:0}.panel-text{display:flex;min-height:330px;background-image:radial-gradient(rgba(21,25,27,.17) .8px,transparent .8px);background-size:9px 9px}.panel-text .panel-copy{display:flex;flex-direction:column;justify-content:center}.panel-text .narration{font-size:clamp(21px,2.3vw,30px);line-height:1.28}.sound-effect{display:block;color:var(--pink);font:900 clamp(38px,7vw,92px)/.85 Arial,sans-serif;letter-spacing:-.07em;text-shadow:3px 0 var(--cyan);transform:rotate(-3deg);margin:0 0 20px}.dialogue-list{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.dialogue{max-width:min(100%,470px);margin:0;background:#fffdf0;border:2px solid var(--ink);border-radius:45% 48% 48% 42% / 24% 30% 28% 24%;padding:15px 21px 18px;font:700 clamp(16px,1.5vw,21px)/1.25 Arial,sans-serif;box-shadow:4px 4px 0 rgba(14,120,132,.5)}.dialogue strong{display:block;font:700 11px/1.2 'Courier New',monospace;text-transform:uppercase;margin-bottom:7px;color:var(--cyan)}
.epilogue{border-top:5px solid var(--ink);border-bottom:5px solid var(--ink);background:var(--paper-light);padding:80px clamp(20px,8vw,140px);scroll-margin-top:25px}.epilogue-title-row{max-width:1200px;margin:auto}.stamp{display:inline-block;padding:9px 13px;border:3px solid var(--pink);color:var(--pink);font:700 13px 'Courier New',monospace;transform:rotate(-6deg);margin-bottom:26px}.epilogue h2{font:900 clamp(54px,9vw,125px)/.85 Arial,sans-serif;letter-spacing:-.08em;margin:0 0 55px}.epilogue h2 em{font:italic 400 .8em/.8 'Times New Roman',serif;letter-spacing:-.06em}.outcome-grid{max-width:1200px;margin:0 auto 55px;display:grid;grid-template-columns:repeat(4,1fr);border-top:3px solid var(--ink);border-left:3px solid var(--ink)}.outcome-grid div{padding:20px;border-right:3px solid var(--ink);border-bottom:3px solid var(--ink)}.outcome-grid strong{display:block;text-transform:uppercase;font:700 12px 'Courier New',monospace;margin-bottom:18px}.outcome-grid span{font:italic 30px 'Times New Roman',serif}.epilogue>p{max-width:950px;margin:0 auto 24px;font:20px/1.55 'Times New Roman',serif}.epilogue .future-note{font-style:italic;border-left:4px solid var(--pink);padding-left:18px}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:36px clamp(18px,5vw,70px);font:700 12px/1.4 'Courier New',monospace;text-transform:uppercase}.site-footer a{text-decoration-thickness:2px;text-underline-offset:4px}
dialog{border:4px solid var(--ink);padding:18px;background:var(--paper);max-width:min(94vw,1500px);max-height:92vh;box-shadow:10px 10px 0 var(--pink)}dialog::backdrop{background:rgba(6,16,22,.85)}dialog img{display:block;max-width:100%;max-height:75vh;object-fit:contain}dialog p{font:700 13px 'Courier New',monospace;margin:12px 0 0}#close-dialog{display:block;margin:0 0 12px auto;padding:10px 15px;border:2px solid var(--ink);background:var(--paper-light);font:700 13px 'Courier New',monospace;cursor:pointer}
@media(max-width:850px){.site-header{height:62px}.site-header nav{gap:14px}.site-header nav a{font-size:11px}.issue-mark{display:none}.hero{min-height:690px}.hero-shade{background:linear-gradient(0deg,rgba(8,17,24,.86),rgba(8,17,24,.35) 60%,rgba(8,17,24,.05))}.hero-content{align-self:flex-end;padding:40px 24px 70px}.hero h1{font-size:clamp(64px,11vw,100px)}.hero-subtitle{max-width:460px}.cover-corner{right:12px;bottom:10px}.intro-strip{padding:70px 22px}.chapter-number{min-width:100px}.panel-grid{gap:20px}.panel-text{min-height:300px}.outcome-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.wordmark{font-size:20px}.site-header nav a{font-size:10px}.edition-line{font-size:9px;padding-inline:18px}.hero{min-height:620px}.hero-art{background-position:60% center}.hero h1{font-size:clamp(53px,13.2vw,78px);margin-bottom:25px}.hero-subtitle{font-size:22px}.hero-eyebrow{font-size:10px}.comic{padding-inline:16px}.chapter{padding-bottom:70px}.chapter-heading{gap:15px}.chapter-number{font-size:68px;min-width:70px}.chapter-title-group h2{font-size:37px}.chapter-title-group p{font-size:18px}.panel-grid{display:block}.panel{margin-bottom:22px;transform:none!important;box-shadow:5px 5px 0 var(--ink)}.panel-copy{padding:20px}.panel-text{min-height:0}.panel-text .narration{font-size:22px}.narration{font-size:20px}.sound-effect{font-size:50px}.dialogue{font-size:17px}.epilogue{padding:65px 20px}.epilogue h2{font-size:clamp(52px,12vw,74px)}.outcome-grid span{font-size:25px}.epilogue>p{font-size:19px}.site-footer{display:grid;gap:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.panel-image,.start-button{transition:none}}
