/* One unbroken parchment sheet, with long guides scrolling inside its margins. */
html{height:100%}
body,body.illustrated{margin:0;padding:2dvh 0;background:#314347;color:#392719;font-size:18px}
body>main,body.illustrated>main{
 --paper-width:min(880px,98vw,82dvh);width:var(--paper-width);height:96dvh;
 margin:0 auto;padding:0;border:0;border-radius:0;position:relative;
 background:transparent url('./ratings-scroll.webp') center/100% 100% no-repeat;
 overflow:hidden;display:flex;flex-direction:column;
 padding:9dvh calc(var(--paper-width) * .14) 11dvh;
}
body>main>.scroll-guide-content{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-color:#967343 #efdcad}
body.illustrated .guide-copy,.guide-copy{max-width:none;margin:0;padding:0}
h1{font-family:Georgia,serif;text-align:center;color:#50341c;margin:0 0 1.2rem;font-size:clamp(28px,3.5vw,40px)}
h2{font-family:Georgia,serif;color:#50341c}
a{color:#50341c}
.play,.play:hover,.play:focus{background:transparent;color:#50341c;border:0;box-shadow:none;text-align:center}
.help-heading{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.5rem}
.help-heading h1{width:100%}
.guide-hero{width:100%;height:auto;display:block;margin:0 0 1rem;border-radius:8px}
.related{border-color:#92704666}
@media(max-width:600px){
 body,body.illustrated{font-size:16px}
 body>main,body.illustrated>main{--paper-width:99vw;padding:64px calc(var(--paper-width) * .13) 76px}
}

/* Centred headings throughout the How to Play guides. */
h2,h3,h4,h5,h6{text-align:center}
#supportHeading+p{text-align:center}

.help-heading .play,.help-return .play{font-size:20px}
.help-return{text-align:center;margin:1.5rem 0 0}
@media(max-width:600px){.help-heading .play,.help-return .play{font-size:18px}}

.guide-links{justify-content:center;text-align:center}