/* The title block: a framed stack of cells, each a tracked-caps label over a
   value, as in the corner of a drawing. The frame is the sheet's double edge
   at a smaller scale. */
@layer components {
  .title-block {
    display: flex;
    flex-direction: column;
    border: var(--rule-width) solid var(--color-rule);
    outline: var(--rule-width) solid var(--color-hairline);
    outline-offset: calc(var(--frame-offset) - var(--rule-width) * 2);
    background-color: var(--color-panel);
  }

  .title-block__cell {
    padding: calc(var(--block-space) * 0.625) calc(var(--inline-space) * 1.75);
    border-block-end: var(--rule-width) solid var(--color-rule);

    &:last-child {
      border-block-end: 0;
    }
  }

  .title-block__title {
    margin-block-start: calc(var(--block-space) * 0.125);
    font-size: var(--text-xl);
  }
}