/* Страница /kalkulyator/markirovka-shchita/: список групп, предпросмотр полоски наклеек и печать в миллиметрах.
   Размеры наклеек заданы через --mm: на экране — увеличенный миллиметр, при печати — ровно 1mm. */
/* Широкая полоска не должна растягивать колонку страницы: прокрутка — только внутри предпросмотра. */
.land > .land-main{min-width:0}
.mk{min-width:0;max-width:100%}
.mk-lead{font-size:17px;color:var(--body);margin-bottom:18px}
.mk-nojs{border-radius:0;padding:12px 14px;margin-bottom:12px;font-size:14.5px}
.mk .mk-h{font-size:17px;margin:26px 0 12px}
.mk .mk-h:first-of-type{margin-top:0}
.mk-hint{display:block;font-size:14px;color:var(--muted);margin-top:6px;line-height:1.45}
p.mk-hint{margin:-4px 0 12px}
.mk .field label{text-transform:none;letter-spacing:0;font-size:14px;font-weight:700;color:var(--body)}

/* Список групп */
.mk-list{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:mk}
.mk-row{display:grid;grid-template-columns:30px 34px minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr);gap:8px;align-items:center;
  padding:8px;border-radius:0;background:var(--bg)}
.mk-row > .mk-n{grid-column:1;grid-row:1 / 3}
.mk-row > .mk-ic{grid-column:2;grid-row:1 / 3}
.mk-row .mk-name-in{grid-column:3 / 5;grid-row:1}
.mk-row .mk-ic-sel{grid-column:5 / 6;grid-row:1}
.mk-row .mk-nom-in{grid-column:3 / 4;grid-row:2}
.mk-row .mk-mod-sel{grid-column:4 / 5;grid-row:2}
.mk-row .mk-btns{grid-column:5 / 6;grid-row:2;justify-content:flex-end}
.mk-row.mk-row-gap > .mk-n,.mk-row.mk-row-gap > .mk-ic{grid-row:1}
.mk-row.mk-row-gap .mk-gap-t{grid-column:3 / 4;grid-row:1}
.mk-row.mk-row-gap .mk-mod-sel{grid-column:4 / 5;grid-row:1}
.mk-row.mk-row-gap .mk-btns{grid-row:1}
.mk-row.mk-row-gap{background:repeating-linear-gradient(135deg,#fff 0 8px,var(--alt) 8px 16px)}
@keyframes mk-flash{from{box-shadow:0 0 0 2px var(--acc-ink)}to{box-shadow:0 0 0 0 rgba(196,68,11,0)}}
.mk-n{font-weight:900;font-size:15px;color:var(--ink);text-align:center;font-variant-numeric:tabular-nums}
.mk-n.mk-n-off{color:var(--smoke);font-weight:700}
.mk-ic{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:0;background:#fff;color:var(--ink)}
.mk-ic svg{width:20px;height:20px}
.mk-row select,.mk-row input{padding:9px 10px;font-size:14.5px}
.mk-gap-t{font-size:14px;color:var(--muted);font-weight:600}
.mk-btns{display:flex;gap:4px}
.mk-b{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:0;background:#fff;color:var(--body);
  cursor:pointer;font:inherit;font-size:16px;line-height:1;transition:border-color .2s,color .2s}
.mk-b:hover{border-color:var(--acc-ink);color:var(--ink)}
.mk-b:focus-visible{border-color:var(--acc-ink)}
.mk-b[disabled]{opacity:.35;cursor:default;border-color:var(--line);color:var(--body)}
.mk-b-del:hover{border-color:var(--bad)}
.mk-empty{font-size:14.5px;color:var(--muted);padding:14px;border:1px dashed var(--line);border-radius:0;text-align:center;margin:0}

.mk-add{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.mk-quick{margin-top:14px}
.mk-quick-t{display:block;font-size:14px;font-weight:700;color:var(--body);margin-bottom:8px}
.mk-tags{display:flex;flex-wrap:wrap;gap:6px}
.mk-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 9px;border-radius:0;background:#fff;color:var(--body);
  font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:border-color .2s,background-color .2s}
.mk-chip svg{width:16px;height:16px;color:var(--volt-d)}
.mk-chip:hover{border-color:var(--acc-ink);background:var(--volt-pale)}
.mk-chip:focus-visible{border-color:var(--acc-ink)}

/* Предпросмотр */
.mk-prev-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 16px;margin-top:26px}
.mk-prev-head .mk-h{margin:0 0 8px}
.mk-scale{min-width:220px}
.mk-prev{margin-top:12px;padding:16px;border-radius:0;background:var(--alt);overflow-x:auto;-webkit-overflow-scrolling:touch;min-height:60px}
.mk-prev:focus-visible{outline-offset:2px}
.mk-msg{margin-top:10px}
.mk-msg b{color:var(--volt-d)}
.mk-act{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0 12px}
.mk-act .btn-volt,.mk-act .btn-ink{min-width:150px}
.mk-warn{margin:22px 0 8px}
.mk-ol{padding-left:22px}
.mk-ol li{margin-bottom:8px}

/* Полоска наклеек (общая для экрана и печати) */
.mk-line{margin-bottom:calc(5 * var(--mm, 1.5mm))}
.mk-line:last-child{margin-bottom:0}
.mk-cap{display:block;font-size:14px;font-weight:700;color:var(--muted);margin-bottom:4px;white-space:nowrap}
.mk-strip{display:inline-flex;align-items:stretch;background:#fff;color:#000;border-left:calc(.25 * var(--mm, 1.5mm)) solid #000;
  height:calc(var(--h, 15) * var(--mm, 1.5mm));font-family:Inter,Arial,sans-serif}
.mk-cell{box-sizing:border-box;flex:0 0 auto;width:calc(var(--w, 18) * var(--m, 1) * var(--mm, 1.5mm));height:100%;overflow:hidden;
  border:calc(.25 * var(--mm, 1.5mm)) solid #000;border-left:0;padding:calc(.7 * var(--mm, 1.5mm)) calc(.6 * var(--mm, 1.5mm));
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:calc(.35 * var(--mm, 1.5mm))}
.mk-top{display:flex;align-items:baseline;justify-content:center;gap:calc(.8 * var(--mm, 1.5mm));width:100%;white-space:nowrap;overflow:hidden;line-height:1;flex:0 0 auto}
.mk-no{font-weight:900;font-size:calc(2.7 * var(--mm, 1.5mm))}
.mk-nom{font-weight:700;font-size:calc(2.1 * var(--mm, 1.5mm));overflow:hidden;text-overflow:clip}
.mk-svg{flex:0 0 auto;display:block;width:calc(var(--h, 15) * .3 * var(--mm, 1.5mm));height:calc(var(--h, 15) * .3 * var(--mm, 1.5mm))}
.mk-svg svg{width:100%;height:100%;display:block}
.mk-name{font-weight:700;font-size:calc(2.2 * var(--mm, 1.5mm));line-height:1.1;overflow:hidden;overflow-wrap:anywhere;hyphens:auto;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;max-width:100%}
.mk-h12 .mk-name{-webkit-line-clamp:1}
.mk-h20 .mk-name{-webkit-line-clamp:3;font-size:calc(2.6 * var(--mm, 1.5mm))}
.mk-h20 .mk-no{font-size:calc(3.2 * var(--mm, 1.5mm))}
.mk-h20 .mk-nom{font-size:calc(2.5 * var(--mm, 1.5mm))}
.mk-cell-gap{background:#fff}
.mk-none{font-size:14.5px;color:var(--muted);margin:0}

/* Лист для печати: создаётся скриптом в конце body, на экране скрыт */
.mk-sheet{display:none}

@media (max-width:560px){
  .mk-row{grid-template-columns:22px 34px minmax(0,1fr) minmax(112px,1fr);gap:7px}
  .mk-row > .mk-n,.mk-row > .mk-ic{grid-row:1}
  .mk-row .mk-name-in{grid-column:3 / 5;grid-row:1}
  .mk-row .mk-ic-sel{grid-column:1 / 4;grid-row:2}
  .mk-row .mk-mod-sel{grid-column:4 / 5;grid-row:2}
  .mk-row .mk-nom-in{grid-column:1 / 4;grid-row:3}
  .mk-row .mk-btns{grid-column:4 / 5;grid-row:3}
  .mk-row.mk-row-gap .mk-gap-t{grid-column:3 / 5;grid-row:1}
  .mk-row.mk-row-gap .mk-mod-sel{grid-column:1 / 4;grid-row:2}
  .mk-row.mk-row-gap .mk-btns{grid-column:4 / 5;grid-row:2}
  .mk-row select,.mk-row input{padding:9px 8px}
  .mk-scale{min-width:0;width:100%}
  .mk-prev{padding:12px}
}
@media (prefers-reduced-motion:reduce){
  .mk-row.mk-flash{animation:none}
  .mk-b,.mk-chip{transition:none}
}

@media print{
  @page{size:A4 landscape;margin:10mm}
  html,body{background:#fff!important}
  body > *:not(.mk-sheet){display:none!important}
  .mk-sheet{display:block!important;--mm:1mm;color:#000;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .mk-sheet .mk-line{margin:0 0 6mm;break-inside:avoid;page-break-inside:avoid}
  .mk-sheet .mk-cap{font-size:2.6mm;color:#555;margin-bottom:1mm}
  .mk-ruler{margin-top:4mm;break-inside:avoid;page-break-inside:avoid;font-size:2.6mm;color:#555}
  .mk-ruler i{display:block;width:50mm;height:2.5mm;border:.25mm solid #000;border-top:0;margin-bottom:1mm}
}
/* фирменный вид: строки групп и кнопки — с фаской, рамки внутренней тенью */
.mk-row,.mk-b,.mk-ic,.mk-chip,.mk-nojs,.mk-prev,.mk-empty{--c:var(--c-xs);clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.mk-row,.mk-prev{--c:var(--c-m)}
.mk-row{border:0;box-shadow:inset 0 0 0 1px var(--line)}
.mk-b,.mk-ic,.mk-chip{border:0;box-shadow:inset 0 0 0 1px var(--steel)}
.mk-b:hover,.mk-chip:hover{box-shadow:inset 0 0 0 2px var(--acc-ink)}
.mk-b-del:hover{box-shadow:inset 0 0 0 2px var(--bad);color:var(--bad)}
.mk-b:focus-visible,.mk-chip:focus-visible{outline:0;box-shadow:inset 0 0 0 3px var(--acc-ink)}
.mk-b[disabled]{box-shadow:inset 0 0 0 1px var(--steel)}
.mk-nojs{border:0;background:var(--acc-wash);box-shadow:inset 4px 0 0 var(--acc)}
.mk-prev:focus-visible{outline:0;box-shadow:inset 0 0 0 3px var(--acc-ink)}
.mk-row.mk-flash{animation:none}
.js .mk-row.mk-flash{animation:mk-flash2 .9s var(--ease)}
@keyframes mk-flash2{from{background-color:var(--acc-wash)}}
@media (prefers-reduced-motion:reduce){ .js .mk-row.mk-flash{animation:none} }