@layer screens {
  .records-workbench {
    width: min(100%, var(--content-workspace-width));
    max-width: var(--content-workspace-width);
  }

  .records-header {
    align-items: flex-start;
    margin-bottom: var(--space-4);
  }

  .records-header .button {
    align-self: flex-start;
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .records-tabs {
    margin-bottom: var(--space-5);
  }

  .records-filter-toolbar {
    min-height: var(--touch-target);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-4);
    margin-bottom: var(--space-3);
  }

  .records-search {
    min-width: min(100%, 20rem);
    flex: 1 1 20rem;
  }

  .records-filter-group {
    min-inline-size: 0;
    display: flex;
    align-items: center;
    gap: var(--space-3);
  }

  .records-filter-label,
  .records-event-type {
    color: var(--text-secondary);
    font-size: var(--type-caption);
    font-weight: var(--weight-semibold);
  }

  .records-filter-select {
    min-width: calc(var(--touch-target) * 3);
  }

  .records-period-select {
    min-width: calc(var(--touch-target) * 2.5);
  }

  .records-results-meta {
    min-height: var(--touch-target);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
  }

  .records-count {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-family: var(--font-mono);
    font-size: var(--type-micro);
  }

  .records-event-heading {
    min-inline-size: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
  }

  .records-target-identity .text-button {
    min-height: var(--space-5);
    color: var(--text-primary);
    font-size: var(--type-body);
    line-height: var(--leading-tight);
    text-align: start;
  }

  .records-target-description {
    color: var(--text-primary);
    font-size: var(--type-body);
    line-height: var(--leading-tight);
    overflow-wrap: anywhere;
  }

  .records-target-description.is-taxon {
    font-family: var(--font-taxon);
    font-style: italic;
  }

  .records-status {
    color: var(--warning);
  }

  .records-action-menu .action-menu-trigger {
    color: var(--text-secondary);
  }
  .records-action-menu .action-menu-trigger::before { content: "•••"; font-size: var(--type-body); letter-spacing: 0.08em; line-height: var(--leading-ui); }
  @supports (content-visibility: auto) { .records-ledger-row { contain-intrinsic-size: auto 131px; } }
  @supports (content-visibility: auto) { .records-ledger-row:nth-child(-n + 5) { content-visibility: visible; contain: none; } }
  .records-empty {
    margin-top: var(--space-2);
  }

  @media (max-width: 767px) {
    @supports (content-visibility: auto) { .records-ledger-row { contain-intrinsic-size: auto 191px; } }
    .records-header {
      gap: var(--space-3);
    }

    .records-filter-toolbar {
      align-items: stretch;
      flex-direction: column;
    }

    .records-filter-group {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .records-search,
    .records-filter-select,
    .records-period-select {
      width: 100%;
      min-width: 0;
    }

    .records-search { flex: 0 0 auto; }

    .records-target-identity .text-button {
      min-height: var(--touch-target);
    }
  }
}