/* ==========================================================================
   Antilles — the A4 layout. Fifteen pages, portrait, meant to be rendered
   headlessly to PDF and forwarded to people who never see the site.
   This is a second layout, not the site with a print rule bolted on.
   ========================================================================== */

@page { size: A4 portrait; margin: 0; }

:root {
  --serif: ui-serif, Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ink: #15202a; --ink-2: #55636e; --ink-3: #8b98a2;
  --rule: #d8d0c2; --rule-2: #bdb3a0;
  --paper: #ffffff; --paper-2: #f7f3ea; --paper-3: #efe9dd;
  --accent: #bd4f1e; --accent-wash: #f6e5d8;
  --deep: #05121a; --deep-2: #0d232f; --deep-ink: #eef4f6; --deep-ink-2: #9db3bd; --deep-rule: #24404f;
  --sea: #e6eef1; --sea-2: #d2e2e8; --fathom: #8db0be; --iso: #c2d6dd;
  --coast: #e4dac6; --coast-line: #3a4a55; --grid: #d5e0e4;
}

* { box-sizing: border-box; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
html, body { margin: 0; padding: 0; background: #fff; color: var(--ink);
  font-family: var(--serif); font-size: 10pt; line-height: 1.45; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 600; margin: 0; line-height: 1.1; letter-spacing: -0.01em; }
h1 { font-size: 30pt; } h2 { font-size: 19pt; } h3 { font-size: 12pt; } h4 { font-size: 10.5pt; }
p { margin: 0 0 3.6mm; }
a { color: var(--accent); text-decoration: none; }
img { max-width: 100%; display: block; }
.num { font-variant-numeric: tabular-nums; }
.overline { font-family: var(--sans); font-size: 7.5pt; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--accent); margin: 0 0 2.5mm; }
.sans { font-family: var(--sans); }
.small { font-size: 8pt; line-height: 1.4; color: var(--ink-2); font-family: var(--sans); }

/* --- the page ----------------------------------------------------------- */
.sheet {
  position: relative; width: 210mm; height: 297mm; overflow: hidden;
  padding: 16mm 15mm 18mm; background: var(--paper); break-after: page; page-break-after: always;
}
.sheet:last-of-type { break-after: auto; page-break-after: auto; }
.sheet.bleed { padding: 0; }
.runner {
  position: absolute; left: 15mm; right: 15mm; bottom: 8mm; display: flex;
  justify-content: space-between; gap: 6mm; align-items: baseline;
  border-top: 0.4pt solid var(--rule); padding-top: 2mm;
  font-family: var(--sans); font-size: 7pt; color: var(--ink-2); letter-spacing: .02em;
}
.runner .pg { font-variant-numeric: tabular-nums; }
.sheet.dark { background: var(--deep); color: var(--deep-ink); }
.sheet.dark h1, .sheet.dark h2, .sheet.dark h3, .sheet.dark h4 { color: #fff; }
.sheet.dark .runner { color: var(--deep-ink-2); border-color: var(--deep-rule); }
.sheet.dark .overline { color: #e07a44; }
.sheet.dark .small { color: var(--deep-ink-2); }

/* --- cover -------------------------------------------------------------- */
.cover { padding: 0; display: flex; flex-direction: column; }
.cover .cover-img { height: 118mm; overflow: hidden; position: relative; background: var(--paper-3); }
.cover .cover-img img { width: 100%; height: 118mm; object-fit: cover; }
.cover-body { padding: 12mm 15mm 0; flex: 1; }
.cover h1 { font-size: 34pt; max-width: 15cm; }
.cover .kicker { font-family: var(--sans); font-size: 8.5pt; font-weight: 700; letter-spacing: .2em;
  text-transform: uppercase; color: var(--accent); margin-bottom: 4mm; }
.cover .stand { font-size: 12pt; margin-top: 6mm; max-width: 13cm; }
.cover-numbers { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4mm; margin-top: 9mm;
  border-top: 0.6pt solid var(--rule); border-bottom: 0.6pt solid var(--rule); padding: 4mm 0; }
.cover-numbers b { display: block; font-family: var(--sans); font-size: 16pt; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.cover-numbers span { font-family: var(--sans); font-size: 7.5pt; text-transform: uppercase; letter-spacing: .1em; color: var(--ink-2); }
.cover-contact { margin-top: 8mm; display: flex; justify-content: space-between; align-items: flex-end; gap: 8mm; }
.cover-contact .price { font-family: var(--sans); font-size: 13pt; font-weight: 700; }
.cover-contact .price small { display: block; font-weight: 400; font-size: 8pt; color: var(--ink-2); letter-spacing: .02em; }

/* --- map page ----------------------------------------------------------- */
.map-page { display: grid; grid-template-columns: 1fr 56mm; gap: 8mm; height: 100%; }
.map-page .chartbox { background: var(--sea); border: 0.5pt solid var(--rule); overflow: hidden; }
.map-page svg.chart { width: 100%; height: auto; display: block; }
.map-side h2 { margin-bottom: 3mm; }
.legtable { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 7.6pt; margin-top: 3mm; }
.legtable td { padding: 1.6mm 0; border-bottom: 0.4pt solid var(--rule); vertical-align: top; }
.legtable .w { font-weight: 700; width: 7mm; color: var(--accent); }
.legtable .d { text-align: right; color: var(--ink-2); white-space: nowrap; }
.keylist { list-style: none; margin: 4mm 0 0; padding: 0; font-family: var(--sans); font-size: 7.4pt; color: var(--ink-2); }
.keylist li { margin-bottom: 2mm; padding-left: 6mm; position: relative; }
.keylist li::before { content: "—"; position: absolute; left: 0; color: var(--accent); }

/* --- chart ink (same drawing, print palette) ---------------------------- */
.sea { fill: var(--sea); } .bank { fill: var(--sea-2); }
.fathom { fill: none; stroke: var(--fathom); stroke-width: .45; stroke-dasharray: 2.6 2; }
.iso { fill: none; stroke: var(--iso); stroke-width: .45; }
.iso-2000, .iso-3000 { stroke-dasharray: 5 3.5; }
.grid line { stroke: var(--grid); stroke-width: .3; }
.grid-lbl text, .sdg { font-family: var(--sans); fill: var(--ink-3); }
.grid-lbl text { font-size: 4.6px; } .sdg { font-size: 3.8px; }
.reef { fill: none; stroke: var(--fathom); stroke-width: 1.3; stroke-dasharray: .8 1.6; }
.exclusion circle { fill: none; stroke: var(--accent); stroke-width: .4; stroke-dasharray: 2 2; }
.xz { font-family: var(--sans); font-size: 3.4px; fill: var(--accent); }
.coast { fill: var(--coast); stroke: var(--coast-line); stroke-width: .5; }
.hit, .leg-hit { display: none; }
.dive { fill: none; stroke: var(--coast-line); stroke-width: .5; }
.leg { fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.leg-1 { stroke: #d4642a; } .leg-2 { stroke: #eb9a5f; } .leg-3 { stroke: #b8471f; }
.leg-4 { stroke: #f0b183; } .leg-5 { stroke: #98351a; } .leg-6 { stroke: #c9744a; stroke-dasharray: 4.5 2.6; }
.port-dot { fill: var(--ink); stroke: #fff; stroke-width: .6; }
.port-code { font-family: var(--sans); font-size: 5px; font-weight: 700; fill: var(--ink); letter-spacing: .06em; }
.badge circle { fill: var(--accent); stroke: #fff; stroke-width: 1; }
.badge text { font-family: var(--sans); font-size: 7px; font-weight: 700; fill: #fff; }
.isle-label text { font-family: var(--sans); font-size: 5.6px; fill: var(--ink-2); }
.isle-label.is-country text { font-weight: 700; fill: var(--ink); font-size: 6.2px; }
.leader { stroke: var(--ink-3); stroke-width: .28; }
.scalebar line { stroke: var(--ink-2); stroke-width: .6; }
.scalebar text, .compass text { font-family: var(--sans); font-size: 4.6px; fill: var(--ink-2); }
.compass .rose { fill: none; stroke: var(--ink-3); stroke-width: .5; }
.compass .needle { fill: var(--accent); }

/* --- week page ---------------------------------------------------------- */
.week-page .weekhead { display: flex; justify-content: space-between; align-items: baseline; gap: 6mm; border-bottom: 0.6pt solid var(--rule); padding-bottom: 3mm; }
.week-page .weekhead .wk { font-family: var(--sans); font-size: 8pt; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); }
.week-page .weekhead .price { font-family: var(--sans); font-size: 14pt; font-weight: 700; font-variant-numeric: tabular-nums; }
.week-page h2 { margin: 5mm 0 2mm; }
.week-page .highlights { font-family: var(--sans); font-size: 9pt; color: var(--ink-2); margin-bottom: 5mm; }
.week-figs { display: grid; grid-template-columns: 2fr 1fr; gap: 3mm; margin: 4mm 0 5mm; }
.week-figs.solo { grid-template-columns: 1fr; }
.week-figs img { height: 74mm; width: 100%; object-fit: cover; }
.week-figs .stack { display: grid; gap: 3mm; }
.week-figs .stack img { height: 35.5mm; }
.week-cols { display: grid; grid-template-columns: 1fr 62mm; gap: 8mm; align-items: start; }
.factbox { border: 0.6pt solid var(--rule); background: var(--paper-2); padding: 5mm; font-family: var(--sans); font-size: 8.4pt; }
.factbox dl { margin: 0; }
.factbox dt { color: var(--ink-2); font-size: 7.4pt; text-transform: uppercase; letter-spacing: .09em; margin-top: 3mm; }
.factbox dt:first-child { margin-top: 0; }
.factbox dd { margin: 0.6mm 0 0; font-weight: 600; }
.flags { font-size: 13pt; letter-spacing: .06em; margin-top: 4mm; }

/* --- boat / offer / practical shared ------------------------------------ */
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8mm; }
.grid2.wide-left { grid-template-columns: 1.25fr 1fr; }
.spec { border-top: 0.6pt solid var(--rule); margin-top: 4mm; font-family: var(--sans); font-size: 8.6pt; }
.spec div { display: flex; justify-content: space-between; gap: 4mm; padding: 1.9mm 0; border-bottom: 0.4pt solid var(--rule); }
.spec dt { color: var(--ink-2); } .spec dd { margin: 0; text-align: right; font-weight: 600; }
.plan svg { width: 100%; height: auto; }
.plan .hull { fill: var(--paper-2); stroke: var(--ink-3); stroke-width: 1.2; }
.plan .cab { fill: var(--accent-wash); stroke: var(--accent); stroke-width: 1; }
.plan .crew { fill: var(--paper-3); stroke: var(--ink-3); stroke-width: 1; stroke-dasharray: 3 2; }
.plan .head { fill: #fff; stroke: var(--ink-3); stroke-width: .8; }
.plan .deck { fill: none; stroke: var(--ink-3); stroke-width: 1; }
.plan text { font-family: var(--sans); font-size: 9px; fill: var(--ink-2); }
.plan .lbl-b { font-weight: 700; fill: var(--ink); }
.imgrow { display: grid; grid-template-columns: 1fr 1fr; gap: 3mm; }
.imgrow img { height: 45mm; width: 100%; object-fit: cover; }

.dive-table { width: 100%; border-collapse: collapse; font-size: 8.4pt; margin-top: 4mm; }
.dive-table th { font-family: var(--sans); font-size: 7pt; text-transform: uppercase; letter-spacing: .1em;
  text-align: left; color: var(--deep-ink-2); border-bottom: 0.6pt solid var(--deep-rule); padding: 0 3mm 1.6mm 0; }
.dive-table td { padding: 2mm 3mm 2mm 0; border-bottom: 0.4pt solid var(--deep-rule); vertical-align: top; }
.dive-table .isl { font-family: var(--sans); font-weight: 700; font-size: 8.2pt; white-space: nowrap; }
.dive-table .lvl { font-family: var(--sans); font-size: 7.4pt; color: var(--deep-ink-2); white-space: nowrap; text-align: right; }
.panel { border: 0.6pt solid var(--rule); border-left: 2pt solid var(--accent); background: var(--paper-2); padding: 4mm 5mm; margin-top: 4mm; }
.panel h3 { font-size: 10.5pt; margin-bottom: 1.5mm; }
.panel p:last-child { margin-bottom: 0; }
.sheet.dark .panel { background: var(--deep-2); border-color: var(--deep-rule); border-left-color: #e07a44; }

.offer-table { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 9pt; margin-top: 3mm; }
.offer-table th { font-size: 7pt; text-transform: uppercase; letter-spacing: .1em; color: var(--ink-2);
  text-align: left; border-bottom: 0.6pt solid var(--rule-2); padding: 0 3mm 1.8mm 0; }
.offer-table td { padding: 2.4mm 3mm 2.4mm 0; border-bottom: 0.4pt solid var(--rule); }
.offer-table .pp, .offer-table th.pp { text-align: right; padding-right: 0; font-weight: 700; font-variant-numeric: tabular-nums; }
.offer-table .wk { font-weight: 700; color: var(--accent); }
.whole { border: 0.8pt solid var(--accent); background: var(--accent-wash); padding: 5mm; margin-top: 5mm; }
.whole .big { font-family: var(--sans); font-size: 13pt; font-weight: 700; margin: 0 0 2mm; }
.whole ul { margin: 0; padding-left: 5mm; font-family: var(--sans); font-size: 8.6pt; }
.inout { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; margin-top: 4mm; font-family: var(--sans); font-size: 8.6pt; }
.inout h4 { font-family: var(--sans); font-size: 7.4pt; text-transform: uppercase; letter-spacing: .11em; color: var(--ink-2); margin-bottom: 1.5mm; }
.inout ul { list-style: none; margin: 0; padding: 0; }
.inout li { padding: 0.8mm 0 0.8mm 5mm; position: relative; }
.inout li::before { position: absolute; left: 0; font-weight: 700; }
.inout .yes li::before { content: "+"; color: var(--accent); }
.inout .no li::before { content: "–"; color: var(--ink-3); }
.tiles { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2mm; margin-top: 4mm; }
.tiles div { border: 0.5pt solid var(--rule-2); padding: 2mm 1mm; text-align: center; font-family: var(--sans); font-size: 7pt; }
.tiles .fl { font-size: 11pt; display: block; }
.tiles .wkn { color: var(--ink-3); font-size: 6.4pt; letter-spacing: .08em; text-transform: uppercase; }
.ask-box { border: 0.8pt solid var(--ink); padding: 6mm; margin-top: 6mm; }
.ask-box h3 { margin-bottom: 2mm; }
.ask-box .lines { font-family: var(--sans); font-size: 9pt; }

/* --- screen preview of the print layout --------------------------------- */
@media screen {
  body { background: #3b4045; padding: 18px 0; }
  .sheet { margin: 0 auto 18px; box-shadow: 0 8px 30px rgba(0, 0, 0, .45); }
}

/* --- image slots in print ------------------------------------------------ */
.shot { margin: 0; }
.shot picture { display: block; }
.shot img { display: block; width: 100%; height: auto; object-fit: cover; background: var(--paper-3); }
.cover-img .shot, .cover-img picture { height: 118mm; }
.imgrow .shot img { height: 42mm; }
.week-figs .shot img { height: 72mm; }
.week-figs .stack .shot img { height: 34.5mm; }
.portrait-sm .shot img { height: 52mm; }
.sheet.dark .shot img { background: var(--deep-2); }

/* --- density corrections so every page fits its A4 ---------------------- */
.sheet.dark .dive-table { font-size: 7.8pt; }
.sheet.dark .dive-table td { padding: 1.4mm 3mm 1.4mm 0; }
.sheet.dark .dive-table .isl { font-size: 7.8pt; }
.sheet.dark .panel { padding: 3mm 4mm; font-size: 8.6pt; }
.sheet.dark .panel h3 { font-size: 9.5pt; }
.sheet.dark .panel p { margin-bottom: 2mm; }
.tiles div { padding: 1.4mm 1mm; }
.tiles .fl { font-size: 10pt; }
.sheet.dark .dive-table th { padding-bottom: 1.2mm; }
.sheet.dark h2 { font-size: 17pt; }
.sheet.dark .overline { margin-bottom: 2mm; }
.sheet.dark { padding: 13mm 15mm 16mm; }
.sheet.dark .imgrow .shot img { height: 29mm; }
.ask-box { padding: 4.5mm 5mm; margin-top: 4mm; }
.ask-box h3 { font-size: 11pt; }
.ask-box .lines { font-size: 8.6pt; margin-bottom: 0; }
.sheet.dark .dive-table td { padding: 1.2mm 3mm 1.2mm 0; }
.sheet .grid2 { gap: 7mm; }
.sheet .offer-table td { padding: 2mm 3mm 2mm 0; }
.sheet .panel { padding: 3.4mm 4.5mm; }
.sheet .panel h3 { font-size: 10pt; }
.imgrow-sm .shot img { height: 25mm; }

/* --- the per-week inset chart -------------------------------------------- */
.legmap-box { position: absolute; left: 15mm; bottom: 22mm; width: 100mm; display: grid; grid-template-columns: 44mm 1fr; gap: 4mm; align-items: end; }
.legmap-box .small { margin: 0 0 2mm; }
svg.legmap { width: 44mm; height: auto; display: block; border: 0.5pt solid var(--rule); background: var(--sea); }
svg.legmap .coast { fill: var(--coast); stroke: var(--coast-line); stroke-width: 1.1; }
svg.legmap .bank { fill: var(--sea-2); }
svg.legmap .leg { stroke-width: 3.4; }
svg.legmap .port-dot { fill: var(--ink); stroke: #fff; stroke-width: 1; }
svg.legmap .ml { font-family: var(--sans); font-size: 9px; fill: var(--ink-2); }
.week-figs .stack .shot:only-child img { height: 72mm; }
.runner { font-size: 6.6pt; }
.runner .pg { white-space: nowrap; }
.imgrow-3 { grid-template-columns: repeat(3, 1fr); }
.sheet.dark .imgrow-3 .shot img { height: 30mm; }
.tiles .wkn { display: block; margin-top: 1mm; }
.tiles div { padding: 1.2mm 1mm; }
.tiles .fl { font-size: 9.5pt; }
.sheet .whole { padding: 4mm; margin-top: 4mm; }
.sheet .whole .big { font-size: 12pt; }
.sheet .offer-table td { padding: 1.9mm 3mm 1.9mm 0; }

/* --- the visa page ------------------------------------------------------ */
.visa-print { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 6.9pt;
  line-height: 1.34; margin-top: 4mm; }
.visa-print th { text-align: left; font-size: 6.6pt; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-2); background: var(--paper-3);
  padding: 1.6mm 2mm; border-bottom: 0.6pt solid var(--rule-2); }
.visa-print td { vertical-align: top; padding: 1.5mm 2mm; border-bottom: 0.4pt solid var(--rule); color: var(--ink-2); }
.visa-print tr:nth-child(even) td { background: var(--paper-2); }
.visa-print td.j { width: 30mm; color: var(--ink); font-family: var(--serif); font-size: 8pt; font-weight: 600; }
.visa-print td.j .fl { font-size: 8.5pt; margin-right: 1mm; }
.visa-print td.j .sub { display: block; font-family: var(--sans); font-size: 6pt; font-weight: 400;
  letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin-top: 0.6mm; }
.visa-print td:nth-child(2) { width: 62mm; }
.visa-print b { color: var(--accent); }

/* --- the airports table on the practicalities page ---------------------- */
.airports { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 7.4pt; margin: 4mm 0 2mm; }
.airports th { text-align: left; font-size: 6.6pt; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-2); padding: 1.4mm 2mm 1.4mm 0; border-bottom: 0.6pt solid var(--rule-2); }
.airports td { padding: 1.4mm 2mm 1.4mm 0; border-bottom: 0.4pt solid var(--rule); vertical-align: top; }
.airports td:nth-child(2), .airports td:nth-child(3) { font-weight: 700; }

/* --- lists -------------------------------------------------------------- */
ul.ticks { list-style: none; margin: 3mm 0; padding: 0; font-family: var(--sans); font-size: 8pt; line-height: 1.4; }
ul.ticks li { position: relative; padding: 1.2mm 0 1.2mm 4mm; }
ul.ticks li::before { content: "·"; position: absolute; left: 1mm; top: 0.6mm; color: var(--accent); font-weight: 700; font-size: 11pt; }
ol.four { margin: 2mm 0 0; padding-left: 5mm; font-family: var(--sans); font-size: 8pt; line-height: 1.42; }
ol.four li { padding: 0.8mm 0; }

/* --- a four-up row, used for the sea life strip ------------------------- */
.imgrow-4 { grid-template-columns: repeat(4, 1fr); gap: 2.5mm; }
.sheet.dark .imgrow-4 .shot img { height: 24mm; }
.shot { background: var(--ph, var(--paper-3)) center / cover no-repeat; }

/* --- pages added when the visa and life-aboard material outgrew one sheet
       each: a full-width panel, a tall sea-life strip, a two-column flow for
       the life-aboard copy, and a rule to separate two unrelated halves of a
       page. Each was added after measuring the sheet in a headless browser;
       see ../SELFCHECK.md §5. ------------------------------------------- */
.panel-wide { border: 0.6pt solid var(--rule); border-left: 2pt solid var(--accent);
  background: var(--paper-2); padding: 4.5mm 6mm; }
.sheet.dark .panel-wide { background: var(--deep-2); border-color: var(--deep-rule);
  border-left-color: #e07a44; font-size: 9pt; }
.panel-wide h3 { font-size: 11pt; margin-bottom: 2mm; }
.panel-wide p:last-child { margin-bottom: 0; }
.panel-wide p { max-width: 17cm; }

.sheet.dark .imgrow-tall .shot img { height: 46mm; }

.rule-wide { border-top: 0.6pt solid var(--rule-2); margin: 7mm 0 5mm; }

.life-cols { columns: 2; column-gap: 8mm; }
.life-cols > * { break-inside: avoid; }
.life-cols p { margin-bottom: 3.2mm; }
.life-cols .panel { margin-top: 3mm; }

/* The fifteen-jurisdiction tiles sat three tall rows deep and pushed the
   offer page's footnote off the sheet. One line per tile, same content. */
.tiles { gap: 1.6mm; margin-top: 3.5mm; }
.tiles div { padding: 1.5mm 2mm; text-align: left; display: flex; align-items: baseline; gap: 1.5mm; }
.tiles .fl { display: inline; font-size: 8.5pt; }
.tiles .wkn { display: inline; margin: 0 0 0 auto; }

/* The visa table ran 0.6 mm past the sheet; a hair less leading fixes it. */
.visa-print { line-height: 1.3; }
.visa-print td { padding-top: 1.5mm; padding-bottom: 1.5mm; }

/* The offer sheet carries six blocks; a millimetre off each gap keeps the
   jurisdiction footnote on the page rather than a sixteenth sheet. */
.sheet .offer-table { margin-top: 2.5mm; }
.sheet .whole { margin-top: 3mm; }
.sheet .whole + .grid2 { margin-top: 5mm; }
.sheet .tiles div { padding: 1.1mm 2mm; }
.sheet .tiles + .small { line-height: 1.35; }
.sheet .tiles + .small { font-size: 7.5pt; }
.sheet.dark .imgrow-snorkel .shot img { height: 44mm; }
.badge circle.badge-hit { display: none; }

/* The fifteen NomadMania region IDs, on the tiles, so the printed document
   carries them too — it is the one that gets forwarded. */
.tiles .nmid { font-size: 6pt; color: var(--ink-3); font-variant-numeric: tabular-nums;
  letter-spacing: .02em; margin-left: auto; }
.tiles .wkn { margin-left: 3mm; }


/* The stop-density figures belong with the route, and the map sheet's side
   column had 38 mm spare. Too narrow for a three-column table, so: a list. */
.side-h { font-family: var(--sans); font-size: 6.6pt; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--ink-2); margin: 5mm 0 1.5mm;
  border-top: 0.6pt solid var(--rule-2); padding-top: 2.5mm; }
.density-list { list-style: none; margin: 0; padding: 0; font-family: var(--sans); font-size: 6.8pt; }
.density-list li { display: flex; align-items: baseline; justify-content: space-between; gap: 2mm;
  padding: 1.4mm 0; border-bottom: 0.4pt solid var(--rule); color: var(--ink-2); line-height: 1.3; }
.density-list b { font-size: 9pt; color: var(--accent); font-variant-numeric: tabular-nums; }

/* With the region ID added, five tiles across is too tight for one line —
   "Antigua & Barbuda 1058 · 1059 W4" broke mid-number. Flag, name and week on
   the first line; the ID on its own beneath, where the digits stay together. */
.sheet .tiles div { flex-wrap: wrap; gap: 0 1.5mm; padding: 1.3mm 2mm 1.6mm; }
.tiles .nmid { flex: 1 0 100%; order: 3; margin: 0.8mm 0 0; white-space: nowrap; }
.tiles .wkn { order: 2; margin-left: auto; }