.record-view {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-24);
  flex: 1;
  min-width: 0;
}

.record-view[data-translated='true'] .quotation-view .tei-page:has(> [data-layer='translated-rendering']) > [data-layer='rendering'] {
  display: none;
}

.record-view[data-translated='true'] .quotation-view [data-layer='translated-rendering'] {
  display: flex;
}

.record-view .record-identity {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  min-width: 0;
}

.record-view .record-identity > .apparatus-rule-view {
  margin-block-start: calc(var(--spacing-16) - var(--spacing-4));
}

.record-view .record-kind-label {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  font-weight: var(--font-weight-semi-bold);
  color: var(--color-subtle);
  letter-spacing: 0.5px;
}

.record-view .record-title {
  font-family: var(--typography-font-sans);
  font-size: 36px;
  font-weight: var(--font-weight-semi-bold);
  color: var(--color-base);
  line-height: calc(36px + var(--spacing-10));
  margin: 0;
  overflow-wrap: anywhere;
}

.record-view .record-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--spacing-8);
  min-width: 0;
}

.record-view .origin-added > .datum-value {
  border-color: var(--border-color-green);
  outline-width: var(--border-width-base);
  outline-style: solid;
  outline-color: var(--border-color-green);
}

.record-view .record-tree-section {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-8);
  min-width: 0;
}

.record-view .record-section {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-24);
  min-width: 0;
}

.record-view .record-work-title {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-x-large-20);
  font-weight: var(--font-weight-semi-bold);
  color: var(--color-base);
  margin: 0;
}

.record-view .record-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-8);
  min-width: 0;
}

.record-view .record-section-title {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  font-weight: var(--font-weight-semi-bold);
  color: var(--color-base);
  margin: 0;
}

.record-view .record-tree {
  display: flex;
  flex-direction: column;
  min-width: 0;
  position: relative;
}