.sheet {
  --sheet-frame: 1px solid var(--sheet-line);
  --sheet-pad: 14mm;
  --sheet-cover-bg: #14110e;
  --sheet-cover-ink: #fbf8f3;
  --sheet-block-radius: var(--sheet-radius);
  --drag-ground: var(--sheet-bg);

  width: 210mm;
  flex: none;
  margin: 0 auto;
  padding: var(--sheet-pad);
  background: var(--sheet-bg);
  color: var(--sheet-ink);
  border: var(--sheet-frame);
  border-radius: var(--sheet-radius);
  font-size: var(--fs);
  line-height: 1.5;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1;
}

.sheet .num {
  font-family: var(--num);
  font-variant-numeric: lining-nums tabular-nums;
}

.sheet-block {
  --wb-grey: #ECECE9;    --wb-grey-2: #DEDDD8;
  --wb-stone: #E6E8EA;   --wb-stone-2: #D3D8DC;
  --wb-accent: #E7F0EB;  --wb-accent-2: #D2E3D9;
  --wb-mint: #E4F0E8;    --wb-mint-2: #CDE4D5;
  --wb-sand: #FBF0D5;    --wb-sand-2: #F3E2B6;
  --wb-peach: #FBEBDD;   --wb-peach-2: #F6D9C3;
  --wb-sky: #E4EEF6;     --wb-sky-2: #CDDFEE;
  --wb-teal: #DFEEEE;    --wb-teal-2: #C5E2E2;
  --wb-rose: #F7E8EA;    --wb-rose-2: #EED4D9;
  --wb-lilac: #EDE8F6;   --wb-lilac-2: #DCD3EE;
  --wb-olive: #EDEFDC;   --wb-olive-2: #DCE0C1;
  --wb-own-ink: #8C887E; --wb-own-base: #FFFFFF;
  --wb-pat-base: transparent;
  --wb-grad-angle: 155deg;  --wb-grad-end: rgba(255, 255, 255, 0);  --wb-grad-stop: 92%;
  --wb-hatch-2: rgba(255, 255, 255, 0);  --wb-hatch-step: 5px;
  --wb-dots-ink: var(--block-fill);      --wb-dots-gap: rgba(255, 255, 255, 0);
  --wb-dots-r: 1.4px;  --wb-dots-edge: 1.5px;  --wb-dots-size: 9px;
  --wb-dots-ink-b: var(--block-fill-b);  --wb-dots-ink-c: var(--block-fill-c);
  --wb-dots-ink-d: var(--block-fill-d);  --wb-dots-ink-e: var(--block-fill-e);
  --ln-base: var(--sheet-border-width);
  --ln-inset: 6px;
}

:root {
  --sheet-step: 2px;
  --sheet-05:  calc(var(--sheet-step) * 0.5);
  --sheet-1:   var(--sheet-step);
  --sheet-15:  calc(var(--sheet-step) * 1.5);
  --sheet-2:   calc(var(--sheet-step) * 2);
  --sheet-25:  calc(var(--sheet-step) * 2.5);
  --sheet-3:   calc(var(--sheet-step) * 3);
  --sheet-35:  calc(var(--sheet-step) * 3.5);
  --sheet-4:   calc(var(--sheet-step) * 4);
  --sheet-5:   calc(var(--sheet-step) * 5);
  --sheet-7:   calc(var(--sheet-step) * 7);
  --sheet-8:   calc(var(--sheet-step) * 8);
  --sheet-9:   calc(var(--sheet-step) * 9);
  --sheet-10:  calc(var(--sheet-step) * 10);
  --sheet-13:  calc(var(--sheet-step) * 13);
  --sheet-16:  calc(var(--sheet-step) * 16);
}

.sheet-block + .sheet-block { margin-top: var(--sheet-7); }

.sheet-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sheet-10);
}
.sheet-head-text { min-width: 0; }
.sheet-h { font-size: var(--fs-h); font-weight: 650; line-height: 1.2; }
.sheet-sub { margin-top: var(--sheet-2); font-size: var(--fs-s); color: var(--sheet-ink-2); }
.sheet-gallery { display: grid; gap: var(--sheet-2); width: 100%; }
.sheet-pic-frame:has(> .sheet-gallery):not(.sized) { width: 100%; }
.sheet-gallery.gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sheet-gallery.gallery-row { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
.sheet-gallery.gallery-lead { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sheet-gallery.gallery-lead > .sheet-gallery-tile:first-child { grid-column: span 2; grid-row: span 2; }
.sheet-gallery > .sheet-gallery-tile:only-child { grid-column: 1 / -1; }
.sheet-gallery-tile { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--sheet-radius); }
.sheet-gallery-tile > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
                            transform-origin: center; }
.sheet-hidden-mark { font-size: var(--fs-xs); color: var(--sheet-ink-2); }
.sheet-slot { display: block; font-size: var(--fs-xs); color: var(--sheet-ink-2); }
.sheet-brand { display: flex; flex-direction: column; align-items: flex-end; gap: var(--sheet-3);
               text-align: right; max-width: 84mm; }
.sheet-logo { max-height: 16mm; max-width: 52mm; object-fit: contain; }
.sheet-req { font-size: var(--fs-xs); line-height: 1.45; color: var(--sheet-ink-2); }
.sheet-req div { text-wrap: balance; }
.sheet-req-one { white-space: nowrap; }
.sheet-mark {
  font-size: var(--fs-l);
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--block-line, var(--sheet-ink));
  text-align: right;
}

.sheet-table { width: 100%; border-collapse: collapse; }
.sheet-table th {
  padding: var(--sheet-35) 0;
  font-size: var(--fs-xs);
  font-weight: 600;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--sheet-ink-2);
  border-bottom: calc(var(--sheet-border-width) + .5px)
                 var(--sheet-border-style) var(--sheet-ink);
}
.sheet-table td:not(.num) { overflow-wrap: anywhere; }
.sheet-table td {
  padding: var(--sheet-35) 0;
  font-size: var(--fs);
  border-bottom: 1px var(--sheet-border-style) var(--sheet-border-color);
  vertical-align: top;
}
.sheet-table th.num, .sheet-table td.num { text-align: right; font-size: var(--fs-s); }
.sheet-table th.num, .sheet-table td.num { white-space: nowrap; }
.sheet-table th + th, .sheet-table td + td { padding-left: var(--sheet-5); }
.sheet-section td {
  padding-top: var(--sheet-7);
  font-weight: 700;
  border-bottom: calc(var(--sheet-border-width) + .5px)
                 var(--sheet-border-style) var(--sheet-ink);
}
.sheet-subtotal td {
  padding-top: var(--sheet-3);
  font-weight: 650;
  font-size: var(--fs-s);
  border-bottom: calc(var(--sheet-border-width) + .5px)
                 var(--sheet-border-style) var(--sheet-ink);
}

.sheet-empty {
  padding: var(--sheet-9) 0;
  text-align: center;
  color: var(--sheet-ink-2);
  font-style: italic;
}

.sheet-req-tail { margin-top: var(--sheet-3); white-space: pre-wrap; }

.sheet-block { border-radius: var(--sheet-block-radius); }

.sheet-block.bd-line  { border: var(--ln-fw, var(--sheet-border-width)) var(--block-stroke, solid)
                                var(--block-line, var(--sheet-line)); }
.sheet-block.bd-under {
  --ln-base: calc(var(--sheet-border-width) + 1px);
  padding-bottom: calc(10px + var(--ln-t, 2px));
}
.sheet-block.bd-under:not(.fill-none) { --ln-ends: var(--sheet-block-radius); }

.ln-green, .dv-ln-green { --block-line: #1E5B44; }
.ln-ink,   .dv-ln-ink   { --block-line: #2E2C27; }
.ln-grey,  .dv-ln-grey  { --block-line: #8C887E; }
.ln-amber, .dv-ln-amber { --block-line: #A8741C; }
.ln-blue,  .dv-ln-blue  { --block-line: #245D96; }
.ln-rose,  .dv-ln-rose  { --block-line: #A03A5C; }
.ln-plum,  .dv-ln-plum  { --block-line: #6A4A93; }
.ln-teal,  .dv-ln-teal  { --block-line: #1F6E77; }
.ln-olive, .dv-ln-olive { --block-line: #5F7028; }
.ln-clay,  .dv-ln-clay  { --block-line: #8F4526; }
.ln-steel, .dv-ln-steel { --block-line: #45596F; }
.ln-own,   .dv-ln-own   { --block-line: var(--block-own-line, #2E2C27); }

.sheet-divider {
  --ln-base: 1px;
  height: var(--ln-t, 1px);
  margin: var(--dv-gap, 12px) 0;
}

.sheet-block.sheet-divider { margin: var(--dv-gap, 12px) 0; }
.sheet-block.sheet-divider + .sheet-block:not(.sheet-divider) { margin-top: 0; }

.sheet-edit .sheet-divider.st-none {
  border-top: 1px dashed var(--sheet-line);
}
.sheet-edit .sheet-divider { min-height: 2px; position: relative; }
.sheet-edit .sheet-divider::after {
  content: ""; position: absolute; left: 0; right: 0;
  top: calc(-1 * var(--sp-200)); bottom: calc(-1 * var(--sp-200));
}

.sheet-block.bd-line,
.sheet-block.bd-left,
.sheet-block:not(.fill-none) { padding: var(--sheet-5) var(--sheet-7); }

.sheet-signature {
  margin-top: var(--sheet-13);
  padding-top: var(--sheet-5);
  border-top: var(--sheet-frame);
  font-size: var(--fs-s);
  color: var(--sheet-ink-2);
}
.sheet-agree { margin-bottom: var(--sheet-5); color: var(--sheet-ink); }
.sheet-signrow { display: flex; justify-content: space-between; gap: var(--sheet-10); }

.sheet.sheet-style-brand { --sheet-block-radius: 10px; }

.sheet.sheet-style-document {
  --sheet-accent: #4A4740;
  --sheet-accent-weak: rgba(0, 0, 0, .04);
  --sheet-radius: 0;
  --sheet-block-radius: 0;
}
.sheet.sheet-style-document .sheet-block:not(.fill-none) {
  --block-fill: rgba(0, 0, 0, .05);
  --block-fill-2: rgba(0, 0, 0, .09);
}

.sheet.sheet-style-strict {
  --sheet-accent: #000000;
  --sheet-accent-weak: transparent;
  --sheet-ink: #000000;
  --sheet-ink-2: #333333;
  --sheet-line: #000000;
  --sheet-radius: 0;
  --sheet-block-radius: 0;
  font-family: "Times New Roman", Times, "Liberation Serif", serif;
  font-size: var(--fs);
}
.sheet.sheet-style-strict .num { font-family: inherit; }
.sheet.sheet-style-strict .sheet-block:not(.fill-none) {
  background: none;
  background-image: none;
}
.sheet.sheet-style-strict .wblock-art { display: none; }
.sheet.sheet-style-strict .sheet-block:not(.fill-none):not(.bd-line):not(.bd-left) {
  padding-left: 0; padding-right: 0;
}
.sheet.sheet-style-strict .sheet-mark { letter-spacing: .04em; }

.sheet.sheet-style-strict .sheet-block { border: 0; }
.sheet.sheet-style-strict .sheet-block::before { display: none; }
.sheet.sheet-style-strict .sheet-block.bd-line,
.sheet.sheet-style-strict .sheet-block.bd-left,
.sheet.sheet-style-strict .sheet-block.bd-under {
  padding-left: 0; padding-right: 0; padding-bottom: 0;
}

.sheet.sheet-style-strict :is(h1, h2, h3, h4),
.sheet.sheet-style-strict .sheet-h,
.sheet.sheet-style-strict .card-title { font-family: inherit; }

.sheet.sheet-style-strict .sheet-h { text-transform: uppercase; letter-spacing: .06em; }
.sheet.sheet-style-strict .sheet-table thead th { border-bottom: 1.5px solid #000; }
.sheet.sheet-style-strict .sheet-logo { filter: grayscale(1); }
.sheet.sheet-style-strict .sheet-photo { filter: grayscale(1); }

.sheet-edit .sheet-block {
  position: relative;
  cursor: var(--cur-grab);
  outline: 1.5px dashed transparent;
  outline-offset: 4px;
  transition: outline-color .12s, background .12s;
}
.sheet-edit .sheet-block:hover,
.sheet-edit .sheet-signature:hover { outline-color: var(--sheet-line); }
/* 15.981 («а почему рамка выделения поменяла свой цвет?»): the selection is the program's mark, not the sheet's —
   the program's accent, never the company's colours that recolour the sheet */
.sheet-edit .sheet-block.picked,
.sheet-edit .sheet-signature.picked {
  outline: 2px solid var(--acc);
  outline-offset: 4px;
}
.sheet-edit [data-edit][contenteditable] { cursor: text; outline: none; }
.sheet-edit .picked [data-edit][contenteditable]:hover,
.sheet-edit .picked [data-edit][contenteditable]:focus {
  background: color-mix(in srgb, var(--acc) 8%, transparent);
}
.sheet-edit [data-default]:empty::before { content: attr(data-default); }
.sheet-edit [data-hint][contenteditable]:empty::before { content: attr(data-hint); color: var(--sheet-ink-2); }
.sheet-edit [data-hint]:empty:not([contenteditable]) { display: none; }
.sheet-edit .picked:has([data-edit][contenteditable]) .sheet-edit-empty { display: none; }
.sheet-edit .sheet-block .sheet-block,
.sheet-edit .sheet-block .sheet-block:hover { outline-color: transparent; cursor: inherit; }

.sheet-edit .sheet-signature {
  position: relative;
  cursor: pointer;
  border-radius: var(--sheet-block-radius);
  outline: 1.5px dashed transparent;
  outline-offset: 4px;
  transition: outline-color .12s;
}
.sheet-edit .sheet-block.dragging { cursor: var(--cur-hold); }

.sheet-edit .sheet-block::after { pointer-events: none; }
.sheet-edit .sheet-divider::after { pointer-events: auto; }
.sheet-tag {
  position: absolute; left: var(--sheet-4); top: calc(var(--sheet-2) * -1);
  transform: translateY(-50%);
  padding: 0 var(--sheet-2);
  background: var(--sheet-bg);
  font-family: var(--font); font-size: var(--fs-xs); font-weight: 500; line-height: 1;
  color: var(--sheet-ink-2); white-space: nowrap;
  opacity: 0;
  transition: opacity .12s;
  pointer-events: none;
}
.sheet-edit .sheet-block:hover > .sheet-tag,
.sheet-edit .sheet-signature:hover > .sheet-tag { opacity: 1; }
.sheet-edit .sheet-block.picked > .sheet-tag,
.sheet-edit .sheet-signature.picked > .sheet-tag { opacity: 0; }

.sheet-photo {
  display: block;
  max-width: 100%; max-height: 90mm;
  object-fit: contain;
  margin: 0 auto var(--sheet-8);
  border-radius: var(--sheet-radius);
}

.sheet-photo-box {
  display: flex; flex-direction: column; justify-content: center;
}
.sheet-photo-box.pic-at-left   { align-items: flex-start; }
.sheet-photo-box.pic-at-center { align-items: center; }
.sheet-photo-box.pic-at-right  { align-items: flex-end; }
.sheet-cover {
  display: flex; flex-direction: column; gap: var(--sheet-5);
  margin: calc(var(--sheet-pad) * -1) calc(var(--sheet-pad) * -1) var(--sheet-pad);
  padding: var(--sheet-pad); aspect-ratio: 210 / 297; min-height: 0; overflow: hidden;
  border-radius: var(--sheet-radius) var(--sheet-radius) 0 0;
}
.sheet-cover > * { flex: none; }
/* A cover alone on its sheet (the previews of 15.530): the cover is the whole sheet. */
.sheet.cover-only { padding: 0; border: 0; }
.sheet.cover-only > .sheet-cover { margin: 0; border-radius: 0; }
.sheet-cover.cover-dark { background: var(--sheet-cover-bg); color: var(--sheet-cover-ink); }
.sheet-cover.cover-light { background: var(--sheet-bg); color: var(--sheet-ink); }
.sheet-cover.cover-image { padding: 0; }
.sheet-cover-full { width: 100%; height: 100%; object-fit: cover; display: block; }
.sheet-cover-brand { display: flex; align-items: center; gap: var(--sheet-5); }
.sheet-cover-brand b { display: block; font-size: var(--fs); }
.sheet-cover-brand span { font-size: var(--fs-xs); color: color-mix(in srgb, currentColor 80%, transparent); }
.sheet-cover-logo { height: 13mm; width: auto; border-radius: var(--sheet-radius); }
.sheet-cover > .sheet-cover-pic { flex: 0 1 48%; min-height: 0; border-radius: var(--sheet-radius); overflow: hidden; }
.sheet-cover > .sheet-cover-over { margin-top: auto; }
.sheet-cover-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sheet-cover-pic .sheet-photo-slot { height: 100%; min-height: 0; }
.sheet-cover-over { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
                    color: var(--sheet-accent); }
.sheet-cover-title { margin: 0; font-size: calc(var(--fs-h) * 2); line-height: 1.1; font-weight: 700; }
.sheet-cover-sub { font-size: calc(var(--fs-h) * 1.6); line-height: 1.1; font-weight: 700; color: var(--sheet-accent); }
.sheet-cover-text { margin: 0; font-size: var(--fs); line-height: 1.5; color: color-mix(in srgb, currentColor 85%, transparent); }
.sheet-cover-facts { display: flex; gap: var(--sheet-10); }
.sheet-cover-fact span { display: block; font-size: var(--fs-xs); color: color-mix(in srgb, currentColor 70%, transparent); }
.sheet-cover-fact b { font-size: var(--fs-l); }
.sheet-cover-foot { display: flex; justify-content: space-between; gap: var(--sheet-5); padding-top: var(--sheet-5);
                    border-top: 1px solid currentColor; font-size: var(--fs-xs); color: color-mix(in srgb, currentColor 80%, transparent); }
@media print { .sheet-cover { break-after: page; aspect-ratio: auto; height: calc(297mm - 2 * var(--sheet-pad)); margin: 0; } }

/* ═══ Covers of a quick order (15.530; modules/kp/covers.js) — the standard designs of the company.
   Every design fills the whole cover sheet; its data stand in slots (label over value). */
.sheet-cover.qcv { position: relative; padding: 0; gap: 0; isolation: isolate; }
.qcv-fill { flex: 1 1 auto; }
/* The logo of a cover (15.538): its height is the cover's setting; a name stands in for a missing sign */
.qcv-logo { display: block; height: var(--logo-h, 12mm); width: auto; max-width: 90mm; object-fit: contain; }
.qcv-name { font-size: calc(var(--logo-h, 12mm) * .42); font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.qcv-logo-at { position: absolute; z-index: 2; display: flex; }
.qcv-logo-at.at-tl, .qcv-logo-at.at-tc, .qcv-logo-at.at-tr { top: 10mm; }
.qcv-logo-at.at-bl, .qcv-logo-at.at-bc, .qcv-logo-at.at-br { bottom: 10mm; }
.qcv-logo-room { flex: none; height: calc(var(--logo-h) + 4mm); }
.qcv-logo-at.at-tl, .qcv-logo-at.at-bl { left: 13mm; }
.qcv-logo-at.at-tr, .qcv-logo-at.at-br { right: 13mm; }
.qcv-logo-at.at-tc, .qcv-logo-at.at-bc { left: 50%; transform: translateX(-50%); }
.qcv-slots { display: grid; grid-template-columns: repeat(auto-fit, minmax(32mm, 1fr)); gap: 5mm 6mm; }
.qcv-slot { display: flex; flex-direction: column; gap: 1mm; min-width: 0; }
.qcv-slot-label { font-size: var(--fs-xs); letter-spacing: .14em; text-transform: uppercase; color: color-mix(in srgb, currentColor 70%, transparent); }
.qcv-slot-value { font-size: var(--fs); font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.qcv-empty { background: linear-gradient(135deg, #d8d2c8, #bdb4a6); }
.qcv-whole { display: grid; place-items: center; width: 100%; height: 100%; color: #5f584e; font-size: var(--fs); }

/* ═══ New covers (15.532: «Стильно, красиво, модно, по-дизайнерски, как у эппл или у журналов»). Sizes in print
   millimetres; the display serif — Playfair Display (SIL OFL, static/fonts/playfair-OFL.txt). */
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: url("/fonts/playfair-cyrillic-wght-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 400 900; font-display: swap;
  src: url("/fonts/playfair-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2212;
}
@font-face {
  font-family: "Playfair Display"; font-style: italic; font-weight: 400 900; font-display: swap;
  src: url("/fonts/playfair-cyrillic-wght-italic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Playfair Display"; font-style: italic; font-weight: 400 900; font-display: swap;
  src: url("/fonts/playfair-latin-wght-italic.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+20AC, U+2122, U+2212;
}
/* Fonts of the card views and totals (15.576), SIL OFL — licences beside them in /fonts */
@font-face {
  font-family: "Forum"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/forum-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Forum"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/forum-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Lora"; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url("/fonts/lora-cyrillic-italic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Lora"; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url("/fonts/lora-latin-italic.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Lora"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/fonts/lora-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Lora"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/fonts/lora-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/fonts/montserrat-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Montserrat"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/fonts/montserrat-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Onest"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/fonts/onest-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Onest"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/fonts/onest-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Oswald"; font-style: normal; font-weight: 200 700; font-display: swap;
  src: url("/fonts/oswald-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Oswald"; font-style: normal; font-weight: 200 700; font-display: swap;
  src: url("/fonts/oswald-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Prata"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/prata-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Prata"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/prata-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Tenor Sans"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/tenorsans-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Tenor Sans"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/tenorsans-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Unbounded"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url("/fonts/unbounded-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Unbounded"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url("/fonts/unbounded-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Yeseva One"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/yesevaone-cyrillic-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Yeseva One"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/fonts/yesevaone-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.sheet-cover.qcv { --qcv-serif: "Playfair Display", Georgia, "Times New Roman", serif;
                   -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.qcv-logo.chip { padding: 1.6mm 2.4mm; border-radius: 1.6mm; background: #fff; }

/* The company's own faces of a cover (15.547): `cf-<part>` marks the part, `--cf-<part>` carries the face; `-upright` —
   a face without an italic, `-regular` — a face of one weight (over the masthead's own weight too). */
.sheet-cover.qcv.cf-text, .sheet-cover.qcv.cf-text :not(h1, .qcv-gl-mast) { font-family: var(--cf-text); }
.sheet-cover.qcv.cf-text-upright :not(h1, .qcv-gl-mast) { font-style: normal; }
.sheet-cover.qcv.cf-text-regular :not(h1, .qcv-gl-mast) { font-weight: 400; }
.sheet-cover.qcv.cf-head h1 { font-family: var(--cf-head); }
.sheet-cover.qcv.cf-head-upright h1 { font-style: normal; }
.sheet-cover.qcv.cf-head-regular h1 { font-weight: 400; }
.sheet-cover.qcv.cf-mast .qcv-gl-mast { font-family: var(--cf-mast); }
.sheet-cover.qcv.cf-mast-upright .qcv-gl-mast { font-style: normal; }
.sheet-cover.qcv.cf-mast-regular .qcv-gl-mast { font-weight: 400 !important; }

/* Глянец — a magazine cover */
.qcv-gloss { background: #1b1714; color: #fff; }
.qcv-gloss .qcv-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.qcv-gl-shade { position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(12, 9, 6, .62) 0%, rgba(12, 9, 6, .18) 24%, rgba(12, 9, 6, 0) 40%,
                                      rgba(12, 9, 6, 0) 52%, rgba(12, 9, 6, .78) 100%); }
.qcv-gl-body { display: flex; flex-direction: column; height: 100%; padding: 10mm 12mm 12mm; box-sizing: border-box; }
/* Below the line — room for the feet of Д, Ц, Щ, growing with the letters (15.535) */
/* The masthead in the title's italic serif (15.611, 22.10: «сделай красивый шрифт как снизу») */
.qcv-gl-mast { font-family: var(--qcv-serif); font-style: italic; font-weight: 700; font-size: var(--mast, 24mm); line-height: .9;
               padding-bottom: .13em;
               letter-spacing: -.01em; text-align: center; white-space: nowrap;
               text-shadow: 0 .4mm 3mm rgba(0, 0, 0, .25); }
/* A blurred shadow is a picture in a PDF — a box around the masthead (15.695); the shade under it keeps the words read */
@media print { .qcv-gl-mast { text-shadow: none; } }
.qcv-gl-issue { display: flex; align-items: center; gap: 3mm; margin-top: 1.4mm; font-size: 2.3mm; font-weight: 600;
                letter-spacing: .04em; white-space: nowrap; }
.qcv-gl-issue::before, .qcv-gl-issue::after { content: ""; flex: 1 1 0; border-top: .2mm solid rgba(255, 255, 255, .7); }
.qcv-gl-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 8mm; }
.qcv-gl-lines { max-width: 128mm; min-width: 0; }
.qcv-gl-kicker { display: flex; align-items: center; gap: 2.4mm; font-size: 2.5mm; font-weight: 600;
                 letter-spacing: .02em; }
.qcv-gl-kicker::before { content: ""; width: 8mm; border-top: .3mm solid currentColor; flex: none; }
.qcv-gl-title { margin: 3mm 0 0; font-family: var(--qcv-serif); font-style: italic; font-weight: 400;
                font-size: 17mm; line-height: .98; letter-spacing: -.01em; text-wrap: balance; overflow-wrap: anywhere; }
.qcv-gl-intro { margin: 3mm 0 0; max-width: 110mm; font-size: 3.2mm; line-height: 1.5; color: color-mix(in srgb, currentColor 90%, transparent); }
.qcv-gloss .qcv-slots { display: flex; flex-direction: column; gap: 2.6mm; margin-top: 7mm; }
.qcv-gloss .qcv-slot { display: flex; flex-direction: column; gap: .6mm; }
.qcv-gloss .qcv-slot-label { font-size: 2.2mm; font-weight: 600; letter-spacing: .02em; color: color-mix(in srgb, currentColor 72%, transparent); text-transform: none; }
.qcv-gloss .qcv-slot-value { font-family: var(--qcv-serif); font-weight: 400; font-size: 5mm; line-height: 1.15; }

/* Витрина — a product page in light grey */
.sheet-cover.qcv-showcase { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 13mm 13mm 12mm;
                background: #f5f5f7; color: #1d1d1f; }
.qcv-sc-eyebrow { margin-top: 9mm; font-size: 3.3mm; font-weight: 600; color: var(--brand-1, #b5651d); }
.qcv-sc-title { font-family: var(--font); margin: 1.6mm 0 0; max-width: 182mm; font-size: 14mm; font-weight: 700; line-height: 1.04;
                letter-spacing: -.03em; text-wrap: balance; overflow-wrap: anywhere; }
.qcv-sc-sub { margin: 3mm 0 0; max-width: 150mm; font-size: 4.6mm; line-height: 1.35; color: #6e6e73; }
.qcv-showcase > .qcv-sc-photo { flex: 1 1 0; min-height: 0; width: 100%; margin-top: 9mm; border-radius: 7mm;
                                overflow: hidden; box-shadow: 0 2mm 8mm rgba(0, 0, 0, .1); }
.qcv-sc-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qcv-showcase .qcv-slots { width: 100%; margin-top: 9mm; display: grid;
                           grid-template-columns: repeat(auto-fit, minmax(38mm, 1fr)); row-gap: 5mm; }
.qcv-showcase .qcv-slot { flex-direction: column-reverse; justify-content: flex-end; gap: 1mm; padding: 0 3mm;
                          border-left: .25mm solid #d2d2d7; }
.qcv-showcase .qcv-slot:first-child { border-left: 0; }
.qcv-showcase .qcv-slot-value { font-size: 4.4mm; font-weight: 600; letter-spacing: -.01em; }
.qcv-showcase .qcv-slot-label { font-size: 2.7mm; letter-spacing: 0; text-transform: none; color: #86868b; }

/* Полночь — black, the photo fading into the dark */
.qcv-midnight { background: #000; color: #f5f5f7; }
.qcv-midnight .qcv-mn-photo { position: absolute; inset: 0 0 auto 0; width: 100%; height: 72%; object-fit: cover;
  -webkit-mask-image: linear-gradient(180deg, #000 45%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(180deg, #000 45%, rgba(0, 0, 0, 0) 100%); }
.qcv-mn-body { position: relative; display: flex; flex-direction: column; height: 100%; padding: 14mm 15mm 15mm;
               box-sizing: border-box; }
.qcv-mn-eyebrow { font-size: 2.7mm; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: #d9bd92; }
.qcv-mn-title { font-family: var(--font); margin: 2.4mm 0 0; font-size: 16mm; font-weight: 700; line-height: 1.02;
                letter-spacing: -.035em; text-wrap: balance; overflow-wrap: anywhere; color: #f5f5f7;
                background: linear-gradient(180deg, #ffffff 25%, #a1a1a6 100%);
                -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.qcv-mn-sub { margin: 3mm 0 0; max-width: 150mm; font-size: 4.6mm; line-height: 1.35; color: #a1a1a6; }
.qcv-midnight .qcv-slots { margin-top: 9mm; padding-top: 6mm; border-top: .25mm solid #2c2c2e;
                           grid-template-columns: repeat(auto-fit, minmax(36mm, 1fr)); gap: 5mm 6mm; }
.qcv-midnight .qcv-slot-label { font-size: 2.6mm; letter-spacing: 0; text-transform: none; color: #86868b; }
.qcv-midnight .qcv-slot-value { font-size: 4.3mm; font-weight: 600; }

/* Эссе — a quiet magazine page */
.sheet-cover.qcv-essay { display: flex; flex-direction: column; padding: 11mm 14mm 12mm; background: #f1ece4; color: #2b2622; }
.qcv-es-meta { display: grid; grid-template-columns: 1fr auto 1fr; gap: 4mm; padding-bottom: 3mm;
               border-bottom: .2mm solid rgba(43, 38, 34, .4); font-size: 2.3mm; font-weight: 500; letter-spacing: .24em;
               text-transform: uppercase; }
.qcv-es-meta > :nth-child(2) { text-align: center; }
.qcv-es-meta > :last-child { text-align: right; }
.qcv-es-photo { height: 150mm; margin-top: 8mm; overflow: hidden; }
.qcv-es-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qcv-essay > .qcv-es-main { flex: 1 1 auto; display: grid; grid-template-columns: 1.1fr 1fr; gap: 10mm; margin-top: 9mm;
                            min-height: 0; }
.qcv-es-title { margin: 0; font-family: var(--qcv-serif); font-weight: 400; font-size: 14mm;
                line-height: 1.02; letter-spacing: -.01em; text-wrap: balance; overflow-wrap: anywhere; }
.qcv-es-sub { margin: 3mm 0 0; font-family: var(--qcv-serif); font-style: italic; font-size: 4.6mm;
              line-height: 1.3; color: color-mix(in srgb, currentColor 80%, transparent); }
.qcv-es-intro { margin: 3mm 0 0; font-size: 3mm; line-height: 1.55; color: color-mix(in srgb, currentColor 80%, transparent); }
.qcv-essay .qcv-slots { display: flex; flex-direction: column; gap: 0; align-self: start; }
.qcv-essay .qcv-slot { gap: .6mm; padding: 2mm 0 2.2mm; border-top: .2mm solid rgba(43, 38, 34, .25); }
.qcv-essay .qcv-slot-label { font-size: 2.1mm; font-weight: 500; letter-spacing: .22em; color: color-mix(in srgb, currentColor 60%, transparent); }
.qcv-essay .qcv-slot-value { font-family: var(--qcv-serif); font-weight: 400; font-size: 4.2mm; }
.qcv-es-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 6mm; margin-top: 6mm;
               padding-top: 3mm; border-top: .2mm solid rgba(43, 38, 34, .4); font-size: 2.6mm; letter-spacing: .06em; }

/* Атлас — a Swiss grid */
.qcv-atlas { display: grid; grid-template-columns: 1fr 1fr; background: #fff; color: #111; }
.qcv-atl-text { display: flex; flex-direction: column; min-width: 0; padding: 13mm 9mm 13mm 13mm; }
.qcv-atl-num { margin-top: 16mm; font-size: 21mm; font-weight: 200; line-height: .9; letter-spacing: -.045em;
               overflow-wrap: anywhere; }
.qcv-atl-mark { width: 9mm; height: 9mm; margin-top: 7mm; background: var(--brand-1, #d8402a); }
.qcv-atl-eyebrow { font-size: 2.3mm; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; }
.qcv-atl-title { font-family: var(--font); margin: 3mm 0 0; font-size: 10.5mm; font-weight: 800; line-height: 1; letter-spacing: -.035em;
                 text-wrap: balance; overflow-wrap: anywhere; }
.qcv-atl-sub { margin: 2.4mm 0 0; font-size: 3.4mm; line-height: 1.4; color: #555; }
.qcv-atlas .qcv-slots { display: flex; flex-direction: column; gap: 0; margin-top: 8mm; }
.qcv-atlas .qcv-slot { display: grid; grid-template-columns: 26mm minmax(0, 1fr); gap: 2mm; align-items: baseline;
                       padding: 2mm 0 2.4mm; border-top: .35mm solid #111; }
.qcv-atlas .qcv-slot-label { font-size: 2.1mm; font-weight: 600; letter-spacing: .16em; color: inherit; }
.qcv-atlas .qcv-slot-value { font-size: 3.3mm; font-weight: 500; }
.qcv-atl-photo { min-width: 0; height: 100%; overflow: hidden; }
.qcv-atl-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sheet-page-mark, .sheet-page-gap {
  display: flex; align-items: center; gap: var(--sheet-4);
  margin: var(--sheet-8) calc(var(--sheet-pad) * -1); padding: 0 var(--sheet-pad);
  min-height: var(--sheet-10); background: var(--sheet-desk, #ececea);
  font-family: var(--font); font-size: var(--fs-xs); color: var(--ink2);
}
.sheet-page-name { font-weight: 600; }
.sheet-page-rule { color: var(--acc-ink); }
@media print {
  .sheet-page-mark { break-before: page; margin: 0; min-height: 0; padding: 0; background: none; }
  .sheet-page-gap { display: none; }
}
.sheet-outcome { display: flex; flex-direction: column; gap: var(--sheet-8); }
.sheet-outcome-over { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
                    color: var(--sheet-accent); }
.sheet-outcome-title { margin: calc(var(--sheet-8) * -1) 0 0; font-size: var(--fs-h); font-weight: 700; }
.sheet-outcome-box {
  display: flex; justify-content: space-between; align-items: center; gap: var(--sheet-8);
  padding: var(--sheet-10); border-radius: var(--sheet-radius);
  background: var(--sheet-accent); color: var(--sheet-cover-ink); font-size: var(--fs-s);
}
.sheet-outcome-label { font-size: var(--fs-xs); letter-spacing: .12em; text-transform: uppercase; color: color-mix(in srgb, currentColor 85%, transparent);
                     margin-bottom: var(--sheet-4); }
.sheet-outcome-sum { font-size: calc(var(--fs-h) * 1.6); white-space: nowrap; }
.sheet-outcome-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sheet-8); }
.sheet-outcome-fact { padding-top: var(--sheet-5); border-top: 2px solid var(--sheet-accent); }
.sheet-outcome-fact b { display: block; font-size: calc(var(--fs-h) * 1.3); color: var(--sheet-accent); }
.sheet-outcome-fact span { font-size: var(--fs-s); color: var(--sheet-ink-2); }
.sheet-outcome-note { display: grid; grid-template-columns: 34mm 1fr; gap: var(--sheet-8); font-size: var(--fs-s); }
.sheet-outcome-note b { color: var(--sheet-accent); text-transform: uppercase; letter-spacing: .06em; }
.sheet-outcome-cta {
  position: relative;
  display: flex; justify-content: space-between; align-items: center; gap: var(--sheet-8);
  padding: var(--sheet-10); border-radius: var(--sheet-radius);
  background: var(--sheet-cover-bg); color: var(--sheet-cover-ink); font-size: var(--fs-s);
}
/* 15.1044: the accent mark — a straight stripe of its own inside the rounded block, round caps */
.sheet-outcome-cta::before {
  content: "";
  position: absolute; left: var(--sheet-4); top: var(--sheet-8); bottom: var(--sheet-8);
  width: 3px; border-radius: 99px;
  background: var(--sheet-accent);
}
.sheet-outcome-cta b { display: block; font-size: var(--fs-l); margin-bottom: var(--sheet-2); }
.sheet-outcome-cta > span { white-space: nowrap; }
.sheet-page-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: var(--sheet-8);
  padding-bottom: var(--sheet-5); margin-bottom: var(--sheet-8);
  border-bottom: 2px solid var(--sheet-accent);
}
.sheet-page-brand .sheet-logo { max-height: 14mm; }
.sheet-page-people { display: flex; gap: var(--sheet-10); font-size: var(--fs-s); line-height: 1.45; }
.sheet-page-who > div:first-of-type { font-weight: 600; }
.sheet-page-label { display: block; font-size: var(--fs-xs); letter-spacing: .1em; text-transform: uppercase;
                    color: var(--sheet-ink-2); }
.sheet-page-foot {
  display: flex; justify-content: space-between; gap: var(--sheet-8);
  margin-top: var(--sheet-8); padding-top: var(--sheet-4); border-top: 1px solid var(--sheet-line);
  font-size: var(--fs-xs); color: var(--sheet-ink-2);
}
.sheet-pic-frame { max-width: 100%; margin-bottom: var(--sheet-8); }
.sheet-pic-frame > .sheet-photo { margin: 0; }
.sheet-pic-frame.sized > .sheet-photo { width: 100%; max-height: none; }
.sheet-pic-frame.ratio { overflow: hidden; border-radius: var(--sheet-radius); }
.sheet-pic-frame.ratio > .sheet-photo { width: 100%; height: 100%; max-height: none; object-fit: contain; }
.sheet-pic-frame.ratio.fit-cover > .sheet-photo { object-fit: cover; }
.sheet-pic-frame:not(.ratio) > .sheet-photo-slot { aspect-ratio: 3 / 2; min-height: 0; }
.sheet-pic-frame.ratio > .sheet-photo-slot { height: 100%; min-height: 0; }
.sheet-pic-frame:not(.sized):has(> .sheet-photo-slot) { width: 100%; }
.sheet-pic-cap {
  margin-top: var(--sheet-2);
  font-size: var(--fs-s);
  color: var(--sheet-ink-2);
}

.sheet-doc-title { font-size: var(--fs-h); font-weight: 650; line-height: 1.2; text-align: center; }
.sheet-doc-line { display: flex; justify-content: space-between; gap: var(--sheet-10); margin-top: var(--sheet-5); }
.sheet-par { white-space: pre-wrap; text-align: justify; }
.sheet-sec,
.sheet-point { display: flex; gap: var(--sheet-3); }
.sheet-sec { margin: 0; font-size: var(--fs); font-weight: 700; line-height: 1.5; }
.sheet-point { text-align: justify; }
.sheet-point.lvl-3 { padding-left: 10mm; }
.sheet-no { flex: none; min-width: 10mm; }
.sheet-contract .sheet-block + .sheet-block { margin-top: var(--sheet-3); }
.sheet-contract .sheet-block + .sheet-sec,
.sheet-contract .sheet-block + .sheet-parties,
.sheet-contract .sheet-block + .sheet-signs { margin-top: var(--sheet-7); }

.sheet-cond {
  padding: var(--sheet-2) var(--sheet-4);
  border: 1px dashed var(--sheet-line);
  border-radius: var(--sheet-block-radius);
  font-size: var(--fs-s);
  color: var(--sheet-ink-2);
}
.sheet-cond.off { border-style: dotted; }
.sheet-edit .sheet-off { opacity: .55; }

.sheet-parties,
.sheet-signs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sheet-10);
  break-inside: avoid;
  page-break-inside: avoid;
}
.sheet-parties { font-size: var(--fs-s); }
.sheet-party b,
.sheet-sign b { display: block; margin-bottom: var(--sheet-2); font-size: var(--fs); }
.sheet-sign-line { position: relative; margin-top: var(--sheet-9); }
.sheet-autograph {
  position: absolute; left: 6mm; bottom: 2mm;
  max-height: 14mm; max-width: 40mm; object-fit: contain;
}
.sheet-sign-mp { position: relative; margin-top: var(--sheet-5); font-size: var(--fs-s); color: var(--sheet-ink-2); }
.sheet-seal {
  position: absolute; left: 18mm; top: -14mm;
  width: 30mm; height: 30mm; object-fit: contain;
}

.sheet-paper-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sheet-10);
  padding-bottom: var(--sheet-5);
  border-bottom: 1px solid var(--sheet-line);
}
.sheet-paper-logo { max-height: 18mm; max-width: 60mm; object-fit: contain; }
.sheet-paper-req { margin-left: auto; font-size: var(--fs-s); text-align: right; }
.sheet-signlist .sheet-sign-cell { min-width: 30mm; height: 10mm; }
.sheet-contract .sheet-block + .sheet-paper-head,
.sheet-contract .sheet-paper-head + .sheet-block { margin-top: var(--sheet-7); }

.sheet-appendix { break-before: page; page-break-before: always; }
.sheet-appendix-head { margin-bottom: var(--sheet-5); text-align: right; font-size: var(--fs-s); color: var(--sheet-ink-2); }
.sheet-break { break-after: page; page-break-after: always; }
.sheet-break:not(:empty) {
  padding-top: var(--sheet-1);
  border-top: 1px dashed var(--sheet-line);
  font-size: var(--fs-xs);
  color: var(--sheet-ink-2);
  text-align: center;
}

.sheetwork-panel { display: flex; flex-direction: column; gap: var(--gap); min-width: 0; }

.sheetwork-bar {
  display: flex;
  align-items: center;
  gap: var(--sp-150);
  flex-wrap: wrap;
}

.sheetwork-view .sheetview-body > .kp-sheet-host {
  background: none;
  border-radius: 0;
  padding: 0;
}

.sheetwork-lay-card { display: none; }
.sheetwork-lay-list { display: flex; flex-direction: column; }
.sheetwork-lay {
  display: flex;
  align-items: center;
  gap: var(--sp-150);
  min-height: var(--tap);
  padding: var(--sp-075) var(--sp-100);
  border-bottom: var(--bw) solid var(--line);
  border-radius: var(--r-s);
  cursor: var(--cur-grab);
  touch-action: none;
  user-select: none;
}
.sheetwork-lay:last-child { border-bottom: 0; }
.sheetwork-lay-card.always { display: flex; }
.sheetwork-lay.lvl-1 { padding-left: calc(var(--sp-100) + var(--sp-300)); }
.sheetwork-lay.lvl-2 { padding-left: calc(var(--sp-100) + var(--sp-300) * 2); }
.sheetwork-lay.lvl-3 { padding-left: calc(var(--sp-100) + var(--sp-300) * 3); }
.sheetwork-lay.picked { background: var(--fill-acc); color: var(--acc-ink); }

@media (max-width: 700px) {
  .sheetwork-lay-card { display: flex; }
}

/* ═══ Card views and totals of a quick order (15.576: «Всё нравится. Добавь их все в качестве вариантов также как
   обложки добавлял»): the designs of the references page as approved, every rule scoped under `.qv` — a card or the
   totals block on the sheet, a container named «paper», so a design adapts to the width it is shown at (15.558); the
   company colours of the requisites come through `.sheet-brand-colors` (15.575). Generated from the page — edit the
   page's styles and regenerate rather than patch by hand. */
.qv { container: paper / inline-size; margin-bottom: var(--sheet-10); break-inside: avoid; color: #1b1b1d;
      font: 13px/1.5 "Inter", sans-serif; font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1;
      -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.qv * { box-sizing: border-box; }
.qv .num { font-family: inherit; }
.qv.qv-live [data-card][data-v] { cursor: pointer; }
.qv:not(.qv-live) [data-card][data-v] { pointer-events: none; }
/* Fewer photos than a design was drawn for: two fill the mosaic and the thumbnails without a hole */
.qv .k7-mosaic.n2 > div:nth-child(2) { grid-row: span 2; }
.qv .k10-thumbs.n2 > div:nth-child(2) { grid-column: span 2; }
@media print { .qv .reset { display: none; } }
.qv .p-label { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.qv .num { font-variant-numeric: lining-nums tabular-nums; }
/* Digits are always lining (15.559, 15.591: «почему всё ещё уебанский скачущий шрифт там?»): a `font` shorthand of a
   design resets the inherited feature too, so it is held on every node of the designs and covers */
.sheet :is(.qv, .qcv), .sheet :is(.qv, .qcv) * { font-feature-settings: "lnum" 1 !important; }
.qv .cmp { margin: 0; }
.qv .cmp dt, .qv .cmp dd { margin: 0; }
.qv .cmp > div { display: grid; grid-template-columns: var(--cat, 92px) minmax(0, 1fr); align-content: start; gap: 2px 12px; }
.qv .cmp > div.bare { grid-template-columns: minmax(0, 1fr); }
.qv .cmp .alt { display: flex; align-items: baseline; gap: 10px; }
.qv .cmp .alt + .alt { margin-top: 3px; }
.qv .cmp .nm { flex: 1 1 auto; min-width: 0; }
.qv .cmp .q, .qv .cmp .s { flex: none; white-space: nowrap; font-variant-numeric: lining-nums tabular-nums; }
.qv .cmp .q { color: color-mix(in srgb, currentColor 65%, transparent); }
.qv .cmp .vi { display: inline-block; width: 16px; height: 16px; margin-right: 6px; border-radius: 5px; font: normal 700 10px/1 "Inter", sans-serif; }
.qv .vi, .qv .k8-dot, .qv .k5-no, .qv .t4-v i { text-align: center; align-content: center; line-height: 1; text-box: trim-both cap alphabetic; }
@container paper (max-width: 420px) {
.qv .cmp > div { grid-template-columns: minmax(0, 1fr); }
}
.qv .k1 { display: flex; flex-direction: column; gap: 22px; font-family: "Manrope", sans-serif; color: #1d1a17; }
.qv .k1-hero { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; min-height: 350px; padding: 18px 20px 24px; border-radius: 24px; overflow: hidden; background: #2a2622 center 60% / cover no-repeat; color: #fff; }
.qv .k1-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,11,8,0) 30%, rgba(14,11,8,.8)); }
.qv .k1-hero.plain { min-height: 0; background: linear-gradient(135deg, #f3eadc, #dcc7a7); color: #2a2017; }
.qv .k1-hero.plain::after { display: none; }
.qv .k1-top, .qv .k1-cap { position: relative; z-index: 1; }
.qv .k1-top { display: flex; justify-content: space-between; font-size: 12px; }
.qv .k1-pill { padding: 5px 12px; border-radius: 999px; background: rgba(255,255,255,.18); backdrop-filter: blur(10px); letter-spacing: .06em; }
.qv .k1-hero.plain .k1-pill { background: rgba(42,32,23,.08); }
.qv .k1-cap { padding: 0 8px; }
.qv .k1-cap h4 { margin: 0; font: italic 500 56px/1 "Playfair Display", serif; letter-spacing: -.01em; }
.qv .k1-cap p { margin: 10px 0 0; font-size: 13px; color: color-mix(in srgb, currentColor 85%, transparent); }
.qv .k1-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 24px; padding: 0 6px; }
.qv .k1-cols.one { grid-template-columns: minmax(0, 1fr); }
.qv .k1-lead { margin: 0; font: italic 400 18px/1.45 "Playfair Display", serif; }
.qv .k1-note { margin: 8px 0 0; font-size: 12px; color: #8b8178; }
.qv .k1-colors { margin: 14px 0 0; font-size: 12px; }
.qv .k1-colors span { color: #8b8178; margin-right: 8px; }
.qv .k1-comp { --cat: 96px; font-size: 12.5px; }
.qv .k1-comp > div { padding: 7px 0; border-top: 1px solid #ece5da; }
.qv .k1-comp > div:first-child { border-top: 0; padding-top: 0; }
.qv .k1-comp dt { color: #8b8178; font-size: 11px; padding-top: 1px; }
.qv .k1-comp .vi { background: #efe7da; color: #5b4a36; }
.qv .k1-prices { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 10px; }
.qv .k1-price { display: flex; flex-direction: column; padding: 16px 18px; border-radius: 18px; background: linear-gradient(155deg, #f8f4ee, #ebe2d4); }
.qv .k1-price .p-label { color: #8b8178; }
.qv .k1-vname { margin-top: 2px; font-weight: 700; font-size: 14px; }
.qv .k1-sum { margin-top: 12px; font: 600 30px/1 "Playfair Display", serif; font-variant-numeric: lining-nums; }
.qv .k1-off { margin-top: 6px; font-size: 12px; color: #8b8178; }
.qv .k1-off b { color: #7a4b1e; margin-left: 6px; }
.qv .k1-one { flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 24px; }
.qv .k1-one .k1-sum { margin: 0; font-size: 40px; }
@container paper (max-width: 600px) {
.qv .k1-hero { min-height: 280px; }
.qv .k1-cap h4 { font-size: 44px; }
.qv .k1-cols { grid-template-columns: minmax(0, 1fr); gap: 16px; }
.qv .k1-sum { font-size: 26px; }
}
@container paper (max-width: 420px) {
.qv .k1 { gap: 16px; }
.qv .k1-hero { min-height: 230px; border-radius: 18px; gap: 28px; }
.qv .k1-cap h4 { font-size: 34px; }
.qv .k1-prices { grid-template-columns: minmax(0, 1fr); }
.qv .k1-one { flex-direction: column; align-items: flex-start; }
.qv .k1-one .k1-sum { font-size: 32px; }
}
.qv .k2 { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: minmax(92px, auto); gap: 10px; padding: 10px; border-radius: 28px; background: #f0f0f3; font-family: "Manrope", sans-serif; color: #111214; }
.qv .k2 > div { min-width: 0; padding: 16px 18px; border-radius: 20px; background-color: #fff; }
.qv .k2 .p-label { display: block; margin-bottom: 4px; color: #8a8d93; font-size: 10px; letter-spacing: .1em; }
.qv .k2 > .k2-photo { grid-column: span 4; grid-row: span 3; min-height: 300px; padding: 0; background-color: #dcdcdf; background-size: cover; background-position: center; }
.qv .k2-title { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
.qv .k2-title.side { grid-column: span 2; grid-row: span 2; }
.qv .k2-title.side.tall { grid-row: span 3; }
.qv .k2-title.wide { grid-column: span 4; }
.qv .k2-title.wide.full { grid-column: span 6; }
.qv .k2-title small { color: #8a8d93; font-size: 12px; }
.qv .k2-title h4 { margin: 0; font: 800 30px/1.02 "Manrope", sans-serif; letter-spacing: -.03em; }
.qv .k2-size { grid-column: span 2; }
.qv .k2-size b { display: block; font: 800 24px/1.1 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .k2-size small { color: #6b7078; }
.qv .k2-text { grid-column: span 2; font-size: 13px; }
.qv .k2-text em { display: block; margin-top: 6px; color: #8a8d93; font-style: normal; font-size: 12px; }
.qv .k2-text .k2-colors { margin-top: 12px; }
.qv .k2-comp-tile { grid-column: span 4; }
.qv .k2 > .full { grid-column: span 6; }
.qv .k2-comp { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.qv .k2-comp > div { grid-template-columns: minmax(0, 1fr); }
.qv .k2-comp dt { color: #8a8d93; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.qv .k2-comp dd { font-weight: 600; font-size: 12.5px; }
.qv .k2-comp .vi { background: #111214; color: #fff; }
.qv .k2 > .k2-price { grid-column: span var(--span); display: flex; flex-direction: column; justify-content: space-between; gap: 6px; color: #fff; }
/* The program's share tints `.tone-N` colour text with its accent; on the sheet these names are the designs' own
   grounds and keep their text colour (15.591: «почему он зелёный на тёмном фоне?») */
.qv :is(.tone-0, .tone-1, .tone-2, .tone-3, .tone-4, .tone-5) { color: inherit; stroke: none; }
.qv .tone-1 { background-image: linear-gradient(150deg, var(--t1a, #2d3552), var(--t1b, #4b5686)); }
.qv .tone-2 { background-image: linear-gradient(150deg, var(--t2a, #24433b), var(--t2b, #3f6b5d)); }
.qv .tone-3 { background-image: linear-gradient(150deg, var(--t3a, #4b3329), var(--t3b, #7f5949)); }
.qv .mono { --t1a: #222a40; --t1b: #333e60; --t2a: #2d3552; --t2b: #4b5686; --t3a: #46527a; --t3b: #6a76a6; }
.qv .k2-price .p-label { color: rgba(255,255,255,.6); }
.qv .k2-price strong { font: 800 26px/1.1 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .k2-price span.v { font-weight: 600; font-size: 14px; }
.qv .k2-price small { color: rgba(255,255,255,.7); font-size: 12px; }
@container paper (max-width: 600px) {
.qv .k2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.qv .k2 > * { grid-column: span 2 !important; grid-row: auto !important; }
.qv .k2 > .k2-photo { min-height: 240px; }
.qv .k2 > .k2-title.side, .qv .k2 > .k2-size { grid-column: span 1 !important; }
.qv .k2 > .k2-title.side.tall { grid-column: span 2 !important; }
.qv .k2 > .k2-price { grid-column: span var(--span-t) !important; }
}
@container paper (max-width: 420px) {
.qv .k2 { padding: 8px; gap: 8px; border-radius: 22px; }
.qv .k2 > * { grid-column: span 2 !important; }
.qv .k2 > .k2-title.side, .qv .k2 > .k2-size { grid-column: span 2 !important; }
.qv .k2 > .k2-price { grid-column: span 2 !important; }
.qv .k2-comp { grid-template-columns: minmax(0, 1fr); }
.qv .k2-title h4 { font-size: 26px; }
}
.qv .k3 { display: flex; flex-direction: column; gap: 18px; padding: 26px; border-radius: 26px; overflow: hidden; color: #ece6da; font-family: "Inter", sans-serif; background: radial-gradient(120% 80% at 0% 0%, #26304a 0%, transparent 60%), radial-gradient(90% 70% at 100% 100%, #3a2c1c 0%, transparent 60%), #0d0f14; }
.qv .k3-photo { height: 300px; border-radius: 18px; background: center / cover no-repeat; box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 24px 60px rgba(0,0,0,.45); }
.qv .k3-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 6px 20px; }
.qv .k3-row small { color: #a69b87; letter-spacing: .14em; font-size: 11px; }
.qv .k3-row > span { color: #a69b87; font-size: 12px; }
.qv .k3 h4 { margin: 4px 0 0; font: 600 44px/1.02 "Playfair Display", serif; background: linear-gradient(100deg, #f4e4c1, #c79b5d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .k3-lead { margin: 0; color: #bdb6a8; max-width: 540px; }
.qv .k3-comp { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; --cat: 84px; font-size: 12px; }
.qv .k3-comp > div { padding: 9px 0; border-top: 1px solid rgba(255,255,255,.1); }
.qv .k3-comp dt { color: #8f877a; font-size: 11px; }
.qv .k3-comp .vi { background: rgba(241,223,184,.16); color: #f1dfb8; }
.qv .k3-prices { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 10px; }
.qv .k3-price { padding: 16px; border-radius: 16px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); }
.qv .k3-price small { color: #a69b87; font-size: 11px; letter-spacing: .1em; }
.qv .k3-price b { display: block; font-weight: 500; margin-top: 2px; }
.qv .k3-price strong { display: block; margin-top: 10px; font: 500 28px/1 "Playfair Display", serif; color: #f1dfb8; font-variant-numeric: lining-nums; }
.qv .k3-price em { font-style: normal; font-size: 12px; color: #a69b87; }
@container paper (max-width: 600px) {
.qv .k3 { padding: 20px; }
.qv .k3-photo { height: 240px; }
.qv .k3 h4 { font-size: 36px; }
.qv .k3-comp { grid-template-columns: minmax(0, 1fr); }
}
@container paper (max-width: 420px) {
.qv .k3 { padding: 16px; border-radius: 20px; }
.qv .k3-photo { height: 200px; }
.qv .k3 h4 { font-size: 30px; }
.qv .k3-prices { grid-template-columns: minmax(0, 1fr); }
}
.qv .k4 { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 28px; padding: 22px; background: #faf7f2; color: #24201b; }
.qv .k4.one { grid-template-columns: minmax(0, 1fr); }
.qv .k4-photo { min-height: 520px; background: center / cover no-repeat; }
.qv .k4-kicker { font-size: 11px; letter-spacing: .2em; color: #8c8073; }
.qv .k4 h4 { margin: 10px 0 0; font: 400 46px/1.02 "Prata", serif; }
.qv .k4.one h4 { font-size: 56px; }
.qv .k4-lead { margin: 18px 0 0; font: 400 15px/1.6 "Lora", serif; }
.qv .k4-note { margin: 8px 0 0; font: italic 400 13px "Lora", serif; color: #8c8073; }
.qv .k4-comp { margin-top: 18px; --cat: 96px; font-size: 12px; }
.qv .k4-comp > div { padding: 6px 0; border-top: 1px solid #e4dccf; }
.qv .k4-comp dt { color: #8c8073; }
.qv .k4-comp .vi { background: transparent; border: 1px solid #b3a796; color: #6d6155; font-family: "Lora", serif; }
.qv .k4-prices { margin-top: 20px; border-top: 2px solid #24201b; }
.qv .k4-prow { display: flex; align-items: baseline; gap: 10px; padding: 10px 0; border-bottom: 1px solid #e4dccf; }
.qv .k4-prow span { font: italic 400 15px "Lora", serif; }
.qv .k4-prow i { flex: 1; min-width: 12px; border-bottom: 1px dotted #b3a796; transform: translateY(-4px); }
.qv .k4-prow strong { font: 400 24px "Prata", serif; font-variant-numeric: lining-nums; white-space: nowrap; }
.qv .k4-prow s { font-size: 12px; color: #8c8073; white-space: nowrap; }
.qv .k4.acc .k4-kicker, .qv .k4.acc .k4-prow span { color: var(--acc); }
.qv .k4.acc h4::after { content: ""; display: block; width: 56px; height: 3px; margin-top: 16px; background: var(--acc); }
.qv .k4.acc .k4-comp .vi { border-color: var(--acc); color: var(--acc); }
.qv .k4.acc .k4-prices { border-top-color: var(--acc); }
@container paper (max-width: 600px) {
.qv .k4 { grid-template-columns: minmax(0, 1fr); gap: 20px; }
.qv .k4-photo { min-height: 280px; }
.qv .k4 h4, .qv .k4.one h4 { font-size: 40px; }
}
@container paper (max-width: 420px) {
.qv .k4 { padding: 16px; }
.qv .k4-photo { min-height: 220px; }
.qv .k4 h4, .qv .k4.one h4 { font-size: 32px; }
.qv .k4-prow { flex-wrap: wrap; }
.qv .k4-prow i { display: none; }
.qv .k4-prow span { flex: 1 0 100%; }
}
.qv .k5 { padding: 22px; border-radius: 30px; color: #2b2a33; font-family: "Onest", sans-serif; background: radial-gradient(70% 60% at 0% 0%, #efe3d8 0%, transparent 70%), radial-gradient(60% 60% at 100% 0%, #e4e3ea 0%, transparent 70%), radial-gradient(70% 70% at 100% 100%, #dfe7e3 0%, transparent 70%), radial-gradient(60% 60% at 0% 100%, #ebe6da 0%, transparent 70%), #f5f1ec; }
.qv .k5-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 22px; }
.qv .k5-grid.one { grid-template-columns: minmax(0, 1fr); }
.qv .k5-photo { min-height: 340px; border-radius: 24px; background: center / cover no-repeat; border: 6px solid rgba(255,255,255,.75); }
.qv .k5-no { display: inline-block; width: 34px; height: 34px; border-radius: 50%; background: #2b2a33; color: #fff; font: 700 13px "Unbounded", sans-serif; }
.qv .k5 h4 { margin: 14px 0 0; font: 700 32px/1.05 "Unbounded", sans-serif; letter-spacing: -.02em; }
.qv .k5-lead { margin: 12px 0 0; font-size: 14px; }
.qv .k5-colors { margin: 8px 0 0; font-size: 12px; color: color-mix(in srgb, currentColor 75%, transparent); }
.qv .k5-comp { margin-top: 14px; padding: 8px 14px; border-radius: 18px; background: rgba(255,255,255,.62); --cat: 86px; font-size: 12px; }
.qv .k5-comp > div { padding: 6px 0; }
.qv .k5-comp > div + div { border-top: 1px solid rgba(43,42,51,.08); }
.qv .k5-comp dt { color: color-mix(in srgb, currentColor 60%, transparent); }
.qv .k5-comp .vi { background: #2b2a33; color: #fff; }
.qv .k5-prices { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.qv .k5-price { padding: 14px 16px; border-radius: 20px; background: rgba(255,255,255,.8); }
.qv .k5-price small { display: block; font-size: 12px; color: color-mix(in srgb, currentColor 65%, transparent); }
.qv .k5-price strong { display: block; margin-top: 6px; font: 700 22px/1.1 "Unbounded", sans-serif; background: linear-gradient(90deg, #2b2a33, #5d5a6e); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .k5-price em { font-style: normal; font-size: 12px; color: color-mix(in srgb, currentColor 70%, transparent); }
.qv .k5-one { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 22px; }
.qv .k5-one strong { font-size: 28px; margin: 0; }
@container paper (max-width: 600px) {
.qv .k5-grid { grid-template-columns: minmax(0, 1fr); }
.qv .k5-photo { min-height: 260px; }
}
@container paper (max-width: 420px) {
.qv .k5 { padding: 14px; border-radius: 24px; }
.qv .k5 h4 { font-size: 26px; }
.qv .k5-photo { min-height: 220px; }
.qv .k5-prices { grid-template-columns: minmax(0, 1fr); }
.qv .k5-one { flex-direction: column; align-items: flex-start; }
}
.qv .k6 { display: flex; flex-direction: column; gap: 16px; font-family: "Inter", sans-serif; color: #1d1d1f; }
.qv .k6-top { text-align: center; }
.qv .k6-top small { color: #86868b; font-size: 13px; }
.qv .k6 h4 { margin: 4px 0 0; font: 700 36px/1.08 "Inter", sans-serif; letter-spacing: -.03em; }
.qv .k6-sub { margin: 8px auto 0; max-width: 520px; color: #6e6e73; font-size: 14px; }
.qv .k6-photo { height: 300px; border-radius: 22px; background: center 55% / cover no-repeat; }
.qv .k6-cols { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 12px; }
.qv .k6-col { display: flex; flex-direction: column; gap: 8px; padding: 18px; border-radius: 18px; background: #f5f5f7; }
.qv .k6-col small { color: #86868b; font-size: 12px; }
.qv .k6-col b { font-size: 19px; letter-spacing: -.01em; }
.qv .k6-diff { margin: 0; padding: 10px 0 0; border-top: 1px solid #e3e3e8; list-style: none; font-size: 12px; color: #3a3a3c; }
.qv .k6-diff li + li { margin-top: 6px; }
.qv .k6-diff li span { display: block; color: #86868b; font-size: 11px; }
.qv .k6-col strong { margin-top: auto; padding-top: 6px; font: 600 24px/1.1 "Inter", sans-serif; letter-spacing: -.02em; }
.qv .k6-col em { font-style: normal; font-size: 12px; color: #86868b; }
.qv .k6-common { padding: 14px 16px; border-radius: 16px; border: 1px solid #e3e3e8; }
.qv .k6-common small { color: #86868b; font-size: 12px; }
.qv .k6-common .cmp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 16px; margin-top: 8px; font-size: 12px; }
.qv .k6-common .cmp > div { grid-template-columns: minmax(0, 1fr); }
.qv .k6-common dt { color: #86868b; font-size: 11px; }
.qv .k6-note { margin: 0; font-size: 12px; color: #86868b; }
@container paper (max-width: 600px) {
.qv .k6 h4 { font-size: 30px; }
.qv .k6-photo { height: 240px; }
.qv .k6-common .cmp { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container paper (max-width: 420px) {
.qv .k6 h4 { font-size: 26px; }
.qv .k6-photo { height: 200px; border-radius: 18px; }
.qv .k6-cols { grid-template-columns: minmax(0, 1fr); }
.qv .k6-common .cmp { grid-template-columns: minmax(0, 1fr); }
}
.qv .k7 { display: flex; flex-direction: column; gap: 18px; font-family: "Tenor Sans", sans-serif; color: #232622; }
.qv .k7-mosaic { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 170px 170px; gap: 8px; }
.qv .k7-mosaic.n1 { grid-template-columns: 1fr; grid-template-rows: 300px; }
.qv .k7-mosaic > div { position: relative; overflow: hidden; border-radius: 18px; background: center / cover no-repeat; }
.qv .k7-mosaic:not(.n1) > div:first-child { grid-row: span 2; }
.qv .k7-badge { position: absolute; left: 14px; bottom: 14px; right: 14px; padding: 14px 16px; border-radius: 14px; color: #fff; background: rgba(20,22,18,.42); backdrop-filter: blur(14px); }
.qv .k7-badge small, .qv .k7-head small { color: color-mix(in srgb, currentColor 80%, transparent); font-size: 11px; letter-spacing: .14em; }
.qv .k7-badge h4, .qv .k7-head h4 { margin: 4px 0 0; font: 400 30px/1.05 "Tenor Sans", sans-serif; }
.qv .k7-head { padding: 22px 24px; border-radius: 18px; background: linear-gradient(120deg, #2f3a2e, #56654f); color: #f3f1ea; }
.qv .k7-head h4 { font-size: 36px; }
.qv .k7-comp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 18px; font-size: 12px; }
.qv .k7-comp > div { grid-template-columns: minmax(0, 1fr); }
.qv .k7-comp dt { color: #8a8e86; font-size: 10px; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 3px; }
.qv .k7-comp .vi { background: #2f3a2e; color: #f3f1ea; }
.qv .k7-lead { margin: 0; font-family: "Inter", sans-serif; font-size: 13px; color: #4a4e47; }
.qv .k7-band { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); border-radius: 18px; overflow: hidden; color: #f3f1ea; }
.qv .k7-band > div { padding: 16px 18px; background: linear-gradient(140deg, var(--a), var(--b)); }
.qv .k7-band > div:nth-child(1) { --a: #2f3a2e; --b: #4b5a46; }
.qv .k7-band.multi > div:nth-child(2) { --a: #2c3a47; --b: #4a5e70; }
.qv .k7-band.multi > div:nth-child(3) { --a: #4a3a2c; --b: #6f5a45; }
.qv .k7-band:not(.multi) > div:nth-child(2) { --a: #3d4b3b; --b: #586954; }
.qv .k7-band:not(.multi) > div:nth-child(3) { --a: #4d5c49; --b: #6a7c64; }
.qv .k7-band > div + div { border-left: 1px solid rgba(255,255,255,.16); }
.qv .k7-band small { font-size: 11px; letter-spacing: .12em; color: color-mix(in srgb, currentColor 70%, transparent); }
.qv .k7-band b { display: block; font-weight: 400; font-size: 14px; }
.qv .k7-band strong { display: block; margin-top: 8px; font: 400 24px/1 "Tenor Sans", sans-serif; }
.qv .k7-band em { font-style: normal; font-size: 11px; color: color-mix(in srgb, currentColor 75%, transparent); }
@container paper (max-width: 600px) {
.qv .k7-mosaic { grid-template-rows: 140px 140px; }
.qv .k7-comp { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container paper (max-width: 420px) {
.qv .k7-mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: 220px 110px; }
.qv .k7-mosaic:not(.n1) > div:first-child { grid-row: auto; grid-column: span 2; }
.qv .k7-badge h4, .qv .k7-head h4 { font-size: 24px; }
.qv .k7-comp { grid-template-columns: minmax(0, 1fr); }
.qv .k7-band { grid-template-columns: minmax(0, 1fr); }
.qv .k7-band > div + div { border-left: 0; border-top: 1px solid rgba(255,255,255,.16); }
}
.qv .k8 { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 26px; font-family: "Montserrat", sans-serif; color: #26282b; }
.qv .k8.one { grid-template-columns: minmax(0, 1fr); }
.qv .k8-photo { min-height: 420px; background: #efeae2 center / cover no-repeat; border-radius: 4px; }
.qv .k8-code { font-size: 11px; letter-spacing: .18em; color: #9a9da3; }
.qv .k8 h4 { margin: 6px 0 0; font: 300 36px/1.08 "Montserrat", sans-serif; letter-spacing: -.01em; }
.qv .k8-lead { margin: 12px 0 0; font-family: "Inter", sans-serif; font-size: 13px; color: #55585d; }
.qv .k8-comp { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; margin-top: 18px; padding-top: 16px; border-top: 1px solid #e3e1dc; font-size: 12px; }
.qv .k8.one .k8-comp { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.qv .k8-comp > div { grid-template-columns: minmax(0, 1fr); }
.qv .k8-comp dt { font-size: 10px; letter-spacing: .14em; color: #9a9da3; margin-bottom: 2px; text-transform: uppercase; }
.qv .k8-comp .vi { background: #26282b; color: #fff; border-radius: 50%; }
.qv .k8-prices { margin-top: 18px; }
.qv .k8-prow { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid #e3e1dc; }
.qv .k8-dot { flex: none; display: block; width: 26px; height: 26px; border-radius: 50%; background: #26282b; color: #fff; font: normal 600 11px "Inter", sans-serif; }
.qv .k8-prow span { flex: 1; font-size: 14px; }
.qv .k8-prow strong { font: 300 26px "Montserrat", sans-serif; letter-spacing: -.01em; white-space: nowrap; }
.qv .k8-prow s { font-size: 11px; color: #9a9da3; white-space: nowrap; }
.qv .k8.acc .k8-code { color: var(--acc); }
.qv .k8.acc .k8-dot, .qv .k8.acc .k8-comp .vi { background: var(--acc); }
.qv .k8.acc .k8-comp { border-top: 2px solid var(--acc); }
@container paper (max-width: 600px) {
.qv .k8 { grid-template-columns: minmax(0, 1fr); gap: 18px; }
.qv .k8-photo { min-height: 280px; }
.qv .k8.one .k8-comp { grid-template-columns: 1fr 1fr; }
}
@container paper (max-width: 420px) {
.qv .k8 h4 { font-size: 30px; }
.qv .k8-photo { min-height: 220px; }
.qv .k8-comp, .qv .k8.one .k8-comp { grid-template-columns: minmax(0, 1fr); }
.qv .k8-prow strong { font-size: 22px; }
.qv .k8-prow s { display: none; }
}
.qv .k9 { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 22px; font-family: "Manrope", sans-serif; color: #15171a; }
.qv .k9.one { grid-template-columns: minmax(0, 1fr); }
.qv .k9-photo { position: relative; min-height: 470px; border-radius: 22px; overflow: hidden; background: center / cover no-repeat; }
.qv .k9-photo span { position: absolute; left: 14px; top: 14px; padding: 5px 11px; border-radius: 999px; background: #fff; font-size: 12px; font-weight: 600; }
.qv .k9 h4 { margin: 0; font: 800 28px/1.1 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .k9-sub { margin: 6px 0 0; color: #6b7078; font-size: 13px; }
.qv .k9-group { margin-top: 16px; }
.qv .k9-group > small { color: #6b7078; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.qv .k9-opts { display: grid; gap: 6px; margin-top: 6px; }
.qv .k9-opt { display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid #e2e4e8; font-size: 13px; }
.qv .k9-opt b { font-weight: 600; }
.qv .k9-opt span { color: #6b7078; white-space: nowrap; }
.qv .k9-same { margin-top: 6px; padding: 8px 12px; border-radius: 12px; background: #f3f4f6; --cat: 90px; font-size: 12px; }
.qv .k9-same > div { padding: 4px 0; }
.qv .k9-same dt { color: #6b7078; }
.qv .k9-total { margin-top: 16px; padding: 16px; border-radius: 16px; background: #15171a; color: #fff; }
.qv .k9-total div { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 12px; padding: 3px 0; font-size: 13px; }
.qv .k9-total strong { font: 700 20px "Manrope", sans-serif; }
.qv .k9-total s { color: #9aa0a8; font-size: 12px; margin-right: 6px; }
@container paper (max-width: 600px) {
.qv .k9 { grid-template-columns: minmax(0, 1fr); }
.qv .k9-photo { min-height: 260px; }
}
@container paper (max-width: 420px) {
.qv .k9-photo { min-height: 210px; }
.qv .k9 h4 { font-size: 24px; }
}
.qv .k10 { font-family: "Inter", sans-serif; color: #17191c; }
.qv .k10-head { display: flex; gap: 18px; align-items: flex-end; padding-bottom: 12px; border-bottom: 2px solid #17191c; }
.qv .k10-head b { font: 200 54px/.85 "Inter", sans-serif; letter-spacing: -.04em; }
.qv .k10-head h4 { margin: 0; font: 700 24px/1.1 "Inter", sans-serif; letter-spacing: -.02em; }
.qv .k10-head p { margin: 4px 0 0; color: #646a72; font-size: 12px; }
.qv .k10-mid { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 20px; margin-top: 16px; }
.qv .k10-mid.one { grid-template-columns: minmax(0, 1fr); }
.qv .k10-thumbs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.qv .k10-thumbs div { height: 96px; border-radius: 6px; background: center / cover no-repeat; }
.qv .k10-thumbs div:first-child { grid-column: span 2; height: 150px; }
.qv .k10-info { display: grid; grid-template-columns: max-content 1fr; gap: 4px 16px; font-size: 12px; margin: 0; }
.qv .k10-info dt { color: #646a72; }
.qv .k10-info dd { margin: 0; }
.qv .k10-lead { margin: 10px 0 0; font-size: 12px; color: #3f444b; }
.qv .k10 table { width: 100%; margin-top: 16px; border-collapse: collapse; font-size: 12px; table-layout: fixed; }
.qv .k10 col.c0 { width: 16%; }
.qv .k10 th { padding: 8px 10px; text-align: left; font-weight: 600; color: #646a72; border-bottom: 1px solid #17191c; font-size: 11px; }
.qv .k10 td { padding: 7px 10px; border-bottom: 1px solid #e6e8eb; vertical-align: top; overflow-wrap: anywhere; }
.qv .k10 .r { text-align: right; }
.qv .k10 .r.num, .qv .k10 td b { white-space: nowrap; }
.qv .k10 td.g { font-weight: 600; }
.qv .k10 td.q, .qv .k10 th.q { text-align: right; white-space: nowrap; color: #646a72; }
.qv .k10 td.diff { background: #f3f6f5; }
.qv .k10 tfoot td { padding: 10px; border-top: 2px solid #17191c; border-bottom: 0; font-weight: 700; font-size: 14px; }
.qv .k10 tfoot tr.off td { font-weight: 400; font-size: 12px; color: #646a72; border-top: 0; padding-top: 0; }
@container paper (max-width: 600px) {
.qv .k10-mid { grid-template-columns: minmax(0, 1fr); }
.qv .k10-thumbs { grid-template-columns: repeat(3, 1fr); }
.qv .k10-thumbs div, .qv .k10-thumbs div:first-child { grid-column: auto; height: 110px; }
.qv .k10 table { font-size: 11px; }
}
@container paper (max-width: 420px) {
.qv .k10-head b { font-size: 40px; }
.qv .k10-head h4 { font-size: 20px; }
.qv .k10 table, .qv .k10 tbody, .qv .k10 tfoot, .qv .k10 tr, .qv .k10 td { display: block; width: auto; }
.qv .k10 thead, .qv .k10 colgroup { display: none; }
.qv .k10 tr { padding: 8px 0; border-bottom: 1px solid #e6e8eb; }
.qv .k10 td { padding: 2px 0; border: 0; text-align: left !important; background: none !important; }
.qv .k10 td[data-v]::before { content: attr(data-v) " · "; color: #646a72; }
.qv .k10 tfoot tr { border-top: 2px solid #17191c; border-bottom: 0; }
.qv .k10 tfoot td { padding: 2px 0; border: 0; }
}
/* The photo views of a product (15.622; written by hand, not generated from the references page): inside a design's
   photo place, which keeps its size and rounding. «Галерея» and «Ряд» scroll by their buttons on the screen; print shows
   where they stand, without the buttons. */
.qv :has(> .qph) { position: relative; overflow: hidden; }
.qv .qph { position: absolute; inset: 0; z-index: 0; display: grid; gap: 6px; }
.qv .qph-cell { min-width: 0; min-height: 0; border-radius: 6px; background: center / cover no-repeat; }
.qv .qph-single { grid-template: minmax(0, 1fr) / minmax(0, 1fr); }
.qv .qph-catalog { grid-template-rows: minmax(0, 1fr) 26%; }
.qv .qph-catalog.n1 { grid-template-rows: minmax(0, 1fr); }
.qv .qph-thumbs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; min-height: 0; }
.qv .qph-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr); }
.qv .qph-tiles.n1 > .qph-cell { grid-column: span 6; }
.qv .qph-tiles:is(.n2, .n4) > .qph-cell { grid-column: span 3; }
.qv .qph-tiles.n3 > .qph-cell { grid-column: span 2; }
.qv .qph-tiles.n5 > .qph-cell { grid-column: span 2; }
.qv .qph-tiles.n5 > .qph-cell:nth-child(-n + 2) { grid-column: span 3; }
.qv .qph-accent.n2 { grid-template-columns: 2fr 1fr; }
.qv .qph-accent.n3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.qv .qph-accent.n3 > .qph-cell:first-child { grid-row: span 2; }
.qv :is(.qph-gallery, .qph-row) { display: block; }
.qv .qph-track { display: flex; gap: 6px; height: 100%; overflow-x: auto; scroll-snap-type: x mandatory;
                 scrollbar-width: none; }
.qv .qph-track::-webkit-scrollbar { display: none; }
.qv .qph-track > .qph-cell { flex: 1 1 0; scroll-snap-align: start; }
.qv .qph-gallery:not(.n1) > .qph-track { padding-inline: 11%; scroll-padding-inline: 11%; }
.qv .qph-gallery:not(.n1) > .qph-track > .qph-cell { flex: 0 0 78%; scroll-snap-align: center; }
.qv .qph-row:is(.n4, .n5) > .qph-track > .qph-cell { flex: 0 0 calc((100% - 18px) / 3.4); }
.qv .qph-nav { position: absolute; top: 50%; z-index: 2; display: grid; place-items: center; width: 28px; height: 28px;
               padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .9); color: #1b1b1d;
               box-shadow: 0 2px 8px rgba(0, 0, 0, .25); transform: translateY(-50%); cursor: pointer; }
.qv .qph-prev { left: 8px; }
.qv .qph-next { right: 8px; }
@media print { .qv .qph-nav { display: none; } }
/* The mark that the next card is on the next sheet (15.645, 23.10: «маленькая плашечка после карточки, которая будет
   сообщать, что следующая карточка на следующем листе… Её оформить красиво, стильно»): put by the print's pagination
   after the card a page break follows; a quiet line with the words in a chip in its middle. */
.sheet .qv-next { display: flex; align-items: center; gap: var(--sheet-5); margin: calc(var(--sheet-4) - var(--sheet-10)) 0 0;
                  color: #8a8378; font: 500 8px/1 "Inter", sans-serif; letter-spacing: .16em; text-transform: uppercase;
                  break-inside: avoid; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.sheet .qv-next::before, .sheet .qv-next::after { content: ""; flex: 1 1 0; height: 1px; }
.sheet .qv-next::before { background: linear-gradient(90deg, rgba(138, 131, 120, 0), rgba(138, 131, 120, .45)); }
.sheet .qv-next::after { background: linear-gradient(90deg, rgba(138, 131, 120, .45), rgba(138, 131, 120, 0)); }
.sheet .qv-next-chip { display: inline-flex; align-items: center; gap: var(--sheet-3); padding: var(--sheet-3) var(--sheet-7);
                       border: 1px solid rgba(138, 131, 120, .28); border-radius: 999px; background: #faf8f5; white-space: nowrap; }
.sheet .qv-next-chip svg { width: 10px; height: 10px; stroke-width: 2.2; }
/* The multi-order sheet on a screen follows the width it is shown at, up to A4 (15.562, 21.10: «Они должны быть
   адаптивными относительно размеров и пропорций экрана… На печати естественно они адаптируются под лист А4»): the
   cards and totals adapt by their container queries, the paper's air shrinks with the width, the cover keeps its A4
   layout scaled to the width (`zoom` by the share `--fluid-k`, worked out by CSS alone — the interactive file needs no
   script for it); print and its measure lay out a copy elsewhere and stay A4. */
:is(.kp-sheet-host, .ipf):has(> .sheet.sheet-quick) { container-type: inline-size; }
:is(.kp-sheet-host, .ipf) > .sheet.sheet-quick {
  --fluid-k: min(1, tan(atan2(100cqw, 210mm)));
  --sheet-pad: calc(14mm * var(--fluid-k));
  box-sizing: border-box; width: min(210mm, 100%); width: min(210mm, 100cqw); max-width: 100%;
}
:is(.kp-sheet-host, .ipf) > .sheet.sheet-quick > .sheet-cover {
  --sheet-pad: 14mm;
  box-sizing: border-box; width: auto; margin: -14mm -14mm 14mm; zoom: var(--fluid-k);
}
/* Free blocks of the proposal (15.660; written by hand): a picture, a title and a text between the cards, where their
   rules put them; an empty one shows its place only on the sample sheet of «Макет листа». */
.sheet .qv-free { display: flex; flex-direction: column; gap: var(--sheet-4); }
.sheet .qv-free-pic { display: block; width: 100%; aspect-ratio: 16 / 7; object-fit: cover; border-radius: var(--sheet-radius); }
.sheet .qv-free-title { margin: 0; font: 600 18px/1.3 "Inter", sans-serif; text-wrap: balance; }
.sheet .qv-free-text { margin: 0; color: #4a463f; white-space: pre-line; }
/* «Цифры и примечание» and «Призыв с контактом» (15.732): the large figures in the sheet's accent with their captions
   between two hairlines, the note under them; the call — a dark band with the contact of the order's lead */
.sheet .qv-facts { gap: var(--sheet-6, 14px); }
.sheet .qv-facts-row { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 12px 24px;
  padding: 14px 0; border-block: 1px solid color-mix(in srgb, var(--brand-1, var(--sheet-accent, #c65221)) 55%, transparent); }
.sheet .qv-fact { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.sheet .qv-fact-value { font: var(--fb-sums-w, 500) 34px/1.05 var(--fb-sums, "Inter", sans-serif);
  color: var(--brand-1, var(--sheet-accent, #c65221)); white-space: nowrap; }
.sheet .qv-fact-caption { font-family: var(--fb-text, inherit); font-size: 12.5px; line-height: 1.35; color: #3a362f; }
.sheet .qv-facts-note { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 16px; align-items: baseline; }
.sheet .qv-facts-label { font: var(--fb-title-w, 700) 16px/1.2 var(--fb-title, "Inter", sans-serif); text-transform: uppercase;
  letter-spacing: .02em; color: var(--brand-1, var(--sheet-accent, #c65221)); }
.sheet .qv-facts-note .qv-free-text { font-family: var(--fb-text, inherit); color: #24201b; font-size: 12.5px; line-height: 1.45; }
/* the call's band in the second company colour with the ink that reads on it, its edge in the first (15.745) */
.sheet .qv-cta { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px;
  padding: 18px 22px; background: var(--brand-2, #2d2c2e); color: var(--brand-ink-2, #fff);
  border-left: 4px solid var(--brand-1, var(--sheet-accent, #c65221)); }
.sheet .qv-cta-main { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.sheet .qv-cta-title { margin: 0; font: var(--fb-title-w, 700) 22px/1.2 var(--fb-title, "Playfair Display", Georgia, serif); }
.sheet .qv-cta-text { margin: 0; font: 400 12.5px/1.4 var(--fb-text, "Lora", Georgia, serif);
  color: color-mix(in srgb, currentColor 80%, transparent); }
.sheet .qv-cta-side { display: flex; flex-direction: column; gap: 2px; text-align: left; }
.sheet .qv-cta-name { font: var(--fb-names-w, 600) 16px/1.3 var(--fb-names, "Playfair Display", Georgia, serif); }
.sheet .qv-cta-phone { font: var(--fb-sums-w, 500) 16px/1.3 var(--fb-sums, "Playfair Display", Georgia, serif);
  color: color-mix(in srgb, var(--brand-1, var(--sheet-accent, #c65221)) 60%, currentColor); }
.sheet .qv-cta-line { margin-top: 4px; font-family: var(--fb-text, inherit); font-size: 11px;
  color: color-mix(in srgb, currentColor 80%, transparent); }
@container paper (max-width: 560px) {
  .sheet .qv-facts-row { grid-template-columns: minmax(0, 1fr); }
  .sheet .qv-facts-note { grid-template-columns: minmax(0, 1fr); }
}
.sheet .qv-free.is-empty { padding: var(--sheet-10); border: 1px dashed rgba(138, 131, 120, .5);
                           border-radius: var(--sheet-radius); color: #8a8378; text-align: center; }
/* The room between the blocks — a setting of the whole sheet (15.660); the carry-over mark keeps its place under the card */
.sheet.qv-gap-tight > .qv { margin-bottom: var(--sheet-5); }
.sheet.qv-gap-tight > .qv-next { margin-top: calc(var(--sheet-4) - var(--sheet-5)); }
.sheet.qv-gap-loose > .qv { margin-bottom: var(--sheet-16); }
.sheet.qv-gap-loose > .qv-next { margin-top: calc(var(--sheet-4) - var(--sheet-16)); }

/* The company's own faces and colours of a card's parts (15.639; written by hand, not generated): `vf-<part>` and
   `vc-<part>` on the card mark the part, `--vf-<part>` and `--vc-<part>` carry the face and the colour; `-upright` — a
   face without an italic, `-regular` — a face of one weight. The design's root is the card's only child. */
.qv.qv-card.vf-text > * { font-family: var(--vf-text); }
.qv.qv-card.vf-title h4 { font-family: var(--vf-title); }
.qv.qv-card.vf-title-upright h4 { font-style: normal; }
.qv.qv-card.vf-title-regular h4 { font-weight: 400; }
.qv.qv-card.vf-lead :is(.k1-lead, .k1-note, .k2-text, .k3-lead, .k4-lead, .k4-note, .k5-lead, .k6-sub, .k6-note, .k7-lead,
                        .k8-lead, .k9-lead, .k10-lead, .k11-lead, .k12-lead, .k13-lead, .k14-lead, .k15-lead,
                        .k11-comp, .k14-comp, .k15-same, .k16-lead, .k17-lead, .k18-lead, .k19-lead, .k20-lead, .k16-comp, .k17-comp, .k18-comp, .k19-comp, .k20-comp) { font-family: var(--vf-lead); }
.qv.qv-card.vf-lead-upright :is(.k1-lead, .k4-note) { font-style: normal; }
.qv.qv-card.vf-sums :is(.k1-sum, .k2-price strong, .k3-price strong, .k4-prow strong, .k5-price strong, .k6-col strong,
                        .k7-band strong, .k8-prow strong, .k9-total strong, .k10 tfoot td.num, .k11-prow strong, .k12-prow strong, .k13 tfoot td.num, .k14-prices strong, .k15-col strong, .k16-price strong, .k17-price strong, .k18-price strong, .k19-price strong, .k20-band strong)
  { font-family: var(--vf-sums); }
.qv.qv-card.vf-sums-regular :is(.k1-sum, .k2-price strong, .k5-price strong, .k6-col strong, .k9-total strong,
                                .k10 tfoot td.num) { font-weight: 400; }
.qv.qv-card.vc-ground > * { background: var(--vc-ground); }
.qv.qv-card.vc-ground-grad > * { background: linear-gradient(150deg, var(--vc-ground-a), var(--vc-ground-b)); }
.qv.qv-card:is(.vc-ground, .vc-ground-grad) > :is(.k1, .k6, .k7, .k8, .k9, .k10) { padding: 22px; border-radius: 24px; }
.qv.qv-card.vc-text > * { color: var(--vc-text); }
.qv.qv-card.vc-title h4 { background: none; color: var(--vc-title); }
/* A gradient over the text itself, as «Полночь» draws its title (15.642); the text's own width carries it */
.qv.qv-card.vc-title-grad h4 { width: fit-content; max-width: 100%; color: transparent;
  background: linear-gradient(100deg, var(--vc-title-a), var(--vc-title-b)); -webkit-background-clip: text; background-clip: text; }
.qv.qv-card.vc-sums :is(.k1-sum, .k2-price strong, .k3-price strong, .k4-prow strong, .k5-price strong, .k6-col strong,
                        .k7-band strong, .k8-prow strong, .k9-total strong, .k10 tfoot td.num, .k11-prow strong, .k12-prow strong, .k13 tfoot td.num, .k14-prices strong, .k15-col strong, .k16-price strong, .k17-price strong, .k18-price strong, .k19-price strong, .k20-band strong) {
  background: none; color: var(--vc-sums); }
.qv.qv-card.vc-sums-grad :is(.k1-sum, .k2-price strong, .k3-price strong, .k4-prow strong, .k5-price strong, .k6-col strong,
                             .k7-band strong, .k8-prow strong, .k9-total strong, .k10 tfoot td.num, .k11-prow strong, .k12-prow strong, .k13 tfoot td.num, .k14-prices strong, .k15-col strong, .k16-price strong, .k17-price strong, .k18-price strong, .k19-price strong, .k20-band strong) {
  color: transparent; background: linear-gradient(100deg, var(--vc-sums-a), var(--vc-sums-b));
  -webkit-background-clip: text; background-clip: text; }
.qv.qv-card.vc-sums-grad :is(.k2-price strong, .k3-price strong, .k5-price strong, .k6-col strong, .k7-band strong) {
  width: fit-content; max-width: 100%; }
/* The compact designs (15.715: «нужны более компактные варианты карточек и итогов. По мотивам этих карточек ещё сделай
   вариантов 5 компактных»): «Журнал»'s antiqua, italic labels, leaders and warm paper, a third of its height */
.qv :is(.k11, .k12, .k14, .k15) { background: #faf7f2; color: #24201b; font-family: "Inter", sans-serif; }
.qv :is(.k11, .k12, .k14, .k15) h4 { margin: 2px 0 0; font: 400 24px/1.1 "Prata", serif; }
.qv :is(.k11-kicker, .k12-kicker, .k14-kicker, .k15-kicker) { font-size: 10px; letter-spacing: .18em; color: #8c8073; }
.qv :is(.k11-lead, .k12-lead, .k14-lead, .k15-lead, .k13-lead) { margin: 6px 0 0; font: 400 13px/1.5 "Lora", serif; }
.qv :is(.k11-comp, .k14-comp) { margin: 6px 0 0; font: 400 12px/1.55 "Lora", serif; color: #4a4239; }
.qv :is(.k11-comp, .k14-comp) em { font-style: normal; color: #8c8073; }
/* The quantity and the price after a name in the compact designs (15.734) */
.qv :is(.k11-comp, .k14-comp, .k13, .k15-col, .k15-same, .k16-comp, .k17-comp, .k18-comp, .k19-comp, .k20-comp) :is(.q, .s) {
  white-space: nowrap; color: color-mix(in srgb, currentColor 62%, transparent); }
.qv :is(.k11, .k12, .k14, .k15) .vi { display: inline-block; width: 15px; height: 15px; margin: 0 4px 0 2px; border-radius: 4px;
  border: 1px solid #b3a796; color: #6d6155; font: normal 600 9px/13px "Inter", sans-serif; text-align: center; }
.qv :is(.k11-prow, .k12-prow) { display: flex; align-items: baseline; gap: 8px; padding: 5px 0; border-bottom: 1px solid #e4dccf; }
.qv :is(.k11-prow, .k12-prow) span { font: italic 400 13px "Lora", serif; }
.qv :is(.k11-prow, .k12-prow) i { flex: 1; min-width: 10px; border-bottom: 1px dotted #b3a796; transform: translateY(-3px); }
.qv :is(.k11-prow, .k12-prow) s { font-size: 11px; color: #8c8073; white-space: nowrap; }
.qv :is(.k11-prow, .k12-prow) strong { font: 400 18px "Prata", serif; font-variant-numeric: lining-nums; white-space: nowrap; }
.qv :is(.k11, .k12, .k14, .k15).acc :is(.k11-kicker, .k12-kicker, .k14-kicker, .k15-kicker, .k11-prow span, .k12-prow span) { color: var(--acc); }
/* Строка: a thumbnail, the words, the prices — one row */
.qv .k11 { display: grid; grid-template-columns: 116px minmax(0, 1fr) minmax(200px, 260px); gap: 18px; align-items: start; padding: 14px; }
.qv .k11-photo { height: 116px; background: center / cover no-repeat; }
.qv .k11-prices { border-top: 2px solid #24201b; }
.qv .k11:not(:has(.k11-photo)) { grid-template-columns: minmax(0, 1fr) minmax(200px, 260px); }
/* Колонка: the photo as a band, the composition in two columns */
.qv .k12 { padding: 16px; }
.qv .k12-photo { height: 150px; margin-bottom: 12px; background: center / cover no-repeat; }
.qv .k12-comp { margin-top: 10px; --cat: 82px; font-size: 11.5px; columns: 2; column-gap: 22px; }
.qv .k12-comp > div { padding: 4px 0; border-top: 1px solid #e4dccf; break-inside: avoid; }
.qv .k12-comp dt { color: #8c8073; }
.qv .k12-prices { margin-top: 10px; border-top: 2px solid #24201b; }
/* Ведомость: a small table under a small head */
.qv .k13 { padding: 12px 0; color: #24201b; font-family: "Inter", sans-serif; }
.qv .k13-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.qv .k13-thumb { flex: none; width: 56px; height: 56px; border-radius: 6px; background: center / cover no-repeat; }
.qv .k13-head small { font-size: 10px; letter-spacing: .14em; color: #8c8073; text-transform: uppercase; }
.qv .k13 h4 { margin: 0; font: 400 20px/1.15 "Prata", serif; }
.qv .k13-head p { margin: 2px 0 0; font-size: 11px; color: #8c8073; }
/* 15.837 («почему суммы в разных местах»): the variants' columns of equal width after the fixed first one — the sums of
   every card stand on the same places, not where the names' lengths pushed them */
.qv .k13 table { width: 100%; border-collapse: collapse; font-size: 11.5px; table-layout: fixed; }
.qv .k13 col.g { width: 90px; }
.qv .k13 th { padding: 4px 6px; border-bottom: 1px solid #24201b; color: #8c8073; font: italic 400 11px "Lora", serif; text-align: left; }
.qv .k13 td { padding: 4px 6px; border-bottom: 1px solid #ece5da; vertical-align: top; overflow-wrap: anywhere; }
.qv .k13 td.g { width: 90px; color: #8c8073; }
.qv .k13 tbody tr:nth-child(even) td { background: #faf7f2; }
.qv .k13 tfoot td { padding: 6px; border: 0; border-top: 2px solid #24201b; font: italic 400 12px "Lora", serif; }
.qv .k13 tfoot td.num { font: 400 17px "Prata", serif; font-variant-numeric: lining-nums; white-space: nowrap; }
/* Заметка: words only, the prices in one line */
.qv .k14 { padding: 14px 16px; border-left: 3px solid #24201b; }
.qv .k14.acc { border-left-color: var(--acc); }
.qv .k14-prices { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 8px 0 0; }
.qv .k14-prices em { font: italic 400 13px "Lora", serif; color: #6d6155; }
.qv .k14-prices strong { font: 400 18px "Prata", serif; font-variant-numeric: lining-nums; white-space: nowrap; }
.qv .k14-prices > i { color: #b3a796; font-style: normal; }
/* Дуэт: the photo and the variants side by side, what differs listed under each */
.qv .k15 { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 18px; padding: 14px; }
.qv .k15:not(:has(.k15-photo)) { grid-template-columns: minmax(0, 1fr); }
.qv .k15-photo { min-height: 200px; background: center / cover no-repeat; }
.qv .k15-cols { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 12px; margin-top: 10px; }
.qv .k15-col { display: flex; flex-direction: column; gap: 4px; padding-top: 6px; border-top: 2px solid #24201b; }
.qv .k15-col > span { font: italic 400 13px "Lora", serif; color: #6d6155; }
.qv .k15.acc .k15-col { border-top-color: var(--acc); }
.qv .k15-col ul { margin: 0; padding: 0; list-style: none; font-size: 11.5px; line-height: 1.45; }
.qv .k15-col strong { margin-top: auto; font: 400 19px "Prata", serif; font-variant-numeric: lining-nums; white-space: nowrap; }
.qv .k15-same { margin: 10px 0 0; font: 400 12px/1.5 "Lora", serif; color: #4a4239; }
.qv .k15-same em { font-style: normal; color: #8c8073; }
@container paper (max-width: 560px) {
  .qv .k11 { grid-template-columns: 84px minmax(0, 1fr); }
  .qv .k11-photo { height: 84px; }
  .qv .k11-prices { grid-column: 1 / -1; }
  .qv .k12-comp { columns: 1; }
  .qv .k15 { grid-template-columns: minmax(0, 1fr); }
  .qv .k15-photo { min-height: 160px; }
}
/* The compact totals (15.715) — the same paper and antiqua */
.qv :is(.t14, .t15, .t16, .t17, .t18) { padding: 16px 18px; background: #faf7f2; color: #24201b; font-family: "Inter", sans-serif; }
.qv :is(.t14, .t15, .t16, .t17, .t18) h4 { margin: 0 0 8px; font: 400 26px/1.05 "Prata", serif; }
.qv :is(.t14, .t15, .t17, .t18) .sums { margin-top: 10px; gap: 0; border: 1px solid #24201b; }
.qv :is(.t14, .t15, .t17, .t18) .sum, .qv :is(.t14, .t15, .t17, .t18) .deltas { padding: 10px 12px; background: none; }
.qv :is(.t14, .t15, .t17, .t18) .sum + .sum, .qv :is(.t14, .t15, .t17, .t18) .deltas { border-left: 1px solid #24201b; }
.qv :is(.t14, .t15, .t17, .t18) .sum small { font-size: 10px; letter-spacing: .14em; color: #8c8073; text-transform: uppercase; }
.qv :is(.t14, .t15, .t17, .t18) .sum strong { margin-top: 2px; font: 400 22px/1 "Prata", serif; }
.qv :is(.t14, .t15, .t17, .t18) .sum em { font-family: "Lora", serif; font-style: italic; color: #6d6155; }
.qv :is(.t14, .t15, .t17, .t18) .sums.diff { grid-template-columns: minmax(0, 1fr); }
.qv :is(.t14, .t15, .t17, .t18) .sums.diff .deltas { border-left: 0; border-top: 1px solid #24201b; }
/* Строки: a product a line, its variants in columns by number */
.qv .t14-row { display: grid; grid-template-columns: minmax(0, 1fr) repeat(var(--n), minmax(84px, 120px)); gap: 10px;
               align-items: baseline; padding: 6px 0; border-top: 1px solid #e4dccf; }
.qv .t14-name b { font: 400 15px "Prata", serif; }
.qv .t14-name span { display: block; font-size: 11px; color: #8c8073; }
.qv .t14-v { text-align: right; }
.qv .t14-v strong { font: 400 15px "Prata", serif; font-variant-numeric: lining-nums; white-space: nowrap; }
.qv .t14-v small { display: block; font: italic 400 11px "Lora", serif; color: #8c8073; }
.qv .t14-one { grid-column: 2 / -1; text-align: center; }
.qv .t14-v.none { color: #b3a796; }
/* Только итог: the variants' sums alone */
.qv .t15-head small { font-size: 10px; letter-spacing: .18em; color: #8c8073; }
.qv .t15 .sum strong { font-size: 28px; }
/* Ведомость: a small table, every second row shaded */
.qv .t16 { background: #ffffff; }
.qv .t16 table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.qv .t16 th { padding: 4px 6px; border-bottom: 1px solid #24201b; font: italic 400 11px "Lora", serif; color: #8c8073; text-align: left; }
.qv .t16 :is(th, td).r { text-align: right; }
.qv .t16 td { padding: 4px 6px; border-bottom: 1px solid #ece5da; vertical-align: baseline; }
.qv .t16 td.n, .qv .t16 th.n { width: 22px; color: #8c8073; }
.qv .t16 td b { font: 400 13px "Prata", serif; }
.qv .t16 td span { margin-left: 6px; font-size: 10.5px; color: #8c8073; }
.qv .t16 td.num { font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.qv .t16 td.none { color: #b3a796; }
.qv .t16 tbody tr:nth-child(even) td { background: #faf7f2; }
.qv .t16 tfoot td { padding: 6px; border: 0; border-top: 2px solid #24201b; font: italic 400 12px "Lora", serif; }
.qv .t16 tfoot td.num { font: 400 17px "Prata", serif; }
/* Плашки: a product a line, its variants as small plates */
.qv .t17-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px;
               padding: 6px 0; border-top: 1px solid #e4dccf; }
.qv .t17-row b { font: 400 15px "Prata", serif; }
.qv .t17-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.qv .t17-chip { display: inline-flex; align-items: baseline; gap: 8px; padding: 4px 10px; border: 1px solid #d8cdbd; border-radius: 999px; }
.qv .t17-chip i { font: italic 400 11px "Lora", serif; color: #6d6155; }
.qv .t17-chip strong { font: 400 14px "Prata", serif; font-variant-numeric: lining-nums; white-space: nowrap; }
.qv .t17-chip.pick[aria-pressed="true"] { background: #24201b; border-color: #24201b; color: #faf7f2; }
.qv .t17-chip.pick[aria-pressed="true"] i { color: #d8cdbd; }
/* Заметка: the products in one paragraph */
.qv .t18 small.k { font-size: 10px; letter-spacing: .18em; color: #8c8073; }
.qv .t18-text { margin: 0; font: 400 13px/1.7 "Lora", serif; }
.qv .t18-text b { font: 400 14px "Prata", serif; }
.qv .t18-text .num { font-variant-numeric: lining-nums; white-space: nowrap; }
/* The compact designs of 15.716 («я говорил по образу тех которые были те… сделай ещё других, вдохновлённых теми
   дизайнами»): each from its own design — its ground, faces and price plates — a third of the height */
.qv :is(.k16-comp, .k17-comp, .k18-comp, .k19-comp, .k20-comp) .vi { display: inline-block; min-width: 14px; height: 14px;
  margin: 0 3px 0 2px; padding: 0 3px; border-radius: 4px; font: normal 700 9px/14px "Inter", sans-serif; text-align: center;
  background: rgba(0,0,0,.08); }
.qv :is(.k16-comp, .k17-comp, .k18-comp, .k19-comp, .k20-comp) em { font-style: normal; opacity: 1;
  color: color-mix(in srgb, currentColor 60%, transparent); }
/* Обложка мини: the photo as a band with the italic title over it, warm price plates */
.qv .k16 { display: flex; flex-direction: column; gap: 10px; font-family: "Manrope", sans-serif; color: #1d1a17; }
.qv .k16-hero { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 18px;
  min-height: 170px; padding: 12px 16px 14px; border-radius: 18px; overflow: hidden; background: #2a2622 center / cover no-repeat; color: #fff; }
.qv .k16-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,11,8,0) 25%, rgba(14,11,8,.8)); }
.qv .k16-hero > * { position: relative; z-index: 1; }
.qv .k16-hero .qph { position: absolute; inset: 0; z-index: 0; }
.qv .k16-hero.plain { min-height: 0; background: linear-gradient(135deg, #f3eadc, #dcc7a7); color: #2a2017; }
.qv .k16-hero.plain::after { display: none; }
.qv .k16-top { display: flex; gap: 6px; }
.qv .k16-pill { padding: 3px 10px; border-radius: 999px; background: rgba(255,255,255,.2); font-size: 11px; letter-spacing: .05em; }
.qv .k16-hero.plain .k16-pill { background: rgba(42,32,23,.08); }
.qv .k16-cap h4 { margin: 0; font: italic 500 32px/1.02 "Playfair Display", serif; }
.qv .k16-cap p { margin: 4px 0 0; font-size: 12px; color: color-mix(in srgb, currentColor 85%, transparent); }
.qv .k16-lead, .qv .k16-comp { margin: 0; font-size: 12px; line-height: 1.5; }
.qv .k16-comp { color: #5d554d; }
.qv .k16-prices { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 8px; }
.qv .k16-price { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 14px; background: linear-gradient(155deg, #f8f4ee, #ebe2d4); }
.qv .k16-price span { font-size: 11px; color: #8b8178; }
.qv .k16-price strong { font: 700 20px/1.1 "Manrope", sans-serif; letter-spacing: -.01em; white-space: nowrap; }
/* Бенто мини: the photo tile, the title tile with the composition, a coloured tile for each variant */
.qv .k17 { display: grid; grid-template-columns: 150px repeat(var(--n), minmax(0, 1fr)); grid-template-rows: auto auto; gap: 8px;
  padding: 8px; border-radius: 22px; background: #f0f0f3; font-family: "Manrope", sans-serif; color: #111214; }
.qv .k17.nophoto { grid-template-columns: repeat(var(--n), minmax(0, 1fr)); }
.qv .k17 > div { border-radius: 16px; }
.qv .k17-photo { grid-row: 1 / 3; min-height: 150px; background: center / cover no-repeat; overflow: hidden; }
.qv .k17-title { grid-column: 2 / -1; padding: 12px 14px; background: #fff; }
.qv .k17.nophoto .k17-title { grid-column: 1 / -1; }
.qv .k17-title small { font-size: 11px; color: #6b7078; }
.qv .k17 h4 { margin: 2px 0 0; font: 800 20px/1.1 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .k17-lead, .qv .k17-comp { margin: 4px 0 0; font-size: 11.5px; line-height: 1.45; color: #45484e; }
.qv .k17-price { display: flex; flex-direction: column; justify-content: space-between; gap: 4px; padding: 10px 12px; color: #fff; }
.qv .k17-price span { font-size: 11px; color: rgba(255,255,255,.7); }
.qv .k17-price strong { font: 800 19px/1.1 "Manrope", sans-serif; letter-spacing: -.02em; white-space: nowrap; }
.qv .k17.mono .k17-price { background-image: linear-gradient(150deg, var(--t1a, #2d3552), var(--t1b, #4b5686)); }
/* Полночь мини: a dark row — the photo with its glow, the golden title, glass prices */
.qv .k18 { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 14px; border-radius: 20px; overflow: hidden;
  color: #ece6da; font-family: "Inter", sans-serif;
  background: radial-gradient(120% 80% at 0% 0%, #26304a 0%, transparent 60%), radial-gradient(90% 70% at 100% 100%, #3a2c1c 0%, transparent 60%), #0d0f14; }
.qv .k18:not(:has(.k18-photo)) { grid-template-columns: minmax(0, 1fr); }
.qv .k18-photo { min-height: 150px; border-radius: 12px; background: center / cover no-repeat; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 12px 30px rgba(0,0,0,.45); }
.qv .k18-main small { color: #a69b87; letter-spacing: .14em; font-size: 10px; }
.qv .k18 h4 { margin: 2px 0 0; width: fit-content; max-width: 100%; font: 600 26px/1.05 "Playfair Display", serif;
  background: linear-gradient(100deg, #f4e4c1, #c79b5d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .k18-lead, .qv .k18-comp { margin: 6px 0 0; font-size: 11.5px; line-height: 1.5; color: #bdb6a8; }
.qv .k18-comp .vi { background: rgba(241,223,184,.16); color: #f1dfb8; }
.qv .k18-prices { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.qv .k18-price { flex: 1 1 120px; padding: 8px 12px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); }
.qv .k18-price small { display: block; color: #a69b87; font-size: 9.5px; letter-spacing: .1em; }
.qv .k18-price strong { display: block; margin-top: 4px; font: 500 20px/1 "Playfair Display", serif; color: #f1dfb8;
  font-variant-numeric: lining-nums; white-space: nowrap; }
/* Пастель мини: the soft ground, the photo in a white frame, the wide face of the prices */
.qv .k19 { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 16px; padding: 14px; border-radius: 24px; color: #2b2a33;
  font-family: "Onest", sans-serif;
  background: radial-gradient(70% 60% at 0% 0%, #efe3d8 0%, transparent 70%), radial-gradient(60% 60% at 100% 0%, #e4e3ea 0%, transparent 70%),
              radial-gradient(70% 70% at 100% 100%, #dfe7e3 0%, transparent 70%), #f5f1ec; }
.qv .k19:not(:has(.k19-photo)) { grid-template-columns: minmax(0, 1fr); }
.qv .k19-photo { min-height: 150px; border-radius: 18px; background: center / cover no-repeat; border: 4px solid rgba(255,255,255,.75); overflow: hidden; }
.qv .k19-head { display: flex; align-items: center; gap: 8px; }
.qv .k19-no { flex: none; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #2b2a33;
  color: #fff; font: 700 10px "Unbounded", sans-serif; }
.qv .k19 h4 { margin: 0; font: 700 18px/1.15 "Unbounded", sans-serif; letter-spacing: -.02em; }
.qv .k19-sub { margin: 4px 0 0; font-size: 11px; color: #6c6a75; }
.qv .k19-lead, .qv .k19-comp { margin: 6px 0 0; font-size: 11.5px; line-height: 1.5; }
.qv .k19-prices { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 6px; margin-top: 10px; }
.qv .k19-price { padding: 8px 12px; border-radius: 14px; background: rgba(255,255,255,.8); }
.qv .k19-price small { display: block; font-size: 10.5px; color: #6c6a75; }
.qv .k19-price strong { display: block; margin-top: 2px; font: 700 15px "Unbounded", sans-serif; white-space: nowrap;
  background: linear-gradient(90deg, #2b2a33, #5d5a6e); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* Галерея мини: a strip of up to three photos with the title over it, the prices as a coloured band */
.qv .k20 { display: flex; flex-direction: column; gap: 8px; font-family: "Tenor Sans", sans-serif; color: #232622; }
.qv .k20-strip { position: relative; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 6px; height: 150px; }
.qv .k20-strip.n1 { grid-template-columns: 1fr; }
.qv .k20-strip.n2 { grid-template-columns: 2fr 1fr; }
.qv .k20-strip > div:not(.k20-badge) { border-radius: 12px; background: center / cover no-repeat; overflow: hidden; }
.qv .k20-badge { position: absolute; left: 10px; bottom: 10px; max-width: calc(66% - 20px); padding: 8px 12px; border-radius: 10px;
  color: #fff; background: rgba(20,22,18,.58); }
.qv .k20-badge small, .qv .k20-head small { font-size: 10px; letter-spacing: .14em; color: color-mix(in srgb, currentColor 80%, transparent); }
.qv .k20-badge h4, .qv .k20-head h4 { margin: 2px 0 0; font: 400 20px/1.1 "Tenor Sans", sans-serif; }
.qv .k20-lead, .qv .k20-comp { margin: 0; font: 400 11.5px/1.5 "Inter", sans-serif; color: #4d524a; }
.qv .k20-band { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); border-radius: 12px; overflow: hidden; color: #f3f1ea; }
.qv .k20-band > div { padding: 8px 12px; background: linear-gradient(140deg, var(--a), var(--b)); }
.qv .k20-band > div:nth-child(1) { --a: #2f3a2e; --b: #4b5a46; }
.qv .k20-band.multi > div:nth-child(2) { --a: #2c3a47; --b: #4a5e70; }
.qv .k20-band.multi > div:nth-child(3) { --a: #4a3a2c; --b: #6f5a45; }
.qv .k20-band:not(.multi) > div:nth-child(2) { --a: #3d4b3b; --b: #586954; }
.qv .k20-band:not(.multi) > div:nth-child(3) { --a: #4d5c49; --b: #6a7c64; }
.qv .k20-band > div + div { border-left: 1px solid rgba(255,255,255,.16); }
.qv .k20-band small { display: block; font-size: 9.5px; letter-spacing: .12em; color: color-mix(in srgb, currentColor 70%, transparent); }
.qv .k20-band strong { display: block; margin-top: 3px; font: 400 18px/1 "Tenor Sans", sans-serif; white-space: nowrap; }
@container paper (max-width: 560px) {
  .qv .k17 { grid-template-columns: repeat(var(--n), minmax(0, 1fr)); }
  .qv .k17-photo { grid-row: auto; grid-column: 1 / -1; min-height: 140px; }
  .qv .k17-title { grid-column: 1 / -1; }
  .qv :is(.k18, .k19) { grid-template-columns: minmax(0, 1fr); }
  .qv .k20-band { grid-template-columns: minmax(0, 1fr); }
}
/* The compact totals of 15.716, each from its own design */
.qv .t19 { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 20px; color: #ece6da; font-family: "Inter", sans-serif;
  background: radial-gradient(110% 70% at 0% 0%, #26304a 0%, transparent 60%), radial-gradient(80% 70% at 100% 100%, #3a2c1c 0%, transparent 60%), #0d0f14; }
.qv .t19-head small { color: #a69b87; letter-spacing: .14em; font-size: 10px; }
.qv .t19 h4 { margin: 2px 0 4px; width: fit-content; font: 600 26px/1.05 "Playfair Display", serif;
  background: linear-gradient(100deg, #f4e4c1, #c79b5d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .t19-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; padding: 6px 0;
  border-top: 1px solid rgba(255,255,255,.1); }
.qv .t19-row b { font-weight: 500; font-size: 13px; }
.qv .t19-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.qv .t19-chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 10px; border-radius: 10px; background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12); }
.qv .t19-chip i { font-style: normal; font-size: 10.5px; color: #a69b87; }
.qv .t19-chip strong { font: 500 14px "Playfair Display", serif; color: #f1dfb8; white-space: nowrap; }
.qv .t19-chip.pick[aria-pressed="true"] { background: linear-gradient(135deg, #f4e4c1, #c79b5d); border-color: transparent; }
.qv .t19-chip.pick[aria-pressed="true"] :is(i, strong) { color: #1b160f; }
.qv .t19 .sums { margin-top: 6px; gap: 6px; }
.qv .t19 .sum, .qv .t19 .deltas { padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); }
.qv .t19 .sum small { color: #a69b87; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.qv .t19 .sum strong { margin-top: 4px; font: 500 22px/1 "Playfair Display", serif; color: #f1dfb8; }
.qv .t19 .sum em { color: #a69b87; }
.qv .t20 { display: flex; flex-direction: column; gap: 8px; padding: 8px; border-radius: 22px; background: #f0f0f3; font-family: "Manrope", sans-serif; color: #111214; }
.qv .t20-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 8px 10px 0; }
.qv .t20 h4 { margin: 0; font: 800 22px/1.05 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .t20-head span { font-size: 11px; color: #6b7078; }
.qv .t20-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.qv .t20-prod { padding: 10px 12px; border-radius: 16px; background: #fff; }
.qv .t20-prod b { display: block; margin-bottom: 4px; font-size: 12.5px; font-weight: 700; }
.qv .t20-v { display: flex; justify-content: space-between; gap: 8px; margin: 0 -6px; padding: 2px 6px; border-radius: 8px; font-size: 11.5px; }
.qv .t20-v span { color: #6b7078; }
.qv .t20-v strong { font-weight: 800; white-space: nowrap; }
.qv .t20-v.pick[aria-pressed="true"] { background: #111214; }
.qv .t20-v.pick[aria-pressed="true"] :is(span, strong) { color: #fff; }
.qv .t20-sums .sums { gap: 8px; }
.qv .t20-sums .sum { padding: 10px 12px; border-radius: 16px; color: #fff; background-color: #2d3552; }
.qv .t20-sums .sum small { font-size: 11px; color: rgba(255,255,255,.7); }
.qv .t20-sums .sum strong { margin-top: 4px; font: 800 20px/1.1 "Manrope", sans-serif; }
.qv .t20-sums .sum em { color: rgba(255,255,255,.75); }
.qv .t20-sums .deltas { padding: 10px 12px; border-radius: 16px; background: #fff; }
.qv .t21 { display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 24px; color: #2b2a33; font-family: "Onest", sans-serif;
  background: radial-gradient(70% 60% at 0% 0%, #efe3d8 0%, transparent 70%), radial-gradient(60% 60% at 100% 0%, #e4e3ea 0%, transparent 70%),
              radial-gradient(70% 70% at 100% 100%, #dfe7e3 0%, transparent 70%), #f5f1ec; }
.qv .t21 h4 { margin: 0 0 6px; font: 700 22px/1.05 "Unbounded", sans-serif; letter-spacing: -.02em; }
.qv .t21-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 6px 10px;
  border-radius: 14px; background: rgba(255,255,255,.7); }
.qv .t21-row b { font-size: 12.5px; font-weight: 600; }
.qv .t21-vs { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.qv .t21-v { display: inline-flex; align-items: baseline; gap: 6px; padding: 2px 6px; border-radius: 10px; }
.qv .t21-v i { font-style: normal; font-size: 10.5px; color: #6c6a75; }
.qv .t21-v strong { font: 700 12.5px "Unbounded", sans-serif; white-space: nowrap; }
.qv .t21-v.pick[aria-pressed="true"] { background: linear-gradient(90deg, #2b2a33, #5d5a6e); }
.qv .t21-v.pick[aria-pressed="true"] :is(i, strong) { color: #fff; }
.qv .t21 .sums { margin-top: 6px; gap: 6px; }
.qv .t21 .sum, .qv .t21 .deltas { padding: 10px 12px; border-radius: 16px; background: rgba(255,255,255,.85); }
.qv .t21 .sum small { font-size: 10.5px; color: #6c6a75; }
.qv .t21 .sum strong { margin-top: 2px; font: 700 18px "Unbounded", sans-serif; }
.qv .t22 { display: flex; flex-direction: column; gap: 0; font-family: "Inter", sans-serif; color: #1d1d1f; }
.qv .t22 h4 { margin: 0 0 6px; font: 700 22px/1.1 "Inter", sans-serif; letter-spacing: -.03em; }
.qv .t22-row { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid #e5e5ea; }
.qv .t22-ph { width: 40px; height: 40px; border-radius: 10px; background: center / cover no-repeat; }
.qv.qv-nophoto .t22-row { grid-template-columns: minmax(0, 1fr) auto; }
.qv .t22-row b { font-size: 13px; letter-spacing: -.01em; }
.qv .t22-seg { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.qv .t22-opt { display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 9px; border-radius: 9px; border: 1px solid #d2d2d7; font-size: 11px; }
.qv .t22-opt strong { font-size: 12px; font-weight: 600; white-space: nowrap; }
.qv .t22-opt.pick[aria-pressed="true"] { border-color: #0071e3; box-shadow: 0 0 0 1px #0071e3 inset; }
.qv .t22 .sums { margin-top: 8px; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 0; padding: 4px 14px; border-radius: 16px; background: #f5f5f7; }
.qv .t22 .sum { padding: 8px 0; background: none; }
.qv .t22 .sum small { color: #86868b; }
.qv .t22 .sum strong { font: 700 18px "Inter", sans-serif; letter-spacing: -.02em; }
.qv .t22 .sum em { color: #86868b; }
.qv .t23 { font-family: "Manrope", sans-serif; color: #15171a; }
.qv .t23 h4 { margin: 0 0 8px; font: 800 22px/1.1 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .t23-cols { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 8px; }
.qv .t23-col { border-radius: 16px; padding: 5px; }
.qv .t23-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 6px 10px 8px; }
.qv .t23-head small { font-size: 11px; color: #4b5058; }
.qv .t23-head strong { font: 800 18px "Manrope", sans-serif; white-space: nowrap; }
.qv .t23-col ul { margin: 0; padding: 2px 10px; list-style: none; border-radius: 12px; background: #fff; }
.qv .t23-col li { display: flex; justify-content: space-between; gap: 8px; padding: 5px 0; font-size: 11.5px; }
.qv .t23-col li + li { border-top: 1px solid #eef0f2; }
.qv .t23-col li b { font-weight: 700; white-space: nowrap; }
.qv .t23-col li.borrow { color: #9aa0a8; }
@container paper (max-width: 560px) {
  .qv .t23-cols { grid-template-columns: minmax(0, 1fr); }
  .qv .t22 .sums { grid-template-columns: minmax(0, 1fr); }
}
/* The company's own faces and colours of the totals' parts (15.694), as a card's: `sf-<part>` / `sc-<part>` on the totals
   mark the part, `--sf-<part>` / `--sc-<part>` carry the value; the names are a product's `b`, the sums every `.num`. */
.qv.qv-summary.sf-text > * { font-family: var(--sf-text); }
.qv.qv-summary.sf-title h4 { font-family: var(--sf-title); }
.qv.qv-summary.sf-title-upright h4 { font-style: normal; }
.qv.qv-summary.sf-title-regular h4 { font-weight: 400; }
.qv.qv-summary.sf-names b:not(.num) { font-family: var(--sf-names); }
.qv.qv-summary.sf-names-upright b:not(.num) { font-style: normal; }
.qv.qv-summary.sf-names-regular b:not(.num) { font-weight: 400; }
.qv.qv-summary.sf-sums .num { font-family: var(--sf-sums); }
.qv.qv-summary.sf-sums-upright .num { font-style: normal; }
.qv.qv-summary.sf-sums-regular .num { font-weight: 400; }
.qv.qv-summary.sc-ground > * { background: var(--sc-ground); }
.qv.qv-summary.sc-ground-grad > * { background: linear-gradient(150deg, var(--sc-ground-a), var(--sc-ground-b)); }
.qv.qv-summary:is(.sc-ground, .sc-ground-grad) > :is(.t1, .t2, .t4, .t5, .t6, .t11, .t13) { padding: 22px; border-radius: 24px; }
.qv.qv-summary.sc-text > * { color: var(--sc-text); }
.qv.qv-summary.sc-title h4 { background: none; color: var(--sc-title); }
.qv.qv-summary.sc-title-grad h4 { width: fit-content; max-width: 100%; color: transparent;
  background: linear-gradient(100deg, var(--sc-title-a), var(--sc-title-b)); -webkit-background-clip: text; background-clip: text; }
.qv.qv-summary.sc-sums .num { background: none; color: var(--sc-sums); }
.qv.qv-summary.sc-sums-grad .num { color: transparent; background: linear-gradient(100deg, var(--sc-sums-a), var(--sc-sums-b));
  -webkit-background-clip: text; background-clip: text; }
.qv .t1 { font-family: "Manrope", sans-serif; color: #15171a; }
.qv .t1 h4, .qv .t2 h4, .qv .t4 h4, .qv .t5 h4, .qv .t6 h4 { margin: 0 0 14px; font: 800 26px/1.1 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .t1-cols { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 10px; }
.qv .t1-col { border-radius: 20px; padding: 6px; }
.qv .t1-g1 { background: linear-gradient(160deg, #e9f1ee, #d6e7e0); }
.qv .t1-g2 { background: linear-gradient(160deg, #eceef7, #d9def0); }
.qv .t1-g3 { background: linear-gradient(160deg, #f6eee6, #ecdccb); }
.qv .t1-head { padding: 14px 14px 12px; }
.qv .t1-head small { font-size: 12px; color: #5b6168; font-weight: 600; }
.qv .t1-head strong { display: block; margin-top: 4px; font: 800 26px/1.05 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .t1-col ul { margin: 0; padding: 4px 12px; list-style: none; border-radius: 15px; background: #fff; }
.qv .t1-col li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; padding: 9px 2px; font-size: 12px; }
.qv .t1-col li + li { border-top: 1px solid #eef0f2; }
.qv .t1-col li b { font-weight: 600; }
.qv .t1-col li span { grid-column: 1; color: #6b7078; font-size: 11px; }
.qv .t1-col li .s { grid-row: 1 / 3; grid-column: 2; align-self: center; font-weight: 700; }
.qv .t1-col li.borrow { color: #9aa0a8; }
.qv .t1-foot { margin: 10px 0 0; font-size: 11px; color: #6b7078; }
.qv .t1-one { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 18px 20px; border-radius: 18px; background: #15171a; color: #fff; }
.qv .t1-one strong { font: 800 30px "Manrope", sans-serif; }
@container paper (max-width: 600px) {
.qv .t1-cols { grid-template-columns: minmax(0, 1fr); }
}
.qv .t2 { font-family: "Inter", sans-serif; color: #15171a; }
.qv .t2-wrap { overflow-x: auto; }
.qv .t2 table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid #e3e6ea; border-radius: 16px; overflow: hidden; overflow: clip; font-size: 12px; }
.qv .t2 th { padding: 10px 12px; background: #f4f5f7; text-align: right; font-weight: 600; color: #4b5058; font-size: 11px; }
.qv .t2 th:first-child { text-align: left; }
.qv .t2 td { padding: 10px 12px; border-top: 1px solid #eceef1; text-align: right; vertical-align: middle; white-space: nowrap; }
.qv .t2 td:first-child { text-align: left; white-space: normal; }
.qv .t2-prod { display: flex; align-items: center; gap: 10px; }
.qv .t2-prod div { width: 46px; height: 46px; border-radius: 10px; background: center / cover no-repeat; flex: none; }
.qv .t2-prod b { display: block; font-size: 13px; }
.qv .t2-prod > span > span { display: block; color: #7b8188; font-size: 11px; }
.qv .t2 td small { display: block; color: #7b8188; font-size: 10px; }
.qv .t2 td.one { text-align: center; background: #fafbfc; }
.qv .t2 td.none { color: #b4b9c0; }
.qv .t2 tfoot td { background: #15171a; color: #fff; border-top: 0; font: 700 16px "Inter", sans-serif; }
.qv .t2 tfoot td:first-child { font: 500 12px "Inter", sans-serif; color: #c8ccd2; }
@container paper (max-width: 600px) {
.qv .t2-prod div { display: none; }
.qv .t2 td, .qv .t2 th { padding: 8px; }
}
.qv .t4 { font-family: "Manrope", sans-serif; color: #15171a; }
.qv .t4-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.qv .t4-tile { border-radius: 20px; background: #f2f3f5; overflow: hidden; display: flex; flex-direction: column; }
.qv .t4-tile > div:first-child { height: 120px; background: center / cover no-repeat; }
.qv .t4-body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 6px; }
.qv .t4-body b { font-size: 14px; font-weight: 700; }
.qv .t4-v { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; }
.qv .t4-v span { display: inline-flex; gap: 6px; align-items: center; color: #4b5058; }
.qv .t4-v i { font-style: normal; display: inline-block; width: 18px; height: 18px; border-radius: 6px; background: #15171a; color: #fff; font-size: 10px; font-weight: 700; }
.qv .t4-v strong { font-weight: 700; }
.qv .t4-total { grid-column: 1 / -1; padding: 18px 20px; border-radius: 20px; color: #fff; background: linear-gradient(120deg, #14161b, #273042 60%, #34465a); }
.qv .t4-total small { color: #aab2bf; font-size: 12px; }
.qv .t4-sc { display: grid; grid-template-columns: 100px minmax(0, 1fr) 120px; gap: 12px; align-items: center; margin-top: 10px; font-size: 12px; }
.qv .t4-sc div { height: 10px; border-radius: 5px; background: rgba(255,255,255,.12); overflow: hidden; }
.qv .t4-sc div span { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #7fd3c2, #a9b8ff); }
.qv .t4-sc strong { text-align: right; font-size: 18px; font-weight: 800; }
@container paper (max-width: 600px) {
.qv .t4-grid { grid-template-columns: 1fr 1fr; }
}
@container paper (max-width: 420px) {
.qv .t4-grid { grid-template-columns: minmax(0, 1fr); }
.qv .t4-sc { grid-template-columns: 80px minmax(0, 1fr) auto; }
}
.qv .t5 { font-family: "Inter", sans-serif; color: #15171a; }
.qv .t5-row { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 16px; align-items: center; padding: 14px 0; border-top: 1px solid #eceef1; }
.qv .t5-prod { display: flex; gap: 10px; align-items: center; }
.qv .t5-prod div { width: 44px; height: 44px; border-radius: 12px; background: center / cover no-repeat; flex: none; }
.qv .t5-prod b { font-size: 13px; }
.qv .t5-track { position: relative; height: 76px; margin: 0 36px; }
.qv .t5-track::before { content: ""; position: absolute; left: -36px; right: -36px; top: 37px; height: 2px; border-radius: 1px; background: #e4e7eb; }
.qv .t5-range { position: absolute; top: 36px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, #4cae9d, #6f7fe0); }
.qv .t5-dot { position: absolute; top: 31px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #fff; border: 3px solid #2f6f8f; }
.qv .t5-lab { position: absolute; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; line-height: 1.25; white-space: nowrap; }
.qv .t5-lab b { font-size: 11px; font-weight: 600; }
.qv .t5-lab span { font-size: 10px; color: #7b8188; }
.qv .t5-lab.up { top: 0; }
.qv .t5-lab.down { top: 50px; flex-direction: column-reverse; }
.qv .t5-sum { margin-top: 8px; padding: 16px 18px; border-radius: 18px; background: #f3f5f7; }
.qv .t5-sum small { color: #6b7078; font-size: 12px; }
.qv .t5-bar { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 12px; align-items: center; margin-top: 8px; font-size: 12px; }
.qv .t5-bar div { position: relative; height: 26px; border-radius: 8px; background: var(--acc-solid); color: var(--ink-on-dark); /* 15.1182: flat, no gradient */ font-weight: 700; display: flex; align-items: center; justify-content: flex-end; padding: 0 10px; font-size: 13px; }
@container paper (max-width: 600px) {
.qv .t5-row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
}
.qv .t6 { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 18px; font-family: "Inter", sans-serif; color: #1d1d1f; }
.qv .t6-list > div { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 14px; padding: 14px 0; border-bottom: 1px solid #e5e5ea; }
.qv .t6-list > div:first-child { padding-top: 0; }
.qv .t6-ph { height: 70px; border-radius: 14px; background: center / cover no-repeat; }
.qv .t6-list b { font-size: 14px; }
.qv .t6-list p { margin: 2px 0 6px; color: #86868b; font-size: 11px; }
.qv .t6-v { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; padding: 2px 0; }
.qv .t6-v span { color: #6e6e73; }
.qv .t6-v strong { font-weight: 600; white-space: nowrap; }
.qv .t6-box { align-self: start; padding: 20px; border-radius: 22px; color: #f5f5f7; background: linear-gradient(160deg, #1d1d1f, #2c2c30); }
.qv .t6-box small { color: #a1a1a6; font-size: 12px; }
.qv .t6-box .main { display: block; margin: 4px 0 2px; font: 700 34px/1.05 "Inter", sans-serif; letter-spacing: -.03em; }
.qv .t6-box p { margin: 0 0 12px; color: #a1a1a6; font-size: 12px; }
.qv .t6-box div { display: flex; justify-content: space-between; padding: 8px 0; border-top: 1px solid rgba(255,255,255,.12); font-size: 12px; }
.qv .t6-box div strong { font-size: 14px; }
@container paper (max-width: 600px) {
.qv .t6 { grid-template-columns: minmax(0, 1fr); }
}
.qv .t7 { padding: 26px; background: #f7f3ec; color: #2a241d; font-family: "Lora", serif; }
.qv .t7 small.k { font: 400 11px "Inter", sans-serif; letter-spacing: .2em; color: #8c8073; }
.qv .t7 h4 { margin: 6px 0 16px; font: 500 40px/1.05 "Playfair Display", serif; }
.qv .t7-row { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid #dfd5c6; }
.qv .t7-row > span { font: italic 500 22px "Playfair Display", serif; color: #8c8073; }
.qv .t7-row b { font: 500 20px "Playfair Display", serif; }
.qv .t7-row p { margin: 4px 0 0; font-size: 14px; font-style: italic; }
.qv .t7-row p strong { font-style: normal; font-weight: 600; }
.qv .t7-sum { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); margin-top: 16px; border: 1px solid #2a241d; }
.qv .t7-sum > div { padding: 14px 16px; }
.qv .t7-sum > div + div { border-left: 1px solid #2a241d; }
.qv .t7-sum small { font: 400 11px "Inter", sans-serif; letter-spacing: .14em; color: #8c8073; }
.qv .t7-sum strong { display: block; margin-top: 4px; font: 500 30px/1 "Playfair Display", serif; }
@container paper (max-width: 420px) {
.qv .t7 { padding: 16px; }
.qv .t7 h4 { font-size: 30px; }
.qv .t7-sum { grid-template-columns: minmax(0, 1fr); }
.qv .t7-sum > div + div { border-left: 0; border-top: 1px solid #2a241d; }
}
.qv .pick { cursor: pointer; }
.qv .pick:focus-visible { outline: 2px solid #0071e3; outline-offset: 2px; }
.qv .reset { flex: none; padding: 7px 12px; border-radius: 10px; border: 1px solid currentColor; background: none; color: inherit; font: 600 12px "Inter", sans-serif; cursor: pointer; opacity: .85; }
.qv .reset:hover { opacity: 1; }
/* A variant picked in the designs that list the products' variants (15.718: «не выбираются варианты с показом стоимости
   выбранного варианта»): under the pointer a light ground, picked — the design's ink as the ground */
/* Under the pointer only a hint — the faintest ground, the cell's own shape (15.737: «слишком люто подсвечивается
   наводимый вариант»); a picked one keeps its own look */
.qv :is(.t2 td, .t4-v, .t6-v, .t7-row p > span, .t16 td, .t18-text span).pick { cursor: pointer; transition: background-color .12s; }
.qv :is(.t4-v, .t6-v, .t7-row p > span, .t18-text span).pick { border-radius: 6px; }
@media (hover: hover) {
  .qv-live :is(.t2 td, .t4-v, .t6-v, .t7-row p > span, .t16 td, .t18-text span).pick:not([aria-pressed="true"]):hover {
    background-color: rgba(0, 0, 0, .025); } }
.qv .t2 td.pick[aria-pressed="true"] { background: #15171a; color: #fff; }
.qv .t2 td.pick[aria-pressed="true"] small { color: #c9ced4; }
.qv .t4-v.pick, .qv .t6-v.pick { margin: 0 -6px; padding: 2px 6px; }
.qv .t4-v.pick[aria-pressed="true"] { background: #15171a; }
.qv .t4-v.pick[aria-pressed="true"] :is(span, strong) { color: #fff; }
.qv .t6-v.pick[aria-pressed="true"] { background: #1d1d1f; }
.qv .t6-v.pick[aria-pressed="true"] :is(span, strong) { color: #f5f5f7; }
.qv .t7-row p > span.pick { margin: 0 -3px; padding: 0 3px; }
.qv .t7-row p > span.pick[aria-pressed="true"] { background: #2a241d; color: #f7f3ec; }
.qv .t16 td.pick[aria-pressed="true"] { background: #24201b; color: #faf7f2; }
.qv .t18-text span.pick { padding: 0 3px; }
.qv .t18-text span.pick[aria-pressed="true"] { background: #24201b; color: #faf7f2; }
/* A table of more than two variants on a narrow sheet (15.751: «Когда вариантов больше 2 слишком скомканно получается и
   обрезается… прокрутку по горизонтали с предложением прокрутить в горизонталь»): its columns keep a readable width,
   it scrolls sideways under «Листайте вбок» with a nodding arrow; on paper as it was */
.qv .qv-hs { overflow-x: auto; overscroll-behavior-x: contain; }
.qv .qv-hs-hint { display: none; }
.qv .t16 .qv-hs { --hs-bleed: 18px; }
@container paper (max-width: 600px) {
  .qv .qv-hs-many > table { min-width: calc(7rem + var(--n) * 8rem); }
  /* 15.762 («не закрепляй… можно и не обрезать ни карточки ни таблицы, пусть за край экрана уходят»): no column stays;
     the scrolling strip reaches the sheet's edges, so the table passes under the edge of the screen, not of the text */
  .qv .qv-hs-many { margin-inline: calc(-1 * (var(--sheet-pad, 0px) + var(--hs-bleed, 0px)));
    padding-inline: calc(var(--sheet-pad, 0px) + var(--hs-bleed, 0px)); }
  /* a plate in the sheet's accent that stays (15.778: «Плашка "листайте вбок" не должна пропадать, а ещё должна быть
     более заметной, возможно акцентного цвета») */
  .qv .qv-hs-hint { display: flex; justify-content: flex-end; margin: 0 0 8px; }
  .qv .qv-hs-hint > span { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px; border-radius: 999px;
    background: color-mix(in srgb, var(--sheet-accent, #c65221) 14%, transparent); color: var(--sheet-accent, #c65221);
    font: 600 12px/1.2 "Inter", sans-serif; letter-spacing: .02em; }
  .qv .qv-hs-hint i { width: 6px; height: 6px; border-top: 2px solid currentColor; border-right: 2px solid currentColor;
    rotate: 45deg; animation: qv-hs-nod 1.4s ease-in-out infinite; }
}
@keyframes qv-hs-nod { 0%, 100% { translate: -2px 0; } 50% { translate: 3px 0; } }
@media print { .qv .qv-hs-hint { display: none !important; } .qv .qv-hs { overflow: visible; } }
/* «Выбранный заказ» (15.740, 15.746): a card of its own — the sum with the rest's note and the reset, under a hairline
   «Выбранные варианты» folded, a row per picked product (its name, its variant) when opened; a design that has its own
   ground keeps it */
.qv .pickbox { display: flex; flex-direction: column; margin-top: 14px; padding: 14px 18px 0; border-radius: 16px;
  border: 1px solid color-mix(in srgb, currentColor 14%, transparent); background: color-mix(in srgb, currentColor 4%, transparent); }
.qv .pk-top { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 12px;
  padding-bottom: 12px; }
/* the sum and its note take what the reset leaves, the reset goes under them only when the sum itself does not fit */
.qv .pk-top > div { flex: 1 1 0; display: flex; flex-direction: column; gap: 3px; }
.qv .pk-top > .reset { flex: none; }
.qv .pickbox small { display: block; font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  color: color-mix(in srgb, currentColor 65%, transparent); }
.qv .pickbox strong { font-size: 24px; font-weight: 700; line-height: 1.15; white-space: nowrap; }
.qv .pk-rest { font-size: 12px; color: color-mix(in srgb, currentColor 60%, transparent); }
.qv .pk-rest[hidden] { display: none; }
.qv .pk-fold { border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
.qv .pk-fold > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 0;
  list-style: none; cursor: pointer; font-size: 13px; font-weight: 600; }
.qv .pk-fold > summary::-webkit-details-marker { display: none; }
.qv .pk-fold > summary::after { content: ""; flex: none; width: 7px; height: 7px; margin-right: 3px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg);
  transition: transform .2s ease; }
.qv .pk-fold[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
/* opened with a motion (15.754: «Пусть фолдабл открывается с анимацией»): the rows slide in everywhere; where the
   browser can, the fold also grows to its height and shrinks back */
.qv .pk-fold[open] > .lines { animation: pk-fold-in .32s cubic-bezier(.2, .7, .2, 1); }
@keyframes pk-fold-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.qv .pk-fold { interpolate-size: allow-keywords; }
.qv .pk-fold::details-content { height: 0; overflow: clip;
  transition: height .32s cubic-bezier(.2, .7, .2, 1), content-visibility .32s allow-discrete; }
.qv .pk-fold[open]::details-content { height: auto; }
.qv .pickbox .lines { display: flex; flex-direction: column; margin: 0 0 8px; padding: 0; list-style: none; font-size: 13px; }
.qv .pickbox .lines li { display: flex; align-items: baseline; justify-content: space-between; gap: 6px 16px; flex-wrap: wrap;
  padding: 7px 0; border-top: 1px solid color-mix(in srgb, currentColor 10%, transparent); }
.qv .pickbox .lines li b { font-weight: 600; text-align: right; }
.qv .sums { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 10px; }
.qv .sums.diff { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
.qv .sum { min-width: 0; }
.qv .sum small { display: block; font-size: 12px; }
.qv .sum strong { display: block; white-space: nowrap; }
.qv .sum em { display: block; margin-top: 4px; font-style: normal; font-size: 11px; }
.qv .deltas { margin: 0; padding: 0; list-style: none; font-size: 12px; }
.qv .deltas li { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; }
.qv .deltas b { white-space: nowrap; }
@container paper (max-width: 600px) {
.qv .sums.diff { grid-template-columns: minmax(0, 1fr); }
}
@container paper (max-width: 420px) {
.qv .sums { grid-template-columns: minmax(0, 1fr); }
}
.qv .t8 { display: flex; flex-direction: column; gap: 16px; padding: 26px; border-radius: 26px; color: #ece6da; font-family: "Inter", sans-serif; background: radial-gradient(110% 70% at 0% 0%, #26304a 0%, transparent 60%), radial-gradient(80% 70% at 100% 100%, #3a2c1c 0%, transparent 60%), #0d0f14; }
.qv .t8-head small { color: #a69b87; font-size: 11px; letter-spacing: .16em; }
.qv .t8-head h4 { margin: 4px 0 0; font: 600 40px/1.05 "Playfair Display", serif; background: linear-gradient(100deg, #f4e4c1, #c79b5d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .t8-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 14px 0; border-top: 1px solid rgba(255,255,255,.1); }
.qv .t8-ph { width: 64px; height: 64px; border-radius: 16px; background: center / cover no-repeat; box-shadow: 0 0 0 1px rgba(255,255,255,.1); }
.qv .t8-row b { display: block; font-weight: 500; font-size: 15px; }
.qv .t8-row span.l { color: #8f877a; font-size: 12px; }
.qv .t8-chips { display: flex; flex-wrap: wrap; justify-content: flex-end; align-self: stretch; align-items: stretch; gap: 6px; }
.qv .t8-chip { display: inline-flex; flex-direction: column; justify-content: center; min-height: 64px; padding: 8px 12px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); }
.qv .t8-chip i { font-style: normal; font-size: 11px; color: #a69b87; }
.qv .t8-chip strong { font: 500 17px "Playfair Display", serif; color: #f1dfb8; white-space: nowrap; }
.qv .t8-chip.pick:hover { border-color: rgba(241,223,184,.5); }
.qv .t8-chip.pick[aria-pressed="true"] { background: linear-gradient(135deg, #f4e4c1, #c79b5d); border-color: transparent; }
.qv .t8-chip.pick[aria-pressed="true"] i, .qv .t8-chip.pick[aria-pressed="true"] strong { color: #1b160f; }
.qv .t8 .sum, .qv .t8 .sums.diff .deltas { padding: 16px 18px; border-radius: 16px; background: linear-gradient(135deg, rgba(241,223,184,.14), rgba(241,223,184,.03)); border: 1px solid rgba(241,223,184,.25); }
.qv .t8 .sum small, .qv .t8 .sum em { color: #a69b87; }
.qv .t8 .sum strong { margin-top: 6px; font: 600 30px/1 "Playfair Display", serif; background: linear-gradient(100deg, #f4e4c1, #c79b5d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .t8 .sums.diff .sum strong { font-size: 42px; }
.qv .t8 .deltas li + li { border-top: 1px dashed rgba(255,255,255,.12); }
.qv .t8 .deltas b { color: #f1dfb8; font-weight: 500; }
.qv .t8 .pickbox { padding: 14px 18px; border-radius: 16px; background: linear-gradient(135deg, #f4e4c1, #c79b5d); color: #1b160f; }
.qv .t8 .pickbox strong { font: 600 30px/1 "Playfair Display", serif; }
@container paper (max-width: 600px) {
.qv .t8-row { grid-template-columns: 56px minmax(0, 1fr); }
.qv .t8-ph { width: 56px; height: 56px; }
.qv .t8-chips { grid-column: 1 / -1; justify-content: flex-start; }
}
@container paper (max-width: 420px) {
.qv .t8 { padding: 16px; border-radius: 20px; }
.qv .t8-head h4 { font-size: 30px; }
.qv .t8 .sums.diff .sum strong { font-size: 34px; }
}
.qv .t9 { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 26px; padding: 22px; background: #faf7f2; color: #24201b; }
.qv .t9-photos { display: grid; grid-template-rows: 1.4fr 1fr 1fr; gap: 8px; min-height: 480px; }
.qv .t9-photos div { background: center / cover no-repeat; }
.qv .t9 small.k { font-size: 11px; letter-spacing: .2em; color: #8c8073; }
.qv .t9 h4 { margin: 8px 0 12px; font: 400 44px/1.02 "Prata", serif; }
.qv .t9-item { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 12px 0; border-top: 1px solid #e4dccf; }
.qv .t9-item > span { font: 400 22px/1 "Prata", serif; color: #b3a796; }
.qv .t9-item b { font: 400 19px "Prata", serif; }
.qv .t9-item p { margin: 4px 0 0; font: 400 14px/1.7 "Lora", serif; }
.qv .t9-item p em { color: #8c8073; }
.qv .t9-item p strong { font-weight: 600; white-space: nowrap; }
.qv .t9-item p .pick { margin: 0 -4px; padding: 1px 4px; border-radius: 4px; }
.qv .t9-item p .pick:hover { background: #efe8dc; }
.qv .t9-item p .pick[aria-pressed="true"] { background: #24201b; color: #faf7f2; }
.qv .t9-item p .pick[aria-pressed="true"] em { color: #d8cdbd; }
.qv .t9 .sums { margin-top: 10px; gap: 0; border: 1px solid #24201b; }
.qv .t9 .sum, .qv .t9 .deltas { padding: 14px 16px; }
.qv .t9 .sum + .sum, .qv .t9 .deltas { border-left: 1px solid #24201b; }
.qv .t9 .sum, .qv .t11 .sum, .qv .t13-hero .sum { background: none; }
.qv .t9 .sum small { font: 400 11px "Inter", sans-serif; letter-spacing: .14em; color: #8c8073; text-transform: uppercase; }
.qv .t9 .sum strong { margin-top: 4px; font: 400 30px/1 "Prata", serif; }
.qv .t9 .sum em { font-family: "Lora", serif; font-style: italic; color: #6d6155; }
.qv .t9 .sums.diff { grid-template-columns: minmax(0, 1fr); }
.qv .t9 .sums.diff .deltas { border-left: 0; border-top: 1px solid #24201b; }
.qv .t9 .sums.diff .sum strong { font-size: 36px; }
.qv .t9 .deltas { font: italic 400 13px "Lora", serif; }
.qv .t9 .deltas b { font-style: normal; }
.qv .t9 .pickbox { margin-top: 10px; padding: 14px 16px; background: #24201b; color: #faf7f2; }
.qv .t9 .pickbox strong { font: 400 30px/1 "Prata", serif; }
@container paper (max-width: 600px) {
.qv .t9 { grid-template-columns: minmax(0, 1fr); }
.qv .t9-photos { grid-template-rows: none; grid-template-columns: 1.4fr 1fr 1fr; min-height: 150px; }
.qv .t9 .sums.diff .deltas { border-left: 0; border-top: 1px solid #24201b; }
}
@container paper (max-width: 420px) {
.qv .t9 { padding: 16px; }
.qv .t9 h4 { font-size: 32px; }
.qv .t9 .sum + .sum { border-left: 0; border-top: 1px solid #24201b; }
}
.qv .t10 { display: flex; flex-direction: column; gap: 14px; padding: 22px; border-radius: 30px; color: #2b2a33; font-family: "Onest", sans-serif; background: radial-gradient(70% 60% at 0% 0%, #efe3d8 0%, transparent 70%), radial-gradient(60% 60% at 100% 0%, #e4e3ea 0%, transparent 70%), radial-gradient(70% 70% at 100% 100%, #dfe7e3 0%, transparent 70%), radial-gradient(60% 60% at 0% 100%, #ebe6da 0%, transparent 70%), #f5f1ec; }
.qv .t10 h4 { margin: 0; font: 700 30px/1.05 "Unbounded", sans-serif; letter-spacing: -.02em; }
.qv .t10-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.qv .t10-card { display: flex; flex-direction: column; gap: 6px; padding: 10px 10px 14px; border-radius: 22px; background: rgba(255,255,255,.72); }
.qv .t10-ph { height: 110px; border-radius: 16px; background: center / cover no-repeat; }
.qv .t10-card b { padding: 0 4px; font-size: 14px; }
.qv .t10-v { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 3px 4px; border-radius: 10px; font-size: 12px; }
.qv .t10-v span { color: color-mix(in srgb, currentColor 65%, transparent); }
.qv .grad { background: linear-gradient(90deg, #2b2a33, #5d5a6e); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .t10-v strong { font: 700 14px "Unbounded", sans-serif; white-space: nowrap; }
.qv .t10-v.pick:hover { background: rgba(43,42,51,.08); }
.qv .t10-v.pick[aria-pressed="true"] { background: linear-gradient(90deg, #2b2a33, #5d5a6e); }
.qv .t10-v.pick[aria-pressed="true"] span { color: color-mix(in srgb, #fff 90%, transparent); }
.qv .t10-v.pick[aria-pressed="true"] .grad { background: none; color: #fff; }
.qv .t10 .sum, .qv .t10 .sums.diff .deltas { padding: 14px 18px; border-radius: 22px; background: rgba(255,255,255,.88); }
.qv .t10 .sum small, .qv .t10 .sum em { color: color-mix(in srgb, currentColor 65%, transparent); }
.qv .t10 .sum strong { margin-top: 4px; font: 700 22px/1.1 "Unbounded", sans-serif; background: linear-gradient(90deg, #2b2a33, #5d5a6e); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .t10 .sums.diff .sum strong { font-size: 30px; }
.qv .t10 .deltas b { font-weight: 700; }
.qv .t10 .pickbox { padding: 16px 22px; border-radius: 24px; background: linear-gradient(90deg, #2b2a33, #5d5a6e); color: #fff; }
.qv .t10 .pickbox strong { font: 700 26px/1 "Unbounded", sans-serif; }
@container paper (max-width: 420px) {
.qv .t10 { padding: 14px; border-radius: 24px; }
.qv .t10-cards { grid-template-columns: minmax(0, 1fr); }
}
.qv .t11 { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 18px; font-family: "Inter", sans-serif; color: #1d1d1f; }
.qv .t11 h4 { margin: 0 0 10px; font: 700 28px/1.1 "Inter", sans-serif; letter-spacing: -.03em; }
.qv .t11-row { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; padding: 14px 0; border-top: 1px solid #e5e5ea; }
.qv .t11-ph { min-height: 76px; border-radius: 16px; background: center / cover no-repeat; }
.qv .t11-row b { font-size: 15px; letter-spacing: -.01em; }
.qv .t11-row p { margin: 2px 0 8px; color: #86868b; font-size: 12px; }
.qv .t11-seg { display: flex; flex-wrap: wrap; gap: 6px; }
.qv .t11-opt { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 12px; border-radius: 12px; border: 1px solid #d2d2d7; background: #fff; color: #1d1d1f; font: 500 12px "Inter", sans-serif; }
.qv .t11-opt span { font-weight: 600; font-size: 13px; }
.qv .t11-opt.pick:hover { border-color: #86868b; }
.qv .t11-opt.pick[aria-pressed="true"] { border-color: #0071e3; box-shadow: 0 0 0 1px #0071e3 inset; }
/* «По номерам» (15.693): the options of a row in columns by their number; one price spans them all */
.qv .t11-seg.by-num { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); }
.qv .t11-seg.by-num > .t11-opt { min-width: 0; }
.qv .t11-seg.by-num > .t11-opt.fixed { grid-column: 1 / -1; }
.qv .t11-opt i { font-style: normal; font-size: 11px; color: #86868b; }
.qv .t11-opt.none { border-style: dashed; color: #86868b; }
.qv .t11-side { align-self: start; display: flex; flex-direction: column; gap: 10px; }
.qv .t11 .sums, .qv .t11 .sums.diff { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 6px 18px; border-radius: 20px; background: #f5f5f7; }
.qv .t11 .sum { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 0 10px; padding: 10px 0; }
.qv .t11 .sum + .sum { border-top: 1px solid #e5e5ea; }
.qv .t11 .sum small { color: #86868b; }
.qv .t11 .sum strong { grid-row: 1 / 3; grid-column: 2; font: 700 20px "Inter", sans-serif; letter-spacing: -.02em; }
.qv .t11 .sum em { color: #86868b; }
.qv .t11 .sums.diff .sum strong { font-size: 26px; }
.qv .t11 .deltas li { border-top: 1px solid #e5e5ea; }
.qv .t11 .pickbox { padding: 18px; border-radius: 20px; background: linear-gradient(160deg, #1d1d1f, #2c2c30); color: #f5f5f7; }
.qv .t11 .pickbox strong { font: 700 26px "Inter", sans-serif; letter-spacing: -.02em; }
@container paper (max-width: 600px) {
.qv .t11 { grid-template-columns: minmax(0, 1fr); }
}
@container paper (max-width: 420px) {
.qv .t11-row { grid-template-columns: 56px minmax(0, 1fr); }
.qv .t11-ph { min-height: 56px; }
}
.qv .t12 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 10px; border-radius: 28px; background: #f0f0f3; font-family: "Manrope", sans-serif; color: #111214; }
.qv .t12 > div { min-width: 0; padding: 14px 16px; border-radius: 20px; background: #fff; }
.qv .t12 > .t12-head, .qv .t12 > .t12-sums { grid-column: 1 / -1; padding: 0; background: transparent; }
.qv .t12-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 10px; padding: 8px 8px 0 !important; }
.qv .t12-head h4 { margin: 0; font: 800 28px/1.05 "Manrope", sans-serif; letter-spacing: -.03em; }
.qv .t12-head span { color: #6b7078; font-size: 13px; }
.qv .t12-prod { display: flex; flex-direction: column; gap: 6px; }
.qv .t12-prod.big { grid-column: span 2; grid-row: span 2; }
.qv .t12-prod.wide { grid-column: span 2; flex-direction: row; align-items: center; gap: 12px; }
.qv .t12-ph { flex: none; border-radius: 14px; background: center / cover no-repeat; height: 170px; }
.qv .t12-prod.wide .t12-ph { width: 92px; height: 92px; }
.qv .t12-prod b { font-size: 15px; }
.qv .t12-v { display: flex; justify-content: space-between; gap: 8px; margin: 0 -8px; padding: 3px 8px; border-radius: 8px; font-size: 12px; }
.qv .t12-v span { color: #6b7078; }
.qv .t12-v strong { font-weight: 800; white-space: nowrap; }
.qv .t12-v.pick:hover { background: #f0f0f3; }
.qv .t12-v.pick[aria-pressed="true"] { background: #111214; }
.qv .t12-v.pick[aria-pressed="true"] span, .qv .t12-v.pick[aria-pressed="true"] strong { color: #fff; }
.qv .t12-wide-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.qv .t12 .sum, .qv .t12 .sums.diff .deltas { padding: 14px 16px; border-radius: 20px; color: #fff; }
.qv .t12 .sum small, .qv .t12 .sum em { color: rgba(255,255,255,.78); }
.qv .t12 .sum strong { margin-top: 4px; font: 800 26px/1.05 "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .t12 .sums.diff .sum strong { font-size: 32px; }
.qv .t12 .sums.diff .deltas { background: #111214; }
.qv .t12 .pickbox { padding: 16px 18px; border-radius: 20px; background: #111214; color: #fff; }
.qv .t12 .pickbox strong { font: 800 28px/1 "Manrope", sans-serif; letter-spacing: -.02em; }
@container paper (max-width: 600px) {
.qv .t12 { grid-template-columns: 1fr 1fr; }
.qv .t12-prod.big, .qv .t12-prod.wide { grid-column: span 2; grid-row: auto; }
}
@container paper (max-width: 420px) {
.qv .t12-prod.wide { flex-direction: column; align-items: stretch; }
.qv .t12-prod.wide .t12-ph { width: auto; height: 150px; }
}
.qv .t13 { display: flex; flex-direction: column; gap: 16px; font-family: "Manrope", sans-serif; color: #1d1a17; }
.qv .t13-hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 300px; padding: 26px 28px; border-radius: 24px; overflow: hidden; background: #2a2622 center 55% / cover no-repeat; color: #fff; }
.qv .t13-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,11,8,.1), rgba(14,11,8,.85)); }
.qv .t13-hero > * { position: relative; z-index: 1; }
.qv .t13-hero > small { font-size: 12px; letter-spacing: .12em; color: color-mix(in srgb, currentColor 85%, transparent); }
.qv .t13-hero h4 { margin: 6px 0 0; font: italic 500 30px/1.05 "Playfair Display", serif; }
.qv .t13-hero .sums { margin-top: 14px; gap: 18px; }
.qv .t13-hero .sum small { color: color-mix(in srgb, currentColor 80%, transparent); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.qv .t13-hero .sum strong { margin-top: 4px; font: 500 34px/1 "Playfair Display", serif; }
.qv .t13-hero .sum em { color: color-mix(in srgb, currentColor 75%, transparent); }
.qv .t13-hero .sums.diff .sum strong { font-size: 56px; }
.qv .t13-hero .deltas li + li { border-top: 1px solid rgba(255,255,255,.22); }
.qv .t13-row { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; align-items: stretch; padding: 12px 4px; border-top: 1px solid #ece5da; }
.qv .t13-ph { min-height: 64px; border-radius: 12px; background: center / cover no-repeat; }
.qv .t13-row b { font-size: 14px; }
.qv .t13-tiles { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.qv .t13-tile { padding: 8px 12px; border-radius: 12px; background: linear-gradient(155deg, #f8f4ee, #ebe2d4); font-size: 11px; color: #8b8178; }
.qv .t13-tile strong { display: block; font: 600 17px "Playfair Display", serif; color: #1d1a17; white-space: nowrap; }
.qv .t13-tile.pick:hover { box-shadow: inset 0 0 0 1px #c9b89c; }
.qv .t13-tile.pick[aria-pressed="true"] { background: #1d1a17; color: #d6cbb9; }
.qv .t13-tile.pick[aria-pressed="true"] strong { color: #fff; }
.qv .t13 .pickbox { padding: 16px 20px; border-radius: 18px; background: linear-gradient(155deg, #f3eadc, #dcc7a7); }
.qv .t13 .pickbox strong { font: 600 30px/1 "Playfair Display", serif; }
@container paper (max-width: 600px) {
.qv .t13-hero { min-height: 240px; }
.qv .t13-hero .sum strong { font-size: 28px; }
.qv .t13-hero .sums.diff .sum strong { font-size: 44px; }
}
@container paper (max-width: 420px) {
.qv .t13-hero { min-height: 200px; padding: 18px; border-radius: 18px; }
.qv .t13-hero .sums.diff .sum strong { font-size: 36px; }
}
.qv .mx { display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(var(--n), minmax(0, 1fr)); }
.qv .mx > div { min-width: 0; padding: 10px 12px; }
.qv .mx-name { display: flex; align-items: center; gap: 10px; }
.qv .mx-name b { display: block; font-size: 13px; }
.qv .mx-name small { display: block; font-size: 11px; color: color-mix(in srgb, currentColor 65%, transparent); }
.qv .mx-ph { flex: none; width: 44px; height: 44px; border-radius: 10px; background: center / cover no-repeat; }
/* A totals design without the products' photos (15.592): the photo cells go, the rows close up */
.qv.qv-nophoto :is(.mx-ph, .t2-prod > div, .t4-tile > div:first-child, .t5-prod > div, .t6-ph, .t8-ph, .t9-photos,
                   .t10-ph, .t11-ph, .t12-ph, .t13-ph) { display: none; }
.qv.qv-nophoto :is(.t6-list > div, .t11-row, .t13-row) { grid-template-columns: minmax(0, 1fr); }
.qv.qv-nophoto .t8-row { grid-template-columns: minmax(0, 1fr) auto; }
.qv.qv-nophoto .t13-hero { min-height: 0; }
.qv .mx-c { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 2px; text-align: right; }
.qv .mx-c strong { white-space: nowrap; }
.qv .mx-c small { font-size: 10.5px; color: color-mix(in srgb, currentColor 70%, transparent); }
.qv .mx-one { align-items: center; text-align: center; }
.qv .mx-h { font-size: 11px; font-weight: 600; }
@container paper (max-width: 420px) {
.qv .mx { grid-template-columns: repeat(var(--n), minmax(0, 1fr)); }
.qv .mx > .mx-name { grid-column: 1 / -1; }
.qv .mx > div { padding: 8px; }
.qv .mx-ph { width: 36px; height: 36px; }
}
.qv .t8 .mx > div { border-top: 1px solid rgba(255,255,255,.1); }
.qv .t8 .mx > .mx-h { border-top: 0; color: #a69b87; font-weight: 500; letter-spacing: .06em; }
.qv .t8 .mx-ph { box-shadow: 0 0 0 1px rgba(255,255,255,.1); }
.qv .t8 .mx-c strong { font: 500 17px "Playfair Display", serif; color: #f1dfb8; }
.qv .t8 .mx-c small { color: #a69b87; }
.qv .t8 .mx > .mx-c.pick[aria-pressed="true"] { border-radius: 12px; border-top-color: transparent; }
.qv .t8 .mx-c.pick:hover { background: rgba(241,223,184,.08); }
.qv .t8 .mx-c.pick[aria-pressed="true"] { background: linear-gradient(135deg, #f4e4c1, #c79b5d); }
.qv .t8 .mx-c.pick[aria-pressed="true"] strong, .qv .t8 .mx-c.pick[aria-pressed="true"] small { color: #1b160f; }
.qv .t8 .mx-none strong { color: #6d665c; }
.qv .t8 .mx > .mx-f { border-top: 1px solid rgba(241,223,184,.35); background: rgba(241,223,184,.06); }
.qv .t8 .mx-f.mx-name { color: #a69b87; font-size: 12px; }
.qv .t8 .mx-f strong { font: 600 24px/1 "Playfair Display", serif; background: linear-gradient(100deg, #f4e4c1, #c79b5d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .t9 .mx { margin-top: 4px; border-top: 2px solid #24201b; }
.qv .t9 .mx > div { border-bottom: 1px solid #e4dccf; }
.qv .t9 .mx-h { font: 400 11px "Inter", sans-serif; letter-spacing: .14em; color: #8c8073; text-transform: uppercase; }
.qv .t9 .mx-name b { font: 400 16px "Prata", serif; }
.qv .t9 .mx-c strong { font: 400 17px "Prata", serif; }
.qv .t9 .mx-c small { font: italic 400 12px "Lora", serif; color: color-mix(in srgb, currentColor 80%, transparent); }
.qv .t9 .mx-c.pick:hover { background: #efe8dc; }
.qv .t9 .mx-c.pick[aria-pressed="true"] { background: #24201b; color: #faf7f2; }
.qv .t9 .mx-none strong { color: #b3a796; }
.qv .t9 .mx > .mx-f { border-bottom: 0; border-top: 2px solid #24201b; background: none; }
.qv .t9 .mx-f.mx-name { font: italic 400 13px "Lora", serif; color: #6d6155; }
.qv .t9 .mx-f strong { font: 400 20px "Prata", serif; }
.qv .t9.wide { grid-template-columns: minmax(0, 1fr); gap: 18px; }
.qv .t9.wide .t9-photos { grid-template-rows: none; grid-template-columns: 1.4fr 1fr 1fr; min-height: 170px; }
.qv .t10 .mx { border-radius: 22px; background: rgba(255,255,255,.8); overflow: hidden; }
.qv .t10 .mx > div { border-top: 1px solid rgba(43,42,51,.07); }
.qv .t10 .mx > .mx-h { border-top: 0; color: color-mix(in srgb, currentColor 65%, transparent); }
.qv .t10 .mx-ph { border-radius: 12px; }
.qv .t10 .mx-c strong { font: 700 13px "Unbounded", sans-serif; background: linear-gradient(90deg, #2b2a33, #5d5a6e); -webkit-background-clip: text; background-clip: text; color: transparent; }
.qv .t10 .mx-c.pick:hover { background: rgba(43,42,51,.06); }
.qv .t10 .mx-c.pick[aria-pressed="true"] { background: linear-gradient(90deg, #2b2a33, #5d5a6e); color: #fff; }
.qv .t10 .mx-c.pick[aria-pressed="true"] strong { background: none; color: #fff; }
.qv .t10 .mx-none strong { background: none; color: #b5b2bd; }
.qv .t10 .mx > .mx-f { background: rgba(255,255,255,.6); }
.qv .t10 .mx-f strong { font-size: 17px; }
.qv .t11 .mx { border: 1px solid #e5e5ea; border-radius: 18px; overflow: hidden; }
.qv .t11 .mx > div { border-top: 1px solid #e5e5ea; }
.qv .t11 .mx > .mx-h { border-top: 0; background: #f5f5f7; color: #6e6e73; }
.qv .t11 .mx-ph { border-radius: 12px; }
.qv .t11 .mx-c strong { font: 600 14px "Inter", sans-serif; }
.qv .t11 .mx-c.pick:hover { background: #f5f5f7; }
.qv .t11 .mx-c.pick[aria-pressed="true"] { box-shadow: inset 0 0 0 2px #0071e3; }
.qv .t11 .mx-none strong { color: #b0b0b5; }
.qv .t11 .mx > .mx-f { border-top: 0; background: #1d1d1f; color: #f5f5f7; }
.qv .t11 .mx-f strong { font: 700 18px "Inter", sans-serif; letter-spacing: -.02em; }
.qv .t12 .mx { gap: 6px; }
.qv .t12 .mx > div { border-radius: 16px; background-color: #fff; }
.qv .t12 .mx > .mx-h { background-color: transparent; color: #6b7078; padding-block: 2px 0; }
.qv .t12 .mx-c strong { font: 800 15px "Manrope", sans-serif; }
.qv .t12 .mx-c.pick:hover { box-shadow: inset 0 0 0 1px #c9cbd1; }
.qv .t12 .mx > .mx-c.pick[aria-pressed="true"] { background-color: #111214; color: #fff; }
.qv .t12 .mx > .mx-none { background-color: rgba(255,255,255,.5); color: #a0a4ab; }
.qv .t12 .mx-f { color: #fff; }
.qv .t12 .mx > .mx-f.mx-name { background-color: transparent; color: #6b7078; }
.qv .t12 .mx-f strong { font: 800 20px "Manrope", sans-serif; letter-spacing: -.02em; }
.qv .t13 .mx { gap: 6px; }
.qv .t13 .mx > div { border-radius: 12px; }
.qv .t13 .mx-c { background: linear-gradient(155deg, #f8f4ee, #ebe2d4); }
.qv .t13 .mx > .mx-h { background: none; color: #8b8178; font-weight: 500; }
.qv .t13 .mx > .mx-name { padding: 0 12px 0 0; align-items: stretch; }
.qv .t13 .mx > .mx-h.mx-name { align-items: center; padding: 10px 12px; }
.qv .t13 .mx-name > span:last-child { align-self: center; }
.qv .t13 .mx-name .mx-ph { height: auto; width: 64px; border-radius: 12px; }
.qv .t13 .mx-c strong { font: 600 16px "Playfair Display", serif; }
.qv .t13 .mx-c small { color: #8b8178; }
.qv .t13 .mx-c.pick:hover { box-shadow: inset 0 0 0 1px #c9b89c; }
.qv .t13 .mx > .mx-c.pick[aria-pressed="true"] { background: #1d1a17; color: #d6cbb9; }
.qv .t13 .mx-c.pick[aria-pressed="true"] strong { color: #fff; }
.qv .t13 .mx > .mx-none { background: #f6f1ea; }
.qv .t13 .mx-none strong { color: #b3a796; }
.qv .mx { container-type: inline-size; }
.qv .t8 .mx { --mx-fs: 17px; --mx-fs-f: 24px; }
.qv .t9 .mx { --mx-fs: 17px; --mx-fs-f: 20px; }
.qv .t10 .mx { --mx-fs: 13px; --mx-fs-f: 17px; --mx-w: 7.6; }
.qv .t11 .mx { --mx-fs: 14px; --mx-fs-f: 18px; }
.qv .t12 .mx { --mx-fs: 15px; --mx-fs-f: 20px; }
.qv .t13 .mx { --mx-fs: 16px; }
.qv .mx .mx-c strong { font-size: min(var(--mx-fs, 15px), calc((100cqi / (1.5 + var(--n)) - 24px) / var(--mx-w, 5.4))); }
.qv .mx .mx-f strong { font-size: min(var(--mx-fs-f, 22px), calc((100cqi / (1.5 + var(--n)) - 24px) / var(--mx-w, 5.4))); }
@container paper (max-width: 420px) {
.qv .mx .mx-c strong { font-size: min(var(--mx-fs, 15px), calc((100cqi / var(--n) - 16px) / var(--mx-w, 5.4))); }
.qv .mx .mx-f strong { font-size: min(var(--mx-fs-f, 22px), calc((100cqi / var(--n) - 16px) / var(--mx-w, 5.4))); }
}
/* the totals take the company's colours only when chosen in their settings (15.805) — `.qv-own-tones` otherwise */
.sheet-brand-colors .qv:not(.qv-own-tones) .tone-1 { background-image: linear-gradient(150deg, color-mix(in srgb, var(--brand-1) 72%, #000), var(--brand-1)); }
.sheet-brand-colors .qv:not(.qv-own-tones) .tone-2 { background-image: linear-gradient(150deg, color-mix(in srgb, var(--brand-2) 72%, #000), var(--brand-2)); }
.sheet-brand-colors .qv:not(.qv-own-tones) .tone-3 { background-image: linear-gradient(150deg, color-mix(in srgb, var(--brand-3) 72%, #000), var(--brand-3)); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.t9, .t11, .t13-hero) .sum { background: none; }
.sheet-brand-colors .qv:not(.qv-own-tones) .mono .tone-1 { background-image: linear-gradient(150deg, color-mix(in srgb, var(--brand-1) 60%, #000), color-mix(in srgb, var(--brand-1) 80%, #000)); }
.sheet-brand-colors .qv:not(.qv-own-tones) .mono .tone-2 { background-image: linear-gradient(150deg, color-mix(in srgb, var(--brand-1) 80%, #000), var(--brand-1)); }
.sheet-brand-colors .qv:not(.qv-own-tones) .mono .tone-3 { background-image: linear-gradient(150deg, var(--brand-1), color-mix(in srgb, var(--brand-1) 75%, #fff)); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k7-band > div:nth-child(1) { --a: color-mix(in srgb, var(--brand-1) 72%, #000); --b: var(--brand-1); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k7-band.multi > div:nth-child(2) { --a: color-mix(in srgb, var(--brand-2) 72%, #000); --b: var(--brand-2); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k7-band.multi > div:nth-child(3) { --a: color-mix(in srgb, var(--brand-3) 72%, #000); --b: var(--brand-3); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k7-band:not(.multi) > div:nth-child(2) { --a: color-mix(in srgb, var(--brand-1) 85%, #000); --b: color-mix(in srgb, var(--brand-1) 85%, #fff); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k7-band:not(.multi) > div:nth-child(3) { --a: var(--brand-1); --b: color-mix(in srgb, var(--brand-1) 70%, #fff); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k7-head { background: linear-gradient(120deg, color-mix(in srgb, var(--brand-1) 72%, #000), var(--brand-1)); }
/* 15.717, 15.719 («адаптировать текст, для тёмного и для светлого фона»): every fill of a company colour carries the
   ink that reads on it (`--brand-ink-N`, `--brand-mono-ink-N`, chosen by contrast in render.js `brandSheet`) — the
   words, the sums and the notes inside; a design that leaves its sums unfilled (t9, t11, t13) keeps its own words */
.sheet-brand-colors .qv:not(.qv-own-tones) .tone-1 { --tone-ink: var(--brand-ink-1); }
.sheet-brand-colors .qv:not(.qv-own-tones) .tone-2 { --tone-ink: var(--brand-ink-2); }
.sheet-brand-colors .qv:not(.qv-own-tones) .tone-3 { --tone-ink: var(--brand-ink-3); }
.sheet-brand-colors .qv:not(.qv-own-tones) .mono .tone-1 { --tone-ink: var(--brand-mono-ink-1); }
.sheet-brand-colors .qv:not(.qv-own-tones) .mono .tone-2 { --tone-ink: var(--brand-mono-ink-2); }
.sheet-brand-colors .qv:not(.qv-own-tones) .mono .tone-3 { --tone-ink: var(--brand-mono-ink-3); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.tone-1, .tone-2, .tone-3):not(:is(.t9, .t11, .t13-hero) *) { color: var(--tone-ink); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.tone-1, .tone-2, .tone-3):not(:is(.t9, .t11, .t13-hero) *) :is(strong, b, span, .num, .v) {
  color: var(--tone-ink); background: none; -webkit-text-fill-color: currentColor; }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.tone-1, .tone-2, .tone-3):not(:is(.t9, .t11, .t13-hero) *) :is(small, em, i, .p-label) {
  color: color-mix(in srgb, var(--tone-ink) 72%, transparent); -webkit-text-fill-color: currentColor; }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band) > div:nth-child(1) { --tone-ink: var(--brand-ink-1); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band).multi > div:nth-child(2) { --tone-ink: var(--brand-ink-2); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band).multi > div:nth-child(3) { --tone-ink: var(--brand-ink-3); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band):not(.multi) > div:nth-child(2) { --tone-ink: var(--brand-mono-ink-2); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band):not(.multi) > div:nth-child(3) { --tone-ink: var(--brand-mono-ink-3); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band) > div, .sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band) > div :is(strong, b) {
  color: var(--tone-ink); }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.k7-band, .k20-band) > div :is(small, em) { color: color-mix(in srgb, var(--tone-ink) 72%, transparent); }
/* Filled by the company's colours, the sums of the compact totals are tiles of their own — apart, rounded, without the
   frame drawn for unfilled sums (15.729: «кривая заливка»; 15.730: «уродская обводка чёрная») */
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.t14, .t15, .t17, .t18, .t22) .sums { gap: 8px; padding: 0; border: 0; border-radius: 0; background: none; }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.t14, .t15, .t17, .t18, .t22) .sum { padding: 10px 14px; border: 0; border-radius: 12px; }
.sheet-brand-colors .qv:not(.qv-own-tones) :is(.t14, .t15, .t17, .t18, .t22) .sums.diff .deltas { border: 0; padding: 4px 2px 0; }
.sheet-brand-colors .qv:not(.qv-own-tones) .k20-band > div:nth-child(1) { --a: color-mix(in srgb, var(--brand-1) 72%, #000); --b: var(--brand-1); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k20-band.multi > div:nth-child(2) { --a: color-mix(in srgb, var(--brand-2) 72%, #000); --b: var(--brand-2); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k20-band.multi > div:nth-child(3) { --a: color-mix(in srgb, var(--brand-3) 72%, #000); --b: var(--brand-3); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k20-band:not(.multi) > div:nth-child(2) { --a: color-mix(in srgb, var(--brand-1) 85%, #000); --b: color-mix(in srgb, var(--brand-1) 85%, #fff); }
.sheet-brand-colors .qv:not(.qv-own-tones) .k20-band:not(.multi) > div:nth-child(3) { --a: var(--brand-1); --b: color-mix(in srgb, var(--brand-1) 70%, #fff); }