/* Original, static Tracewise product previews. Theme colors inherit from the site. */
.mn-proof {
  --mnp-bg: var(--mn-bg, #f7f8fa);
  --mnp-panel: var(--mn-panel, #fff);
  --mnp-ink: var(--mn-ink, #18243d);
  --mnp-muted: var(--mn-muted, #64718a);
  --mnp-line: var(--mn-line, #dce2ec);
  --mnp-blue: var(--mn-blue, #244fea);
  --mnp-coral: #e87357;
  width: 100%; max-width: 1120px; min-width: 0; margin: 0 auto; container-type: inline-size;
  color: var(--mnp-ink); font-family: inherit; text-align: left;
  font-size: 13px; line-height: 1.5; letter-spacing: normal;
}
.mn-proof *, .mn-proof *::before, .mn-proof *::after { box-sizing: border-box; }
.mn-proof__frame { overflow: hidden; border: 1px solid var(--mnp-line); border-radius: 14px; background: var(--mnp-panel); box-shadow: 0 20px 64px #18243d0a; }
.mn-proof__chrome { display: flex; align-items: center; gap: 28px; min-height: 60px; padding: 14px 22px; border-bottom: 1px solid var(--mnp-line); }
.mn-proof__brand { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; letter-spacing: -.6px; }
.mn-proof__brand img { width: 22px; height: 22px; object-fit: contain; }
.mn-proof__chrome-location { flex: 1; font-size: 11px; color: var(--mnp-muted); }
.mn-proof__chrome-location > span { padding: 0 10px; opacity: .6; }
.mn-proof__avatar { display: grid; place-items: center; width: 28px; height: 28px; margin-left: auto; border: 1px solid var(--mnp-line); border-radius: 50%; font-size: 11px; font-weight: 700; }
.mn-proof__workspace { display: grid; grid-template-columns: 146px minmax(0, 1fr); }
.mn-proof__sidebar { display: flex; flex-direction: column; gap: 6px; padding: 28px 14px; border-right: 1px solid var(--mnp-line); background: var(--mnp-bg); color: var(--mnp-muted); font-size: 11px; }
.mn-proof__sidebar > span:not(.mn-proof__sidebar-label), .mn-proof__nav-current { padding: 8px 10px; }
.mn-proof__sidebar-label { margin: 0 10px 10px; font-size: 8px; letter-spacing: 1.5px; }
.mn-proof__nav-current { border-radius: 5px; background: color-mix(in srgb, var(--mnp-blue) 9%, transparent); color: var(--mnp-blue); }
.mn-proof__sidebar-note { display: flex; align-items: center; gap: 6px; margin: auto 5px 0; padding-top: 36px; font-size: 9px; }
.mn-proof__dot { width: 5px; height: 5px; flex: none; border-radius: 50%; background: var(--mnp-blue); }
.mn-proof__content { min-width: 0; padding: clamp(18px, 3vw, 32px); }
.mn-proof__heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 25px; }
.mn-proof__eyebrow { display: block; font-size: 9px; line-height: 1.5; font-weight: 600; letter-spacing: 1.1px; color: var(--mnp-muted); }
.mn-proof .mn-proof__heading h3 { margin: 8px 0 5px; color: var(--mnp-ink); font-size: clamp(18px, 2.3vw, 26px); font-weight: 600; line-height: 1.2; letter-spacing: -.8px; }
.mn-proof .mn-proof__heading p { margin: 0; color: var(--mnp-muted); font-size: 11px; line-height: 1.6; }
.mn-proof__action { display: inline-flex; align-items: center; justify-content: center; flex: none; white-space: nowrap; padding: 9px 13px; border: 1px solid var(--mnp-blue); border-radius: 5px; background: var(--mnp-blue); color: #fff; font-size: 10px; font-weight: 600; }
.mn-proof__action--secondary { background: var(--mnp-panel); color: var(--mnp-ink); border-color: var(--mnp-line); }
.mn-proof__filters { display: flex; align-items: center; gap: 22px; padding: 0 0 12px; color: var(--mnp-muted); font-size: 10px; }
.mn-proof__filters strong { color: var(--mnp-blue); }
.mn-proof__filters b, .mn-proof__filters strong span { margin-left: 5px; font-size: 9px; font-weight: 500; }
.mn-proof__table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--mnp-line); border-radius: 7px; }
.mn-proof table { width: 100%; margin: 0; border: 0; border-collapse: collapse; text-align: left; white-space: nowrap; font-size: 11px; }
.mn-proof th, .mn-proof td { padding: 15px 14px; border: 0; border-bottom: 1px solid var(--mnp-line); background: transparent; }
.mn-proof th { background: var(--mnp-bg); color: var(--mnp-muted); font-size: 9px; font-weight: 500; }
.mn-proof tbody tr:last-child td { border-bottom: 0; }
.mn-proof .mn-proof__number { text-align: right; font-variant-numeric: tabular-nums; }
.mn-proof__mono, .mn-proof code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; }
.mn-proof__file { display: flex; align-items: center; gap: 9px; }
.mn-proof__file-icon { display: grid; place-items: center; width: 25px; height: 31px; border: 1px solid var(--mnp-line); border-radius: 4px; color: var(--mnp-blue); font-size: 17px; }
.mn-proof__file strong { display: block; font-size: 11px; font-weight: 500; }
.mn-proof__file small { display: block; margin-top: 2px; color: var(--mnp-muted); font-size: 9px; }
.mn-proof__status { display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; border-radius: 4px; white-space: nowrap; background: color-mix(in srgb, var(--mnp-blue) 8%, transparent); color: var(--mnp-blue); font-size: 9px; font-weight: 500; }
.mn-proof__status > span { width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.mn-proof__status--review { background: color-mix(in srgb, var(--mnp-coral) 12%, transparent); color: color-mix(in srgb, var(--mnp-coral) 72%, var(--mnp-ink)); }
.mn-proof__footnote { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 20px; color: var(--mnp-muted); font-size: 9px; }
.mn-proof__field-list { border: 1px solid var(--mnp-line); border-radius: 7px; overflow: hidden; }
.mn-proof__field { display: grid; grid-template-columns: 20px minmax(0, 1fr) 105px 65px; align-items: center; gap: 12px; padding: 13px 18px; border-bottom: 1px solid var(--mnp-line); }
.mn-proof__field:last-child { border-bottom: 0; }
.mn-proof__index { color: var(--mnp-muted); font-size: 10px; }
.mn-proof__field strong { display: block; font-size: 12px; font-weight: 500; }
.mn-proof__field code { display: block; margin-top: 2px; color: var(--mnp-muted); font-size: 9px; }
.mn-proof__field-type { padding: 6px 9px; border: 1px solid var(--mnp-line); border-radius: 4px; font-size: 10px; }
.mn-proof__required { color: var(--mnp-blue); font-size: 9px; }
.mn-proof__required--optional { color: var(--mnp-muted); }
.mn-proof__field-detail { margin-top: 16px; padding: 16px 18px; border-left: 2px solid var(--mnp-blue); background: var(--mnp-bg); }
.mn-proof__field-detail p { margin: 7px 0 0; font-size: 12px; line-height: 1.6; }
.mn-proof__review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mn-proof__original, .mn-proof__readings { min-width: 0; }
.mn-proof__pane-label { display: flex; justify-content: space-between; margin-bottom: 12px; color: var(--mnp-muted); font-size: 9px; }
.mn-proof__pane-label strong { font-size: 9px; letter-spacing: 1px; font-weight: 500; }
.mn-proof__paper { min-height: 295px; padding: 25px 22px; border: 1px solid var(--mnp-line); border-radius: 4px; background: var(--mnp-bg); }
.mn-proof__sample { display: inline-block; padding: 3px 6px; border: 1px solid var(--mnp-line); color: var(--mnp-muted); font-size: 7px; letter-spacing: 1px; }
.mn-proof__invoice-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; margin-top: 20px; font-size: 12px; }
.mn-proof__invoice-head strong { font-size: 17px; letter-spacing: 1px; }
.mn-proof__invoice-head span { color: var(--mnp-muted); font-size: 10px; }
.mn-proof__paper p { margin: 18px 0; font-size: 11px; line-height: 1.6; }
.mn-proof__paper p small { color: var(--mnp-muted); font-size: 10px; }
.mn-proof__paper-rule { margin: 14px 0; border-top: 1px solid var(--mnp-line); }
.mn-proof__paper-line { display: flex; justify-content: space-between; gap: 12px; margin: 12px 0; color: var(--mnp-muted); font-size: 9px; }
.mn-proof__source-region { display: flex; justify-content: space-between; gap: 12px; margin: 20px -7px 0; padding: 10px 7px; outline: 1px solid var(--mnp-blue); background: color-mix(in srgb, var(--mnp-blue) 7%, transparent); font-size: 11px; }
.mn-proof__evidence-label { display: block; margin-top: 8px; color: var(--mnp-blue); font-size: 8px; }
.mn-proof__reading { display: grid; grid-template-columns: 1fr auto; gap: 5px 10px; margin-bottom: 8px; padding: 14px 15px; border: 1px solid var(--mnp-line); border-radius: 5px; font-size: 10px; }
.mn-proof__reading > span { color: var(--mnp-muted); }
.mn-proof__reading > strong { text-align: right; font-weight: 500; }
.mn-proof__reading small { grid-column: 1 / -1; color: var(--mnp-muted); font-size: 9px; }
.mn-proof__reading--selected { border-color: var(--mnp-blue); background: color-mix(in srgb, var(--mnp-blue) 5%, transparent); }
.mn-proof__reading--selected small { color: var(--mnp-blue); }
.mn-proof__review-note { display: grid; gap: 4px; padding: 15px 0 0; font-size: 11px; }
.mn-proof__review-note span { color: var(--mnp-muted); font-size: 10px; }
.mn-proof__export-form { display: grid; grid-template-columns: 1.2fr 1fr; gap: 25px; margin-bottom: 24px; }
.mn-proof__formats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; }
.mn-proof__formats > * { display: flex; justify-content: space-between; padding: 10px; border: 1px solid var(--mnp-line); border-radius: 4px; font-size: 11px; font-weight: 500; }
.mn-proof__formats strong { border-color: var(--mnp-blue); color: var(--mnp-blue); }
.mn-proof__export-scope { display: flex; justify-content: space-between; margin-top: 8px; padding: 10px 12px; border: 1px solid var(--mnp-line); border-radius: 4px; font-size: 11px; font-weight: 500; }
.mn-proof__export-note { display: flex; align-items: center; gap: 12px; margin-top: 24px; padding: 17px; border-radius: 6px; background: var(--mnp-bg); }
.mn-proof__check { display: grid; flex: none; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: color-mix(in srgb, var(--mnp-blue) 10%, transparent); color: var(--mnp-blue); }
.mn-proof__export-note strong { font-size: 11px; font-weight: 500; }
.mn-proof__export-note p { margin: 3px 0 0; color: var(--mnp-muted); font-size: 10px; }
.mn-proof figcaption { display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px 12px; padding: 16px 2px 0; font-size: 10px; color: var(--mnp-muted); }
.mn-proof figcaption strong { color: var(--mnp-ink); font-size: 11px; font-weight: 500; }
.mn-proof__caption-label { color: var(--mnp-blue); font-size: 9px; font-weight: 600; letter-spacing: .25px; }
.mn-proof__sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.mn-proof--compact .mn-proof__sidebar { display: none; }
.mn-proof--compact .mn-proof__workspace { grid-template-columns: minmax(0, 1fr); }
.mn-proof--compact .mn-proof__content { padding: 18px; }

[data-metrone-theme="dark"] .mn-proof {
  --mnp-bg: var(--mn-bg, #101623); --mnp-panel: var(--mn-panel, #182132);
  --mnp-ink: var(--mn-ink, #eef2fb); --mnp-muted: var(--mn-muted, #a4b0c8);
  --mnp-line: var(--mn-line, #303b50); --mnp-blue: var(--mn-blue, #8aa5ff);
  color-scheme: dark;
}
[data-metrone-theme="dark"] .mn-proof__action:not(.mn-proof__action--secondary) { color: var(--mnp-bg); }
@media (prefers-color-scheme: dark) {
  :root:not([data-metrone-theme]) .mn-proof { --mnp-bg: var(--mn-bg, #101623); --mnp-panel: var(--mn-panel, #182132); --mnp-ink: var(--mn-ink, #eef2fb); --mnp-muted: var(--mn-muted, #a4b0c8); --mnp-line: var(--mn-line, #303b50); --mnp-blue: var(--mn-blue, #8aa5ff); color-scheme: dark; }
}
@media (max-width: 720px) {
  .mn-proof__workspace { grid-template-columns: minmax(0, 1fr); }
  .mn-proof__sidebar { display: none; }
  .mn-proof__chrome { gap: 16px; padding: 12px 16px; min-height: 52px; }
  .mn-proof__chrome-location { font-size: 9px; }
  .mn-proof__heading { gap: 12px; }
  .mn-proof__review-grid { gap: 12px; }
  .mn-proof__paper { padding: 20px 14px; }
  .mn-proof__field { padding: 12px; grid-template-columns: 16px minmax(0, 1fr) 85px 50px; gap: 8px; }
  .mn-proof__field-type { font-size: 9px; }
  .mn-proof__footnote { flex-wrap: wrap; }
}
@media (max-width: 480px) {
  .mn-proof__chrome-location { display: none; }
  .mn-proof__heading { align-items: flex-start; }
  .mn-proof__heading > .mn-proof__action { padding: 7px 9px; font-size: 9px; }
  .mn-proof__heading h3 { max-width: 200px; }
  .mn-proof__review-grid, .mn-proof__export-form { grid-template-columns: minmax(0, 1fr); }
  .mn-proof__paper { min-height: 280px; }
  .mn-proof__field { grid-template-columns: 14px minmax(0, 1fr) 80px; }
  .mn-proof__required { grid-column: 2; margin-top: -4px; }
  .mn-proof__field-type { grid-column: 3; grid-row: auto; }
  .mn-proof__filters { gap: 16px; }
  .mn-proof figcaption { display: grid; gap: 5px; }
}
@media (forced-colors: active) {
  .mn-proof__source-region, .mn-proof__reading--selected, .mn-proof__formats strong { border: 1px solid Highlight; outline-color: Highlight; }
  .mn-proof__status, .mn-proof__nav-current { border: 1px solid CanvasText; }
}
@container (max-width: 600px) {
  .mn-proof__workspace { grid-template-columns: minmax(0, 1fr); }
  .mn-proof__sidebar { display: none; }
  .mn-proof__review-grid, .mn-proof__export-form { grid-template-columns: minmax(0, 1fr); }
  .mn-proof__heading { gap: 12px; }
  .mn-proof__content { padding: 18px; }
}