*{box-sizing:border-box}
html,body{margin:0;background:#000;color:#a70000;font-family:"Press Start 2P","Courier New",monospace}
#screen{max-width:760px;margin:0 auto;padding:24px 16px 40px;min-height:100vh;text-align:center;
background:radial-gradient(ellipse at 50% 0,#170f07 0,#000 70%)}
h1{margin:12px 0 4px;font-size:clamp(22px,6vw,44px);letter-spacing:2px;color:#a70000;
text-shadow:3px 3px 0 #430000,5px 5px 0 #000;font-weight:400}
.sub{margin:0 0 28px;font-size:14px;color:#774f2b;letter-spacing:6px}
#menu{position:relative;display:inline-flex;flex-direction:column;gap:14px;text-align:left;padding-left:52px}
#menu a{font-size:clamp(11px,3vw,18px);color:#a70000;text-decoration:none;text-shadow:2px 2px 0 #000;
letter-spacing:1px;padding:2px 0;transition:none}

#skull{position:absolute;left:0;width:34px;height:34px;image-rendering:pixelated;animation:blink .23s steps(1) infinite}
@keyframes blink{50%{transform:scaleX(-1)}}
#panel{margin:8px auto 0;max-width:680px;text-align:left;border:4px double #774f2b;background:#170f07;padding:20px;line-height:2}
#panel[hidden],#panel section{display:none}
#panel section.on{display:block}
h2{font-size:clamp(13px,3.5vw,20px);color:#a70000;margin:0 0 16px;text-shadow:2px 2px 0 #000;font-weight:400}
h3{font-size:13px;color:#774f2b;margin:22px 0 4px;font-weight:400}
p,li{font-size:11px;color:#b99a6f}
b{color:#ff0000;font-weight:400}
ul{padding-left:20px;margin:0}
li::marker{color:#a70000}
#panel a{color:#e02020;text-decoration:none}
#panel a:hover,#panel a:focus{color:#ff7f1f;background:#430000}
#back{font:inherit;font-size:11px;background:none;border:0;color:#774f2b;cursor:pointer;margin-bottom:14px;padding:0}
#back:hover{color:#ff7f1f}
body.in #menu,body.in header .sub{display:none}
body.in header h1{font-size:clamp(14px,4vw,24px)}
#hint{margin-top:36px;font-size:8px;color:#774f2b;line-height:2.2}
@media (prefers-reduced-motion:reduce){#skull{animation:none}}

#screen.wad{background:linear-gradient(#000a,#000c),var(--tp) center/cover no-repeat;image-rendering:pixelated}
#logo{display:block;margin:0 auto 10px;width:min(369px,90%);image-rendering:pixelated}
img#skull{width:40px;height:38px;image-rendering:pixelated}
#wadbox{margin-top:30px}
.wadbtn{display:inline-block;font-size:10px;color:#a70000;border:2px solid #774f2b;padding:10px 14px;cursor:pointer;text-shadow:2px 2px 0 #430000}
.wadbtn:hover,.wadbtn:focus-within{color:#ff0000;background:#170f07}
#wadmsg{font-size:8px;color:#774f2b;line-height:2.2;margin:10px 0 0}
body.in #wadbox,body.in #logo{display:none}