/* Hosting pages (build/pages/hosting.py): /commons/hosting-guide, /commons/hosting-checklist, /commons/at-a-session.
   Builds on guides.css (contents, guide-item sections, the numbered source list). */

.hs-btns{margin-top:1.6rem}
.prose .hs-modules{margin-bottom:1.6rem}
.prose .hs-modules li{margin-bottom:.45rem}
.hs-also{display:flex;flex-wrap:wrap;gap:.8rem 2rem;margin:0}
.prose .hs-roles{display:grid;gap:1rem;margin-top:1.4rem}
.hs-role{padding:1.3rem 1.5rem;border-radius:18px;background:var(--paper-3);border:1px solid var(--line)}
.prose .hs-role h3{margin:0 0 .6rem}
.prose .hs-role ul{margin:0}
@media (min-width:1100px){.prose .hs-roles{grid-template-columns:repeat(2,minmax(0,1fr))}.hs-role:last-child{grid-column:1/-1}}

/* The checklist sheet */
.hc-sheet{max-width:880px;margin:0 auto;padding:clamp(1.3rem,1rem + 2vw,2.6rem);border:1px solid var(--line-2);border-radius:22px;background:var(--paper-3)}
.hc-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0 0 .6rem;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hc-kicker .logo__mark{width:16px;height:16px}
.hc-title{margin:0 0 1rem;font-family:var(--f-display);font-weight:340;font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);line-height:1.15;color:var(--text)}
.hc-fills{display:grid;gap:.5rem 1.6rem;margin-bottom:1.2rem}
@media (min-width:640px){.hc-fills{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hc-fill{display:flex;align-items:flex-end;gap:.6rem;margin:0;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hc-fill span:first-child{flex:none}
.hc-blank{flex:1;min-width:3rem;border-bottom:1px solid var(--line-2);height:1.1em}
.hc-grid{display:grid;gap:1.4rem}
@media (min-width:860px){.hc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hc-block--before{grid-row:span 2}}
.hc-h{margin:0 0 .5rem;padding-bottom:.4rem;border-bottom:1.5px solid var(--text);font-family:var(--f-mono);font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text)}
.hc-list{list-style:none;margin:0;padding:0}
.hc-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.7rem;align-items:start;padding:.45rem 0;border-bottom:1px solid var(--line)}
.hc-list input{appearance:none;-webkit-appearance:none;width:1.15rem;height:1.15rem;margin:.15rem 0 0;border:1.5px solid var(--text);border-radius:3px;background:transparent;cursor:pointer;display:grid;place-content:center}
.hc-list input::before{content:"";width:.32rem;height:.62rem;border-right:2px solid var(--text);border-bottom:2px solid var(--text);transform:rotate(45deg) translate(-1px,-1px);opacity:0}
.hc-list input:checked::before{opacity:1}
.hc-list input:focus-visible{outline:2px solid var(--sun-ink);outline-offset:2px}
.hc-list label{cursor:pointer;color:var(--body);font-size:.95rem;line-height:1.45;overflow-wrap:anywhere}
.hc-list input:checked + label{color:var(--muted)}
.hc-foot p{margin:1.2rem 0 0;font-size:.82rem;color:var(--muted);overflow-wrap:anywhere}
.hc-sheet + .hs-also{max-width:880px;margin:1.6rem auto 0}

@media print{
  /* The checklist prints as one page: the sheet only */
  @page{margin:10mm}
  main:has(.hc-sheet) .page-hero,main:has(.hc-sheet) .hs-also,main:has(.hc-sheet) .subscribe-band{display:none!important}
  body:has(.hc-sheet)::before{display:none}
  main:has(.hc-sheet) .section{padding:0!important}
  .hc-sheet{max-width:none;border:0;border-radius:0;padding:0;background:#fff!important;font-size:9.3pt}
  .hc-kicker{font-size:6.8pt;margin-bottom:1.5mm;color:#333}
  .hc-title{font-size:16pt;margin-bottom:3mm;color:#000}
  .hc-fills{grid-template-columns:repeat(2,minmax(0,1fr));gap:2mm 8mm;margin-bottom:4mm}
  .hc-fill{font-size:6.8pt;color:#333}
  .hc-blank{border-color:#000;height:1.4em}
  .hc-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:3mm 8mm}
  .hc-block--before{grid-row:span 2}
  .hc-h{font-size:7.5pt;margin-bottom:1mm;padding-bottom:1mm;border-color:#000;color:#000}
  .hc-list li{padding:1.3mm 0;gap:2.5mm;border-color:#bbb;break-inside:avoid}
  .hc-list input{width:3.4mm;height:3.4mm;margin-top:.3mm;border:1px solid #000;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .hc-list input::before{border-color:#000}
  .hc-list label,.hc-list input:checked + label{font-size:9.3pt;line-height:1.3;color:#000}
  .hc-foot p{margin-top:3mm;font-size:7.5pt;color:#333}
  .hs-role{background:#fff!important;border-color:#bbb}
}