.locution-view {
  display: flex;
  gap: var(--spacing-12);
  align-items: flex-start;
}

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

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

.locution-view .locution-header {
  min-width: 0;
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  line-height: var(--line-height-small-22);
  color: var(--color-subtle);
}

.locution-view .locution-header > *, .locution-view .locution-header > .link-view {
  display: inline;
}

.locution-view .locution-summary {
  color: var(--color-base);
}

.locution-view .locution-object {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  overflow-wrap: anywhere;
}

.locution-view .locution-author {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  font-weight: var(--font-weight-semi-bold);
  color: var(--color-base);
}

.locution-view .locution-timestamp {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  color: var(--color-subtle);
}

.locution-view .locution-call-evidence-crop {
  font-family: var(--typography-font-mono);
  font-size: var(--font-size-medium-16);
  color: var(--color-subtle);
}

.locution-view .locution-edited {
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  font-style: italic;
  color: var(--color-subtle);
}

.locution-view .locution-call-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-8);
}

.locution-view .locution-anchor {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-4);
  align-items: flex-start;
  min-width: 0;
}

.locution-view .locution-resemblance {
  font-family: var(--typography-font-mono);
  font-size: var(--font-size-medium-16);
  color: var(--color-subtle);
}

.locution-view .locution-body {
  min-width: 0;
  overflow-wrap: anywhere;
  font-family: var(--typography-font-sans);
  font-size: var(--font-size-medium-16);
  color: var(--color-base);
  margin: 0;
  font-style: normal;
}

.locution-view [data-code-syntax]::highlight(code-tag), .locution-view [data-code-syntax] *::highlight(code-tag) {
  color: var(--color-syntax-plain-text);
}

.locution-view [data-code-syntax] [data-code-kind='code-tag'] {
  color: var(--color-syntax-plain-text);
}

.locution-view [data-code-syntax]::highlight(code-name), .locution-view [data-code-syntax] *::highlight(code-name) {
  color: var(--color-syntax-keywords);
}

.locution-view [data-code-syntax] [data-code-kind='code-name'] {
  color: var(--color-syntax-keywords);
}

.locution-view [data-code-syntax]::highlight(code-attr), .locution-view [data-code-syntax] *::highlight(code-attr) {
  color: var(--color-syntax-attributes);
}

.locution-view [data-code-syntax] [data-code-kind='code-attr'] {
  color: var(--color-syntax-attributes);
}

.locution-view [data-code-syntax]::highlight(code-value), .locution-view [data-code-syntax] *::highlight(code-value) {
  color: var(--color-syntax-strings);
}

.locution-view [data-code-syntax] [data-code-kind='code-value'] {
  color: var(--color-syntax-strings);
}

.locution-view [data-code-syntax]::highlight(code-entity), .locution-view [data-code-syntax] *::highlight(code-entity) {
  color: var(--color-syntax-characters);
}

.locution-view [data-code-syntax] [data-code-kind='code-entity'] {
  color: var(--color-syntax-characters);
}

.locution-view [data-code-syntax]::highlight(code-prefix), .locution-view [data-code-syntax] *::highlight(code-prefix) {
  color: var(--color-syntax-other-type-names);
}

.locution-view [data-code-syntax] [data-code-kind='code-prefix'] {
  color: var(--color-syntax-other-type-names);
}

.locution-view [data-code-syntax]::highlight(code-pi), .locution-view [data-code-syntax] *::highlight(code-pi) {
  color: var(--color-syntax-preprocessor-statements);
}

.locution-view [data-code-syntax] [data-code-kind='code-pi'] {
  color: var(--color-syntax-preprocessor-statements);
}

.locution-view [data-code-syntax]::highlight(code-cdata), .locution-view [data-code-syntax] *::highlight(code-cdata) {
  color: var(--color-syntax-other-constants);
}

.locution-view [data-code-syntax] [data-code-kind='code-cdata'] {
  color: var(--color-syntax-other-constants);
}

.locution-view [data-code-syntax]::highlight(code-comment), .locution-view [data-code-syntax] *::highlight(code-comment) {
  color: var(--color-syntax-comments);
}

.locution-view [data-code-syntax] [data-code-kind='code-comment'] {
  color: var(--color-syntax-comments);
}

.locution-view .locution-body-raw {
  display: none;
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-family: var(--typography-font-mono);
  font-size: var(--font-size-medium-16);
  color: var(--color-base);
}

.locution-view[data-raw='true'] .locution-body-raw {
  display: block;
}

.locution-view[data-raw='true'] .locution-body-rendered {
  display: none;
}

.locution-view .locution-body .prompt-legend-view {
  white-space: normal;
}

.locution-view .locution-body .computorium-session-prompt-legend-vignette, .locution-view .locution-body .computorium-session-prompt-legend-vignette .link-view {
  white-space: normal;
  overflow-wrap: anywhere;
}

.locution-view .locution-body[data-deleted='true'] {
  color: var(--color-subtle);
  font-style: italic;
}

.locution-view .locution-body a {
  color: var(--color-blue);
  text-decoration: none;
}

.locution-view .locution-body a:hover {
  color: var(--color-blue-hover);
}

.locution-view .locution-edit {
  display: none;
}

.locution-view .locution-edit:target, .locution-view .locution-edit:has(:target) {
  display: block;
}

.locution-view:has(.locution-edit:target) .locution-body, .locution-view:has(.locution-edit :target) .locution-body, .locution-view:has(.locution-edit:target) .reactions-view, .locution-view:has(.locution-edit :target) .reactions-view, .locution-view:has(.locution-edit:target) .locution-actions, .locution-view:has(.locution-edit :target) .locution-actions {
  display: none;
}

.locution-view .locution-edit-form {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-8);
  min-width: 0;
}

.locution-view .locution-edit-form:not(:target) .field-validation-message-view {
  display: none;
}

.locution-view[data-dimmed='true'] > .avatar-view, .locution-view[data-dimmed='true'] > .locution-content > :is(.locution-said, .locution-view .reactions-view):not(:has(.tooltip-view)), .locution-view[data-dimmed='true'] :is(.locution-said, .locution-view .reactions-view):has(.tooltip-view) > :not(:has(.tooltip-view)):not(.tooltip-view):not(.locution-actions), .locution-view[data-dimmed='true'] :is(.locution-said, .locution-view .reactions-view) :has(.tooltip-view) > :not(:has(.tooltip-view)):not(.tooltip-view):not(.locution-actions), .locution-view[data-dimmed='true'] .reactions-view:has(.tooltip-view) .locution-actions > *, .locution-view[data-dimmed='true'] .tooltip-view > .tooltip-trigger-content {
  opacity: var(--opacity-medium);
}

.locution-view .locution-edit-buttons {
  display: flex;
  justify-content: flex-end;
  gap: var(--spacing-8);
}

.locution-view .locution-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: var(--spacing-16);
}
