/* Crew card — print sheet.
   One A4 side, black on white, no screen chrome. Never loaded by the site:
   cards are shipped as PDF, the HTML here is only the source weasyprint renders. */

@page {
  size: A4;
  margin: 11mm 12mm 9mm;
}

/* A crew card is one A4 side. If a card grows to two pages, cut the card, not the type. */
html { font-size: 9.6pt; }

body {
  margin: 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #111;
  background: #fff;
  line-height: 1.3;
}

header { border-bottom: 1.4pt solid #111; padding-bottom: 2.4mm; margin-bottom: 3mm; }

.eyebrow {
  margin: 0 0 1mm;
  font-size: 7.5pt; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: #555;
}
h1 { margin: 0; font-size: 17pt; line-height: 1.12; letter-spacing: -.01em; }
.standfirst { margin: 1.5mm 0 0; font-size: 9.5pt; color: #333; max-width: 150mm; }

h2 {
  margin: 4mm 0 1.6mm;
  font-size: 8pt; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: #111; border-bottom: .5pt solid #bbb; padding-bottom: 1mm;
  break-after: avoid;
}

p { margin: 0 0 2mm; }
strong { font-weight: 700; }
em { font-style: italic; }

/* Gates ------------------------------------------------------------------ */

.gate {
  display: grid;
  grid-template-columns: 7mm 1fr;
  gap: 0 3mm;
  padding: 1.6mm 0;
  border-bottom: .4pt dotted #bbb;
  break-inside: avoid;
}
.gate:last-of-type { border-bottom: 0; }
.gate .n { font-size: 13pt; font-weight: 700; color: #111; line-height: 1; padding-top: .4mm; }
.gate .nm { font-size: 9.6pt; font-weight: 700; margin: 0 0 .6mm; }
.gate dl { margin: 0; font-size: 8.4pt; }
.gate dt {
  float: left; clear: left; width: 20mm;
  font-weight: 700; color: #555; font-size: 7.5pt; text-transform: uppercase;
  letter-spacing: .04em; padding-top: .5mm;
}
.gate dd { margin: 0 0 .6mm 22mm; }
.gate dd:last-child { margin-bottom: 0; }

.where { font-weight: 700; }
.where--gx::before   { content: "▲ "; }
.where--zora::before { content: "● "; }

/* Tables ----------------------------------------------------------------- */

table { width: 100%; border-collapse: collapse; font-size: 8.6pt; break-inside: avoid; }
th, td { text-align: left; vertical-align: top; padding: 1.1mm 2mm 1.1mm 0; border-bottom: .4pt solid #ddd; }
thead th { font-size: 7.5pt; text-transform: uppercase; letter-spacing: .05em; color: #555; border-bottom: .8pt solid #999; }
tbody tr:last-child td { border-bottom: 0; }

code {
  font-family: "SF Mono", Menlo, Consolas, monospace;
  font-size: .9em;
  background: #f2f2f2;
  padding: .2mm .8mm;
  border-radius: .6mm;
}

/* Callout ---------------------------------------------------------------- */

.note {
  border-left: 1.6pt solid #111;
  padding: 1.2mm 0 1.2mm 3mm;
  margin: 2mm 0;
  font-size: 8.4pt;
  break-inside: avoid;
}

/* Footer line ------------------------------------------------------------ */

.meta {
  margin-top: 3mm; padding-top: 1.4mm; border-top: .5pt solid #bbb;
  font-size: 7.5pt; color: #666;
}

.cols { column-count: 2; column-gap: 6mm; }
.cols > * { break-inside: avoid; }


/* Screen ------------------------------------------------------------------
   The same file is published as a page and read inside Zora's help iframe,
   which has no back button of its own. The nav strip below is the way back,
   and it never prints. */

.cardnav { display: none; }

@media screen {
  html { background: #e9e9e7; }
  body {
    max-width: 210mm;
    margin: 0 auto;
    padding: 10mm 12mm 14mm;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .18);
  }

  .cardnav {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 6mm;
    padding-bottom: 3mm;
    border-bottom: .5pt solid #ddd;
    font-size: 9pt;
  }
  .cardnav a {
    color: #1a4d8f;
    text-decoration: none;
    padding: 2mm 3mm;
    border: 1px solid #c7d3e2;
    border-radius: 3px;
    background: #f4f7fb;
  }
  .cardnav a:hover { background: #e8eff8; }
}

@media print { .cardnav { display: none !important; } }