.text-story-formatting-marks {
  display: none;
  fill: var(--arhix-ink-muted);
  font-family: "Arhix Formatting Marks", Arial, sans-serif;
  pointer-events: none;
}

.document-workspace[data-formatting-marks-visible="true"]
  .text-story-formatting-marks {
  display: block;
}

.document-workspace__viewport {
  background: var(--arhix-workspace-backdrop);
  overflow-anchor: none;
}

.document-workspace__pages {
  display: flex;
  min-width: 100%;
  width: max-content;
  box-sizing: border-box;
  flex-direction: column;
  align-items: center;
  gap: var(--arhix-space-section);
  padding: calc(2 * var(--arhix-space-section)) var(--arhix-space-edge);
}

.document-workspace__page {
  position: relative;
  flex: none;
  overflow: hidden;
  box-sizing: border-box;
  border: var(--arhix-border-hairline) solid var(--arhix-paper-frame);
  background: var(--arhix-paper);
}

.document-workspace__page-scene {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.document-workspace__layout-guides {
  position: absolute;
  z-index: 4;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.document-workspace__layout-guide {
  position: absolute;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  pointer-events: auto;
}

.document-workspace__layout-guide::after {
  position: absolute;
  background: var(--arhix-ink-ghost);
  content: "";
}

.document-workspace__layout-guide[aria-pressed="true"]::after {
  background: var(--arhix-accent);
}

.document-workspace__layout-guide--top,
.document-workspace__layout-guide--bottom {
  right: 0;
  left: 0;
  height: calc(12 * var(--arhix-ui-unit));
  transform: translateY(calc(-6 * var(--arhix-ui-unit)));
}

.document-workspace__layout-guide--top {
  top: var(--document-margin-top);
}

.document-workspace__layout-guide--bottom {
  bottom: var(--document-margin-bottom);
  transform: translateY(calc(6 * var(--arhix-ui-unit)));
}

.document-workspace__layout-guide--top::after,
.document-workspace__layout-guide--bottom::after {
  top: calc(50% - var(--arhix-border-hairline) / 2);
  right: 0;
  left: 0;
  height: var(--arhix-border-hairline);
}

.document-workspace__layout-guide--left,
.document-workspace__layout-guide--right,
.document-workspace__layout-guide--paragraph {
  top: 0;
  bottom: 0;
  width: calc(12 * var(--arhix-ui-unit));
  transform: translateX(calc(-6 * var(--arhix-ui-unit)));
}

.document-workspace__layout-guide--left {
  left: var(--document-margin-left);
}

.document-workspace__layout-guide--right {
  right: var(--document-margin-right);
  transform: translateX(calc(6 * var(--arhix-ui-unit)));
}

.document-workspace__layout-guide--paragraph {
  top: var(--document-margin-top);
  bottom: auto;
  left: var(--document-paragraph-indent);
  height: var(--document-paragraph-guide-height);
}

.document-workspace__layout-guide--left::after,
.document-workspace__layout-guide--right::after,
.document-workspace__layout-guide--paragraph::after {
  top: 0;
  bottom: 0;
  left: calc(50% - var(--arhix-border-hairline) / 2);
  width: var(--arhix-border-hairline);
}

.document-workspace__text-frame-hit-target {
  fill: transparent;
  pointer-events: all;
  stroke: transparent;
}
