/* ============================================================
     Listar property report — print-first template.
     A4. Renders identically in browser and in PDF (Chrome print).
     Sample data below is illustrative; every value is a template slot.
     ============================================================ */

  @page {
    size: A4;
    margin: 16mm 15mm 20mm;
  }

  :root {
    --ink:        #101828;
    --ink-soft:   #344054;
    --muted:      #667085;
    --faint:      #98A2B3;
    --rule:       #E4E7EC;
    --rule-soft:  #F2F4F7;
    --paper:      #FFFFFF;
    --wash:       #F9FAFB;

    --navy:       #14304F;
    --navy-deep:  #0C2038;
    --gold:       #A67C3D;

    --ok:         #067647;
    --ok-bg:      #ECFDF3;
    --warn:       #B54708;
    --warn-bg:    #FFFAEB;
    --high:       #B42318;
    --high-bg:    #FEF3F2;
    --info:       #175CD3;
    --info-bg:    #EFF8FF;
  }

  * { box-sizing: border-box; }

  html { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  body {
    margin: 0;
    background: var(--wash);
    color: var(--ink);
    font: 400 10.5pt/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
    font-variant-numeric: tabular-nums;
    -webkit-font-smoothing: antialiased;
  }

  .sheet {
    max-width: 210mm;
    margin: 0 auto;
    padding: 16mm 15mm 20mm;
    background: var(--paper);
  }

  @media print {
    body { background: var(--paper); }
    .sheet { max-width: none; margin: 0; padding: 0; }
    .no-print { display: none !important; }
  }

  /* ---------- typography ---------- */

  .wordmark {
    font: 600 15pt/1 ui-serif, Georgia, "Times New Roman", serif;
    letter-spacing: .14em;
    color: var(--navy);
    text-transform: uppercase;
  }
  .wordmark span { color: var(--gold); }

  h1 {
    margin: 0 0 2mm;
    font: 600 19pt/1.25 ui-serif, Georgia, serif;
    letter-spacing: -.01em;
    color: var(--navy-deep);
  }

  h2 {
    margin: 0;
    font: 600 11.5pt/1.3 -apple-system, "Segoe UI", Inter, sans-serif;
    letter-spacing: .01em;
    color: var(--navy-deep);
  }

  h3 {
    margin: 0 0 1.5mm;
    font: 600 10pt/1.4 -apple-system, "Segoe UI", Inter, sans-serif;
    color: var(--ink);
  }

  .eyebrow {
    font: 600 7.5pt/1 -apple-system, "Segoe UI", Inter, sans-serif;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--faint);
  }

  .mne { font-style: italic; color: var(--muted); font-weight: 400; }

  .lead { font-size: 11pt; line-height: 1.6; color: var(--ink-soft); }
  .small { font-size: 8.5pt; line-height: 1.5; color: var(--muted); }
  .tiny  { font-size: 7.5pt; line-height: 1.45; color: var(--faint); }

  /* ---------- masthead ---------- */

  .masthead {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 4mm;
    border-bottom: 2px solid var(--navy);
  }
  .masthead .meta { text-align: right; }
  .masthead .meta dl {
    margin: 0;
    display: grid;
    grid-template-columns: auto auto;
    gap: 0 4mm;
    font-size: 8.5pt;
  }
  .masthead .meta dt { color: var(--faint); text-align: right; }
  .masthead .meta dd { margin: 0; font-weight: 600; color: var(--ink-soft); }

  .title-block { margin: 7mm 0 6mm; }

  /* ---------- verdict ---------- */

  .verdict {
    display: grid;
    grid-template-columns: 42mm 1fr;
    gap: 0;
    border: 1px solid var(--rule);
    border-radius: 3px;
    overflow: hidden;
    break-inside: avoid;
  }

  .verdict .score {
    background: var(--navy-deep);
    color: #fff;
    padding: 6mm 5mm;
    text-align: center;
  }
  .verdict .score .n {
    display: block;
    font: 600 34pt/1 ui-serif, Georgia, serif;
    letter-spacing: -.03em;
  }
  .verdict .score .d { font-size: 8pt; color: #93A9C2; }
  .verdict .score .band {
    display: inline-block;
    margin-top: 3mm;
    padding: 1mm 3mm;
    border-radius: 2px;
    background: var(--warn);
    color: #fff;
    font: 600 8pt/1.4 -apple-system, sans-serif;
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  .verdict .summary { padding: 5mm 6mm; }
  .verdict .summary p { margin: 0 0 3mm; }
  .verdict .summary p:last-child { margin-bottom: 0; }

  /* ---------- sections ---------- */

  section { margin-top: 9mm; break-inside: auto; }

  .sec-head {
    display: flex;
    align-items: baseline;
    gap: 3mm;
    padding-bottom: 2mm;
    margin-bottom: 4mm;
    border-bottom: 1px solid var(--rule);
  }
  .sec-head .num {
    font: 600 9pt/1 ui-serif, Georgia, serif;
    color: var(--gold);
    letter-spacing: .04em;
  }
  .sec-head .sheet-tag {
    margin-left: auto;
    font: 600 7.5pt/1 -apple-system, sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--faint);
  }

  /* ---------- findings ---------- */

  /* The severity chip sits in a gutter column that must stay aligned down the
     whole list while sizing itself to its content — "Существенно" is half again
     as wide as "Serious", so a fixed millimetre column overflows in some
     locales and looks slack in others. A subgrid lets the outer container size
     the column once, from the widest chip in the report, and every row inherit
     it. The fallback keeps the chip above the heading rather than beside it,
     which loses the look but never collides. */
  .findings {
    display: grid;
    grid-template-columns: max-content 1fr;
  }
  .finding {
    grid-column: 1 / -1;
    padding: 3.5mm 0;
    border-bottom: 1px solid var(--rule-soft);
    break-inside: avoid;
  }
  @supports (grid-template-columns: subgrid) {
    .finding {
      display: grid;
      grid-template-columns: subgrid;
      gap: 0 4mm;
    }
  }
  .finding:last-child { border-bottom: 0; }

  .chip {
    display: inline-block;
    padding: .8mm 2.5mm;
    border-radius: 2px;
    font: 600 7.5pt/1.5 -apple-system, sans-serif;
    letter-spacing: .07em;
    text-transform: uppercase;
    white-space: nowrap;
  }
  .chip.high { background: var(--high-bg); color: var(--high); }
  .chip.warn { background: var(--warn-bg); color: var(--warn); }
  .chip.info { background: var(--info-bg); color: var(--info); }
  .chip.ok   { background: var(--ok-bg);   color: var(--ok); }

  .finding .body strong { display: block; margin-bottom: .8mm; }
  .finding .body p { margin: 0; font-size: 9.5pt; color: var(--ink-soft); }

  /* ---------- tables ---------- */

  table {
    width: 100%;
    border-collapse: collapse;
    font-size: 9.5pt;
  }
  caption {
    caption-side: top;
    text-align: left;
    padding-bottom: 2mm;
    font-size: 8.5pt;
    color: var(--muted);
  }
  th {
    text-align: left;
    padding: 2mm 3mm 2mm 0;
    border-bottom: 1px solid var(--ink);
    font: 600 7.5pt/1.3 -apple-system, sans-serif;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--ink-soft);
    white-space: nowrap;
  }
  td {
    padding: 2.4mm 3mm 2.4mm 0;
    border-bottom: 1px solid var(--rule-soft);
    vertical-align: top;
  }
  tr:last-child td { border-bottom: 1px solid var(--rule); }
  td:last-child, th:last-child { padding-right: 0; }
  .num { text-align: right; white-space: nowrap; }
  tfoot td {
    border-bottom: 0;
    border-top: 1px solid var(--ink);
    font-weight: 600;
    padding-top: 2mm;
  }

  /* ---------- key/value grid ---------- */

  .kv {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 8mm;
    margin: 0;
  }
  .kv > div {
    display: flex;
    justify-content: space-between;
    gap: 4mm;
    padding: 2.2mm 0;
    border-bottom: 1px solid var(--rule-soft);
  }
  .kv dt { color: var(--muted); font-size: 9.5pt; }
  .kv dd { margin: 0; font-weight: 600; text-align: right; }

  /* ---------- callouts ---------- */

  .callout {
    padding: 4mm 5mm;
    border-left: 3px solid var(--warn);
    background: var(--warn-bg);
    border-radius: 0 3px 3px 0;
    break-inside: avoid;
  }
  .callout.high { border-left-color: var(--high); background: var(--high-bg); }
  .callout.info { border-left-color: var(--info); background: var(--info-bg); }
  .callout.ok   { border-left-color: var(--ok);   background: var(--ok-bg); }
  .callout h3 { margin-bottom: 1.5mm; }
  .callout p  { margin: 0; font-size: 9.5pt; color: var(--ink-soft); }

  /* ---------- scoring ledger ---------- */

  .ledger td:first-child { width: 60%; }
  .ledger .pts { font-weight: 600; color: var(--high); }
  .ledger .pts.zero { color: var(--ok); }

  /* ---------- provenance ---------- */

  .provenance {
    margin-top: 9mm;
    padding: 5mm;
    background: var(--wash);
    border: 1px solid var(--rule);
    border-radius: 3px;
    break-inside: avoid;
  }
  .provenance dl {
    display: grid;
    grid-template-columns: 38mm 1fr;
    gap: 1.6mm 4mm;
    margin: 3mm 0 0;
    font-size: 8.5pt;
  }
  .provenance dt { color: var(--muted); }
  .provenance dd { margin: 0; color: var(--ink-soft); }
  .hash {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 7.5pt;
    word-break: break-all;
    color: var(--ink-soft);
  }

  .disclaimer {
    margin-top: 6mm;
    padding-top: 4mm;
    border-top: 1px solid var(--rule);
  }

  /* ---------- running footer ---------- */

  .runner {
    position: fixed;
    bottom: 6mm;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    font: 400 7.5pt/1 -apple-system, sans-serif;
    color: var(--faint);
    border-top: 1px solid var(--rule);
    padding-top: 2mm;
  }
  @media screen { .runner { display: none; } }

  .verdict .counts {
    font-size: 8.5pt !important;
    color: var(--muted) !important;
    letter-spacing: .01em;
  }

  /* Language switcher. Plain links to sibling files rather than script: works
     from a local folder with no server, survives being emailed, never prints. */
  .lang-switch {
    display: flex;
    align-items: baseline;
    gap: 3mm;
    margin-right: auto;
    font: 400 8.5pt/1.4 -apple-system, BlinkMacSystemFont, sans-serif;
  }
  .lang-label {
    color: var(--faint);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 7pt;
    font-weight: 600;
  }
  .lang-list { display: flex; flex-wrap: wrap; gap: 0 2.5mm; }
  .lang-list .lang + .lang { border-left: 1px solid var(--rule); padding-left: 2.5mm; }
  a.lang { color: var(--navy); text-decoration: none; }
  a.lang:hover { text-decoration: underline; }
  .lang.current { color: var(--ink); font-weight: 600; }

  /* A verbatim quotation of the register, inside a finding. */
  .verbatim {
    margin: 2mm 0 0 !important;
    padding-left: 3mm;
    border-left: 2px solid var(--rule);
    font-size: 8.5pt !important;
  }
  .muted-cell { color: var(--faint); font-style: italic; }
  .band-low { background: var(--ok) !important; }
  .band-moderate { background: var(--info) !important; }
  .band-elevated { background: var(--warn) !important; }
  .band-high { background: var(--high) !important; }

  .demo-banner {
    margin-bottom: 6mm;
    padding: 3mm 4mm;
    border: 1px dashed var(--faint);
    border-radius: 3px;
    background: var(--wash);
    font: 400 8pt/1.5 -apple-system, sans-serif;
    color: var(--muted);
  }
  .demo-banner strong { color: var(--ink-soft); }

  .toolbar {
    max-width: 210mm;
    margin: 6mm auto 0;
    padding: 0 15mm;
    display: flex;
    justify-content: flex-end;
    gap: 3mm;
  }
  .toolbar button {
    padding: 2.5mm 5mm;
    border: 1px solid var(--navy);
    background: var(--navy);
    color: #fff;
    border-radius: 3px;
    font: 600 9pt/1 -apple-system, sans-serif;
    cursor: pointer;
  }