/* A compact visual workflow. All styling is confined to the quality page. */
.qc-page { --qc-green: #28664e; --qc-amber: #885900; color: var(--ink); overflow-wrap: break-word; }
.qc-page *, .qc-page *::before, .qc-page *::after { box-sizing: border-box; }
.qc-page [hidden] { display: none !important; }
.qc-page :is(h1,h2,h3,p,figure,blockquote) { margin: 0; }
.qc-page h2 { font-size: clamp(32px,3.4vw,48px); font-weight: 500; line-height: 1.12; letter-spacing: -.045em; }
.qc-page h3 { font-size: clamp(25px,2.5vw,35px); font-weight: 500; line-height: 1.15; letter-spacing: -.04em; }
.qc-page p { color: var(--ink-2); font-weight: 400; line-height: 1.7; }
.qc-page :is(button,input,textarea,select) { font: inherit; }
.qc-page button { cursor: pointer; }
.qc-page button:disabled { cursor: default; opacity: .55; }
.qc-page :is(a,button,summary,input,textarea,select,[role="tab"]):focus-visible, .quality-page .qc-skip:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.qc-page :is(section,[id]) { scroll-margin-top: 100px; }
.qc-wrap { width: min(1184px,calc(100% - 96px)); margin-inline: auto; }
.qc-section { padding-block: 82px; }
.qc-page .qc-eyebrow { display: flex; align-items: center; gap: 9px; margin-bottom: 18px; font-size: 10px; font-weight: 550; text-transform: uppercase; letter-spacing: .12em; color: var(--ink-3); line-height: 1.5; }
.qc-dot { width: 6px; height: 6px; display: inline-block; flex: none; background: var(--accent); border-radius: 50%; }
.qc-page .qc-small { font-size: 11px; line-height: 1.7; color: var(--ink-3); }
.qc-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }
.qc-page .button-primary { gap: 18px; text-align: center; font-size: 14px; }
.qc-page .qc-link { display: inline-flex; align-items: center; gap: 12px; border: 0; padding: 0; min-height: 44px; font-size: 13px; line-height: 1.6; text-align: left; font-weight: 500; color: var(--ink); background: transparent; text-decoration: none; }
.qc-page .qc-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.qc-control { display: inline-flex; justify-content: center; align-items: center; gap: 15px; padding: 12px 18px; min-height: 44px; border-radius: 7px; border: 1px solid var(--line-strong); color: var(--ink); background: var(--paper); font-size: 13px !important; line-height: 1.5; font-weight: 500 !important; }
.qc-control:hover:enabled { border-color: var(--ink-3); }
.qc-control-dark { background: var(--ink); border-color: var(--ink); color: var(--on-fill); }
.qc-control-dark:hover:enabled { background: var(--ink-hover); }
.qc-control[aria-disabled="true"] { background: var(--paper-2); color: var(--ink-3); border-color: var(--line-strong); }
.qc-tag { display: inline-flex; align-items: center; border: 1px solid var(--line-strong); border-radius: 4px; padding: 4px 8px; font-size: 10px; line-height: 1.5; }
.qc-sr-only { position: absolute !important; width: 1px; height: 1px; margin: -1px; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }
.quality-page .qc-skip { position: fixed; top: 12px; left: 18px; z-index: 10001; padding: 12px 20px; background: var(--paper); color: var(--ink); transform: translateY(-160%); }
.quality-page .qc-skip:focus { transform: none; }
.qc-page summary { cursor: pointer; list-style: none; }
.qc-page summary::-webkit-details-marker { display: none; }

/* Retain the original background, with a shorter message. */
.qc-hero { position: relative; isolation: isolate; display: flex; align-items: center; min-height: 680px; background: #19232c; }
.qc-hero-background { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.qc-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#07111be0,#07111b8f 47%,#07111b14 90%); }
.qc-hero .qc-wrap { padding-block: 155px 85px; }
.qc-hero h1 { max-width: 690px; font-size: clamp(49px,5.6vw,80px); font-weight: 550; line-height: 1.04; letter-spacing: -.055em; color: #fff; }
.qc-hero .qc-eyebrow { color: #e6eaef; }
.qc-page .qc-hero-lead { color: #f2f4f7; font-size: 18px; line-height: 1.7; margin-block: 25px 30px; }
.qc-hero .button-primary { background: #fff; border-color: #fff; color: #111; }
.qc-hero .button-primary:hover { background: #e9edf0; }
#main-content .qc-hero .qc-link { color: #fff; text-decoration: underline; text-decoration-color: #ffffff66; text-underline-offset: 4px; }
.qc-section-heading { display: flex; justify-content: space-between; align-items: end; gap: 32px; margin-bottom: 34px; }
.qc-section-heading > p { max-width: 240px; font-size: 14px; padding-bottom: 3px; }

/* One workspace, with three views. */
.qc-demo { border: 1px solid var(--line-strong); border-radius: 12px; overflow: hidden; background: var(--paper); scroll-margin-top: 100px; }
.qc-stage-tabs { display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid var(--line); }
.qc-stage-tabs > button { display: flex; gap: 14px; align-items: center; text-align: left; background: var(--paper-2); color: var(--ink-3); border: 0; min-height: 64px; padding: 16px 24px; font-size: 14px; font-weight: 500; position: relative; }
.qc-stage-tabs > button + button { border-left: 1px solid var(--line); }
.qc-stage-tabs > button[aria-selected="true"] { background: var(--paper); color: var(--accent); box-shadow: inset 0 -2px var(--accent); }
.qc-stage-tabs > button:hover:enabled { color: var(--accent); }
.qc-stage-tabs .qc-stage-index { display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid currentColor; border-radius: 50%; flex: none; font-size: 10px; font-weight: 400; }
.qc-demo-topline { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; padding: 18px 26px; border-bottom: 1px solid var(--line); font-size: 11px; color: var(--ink-3); }
.qc-demo-topline strong { font-weight: 500; color: var(--ink); }
.qc-topline-divider { display: inline-block; color: var(--line-strong); padding-inline: 16px; }
.qc-inspection-layout { display: grid; grid-template-columns: 1.4fr 1fr; min-height: 490px; }
.qc-inspection-layout > * { min-width: 0; }
.qc-visual-side { position: relative; min-height: 490px; background: #f4f5f7; border-right: 1px solid var(--line); }
.qc-model { position: absolute; inset: 0; overflow: hidden; }
.qc-model > img { width: 100%; height: 100%; object-fit: contain; display: block; }
.qc-visual-toolbar { position: absolute; top: 20px; inset-inline: 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #3c4655; }
.qc-visual-toolbar > span { display: flex; align-items: center; gap: 8px; font-size: 11px; }
.qc-view-button { border: 1px solid #d5dbe1; border-radius: 6px; min-height: 40px; padding: 8px 12px; color: #313b47; background: #ffffffec; font-size: 11px !important; }
.qc-view-button span { margin-left: 12px; }
.qc-view-button[aria-pressed="true"] { color: #0069d8; border-color: #a8c9eb; }
.qc-reference-label { position: absolute; bottom: 20px; left: 22px; font-size: 10px; color: #68717e; }
.qc-panel { padding: 35px; }
.qc-instruction { display: flex; flex-direction: column; justify-content: space-between; gap: 26px; }
.qc-instruction .qc-eyebrow { margin-bottom: 14px; }
.qc-page .qc-instruction-copy { font-size: 14px; margin-top: 18px; max-width: 320px; }
.qc-reference-details { border-top: 1px solid var(--line); margin-bottom: 17px; }
.qc-reference-details summary, .qc-comment-details summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 11px; }
.qc-reference-details p { font-size: 11px; margin-bottom: 12px; }
.qc-instruction > div:last-child > .qc-control { width: 100%; justify-content: space-between; }
.qc-capture h3 { font-size: 27px; }
.qc-capture .qc-eyebrow { margin-bottom: 12px; }
.qc-status-choice { display: flex; border: 0; gap: 24px; margin: 22px 0 16px; padding: 0; }
.qc-status-choice legend { font-size: 11px; margin-bottom: 9px; padding: 0; }
.qc-status-choice label { display: flex; align-items: center; gap: 8px; min-height: 40px; font-size: 11px; padding: 8px 0; cursor: pointer; }
.qc-status-choice label:has(:checked) { color: var(--ink); }
.qc-status-choice input { margin: 0; width: 14px; height: 14px; accent-color: var(--accent); }
.qc-photo-slot { border: 1px dashed var(--line-strong); padding: 16px; border-radius: 7px; }
.qc-photo-empty { display: flex; align-items: center; gap: 10px; font-size: 11px; color: var(--ink-3); margin-bottom: 13px; }
.qc-photo-slot > button { width: 100%; font-size: 11px !important; justify-content: space-between; }
.qc-photo-added { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.qc-photo-added > button { background: #f4f5f7; border: 1px solid var(--line); border-radius: 5px; padding: 0; width: 90px; flex: none; overflow: hidden; }
.qc-photo-added img { display: block; width: 100%; height: 65px; object-fit: cover; }
.qc-photo-added > span { font-size: 11px; line-height: 1.6; color: var(--qc-green); }
.qc-photo-added > span > span { display: block; }
.qc-photo-slot.is-attached { border-style: solid; border-color: var(--qc-green); }
.qc-photo-slot.is-attached > button { min-height: 30px; padding: 3px 0; background: transparent; border: 0; justify-content: flex-start; color: var(--ink-3); }
.qc-comment-details { margin-block: 8px 15px; }
.qc-page textarea { width: 100%; display: block; min-height: 74px; max-height: 200px; padding: 10px; border: 1px solid var(--line-strong); border-radius: 5px; background: var(--paper); color: var(--ink); font-size: 12px; line-height: 1.7; resize: vertical; }
.qc-capture > .qc-control { width: 100%; justify-content: space-between; }
.qc-page .qc-live-hint { margin-top: 10px; min-height: 19px; font-size: 10px; color: var(--ink-3); }
.qc-page .qc-live-hint.is-error { color: var(--qc-amber); }
.qc-demo-foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); padding: 15px 26px; font-size: 10px; color: var(--ink-3); }
.qc-demo-foot > a { flex: none; }
.qc-below-demo { display: flex; justify-content: space-between; align-items: start; gap: 30px; padding-top: 20px; }
.qc-below-demo > p { max-width: 590px; font-size: 11px; }
.qc-export-details { max-width: 340px; flex: none; }
.qc-export-details summary { font-size: 12px; min-height: 36px; display: flex; align-items: center; gap: 25px; }
.qc-export-details > div { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 18px; }
.qc-export-details p { font-size: 11px; }
.qc-export-details .qc-link { font-size: 12px; }

/* The record is another view in the same workspace, not another section. */
.qc-record-panel { display: grid; grid-template-columns: 310px 1fr; }
.qc-unit-card { background: var(--paper-2); padding: 24px; border-right: 1px solid var(--line); }
.qc-unit-image { display: block; width: 100%; height: 110px; object-fit: contain; margin-bottom: 20px; background: #f4f5f7; border-radius: 6px; }
.qc-unit-card .qc-eyebrow { font-size: 9px; margin-bottom: 8px; }
.qc-unit-card h3 { font-size: 22px; }
.qc-page .qc-unit-serial { margin-block: 8px 22px; font-family: ui-monospace,monospace; color: var(--ink); font-size: 12px; }
.qc-select-label { display: block; font-size: 11px; margin-bottom: 8px; color: var(--ink-3); }
.qc-page select { width: 100%; min-height: 44px; padding: 10px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--paper); color: var(--ink); font-size: 12px; }
.qc-record-meta { margin-block: 5px 12px; }
.qc-record-meta > div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding-block: 8px; font-size: 10px; }
.qc-record-meta dt { color: var(--ink-3); }
.qc-record-meta dd { text-align: right; margin: 0; }
.qc-record-details { margin-top: 20px; border-top: 1px solid var(--line); }
.qc-record-details summary { display: flex; justify-content: space-between; align-items: center; min-height: 44px; gap: 12px; font-size: 12px; }
.qc-record-details[open] summary > span { transform: rotate(45deg); }
.qc-record-details > .qc-small { font-size: 10px; }
.qc-record-body { padding: 32px; min-width: 0; }
.qc-record-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.qc-record-heading .qc-eyebrow { margin-bottom: 8px; font-size: 9px; }
.qc-record-heading h3 { font-size: 25px; }
.qc-count { display: block; font-size: 27px; line-height: 1.25; font-weight: 500; letter-spacing: -.03em; flex: none; }
.qc-count small { display: block; color: var(--ink-3); font-size: 9px; font-weight: 400; letter-spacing: 0; margin-top: 5px; }
.qc-record-step { border-top: 1px solid var(--line); }
.qc-record-step summary { display: flex; align-items: center; gap: 12px; padding-block: 20px; font-size: 13px; }
.qc-record-step summary > span:last-child { margin-left: auto; }
.qc-record-step summary small { display: block; font-size: 10px; color: var(--qc-green); margin-top: 6px; }
.qc-step-symbol { display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; width: 24px; height: 24px; flex: none; color: var(--qc-green); font-size: 10px; }
.qc-record-step.is-incomplete summary :is(small,.qc-step-symbol) { color: var(--qc-amber); }
.qc-record-step[open] summary > span:last-child { transform: rotate(45deg); }
.qc-record-step > div { padding: 0 0 22px 36px; }
.qc-record-step > div > p { font-size: 12px; margin-bottom: 14px; }
.qc-record-step blockquote { color: var(--ink-2); font-size: 14px; line-height: 1.7; }
.qc-record-step > .qc-step-evidence { display: grid; grid-template-columns: 1fr 180px; align-items: center; gap: 24px; padding-top: 3px; }
.qc-evidence-image { display: block; width: 180px; max-width: 100%; padding: 0; border: 1px solid var(--line); border-radius: 6px; background: var(--paper); text-align: left; overflow: hidden; color: var(--ink); }
.qc-evidence-image img { display: block; width: 100%; height: 108px; object-fit: cover; }
.qc-evidence-image > span { display: flex; justify-content: space-between; padding: 10px; font-size: 11px; }
.qc-record-foot { display: flex; align-items: center; justify-content: space-between; gap: 22px; border-top: 1px solid var(--line); margin-top: 8px; padding-top: 15px; }
.qc-record-foot .qc-small { font-size: 10px; max-width: 310px; }
.qc-record-foot .qc-link { font-size: 11px; flex: none; }

/* One concrete before/after replaces the longer improvement and revision story. */
.qc-improve-section { background: var(--paper-2); }
.qc-improve-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }
.qc-improve-copy > p:not(.qc-eyebrow) { font-size: 14px; max-width: 340px; }
.qc-improve-copy > .qc-link { margin-top: 18px; font-size: 12px; }
.qc-feedback { display: flex; align-items: center; gap: 12px; margin-block: 27px 23px; }
.qc-avatar { display: grid; place-items: center; width: 33px; height: 33px; background: var(--paper); border: 1px solid var(--line); border-radius: 50%; flex: none; font-size: 10px; }
.qc-feedback blockquote { font-size: 15px; }
.qc-feedback div > span { font-size: 10px; color: var(--ink-3); }
.qc-improvement { min-width: 0; background: var(--paper); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.qc-improvement-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 16px 20px; font-size: 11px; }
.qc-view-switch { display: flex; border: 1px solid var(--line); border-radius: 5px; padding: 3px; }
.qc-view-switch button { border: 0; background: transparent; color: var(--ink-3); border-radius: 3px; min-height: 32px; padding: 5px 12px; font-size: 11px; }
.qc-view-switch button[aria-pressed="true"] { background: var(--paper-2); color: var(--ink); box-shadow: 0 0 0 1px var(--line); }
.qc-compare-image { position: relative; background: #f4f5f7; }
.qc-compare-image img { display: block; width: 100%; height: 290px; object-fit: cover; }
.qc-compare-label { position: absolute; left: 20px; bottom: 16px; padding: 5px 9px; font-size: 10px; color: #4b5867; background: #fffffff2; border: 1px solid #dfe3e9; border-radius: 4px; }
.qc-improvement-caption { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; min-height: 78px; }
.qc-improvement-caption > span:first-child { font-size: 12px; line-height: 1.7; max-width: 290px; }
.qc-improvement-caption .qc-tag { font-size: 9px; flex: none; }
.qc-compare-image.is-changing img { animation: qc-view-arrive .35s ease-out both; }
@keyframes qc-view-arrive { from { opacity: .5; transform: scale(.97); } to { opacity: 1; transform: none; } }
.qc-faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; }
.qc-faq h2 { font-size: 37px; }
.qc-faq details { border-bottom: 1px solid var(--line); }
.qc-faq details:first-child { border-top: 1px solid var(--line); }
.qc-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 19px; font-size: 14px; }
.qc-faq summary span { font-size: 19px; flex: none; }
.qc-faq details[open]:not([data-qc-expanded]) summary span, .qc-faq details[data-qc-expanded="true"] summary span { transform: rotate(45deg); }
.qc-faq summary > span { transition: transform .28s cubic-bezier(.22,1,.36,1); }
.qc-faq summary:focus-visible { outline-offset: -2px; }
.qc-faq-answer { display: flow-root; }
.qc-faq details p { font-size: 13px; padding-bottom: 22px; }
.qc-closing { background: var(--paper-2); padding-block: 66px; }
.qc-closing > .qc-wrap { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.qc-closing h2 { font-size: clamp(32px,3vw,42px); }
.qc-closing p:not(.qc-eyebrow) { margin-top: 20px; font-size: 14px; }
.qc-closing .button-primary { flex: none; }
.qc-image-dialog { max-width: min(800px,calc(100% - 32px)); max-height: calc(100svh - 40px); overflow-y: auto; background: var(--paper); color: var(--ink); border: 1px solid var(--line-strong); border-radius: 10px; padding: 24px; }
.qc-image-dialog::backdrop { background: #061321bb; }
.qc-image-dialog > div { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.qc-image-dialog h3 { font-size: 23px; }
.qc-image-dialog > img { display: block; width: 100%; height: auto; max-height: 62svh; object-fit: contain; background: #f4f5f7; }
.qc-image-dialog > p { font-size: 12px; margin-top: 16px; }

@media (max-width: 1050px) {
 .qc-wrap { width: calc(100% - 64px); }
 .qc-panel { padding: 27px; }
 .qc-inspection-layout { grid-template-columns: 1.15fr 1fr; }
 .qc-stage-tabs > button { padding-inline: 20px; gap: 10px; font-size: 12px; }
 .qc-improve-layout, .qc-faq-layout { gap: 40px; }
 .qc-improvement-caption { flex-wrap: wrap; gap: 10px; }
 .qc-record-panel { grid-template-columns: 265px 1fr; }
 .qc-record-body { padding: 26px; }
 .qc-record-heading h3 { font-size: 22px; }
}
@media (max-width: 800px) {
 .qc-hero { min-height: 610px; }
 .qc-hero h1 { font-size: 66px; }
 .qc-hero .qc-actions { gap: 14px; flex-direction: column; align-items: flex-start; }
 .qc-section-heading { align-items: start; flex-direction: column; gap: 15px; }
 .qc-section-heading > p { max-width: none; }
 .qc-inspection-layout { grid-template-columns: 1.05fr 1fr; }
 .qc-panel { padding: 24px; }
 .qc-panel h3 { font-size: 26px; }
 .qc-visual-toolbar { align-items: flex-start; flex-direction: column; inset-inline: 16px; top: 20px; gap: 13px; }
 .qc-visual-side { min-height: 480px; }
 .qc-below-demo { gap: 20px; }
 .qc-below-demo > p { max-width: 360px; }
 .qc-export-details { max-width: 270px; }
 .qc-record-panel { grid-template-columns: 1fr; }
 .qc-unit-card { display: block; border-right: 0; border-bottom: 1px solid var(--line); }
 .qc-unit-image { display: none; }
 .qc-improve-layout { gap: 35px; grid-template-columns: .9fr 1.1fr; }
 .qc-improve-copy h2 { font-size: 32px; }
 .qc-improvement-top { flex-direction: column; align-items: flex-start; gap: 12px; }
 .qc-compare-image img { height: 240px; }
 .qc-faq-layout { grid-template-columns: 1fr 1.35fr; }
 .qc-closing > .qc-wrap { align-items: flex-start; flex-direction: column; gap: 28px; }
}
@media (max-width: 600px) {
 .qc-wrap { width: calc(100% - 40px); }
 .qc-section { padding-block: 55px; }
 .qc-hero { min-height: 0; }
 .qc-hero .qc-wrap { padding-block: 150px 65px; }
 .qc-hero h1 { font-size: clamp(45px,12vw,65px); }
 .qc-hero-background { object-position: 60% center; }
 .qc-hero::before { background: linear-gradient(90deg,#07111be0,#07111b66); }
 .qc-page .qc-hero-lead { font-size: 15px; margin-block: 22px 28px; }
 .qc-hero .button-primary { font-size: 13px; }
 .qc-hero .qc-link { font-size: 12px; }
 .qc-page .qc-eyebrow { font-size: 9px; }
 .qc-section-heading { margin-bottom: 25px; }
 .qc-section-heading h2 { font-size: 32px; }
 .qc-section-heading > p { font-size: 13px; }
 .qc-stage-tabs > button { flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 14px 5px; font-size: 10px; text-align: center; min-height: 72px; }
 .qc-demo-topline { padding: 15px 16px; font-size: 10px; gap: 10px; }
 .qc-demo-topline .qc-tag { font-size: 9px; padding: 2px 6px; }
 .qc-topline-divider { padding-inline: 8px; }
 .qc-inspection-layout { grid-template-columns: 1fr; }
 .qc-visual-side { min-height: 275px; border-right: 0; border-bottom: 1px solid var(--line); }
 .qc-visual-toolbar { flex-direction: row; align-items: center; gap: 10px; top: 15px; }
 .qc-visual-toolbar > span { font-size: 10px; }
 .qc-view-button { font-size: 10px !important; padding: 6px 9px; min-height: 36px; }
 .qc-reference-label { bottom: 13px; left: 16px; font-size: 9px; }
 .qc-panel { padding: 25px; }
 .qc-panel h3 { font-size: 28px; }
 .qc-panel h3 br { display: none; }
 .qc-page .qc-instruction-copy { font-size: 13px; max-width: none; margin-top: 15px; }
 .qc-instruction { gap: 22px; }
 .qc-status-choice label { font-size: 12px; }
 .qc-demo-foot { align-items: flex-start; gap: 10px; padding: 14px 16px; font-size: 9px; }
 .qc-demo-foot > span { max-width: 215px; }
 .qc-below-demo { flex-direction: column; gap: 8px; padding-top: 16px; }
 .qc-below-demo > p { font-size: 10px; }
 .qc-export-details { width: 100%; max-width: none; }
 .qc-export-details summary { font-size: 11px; }
 .qc-unit-card { padding: 22px; column-gap: 20px; }
 .qc-unit-card h3 { font-size: 19px; }
 .qc-unit-card .qc-unit-serial { font-size: 11px; margin-block: 7px 18px; }
 .qc-unit-card select { font-size: 11px; padding: 8px; }
 .qc-record-meta > div { font-size: 10px; }
 .qc-record-body { padding: 24px 20px; }
 .qc-record-heading { gap: 14px; }
 .qc-record-heading h3 { font-size: 23px; }
 .qc-count { font-size: 25px; }
 .qc-count small { font-size: 8px; }
 .qc-record-step summary { gap: 9px; font-size: 12px; }
 .qc-record-step summary small { font-size: 10px; }
 .qc-record-step > div { padding-left: 0; }
 .qc-record-step > .qc-step-evidence { grid-template-columns: 1fr; gap: 14px; }
 .qc-record-step > div > p, .qc-record-step blockquote { font-size: 12px; }
 .qc-record-foot { flex-wrap: wrap; gap: 8px; }
 .qc-improve-layout, .qc-faq-layout { grid-template-columns: 1fr; gap: 28px; }
 .qc-improve-copy h2 { font-size: 34px; }
 .qc-feedback { margin-block: 22px 18px; }
 .qc-improve-copy > p:not(.qc-eyebrow) { font-size: 13px; max-width: none; }
 .qc-improve-copy > .qc-link { margin-top: 12px; }
 .qc-improvement-top { flex-direction: row; align-items: center; padding: 14px 16px; font-size: 10px; gap: 12px; }
 .qc-view-switch button { padding: 5px 10px; font-size: 10px; }
 .qc-compare-image img { height: 240px; object-fit: contain; }
 .qc-improvement-caption { padding: 16px; }
 .qc-faq h2 { font-size: 34px; }
 .qc-faq summary { font-size: 13px; padding-block: 18px; }
 .qc-closing { padding-block: 52px; }
 .qc-closing .button-primary { font-size: 12px; }
 .qc-image-dialog { padding: 18px; }
 .qc-image-dialog h3 { font-size: 21px; }
}
@media (max-width: 360px) {
 .qc-panel { padding: 22px 18px; }
 .qc-stage-tabs > button { font-size: 9px; }
 .qc-demo-topline { gap: 8px; }
 .qc-unit-card { display: block; }
 .qc-record-meta { margin-block: 16px; }
 .qc-record-meta > div { flex-direction: row; }
 .qc-improvement-top { flex-wrap: wrap; }
}
@media (prefers-color-scheme: dark) { .qc-page { --qc-green: #8bd2ad; --qc-amber: #e7bb70; } }
@media (prefers-reduced-motion: reduce) { .qc-page *, .qc-page *::before, .qc-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }