/* ============================================================
   ZINE print stylesheet — A5 pages, saddle-stitch ready.
   Screen: pages shown stacked with a grey backdrop.
   Print : one A5 page each; use the browser/PDF "Booklet" option
           to impose for saddle stitching (fold + staple on spine).
   ============================================================ */
:root{
  --blue:#013ABB;--yellow:#F7EB23;--red:#8F080E;--ink:#111;--mono:"Courier New",monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#3a3a3a;font-family:var(--mono);color:var(--ink)}
.toolbar{
  position:sticky;top:0;z-index:10;background:#000;color:#F7EB23;
  padding:.6rem 1rem;font-size:.8rem;display:flex;gap:1rem;align-items:center;flex-wrap:wrap;
}
.toolbar a,.toolbar button{color:#F7EB23;background:#000;border:1px solid #F7EB23;
  font-family:var(--mono);padding:.3rem .7rem;cursor:pointer;text-decoration:none;font-size:.8rem}
.toolbar a:hover,.toolbar button:hover{background:#F7EB23;color:#000}
.toolbar .hint{color:#aaa;border:0}

.book{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.4rem 0 4rem}

.page{
  width:148mm;height:210mm;background:#fff;position:relative;overflow:hidden;
  box-shadow:0 4px 18px rgba(0,0,0,.5);
  padding:14mm 13mm;display:flex;flex-direction:column;
}
.page .pno{position:absolute;bottom:6mm;right:8mm;font-size:9pt;color:#999}
.page .pno.l{right:auto;left:8mm}

/* type */
.page h1{font-size:30pt;line-height:1;margin:0 0 6mm;color:var(--blue);text-transform:uppercase;letter-spacing:.02em}
.page h2{font-size:15pt;margin:6mm 0 2mm;color:var(--blue);border-bottom:1.5pt solid var(--yellow);padding-bottom:1mm}
.page p{font-size:10.5pt;line-height:1.5;margin:0 0 3mm}
.page small{font-size:8.5pt;color:#555}
.page .kicker{font-size:9pt;letter-spacing:.3em;text-transform:uppercase;color:var(--red)}
.page ul{font-size:10.5pt;line-height:1.5;padding-left:5mm}
.fill{flex:1}

/* cover */
.cover{background:var(--blue);color:var(--yellow);justify-content:center;text-align:center}
.cover h1{color:var(--yellow);font-size:42pt}
.cover .sub{color:#fff;letter-spacing:.25em;text-transform:uppercase;font-size:10pt;margin-top:4mm}
.cover .by{margin-top:auto;color:#fff;font-size:11pt}

/* full-bleed image page */
.imgpage{padding:0;align-items:center;justify-content:center;background:#000}
.imgpage img{width:100%;height:100%;object-fit:contain;background:#fff}
.caption{position:absolute;left:0;bottom:0;width:100%;background:rgba(0,0,0,.78);color:#F7EB23;
  font-size:8.5pt;padding:2mm 4mm}

/* contact block */
.contact dl{display:grid;grid-template-columns:max-content 1fr;gap:1.5mm 4mm;font-size:10.5pt}
.contact dt{color:var(--blue);font-weight:bold}
.contact dd{margin:0}

.qrbox{display:flex;flex-direction:column;align-items:center;gap:3mm;margin-top:4mm}
.qrbox img{width:55mm;height:55mm}

@media print{
  html,body{background:#fff}
  .toolbar{display:none}
  .book{gap:0;padding:0}
  .page{box-shadow:none;width:148mm;height:210mm;page-break-after:always;break-after:page}
  @page{size:A5;margin:0}
}