<figure>
  <div>
    <table>
      <thead>
        <tr>
          <th></th>
          <th scope="col">A</th>
          <th scope="col">B</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th scope="row">1</th>
          <td>A1</td>
          <td>B1</td>
        </tr>
        <tr>
          <th scope="row">2</th>
          <td>A2</td>
          <td>B2</td>
        </tr>
      </tbody>
    </table>
  </div>
  <figcaption>Lorem ipsum dolor sit amet, consectetur adipiscing elit</figcaption>
</figure>

* {
  box-sizing: border-box;
  line-height: var(--line-height);
}
html {
  & {
    --borw: black;
    --worb: white;
    --line-height: calc(1em + 1rem);
    background: var(--worb);
    color: var(--borw);
  }
  @media (prefers-color-scheme: dark) {
    & {
      --borw: white;
      --worb: black;
    }
  }
}
figure {
  inline-size: fit-content;
  max-inline-size: 100%;
  margin-inline: auto;
}
figcaption {
  --line-height: 1.5em;
  font-size: 0.75em;
  inline-size: 0;
  min-inline-size: fit-content;
  margin-block: 0.25em;
  margin-inline: auto;
}
div {
  &:has(> table:only-child) {
    --border-width: 1px;
    --border-color: color-mix(in srgb, var(--worb), currentcolor 25%);
    border: solid var(--border-width) var(--border-color);
    max-block-size: 80dvb;
    overflow: auto;
    resize: both;
  }
  & > table:only-child {
    & {
      border: hidden;
      border-collapse: collapse;
      min-block-size: 100%;
      min-inline-size: 100%;
    }
    & tr > * {
      border: solid var(--border-width) var(--border-color);
      padding-block: 0.5rem;
      padding-inline: 1rem;
      text-align: inherit;
      vertical-align: baseline;
    }
    & tr > :empty {
      background-image: linear-gradient(
        to right top,
        transparent calc(50% - var(--border-width) / 2),
        var(--border-color) calc(50% - var(--border-width) / 2),
        var(--border-color) calc(50% + var(--border-width) / 2),
        transparent calc(50% + var(--border-width) / 2)
      );
    }
    & th {
      background: color-mix(in srgb, var(--worb), currentcolor 12.5%);
    }
  }
}