/* =============================================================================
   VOID DRIFTERS SHIP STAT BLOCK: web edition
   Loaded on the Void Drifters universe site (layouts/universe_site.php, theme
   void-drifters) and on sourcebook chapter pages (the shipwright catalogs).

   The print rules are the SHIP STAT BLOCK section of shared/css/void-drifters.css
   in the book repository; the design record is universes/void-drifters/
   vehicles-manual/notes/statblock-proposal/PROPOSAL.md. These are the same
   rules with the `.page` prefix replaced by `.rulebook-content` (both page
   kinds wrap their chapter in it), sizes in rem instead of cm, and the class
   names the extractor writes (tools/extract-universe-site.mjs, SHIP_BLOCKS):

     print                 web
     .ship                 .ship-block
     .wide / .compact      .ship-wide / .ship-compact
     .crown, .irnan, ...   .ship-crown, .ship-irnan, ...
     .compare / .summary   .ship-compare / .ship-summary
     .shipkey              .ship-key
     .shipweapons          .ship-weapons
     .ship-cols, .ship-id, .ship-sect, .ship-class, .q   unchanged

   Every class is ship-* (or .q inside a ship block), so nothing here touches
   another book. The Starship Armory's .weapon.ship is a different block.

   The block is always light paper with dark ink, whatever the page theme, so
   it carries its own palette (the Void Drifters print tokens). Selectors are
   heavy enough to beat rulebook.css, universe-site.css and the universe
   theme's generic table and heading rules.
   ============================================================================= */

.rulebook-content .ship-block {
  --ship-page:       #F0F4F7;
  --ship-slate:      #1A2634;
  --ship-slate-mid:  #2D4254;
  --ship-steel-lt:   #6A8BA8;
  --ship-ember:      #C2610A;
  --ship-ember-lt:   #E07A25;
  --ship-ember-dk:   #8A4208;
  --ship-text:       #1A2634;
  --ship-text-muted: #4A5F72;
  --ship-label-font: 'Barlow Condensed', 'Roboto Condensed', 'Arial Narrow', sans-serif;
  --ship-text-font:  'Roboto Condensed', 'Barlow Condensed', 'Arial Narrow', sans-serif;

  --ship-accent: var(--ship-steel-lt);
  --ship-rule:   rgba(26, 38, 52, 0.16);
  --ship-label:  var(--ship-text-muted);
  display: block;
  max-width: 34rem;
  margin: 1rem 0 1.4rem;
  border: 1px solid rgba(26, 38, 52, 0.42);
  border-left: 4px solid var(--ship-accent);
  background: #fff;
  color: var(--ship-text);
  font-family: var(--ship-text-font);
  font-size: 0.98rem;
  line-height: 1.28;
  text-align: left;
  hyphens: manual;
  -webkit-hyphens: manual;
  break-inside: avoid;
  page-break-inside: avoid;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

/* Registry stripe colours: builders take their power's colour. */
.rulebook-content .ship-block.ship-crown,     .rulebook-content .ship-block.ship-irnan    { --ship-accent: #2F6FA3; }
.rulebook-content .ship-block.ship-openframe, .rulebook-content .ship-block.ship-antaean  { --ship-accent: #168A8F; }
.rulebook-content .ship-block.ship-viridian                                               { --ship-accent: #1E7F6E; }
.rulebook-content .ship-block.ship-shoiyan                                                { --ship-accent: #0F5E4A; }
.rulebook-content .ship-block.ship-kharos,    .rulebook-content .ship-block.ship-funtari  { --ship-accent: #8F3F24; }
.rulebook-content .ship-block.ship-safa,      .rulebook-content .ship-block.ship-jaziri   { --ship-accent: #B8892A; }
.rulebook-content .ship-block.ship-common                                                 { --ship-accent: var(--ship-steel-lt); }

/* 1. Header band: designation, then class in ember */
.rulebook-content .ship-block h3 {
  margin: 0;
  padding: 0.3em 0.55em 0.24em;
  background: var(--ship-slate);
  color: var(--ship-page);
  border: 0;
  font-family: var(--ship-label-font);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.rulebook-content .ship-block h3[id]::after { color: var(--ship-ember-lt); }
.rulebook-content .ship-block h3 .ship-class {
  margin-left: 0.3em;
  color: var(--ship-ember-lt);
  font-size: 0.74em;
  font-weight: 600;
  letter-spacing: 0.07em;
}

/* 2. Identity line: builder and family left, Scale badge right */
.rulebook-content .ship-block .ship-id {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.6em;
  padding: 0.2em 0.5em 0.2em 0.6em;
  background: var(--ship-slate-mid);
  color: #c9d5e0;
  font-size: 0.92em;
  letter-spacing: 0.01em;
}
/* Homebrewery wraps the identity line's content in a <p>; the extractor's
   markup does not, but a hand-written page might. */
.rulebook-content .ship-block .ship-id > p {
  display: flex;
  flex: 1 1 auto;
  justify-content: space-between;
  align-items: center;
  gap: 0.6em;
  margin: 0;
  padding: 0;
  border: 0;
  text-indent: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}
.rulebook-content .ship-block .ship-id span { color: inherit; }
.rulebook-content .ship-block .ship-id b {
  flex: none;
  padding: 0.06em 0.5em 0;
  background: var(--ship-ember);
  color: #fff;
  font-family: var(--ship-label-font);
  font-size: 1.08em;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  border-radius: 2px;
  white-space: nowrap;
}

/* 3-4. Tables inside the block: label-over-value strips */
.rulebook-content .ship-block table {
  display: table;
  width: 100%;
  max-width: none;
  margin: 0;
  overflow: visible;
  table-layout: fixed;
  border-collapse: collapse;
  background: transparent;
  color: var(--ship-text);
  font-size: 1em;
  border-top: 1px solid var(--ship-rule);
}
.rulebook-content .ship-block tr,
.rulebook-content .ship-block tr:nth-child(even),
.rulebook-content .ship-block tr:nth-child(even) td { background: transparent; }
.rulebook-content .ship-block th,
.rulebook-content .ship-block td { box-sizing: border-box; }

.rulebook-content .ship-block th {
  background: transparent;
  color: var(--ship-label);
  padding: 0.42em 0.2em 0.04em;
  border: 0;
  font-family: var(--ship-label-font);
  font-size: 0.74em;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  text-align: center;
  vertical-align: bottom;
}
.rulebook-content .ship-block td {
  padding: 0.02em 0.2em 0.32em;
  border: 0;
  color: var(--ship-slate);
  font-family: var(--ship-label-font);
  font-size: 1.2em;
  font-weight: 600;
  line-height: 1.12;
  text-align: center;
  vertical-align: top;
  font-variant-numeric: lining-nums tabular-nums;
}
.rulebook-content .ship-block th + th,
.rulebook-content .ship-block td + td { border-left: 1px solid var(--ship-rule); }

/* 3. Market line: the first table, left-aligned, role gets half */
.rulebook-content .ship-block .ship-id + table { border-top: 0; }
.rulebook-content .ship-block .ship-id + table th,
.rulebook-content .ship-block .ship-id + table td { text-align: left; padding-left: 0.55em; }
.rulebook-content .ship-block .ship-id + table th:first-child { width: 50%; }
.rulebook-content .ship-block .ship-id + table td { font-size: 1.05em; }

/* 5. Weapons table: name left with its mount, arc and qualities beneath */
.rulebook-content .ship-block .ship-sect {
  padding: 0.3em 0.55em 0.15em;
  border-top: 1px solid var(--ship-rule);
  color: var(--ship-ember-dk);
  font-family: var(--ship-label-font);
  font-size: 0.8em;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.rulebook-content .ship-block .ship-sect + table { border-top: 0; }
.rulebook-content .ship-block .ship-sect + table th {
  padding: 0.1em 0.2em 0.15em;
  border-bottom: 1px solid rgba(26, 38, 52, 0.4);
}
.rulebook-content .ship-block .ship-sect + table th:first-child { width: 40%; }
.rulebook-content .ship-block .ship-sect + table th:nth-child(2) { width: 17%; }
.rulebook-content .ship-block .ship-sect + table th + th,
.rulebook-content .ship-block .ship-sect + table td + td { border-left: 0; }
.rulebook-content .ship-block .ship-sect + table th:first-child,
.rulebook-content .ship-block .ship-sect + table td:first-child { text-align: left; padding-left: 0.55em; }
.rulebook-content .ship-block .ship-sect + table td {
  padding-top: 0.22em;
  padding-bottom: 0.22em;
  font-size: 1.04em;
  vertical-align: top;
}
.rulebook-content .ship-block .ship-sect + table td:nth-child(2) { font-size: 0.92em; padding-top: 0.32em; }
.rulebook-content .ship-block .ship-sect + table tbody tr:nth-child(even) { background: rgba(67, 93, 116, 0.07); }
.rulebook-content .ship-block .ship-sect + table .q {
  display: block;
  margin-top: 0.05em;
  color: var(--ship-text-muted);
  font-family: var(--ship-text-font);
  font-size: 0.78em;
  font-weight: 400;
  font-style: italic;
  line-height: 1.2;
}

/* 6. Text rows: a fixed label column, text hangs beside it */
.rulebook-content .ship-block p {
  margin: 0;
  padding: 0.3em 0.55em 0.3em 5.5em;
  text-indent: -4.95em;
  border-top: 1px solid var(--ship-rule);
  color: var(--ship-text);
  font-size: 0.98em;
  line-height: 1.3;
  text-align: left;
}
.rulebook-content .ship-block p > strong:first-child {
  display: inline-block;
  width: 6.19em;              /* 4.95em at the label's 0.8em size */
  text-indent: 0;
  color: var(--ship-ember-dk);
  font-family: var(--ship-label-font);
  font-size: 0.8em;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-right: -0.27em;      /* absorb the space after the label */
}
.rulebook-content .ship-block p em { color: inherit; }
.rulebook-content .ship-block p strong em { color: var(--ship-slate); font-style: italic; }

/* Wide variant (Scale 6 and up, carriers): 8-cell strips, text rows in two columns */
.rulebook-content .ship-block.ship-wide { max-width: none; }
.rulebook-content .ship-block.ship-wide h3 { font-size: 1.65rem; }
.rulebook-content .ship-block.ship-wide .ship-id + table th:first-child { width: 50%; }
.rulebook-content .ship-block.ship-wide .ship-sect + table th:first-child { width: 46%; }
.rulebook-content .ship-block .ship-cols {
  column-count: 2;
  column-gap: 0;
  column-rule: 1px solid var(--ship-rule);
  border-top: 1px solid var(--ship-rule);
}
.rulebook-content .ship-block .ship-cols p { break-inside: avoid; -webkit-column-break-inside: avoid; }
.rulebook-content .ship-block .ship-cols p:first-child { border-top: 0; }

/* Compact variant (ground and hover vehicles) */
.rulebook-content .ship-block.ship-compact h3 { font-size: 1.35rem; }

/* Comparison and summary tables (Chapters 16 and 19) */
.rulebook-content .ship-compare table,
.rulebook-content .ship-summary table { font-variant-numeric: lining-nums tabular-nums; }
.rulebook-content .ship-compare td:first-child {
  color: #4A5F72;
  font-family: 'Barlow Condensed', 'Roboto Condensed', 'Arial Narrow', sans-serif;
  font-size: 0.9em;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}
.rulebook-content .ship-compare td:not(:first-child),
.rulebook-content .ship-compare th:not(:first-child) { text-align: center; }
.rulebook-content .ship-compare td { padding-top: 0.25em; padding-bottom: 0.25em; }
.rulebook-content .ship-summary table { font-size: 0.9rem; }
.rulebook-content .ship-summary th,
.rulebook-content .ship-summary td { padding: 0.3em 0.4em; }
.rulebook-content .ship-summary td:first-child { font-weight: 600; white-space: nowrap; }
/* A left-aligned column after a right-aligned one (Price then Role in the
   craft, transport and emergency sets) gets a gutter, so the figure and
   the text do not run together. */
.rulebook-content .ship-summary td[align="right"] + td,
.rulebook-content .ship-summary th[align="right"] + th { padding-left: 1em; }

/* Weapon reference tables ({{shipweapons}}, Vehicles Manual Chapter 19, section 9).
   Fixed column widths shared by every table, so the three tables line up one
   under another, as in print. The print percentages (void-drifters.css) are
   tuned for 8.4pt type and tight cells; the web type is larger, so Mount and
   the three small number columns get a little more here and Tags a little
   less (Range wraps at its dash). rulebook.css makes every table a scrolling
   block; here the wrapper scrolls instead, and the table keeps a minimum
   width so a phone scrolls it sideways rather than squeezing nine columns. */
.rulebook-content .ship-weapons { overflow-x: auto; margin: 1.1rem 0; }
.rulebook-content .ship-weapons table {
  display: table;
  width: 100%;
  min-width: 760px;
  max-width: none;
  margin: 0;
  table-layout: fixed;
  overflow: visible;
  font-size: 0.82rem;
  font-variant-numeric: lining-nums tabular-nums;
}
.rulebook-content .ship-weapons th,
.rulebook-content .ship-weapons td { padding: 0.35em 0.45em; }
.rulebook-content .ship-weapons th { font-size: 0.74rem; letter-spacing: 0.02em; padding: 0.45em 0.3em; }
.rulebook-content .ship-weapons th:nth-child(1) { width: 15%; }
.rulebook-content .ship-weapons th:nth-child(2) { width: 11%; }
.rulebook-content .ship-weapons th:nth-child(3) { width: 12.5%; }
.rulebook-content .ship-weapons th:nth-child(4) { width: 10.5%; }
.rulebook-content .ship-weapons th:nth-child(5),
.rulebook-content .ship-weapons th:nth-child(6),
.rulebook-content .ship-weapons th:nth-child(7) { width: 5%; }
.rulebook-content .ship-weapons th:nth-child(8) { width: 11%; }
.rulebook-content .ship-weapons th:nth-child(9) { width: 25%; }
.rulebook-content .ship-weapons th[align="center"] { text-align: center; }

/* Reading key ({{shipkey}}, Vehicles Manual Chapter 16): the numbered key to the
   sample block. Body type stays at the table size; tighter leading and narrower
   #, Cell and Rule columns give the description more width. */
.rulebook-content .ship-key table { margin-bottom: 0.5rem; }
.rulebook-content .ship-key td { line-height: 1.25; }
.rulebook-content .ship-key th:first-child { width: 7%; }
.rulebook-content .ship-key th:nth-child(2) { width: 20%; }
.rulebook-content .ship-key th:nth-child(4) { width: 21%; }

/* Narrow screens (ruling S7): a wide block is shown as a column block. Its two
   8-cell strips are laid out as four rows of four (labels over values, the
   same grid as the column variant), and its text rows drop to one column. The
   strips are the 2nd and 3rd tables after .ship-id. */
@media (max-width: 600px) {
  .rulebook-content .ship-block.ship-wide h3 { font-size: 1.5rem; }
  .rulebook-content .ship-block .ship-cols { column-count: 1; }
  .rulebook-content .ship-block .ship-cols p:first-child { border-top: 0; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table,
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table :is(thead, tbody, tr),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table :is(thead, tbody, tr) { display: contents; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table :is(th, td),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table :is(th, td) { display: block; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table th:nth-child(-n+4),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table th:nth-child(-n+4) { grid-row: 1; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table td:nth-child(-n+4),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table td:nth-child(-n+4) { grid-row: 2; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table th:nth-child(n+5),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table th:nth-child(n+5) { grid-row: 3; border-top: 1px solid var(--ship-rule); }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table td:nth-child(n+5),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table td:nth-child(n+5) { grid-row: 4; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table :is(th, td):nth-child(4n+1),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table :is(th, td):nth-child(4n+1) { grid-column: 1; border-left: 0; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table :is(th, td):nth-child(4n+2),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table :is(th, td):nth-child(4n+2) { grid-column: 2; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table :is(th, td):nth-child(4n+3),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table :is(th, td):nth-child(4n+3) { grid-column: 3; }
  .rulebook-content .ship-block.ship-wide .ship-id + table + table :is(th, td):nth-child(4n),
  .rulebook-content .ship-block.ship-wide .ship-id + table + table + table :is(th, td):nth-child(4n) { grid-column: 4; }
  .rulebook-content .ship-block.ship-wide .ship-sect + table th:first-child { width: 40%; }
}
