/* after hours, for the pages that predate it: whatever wraps their content becomes the taped paper
   sheet the main pages use, in the same column (the wrap's 1080px less its gutters), the same gap under
   the band and the same padding, set in the site's type. */
.q, body > main#main:not(.q), body > .wrapper, body > .sky-calendar-wrapper, body > .room-wrap, body > .container, .ah-sheet{
  position:relative; box-sizing:border-box; width:min(1000px, calc(100% - 2 * clamp(16px,3vw,40px))) !important; max-width:none !important;
  margin:34px auto 72px !important; padding:clamp(26px,4vw,52px) clamp(18px,4vw,56px) clamp(30px,4vw,52px) !important;
  background:#f8f3e7 url(/after-hours/img/paper.webp) 0 0/768px; box-shadow:0 14px 30px -18px rgba(27,23,24,.7); transform:rotate(-.25deg)}
:is(.q, body > main#main:not(.q), body > .wrapper, body > .sky-calendar-wrapper, body > .room-wrap, body > .container, .ah-sheet)::before{content:""; position:absolute; z-index:2; top:-14px; left:6%; width:clamp(70px,10vw,130px); height:30px; background:url(/after-hours/img/tape.webp) center/contain no-repeat; transform:rotate(-8deg); pointer-events:none}
/* chess: its header, board grid and footer sit inside the one sheet without their own side padding */
.ah-sheet > header, .ah-sheet > main, .ah-sheet > footer{padding-left:0 !important; padding-right:0 !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important}
.ah-sheet > header{padding-top:0 !important}
.q-sub{padding-top:clamp(26px,4vw,52px)}
.q h1, .q h2.title{font-family:"Abril Fatface",serif; font-weight:400; font-size:clamp(40px,6vw,64px); line-height:1; letter-spacing:-.01em; margin:4px 0 14px}
.q .meta, .q .blurb{color:var(--soft)}
.q .blurb{font-family:"Reenie Beanie",cursive; font-size:28px; line-height:1.1; color:#a84d16}
.q .label{position:static; text-align:left; margin:0 0 8px; font-family:"Reenie Beanie",cursive; font-size:28px; color:#a84d16}
.q .label span{display:inline; margin-left:8px; font-family:"Courier Prime",monospace; font-size:.85rem}
.q a{text-decoration:underline; text-decoration-color:#df6f22; text-underline-offset:3px; text-decoration-thickness:2px}
.q a:hover{color:#22396a}
.q .prose{max-width:68ch}
.q-end{margin-top:32px}
@media (max-width:700px){ :is(.q, body > main#main:not(.q), body > .wrapper, body > .sky-calendar-wrapper, body > .room-wrap, body > .container, .ah-sheet){transform:none; padding:22px 14px 26px !important; width:calc(100% - 24px) !important; margin-top:34px !important} }

/* page titles on the pages with their own layouts: the same Abril as everywhere else */
h1.sky-title, h1.page-header, h1.title, .room-name, body > main > h1:first-child, body > header h1{font-family:"Abril Fatface",serif !important; font-weight:400 !important; letter-spacing:-.01em; line-height:1.05}
h1.sky-title, h1.page-header{font-size:clamp(40px,6vw,64px) !important}
.room-name{font-size:clamp(36px,5vw,52px) !important}
.band .links a{border-bottom:0}
/* base.css has its own .links (a top margin, smaller type); keep the band identical on every page */
.band .links{margin:0; font-size:inherit; gap:.2rem 1.1rem; line-height:1.6}
.band .wrap{line-height:1.6}
h1.module-title{font-family:"Abril Fatface",serif !important; font-weight:400 !important; letter-spacing:-.01em; line-height:1.05}

/* every page sits on the same white wall as the room; pages with their own body colour (chess, telemetry, sky…) included */
html{background:#f5f3ee !important}
body{background-color:#f5f3ee !important;
  background-image:radial-gradient(ellipse 70% 60% at 12% 0%, rgba(255,205,150,.18), transparent 70%), radial-gradient(ellipse 110% 95% at 50% 35%, transparent 50%, rgba(70,58,46,.10)), url(/after-hours/img/wall.webp) !important;
  background-size:100% 100%, 100% 100%, 512px 512px !important; background-attachment:fixed, fixed, scroll !important}
/* pages that style a bare <header> (chess) shouldn't pad the shared masthead */
header.ah-mast{padding:14px 0 0 !important; margin:0 !important; max-width:none !important; border:0 !important; background:none !important}
/* telemetry on phones: the transmission line wraps instead of running off the sheet */
@media (max-width:700px){ .room .room-vitals{white-space:normal; flex-wrap:wrap; gap:.2rem .75rem} }