/* Shared visual contract for back navigation in React and server-rendered
   Journal pages. One public stylesheet works for both runtimes. */
:is(a, button).context-back-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-self: flex-start;
  width: fit-content !important;
  min-height: 30px;
  gap: 7px !important;
  padding: 4px 1px !important;
  margin: 0;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ps-back-ink, #7896ab) !important;
  font-family: inherit;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.25;
  letter-spacing: 0;
  text-align: left;
  text-decoration: none !important;
  text-transform: none;
  white-space: normal;
  cursor: pointer;
  transform: none !important;
  transition: color .15s ease;
}
:is(a, button).context-back-link > .icon {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px;
  color: inherit;
  transform: none !important;
}
:is(a, button).context-back-link:hover:not(:disabled) {
  color: var(--ps-back-hover, #c6e6f8) !important;
  background: transparent !important;
  text-decoration: none !important;
}
:is(a, button).context-back-link:focus-visible {
  outline: 2px solid #4ec2ff !important;
  outline-offset: 3px;
}
button.context-back-link:disabled {
  opacity: .46 !important;
  cursor: not-allowed;
}
@media (prefers-reduced-motion: reduce) {
  :is(a, button).context-back-link { transition: none; }
}