/* Additions on top of app.css for the excerpt workbench. */

.elided { color: var(--faint); font-style: italic; font-size: 13px; margin: 0 0 10px 124px; }

.cutline {
  display: flex; align-items: center; gap: 10px;
  margin: 16px 0; color: var(--danger); font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .5px;
}
.cutline::before, .cutline::after { content: ''; flex: 1; border-top: 2px dashed var(--danger); }

.turn.target .meta::after { content: attr(data-label); display: block; font-size: 11px; color: var(--accent); }
.turn.target { cursor: pointer; }

.section-title {
  font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px;
  color: var(--accent); margin: 22px 0 6px; padding-top: 14px; border-top: 1px solid var(--line-soft);
}
.section-title:first-of-type { border-top: none; padding-top: 0; }
.check.compact { margin: 4px 0; }
.qhint { font-weight: 400; color: var(--faint); }
.qselect { margin-top: 3px; font-size: 12px; font-weight: 600; color: var(--accent-ink); }
.qrequired { font-weight: 600; color: var(--danger); }
.page-step { font-size: 11px; font-weight: 600; color: var(--faint); text-transform: uppercase; letter-spacing: .5px; margin: 0 0 10px; }
/* Reviewed and judged fine: keep it distinguishable from a flagged turn. */
.turn.marked.cleared .text { background: var(--surface); box-shadow: none; border-color: var(--line); }
.turn.marked.cleared.selected .text { background: var(--subtle); }
.group-title { margin: 14px 0 4px; font-size: 15px; font-weight: 700; color: var(--ink); }
.show-earlier { display: block; margin: 0 0 10px 124px; padding: 4px 10px; font-size: 12px; }
.radio-row { display: flex; flex-direction: column; gap: 4px; }
.sub { margin-left: 22px; }
.turn.target:not(.marked).hover .text { outline: 2px dashed var(--mark-line); outline-offset: 1px; }

/* Sits where the old mark button did; only shown on the selected mark. */
.remove-btn {
  visibility: hidden;
  background: #fff; border: 1px solid var(--input-line); color: var(--danger);
  padding: 3px 8px; font-size: 11px; border-radius: 4px; white-space: nowrap;
}
.remove-btn:hover { background: #fdf1f2; border-color: #f0b3b8; }
.turn.marked.selected .remove-btn { visibility: visible; }