@font-face {
  font-family: "QV3 Noto Sans SC";
  src: url("./fonts/NotoSansSC-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --qv3-bg: #f5f7fb;
  --qv3-panel: #ffffff;
  --qv3-panel-soft: #fafbfc;
  --qv3-line: #e6e9ef;
  --qv3-line-strong: #d7dce5;
  --qv3-text: #20242c;
  --qv3-muted: #747d8d;
  --qv3-dark: #151922;
  --qv3-dark-soft: #252e3d;
  --qv3-yellow: #ffd94d;
  --qv3-yellow-strong: #f1bd16;
  --qv3-yellow-soft: #fff7cf;
  --qv3-green: #18a970;
  --qv3-green-soft: #e9f8f1;
  --qv3-blue-soft: #eef5ff;
  --qv3-blue: #315a96;
  --qv3-red: #d94452;
  --qv3-red-soft: #fff0f1;
  --qv3-shadow: 0 12px 32px rgba(24, 39, 75, .08);
  --qv3-shadow-deep: 0 18px 44px rgba(24, 39, 75, .13);
  --qv3-radius: 16px;
  --qv3-radius-control: 10px;
  --qv3-radius-control-sm: 9px;
  --qv3-control-height: 42px;
  --qv3-control-height-sm: 34px;
  --qv3-control-padding-x: 12px;
  --qv3-control-border: var(--qv3-line-strong);
  --qv3-control-bg: #fff;
  --qv3-control-disabled-bg: #f1f3f6;
  --qv3-control-disabled-opacity: .52;
  --qv3-focus-color: rgba(49, 90, 150, .24);
  --qv3-focus-border: #8fa8ca;
  --qv3-label-size: 13px;
  --qv3-help-size: 12px;
  --qv3-control-gap: 8px;
  --qv3-grid-gap: 14px;
  --qv3-sidebar-width: 225px;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--qv3-bg); }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background: var(--qv3-bg);
  color: var(--qv3-text);
  font-family: "QV3 Noto Sans SC", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, select, textarea {
  -webkit-appearance: none;
  appearance: none;
  color: inherit;
  font: inherit;
}
button { cursor: pointer; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; }
textarea { resize: none; }
[hidden] { display: none !important; }

:where(html, .qv3-sidebar, .qv3-stepper, .qv3-combobox-menu, .qv3-preview-body) {
  scrollbar-width: thin;
  scrollbar-color: #aeb7c4 transparent;
}
:where(html, .qv3-sidebar, .qv3-stepper, .qv3-combobox-menu, .qv3-preview-body)::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
:where(html, .qv3-sidebar, .qv3-stepper, .qv3-combobox-menu, .qv3-preview-body)::-webkit-scrollbar-track {
  background: transparent;
}
:where(html, .qv3-sidebar, .qv3-stepper, .qv3-combobox-menu, .qv3-preview-body)::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: #aeb7c4;
  background-clip: padding-box;
}
:where(html, .qv3-sidebar, .qv3-stepper, .qv3-combobox-menu, .qv3-preview-body)::-webkit-scrollbar-thumb:hover {
  background-color: #8793a3;
}

.qv3-app :where(button, input, select, textarea, a[href]):focus-visible {
  outline: 3px solid var(--qv3-focus-color);
  outline-offset: 2px;
}
.qv3-app :where(button, input, select, textarea):disabled,
.qv3-app [aria-disabled="true"] {
  cursor: not-allowed;
  opacity: var(--qv3-control-disabled-opacity);
}
.qv3-app :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  width: 100%;
  min-width: 0;
  min-height: var(--qv3-control-height);
  padding: 9px var(--qv3-control-padding-x);
  border: 1px solid var(--qv3-control-border);
  border-radius: var(--qv3-radius-control);
  color: var(--qv3-text);
  background-color: var(--qv3-control-bg);
  outline: 0;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.qv3-app :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  border-color: var(--qv3-focus-border);
  box-shadow: 0 0 0 3px var(--qv3-focus-color);
}
.qv3-app :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus-visible {
  outline: 0;
}
.qv3-app :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):disabled {
  color: #7f8794;
  background-color: var(--qv3-control-disabled-bg);
}
.qv3-app :where(input, textarea)::placeholder { color: #a0a7b2; }

.qv3-combobox {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}
.qv3-native-select {
  display: none !important;
}
.qv3-combobox-trigger {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: var(--qv3-control-height);
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px var(--qv3-control-padding-x);
  border: 1px solid var(--qv3-control-border);
  border-radius: var(--qv3-radius-control);
  color: var(--qv3-text);
  background: var(--qv3-control-bg);
  line-height: 1.35;
  text-align: left;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.qv3-combobox-trigger:hover:not(:disabled) { border-color: #c5cbd5; background: #fafbfc; }
.qv3-combobox-trigger[aria-expanded="true"] { border-color: var(--qv3-focus-border); box-shadow: 0 0 0 3px var(--qv3-focus-color); }
.qv3-combobox-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qv3-combobox-arrow {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  margin: -4px 3px 0 0;
  border-right: 2px solid #77808e;
  border-bottom: 2px solid #77808e;
  transform: rotate(45deg);
  transition: transform .16s ease, margin .16s ease;
}
.qv3-combobox-trigger[aria-expanded="true"] .qv3-combobox-arrow { margin-top: 4px; transform: rotate(225deg); }
.qv3-combobox-menu {
  position: fixed;
  z-index: 300;
  max-height: 286px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--qv3-line-strong);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(24, 39, 75, .2);
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.qv3-combobox-option {
  display: flex;
  min-height: 38px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 7px;
  color: #343b47;
  font-size: 13px;
  line-height: 1.4;
  cursor: pointer;
}
.qv3-combobox-option:hover, .qv3-combobox-option.is-active { color: #111; background: var(--qv3-yellow-soft); }
.qv3-combobox-option[aria-selected="true"] { color: #fff; background: var(--qv3-dark); font-weight: 750; }
.qv3-combobox-option[aria-disabled="true"] { opacity: var(--qv3-control-disabled-opacity); cursor: not-allowed; }

.qv3-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.qv3-app { min-height: 100vh; }
.qv3-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 40;
  display: flex;
  width: var(--qv3-sidebar-width);
  flex-direction: column;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  padding: 22px 16px 18px;
  padding-bottom: max(18px, env(safe-area-inset-bottom, 0px));
  color: #fff;
  background: var(--qv3-dark);
  box-shadow: 8px 0 28px rgba(10, 14, 21, .08);
}
.qv3-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 8px 22px;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  color: inherit;
  text-decoration: none;
}
.qv3-brand-mark {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border-radius: 13px;
  color: #111;
  background: linear-gradient(145deg, #ffe778, var(--qv3-yellow-strong));
  box-shadow: 0 8px 20px rgba(244, 189, 20, .22);
  font-size: 20px;
  font-weight: 900;
}
.qv3-brand strong, .qv3-brand small { display: block; }
.qv3-brand strong { font-size: 17px; letter-spacing: -.02em; }
.qv3-brand small { margin-top: 4px; color: #aab2bf; font-size: 11px; }
.qv3-nav { display: grid; gap: 7px; margin-top: 18px; }
.qv3-nav button {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: var(--qv3-control-height);
  padding: 10px 14px;
  border: 0;
  border-radius: 10px;
  color: #c8d0db;
  background: transparent;
  text-align: left;
  transition: color .18s ease, background .18s ease, transform .18s ease;
}
.qv3-nav button span { width: 19px; color: #9ba7b7; text-align: center; }
.qv3-nav button:hover, .qv3-nav button.is-active {
  color: #fff;
  background: var(--qv3-dark-soft);
}
.qv3-nav button:hover { transform: translateX(2px); }
.qv3-nav button.is-active span { color: var(--qv3-yellow); }
.qv3-sidebar-note {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: auto;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  color: #cbd3dd;
  background: #222c3b;
}
.qv3-sidebar-note strong, .qv3-sidebar-note small { display: block; }
.qv3-sidebar-note strong { color: #fff; font-size: 12px; }
.qv3-sidebar-note small { margin-top: 4px; font-size: 11px; line-height: 1.5; }
.qv3-connection-dot {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  margin-top: 4px;
  border-radius: 50%;
  background: #aeb7c5;
  box-shadow: 0 0 0 4px rgba(174,183,197,.12);
}
.qv3-connection-dot.is-online { background: #36d895; box-shadow: 0 0 0 4px rgba(54,216,149,.13); }
.qv3-connection-dot.is-error { background: #ff6b77; box-shadow: 0 0 0 4px rgba(255,107,119,.13); }
.qv3-back-link {
  margin: 10px 8px 0;
  color: #9fa9b7;
  font-size: 12px;
  text-decoration: none;
}
.qv3-back-link:hover { color: #fff; }

.qv3-mobile-menu, .qv3-sidebar-scrim { display: none; }
.qv3-main { min-height: 100vh; margin-left: var(--qv3-sidebar-width); }
.qv3-topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 12px 28px;
  border-bottom: 1px solid var(--qv3-line);
  background: rgba(255, 255, 255, .93);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.qv3-page-heading { min-width: 0; }
.qv3-page-heading p { display: none; margin: 0; color: var(--qv3-muted); font-size: 11px; font-weight: 800; }
.qv3-page-heading h1 { margin: 0; font-size: 20px; line-height: 1.3; letter-spacing: -.025em; }
.qv3-page-heading > span { display: block; margin-top: 4px; color: var(--qv3-muted); font-size: 13px; }
.qv3-top-actions { display: flex; align-items: center; gap: 10px; }
.qv3-context-badge {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 5px 11px;
  border-radius: 999px;
  color: #6b5311;
  background: var(--qv3-yellow-soft);
  font-size: 12px;
  white-space: nowrap;
}
.qv3-content { width: min(100%, 1540px); margin: 0 auto; padding: 26px; }

.qv3-button {
  display: inline-flex;
  min-height: var(--qv3-control-height);
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 15px;
  border: 1px solid var(--qv3-control-border);
  border-radius: var(--qv3-radius-control);
  color: var(--qv3-text);
  background: var(--qv3-control-bg);
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  text-decoration: none;
  transition: border-color .17s ease, background-color .17s ease, color .17s ease, transform .17s ease, box-shadow .17s ease;
}
.qv3-button:hover:not(:disabled) { border-color: #c5cbd5; background: #fafafa; transform: translateY(-1px); }
.qv3-button-dark { border-color: var(--qv3-dark); color: #fff; background: var(--qv3-dark); }
.qv3-button-dark:hover:not(:disabled) { border-color: #2b3340; background: #2b3340; }
.qv3-button-yellow { border-color: var(--qv3-yellow); color: #211d10; background: var(--qv3-yellow); font-weight: 850; }
.qv3-button-yellow:hover:not(:disabled) { border-color: #f4c938; background: #f8ce3f; box-shadow: 0 8px 20px rgba(241,189,22,.16); }
.qv3-button-danger { border-color: #f2cbd0; color: var(--qv3-red); background: #fff; }
.qv3-button-danger:hover:not(:disabled) { border-color: #e6aeb6; color: #b9313d; background: var(--qv3-red-soft); }
.qv3-button-small { min-height: var(--qv3-control-height-sm); padding: 6px 10px; border-radius: var(--qv3-radius-control-sm); font-size: 12px; }

.qv3-error-banner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid #f3c6cc;
  border-radius: 12px;
  color: #9e2b37;
  background: var(--qv3-red-soft);
}
.qv3-error-banner strong { font-size: 14px; }
.qv3-error-banner p { margin: 5px 0 0; font-size: 13px; line-height: 1.55; }
.qv3-error-banner button { padding: 0; border: 0; color: inherit; background: transparent; font-size: 22px; line-height: 1; }

.qv3-product-toolbar { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.qv3-search { flex: 1; max-width: 470px; }
.qv3-search input {
  height: var(--qv3-control-height);
  padding: 0 15px 0 42px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23747d8d' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.4-3.4'/%3E%3C/svg%3E") 14px center / 18px no-repeat;
}
.qv3-filter-section { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 18px; margin-bottom: 18px; }
.qv3-filter-strip { display: flex; flex-wrap: wrap; gap: 8px; }
.qv3-chip {
  min-height: var(--qv3-control-height-sm);
  padding: 6px 12px;
  border: 1px solid var(--qv3-control-border);
  border-radius: 999px;
  color: #596274;
  background: var(--qv3-control-bg);
  font-size: 13px;
  line-height: 1.2;
  transition: border-color .16s ease, background-color .16s ease, color .16s ease;
}
.qv3-chip:hover { border-color: #ccd2dc; }
.qv3-chip.is-active { border-color: var(--qv3-dark); color: #fff; background: var(--qv3-dark); }
.qv3-status-filters .qv3-chip.is-active { border-color: #665316; color: #493b0d; background: var(--qv3-yellow); }

.qv3-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.qv3-product-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 16px;
  border: 1px solid var(--qv3-line);
  border-radius: var(--qv3-radius);
  background: var(--qv3-panel);
  box-shadow: var(--qv3-shadow);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.qv3-product-card:hover { border-color: #d8dde6; transform: translateY(-2px); box-shadow: var(--qv3-shadow-deep); }
.qv3-product-head { display: flex; min-width: 0; align-items: center; gap: 14px; }
.qv3-product-thumb {
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(145deg, #e8f7ff, #d6ecff);
}
.qv3-product-thumb { width: 72px; height: 72px; flex: 0 0 72px; border-radius: 14px; font-size: 30px; }
.qv3-product-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.qv3-product-copy { min-width: 0; }
.qv3-product-copy h2 { margin: 0; overflow: hidden; font-size: 17px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.qv3-product-copy p { margin: 5px 0 0; color: var(--qv3-muted); font-size: 12px; line-height: 1.55; }
.qv3-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 7px;
  padding: 4px 8px;
  border-radius: 999px;
  color: #107650;
  background: var(--qv3-green-soft);
  font-size: 12px;
}
.qv3-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.qv3-status.is-draft { color: #667085; background: #f1f3f5; }
.qv3-status.is-disabled { color: #a44049; background: #fff0f1; }
.qv3-product-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: auto; padding-top: 14px; }
.qv3-product-actions .qv3-button { min-width: 0; padding-inline: 8px; }
.qv3-product-manage-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; margin-top: 8px; padding-top: 8px; border-top: 1px solid #edf0f4; }
.qv3-product-manage-actions .qv3-button { min-width: 0; }
.qv3-product-manage-note { color: var(--qv3-muted); font-size: 11px; line-height: 1.4; }

.qv3-empty, .qv3-loading-card {
  min-height: 170px;
  border: 1px dashed var(--qv3-line-strong);
  border-radius: 15px;
  background: rgba(255,255,255,.7);
}
.qv3-empty {
  display: grid;
  grid-column: 1 / -1;
  place-items: center;
  padding: 30px;
  color: var(--qv3-muted);
  text-align: center;
}
.qv3-empty strong { display: block; color: var(--qv3-text); }
.qv3-empty span { display: block; margin-top: 6px; font-size: 13px; }
.qv3-loading-card { position: relative; overflow: hidden; }
.qv3-loading-card::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.85), transparent);
  animation: qv3-shimmer 1.25s infinite;
}
@keyframes qv3-shimmer { to { transform: translateX(100%); } }

.qv3-stepper {
  display: flex;
  align-items: center;
  overflow-x: auto;
  margin-bottom: 16px;
  padding: 15px 18px;
  border: 1px solid var(--qv3-line);
  border-radius: 15px;
  background: #fff;
  box-shadow: var(--qv3-shadow);
  scrollbar-width: thin;
}
.qv3-step {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  color: #8b94a3;
  background: transparent;
  font-size: 13px;
  white-space: nowrap;
}
.qv3-step-number {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  background: #eef0f4;
  font-weight: 800;
}
.qv3-step.is-active { color: #111; font-weight: 850; }
.qv3-step.is-active .qv3-step-number { color: #111; background: var(--qv3-yellow); }
.qv3-step.is-done .qv3-step-number { color: #fff; background: var(--qv3-green); }
.qv3-step-line { width: 32px; height: 1px; flex: 0 0 32px; margin: 0 8px; background: #d6dbe4; }

.qv3-editor-layout, .qv3-runtime-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; }
.qv3-editor-column { min-width: 0; }
.qv3-card {
  padding: 22px;
  border: 1px solid var(--qv3-line);
  border-radius: var(--qv3-radius);
  background: var(--qv3-panel);
  box-shadow: var(--qv3-shadow);
}
.qv3-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--qv3-grid-gap); margin-bottom: 18px; }
.qv3-section-head h2 { margin: 0; font-size: 20px; letter-spacing: -.025em; }
.qv3-eyebrow { margin: 0 0 5px; color: var(--qv3-muted); font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.qv3-section-head div > span { display: block; margin-top: 6px; color: var(--qv3-muted); font-size: 13px; line-height: 1.6; }
.qv3-step-badge { padding: 6px 10px; border-radius: 999px; color: #665316; background: var(--qv3-yellow-soft); font-size: 12px; white-space: nowrap; }

.qv3-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--qv3-grid-gap); }
.qv3-field { display: grid; min-width: 0; align-content: start; gap: var(--qv3-control-gap); }
.qv3-span-full { grid-column: 1 / -1; }
.qv3-field > span, .qv3-field > label { color: #303640; font-size: var(--qv3-label-size); font-weight: 800; line-height: 1.35; }
.qv3-field small {
  color: var(--qv3-muted);
  font-size: var(--qv3-help-size);
  font-weight: 500;
  line-height: 1.55;
}
.qv3-field textarea { min-height: 96px; }
.qv3-range-group { display: grid; min-width: 0; gap: 12px; padding: 14px; border: 1px solid var(--qv3-line); border-radius: 12px; background: var(--qv3-panel-soft); }
.qv3-range-head { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 12px; }
.qv3-range-head strong { font-size: 14px; }
.qv3-range-head span { color: var(--qv3-muted); font-size: var(--qv3-help-size); }
.qv3-range-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--qv3-grid-gap); }
.qv3-check {
  position: relative;
  display: inline-flex;
  min-height: var(--qv3-control-height);
  align-items: center;
  gap: 8px;
  color: #48515f;
  font-size: var(--qv3-label-size);
  font-weight: 700;
  line-height: 1.35;
}
.qv3-check input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.qv3-check-mark {
  display: grid;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  place-items: center;
  border: 1px solid #b9c0cb;
  border-radius: 5px;
  background: #fff;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.qv3-check input:checked + .qv3-check-mark { border-color: var(--qv3-dark); background: var(--qv3-dark); }
.qv3-check input:checked + .qv3-check-mark::after { content: ""; width: 8px; height: 4px; margin-top: -2px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); }
.qv3-check input:focus-visible + .qv3-check-mark { border-color: var(--qv3-focus-border); box-shadow: 0 0 0 3px var(--qv3-focus-color); }
.qv3-inline-note {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  color: var(--qv3-muted);
  font-size: var(--qv3-help-size);
  line-height: 1.55;
}
.qv3-inline-note::before { content: "i"; display: grid; width: 17px; height: 17px; flex: 0 0 17px; place-items: center; border-radius: 50%; color: #fff; background: #8593a6; font-size: 10px; font-weight: 800; }
.qv3-inline-note > div { display: flex; min-width: 0; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.qv3-inline-note strong { color: var(--qv3-text); }
.qv3-inline-note code { overflow-wrap: anywhere; color: #42506a; }
.qv3-inline-note small { flex-basis: 100%; color: var(--qv3-muted); }

.qv3-notice { margin-bottom: 14px; padding: 13px 14px; border-radius: 12px; font-size: 13px; line-height: 1.65; }
.qv3-notice-info { color: var(--qv3-blue); background: var(--qv3-blue-soft); }
.qv3-notice-warn { border: 1px solid #ffe891; color: #70591a; background: var(--qv3-yellow-soft); }
.qv3-notice-separated { margin-top: 14px; }

.qv3-template-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 6px; }
.qv3-template-field { margin-top: 0; }
.qv3-template {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 12px;
  padding: 13px;
  border: 1px solid var(--qv3-control-border);
  border-radius: 12px;
  color: inherit;
  background: var(--qv3-control-bg);
  line-height: 1.35;
  text-align: left;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.qv3-template:hover { border-color: #cbd1db; background: #fdfdfd; }
.qv3-template.is-selected { border-color: var(--qv3-dark); box-shadow: 0 0 0 2px rgba(17,24,39,.06); }
.qv3-template-icon { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; margin: 0; border-radius: 10px; color: var(--qv3-text); background: #f0f2f5; font-size: 19px; }
.qv3-template > span:not(.qv3-template-icon) { display: grid; min-width: 0; gap: 4px; }
.qv3-template strong { display: block; color: var(--qv3-text); font-size: 13px; }
.qv3-template > span:not(.qv3-template-icon) > span { display: block; margin: 0; color: var(--qv3-muted); font-size: var(--qv3-help-size); }

.qv3-dimension-config {
  display: grid;
  min-width: 0;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--qv3-line);
  border-radius: 14px;
  background: #fff;
}
.qv3-dimension-config-head strong, .qv3-dimension-config-head small { display: block; }
.qv3-dimension-config-head strong { font-size: 15px; }
.qv3-dimension-config-head small { margin-top: 4px; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.55; }
.qv3-dimension-config-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 12px; }
.qv3-dimension-config-block { display: grid; min-width: 0; align-content: start; gap: 9px; padding: 13px; border: 1px solid var(--qv3-line); border-radius: 12px; background: var(--qv3-panel-soft); }
.qv3-dimension-config-label { color: var(--qv3-muted); font-size: 11px; font-weight: 850; letter-spacing: .02em; }
.qv3-dimension-structure { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.qv3-dimension-structure-choice {
  display: grid;
  min-width: 0;
  min-height: 66px;
  align-content: center;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--qv3-control-border);
  border-radius: 10px;
  color: var(--qv3-text);
  background: #fff;
  text-align: left;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.qv3-dimension-structure-choice:hover { border-color: #bfc7d3; }
.qv3-dimension-structure-choice.is-selected { border-color: var(--qv3-dark); background: #fffdf5; box-shadow: inset 0 0 0 1px var(--qv3-dark); }
.qv3-dimension-structure-choice strong { font-size: 12px; line-height: 1.35; }
.qv3-dimension-structure-choice small { color: var(--qv3-muted); font-size: 10px; line-height: 1.4; }
.qv3-capability-toggle { display: flex; min-width: 0; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--qv3-line); border-radius: 11px; background: #fff; }
.qv3-capability-toggle + .qv3-capability-toggle { margin-top: 7px; }
.qv3-capability-toggle.is-active { border-color: #d4c174; background: #fffdf3; }
.qv3-capability-toggle.is-disabled { opacity: .72; }
.qv3-capability-toggle > div { min-width: 0; flex: 1 1 auto; }
.qv3-capability-toggle strong, .qv3-capability-toggle small { display: block; }
.qv3-capability-toggle strong { font-size: 13px; line-height: 1.35; }
.qv3-capability-toggle small { margin-top: 3px; color: var(--qv3-muted); font-size: 10px; line-height: 1.45; }
.qv3-capability-meta { flex: 0 0 auto; padding: 4px 7px; border-radius: 999px; color: #68551d; background: var(--qv3-yellow-soft); font-size: 10px; white-space: nowrap; }
.qv3-capability-switch {
  position: relative;
  width: 44px;
  height: 26px;
  flex: 0 0 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #c8ced7;
  box-shadow: inset 0 0 0 1px rgba(31,41,55,.08);
  transition: background-color .16s ease, box-shadow .16s ease;
}
.qv3-capability-switch > span { position: absolute; top: 4px; left: 4px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(17,24,39,.25); transition: transform .16s ease; }
.qv3-capability-toggle.is-active .qv3-capability-switch { background: var(--qv3-dark); }
.qv3-capability-toggle.is-active .qv3-capability-switch > span { transform: translateX(18px); }
.qv3-capability-switch:focus-visible { outline: 3px solid var(--qv3-focus-color); outline-offset: 2px; }
.qv3-capability-switch:disabled { cursor: not-allowed; }
.qv3-dimension-derived { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 5px 10px; padding: 10px 12px; border-radius: 10px; color: #315e8f; background: var(--qv3-blue-soft); }
.qv3-dimension-derived span { font-size: 10px; font-weight: 850; }
.qv3-dimension-derived strong { font-size: 12px; }
.qv3-dimension-derived small { margin-left: auto; color: #607a97; font-size: 10px; }
.qv3-dimension-check { display: grid; gap: 7px; }
.qv3-dimension-check-item { display: flex; min-width: 0; align-items: flex-start; gap: 10px; padding: 11px 12px; border-radius: 10px; font-size: 12px; line-height: 1.5; }
.qv3-dimension-check-item strong { flex: 0 0 auto; }
.qv3-dimension-check-item span { min-width: 0; overflow-wrap: anywhere; }
.qv3-dimension-check-item.is-error { border: 1px solid #ffc5c9; color: #a72f39; background: #fff2f3; }
.qv3-dimension-check-item.is-warning { border: 1px solid #ffe08a; color: #70591a; background: var(--qv3-yellow-soft); }
.qv3-disabled-config-note { padding: 12px 14px; border: 1px dashed #cfd5df; border-radius: 11px; color: var(--qv3-muted); background: #fafbfc; }
.qv3-disabled-config-note strong, .qv3-disabled-config-note small { display: block; }
.qv3-disabled-config-note strong { color: var(--qv3-text); font-size: 13px; }
.qv3-disabled-config-note small { margin-top: 4px; font-size: var(--qv3-help-size); line-height: 1.5; }
.qv3-dimension-matrix-status { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 14px; border: 1px solid #f0d766; border-radius: 12px; background: #fffbea; }
.qv3-dimension-matrix-status > div { min-width: 0; }
.qv3-dimension-matrix-status span, .qv3-dimension-matrix-status strong, .qv3-dimension-matrix-status small { display: block; }
.qv3-dimension-matrix-status span { color: #8b6d12; font-size: 10px; font-weight: 850; }
.qv3-dimension-matrix-status strong { margin-top: 2px; font-size: 13px; }
.qv3-dimension-matrix-status small { margin-top: 3px; color: var(--qv3-muted); font-size: 10px; }
.qv3-standard-sizes, .qv3-price-matrix {
  display: grid;
  min-width: 0;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--qv3-line);
  border-radius: 13px;
  background: var(--qv3-panel-soft);
}
.qv3-standard-sizes-head {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.qv3-standard-sizes-head > div { min-width: 0; }
.qv3-standard-sizes-head strong, .qv3-standard-sizes-head small { display: block; }
.qv3-standard-sizes-head strong { font-size: 14px; }
.qv3-standard-sizes-head small { margin-top: 4px; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.5; }
.qv3-standard-sizes-head > .qv3-button { flex: 0 0 auto; }
.qv3-standard-size-list, .qv3-matrix-list { display: grid; gap: 10px; }
.qv3-standard-size-row, .qv3-matrix-row {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--qv3-line);
  border-radius: 11px;
  background: #fff;
}
.qv3-standard-size-main {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(135px, 1.25fr) repeat(2, minmax(76px, .62fr)) minmax(90px, .7fr) minmax(150px, 1.1fr) 64px auto;
  gap: 9px;
  align-items: end;
}
.qv3-standard-size-main .qv3-field { gap: 5px; }
.qv3-standard-size-main .qv3-field > span { color: var(--qv3-muted); font-size: 11px; }
.qv3-standard-size-main :where(input, .qv3-combobox-trigger) { padding-inline: 8px; }
.qv3-standard-size-actions {
  display: flex;
  min-height: var(--qv3-control-height);
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  color: var(--qv3-muted);
  font-size: 11px;
  white-space: nowrap;
}
.qv3-price-matrix { margin-top: 16px; background: #fffdf4; }
.qv3-price-matrix-discovery { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; }
.qv3-price-matrix-discovery-icon { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 12px; color: #6e5710; background: #fff1a8; font-size: 22px; }
.qv3-price-matrix-discovery p { margin: 5px 0 3px; color: var(--qv3-muted); font-size: 12px; line-height: 1.55; }
.qv3-price-matrix-discovery small { color: #897330; font-size: 10px; line-height: 1.45; }
.qv3-matrix-readiness { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 10px; padding: 10px 11px; border-radius: 10px; background: rgba(255,255,255,.75); font-size: 11px; line-height: 1.45; }
.qv3-matrix-readiness > span { padding: 5px 8px; border-radius: 8px; }
.qv3-matrix-readiness .is-ready { color: #17744d; background: #e9f8f1; }
.qv3-matrix-readiness .is-missing { color: #9b3c45; background: #fff0f1; }
.qv3-matrix-readiness .qv3-inline-actions { margin-left: auto; }
.qv3-matrix-policy-grid { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)); gap: 10px; }
.qv3-matrix-axes { display: grid; gap: 9px; padding: 12px; border: 1px solid var(--qv3-line); border-radius: 11px; background: rgba(255,255,255,.72); }
.qv3-matrix-axes-head { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 12px; }
.qv3-matrix-axes-head small { color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.45; }
.qv3-matrix-axis-row { display: grid; grid-template-columns: 28px minmax(150px, 1fr) auto; gap: 8px; align-items: center; }
.qv3-matrix-axis-order { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 8px; color: #6e5710; background: #fff1a8; font-size: 11px; font-weight: 850; }
.qv3-matrix-axis-add { max-width: 440px; }
.qv3-matrix-axis-help { display: block; margin-top: -3px; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.55; }
.qv3-matrix-enabled-label { color: var(--qv3-muted); font-size: 11px; white-space: nowrap; }
.qv3-matrix-row-grid { display: grid; min-width: 0; grid-template-columns: repeat(auto-fit, minmax(105px, 1fr)); gap: 9px; align-items: end; }
.qv3-matrix-cell { display: grid; min-width: 0; gap: 5px; }
.qv3-matrix-cell > span { color: var(--qv3-muted); font-size: 11px; font-weight: 800; line-height: 1.35; }
.qv3-matrix-cell :where(input, .qv3-combobox-trigger) { padding-inline: 8px; }
.qv3-matrix-remove { display: flex; min-height: var(--qv3-control-height); align-items: center; justify-content: flex-end; }

.qv3-editor-stack { display: grid; gap: var(--qv3-grid-gap); }
.qv3-config-order { display: grid; gap: 10px; margin-bottom: var(--qv3-grid-gap); padding: 14px; border: 1px solid var(--qv3-line); border-radius: 12px; background: var(--qv3-panel-soft); }
.qv3-config-order-head strong, .qv3-config-order-head small { display: block; }
.qv3-config-order-head strong { font-size: 14px; }
.qv3-config-order-head small { margin-top: 4px; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.45; }
.qv3-config-order-list { display: grid; gap: 7px; }
.qv3-config-order-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 50px; padding: 8px 10px; border: 1px solid var(--qv3-line); border-radius: 10px; background: #fff; }
.qv3-config-order-index { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 8px; color: #6e5710; background: #fff1a8; font-size: 11px; font-weight: 850; }
.qv3-config-order-copy { min-width: 0; }
.qv3-config-order-copy strong, .qv3-config-order-copy small { display: block; overflow-wrap: anywhere; }
.qv3-config-order-copy strong { font-size: 13px; }
.qv3-config-order-copy small { margin-top: 3px; color: var(--qv3-muted); font-size: var(--qv3-help-size); }
.qv3-group, .qv3-rule, .qv3-charge-group {
  overflow: hidden;
  border: 1px solid var(--qv3-line);
  border-radius: 12px;
  background: #fff;
}
.qv3-group-head, .qv3-rule-head, .qv3-charge-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--qv3-grid-gap);
  min-height: 66px;
  padding: 12px 16px;
}
.qv3-group-title, .qv3-rule-head > div:first-child, .qv3-charge-head > div:first-child { min-width: 0; }
.qv3-group-title { display: flex; align-items: center; gap: 10px; }
.qv3-drag-handle { color: #aab1bd; cursor: grab; user-select: none; }
.qv3-group-head strong, .qv3-rule-head strong, .qv3-charge-head strong { display: block; overflow-wrap: anywhere; font-size: 14px; line-height: 1.35; }
.qv3-group-head small, .qv3-rule-head small, .qv3-charge-head small { display: block; margin-top: 4px; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.45; }
.qv3-group-actions, .qv3-inline-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.qv3-group-head > .qv3-group-actions, .qv3-rule-head > .qv3-inline-actions { flex: 0 0 auto; justify-content: flex-end; }
.qv3-group-body, .qv3-rule-body, .qv3-charge-body { padding: 16px; border-top: 1px solid var(--qv3-line); background: var(--qv3-panel-soft); }
.qv3-group-settings {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(110px, .7fr) minmax(130px, .8fr) 72px auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 16px;
}
.qv3-group-settings > .qv3-check { justify-self: start; white-space: nowrap; }
.qv3-group-parent-settings { display: grid; grid-template-columns: repeat(2, minmax(150px, 1fr)); gap: 10px; margin: -6px 0 16px; padding: 12px; border: 1px dashed #cbd3de; border-radius: 10px; background: #fff; }
.qv3-option-table { overflow: hidden; margin-bottom: 12px; border: 1px solid var(--qv3-line); border-radius: 11px; background: #fff; }
.qv3-option-columns, .qv3-option-row {
  grid-template-columns: minmax(120px, 1fr) minmax(110px, .72fr) 62px minmax(260px, 1.15fr);
  column-gap: 8px;
}
.qv3-option-columns {
  display: grid;
  align-items: center;
  padding: 9px 12px;
  border-bottom: 1px solid var(--qv3-line);
  color: var(--qv3-muted);
  background: #f3f5f8;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
}
.qv3-option-columns span:nth-child(4) { text-align: center; }
.qv3-option-list { display: grid; }
.qv3-option-row {
  display: grid;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid var(--qv3-line);
}
.qv3-option-row:last-child { border-bottom: 0; }
.qv3-option-row > .qv3-inline-actions {
  display: grid;
  grid-column: 4;
  grid-template-columns: 44px minmax(76px, 1fr) 36px 36px 54px;
  gap: 8px;
  align-items: center;
}
.qv3-option-row > .qv3-inline-actions > .qv3-switch { justify-self: center; }
.qv3-option-row > .qv3-inline-actions > .qv3-button { width: 100%; padding-inline: 5px; white-space: nowrap; }
.qv3-option-image-field { display: block; padding-top: 2px; }

.qv3-image-uploader {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
  gap: var(--qv3-grid-gap);
  min-width: 0;
  align-items: stretch;
}
.qv3-image-dropzone {
  position: relative;
  display: grid;
  min-height: 150px;
  place-items: center;
  overflow: hidden;
  padding: 16px;
  border: 1px dashed #b9c3d0;
  border-radius: 12px;
  color: #667285;
  background: #f8fafc;
  text-align: center;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.qv3-image-dropzone:hover, .qv3-image-dropzone:focus-visible,
.qv3-image-uploader.is-dragging .qv3-image-dropzone {
  border-color: var(--qv3-focus-border);
  background: var(--qv3-blue-soft);
  box-shadow: 0 0 0 3px var(--qv3-focus-color);
}
.qv3-image-uploader.is-uploading { pointer-events: none; opacity: .58; }
.qv3-image-preview {
  display: grid;
  width: 100%;
  min-height: 126px;
  place-items: center;
  overflow: hidden;
  border-radius: 9px;
  color: #8b94a2;
  background: #eef1f5;
}
.qv3-image-preview img { width: 100%; height: 100%; max-height: 230px; object-fit: contain; }
.qv3-image-copy { display: grid; min-width: 0; align-content: center; gap: 6px; }
.qv3-image-copy strong { color: var(--qv3-text); font-size: 14px; line-height: 1.4; }
.qv3-image-copy p, .qv3-image-copy small { margin: 0; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.6; }
.qv3-upload-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 6px; }
.qv3-product-images-editor { display: grid; min-width: 0; gap: 14px; }
.qv3-product-image-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.qv3-product-image-item {
  position: relative;
  display: grid;
  min-width: 0;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--qv3-line);
  border-radius: 12px;
  background: #fff;
}
.qv3-product-image-item img { width: 100%; aspect-ratio: 4 / 3; border-radius: 8px; background: #f3f5f7; object-fit: contain; }
.qv3-product-image-badge { position: absolute; top: 16px; left: 16px; padding: 4px 7px; border-radius: 999px; color: #3c3008; background: var(--qv3-yellow); font-size: 10px; font-weight: 800; }
.qv3-product-image-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.qv3-product-image-actions .qv3-button { flex: 1 1 auto; }
.qv3-gallery-settings { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 10px; background: #f5f7f9; }
.qv3-gallery-settings strong { color: #46505e; font-size: 12px; }
.qv3-gallery-settings input { width: 92px; text-align: center; }
.qv3-gallery-settings span { color: var(--qv3-muted); font-size: var(--qv3-help-size); }
.qv3-product-gallery-uploader { grid-template-columns: minmax(0, 1fr) auto; }
.qv3-product-gallery-uploader .qv3-image-dropzone { min-height: 128px; }
.qv3-product-gallery-uploader > .qv3-upload-actions { align-self: center; margin-top: 0; }

.qv3-switch {
  position: relative;
  display: inline-flex;
  width: 44px;
  height: 24px;
  flex: 0 0 44px;
}
.qv3-switch input { position: absolute; opacity: 0; }
.qv3-switch span { width: 100%; border-radius: 999px; background: #c8ced7; transition: background .18s ease; }
.qv3-switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.2); transition: transform .18s ease; }
.qv3-switch input:checked + span { background: var(--qv3-dark); }
.qv3-switch input:checked + span::after { transform: translateX(20px); }
.qv3-switch input:focus-visible + span { box-shadow: 0 0 0 3px var(--qv3-focus-color); }

.qv3-rule-body > .qv3-field { margin-bottom: 16px; }
.qv3-rule-grid { display: grid; grid-template-columns: minmax(0, 1fr) 140px minmax(0, 1fr); gap: 12px; align-items: center; }
.qv3-rule-whole-group {
  display: flex;
  min-height: var(--qv3-control-height);
  align-items: center;
  padding: 9px var(--qv3-control-padding-x);
  border: 1px solid var(--qv3-line);
  border-radius: var(--qv3-radius-control);
  color: #5e6877;
  background: #f5f7f9;
  font-size: 13px;
  font-weight: 700;
}
.qv3-rule-label { display: block; margin: 0 0 8px; color: #37404b; font-size: 13px; font-weight: 800; }
.qv3-rule-arrow { display: flex; align-items: center; gap: 8px; margin: 16px 0 10px; color: var(--qv3-muted); font-size: 12px; font-weight: 800; }
.qv3-rule-arrow::before { content: "↓"; display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; color: #111; background: var(--qv3-yellow); }
.qv3-rule-grid + .qv3-field { margin-top: 16px; margin-bottom: 0; }

.qv3-charge-line {
  display: grid;
  grid-template-columns: minmax(130px, 1.25fr) minmax(112px, 1fr) minmax(92px, .75fr) minmax(64px, auto) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px dashed var(--qv3-line);
}
.qv3-charge-line:last-child { border-bottom: 0; }
.qv3-charge-unit {
  display: flex;
  min-height: var(--qv3-control-height);
  align-items: center;
  gap: 0;
  color: var(--qv3-muted);
  font-size: var(--qv3-help-size);
  line-height: 1.4;
}
.qv3-charge-line > .qv3-button { justify-self: end; }
.qv3-advanced-panel { margin-top: 14px; padding: 15px; border: 1px solid var(--qv3-line); border-radius: 12px; background: #f7f9fb; }
.qv3-advanced-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--qv3-grid-gap); }
.qv3-advanced-grid > .qv3-inline-note { grid-column: 1 / -1; padding: 10px 12px; border: 1px solid var(--qv3-line); border-radius: var(--qv3-radius-control-sm); background: #fff; }

.qv3-tier-list { display: grid; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--qv3-line); }
.qv3-tier-head { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 0 2px 4px; }
.qv3-tier-head > div { min-width: 0; }
.qv3-tier-head strong, .qv3-tier-head small { display: block; }
.qv3-tier-head strong { font-size: var(--qv3-label-size); line-height: 1.4; }
.qv3-tier-head small { margin-top: 3px; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.5; }
.qv3-tier-head > .qv3-button { flex: 0 0 auto; }
.qv3-tier-row {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--qv3-line);
  border-radius: 11px;
  background: #fff;
}
.qv3-tier-primary, .qv3-tier-values { display: grid; min-width: 0; gap: 8px; align-items: end; }
.qv3-tier-primary { grid-template-columns: 72px repeat(3, minmax(0, 1fr)); }
.qv3-tier-values { grid-template-columns: repeat(3, minmax(0, 1fr)) 64px 56px; }
.qv3-tier-cell { display: grid; min-width: 0; align-content: end; gap: 5px; }
.qv3-tier-cell > span { color: var(--qv3-muted); font-size: 11px; font-weight: 800; line-height: 1.35; }
.qv3-tier-cell :where(input, select, .qv3-combobox-trigger) { padding-inline: 8px; }
.qv3-tier-cell .qv3-combobox-value { font-size: 11px; }
.qv3-tier-cell-remove .qv3-button { width: 100%; min-height: var(--qv3-control-height); padding-inline: 5px; }

.qv3-small-size-rule {
  overflow: hidden;
  margin-top: 16px;
  border: 1px solid var(--qv3-line);
  border-radius: 12px;
  background: var(--qv3-panel);
}
.qv3-small-size-rule-head {
  display: flex;
  min-width: 0;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 14px;
  background: var(--qv3-yellow-soft);
}
.qv3-small-size-rule-head > div:first-child { min-width: 0; }
.qv3-small-size-rule-head strong, .qv3-small-size-rule-head small { display: block; }
.qv3-small-size-rule-head strong { color: var(--qv3-text); font-size: var(--qv3-label-size); line-height: 1.4; }
.qv3-small-size-rule-head small { margin-top: 3px; color: var(--qv3-muted); font-size: var(--qv3-help-size); line-height: 1.5; }
.qv3-small-size-rule-head > .qv3-button, .qv3-small-size-rule-head > .qv3-inline-actions { flex: 0 0 auto; }
.qv3-small-size-rule-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--qv3-grid-gap);
  align-items: start;
  padding: 14px;
  border-top: 1px solid var(--qv3-line);
  background: var(--qv3-panel-soft);
}
.qv3-small-size-formula {
  display: grid;
  grid-column: 1 / -1;
  min-width: 0;
  min-height: var(--qv3-control-height);
  align-items: start;
  gap: 5px;
  padding: 9px 12px;
  border: 1px solid var(--qv3-line);
  border-radius: var(--qv3-radius-control);
  color: var(--qv3-blue);
  background: var(--qv3-blue-soft);
  font-size: var(--qv3-help-size);
  line-height: 1.55;
}
.qv3-small-size-formula strong { color: var(--qv3-text); font-size: var(--qv3-label-size); }
.qv3-small-size-formula code { display: block; overflow-wrap: anywhere; color: inherit; font: inherit; font-weight: 700; }

.qv3-editor-footer {
  position: relative;
  bottom: auto;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  padding: 12px;
  border: 1px solid var(--qv3-line);
  border-radius: 13px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 10px 30px rgba(24,39,75,.12);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.qv3-editor-footer > div { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.qv3-save-state { align-self: center; color: var(--qv3-muted); font-size: 12px; }
.qv3-save-state.is-dirty { color: #806314; }
.qv3-save-state.is-saved { color: var(--qv3-green); }
.qv3-save-state.is-invalid { color: var(--qv3-red); font-weight: 700; }

.qv3-preview {
  position: sticky;
  top: 94px;
  align-self: start;
  overflow: hidden;
  border: 1px solid var(--qv3-line);
  border-radius: var(--qv3-radius);
  background: #fff;
  box-shadow: var(--qv3-shadow);
}
.qv3-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--qv3-line); background: linear-gradient(180deg, #fff8cb, #fff); }
.qv3-preview-head strong { font-size: 14px; }
.qv3-preview-head span { padding: 5px 8px; border-radius: 999px; color: #665316; background: var(--qv3-yellow-soft); font-size: 11px; }
.qv3-preview-body { max-height: calc(100vh - 146px); overflow: auto; padding: 15px; }
.qv3-preview-dirty { margin-bottom: 10px; padding: 9px 10px; border-radius: 9px; color: #725c1f; background: var(--qv3-yellow-soft); font-size: 11px; line-height: 1.5; }

.qv3-runtime-shell { min-width: 0; }
.qv3-runtime-product-field { margin-bottom: 12px; }
.qv3-runtime-form { display: grid; gap: 10px; }
.qv3-runtime-row { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; align-items: start; }
.qv3-runtime-row > strong { display: flex; height: var(--qv3-control-height-sm); min-height: var(--qv3-control-height-sm); align-items: center; justify-content: center; padding: 6px 8px; border-radius: var(--qv3-radius-control-sm); color: #4f5865; background: #f3f4f6; font-size: var(--qv3-help-size); line-height: 1.2; text-align: center; }
.qv3-runtime-controls { display: flex; min-width: 0; flex-wrap: wrap; align-items: center; gap: 7px; }
.qv3-runtime-controls > input[type="number"] { width: 110px; height: var(--qv3-control-height-sm); min-height: var(--qv3-control-height-sm); flex: 0 0 110px; padding-block: 6px; border-radius: var(--qv3-radius-control-sm); text-align: center; }
.qv3-runtime-size-fields { display: grid; width: min(240px, 100%); min-width: 0; grid-template-columns: minmax(0, 1fr) 16px minmax(0, 1fr); gap: 8px; align-items: center; }
.qv3-runtime-size-fields > input[type="number"] { width: 100%; height: var(--qv3-control-height-sm); min-width: 0; min-height: var(--qv3-control-height-sm); padding-block: 6px; border-radius: var(--qv3-radius-control-sm); font-size: 16px; text-align: center; }
.qv3-runtime-size-fields > .qv3-runtime-fixed-side[readonly] { border-color: #dfe3e9; color: #8a94a3; background: #f4f5f7; cursor: default; }
.qv3-runtime-size-fields > .qv3-runtime-fixed-side[readonly]::placeholder { color: #a7afbb; opacity: 1; }
.qv3-runtime-size-multiply { color: #7b8492; font-size: 16px; font-weight: 800; line-height: 1; text-align: center; }
.qv3-runtime-range-hint { color: var(--qv3-muted); font-size: 11px; font-weight: 500; line-height: 1.4; }
.qv3-runtime-size-fields > .qv3-runtime-range-hint { grid-column: 1 / -1; }
.qv3-runtime-size-choice {
  display: grid;
  width: min(390px, 100%);
  min-width: 0;
  grid-template-columns: minmax(0, 240px) auto;
  gap: 7px 8px;
  align-items: center;
}
.qv3-runtime-size-choice > .qv3-combobox { width: 100%; }
.qv3-runtime-size-choice .qv3-combobox-trigger { min-height: var(--qv3-control-height-sm); padding-block: 6px; border-radius: var(--qv3-radius-control-sm); font-size: 16px; }
.qv3-runtime-size-choice > .qv3-runtime-size-fields { grid-column: 1; }
.qv3-runtime-size-choice > .qv3-runtime-controls { grid-column: 1; }
.qv3-runtime-size-toggle {
  min-height: var(--qv3-control-height-sm);
  padding: 6px 10px;
  border: 1px solid var(--qv3-control-border);
  border-radius: var(--qv3-radius-control-sm);
  color: #404855;
  background: #fff;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.2;
  white-space: nowrap;
}
.qv3-runtime-size-toggle:hover { border-color: var(--qv3-dark); color: var(--qv3-dark); background: var(--qv3-yellow-soft); }
.qv3-runtime-size-choice > .qv3-runtime-range-hint { grid-column: 1 / -1; }
.qv3-runtime-size-policy-note {
  margin-left: 106px;
  padding: 8px 10px;
  border-radius: 8px;
  color: #745c19;
  background: var(--qv3-yellow-soft);
  font-size: 11px;
  line-height: 1.5;
}
.qv3-runtime-option {
  display: inline-flex;
  min-height: var(--qv3-control-height-sm);
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid var(--qv3-control-border);
  border-radius: var(--qv3-radius-control-sm);
  color: #404855;
  background: #f7f8f9;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.2;
  transition: border-color .16s ease, background-color .16s ease, color .16s ease;
}
.qv3-runtime-option.is-selected { border-color: #272727; color: #fff; background: #272727; }
.qv3-runtime-option.is-disabled { opacity: var(--qv3-control-disabled-opacity); cursor: not-allowed; }
.qv3-app select[aria-invalid="true"] + .qv3-combobox-trigger,
.qv3-app .qv3-combobox-trigger[aria-invalid="true"] { border-color: var(--qv3-red); background: var(--qv3-red-soft); }
.qv3-runtime-option-wrap { position: relative; display: inline-flex; vertical-align: middle; }
.qv3-runtime-option-wrap > .qv3-runtime-option,
.qv3-runtime-option-wrap > .qv3-runtime-option-reason-anchor .qv3-runtime-option { padding-right: 29px; }
.qv3-option-image-trigger {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 5px;
  display: grid;
  width: 17px;
  height: 17px;
  place-items: center;
  margin: 0;
  transform: translateY(-50%);
  padding: 0;
  border: 1px solid #9aa4b1;
  border-radius: 50%;
  color: #7c8795;
  background: transparent;
  box-shadow: none;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  opacity: 1;
  transition: border-color .16s ease, color .16s ease;
}
.qv3-option-image-trigger:hover,
.qv3-option-image-trigger:focus-visible {
  border-color: #697585;
  color: #596575;
  background: transparent;
}
.qv3-option-image-flyout {
  position: fixed;
  z-index: 9999;
  width: min(220px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--qv3-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(23,31,45,.22);
  color: var(--qv3-text);
  pointer-events: auto;
}
.qv3-option-image-flyout > button,
.qv3-option-image-flyout-frame {
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 9px;
  background: #eef2f6;
}
.qv3-option-image-flyout img { display: block; width: 100%; aspect-ratio: 4 / 3; background: #eef2f6; object-fit: contain; }
.qv3-option-image-flyout small,
.qv3-option-image-flyout-copy { display: block; padding: 7px 2px 1px; color: var(--qv3-muted); font-size: 10px; line-height: 1.45; text-align: center; }
.qv3-option-image-flyout > button:focus-visible,
.qv3-option-image-flyout-frame:focus-visible { outline: 3px solid var(--qv3-focus-color); outline-offset: 2px; }
.qv3-runtime-group.is-disabled > strong { opacity: .58; }
.qv3-runtime-group.is-child { padding-left: min(calc(var(--qv3-group-depth, 1) * 14px), 42px); }
.qv3-runtime-group-select-wrap { position: relative; display: inline-flex; width: min(280px, 100%); min-width: 0; align-items: center; }
.qv3-runtime-group-select-wrap > .qv3-combobox { width: 100%; }
.qv3-runtime-group-select-wrap .qv3-combobox-trigger { min-height: var(--qv3-control-height-sm); padding-block: 6px; border-radius: var(--qv3-radius-control-sm); }
.qv3-runtime-dropdown-image { position: relative; top: auto; right: auto; flex: 0 0 17px; margin-left: 7px; transform: none; }
.qv3-runtime-multiselect { position: relative; width: min(300px, 100%); }
.qv3-runtime-multiselect-trigger { display: flex; width: 100%; min-height: var(--qv3-control-height-sm); align-items: center; justify-content: space-between; gap: 10px; padding: 6px 10px; border: 1px solid var(--qv3-control-border); border-radius: var(--qv3-radius-control-sm); color: #404855; background: #fff; font-size: 12px; font-weight: 750; text-align: left; }
.qv3-runtime-multiselect-trigger i { color: var(--qv3-muted); font-size: 15px; font-style: normal; }
.qv3-runtime-multiselect.is-open .qv3-runtime-multiselect-trigger { border-color: #9db2ce; box-shadow: 0 0 0 3px var(--qv3-focus-color); }
.qv3-runtime-multiselect-menu { position: absolute; z-index: 30; top: calc(100% + 5px); left: 0; display: grid; width: 100%; max-height: 240px; gap: 3px; overflow: auto; padding: 6px; border: 1px solid var(--qv3-control-border); border-radius: 10px; background: #fff; box-shadow: 0 14px 30px rgba(24,39,75,.16); }
.qv3-runtime-multiselect-option-wrap { position: relative; display: block; }
.qv3-runtime-multiselect-reason { display: block; width: 100%; }
.qv3-runtime-multiselect-reason > .qv3-runtime-multiselect-option { padding-right: 29px; }
.qv3-runtime-multiselect-option { display: grid; width: 100%; min-height: 34px; grid-template-columns: 20px minmax(0, 1fr); gap: 7px; align-items: center; padding: 6px 29px 6px 7px; border: 0; border-radius: 7px; color: #3e4754; background: transparent; font-size: 12px; text-align: left; }
.qv3-runtime-multiselect-option:hover { background: #f2f4f7; }
.qv3-runtime-multiselect-option > span { display: grid; width: 18px; height: 18px; place-items: center; border: 1px solid #b8c0cc; border-radius: 5px; color: #fff; font-size: 11px; }
.qv3-runtime-multiselect-option.is-selected > span { border-color: #272727; background: #272727; }
.qv3-runtime-multiselect-option.is-disabled { opacity: var(--qv3-control-disabled-opacity); }
.qv3-runtime-derived-value { display: inline-flex; min-height: var(--qv3-control-height-sm); align-items: center; padding: 6px 10px; border-radius: var(--qv3-radius-control-sm); color: #526070; background: #eef3f8; font-size: 11px; }
.qv3-runtime-derived-value.is-invalid { color: var(--qv3-red); background: var(--qv3-red-soft); }
.qv3-runtime-history-slot { min-width: 0; }
.qv3-runtime-history-slot:empty { display: none; }
.qv3-quote-history { display: grid; gap: 9px; margin-top: 2px; padding: 10px; border: 1px solid #e2e7ee; border-radius: 11px; background: #f8fafc; }
.qv3-quote-history-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.qv3-quote-history-head small { color: var(--qv3-muted); font-size: 10px; }
.qv3-quote-history-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 8px; }
.qv3-quote-history-card { display: grid; min-width: 0; gap: 3px; padding: 10px; border: 1px solid var(--qv3-line); border-radius: 10px; color: var(--qv3-text); background: #fff; text-align: left; }
.qv3-quote-history-card:hover, .qv3-quote-history-card.is-current { border-color: #e3bd24; background: #fffbea; }
.qv3-quote-history-card span, .qv3-quote-history-card small { color: var(--qv3-muted); font-size: 10px; }
.qv3-quote-history-card strong { color: var(--qv3-green); font-size: 15px; }
.qv3-hover-tooltip {
  position: fixed;
  z-index: 9998;
  width: max-content;
  max-width: min(260px, calc(100vw - 24px));
  padding: 8px 10px;
  border-radius: 8px;
  color: #fff;
  background: var(--qv3-dark);
  box-shadow: 0 10px 28px rgba(0,0,0,.22);
  font-size: 11px;
  line-height: 1.5;
  pointer-events: none;
}
.qv3-runtime-notices { display: grid; gap: 6px; margin: 10px 0; }
.qv3-runtime-notice { padding: 8px 10px; border-radius: 8px; color: #6f5817; background: var(--qv3-yellow-soft); font-size: 11px; line-height: 1.5; }
.qv3-runtime-calculate { width: 100%; margin-top: 4px; }
.qv3-quote-result { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--qv3-line); }
.qv3-quote-placeholder { padding: 16px; border-radius: 10px; color: var(--qv3-muted); background: #f7f8fa; font-size: 12px; text-align: center; }
.qv3-quote-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.qv3-quote-total span { color: var(--qv3-muted); font-size: 12px; }
.qv3-quote-total strong { color: var(--qv3-green); font-size: 25px; }
.qv3-quote-line { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--qv3-line); font-size: 12px; }
.qv3-quote-line:last-child { border-bottom: 0; }
.qv3-quote-line span { min-width: 0; }
.qv3-quote-line em { display: block; margin-top: 3px; color: var(--qv3-muted); font-size: 11px; font-style: normal; line-height: 1.4; }
.qv3-quote-line b { flex: 0 0 auto; }
.qv3-quote-manual { padding: 11px; border-radius: 9px; color: #8b5f16; background: var(--qv3-yellow-soft); font-size: 12px; }
.qv3-runtime-loading { pointer-events: none; opacity: .65; }
.qv3-runtime-help .qv3-preview-body { max-height: calc(100vh - 146px); overflow: auto; }
.qv3-help-gallery { position: relative; margin-bottom: 14px; overflow: hidden; border-radius: 12px; background: #eef3f7; }
.qv3-help-gallery-frame { display: block; width: 100%; padding: 0; overflow: hidden; border: 0; background: transparent; }
.qv3-help-gallery-frame img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: contain; transition: opacity .2s ease; }
.qv3-help-gallery-controls { position: absolute; inset: 50% 8px auto; display: flex; justify-content: space-between; pointer-events: none; transform: translateY(-50%); }
.qv3-help-gallery-controls button { display: grid; width: 30px; height: 30px; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; color: #fff; background: rgba(20,25,34,.72); pointer-events: auto; }
.qv3-help-gallery-dots { position: absolute; inset: auto 10px 9px; display: flex; justify-content: center; gap: 5px; pointer-events: none; }
.qv3-help-gallery-dots span { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.65); box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.qv3-help-gallery-dots span.is-active { width: 17px; border-radius: 999px; background: var(--qv3-yellow); }
.qv3-help-copy { color: #5d6674; font-size: 13px; line-height: 1.75; white-space: pre-line; }
.qv3-help-meta { display: grid; gap: 8px; margin-top: 14px; }
.qv3-help-meta span { padding: 8px 10px; border-radius: 8px; color: #526070; background: #f4f6f8; font-size: 12px; }

.qv3-image-lightbox {
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 28px;
  background: rgba(11,15,22,.82);
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
}
.qv3-image-lightbox-card { position: relative; display: grid; width: min(94vw, 1080px); max-height: 90vh; place-items: center; margin: 0; padding: 18px; border-radius: 16px; background: #fff; box-shadow: 0 24px 70px rgba(0,0,0,.36); }
.qv3-image-lightbox-card img { display: block; max-width: 100%; max-height: calc(90vh - 36px); border-radius: 10px; object-fit: contain; }
.qv3-image-lightbox-close { position: absolute; z-index: 1; top: 10px; right: 10px; display: grid; width: 36px; height: 36px; place-items: center; padding: 0; border: 0; border-radius: 50%; color: #fff; background: rgba(15,19,27,.82); font-size: 20px; }

.qv3-validation-summary { display: grid; gap: 10px; }
.qv3-validation-card { padding: 12px 14px; border: 1px solid var(--qv3-line); border-radius: 11px; background: #fff; }
.qv3-validation-card.is-error { border-color: #f2c4ca; background: var(--qv3-red-soft); }
.qv3-validation-card.is-warning { border-color: #ffe18a; background: var(--qv3-yellow-soft); }
.qv3-validation-card.is-success { border-color: #bde6d3; background: var(--qv3-green-soft); }
.qv3-validation-card strong { display: block; font-size: 13px; }
.qv3-validation-card p { margin: 5px 0 0; color: #5f6875; font-size: 12px; line-height: 1.55; }
.qv3-publish-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.qv3-publish-meta div { padding: 12px; border: 1px solid var(--qv3-line); border-radius: 11px; background: #fff; }
.qv3-publish-meta span, .qv3-publish-meta strong { display: block; }
.qv3-publish-meta span { color: var(--qv3-muted); font-size: 11px; }
.qv3-publish-meta strong { margin-top: 5px; font-size: 14px; }

.qv3-toast {
  position: fixed;
  top: 92px;
  right: 24px;
  bottom: auto;
  z-index: 100;
  max-width: min(380px, calc(100vw - 32px));
  padding: 12px 16px;
  border-radius: 10px;
  color: #fff;
  background: #111827;
  box-shadow: 0 12px 36px rgba(0,0,0,.24);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity .2s ease, transform .2s ease;
}
.qv3-toast.is-visible { opacity: 1; transform: none; }
.qv3-toast.is-error { background: #a92e3a; }

body.qv3-dialog-open { overflow: hidden; }
.qv3-dialog-layer {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(12, 17, 25, .52);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.qv3-dialog {
  display: grid;
  width: min(430px, 100%);
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 14px;
  padding: 20px;
  border: 1px solid var(--qv3-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(10, 16, 25, .3);
}
.qv3-dialog-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; color: var(--qv3-red); background: var(--qv3-red-soft); font-size: 20px; font-weight: 900; }
.qv3-dialog-copy { min-width: 0; }
.qv3-dialog-copy h2 { margin: 1px 0 0; font-size: 17px; line-height: 1.4; }
.qv3-dialog-copy p { margin: 7px 0 0; color: #626b79; font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.qv3-dialog-actions { display: flex; grid-column: 1 / -1; justify-content: flex-end; gap: 9px; margin-top: 5px; }
.qv3-dialog-danger { border-color: var(--qv3-red); color: #fff; background: var(--qv3-red); }
.qv3-dialog-danger:hover:not(:disabled) { border-color: #bd3542; color: #fff; background: #bd3542; }
.qv3-dialog button:focus-visible { outline: 3px solid var(--qv3-focus-color); outline-offset: 2px; }

@media (max-width: 1600px) {
  .qv3-standard-size-main { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1240px) {
  .qv3-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qv3-editor-layout, .qv3-runtime-layout { grid-template-columns: minmax(0, 1fr) 330px; }
  .qv3-advanced-grid, .qv3-small-size-rule-body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qv3-charge-line { grid-template-columns: minmax(130px, 1fr) minmax(112px, .85fr) minmax(90px, .65fr); }
  .qv3-charge-unit { grid-column: 1 / 3; }
  .qv3-charge-line > .qv3-button { grid-column: 3; grid-row: 2; }
  .qv3-dimension-config-grid, .qv3-matrix-policy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qv3-dimension-structure { grid-template-columns: 1fr; }
  .qv3-matrix-row-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1120px) {
  .qv3-editor-layout, .qv3-runtime-layout { grid-template-columns: 1fr; }
  .qv3-preview { position: relative; top: 0; }
  .qv3-preview-body { max-height: none; }
  .qv3-runtime-help .qv3-preview-body { max-height: none; overflow: visible; }
}

@media (max-width: 760px) {
  :root { --qv3-sidebar-width: 260px; }
  body.qv3-nav-open { overflow: hidden; }
  .qv3-sidebar {
    width: var(--qv3-sidebar-width);
    transform: translateX(-104%);
    transition: transform .22s ease;
  }
  body.qv3-nav-open .qv3-sidebar { transform: translateX(0); }
  .qv3-sidebar-scrim { position: fixed; inset: 0; z-index: 35; display: block; background: rgba(9,13,20,.45); }
  .qv3-mobile-menu {
    position: fixed;
    top: 15px;
    left: 14px;
    z-index: 34;
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    padding: 0;
    border: 1px solid var(--qv3-line);
    border-radius: 10px;
    background: #fff;
    box-shadow: var(--qv3-shadow);
  }
  .qv3-mobile-menu > span:first-child, .qv3-mobile-menu > span:first-child::before, .qv3-mobile-menu > span:first-child::after {
    width: 18px;
    height: 2px;
    border-radius: 3px;
    background: var(--qv3-dark);
  }
  .qv3-mobile-menu > span:first-child { position: relative; }
  .qv3-mobile-menu > span:first-child::before, .qv3-mobile-menu > span:first-child::after { content: ""; position: absolute; left: 0; }
  .qv3-mobile-menu > span:first-child::before { top: -6px; }
  .qv3-mobile-menu > span:first-child::after { top: 6px; }
  .qv3-main { margin-left: 0; }
  .qv3-topbar { min-height: 70px; padding: 10px 14px 10px 66px; }
  .qv3-page-heading > span, .qv3-context-badge { display: none; }
  .qv3-top-actions .qv3-button { padding-inline: 10px; font-size: 12px; }
  .qv3-content { padding: 14px; }
  .qv3-form-grid, .qv3-template-grid, .qv3-product-grid, .qv3-publish-meta, .qv3-image-uploader { grid-template-columns: 1fr; }
  .qv3-dimension-config-grid, .qv3-standard-size-main, .qv3-matrix-policy-grid, .qv3-matrix-row-grid { grid-template-columns: 1fr; }
  .qv3-dimension-structure { grid-template-columns: 1fr; }
  .qv3-dimension-derived { align-items: flex-start; flex-direction: column; }
  .qv3-dimension-derived small { margin-left: 0; }
  .qv3-dimension-matrix-status, .qv3-price-matrix-discovery { align-items: stretch; grid-template-columns: 1fr; flex-direction: column; }
  .qv3-dimension-matrix-status > .qv3-button, .qv3-price-matrix-discovery > .qv3-button { align-self: flex-start; }
  .qv3-standard-sizes-head { align-items: stretch; flex-direction: column; }
  .qv3-standard-sizes-head > .qv3-button { align-self: flex-start; }
  .qv3-product-image-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qv3-filter-section { display: grid; }
  .qv3-status-filters { border-top: 1px solid var(--qv3-line); padding-top: 10px; }
  .qv3-rule-grid { grid-template-columns: 1fr; }
  .qv3-range-fields { grid-template-columns: 1fr; }
  .qv3-group-settings, .qv3-group-parent-settings, .qv3-option-row, .qv3-charge-line { grid-template-columns: 1fr; }
  .qv3-option-columns { display: none; }
  .qv3-option-row { row-gap: 10px; }
  .qv3-option-row > .qv3-inline-actions, .qv3-charge-unit, .qv3-charge-line > .qv3-button { grid-column: auto; grid-row: auto; justify-content: flex-start; justify-self: start; }
  .qv3-tier-head { align-items: stretch; flex-direction: column; }
  .qv3-tier-head > .qv3-button { align-self: flex-start; }
  .qv3-tier-primary, .qv3-tier-values { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .qv3-tier-cell-remove { grid-column: 1 / -1; }
  .qv3-editor-footer { position: relative; bottom: auto; align-items: stretch; flex-direction: column; }
  .qv3-editor-footer > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qv3-editor-footer > div .qv3-button:only-child { grid-column: 1 / -1; }
  .qv3-editor-footer > div .qv3-button:last-child { grid-column: 1 / -1; }
  .qv3-toast { top: 82px; right: 14px; }
  .qv3-combobox-menu {
    top: auto !important;
    right: 10px;
    bottom: max(10px, env(safe-area-inset-bottom));
    left: 10px !important;
    width: auto !important;
    max-height: min(48vh, 360px);
    padding: 8px;
    border-radius: 15px;
  }
  .qv3-combobox-option { min-height: 44px; padding: 10px 12px; }
}

@media (max-width: 480px) {
  .qv3-top-actions { display: none; }
  .qv3-product-toolbar { align-items: stretch; flex-direction: column; }
  .qv3-search { max-width: none; }
  .qv3-card { padding: 16px; }
  .qv3-section-head { align-items: stretch; flex-direction: column; }
  .qv3-section-head > .qv3-button { width: 100%; }
  .qv3-step-line { width: 18px; flex-basis: 18px; margin-inline: 5px; }
  .qv3-group-head, .qv3-rule-head, .qv3-charge-head { align-items: flex-start; flex-direction: column; }
  .qv3-group-head > .qv3-group-actions, .qv3-rule-head > .qv3-inline-actions { width: 100%; justify-content: flex-end; }
  .qv3-charge-head > .qv3-button { width: 100%; }
  .qv3-group-settings, .qv3-advanced-grid, .qv3-small-size-rule-body { grid-template-columns: 1fr; }
  .qv3-small-size-rule-head { align-items: stretch; flex-direction: column; }
  .qv3-small-size-rule-head > .qv3-button, .qv3-small-size-rule-head > .qv3-inline-actions { width: 100%; }
  .qv3-small-size-rule-head > .qv3-inline-actions .qv3-button { flex: 1 1 auto; }
  .qv3-upload-actions { display: grid; grid-template-columns: 1fr; }
  .qv3-upload-actions .qv3-button { width: 100%; }
  .qv3-tier-head > .qv3-button { width: 100%; align-self: stretch; }
  .qv3-tier-primary, .qv3-tier-values { grid-template-columns: 1fr; }
  .qv3-tier-cell-remove { grid-column: auto; }
  .qv3-runtime-row { grid-template-columns: 1fr; gap: 6px; }
  .qv3-runtime-row > strong { justify-content: flex-start; }
  .qv3-runtime-size-policy-note { margin-left: 0; }
  .qv3-product-image-list { grid-template-columns: 1fr; }
  .qv3-image-lightbox { padding: 12px; }
  .qv3-runtime-size-choice { grid-template-columns: 1fr; }
  .qv3-runtime-size-choice > :where(.qv3-runtime-size-fields, .qv3-runtime-controls, .qv3-runtime-range-hint) { grid-column: 1; }
  .qv3-runtime-size-toggle { justify-self: start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}