/* ============================================================
   Vecstrata — data tables & figures inside post content
   (.ghost-content). The briefings are table- and figure-heavy:
   weighted-futures tables, movement tables, scorecards, inline
   SVG plates. Uses Brief's design tokens so both color schemes
   just work. Loaded globally from default.hbs.
   ============================================================ */

/* --- Tables: dense, numeric-friendly, never break the column ------- */
.ghost-content table {
  display: block;              /* wide tables scroll inside their own box */
  overflow-x: auto;
  max-width: 100%;
  border-collapse: collapse;
  font-size: 0.875em;
  line-height: 1.45;
  font-variant-numeric: tabular-nums;
  margin: 1.6em 0;
}

.ghost-content table thead th {
  text-align: left;
  font-weight: 600;
  color: var(--color-typography);
  background: var(--color-background-tone);
  border-bottom: 2px solid var(--color-border);
  white-space: nowrap;
}

.ghost-content table th,
.ghost-content table td {
  padding: 0.5em 0.9em;
  border-bottom: 1px solid var(--color-border);
  vertical-align: top;
  /* Brief's .ghost-content sets word-break:break-word, which lets the
     auto table layout shrink text columns to syllable width (all the
     squeeze lands on the one breakable column). Words stay whole; a
     too-wide table scrolls via the overflow-x on the table box. */
  word-break: normal;
  overflow-wrap: normal;
}

.ghost-content table tbody tr:last-child td {
  border-bottom: none;
}

/* right-align obviously numeric cells when the author marks them */
.ghost-content table td[align="right"],
.ghost-content table th[align="right"] {
  text-align: right;
}

/* --- Figures: inline SVG plates and images ------------------------- */
.ghost-content figure {
  margin: 2em 0;
}

.ghost-content figure svg,
.ghost-content figure img,
.ghost-content svg {
  max-width: 100%;
  height: auto;
}

.ghost-content figcaption {
  margin-top: 0.6em;
  font-size: 0.85em;
  color: var(--color-typography-tone);
  text-align: center;
}