/* Compatibility tool (DOCS/plans/2026-09-29-compatibility-tool-design.md, P1b): the tool's OWN styles,
   carried over from the approved mockup (DOCS/plans/mockups/compat-mock.css).
   rem only; no inline styles in the tool's markup or DOM (bars and the score span use the width/left
   classes generated at the end of this file); FontAwesome 6.7.2 only. Every class is cm- prefixed so it
   cannot collide with Tailwind. Dark tokens follow html.dark, which shared-header.js toggles. */

:root {
  --cm-pink: #db2777;
  --cm-pink-soft: #fdf2f8;
  --cm-gold: #b8860b;
  --cm-gold-soft: #fbf5e6;
  --cm-ink: #1f2937;
  --cm-ink-2: #4b5563;
  --cm-line: #e5e7eb;
  --cm-paper: #ffffff;
  --cm-page: #fbf8f4;
  --cm-ok: #047857;
  --cm-ok-soft: #ecfdf5;
  --cm-warn: #b45309;
  --cm-warn-soft: #fffbeb;
  --cm-info: #1d4ed8;
  --cm-info-soft: #eff6ff;
  --cm-track: #f3f4f6;
  --cm-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, .06), 0 0.25rem 1rem rgba(17, 24, 39, .06);
  --cm-touch: 2.75rem;
  --cm-serif: "Cormorant Garamond", Georgia, serif;
  --cm-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
html.dark {
  --cm-pink: #f472b6;
  --cm-pink-soft: #3b1730;
  --cm-gold: #e3b341;
  --cm-gold-soft: #3a2f12;
  --cm-ink: #f3f4f6;
  --cm-ink-2: #c4c9d2;
  --cm-line: #374151;
  --cm-paper: #1f2937;
  --cm-page: #111827;
  --cm-ok: #6ee7b7;
  --cm-ok-soft: #0f2e25;
  --cm-warn: #fcd34d;
  --cm-warn-soft: #3a2c0c;
  --cm-info: #93c5fd;
  --cm-info-soft: #172554;
  --cm-track: #374151;
}

.cm-page { background: var(--cm-page); color: var(--cm-ink); font-family: var(--cm-sans); line-height: 1.5; min-height: 60vh; }
.cm-page h1, .cm-page h2, .cm-page h3 { font-family: var(--cm-serif); line-height: 1.15; margin: 0; color: var(--cm-ink); }
.cm-page p { margin: 0; }
.cm-wrap { max-width: 76rem; margin: 0 auto; padding: 0 1rem; }
.cm-sr { position: absolute; width: 0.0625rem; height: 0.0625rem; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cm-hi { font-size: 0.8125rem; color: var(--cm-ink-2); font-weight: 400; font-family: var(--cm-sans); }
.cm-muted { color: var(--cm-ink-2); }
.cm-small { font-size: 0.875rem; }
.cm-xs { font-size: 0.8125rem; }
.cm-page [hidden], [hidden][class^="cm-"], [hidden][class*=" cm-"] { display: none !important; }

/* buttons and chips */
.cm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: var(--cm-touch); min-width: var(--cm-touch);
  padding: 0.5rem 1.125rem; border-radius: 0.625rem; border: 0.0625rem solid var(--cm-line); background: var(--cm-paper); color: var(--cm-ink);
  font: 600 0.9375rem/1.2 var(--cm-sans); text-decoration: none; cursor: pointer; }
.cm-btn-primary { background: linear-gradient(135deg, #db2777, #b8860b); color: #fff; border-color: transparent; }
.cm-btn-compat { color: var(--cm-pink); border-color: #f9a8d4; background: var(--cm-pink-soft); }
.cm-btn-block { width: 100%; }
.cm-ibtn { display: inline-flex; align-items: center; justify-content: center; width: var(--cm-touch); height: var(--cm-touch); border-radius: 0.625rem;
  border: 0.0625rem solid var(--cm-line); background: var(--cm-paper); color: var(--cm-ink); cursor: pointer; font-size: 1rem; }
.cm-ibtn.cm-compat { color: var(--cm-pink); }
.cm-ibtn.cm-compat.cm-muted-state { color: var(--cm-ink-2); }
.cm-chip { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.25rem 0.625rem; border-radius: 62rem; font-size: 0.8125rem;
  font-weight: 600; background: var(--cm-pink-soft); color: var(--cm-pink); }
.cm-chip.cm-ok { background: var(--cm-ok-soft); color: var(--cm-ok); }
.cm-chip.cm-warn { background: var(--cm-warn-soft); color: var(--cm-warn); }
.cm-chip.cm-info { background: var(--cm-info-soft); color: var(--cm-info); }
.cm-chip.cm-gold { background: var(--cm-gold-soft); color: var(--cm-gold); }
.cm-beta { font-size: 0.6875rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: var(--cm-gold);
  border-radius: 62rem; padding: 0.125rem 0.5rem; vertical-align: middle; }
html.dark .cm-beta { color: #111827; }

/* cards */
.cm-card { background: var(--cm-paper); border: 0.0625rem solid var(--cm-line); border-radius: 1rem; padding: 1.25rem; box-shadow: var(--cm-shadow); }
.cm-card h2 { font-size: 1.5rem; margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.cm-stack > * + * { margin-top: 1rem; }
.cm-notice { display: flex; gap: 0.625rem; align-items: flex-start; background: var(--cm-info-soft); color: var(--cm-info); border-radius: 0.625rem; padding: 0.75rem 0.875rem; font-size: 0.875rem; }
.cm-notice.cm-warn { background: var(--cm-warn-soft); color: var(--cm-warn); }
.cm-notice.cm-beta-note { background: var(--cm-gold-soft); color: var(--cm-ink); }

/* index additions (the rest of the hero is the real template markup + landing.css) */
.cm-quick { margin-top: 2.5rem; display: grid; gap: 1rem; }
@media (min-width: 64rem) { .cm-quick { grid-template-columns: 1.2fr 1fr; align-items: stretch; } }
.cm-quick form { display: grid; gap: 0.75rem; }
.cm-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.75rem; }
.cm-dash-tool { width: 100%; max-width: 56rem; margin: 0 auto 1.5rem; display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;
  background: var(--cm-paper); border: 0.125rem solid #f9a8d4; border-radius: 1rem; padding: 1rem 1.25rem; box-shadow: var(--cm-shadow); }
.cm-dash-tool .cm-dash-ic { width: 3.5rem; height: 3.5rem; border-radius: 0.875rem; background: linear-gradient(135deg, #db2777, #b8860b); color: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.5rem; flex: none; }
.cm-dash-tool .cm-dash-txt { flex: 1 1 14rem; min-width: 0; }
.cm-dash-tool h3 { font-size: 1.375rem; }

/* form */
.cm-head { padding: 1.5rem 0 0.5rem; }
.cm-head h1 { font-size: 2rem; display: flex; align-items: center; gap: 0.625rem; flex-wrap: wrap; }
.cm-head p { color: var(--cm-ink-2); margin-top: 0.375rem; }
.cm-modes { display: flex; gap: 0.25rem; background: var(--cm-track); border-radius: 0.75rem; padding: 0.25rem; margin: 1rem 0; }
.cm-modes button { flex: 1 1 0; min-width: 0; min-height: var(--cm-touch); border: 0; background: transparent; border-radius: 0.5rem; padding: 0.375rem 0.5rem;
  font: 600 0.8125rem/1.15 var(--cm-sans); color: var(--cm-ink-2); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 0.375rem; text-align: center; }
.cm-modes button[aria-selected="true"] { background: var(--cm-paper); color: var(--cm-pink); box-shadow: var(--cm-shadow); }
@media (min-width: 48rem) { .cm-modes button { font-size: 0.875rem; } }
.cm-people { display: grid; gap: 1rem; }
@media (min-width: 60rem) { .cm-people { grid-template-columns: 1fr 1fr; } }
.cm-person { border: 0; margin: 0; min-width: 0; }
.cm-person h2 { font-size: 1.375rem; display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.cm-num { width: 1.75rem; height: 1.75rem; border-radius: 62rem; background: var(--cm-pink-soft); color: var(--cm-pink); font: 700 0.875rem var(--cm-sans);
  display: inline-flex; align-items: center; justify-content: center; }
.cm-field { display: grid; gap: 0.25rem; margin-bottom: 0.875rem; align-content: start; }
.cm-field label, .cm-field .cm-lbl { font-weight: 600; font-size: 0.875rem; }
.cm-req { color: var(--cm-pink); }
.cm-field input[type=text], .cm-field input[type=date], .cm-field input[type=time], .cm-field select {
  min-height: var(--cm-touch); width: 100%; min-width: 0; border: 0.0625rem solid #9ca3af; border-radius: 0.5rem; padding: 0.5rem 0.75rem;
  font: 1rem var(--cm-sans); background: var(--cm-paper); color: var(--cm-ink); }
.cm-hint { font-size: 0.8125rem; color: var(--cm-ink-2); }
.cm-err input { border-color: #b91c1c; }
.cm-errmsg { font-size: 0.8125rem; color: #b91c1c; display: flex; gap: 0.375rem; align-items: center; }
html.dark .cm-errmsg { color: #fca5a5; }
.cm-row2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.75rem; align-items: start; }
.cm-check { display: flex; align-items: center; gap: 0.625rem; min-height: var(--cm-touch); font-size: 0.9375rem; cursor: pointer; }
.cm-check input { width: 1.25rem; height: 1.25rem; accent-color: var(--cm-pink); flex: none; }
.cm-segs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; margin-bottom: 0.875rem; }
/* four across only while a person card is full width (below the two-column layout at 60rem) */
@media (min-width: 30rem) and (max-width: 59.99rem) { .cm-segs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.cm-segs label { display: flex; align-items: center; gap: 0.5rem; min-height: var(--cm-touch); border: 0.0625rem solid var(--cm-line); border-radius: 0.5rem;
  padding: 0.25rem 0.5rem; font-size: 0.8125rem; cursor: pointer; }
.cm-segs label.cm-on { border-color: var(--cm-pink); background: var(--cm-pink-soft); }
.cm-segs input { accent-color: var(--cm-pink); flex: none; }
.cm-resolved { display: grid; gap: 0.25rem; font-size: 0.8125rem; background: var(--cm-ok-soft); color: var(--cm-ok); border-radius: 0.5rem; padding: 0.5rem 0.625rem; }
.cm-resolved .cm-line1 { display: flex; gap: 0.5rem; align-items: flex-start; }
.cm-resolved .cm-edit { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; color: var(--cm-ink-2); }
.cm-resolved select { min-height: var(--cm-touch); border: 0.0625rem solid #9ca3af; border-radius: 0.5rem; padding: 0.25rem 0.5rem; background: var(--cm-paper); color: var(--cm-ink); font: 0.875rem var(--cm-sans); }
.cm-trad { display: grid; gap: 0.75rem; }
@media (min-width: 48rem) { .cm-trad { grid-template-columns: 1fr 1fr; } }
.cm-trad label { display: flex; gap: 0.75rem; align-items: flex-start; border: 0.125rem solid var(--cm-line); border-radius: 0.75rem; padding: 0.875rem; cursor: pointer; min-height: var(--cm-touch); }
.cm-trad label.cm-on { border-color: var(--cm-pink); background: var(--cm-pink-soft); }
.cm-trad input { width: 1.25rem; height: 1.25rem; margin-top: 0.125rem; accent-color: var(--cm-pink); flex: none; }
.cm-trad strong { display: block; }
.cm-attest { display: grid; gap: 0.25rem; margin-top: 1rem; }
.cm-submit { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; justify-content: space-between; margin: 1.25rem 0 2rem; }
.cm-privacy { display: flex; gap: 0.5rem; align-items: flex-start; font-size: 0.8125rem; color: var(--cm-ink-2); max-width: 40rem; }

/* report */
.cm-report { display: grid; gap: 1rem; margin: 1rem 0 2rem; }
@media (min-width: 64rem) { .cm-report { grid-template-columns: 23rem minmax(0, 1fr); align-items: start; } }
.cm-score { text-align: center; }
.cm-who { display: flex; justify-content: center; gap: 0.5rem; align-items: center; font-weight: 600; }
.cm-range { margin: 0.75rem auto 0.25rem; max-width: 18rem; }
.cm-range-val { font: 700 2.75rem/1 var(--cm-serif); }
.cm-range-of { font-size: 0.875rem; color: var(--cm-ink-2); }
.cm-scale { position: relative; height: 0.75rem; border-radius: 62rem; margin: 0.75rem 0 0.375rem;
  background: linear-gradient(90deg, #fca5a5 0 50%, #fcd34d 50% 69.4%, #86efac 69.4% 91.7%, #34d399 91.7% 100%); }
html.dark .cm-scale { background: linear-gradient(90deg, #7f1d1d 0 50%, #78350f 50% 69.4%, #14532d 69.4% 91.7%, #065f46 91.7% 100%); }
.cm-span { position: absolute; top: -0.25rem; bottom: -0.25rem; min-width: 0.75rem; margin-left: -0.375rem; border: 0.1875rem solid var(--cm-ink); border-radius: 62rem; }
.cm-scale-labels { display: grid; grid-template-columns: 50fr 19.4fr 22.3fr 8.3fr; font-size: 0.6875rem; color: var(--cm-ink-2); text-align: left; }
.cm-band { font: 700 1.5rem var(--cm-serif); color: var(--cm-pink); margin-top: 0.5rem; }
.cm-chips { display: flex; flex-wrap: wrap; gap: 0.375rem; justify-content: center; margin-top: 0.75rem; }
.cm-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 1rem; }
.cm-actions .cm-btn-primary { grid-column: 1 / -1; }
.cm-cands { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.cm-cands th, .cm-cands td { text-align: left; padding: 0.5rem 0.375rem; border-bottom: 0.0625rem solid var(--cm-line); vertical-align: top; }
.cm-cands td.cm-n { text-align: right; font-weight: 700; white-space: nowrap; }
.cm-koota { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.25rem 0.75rem; padding: 0.75rem 0; border-top: 0.0625rem solid var(--cm-line); }
.cm-koota:first-of-type { border-top: 0; }
.cm-koota .cm-name { font-weight: 700; display: flex; align-items: baseline; gap: 0.5rem; flex-wrap: wrap; }
.cm-koota .cm-pts { font-weight: 700; white-space: nowrap; }
.cm-bar { grid-column: 1 / -1; height: 0.5rem; background: var(--cm-track); border-radius: 62rem; overflow: hidden; position: relative; }
.cm-bar > span { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 62rem; background: var(--cm-pink); }
.cm-bar > span.cm-full { background: var(--cm-ok); }
.cm-bar > span.cm-ghost { background: repeating-linear-gradient(45deg, var(--cm-pink) 0 0.25rem, transparent 0.25rem 0.5rem); opacity: .55; }
.cm-koota .cm-mean { grid-column: 1 / -1; font-size: 0.875rem; color: var(--cm-ink-2); }
.cm-w0 { width: 0; } .cm-w12 { width: 12.5%; } .cm-w17 { width: 16.7%; } .cm-w25 { width: 25%; } .cm-w50 { width: 50%; } .cm-w75 { width: 75%; }
.cm-w83 { width: 83.3%; } .cm-w100 { width: 100%; }
.cm-dosha { display: grid; gap: 0.75rem; }
@media (min-width: 48rem) { .cm-dosha { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cm-d { border-radius: 0.75rem; padding: 0.875rem; border: 0.0625rem solid var(--cm-line); }
.cm-d h3, .cm-d h4 { margin: 0; font: 700 1rem var(--cm-sans); display: flex; align-items: center; gap: 0.5rem; }
.cm-d p { font-size: 0.875rem; margin-top: 0.375rem; color: var(--cm-ink-2); }
.cm-d.cm-ok { background: var(--cm-ok-soft); }
.cm-d.cm-cancel { background: var(--cm-gold-soft); }
.cm-d.cm-warn { background: var(--cm-warn-soft); }
.cm-d.cm-depends { background: var(--cm-info-soft); }
.cm-two { display: grid; gap: 1rem; }
@media (min-width: 48rem) { .cm-two { grid-template-columns: 1fr 1fr; } }
ul.cm-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 0.625rem; }
ul.cm-list li { display: flex; gap: 0.625rem; align-items: flex-start; font-size: 0.9375rem; }
ul.cm-list i { margin-top: 0.25rem; color: var(--cm-pink); }
.cm-disclaimer { font-size: 0.8125rem; color: var(--cm-ink-2); display: flex; gap: 0.5rem; align-items: flex-start; }
.cm-mref { width: 100%; border-collapse: collapse; font-size: 0.8125rem; margin-top: 0.5rem; }
.cm-mref th, .cm-mref td { text-align: left; padding: 0.25rem 0.375rem; border-bottom: 0.0625rem dashed var(--cm-line); }

/* page chrome */
.cm-skip { position: absolute; left: -100rem; top: 0.5rem; z-index: 100; background: var(--cm-paper); color: var(--cm-ink); padding: 0.75rem 1rem; border-radius: 0.5rem; }
.cm-skip:focus { left: 0.5rem; }
.cm-page :focus-visible { outline: 0.1875rem solid var(--cm-pink); outline-offset: 0.125rem; }
.cm-report-title { font-size: 2rem; margin: 1.5rem 0 0.25rem; }
.cm-h3 { font-size: 1.375rem; margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.cm-errsum { margin: 0 0 1rem; border: 0.125rem solid #b91c1c; border-radius: 0.75rem; padding: 0.75rem 1rem; background: var(--cm-paper); }
.cm-errsum ul { margin: 0.25rem 0 0; padding-left: 1.25rem; }
.cm-errsum a { color: #b91c1c; text-decoration: underline; }
html.dark .cm-errsum a { color: #fca5a5; }
.cm-err select, .cm-err input[type=text], .cm-err input[type=date], .cm-err input[type=time] { border-color: #b91c1c; }
.cm-trad label.cm-off { opacity: .7; cursor: not-allowed; }
.cm-place { position: relative; }
.cm-listbox { position: absolute; left: 0; right: 0; top: 4.5rem; z-index: 20; margin: 0; padding: 0.25rem; list-style: none; background: var(--cm-paper);
  border: 0.0625rem solid var(--cm-line); border-radius: 0.5rem; box-shadow: var(--cm-shadow); max-height: 18rem; overflow-y: auto; }
.cm-listbox li { min-height: var(--cm-touch); display: flex; align-items: center; padding: 0.375rem 0.625rem; border-radius: 0.375rem; cursor: pointer; font-size: 0.9375rem; }
.cm-listbox li[aria-selected="true"], .cm-listbox li:hover { background: var(--cm-pink-soft); color: var(--cm-pink); }
.cm-listbox li.cm-empty { color: var(--cm-ink-2); cursor: default; }
.cm-linkbtn { justify-self: start; min-height: var(--cm-touch); background: none; border: 0; padding: 0; color: var(--cm-pink); font: 600 0.8125rem var(--cm-sans); text-decoration: underline; cursor: pointer; }
.cm-coords { display: grid; gap: 0.25rem; }
.cm-coords select { min-height: var(--cm-touch); width: 100%; border: 0.0625rem solid #9ca3af; border-radius: 0.5rem; padding: 0.25rem 0.5rem; background: var(--cm-paper); color: var(--cm-ink); font: 0.9375rem var(--cm-sans); }
.cm-feedback { margin-top: 1rem; text-align: left; border-top: 0.0625rem solid var(--cm-line); padding-top: 0.75rem; display: grid; gap: 0.5rem; }
.cm-feedback fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.cm-feedback legend { font-weight: 600; font-size: 0.875rem; margin-bottom: 0.25rem; }
.cm-feedback select { min-height: var(--cm-touch); border: 0.0625rem solid #9ca3af; border-radius: 0.5rem; padding: 0.25rem 0.5rem; background: var(--cm-paper); color: var(--cm-ink); }
.cm-engine { margin-top: 0.5rem; }
.cm-mpair { margin-top: 0.75rem; font-size: 0.875rem; }
.cm-btn[disabled] { opacity: .6; cursor: progress; }

/* bar widths and the score span: classes, never a style attribute (design 7.10) */
.cm-w-0 { width: 0%; }
.cm-w-1 { width: 1%; }
.cm-w-2 { width: 2%; }
.cm-w-3 { width: 3%; }
.cm-w-4 { width: 4%; }
.cm-w-5 { width: 5%; }
.cm-w-6 { width: 6%; }
.cm-w-7 { width: 7%; }
.cm-w-8 { width: 8%; }
.cm-w-9 { width: 9%; }
.cm-w-10 { width: 10%; }
.cm-w-11 { width: 11%; }
.cm-w-12 { width: 12%; }
.cm-w-13 { width: 13%; }
.cm-w-14 { width: 14%; }
.cm-w-15 { width: 15%; }
.cm-w-16 { width: 16%; }
.cm-w-17 { width: 17%; }
.cm-w-18 { width: 18%; }
.cm-w-19 { width: 19%; }
.cm-w-20 { width: 20%; }
.cm-w-21 { width: 21%; }
.cm-w-22 { width: 22%; }
.cm-w-23 { width: 23%; }
.cm-w-24 { width: 24%; }
.cm-w-25 { width: 25%; }
.cm-w-26 { width: 26%; }
.cm-w-27 { width: 27%; }
.cm-w-28 { width: 28%; }
.cm-w-29 { width: 29%; }
.cm-w-30 { width: 30%; }
.cm-w-31 { width: 31%; }
.cm-w-32 { width: 32%; }
.cm-w-33 { width: 33%; }
.cm-w-34 { width: 34%; }
.cm-w-35 { width: 35%; }
.cm-w-36 { width: 36%; }
.cm-w-37 { width: 37%; }
.cm-w-38 { width: 38%; }
.cm-w-39 { width: 39%; }
.cm-w-40 { width: 40%; }
.cm-w-41 { width: 41%; }
.cm-w-42 { width: 42%; }
.cm-w-43 { width: 43%; }
.cm-w-44 { width: 44%; }
.cm-w-45 { width: 45%; }
.cm-w-46 { width: 46%; }
.cm-w-47 { width: 47%; }
.cm-w-48 { width: 48%; }
.cm-w-49 { width: 49%; }
.cm-w-50 { width: 50%; }
.cm-w-51 { width: 51%; }
.cm-w-52 { width: 52%; }
.cm-w-53 { width: 53%; }
.cm-w-54 { width: 54%; }
.cm-w-55 { width: 55%; }
.cm-w-56 { width: 56%; }
.cm-w-57 { width: 57%; }
.cm-w-58 { width: 58%; }
.cm-w-59 { width: 59%; }
.cm-w-60 { width: 60%; }
.cm-w-61 { width: 61%; }
.cm-w-62 { width: 62%; }
.cm-w-63 { width: 63%; }
.cm-w-64 { width: 64%; }
.cm-w-65 { width: 65%; }
.cm-w-66 { width: 66%; }
.cm-w-67 { width: 67%; }
.cm-w-68 { width: 68%; }
.cm-w-69 { width: 69%; }
.cm-w-70 { width: 70%; }
.cm-w-71 { width: 71%; }
.cm-w-72 { width: 72%; }
.cm-w-73 { width: 73%; }
.cm-w-74 { width: 74%; }
.cm-w-75 { width: 75%; }
.cm-w-76 { width: 76%; }
.cm-w-77 { width: 77%; }
.cm-w-78 { width: 78%; }
.cm-w-79 { width: 79%; }
.cm-w-80 { width: 80%; }
.cm-w-81 { width: 81%; }
.cm-w-82 { width: 82%; }
.cm-w-83 { width: 83%; }
.cm-w-84 { width: 84%; }
.cm-w-85 { width: 85%; }
.cm-w-86 { width: 86%; }
.cm-w-87 { width: 87%; }
.cm-w-88 { width: 88%; }
.cm-w-89 { width: 89%; }
.cm-w-90 { width: 90%; }
.cm-w-91 { width: 91%; }
.cm-w-92 { width: 92%; }
.cm-w-93 { width: 93%; }
.cm-w-94 { width: 94%; }
.cm-w-95 { width: 95%; }
.cm-w-96 { width: 96%; }
.cm-w-97 { width: 97%; }
.cm-w-98 { width: 98%; }
.cm-w-99 { width: 99%; }
.cm-w-100 { width: 100%; }
.cm-l-0 { left: 0%; }
.cm-l-1 { left: 1%; }
.cm-l-2 { left: 2%; }
.cm-l-3 { left: 3%; }
.cm-l-4 { left: 4%; }
.cm-l-5 { left: 5%; }
.cm-l-6 { left: 6%; }
.cm-l-7 { left: 7%; }
.cm-l-8 { left: 8%; }
.cm-l-9 { left: 9%; }
.cm-l-10 { left: 10%; }
.cm-l-11 { left: 11%; }
.cm-l-12 { left: 12%; }
.cm-l-13 { left: 13%; }
.cm-l-14 { left: 14%; }
.cm-l-15 { left: 15%; }
.cm-l-16 { left: 16%; }
.cm-l-17 { left: 17%; }
.cm-l-18 { left: 18%; }
.cm-l-19 { left: 19%; }
.cm-l-20 { left: 20%; }
.cm-l-21 { left: 21%; }
.cm-l-22 { left: 22%; }
.cm-l-23 { left: 23%; }
.cm-l-24 { left: 24%; }
.cm-l-25 { left: 25%; }
.cm-l-26 { left: 26%; }
.cm-l-27 { left: 27%; }
.cm-l-28 { left: 28%; }
.cm-l-29 { left: 29%; }
.cm-l-30 { left: 30%; }
.cm-l-31 { left: 31%; }
.cm-l-32 { left: 32%; }
.cm-l-33 { left: 33%; }
.cm-l-34 { left: 34%; }
.cm-l-35 { left: 35%; }
.cm-l-36 { left: 36%; }
.cm-l-37 { left: 37%; }
.cm-l-38 { left: 38%; }
.cm-l-39 { left: 39%; }
.cm-l-40 { left: 40%; }
.cm-l-41 { left: 41%; }
.cm-l-42 { left: 42%; }
.cm-l-43 { left: 43%; }
.cm-l-44 { left: 44%; }
.cm-l-45 { left: 45%; }
.cm-l-46 { left: 46%; }
.cm-l-47 { left: 47%; }
.cm-l-48 { left: 48%; }
.cm-l-49 { left: 49%; }
.cm-l-50 { left: 50%; }
.cm-l-51 { left: 51%; }
.cm-l-52 { left: 52%; }
.cm-l-53 { left: 53%; }
.cm-l-54 { left: 54%; }
.cm-l-55 { left: 55%; }
.cm-l-56 { left: 56%; }
.cm-l-57 { left: 57%; }
.cm-l-58 { left: 58%; }
.cm-l-59 { left: 59%; }
.cm-l-60 { left: 60%; }
.cm-l-61 { left: 61%; }
.cm-l-62 { left: 62%; }
.cm-l-63 { left: 63%; }
.cm-l-64 { left: 64%; }
.cm-l-65 { left: 65%; }
.cm-l-66 { left: 66%; }
.cm-l-67 { left: 67%; }
.cm-l-68 { left: 68%; }
.cm-l-69 { left: 69%; }
.cm-l-70 { left: 70%; }
.cm-l-71 { left: 71%; }
.cm-l-72 { left: 72%; }
.cm-l-73 { left: 73%; }
.cm-l-74 { left: 74%; }
.cm-l-75 { left: 75%; }
.cm-l-76 { left: 76%; }
.cm-l-77 { left: 77%; }
.cm-l-78 { left: 78%; }
.cm-l-79 { left: 79%; }
.cm-l-80 { left: 80%; }
.cm-l-81 { left: 81%; }
.cm-l-82 { left: 82%; }
.cm-l-83 { left: 83%; }
.cm-l-84 { left: 84%; }
.cm-l-85 { left: 85%; }
.cm-l-86 { left: 86%; }
.cm-l-87 { left: 87%; }
.cm-l-88 { left: 88%; }
.cm-l-89 { left: 89%; }
.cm-l-90 { left: 90%; }
.cm-l-91 { left: 91%; }
.cm-l-92 { left: 92%; }
.cm-l-93 { left: 93%; }
.cm-l-94 { left: 94%; }
.cm-l-95 { left: 95%; }
.cm-l-96 { left: 96%; }
.cm-l-97 { left: 97%; }
.cm-l-98 { left: 98%; }
.cm-l-99 { left: 99%; }
.cm-l-100 { left: 100%; }

@media print {
  #shared-header, .cm-actions, .cm-feedback, .cm-modes, #cm-form, .cm-skip, .cm-beta-note { display: none !important; }
  .cm-report-wrap[hidden] { display: none !important; }
  .cm-page { background: #fff; }
  .cm-card { box-shadow: none; break-inside: avoid; }
}