/* Local candidate layered over the adopted r22 workbench. Original assets remain sealed. */
body[data-quick-preview] { --qs-ink:#2f4937; --qs-muted:#6f7b6b; --qs-line:#dfe5dc; --qs-tint:#eef2e9; --qs-ease:cubic-bezier(.3,1,.3,1); }
body.qs-mode .b1-right > :not(#qs-panel), body.qs-mode #wb-examples,
body.qs-mode .wb-dock, body.qs-mode .wb-zonebar, body.qs-mode #wb-start-hint,
body.qs-mode .wb-breadcrumb, body.qs-mode #wb-layout-open,
body.qs-mode .wb-head-actions .wb-segment, body.qs-mode #wb-meta,
body.qs-mode .wb-notice { display:none !important; }
body.qs-free .b1-right > .wb-order, body.qs-free .b1-right > .wb-review,
body.qs-free #qs-panel, body.qs-free .qs-workspace-title, body.qs-free .qs-view-switch,
body.qs-free .qs-pair, body.qs-free .qs-canvas-caption { display:none !important; }
body.qs-mode #qs-free-panel { display:none; }
body.qs-mode .wb-stage { inset:132px 12px 50px !important; }
body.qs-mode .wb-workspace { min-height:640px; }
body.qs-mode .wb-workspace-head { align-items:flex-start; }
body.qs-mode .wb-head-actions { align-items:center; gap:8px; }
body.qs-mode .qs-workspace-title { color:var(--qs-ink); }
.qs-eyebrow { font-size:13px; color:var(--qs-muted); line-height:1.5; margin:0 0 8px; }
.qs-workspace-title h1 { font-size:28px; line-height:1.35; font-weight:650; letter-spacing:-.025em; margin:0 0 8px; }
.qs-workspace-title p { font-size:14px; margin:0; color:var(--qs-muted); }
.qs-view-switch { display:flex; align-items:center; gap:4px; padding:4px; border-radius:12px; background:var(--qs-tint); }
.qs-view-switch button { min-height:40px; border:0; background:transparent; color:var(--qs-ink); padding:8px 16px; border-radius:8px; font-size:14px; font-weight:650; }
.qs-view-switch button[aria-pressed=true] { background:#fff; box-shadow:0 1px 4px #23332212; }
.qs-pair { position:absolute; inset:0; z-index:3; background:#f7f9f5; display:grid; place-items:center; }
.qs-pair canvas { display:block; width:100%; height:100%; object-fit:contain; }
.qs-pair[hidden] { display:none; }
.qs-face-labels { position:absolute; bottom:12px; left:0; right:0; display:grid; grid-template-columns:1fr 1fr; text-align:center; color:var(--qs-muted); font-size:13px; line-height:1.5; }
.qs-canvas-caption { position:absolute; bottom:20px; left:24px; right:24px; display:flex; justify-content:space-between; gap:12px; color:var(--qs-muted); font-size:13px; pointer-events:none; }
.qs-canvas-caption strong { color:var(--qs-ink); font-weight:500; }
#qs-panel,#qs-free-panel { color:var(--qs-ink); font-size:16px; padding:8px 4px 16px; scroll-margin-top:80px; }
#qs-panel *,#qs-free-panel * { box-sizing:border-box; }
#qs-panel h2,#qs-free-panel h2 { font-size:20px; font-weight:650; line-height:1.4; margin:0; letter-spacing:-.02em; }
.qs-intro { color:var(--qs-muted); margin:8px 0 24px; font-size:14px; line-height:1.6; }
.qs-progress { display:flex; gap:12px; align-items:center; margin:0 0 24px; font-size:13px; color:var(--qs-muted); }
.qs-progress span { display:flex; align-items:center; gap:8px; }
.qs-progress b { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--qs-tint); font-size:13px; font-weight:500; }
.qs-progress span[data-active=true] { color:var(--qs-ink); font-weight:650; }
.qs-progress span[data-active=true] b { background:var(--qs-ink); color:#fff; }
.qs-progress i { width:24px; height:1px; background:var(--qs-line); }
.qs-field { margin:0 0 16px; }
#qs-panel .qs-field > label,#qs-panel .qs-label { display:block; font-size:14px; font-weight:650; line-height:1.5; margin:0 0 8px; }
.qs-optional { font-size:13px; font-weight:400; color:var(--qs-muted); margin-left:8px; }
.qs-required { font-size:13px; font-weight:400; color:#a53c38; margin-left:8px; }
body[data-quick-preview] #qs-panel .qs-required { color:#a53c38; }
#qs-panel input:not([type=checkbox]):not([type=file]),#qs-panel textarea { width:100%; min-height:48px; border:1px solid #c6cec0; border-radius:8px; background:#fff; color:#25392b; font:inherit; font-size:16px; padding:12px; line-height:1.5; box-shadow:none; transition:border-color 160ms var(--qs-ease),box-shadow 160ms var(--qs-ease); }
#qs-panel input::placeholder,#qs-panel textarea::placeholder { color:#87917f; }
#qs-panel input[aria-invalid=true] { border-color:#a53c38; }
#qs-panel :is(input,textarea,button,summary,a):focus-visible,#qs-free-panel button:focus-visible { outline:2px solid var(--qs-ink); outline-offset:3px; }
#qs-panel :is(button,a),#qs-free-panel button,.qs-view-switch button { -webkit-tap-highlight-color:transparent; transition:background-color 160ms var(--qs-ease),color 160ms var(--qs-ease),scale 160ms var(--qs-ease); cursor:pointer; }
#qs-panel button:active,#qs-free-panel button:active,.qs-view-switch button:active { scale:.97; }
#qs-panel button:disabled { opacity:.55; cursor:wait; }
.qs-content-group { margin-bottom:24px; }
.qs-content-group .qs-field { margin-bottom:12px; }
.qs-upload { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.qs-upload button { display:inline-flex; gap:8px; align-items:center; justify-content:center; padding:8px 12px; min-height:44px; background:var(--qs-tint); border:1px solid transparent; border-radius:8px; color:var(--qs-ink); font:inherit; font-size:14px; font-weight:500; }
.qs-upload svg { width:20px; height:20px; flex:none; }
.qs-upload-name { color:var(--qs-muted); font-size:13px; line-height:1.5; overflow-wrap:anywhere; flex:1 1 100%; }
#qs-logo-remove { background:transparent; padding:8px; }
.qs-hint { font-size:13px; line-height:1.6; margin:8px 0 0; color:var(--qs-muted); }
.qs-print-row { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:8px 16px; padding:16px; border-radius:12px; background:var(--qs-tint); margin-bottom:24px; }
#qs-panel .qs-print-row label { font-size:14px; font-weight:500; margin:0; }
#qs-panel .qs-print-row input { min-width:0; padding:8px 12px; min-height:44px; }
.qs-print-row p { grid-column:1 / -1; margin:0; color:var(--qs-muted); font-size:13px; line-height:1.6; }
.qs-link,.qs-back { background:none; border:0; border-radius:8px; color:var(--qs-ink); padding:8px; min-height:44px; font:inherit; font-size:14px; text-decoration:none; }
.qs-primary { display:flex; align-items:center; justify-content:center; gap:12px; width:100%; min-height:52px; border:1px solid var(--qs-ink); border-radius:8px; background:var(--qs-ink); color:#fff; font:inherit; font-weight:650; padding:12px 16px; }
.qs-primary span { font-size:20px; line-height:1; }
.qs-actions { position:sticky; bottom:0; z-index:4; padding:12px 0 0; background:#fff; }
.qs-editor-link { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:8px; }
.qs-error { color:#a53c38; font-size:14px; line-height:1.6; margin:8px 0; }
.qs-status { font-size:13px; color:var(--qs-muted); margin:8px 0; line-height:1.6; }
.qs-status:empty { display:none; }
.qs-heading-row { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.qs-heading-row .qs-back { flex:none; margin-right:-8px; padding:8px; font-size:13px; }
.qs-count-line { display:flex; gap:8px; align-items:center; }
.qs-count-line input { flex:1; min-width:0; }
.qs-count-line > span { color:var(--qs-muted); font-size:14px; }
#qs-panel label.qs-check { display:flex; align-items:center; gap:8px; font-size:13px; margin:0 0 0 8px; cursor:pointer; flex:none; min-height:44px; white-space:nowrap; }
#qs-panel .qs-check input { width:18px; height:18px; flex:none; margin:0; accent-color:var(--qs-ink); }
.qs-contact-group { padding-top:8px; }
#qs-panel details { padding:0; border:0; border-radius:0; background:transparent; }
#qs-panel #qs-extra { margin:0 0 16px; }
#qs-extra summary,.qs-design-summary summary { cursor:pointer; min-height:44px; display:flex; align-items:center; gap:8px; font-size:14px; list-style:none; }
#qs-extra summary::-webkit-details-marker,.qs-design-summary summary::-webkit-details-marker { display:none; }
#qs-extra summary::after,.qs-design-summary summary::after { content:'＋'; margin-left:auto; }
#qs-extra[open] summary::after,.qs-design-summary[open] summary::after { content:'−'; }
#qs-extra[open] summary { margin-bottom:8px; }
.qs-summary { border-radius:12px; padding:16px; background:var(--qs-tint); margin:16px 0 0; }
.qs-summary strong { display:block; font-size:16px; font-weight:650; overflow-wrap:anywhere; }
.qs-summary p { font-size:13px; line-height:1.6; color:var(--qs-muted); margin:8px 0 0; white-space:pre-line; }
.qs-summary-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.qs-summary-heading > span { font-size:14px; flex:none; }
.qs-summary .qs-total { color:var(--qs-ink); font-size:18px; font-weight:650; text-align:right; font-variant-numeric:tabular-nums; }
.qs-design-summary { margin-top:8px; }
.qs-design-summary summary { color:var(--qs-muted); font-size:13px; }
.qs-demo-note,.qs-preview-note { font-size:13px; line-height:1.6; color:var(--qs-muted); margin:8px 0 0; text-align:center; }
.qs-preview-note { margin:8px 0 0; }
.qs-receipt-mark { width:48px; height:48px; border-radius:50%; background:var(--qs-tint); display:grid; place-items:center; font-size:28px; margin:16px 0; }
#qs-receipt-image { width:100%; border-radius:12px; display:block; margin:16px 0; }
#qs-done-step .qs-primary,#qs-free-panel .qs-primary { margin-top:16px; }
.qs-custom-note { margin:16px 0 0; font-size:13px; line-height:1.6; }
.qs-custom-note .qs-link { font-size:13px; padding-left:0; }
[data-quick-preview] [hidden] { display:none !important; }
.qs-loading-failure { margin:24px; padding:20px; border:1px solid #c6cec0; border-radius:12px; color:var(--qs-ink); background:#fff; }
@media(hover:hover) and (pointer:fine) { .qs-primary:hover {background:#243b2b;} .qs-upload button:hover,.qs-link:hover,.qs-back:hover {background:var(--qs-tint);} }
@media(min-width:801px) { body.qs-mode .b1-right {scrollbar-gutter:stable;} }
@media(max-width:1100px) { .qs-workspace-title h1 {font-size:20px;} .qs-view-switch button {padding:8px 12px;} }
@media(max-width:800px) {
  body.qs-mode .wb-workspace {height:460px !important;min-height:460px !important;}
  body.qs-mode .wb-stage {inset:112px 4px 36px !important;}
  body.qs-mode .wb-workspace-head {padding:20px 16px;gap:8px;}
  .qs-eyebrow {font-size:13px;margin-bottom:4px;}
  .qs-workspace-title h1 {margin-bottom:4px;}
  .qs-workspace-title p {font-size:13px;}
  .qs-view-switch {gap:0;padding:3px;}
  .qs-view-switch button {font-size:13px;padding:8px;min-height:40px;}
  body.qs-mode #wb-expand {display:none;}
  .qs-canvas-caption {left:16px;right:16px;bottom:12px;font-size:13px;}
  #qs-panel,#qs-free-panel {padding:8px 4px 16px;}
  .qs-intro {margin-bottom:24px;}
  .qs-actions {padding-bottom:8px;}
}
@media(prefers-reduced-motion:reduce) { #qs-panel *,#qs-free-panel *,.qs-view-switch * {transition:none !important;scroll-behavior:auto !important;} #qs-panel button:active,#qs-free-panel button:active,.qs-view-switch button:active {scale:1;} }

/* Whole-flow revision: one preview, two concise panels, original selection dialogs. */
.qs-eyebrow { display:inline-flex;gap:8px;align-items:center;text-decoration:none;min-height:28px; }
body.qs-mode .wb-stage { inset:124px 12px 72px !important; }
.qs-canvas-caption { pointer-events:auto;bottom:16px;align-items:center;min-height:44px; }
.qs-canvas-caption > span { display:grid;gap:4px; }
.qs-canvas-caption small {font-size:13px;}
.qs-canvas-caption .qs-link {border:1px solid var(--qs-line);padding:8px 16px;background:#fff;white-space:nowrap;}
.qs-view-switch button {min-height:44px;}
body.qs-mode #qs-preview-canvas {width:100% !important;height:100% !important;min-height:0;min-width:0;max-height:100%;object-fit:contain;}
#qs-panel {padding:8px 8px 16px;}
.qs-progress {gap:8px;margin-bottom:20px;}
.qs-progress button {display:flex;align-items:center;gap:8px;padding:4px 0;min-height:40px;border:0;background:transparent;color:var(--qs-muted);font:inherit;font-size:13px;white-space:nowrap;}
.qs-progress button[data-active=true] {color:var(--qs-ink);font-weight:650;}
.qs-progress button[data-active=true] b {color:#fff;background:var(--qs-ink);}
.qs-progress i {flex:1;min-width:8px;}
.qs-intro {margin:8px 0 20px;}
.qs-content-group {margin-bottom:16px;}
.qs-upload {display:block;}
#qs-upload {display:flex;justify-content:flex-start;width:100%;padding:12px;border:1px solid var(--qs-line);border-radius:12px;background:#fff;text-align:left;min-height:72px;gap:12px;}
#qs-upload > span:not(.qs-upload-plus) {display:grid;gap:4px;min-width:0;}
#qs-upload strong {font-size:14px;font-weight:650;}
#qs-upload small {font-size:13px;line-height:1.45;color:var(--qs-muted);font-weight:400;}
#qs-upload svg {width:24px;height:24px;}
#qs-upload .qs-upload-plus {margin-left:auto;font-size:20px;font-weight:400;}
#qs-upload[data-uploaded=true],#qs-dropzone[data-drag=true] #qs-upload {background:var(--qs-tint);border-color:#a9b7a5;}
.qs-upload-file {display:flex;align-items:center;gap:8px;}
.qs-upload-file:has(> [hidden]):not(:has(> :not([hidden]))) {display:none;}
.qs-upload-name {flex:1;min-width:0;}
.qs-upload-file #qs-logo-remove {flex:none;}
.qs-print-row {background:transparent;border-top:1px solid var(--qs-line);border-bottom:1px solid var(--qs-line);border-radius:0;padding:12px 0;margin:0;grid-template-columns:112px minmax(0,1fr);gap:12px;}
.qs-print-row label small {display:block;font-size:13px;font-weight:400;color:var(--qs-muted);margin-top:4px;}
#qs-panel .qs-print-row input {min-height:48px;}
.qs-garment-row {padding:8px 0 4px;}
.qs-garment-row > button {width:100%;padding:8px 0;min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:transparent;text-align:left;color:var(--qs-ink);font:inherit;font-size:14px;}
.qs-garment-row > button > span:first-child {display:grid;gap:4px;}
.qs-garment-row small {font-size:13px;color:var(--qs-muted);}
.qs-garment-row strong {font-size:14px;font-weight:650;}
.qs-reference-links {display:flex;gap:16px;}
.qs-reference-links button {min-height:36px;background:none;border:0;border-bottom:1px solid transparent;padding:4px 0;color:var(--qs-muted);font:inherit;font-size:13px;}
.qs-reference-links button:hover {border-color:currentColor;}
.qs-actions {position:static;padding-top:12px;}
.qs-editor-link {font-size:13px;margin-top:4px;min-height:40px;}
#qs-design-step .qs-editor-link {display:none;}
.qs-preview-jump {display:none;}
.qs-order-preview {display:flex;gap:12px;align-items:center;padding:12px;border:1px solid var(--qs-line);border-radius:12px;margin-bottom:20px;}
.qs-order-preview img {width:112px;height:76px;object-fit:contain;background:#f7f9f5;border-radius:8px;}
.qs-order-preview > span {display:grid;gap:4px;min-width:0;}
.qs-order-preview strong {font-size:14px;font-weight:650;overflow-wrap:anywhere;}
.qs-order-preview small {font-size:13px;color:var(--qs-muted);}
.qs-order-preview button {justify-self:start;min-height:28px;border:0;background:none;padding:0;color:var(--qs-ink);font:inherit;font-size:13px;}
.qs-contact-group {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:12px;padding:0;}
#qs-panel .qs-contact-group input {padding:12px 10px;}
.qs-summary {background:transparent;border-top:1px solid var(--qs-line);border-radius:0;padding:16px 0 8px;margin:4px 0 0;}
#qs-extra summary {color:var(--qs-muted);}
#qs-panel #qs-extra {margin:0 0 4px;}
.qs-summary .qs-total {font-size:20px;}
.qs-design-summary {margin-top:0;}
.qs-preview-note {text-align:center;margin:4px 0 0;color:var(--qs-muted);}
.qs-receipt-mark {margin:16px 0 20px;width:56px;height:56px;}
.qs-receipt-eyebrow {font-size:13px;margin:0 0 8px;color:var(--qs-muted);}
#qs-receipt-image {margin:16px 0 4px;}
.qs-choice-dialog {width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 48px);padding:24px;border:1px solid var(--qs-line);border-radius:12px;color:var(--qs-ink);background:#fff;box-shadow:0 16px 64px #0002;}
.qs-choice-dialog::backdrop {background:#0005;}
.qs-dialog-head {display:flex;align-items:center;justify-content:space-between;gap:12px;}
.qs-dialog-head h2 {font-size:20px;font-weight:650;margin:0;}
.qs-dialog-head button {background:var(--qs-tint);border:0;border-radius:50%;width:44px;height:44px;font-size:28px;color:var(--qs-ink);cursor:pointer;}
.qs-choice-dialog > p {font-size:14px;color:var(--qs-muted);margin:4px 0 20px;}
.qs-garment-options {display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.qs-garment-options button {min-height:96px;position:relative;display:grid;align-content:center;gap:8px;text-align:left;padding:16px 12px;border:1px solid var(--qs-line);border-radius:12px;background:#fff;color:var(--qs-ink);font:inherit;cursor:pointer;}
.qs-garment-options small {font-size:13px;color:var(--qs-muted);}
.qs-garment-options strong {font-size:14px;font-weight:650;}
.qs-garment-options span {display:none;position:absolute;top:8px;right:8px;}
.qs-garment-options [aria-pressed=true] {border-color:var(--qs-ink);background:var(--qs-tint);}
.qs-garment-options [aria-pressed=true] span {display:block;}
.qs-dialog-color {display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;margin:16px 0;min-height:52px;border:0;border-bottom:1px solid var(--qs-line);background:none;color:var(--qs-ink);font:inherit;font-size:14px;cursor:pointer;}
.qs-choice-dialog :focus-visible {outline:2px solid var(--qs-ink);outline-offset:3px;}
.qs-continue-design {display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:76px;padding:16px;text-align:left;border:1px solid var(--qs-line);border-radius:12px;background:#fff;color:var(--qs-ink);font:inherit;font-size:15px;font-weight:650;cursor:pointer;}
.qs-continue-design small {display:block;margin-top:4px;font-size:13px;line-height:1.5;font-weight:400;color:var(--qs-muted);}
.qs-custom-note > .qs-link {margin-top:8px;color:var(--qs-muted);}
.qs-reset-actions {display:grid;gap:8px;}
#qs-reset-description {margin:16px 0 24px;line-height:1.7;}
body[data-quick-preview] .b1-choice-panel {inset:0 !important;margin:auto !important;width:min(640px,calc(100vw - 32px)) !important;height:fit-content;max-height:min(720px,calc(100dvh - 48px)) !important;}
#qs-back-to-form {position:absolute;bottom:72px;left:50%;width:auto;transform:translateX(-50%);z-index:5;white-space:nowrap;box-shadow:0 4px 16px #0002;}
@media(min-width:801px) {body.qs-mode .b1-right {max-height:calc(100dvh - 96px);overflow-y:auto;padding-right:0;scrollbar-width:thin;}body.qs-mode #qs-panel{min-height:0;} .qs-order-preview{display:none;} }
@media(max-width:800px) {
 body.qs-mode .wb-workspace {height:540px !important;min-height:540px !important;}
 body.qs-mode .wb-workspace-head {padding:16px;flex-wrap:wrap;}
 body.qs-mode .wb-stage {inset:160px 4px 68px !important;height:auto !important;min-height:0 !important;}
 body.qs-mode .wb-workspace-head {z-index:4;}
 .qs-canvas-caption {z-index:4;}
 body.qs-mode .wb-head-actions {margin-left:auto;}
 .qs-workspace-title h1 {font-size:20px;}
 .qs-view-switch button {font-size:14px;padding:8px 12px;}
 .qs-eyebrow {min-height:24px;margin-bottom:4px;}
 .qs-canvas-caption {left:16px;right:16px;bottom:12px;}
 .qs-canvas-caption small,.qs-face-labels {display:none;}
 .qs-canvas-caption .qs-link {font-size:13px;padding:8px 12px;}
 #qs-panel {padding:12px 4px 16px;}
 .qs-progress {margin-bottom:20px;}
 .qs-intro {margin-bottom:20px;}
 .qs-preview-jump {display:block;min-height:44px;width:100%;margin-bottom:8px;border:1px solid var(--qs-line);border-radius:8px;background:#fff;color:var(--qs-ink);font:inherit;font-size:14px;}
 .qs-actions {padding-bottom:8px;}
 .qs-order-preview {margin-bottom:20px;}
 .qs-choice-dialog {padding:20px;}
}
