/* The documents on paper (app/ui/print/): drawn into #print, which only paper shows. Sizes in mm match CAP and ROW of
   print/sheet.js: a drawing sheet A4 landscape with the frame of ГОСТ 2.301 (20 mm left, 5 mm elsewhere) and the main
   inscription 185 × 40 mm; a business sheet A4 portrait. Black on white in both themes: paper has no dark mode. */

@media screen {
  #print { display: none; }
}

@page { size: A4; margin: 0; }
@page land { size: A4 landscape; margin: 0; }

@media print {
  html, body { background: #fff; height: auto; overflow: visible; }
  .app, #welcome, #tour, #tour-ring { display: none !important; }
  #print { display: block; }
}

#print { color: #000; color-scheme: light; font: 9pt/1.25 "Segoe UI", Arial, sans-serif; font-variant-numeric: tabular-nums; }
.psheet { position: relative; overflow: hidden; box-sizing: border-box; background: #fff; break-after: page; }
.psheet:last-child { break-after: auto; }
.psheet.land { page: land; width: 297mm; height: 210mm; }
.psheet.port { width: 210mm; height: 297mm; padding: 15mm 15mm 12mm 20mm; display: flex; flex-direction: column; }

/* the demo mark: over everything, light enough to read through, on every sheet */
.demo { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; pointer-events: none;
  font-size: 110pt; font-weight: 800; letter-spacing: 8mm; color: rgba(0, 0, 0, 0.09); transform: rotate(-28deg); }

/* drawing sheet: frame, content, main inscription */
.frame { position: absolute; left: 20mm; top: 5mm; right: 5mm; bottom: 5mm; border: 0.5mm solid #000; display: flex; flex-direction: column; }
.frame .pbody { flex: 1; min-height: 0; padding: 3mm 4mm; overflow: hidden; }
.stamp { align-self: flex-end; width: 185mm; height: 40mm; box-sizing: border-box; border-top: 0.5mm solid #000; border-left: 0.5mm solid #000;
  display: grid; grid-template-columns: 75mm repeat(3, 1fr); grid-template-rows: repeat(4, 1fr); }
.sc { min-width: 0; overflow: hidden; border-right: 0.25mm solid #000; border-bottom: 0.25mm solid #000; padding: 0.6mm 1.5mm;
  display: flex; flex-direction: column; justify-content: space-between; }
.sc .k { font-size: 6.5pt; color: #222; }
.sc .v { font-size: 9pt; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc.big { grid-row: 1 / 3; justify-content: center; gap: 1mm; }
.sc.big .v { font-size: 12pt; white-space: normal; }
.sc.wide, .sc.sign { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 4mm; border-right: 0; }
.sc.sign { border-bottom: 0; }
.sc.sign .v { font-weight: 400; }
.sc.sign .k { flex: 1; text-align: right; }
.sc.sign .k::before { content: ""; display: inline-block; width: 45mm; border-bottom: 0.25mm solid #000; margin-right: 3mm; }

/* the top of the shop task: the scheme with its size beside the facts */
.ptop { display: grid; grid-template-columns: 1.15fr 1fr; gap: 5mm; height: 80mm; margin-bottom: 2mm; }
.pfig { margin: 0; display: flex; flex-direction: column; min-height: 0; }
.pfig svg { flex: 1; min-height: 0; width: 100%; }
.pfig figcaption { font-size: 7pt; color: #333; }
svg.pscheme polygon { stroke: #000; stroke-width: 0.6; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
svg.pscheme .f-top { fill: #fff; }
svg.pscheme .f-x { fill: #e4e4e4; }
svg.pscheme .f-y { fill: #c8c8c8; }
svg.pscheme .dim line { stroke: #000; vector-effect: non-scaling-stroke; }
svg.pscheme .dim-ext { stroke-width: 0.35; }
svg.pscheme .dim-line { stroke-width: 0.5; }
svg.pscheme .dim-tick { stroke-width: 0.9; }
svg.pscheme .dim-text { fill: #000; font-family: "Segoe UI", Arial, sans-serif; }
.pdesc { margin: 0 0 2mm; font-weight: 600; }
.facts { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 0.8mm 3mm; font-size: 8.5pt; }
.facts dt { font-weight: 600; }
.facts dd { margin: 0; }
#print small { font-size: 7pt; color: #333; }

/* tables: ROW.head 13 mm (title + head row), a line 3.6 mm, padding 2.6 mm */
#print h2 { font-size: 13pt; margin: 0 0 4mm; }
#print h3 { font-size: 10pt; margin: 2.5mm 0 1.5mm; }
#print p { margin: 0 0 1.5mm; }
#print p.src { font-size: 7.5pt; color: #333; }
.pt { width: 100%; border-collapse: collapse; font-size: 8.5pt; line-height: 1.2; }
.pt th, .pt td { border: 0.25mm solid #000; padding: 0.6mm 1.5mm; text-align: left; vertical-align: top; }
.pt th { background: #e8e8e8; font-weight: 600; font-size: 7.5pt; }
.pt .n { text-align: right; white-space: nowrap; }
.pt .r { font-size: 7.5pt; }
.pt tr.total td { font-weight: 700; border-top-width: 0.5mm; }
.pt .big { font-size: 12pt; }
.pt .pbar { width: 60%; }
.pt .pbar div { font-size: 7.5pt; }
svg.bar { width: 100%; height: 4mm; display: block; }
svg.bar rect { vector-effect: non-scaling-stroke; }
svg.bar .st { fill: none; stroke: #000; stroke-width: 0.6; }
svg.bar .pc { fill: #cfcfcf; stroke: #000; stroke-width: 0.6; }
svg.bar .ws { fill: #fff; stroke: #000; stroke-width: 0.6; stroke-dasharray: 2 1.5; }

/* business sheet: the factory on the first, a footer on every one */
.phead { display: flex; align-items: center; gap: 6mm; height: 28mm; margin-bottom: 6mm; padding-bottom: 3mm; border-bottom: 0.4mm solid #000; box-sizing: border-box; }
.plogo { max-height: 22mm; max-width: 55mm; object-fit: contain; }
.fname { font-size: 14pt; font-weight: 700; }
.fline { font-size: 8.5pt; }
.port .pbody { flex: 1; min-height: 0; overflow: hidden; }
.pfoot { height: 10mm; margin-top: 4mm; border-top: 0.25mm solid #000; display: flex; align-items: center; justify-content: space-between; gap: 4mm; font-size: 7.5pt; }
.pfoot .sign { font-weight: 600; }
/* the licensee line (sheet.js licenseeLine, off until Pavel says yes): small, under the frame and the footer */
.plic { position: absolute; left: 0; right: 0; bottom: 1.5mm; text-align: center; font-size: 6pt; color: #555; }