/* ЗемСат: one restrained look for the start page, the reports and the documents.
   Ink on white, one dark green for actions and links. Blocks are told apart by space and headings, not by frames
   or a hairline under every row (owner, 2026-10-12: the hairlines read as a generated template). A line stays only
   where it does a job: fields, buttons, switches, the head of a table, a sticky bar over the text.
   Status colours mark meaning (attention / fine / no data), never decoration.
   Type (owner, 2026-10-12: the system font and pale grey read as generated): PT Sans for the interface and the data,
   PT Serif for headings and documents — ParaType's «Общедоступные шрифты Российской Федерации», SIL OFL 1.1
   (static/fonts/OFL.txt), served from our own host (CSP font-src 'self'). Greys keep at least 5:1 on white.
   Paper (owner, 2026-10-12, for trust): the page is warm paper (#f7f4ec), controls and the map sheet are lighter
   paper laid on it; no textures, no vintage, nothing that looks like an official form. Greys re-checked on paper.
   Identity (owner, 2026-10-12, «План участка»): the report reads as a plan of the plot — the cover is a map sheet
   (frame in degrees, scale bar, north), measurements in PT Mono, topics marked with topographic signs.
   Screen theme Б2 «тёмный спутник» (owner, 2026-10-16): on screen the paper is night — dark paper, slightly lighter
   sheets, warm off-white ink, amber for the one action and under what needs attention; the plot's own living map is
   the picture. Print and PDF keep the light paper above: the dark values live in @media screen only. */
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-sans-cyrillic-400-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-sans-cyrillic-400-italic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/fonts/pt-sans-cyrillic-700-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-sans-latin-400-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: "PT Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-sans-latin-400-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: "PT Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/fonts/pt-sans-latin-700-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: "PT Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-sans-rub-400-normal.woff2") format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/fonts/pt-sans-rub-700-normal.woff2") format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "PT Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-serif-cyrillic-400-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Serif"; font-style: italic; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-serif-cyrillic-400-italic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Serif"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/fonts/pt-serif-cyrillic-700-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-serif-latin-400-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: "PT Serif"; font-style: italic; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-serif-latin-400-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: "PT Serif"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/fonts/pt-serif-latin-700-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: "PT Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-serif-rub-400-normal.woff2") format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "PT Serif"; font-style: normal; font-weight: 700; font-display: swap; src: url("/static/fonts/pt-serif-rub-700-normal.woff2") format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "PT Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-mono-cyrillic-400-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "PT Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("/static/fonts/pt-mono-latin-400-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; }
:root {
  --ink: #23211c;
  --muted: #4b524e;
  --faint: #5f645f;
  --line: #e2ddd0;
  --line-strong: #cbc4b4;
  --accent: #2b5747;
  --accent-hover: #1f4236;
  --soft: #eeeadf;
  --ok: #2d6a4f;
  --warn: #8a5a0b;
  /* Marker tints under a verdict: warm for attention, sage for fine, stone for not checked. */
  --mark-attention: #f5dc9f;
  --mark-ok: #d6e8cc;
  --mark-unknown: #e4e0d6;
  --info: #49596a;
  --none: #7a807c;
  --surface: #fffdf8;
  --canvas: #f7f4ec;
  --font-ui: "PT Sans", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-text: "PT Serif", Georgia, "Times New Roman", serif;
  /* Numbers that are read as measurements: cadastral numbers, coordinates, areas, the map sheet's frame. */
  --font-mono: "PT Mono", ui-monospace, Consolas, monospace;
  /* Five sizes, no more (owner, 2026-10-12: 32 sizes and three families made the type «jump»): notes, secondary,
     body, sub-heads and answers, section heads; h1 keeps its own clamp.  Serif only for h1 and h2. */
  --fs-xs: .8rem;
  --fs-s: .9rem;
  --fs-m: 1rem;
  --fs-l: 1.15rem;
  --fs-xl: 1.4rem;
  /* Topographic colours for the signs of the plan (owner's identity «План участка», 2026-10-12). */
  --topo-water: #2a6db5;
  --topo-forest: #3d7a3a;
  --topo-relief: #8a5a2b;
  --topo-road: #c77a1a;
  /* Text on the accent, the field, a softer ink for verdicts, an error and the map's empty background. */
  --on-accent: #fff;
  --field: var(--surface);
  --ink-soft: #3c4440;
  --error: #a12a24;
  --focus: rgba(43, 87, 71, .25);
  --map-bg: #e9ece8;
  --chart: #c9cfcb;
  --chart-hover: #a9b1ac;
  --bar-bg: rgba(247, 244, 236, .97);
  /* Kept for the technical report, which refers to them by name. */
  --green: var(--accent);
  --green-dark: var(--accent-hover);
  --blue: var(--info);
  --blue-soft: var(--soft);
  --amber: var(--warn);
  font-family: var(--font-ui);
  font-size: 106.25%;
  color: var(--ink);
  background: var(--canvas);
}

@media screen {
  :root {
    color-scheme: dark;
    --ink: #e8e6df;
    --ink-soft: #cfd3cf;
    --muted: #a9b2b2;
    --faint: #939d9e;
    --line: #26313a;
    --line-strong: #3b4852;
    --accent: #f0b54a;
    --accent-hover: #f7c96f;
    --on-accent: #17120a;
    --soft: #1a232a;
    --ok: #8fcf9c;
    --warn: #f0b54a;
    --mark-attention: rgba(240, 181, 74, .3);
    --mark-ok: rgba(124, 196, 138, .26);
    --mark-unknown: rgba(255, 255, 255, .13);
    --info: #a8bdd1;
    --none: #8d979a;
    --surface: #141b20;
    --canvas: #0b0f12;
    --field: #0f1519;
    --error: #ff8f84;
    --focus: rgba(240, 181, 74, .35);
    --map-bg: #11181c;
    --chart: #4a5861;
    --chart-hover: #6a7a84;
    --bar-bg: rgba(11, 15, 18, .96);
    --topo-water: #6aa6ff;
    --topo-forest: #7cc48a;
    --topo-relief: #d39a5f;
    --topo-road: #f0a640;
  }
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--canvas); font-size: var(--fs-m); line-height: 1.5; text-rendering: optimizeLegibility; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--font-text); font-weight: 700; letter-spacing: 0; }
h3 { font-family: var(--font-ui); font-weight: 700; }
h1 { font-size: clamp(1.6rem, 3vw, 2.05rem); line-height: 1.2; margin-bottom: 10px; }
h2 { font-size: var(--fs-l); line-height: 1.3; margin-bottom: 6px; }
h3 { font-size: var(--fs-m); line-height: 1.35; }
a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--accent-hover); }
[hidden] { display: none !important; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.muted, .method { color: var(--muted); }

/* Page frame: masthead, content, footer. */
.page { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
/* The strict header of direction А2 in the dark of Б2 (owner, 2026-10-16): a mono service line with the address, then
   the word, the sections and the one action; the footer in three columns. */
.topbar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 20px; margin: 0 -24px; padding: 6px 24px; border-bottom: 1px solid var(--line); color: var(--faint); font: var(--fs-xs)/1.5 var(--font-mono); }
.topbar a { color: var(--muted); text-decoration: none; }
.topbar-contacts { display: flex; flex-wrap: wrap; gap: 2px 20px; }
.topbar a:hover { color: var(--accent); }
.masthead { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 28px; padding: 14px 0 10px; }
/* The word as the dot matrix of an instrument's display, in the accent's yellow (owner, 2026-10-16): one SVG of dots
   used as a mask, so its colour follows the page. */
.wordmark { display: inline-flex; align-items: center; color: var(--accent); text-decoration: none; }
.wordmark:hover { color: var(--accent-hover); }
.wordmark-dots { display: block; height: 26px; aspect-ratio: 410 / 70; background: currentColor; -webkit-mask: url("/static/wordmark.svg") center / contain no-repeat; mask: url("/static/wordmark.svg") center / contain no-repeat; }
.masthead-nav { display: flex; flex-wrap: wrap; gap: 4px 22px; flex: 1 1 320px; font-size: var(--fs-s); }
.masthead-nav a, .my-reports-button { color: var(--muted); text-decoration: none; }
.masthead-nav a:hover, .my-reports-button:hover { color: var(--ink); text-decoration: underline; }
.my-reports-button { border: 0; border-radius: 0; padding: 0; background: transparent; font-size: inherit; font-weight: 400; line-height: inherit; }
.my-reports-panel { position: absolute; z-index: 1200; top: calc(100% - 4px); right: 0; width: min(600px, calc(100vw - 48px)); padding: 14px 18px 16px; background: var(--surface); box-shadow: 0 14px 38px rgba(0, 0, 0, .28); }
.my-reports-panel:focus { outline: 2px solid var(--focus); outline-offset: 2px; }
.my-reports-panel-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 5px; }
.my-reports-panel-head strong { font-size: var(--fs-s); }
.my-reports-panel-head strong span { color: var(--muted); font-weight: 400; }
.my-reports-status { margin: 6px 0 0; color: var(--error); font-size: var(--fs-xs); }
.my-reports-status:empty { display: none; }
.masthead-action { padding: 8px 16px; border: 1px solid var(--accent); border-radius: 4px; color: var(--accent); font-size: var(--fs-s); font-weight: 700; text-decoration: none; }
.masthead-action:hover { background: var(--accent); color: var(--on-accent); }
.masthead-note { color: var(--faint); font-size: var(--fs-s); }
.site-footer { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(4, minmax(0, 1fr)); gap: 20px 40px; margin: 72px -24px 0; padding: 28px 24px 34px; border-top: 1px solid var(--line); color: var(--faint); font-size: var(--fs-xs); line-height: 1.6; }
.site-footer nav { display: grid; gap: 6px; align-content: start; }
.site-footer a { color: var(--muted); text-decoration: none; }
.site-footer a:hover { color: var(--ink); text-decoration: underline; }
.site-footer p { margin: 0; }
.site-footer .wordmark { margin-bottom: 8px; }
.site-footer .wordmark-dots { height: 20px; }
.site-footer-partner { color: var(--faint); }
/* Four columns of links since the pages about checks and audiences (2026-10-22): on a narrow page the service's line
   takes a row of its own. */
.doc-page .site-footer { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px 24px; }
.doc-page .site-footer-about { grid-column: 1 / -1; }
@media (max-width: 1080px) { .site-footer { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px 24px; } .site-footer-about { grid-column: 1 / -1; } }
@media (max-width: 760px) { .site-footer, .doc-page .site-footer { grid-template-columns: repeat(2, minmax(0, 1fr)); } .masthead-nav { order: 3; flex-basis: 100%; } }
@media print { .site-footer, .masthead, .topbar { display: none; } }

/* Controls. */
label { display: grid; gap: 6px; font-size: var(--fs-s); font-weight: 400; }
input, select, textarea { width: 100%; border: 1px solid var(--line-strong); border-radius: 4px; padding: 8px 10px; background: var(--field); font-weight: 400; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--focus); outline-offset: 0; border-color: var(--accent); }
input[type="checkbox"], input[type="radio"] { width: auto; margin: 0; accent-color: var(--accent); }
button, .secondary-link, a.primary { cursor: pointer; border-radius: 4px; padding: 8px 14px; font-size: var(--fs-s); font-weight: 600; text-decoration: none; line-height: 1.3; }
.primary { background: var(--accent); color: var(--on-accent); border: 1px solid var(--accent); }
a.primary { display: inline-block; }
.primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: var(--on-accent); }
.primary:disabled { cursor: not-allowed; background: transparent; border-color: var(--line-strong); color: var(--muted); }
.secondary, .secondary-link { display: inline-block; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); }
.secondary:hover, .secondary-link:hover { border-color: var(--ink); color: var(--ink); }
.secondary:disabled { cursor: not-allowed; border-color: var(--line); color: var(--muted); }
.link-button { border: 0; background: none; padding: 0; color: var(--accent); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.link-button:disabled { color: var(--faint); text-decoration: none; cursor: not-allowed; }
.field { gap: 5px; }
.field > span { font-size: var(--fs-s); font-weight: 700; }
.field-note { margin: 0; color: var(--muted); font-size: var(--fs-xs); font-weight: 400; line-height: 1.45; }
.form-error { min-height: 0; margin: 0; color: var(--error); font-size: var(--fs-s); }
.form-error:empty, .form-status:empty, .field-note:empty, .date-status:empty { display: none; }
.form-status, .monitor-status { margin: 0; color: var(--muted); font-size: var(--fs-s); line-height: 1.45; }

/* Start page. */
.app-page { max-width: 1320px; }
.intro { max-width: 720px; margin: 30px 0 22px; }
.intro p { margin: 0; color: var(--muted); font-size: var(--fs-m); }
.intro .intro-demo { margin-top: 8px; font-size: var(--fs-s); }
/* The one-field start: the field, the goal and one button; the map and the settings are folded below. */
.quick-start { max-width: 860px; }
.quick-check { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 12px; margin: 18px 0 0; }
.quick-check input[type="search"] { grid-column: 1; padding: 12px 14px; font-size: var(--fs-m); }
.quick-check .primary { grid-column: 2; grid-row: 1; padding: 0 22px; font-size: var(--fs-m); white-space: nowrap; }
.quick-purpose { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px 20px; margin: 0; padding: 0; border: 0; font-size: var(--fs-s); }
.quick-purpose legend { float: left; margin-right: 6px; padding: 0; color: var(--muted); }
.quick-purpose label { display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
.quick-purpose input { width: auto; margin: 0; }
.intro .quick-status { margin: 10px 0 0; color: var(--ink); font-size: var(--fs-s); min-height: 1.5em; }
/* Б2 hero (owner, 2026-10-16): the example report's living map across the page and the one field over it on a dark
   panel, the plot right of the panel; on a narrow screen the panel above the map. */
.home-hero { position: relative; margin: 14px 0 0; }
.home-hero.has-live { min-height: 600px; display: flex; align-items: flex-start; padding: 28px; border-radius: 4px; overflow: hidden; background: var(--map-bg); }
.home-live { position: absolute; inset: 0; }
.home-live-map { position: absolute; inset: 0; background: var(--map-bg); }
.home-live .building-scan { z-index: 500; }
/* The panel is wider than the 470 px it was (owner, 2026-11-01: «всё сжато по ширине» — the макет he liked ran the
   text across the page). The map still reads around it; the offer sentence needs the room. */
.home-hero.has-live .home-panel { position: relative; z-index: 600; width: min(620px, 100%); max-width: none; margin: 0; padding: 30px 34px 26px; border-radius: 3px; background: rgba(11, 15, 18, .92); }
.home-hero h1 { font-size: clamp(1.7rem, 3.2vw, 2.3rem); line-height: 1.15; }
.home-hero.has-live .quick-check { grid-template-columns: 1fr; }
.home-hero.has-live .quick-check .primary { grid-column: 1; grid-row: auto; justify-self: start; padding: 11px 22px; }
.home-hero .quick-check { margin-top: 14px; }
.home-hero .home-draw { width: 100%; margin-top: 8px; }
.home-hero .home-example, .home-hero .home-offer { max-width: 44rem; }
.home-price { margin: 12px 0 0; color: var(--muted); font-size: var(--fs-s); }
.home-live-card { position: absolute; z-index: 600; right: 18px; bottom: 30px; display: grid; gap: 2px; width: min(320px, calc(100% - 36px)); margin: 0; padding: 12px 16px; border-radius: 3px; background: rgba(11, 15, 18, .9); }
.home-live-card small { color: var(--muted); font-size: var(--fs-xs); }
.home-live-card strong { font-size: var(--fs-m); line-height: 1.35; }
.home-live-note { margin: 8px 0 0; color: var(--muted); font-size: var(--fs-s); }
@media (max-width: 899px) {
  .home-hero.has-live { flex-direction: column; min-height: 0; padding: 0; background: none; }
  .home-hero.has-live .home-panel { width: 100%; padding: 0 0 16px; background: none; }
  .home-live { position: relative; order: 2; align-self: stretch; height: 360px; border-radius: 4px; overflow: hidden; }
  /* The model on a phone is a picture, as the map under it: a finger on it scrolls the page. */
  .home-live .live-3d { pointer-events: none; }
  .home-live-card { position: static; order: 3; width: auto; margin-top: 8px; background: var(--surface); }
}
@media print { .home-live, .home-live-card { display: none; } }
/* A restrained «satellite console» (owner, 2026-10-16: «будто смотришь на скайнет»): viewfinder corners and a mono
   read-out of the plot's place on the living maps — no glow, no noise. */
.hud-corners { position: absolute; inset: 14px; z-index: 595; pointer-events: none;
  background: linear-gradient(var(--accent), var(--accent)) left top / 22px 2px no-repeat,
              linear-gradient(var(--accent), var(--accent)) left top / 2px 22px no-repeat,
              linear-gradient(var(--accent), var(--accent)) right top / 22px 2px no-repeat,
              linear-gradient(var(--accent), var(--accent)) right top / 2px 22px no-repeat,
              linear-gradient(var(--accent), var(--accent)) left bottom / 22px 2px no-repeat,
              linear-gradient(var(--accent), var(--accent)) left bottom / 2px 22px no-repeat,
              linear-gradient(var(--accent), var(--accent)) right bottom / 22px 2px no-repeat,
              linear-gradient(var(--accent), var(--accent)) right bottom / 2px 22px no-repeat; opacity: .75; }
.hud-readout { position: absolute; z-index: 600; top: 22px; right: 26px; margin: 0; color: var(--ink); font: var(--fs-xs)/1.5 var(--font-mono); text-align: right; text-shadow: 0 0 6px #000, 0 0 2px #000; pointer-events: none; }
@media (max-width: 899px) { .hud-readout { top: 12px; right: 14px; } }
@media print { .hud-corners, .hud-readout { display: none; } }
/* The express check's living map: taller while the check runs, then above the result. */
.live-hero { position: relative; height: 380px; margin: 0 0 16px; border-radius: 4px; overflow: hidden; background: var(--map-bg); }
.live-hero.is-waiting { height: min(62vh, 560px); }
.live-hero-map { position: absolute; inset: 0; background: var(--map-bg); }
.live-hero .home-live-card { z-index: 610; }
.rr-express-facts > summary { margin-top: 8px; color: var(--accent); font-size: var(--fs-s); font-weight: 600; }
.rr-express-facts > summary::after { content: " ▸"; color: var(--muted); }
.rr-express-facts[open] > summary::after { content: " ▾"; }
@media (max-width: 899px) { .live-hero .home-live-card { position: absolute; right: 12px; bottom: 12px; width: min(300px, calc(100% - 24px)); } }
@media print { .live-hero { display: none; } }
.draw-panel { margin: 4px 0 0; }
/* Drawing the plot oneself, offered plainly: a dashed contour with its corners, the same as the drawing on the map. */
.draw-icon { flex: none; width: 32px; height: 24px; color: var(--accent); fill: var(--accent); }
.home-draw { display: inline-flex; align-items: center; gap: 10px; margin: 6px 0 0; padding: 9px 14px; border: 1px dashed var(--accent); border-radius: 4px; background: transparent; color: var(--ink); font-weight: 400; text-align: left; }
.home-draw strong { color: var(--accent); }
.home-draw:hover { background: var(--soft); }
/* The third way in (owner, 2026-10-31): one line under the contour button, a link like the one in the sentence —
   quieter than both the field and the button, so it adds an entrance without competing for the eye. */
.home-example { margin: 10px 0 0; color: var(--muted); font-size: var(--fs-s); line-height: 1.5; }
.home-example a { color: var(--ink); }
.draw-panel > summary.draw-summary { display: flex; align-items: center; gap: 14px; margin: 18px 0 14px; padding: 14px 18px; border: 1px dashed var(--line-strong); border-radius: 4px; color: var(--ink); cursor: pointer; list-style: none; }
.draw-panel > summary.draw-summary::-webkit-details-marker { display: none; }
.draw-summary span { display: grid; gap: 2px; }
.draw-summary strong { font-size: var(--fs-m); }
.draw-summary small { color: var(--muted); font-size: var(--fs-s); font-weight: 400; }
.draw-summary:hover { border-color: var(--accent); }
.draw-panel[open] > summary.draw-summary { border-color: var(--accent); }
.specialist .goal-option:first-of-type { margin-top: 6px; }
@media (max-width: 620px) {
  .quick-check { grid-template-columns: 1fr; }
  .quick-check .primary { grid-column: 1; grid-row: auto; padding: 11px 14px; }
}
.workspace { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; }
.map-panel { display: flex; flex-direction: column; min-height: min(700px, calc(100dvh - 150px)); background: transparent; }
.map-search { display: flex; gap: 8px; align-items: stretch; padding: 0 0 10px; }
.map-search input[type=search] { flex: 1 1 260px; min-width: 0; }
.map-search .tool { flex: none; padding: 0 18px; }
.file-action { display: inline-flex; align-items: center; cursor: pointer; }
.map-search-results { list-style: none; margin: 0 0 10px; padding: 0; max-height: 200px; overflow: auto; }
.map-search-results button { display: block; width: 100%; text-align: left; border: 0; border-radius: 0; background: transparent; padding: 6px 0; font-weight: 400; }
.map-search-results button:hover { background: var(--soft); }
.map-search-status { margin: 0; padding: 0 12px; color: var(--muted); font-size: var(--fs-s); }
.map-search-status:not(:empty) { padding: 0 0 10px; }
#map { flex: 1; min-height: 480px; background: var(--map-bg); }
/* The contour's tools: one kind of button, quiet, the same height; the file is the last of them. */
.map-tools { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 8px; }
.tool { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: 4px; background: transparent; color: var(--ink); font-size: var(--fs-s); font-weight: 400; line-height: 1.2; }
.tool:hover { border-color: var(--ink); }
.tool[aria-expanded="true"] { border-color: var(--accent); color: var(--accent); }
.map-tools .file-action { margin-left: auto; }
.point-form { display: flex; flex-wrap: wrap; align-items: end; gap: 6px 8px; padding: 0 0 8px; }
.point-form label { display: grid; gap: 3px; width: 13ch; color: var(--muted); font-size: var(--fs-xs); }
.point-form input { height: 34px; padding: 4px 8px; font: var(--fs-s)/1.2 var(--font-mono); }
.point-form-note { flex: 1 1 180px; margin: 0; align-self: center; color: var(--muted); font-size: var(--fs-xs); }
.point-form-note.is-error { color: var(--error); }
.map-imagery-notice, .map-hint { margin: 0; padding: 8px 0 0; color: var(--muted); font-size: var(--fs-xs); }
/* A corner of the contour: a small handle to drag, its coordinates in a small tooltip, the right button removes it. */
.contour-vertex { border: 2px solid #ffffff; border-radius: 50%; background: #167a54; box-shadow: 0 0 0 1px rgba(13, 90, 61, .7); cursor: grab; }
.contour-vertex:active { cursor: grabbing; }
.leaflet-tooltip.vertex-tooltip { width: auto; padding: 2px 6px; font: var(--fs-xs)/1.3 var(--font-mono); white-space: nowrap; }

.panel { display: flex; flex-direction: column; gap: 16px; padding: 0; background: transparent; }
.report-config { position: sticky; top: 12px; max-height: calc(100dvh - 24px); overflow-y: auto; }
.report-goal { display: grid; gap: 0; margin: 0; padding: 0; border: 0; }
.report-goal legend { margin-bottom: 4px; padding: 0; font-size: var(--fs-s); font-weight: 600; }
.goal-option { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; padding: 7px 0; font-weight: 400; cursor: pointer; }
.goal-option input { margin-top: 3px; }
.goal-option span { display: grid; gap: 2px; }
.goal-option strong { font-size: var(--fs-s); font-weight: 700; }
.goal-option small { color: var(--muted); font-size: var(--fs-xs); line-height: 1.4; }
.form-section { margin: 0; }
/* A folded part of the form: its name, what is chosen on the next line, a plus to open it. */
.form-section > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 12px; padding: 2px 0; list-style: none; cursor: pointer; color: var(--ink); font-size: var(--fs-s); font-weight: 700; }
.form-section > summary::-webkit-details-marker { display: none; }
.form-section > summary small { grid-column: 1; grid-row: 2; color: var(--muted); font-size: var(--fs-xs); font-weight: 400; }
.form-section > summary::after { content: "+"; grid-column: 2; grid-row: 1; color: var(--muted); font-weight: 400; }
.form-section[open] > summary::after { content: "−"; }
.date-controls { display: grid; gap: 10px; padding: 0 0 12px; }
.date-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.date-preset { border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); border-radius: 4px; padding: 4px 8px; font-size: var(--fs-xs); font-weight: 500; }
.date-preset:hover { border-color: var(--ink); }
.date-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.season-reference { grid-column: 1 / -1; }
.date-status { margin: 0; font-size: var(--fs-xs); color: var(--muted); }
.date-status.is-error { color: var(--error); }
.paid-options-list { display: grid; gap: 0; padding-bottom: 10px; }
.paid-option-meta b { font-weight: 600; color: var(--ink); }
.selection-line { display: flex; gap: 18px; margin: 0; color: var(--muted); font-size: var(--fs-s); }
.selection-line b { color: var(--ink); font: var(--fs-s)/1.5 var(--font-mono); }
/* The two ways on: the report and the free check, buttons of one size; a plain line under each. */
.report-submit, .express-line { display: grid; gap: 6px; }
.report-submit button, .express-line button { width: 100%; min-height: 44px; padding: 0 14px; font-size: var(--fs-m); font-weight: 700; }
.report-submit p, .express-line p { margin: 0; color: var(--muted); font-size: var(--fs-s); }
.form-legal { margin: 4px 0 0; color: var(--muted); font-size: var(--fs-xs); line-height: 1.45; }
.form-legal a { color: inherit; }

.saved-reports-clear, .report-cache-action { border: 0; background: transparent; color: var(--muted); padding: 4px 6px; font-size: var(--fs-xs); font-weight: 500; }
.saved-reports-clear:hover, .report-cache-action:hover { color: var(--ink); text-decoration: underline; }
.my-reports-list { list-style: none; margin: 0; padding: 0; display: grid; max-block-size: min(320px, 42vh); overflow-y: auto; }
.my-reports-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 5px 0; font-size: var(--fs-s); }
.report-cache-main { display: grid; gap: 1px; min-width: 0; }
.my-reports-list a, .report-cache-title { overflow: hidden; color: var(--ink); font-weight: 600; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.my-reports-list a:hover { text-decoration: underline; }
.my-reports-list small { color: var(--faint); font-size: var(--fs-xs); }
.report-cache-actions { display: flex; align-items: center; gap: 2px; }
.report-cache-compare { display: inline-flex; align-items: center; gap: 4px; padding: 4px 6px; color: var(--muted); font-size: var(--fs-xs); cursor: pointer; }
.my-reports-compare { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin: 10px 0 0; color: var(--muted); font-size: var(--fs-xs); }
.my-reports-compare[hidden] { display: none; }
.my-reports-compare a[aria-disabled="true"] { opacity: .45; pointer-events: none; }
.report-cache-retry { display: inline-grid; place-items: center; width: 30px; height: 30px; padding: 5px; }
.report-cache-retry svg { width: 18px; height: 18px; }

@media (max-width: 980px) {
  .workspace { grid-template-columns: 1fr; }
  .report-config { position: static; max-height: none; overflow: visible; }
  .map-panel { min-height: 560px; }
}
@media (max-width: 620px) {
  .page { padding: 0 16px; }
  .topbar, .site-footer { margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; }
  .masthead-note { display: none; }
  .my-reports-panel { left: 0; right: 0; width: auto; padding-inline: 12px; }
  .intro { margin: 20px 0 16px; }
  .map-panel { min-height: 480px; }
  #map { min-height: 340px; }
  .map-tools .file-action { margin-left: 0; }
  .my-reports-list li { gap: 5px; }
  .report-cache-actions { flex-direction: column; align-items: flex-end; }
}

/* Letters about the plot (both report versions). */
.email-forms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin: 48px 0 0; }
.email-report { display: grid; gap: 7px; align-content: start; }
.email-report-title { font-size: var(--fs-m); font-weight: 600; }
.email-report .form-note { margin: 0; color: var(--muted); font-size: var(--fs-xs); line-height: 1.45; }
.email-report-row { display: flex; flex-wrap: wrap; gap: 8px; }
.email-report-row input { flex: 1 1 200px; }
.consent-check { display: flex; gap: 8px; align-items: flex-start; font-size: var(--fs-xs); font-weight: 400; color: var(--muted); line-height: 1.4; }
.consent-check input { margin-top: 2px; }
@media (max-width: 760px) { .email-forms { grid-template-columns: 1fr; } }
@media print { .email-forms { display: none; } }

/* Legal documents. */
.doc-page { max-width: 820px; }
.legal-doc { max-width: 720px; padding-top: 30px; }
.legal-doc h1 { font-size: var(--fs-xl); }
.legal-doc h2 { margin: 28px 0 8px; font-size: var(--fs-m); }
.legal-doc p, .legal-doc li { line-height: 1.6; }
.legal-doc p { margin: 0 0 9px; }
.legal-doc ul { margin: 0 0 10px; padding-left: 20px; }
.legal-edition { color: var(--muted); font-size: var(--fs-s); }
.legal-table { font-size: var(--fs-xs); }
.legal-table td, .legal-table th { white-space: normal; }
.legal-details { display: grid; grid-template-columns: minmax(10em, 15em) 1fr; gap: 6px 16px; margin: 0; }
.legal-details dt { color: var(--muted); }
.legal-details dd { margin: 0; }
@media (max-width: 620px) { .legal-details { grid-template-columns: 1fr; gap: 0; } .legal-details dd { margin-bottom: 8px; } }

/* The start page below the workspace: a real report's first answers, what the report checks, questions. */
.about { max-width: 820px; margin: 72px 0 0; }
.about h2 { margin: 36px 0 10px; font-size: var(--fs-xl); }
.about h2:first-child { margin-top: 0; }
.about-example-lead { margin: 0 0 12px; color: var(--muted); }
.about-example { margin: 0; }
.about-example div { display: grid; grid-template-columns: minmax(12em, 18em) minmax(0, 1fr); gap: 2px 18px; padding: 5px 0; }
.about-example dt { font-weight: 700; }
.about-example dd { margin: 0; }
.about-answer-attention { color: var(--warn); }
.about-answer-unknown { color: var(--muted); }
.about-example-link { margin: 12px 0 0; }
.about-text { margin: 0 0 10px; line-height: 1.6; }
.about-faq details { padding: 6px 0; }
.about-faq summary { cursor: pointer; font-weight: 600; }
.about-faq p { margin: 6px 0 2px; color: var(--muted); font-size: var(--fs-s); max-width: 720px; }
@media (max-width: 620px) { .about { margin-top: 32px; } .about-example div { grid-template-columns: 1fr; } }
.about-guides { margin: 18px 0 0; color: var(--muted); font-size: var(--fs-s); }
.guide-crumbs { margin-bottom: 14px; color: var(--faint); font-size: var(--fs-xs); }
.guide-crumbs a { color: var(--muted); }
.guide h2 { font-size: var(--fs-l); }
.guide .legal-table { margin: 4px 0 8px; font-size: var(--fs-s); }
.guide .guide-list { list-style: none; padding: 0; margin: 18px 0 0; }
.guide-list li { padding: 0 0 18px; }
.guide-list li a { font-weight: 600; }
.guide-list p { margin: 4px 0 0; color: var(--muted); font-size: var(--fs-s); }
.guide-cta { margin: 40px 0 0; padding: 0; }
.guide-cta-link { display: inline-block; border-radius: 4px; padding: 8px 14px; font-size: var(--fs-s); font-weight: 600; text-decoration: none; }
.guide-more ul { padding-left: 20px; }
.error-page { max-width: 720px; margin: 48px 0; }
.error-page p { color: var(--muted); }

/* Shared report pieces: map, tables, notes. */
.report-page { max-width: 920px; margin: 0 auto; padding: 0 0 40px; }
.report-header { padding: 28px 0 10px; }
.eyebrow { margin: 0 0 6px; color: var(--muted); font-size: var(--fs-xs); font-weight: 500; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: var(--fs-s); }
th, td { padding: 7px 10px 7px 0; text-align: left; vertical-align: top; }
thead th { border-bottom: 1px solid var(--line-strong); }
th { color: var(--muted); font-size: var(--fs-xs); font-weight: 600; white-space: nowrap; }
.scene-id { color: var(--muted); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: var(--fs-xs); }
details { margin-top: 12px; color: var(--muted); font-size: var(--fs-s); line-height: 1.5; }
summary { cursor: pointer; color: var(--accent); font-weight: 600; }
details p { margin: 8px 0 0; }

.report-map-section { margin: 26px 0; }
#report-map { height: 500px; margin-top: 12px; border-radius: 4px; overflow: hidden; background: var(--map-bg); }
.report-map-timeline { display: grid; gap: 8px; margin: 8px 0 10px; }
.report-map-views { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--line-strong); border-radius: 4px; width: fit-content; max-width: 100%; overflow: hidden; }
.report-map-view { border: 0; border-right: 1px solid var(--line-strong); border-radius: 0; background: var(--surface); color: var(--ink); padding: 5px 12px; font-size: var(--fs-xs); font-weight: 500; cursor: pointer; }
.report-map-view:last-child { border-right: 0; }
.report-map-view[aria-pressed="true"] { background: var(--ink); color: var(--surface); }
/* The caption column keeps a fixed width: a changing date must not resize the slider under the cursor. */
.report-map-slider-row { display: grid; grid-template-columns: auto minmax(0, 1fr) 13ch; gap: 14px; align-items: start; }
.report-map-play { width: 40px; height: 40px; padding: 0; border: 1px solid var(--accent); border-radius: 50%; background: transparent; color: var(--accent); font-size: var(--fs-s); line-height: 1; }
.report-map-play:hover { background: var(--accent); color: var(--on-accent); }
.report-map-axis { position: relative; padding-bottom: 22px; }
.report-map-axis input[type="range"] { width: 100%; margin: 12px 0 0; padding: 0; border: 0; accent-color: var(--accent); }
.report-map-ticks { position: absolute; left: 8px; right: 8px; top: 30px; height: 20px; }
.report-map-tick { position: absolute; top: 0; width: 1px; height: 6px; background: var(--faint); }
/* The stop without a picture of a date, at the end of the axis (2026-10-17). */
.report-map-tick.is-bare { top: -1px; width: 7px; height: 7px; border: 1px solid var(--faint); border-radius: 50%; background: none; transform: translateX(-50%); }
.report-map-tick-label { position: absolute; top: 8px; transform: translateX(-50%); color: var(--muted); font: var(--fs-xs)/1 var(--font-mono); white-space: nowrap; }
.report-map-slider-row output { display: grid; padding-top: 6px; font: var(--fs-l)/1.2 var(--font-mono); font-variant-numeric: tabular-nums; color: var(--ink); }
.report-map-slider-row output small { color: var(--muted); font: var(--fs-xs)/1.3 var(--font-ui); }
@media (max-width: 760px) { .report-map-slider-row { grid-template-columns: auto minmax(0, 1fr); } .report-map-slider-row output { grid-column: 1 / -1; } }
@media print { .report-map-timeline { display: none; } }
/* Hover labels of the map's outlines and points (power centres, zones, parcels) can be long: Leaflet keeps them on one
   line, and they ran off the screen (2026-10-15). They wrap at a readable width instead. */
.leaflet-tooltip { white-space: normal; width: max-content; max-width: min(320px, 70vw); font-family: var(--font-ui); font-size: var(--fs-xs); line-height: 1.35; }
/* The shadows of the day under the map: the day, then «▶» and the hour slider (2026-10-15). */
/* The shadows on the map itself (owner, 2026-10-16): one bar at the bottom, a single track through the hours of each
   season, the sun for a handle; a small button offers it while the layer is off. Light like the map under it. */
.report-map-sun-offer { padding: 3px 8px; border: 1px solid var(--map-line); border-radius: 4px; background: rgba(255, 253, 248, .94); color: #1c201e; font: var(--fs-xs)/1.2 var(--font-ui); white-space: nowrap; cursor: pointer; }
.report-map-sun-offer:hover { border-color: #1c201e; }
.report-map-sun-bar { position: absolute; z-index: 800; left: 10px; right: 10px; bottom: 34px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 10px 12px 8px; border: 1px solid var(--map-line); border-radius: 6px; background: rgba(255, 253, 248, .96); color: var(--map-ink); box-shadow: 0 4px 18px rgba(0, 0, 0, .22); font-family: var(--font-ui); }
.report-map-sun-bar[hidden], .report-map-sun-offer[hidden] { display: none; }
.report-map-sun-bar .report-map-play { width: 36px; height: 36px; border-color: #b7791f; color: #8a5a00; }
.report-map-sun-bar .report-map-play:hover { background: #f0b54a; color: #17120a; }
.report-map-sun-axis { position: relative; padding-bottom: 22px; }
/* The track: night blue at the ends of a day, the sun's yellow in the middle of it; the handle is the sun. */
.report-map-sun-axis input[type="range"] { width: 100%; height: 22px; margin: 0; padding: 0; border: 0; background: transparent; appearance: none; cursor: pointer; }
.report-map-sun-axis input[type="range"]::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: var(--sun-track, linear-gradient(90deg, #8aa0bf, #f3cf6b 25%, #f3cf6b 75%, #8aa0bf)); }
.report-map-sun-axis input[type="range"]::-moz-range-track { height: 6px; border-radius: 3px; background: var(--sun-track, linear-gradient(90deg, #8aa0bf, #f3cf6b 25%, #f3cf6b 75%, #8aa0bf)); }
.report-map-sun-axis input[type="range"]::-webkit-slider-thumb { appearance: none; width: 22px; height: 22px; margin-top: -8px; border: 2px solid #ffffff; border-radius: 50%; background: radial-gradient(circle, #ffd84a 45%, #f0a020 100%); box-shadow: 0 0 0 4px rgba(240, 160, 32, .28), 0 1px 4px rgba(0, 0, 0, .35); }
.report-map-sun-axis input[type="range"]::-moz-range-thumb { width: 18px; height: 18px; border: 2px solid #ffffff; border-radius: 50%; background: radial-gradient(circle, #ffd84a 45%, #f0a020 100%); box-shadow: 0 0 0 4px rgba(240, 160, 32, .28), 0 1px 4px rgba(0, 0, 0, .35); }
.report-map-sun-seasons { position: absolute; left: 9px; right: 9px; bottom: 0; height: 20px; }
.report-map-sun-season { position: absolute; top: 2px; padding: 0 4px; border: 0; background: none; color: var(--map-muted); font: var(--fs-xs)/1.2 var(--font-ui); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.report-map-sun-season.is-current { color: var(--map-ink); font-weight: 700; }
.report-map-sun-divider { position: absolute; top: -14px; width: 2px; height: 30px; margin-left: -1px; background: var(--map-ink); opacity: .5; }
/* A fixed width: a longer season's name must not move the track (owner, 2026-10-16: «ползунок дёргается»). */
.report-map-sun-readout { display: grid; width: 17ch; font: var(--fs-l)/1.1 var(--font-mono); color: var(--map-ink); }
.report-map-sun-readout small { color: var(--map-muted); font: var(--fs-xs)/1.3 var(--font-ui); }
.report-map-sun-close { align-self: start; width: 26px; height: 26px; padding: 0; border: 0; background: none; color: var(--map-muted); font-size: var(--fs-l); line-height: 1; cursor: pointer; }
.report-map-sun-close:hover { color: var(--map-ink); }
/* The wind caption keeps its corner under the bar. */
.leaflet-container.has-sun-bar .leaflet-bottom.leaflet-left { visibility: hidden; }
@media (max-width: 620px) { .report-map-sun-bar { grid-template-columns: auto minmax(0, 1fr) auto; } .report-map-sun-readout { grid-column: 2; grid-row: 2; } .report-map-sun-close { grid-column: 3; grid-row: 1; } }
@media print { .report-map-sun-bar, .report-map-sun-offer { display: none; } }
.report-map-legend { min-height: 1.3em; margin: 8px 0 0; color: var(--muted); font-size: var(--fs-xs); line-height: 1.45; }
.report-map-legend-items { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; }
.report-map-legend-model { display: block; margin-top: 6px; }
.report-map-legend-item { display: inline-flex; align-items: center; gap: 6px; }
.report-map-legend-swatch { display: inline-block; flex: none; width: .95em; height: .95em; border-radius: 2px; border: 1px solid rgba(0, 0, 0, .15); }
/* Swatches of classes drawn with a sign (map_looks): the sign over the colour, as on the map. */
.report-map-legend-swatch.is-furrows { background-image: repeating-linear-gradient(45deg, rgba(0, 0, 0, .34) 0 1.5px, transparent 1.5px 4px); }
.report-map-legend-swatch.is-swaths { background-image: repeating-linear-gradient(45deg, rgba(0, 0, 0, .16) 0 3px, rgba(255, 255, 255, .16) 3px 6px); }
.report-map-legend-swatch.is-marsh { background-image: repeating-linear-gradient(0deg, transparent 0 2px, rgba(0, 0, 0, .45) 2px 3.5px, transparent 3.5px 5px); }
.report-map-legend-swatch.is-char { background-image: radial-gradient(rgba(0, 0, 0, .5) 0.8px, transparent 1.1px); background-size: 3px 3px; }
.report-map-legend-swatch.is-stumps { background-image: radial-gradient(circle, rgba(0, 0, 0, .6) 1px, transparent 1.5px); background-size: 5px 5px; }
.report-map-legend-swatch.is-bog { background-image: repeating-linear-gradient(0deg, transparent 0 2px, rgba(0, 0, 0, .45) 2px 3.5px, transparent 3.5px 5px); }
.report-map-legend-swatch.is-meadow { background-image: repeating-linear-gradient(90deg, rgba(0, 0, 0, .4) 0 1px, transparent 1px 3px); background-size: 100% 60%; background-position: center; background-repeat: no-repeat; }
.report-map-legend-swatch.is-woods { background-image: radial-gradient(circle, transparent 1.2px, rgba(0, 0, 0, .55) 1.3px 2px, transparent 2.1px); background-size: 6px 6px; }
.report-map-legend-swatch.is-sand { background-image: radial-gradient(rgba(0, 0, 0, .5) .7px, transparent 1px); background-size: 4px 4px; }
.report-map-legend-swatch.is-hatch { background-image: repeating-linear-gradient(-45deg, rgba(0, 0, 0, .45) 0 1.2px, transparent 1.2px 4px); }
/* The controls on a map read on light paper (the report's and the drawing map), whatever the page around: a light
   sheet, ink text, the contour's green for what is on. */
.report-map-section .leaflet-container, #map.leaflet-container { --map-ui: #fffdf8; --map-ink: #1c201e; --map-muted: #4b524e; --map-line: rgba(28, 32, 30, .24); --map-on: #0d5a3d; font-family: var(--font-ui); }
.report-map-section .leaflet-bar, #map .leaflet-bar { border: 1px solid var(--map-line); border-radius: 4px; box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
.report-map-section .leaflet-bar a, #map .leaflet-bar a { background: var(--map-ui); color: var(--map-ink); border-color: var(--map-line); }
.report-map-section .leaflet-bar a:hover, #map .leaflet-bar a:hover { background: #f1eee5; color: var(--map-ink); }
.report-map-section .leaflet-control-layers { position: relative; border: 1px solid var(--map-line); border-radius: 4px; background: var(--map-ui); color: var(--map-ink); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); font-size: var(--fs-s); }
/* Folded, the list is a button that says what it is. */
.report-map-section .leaflet-control-layers-toggle { display: flex; align-items: center; width: auto; height: 36px; padding: 0 12px 0 36px; background-position: 10px center; background-size: 18px 18px; color: var(--map-ink); font-weight: 700; text-decoration: none; }
.report-map-section .leaflet-control-layers-toggle::after { content: "Слои карты"; }
.report-map-section .leaflet-control-layers-expanded { width: min(330px, calc(100vw - 72px)); padding: 6px 0; box-shadow: 0 8px 28px rgba(0, 0, 0, .28); }
.report-map-section .leaflet-control-layers-scrollbar { overflow-y: auto; padding-right: 0; }
.report-map-layers-group { padding: 10px 14px 4px; color: var(--map-muted); font-size: var(--fs-xs); }
.report-map-layers-group:first-child { padding-top: 4px; }
.report-map-section .leaflet-control-layers-overlays label { display: block; margin: 0; padding: 5px 14px; cursor: pointer; }
.report-map-section .leaflet-control-layers-overlays label:hover { background: rgba(13, 90, 61, .07); }
.report-map-section .leaflet-control-layers-overlays label > span { display: flex; gap: 9px; align-items: flex-start; font-weight: 400; line-height: 1.35; }
/* A box of the map's own green, ticked in white. */
.report-map-section .leaflet-control-layers input[type="checkbox"] { appearance: none; flex: none; width: 16px; height: 16px; margin: 2px 0 0; padding: 0; border: 1.5px solid var(--map-muted); border-radius: 3px; background: #ffffff; cursor: pointer; }
.report-map-section .leaflet-control-layers input[type="checkbox"]:checked { border-color: var(--map-on); background: var(--map-on) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5 L6.5 11.5 L12.5 4.5' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") center / 14px no-repeat; }
.report-map-section .leaflet-control-layers input[type="checkbox"]:focus-visible { outline: 2px solid var(--map-on); outline-offset: 1px; }
.report-map-section .leaflet-control-layers-separator { display: none; }
.report-map-key-layers { display: block; width: calc(100% - 28px); margin: 8px 14px 5px; padding: 7px 0 2px; border: 0; border-top: 1px solid var(--map-line); border-radius: 0; background: transparent; color: var(--map-on); text-align: left; font: inherit; cursor: pointer; }
.report-map-key-layers:hover { color: var(--map-ink); }
.report-map-key-layers[hidden] { display: none; }
/* The drawing map's «Схема / Снимок»: two halves of one switch. */
#map .leaflet-control-layers { border: 1px solid var(--map-line); border-radius: 4px; background: var(--map-ui); color: var(--map-ink); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
#map .leaflet-control-layers-expanded { padding: 0; }
#map .leaflet-control-layers-base { display: flex; }
#map .leaflet-control-layers-base label { margin: 0; cursor: pointer; }
#map .leaflet-control-layers-base label > span, #map .leaflet-control-layers-base label > div { display: block; padding: 6px 12px; font-size: var(--fs-s); font-weight: 400; }
#map .leaflet-control-layers-base input { position: absolute; opacity: 0; pointer-events: none; }
#map .leaflet-control-layers-base label:has(input:checked) { background: var(--map-ink); color: #ffffff; }
#map .leaflet-control-layers-separator, #map .leaflet-control-layers-overlays:empty { display: none; }
/* The report map's «Схема | Снимок | Гибрид»: the same switch of halves, under the layers' button; not in 3D, not printed. */
.report-map-section .zemsat-base-switch { border: 1px solid var(--map-line); border-radius: 4px; background: var(--map-ui); color: var(--map-ink); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
.report-map-section .zemsat-base-switch.leaflet-control-layers-expanded { width: auto; padding: 0; box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
.report-map-section .zemsat-base-switch .leaflet-control-layers-toggle { display: none; }
.report-map-section .zemsat-base-switch .leaflet-control-layers-base { display: flex; }
.report-map-section .zemsat-base-switch .leaflet-control-layers-base label { margin: 0; cursor: pointer; }
.report-map-section .zemsat-base-switch .leaflet-control-layers-base label > span, .report-map-section .zemsat-base-switch .leaflet-control-layers-base label > div { display: block; padding: 5px 10px; font-size: var(--fs-xs); font-weight: 400; }
.report-map-section .zemsat-base-switch .leaflet-control-layers-base input { position: absolute; opacity: 0; pointer-events: none; }
.report-map-section .zemsat-base-switch .leaflet-control-layers-base label:has(input:checked) { background: var(--map-ink); color: #ffffff; }
.report-map-section .zemsat-base-switch .leaflet-control-layers-separator, .report-map-section .zemsat-base-switch .leaflet-control-layers-overlays:empty { display: none; }
.leaflet-container.is-3d .zemsat-base-switch { display: none; }
@media print { .zemsat-base-switch { display: none !important; } }
.report-map-layers-hint { position: absolute; top: 50%; right: calc(100% + 12px); transform: translateY(-50%); width: max-content; max-width: min(240px, 60vw); padding: 6px 10px; border-radius: 4px; background: var(--accent); color: var(--on-accent); font-family: var(--font-ui); font-weight: 700; font-size: var(--fs-xs); line-height: 1.35; box-shadow: 0 2px 8px rgba(0, 0, 0, .18); pointer-events: none; animation: layers-hint-nudge 2.4s ease-in-out infinite; }
.report-map-layers-hint::after { content: ""; position: absolute; top: 50%; right: -6px; transform: translateY(-50%); border: 6px solid transparent; border-right: 0; border-left-color: var(--accent); }
@keyframes layers-hint-nudge { 0%, 70%, 100% { margin-right: 0; } 80% { margin-right: 5px; } 90% { margin-right: 0; } }
@media (prefers-reduced-motion: reduce) { .report-map-layers-hint { animation: none; } }
.report-map-section .leaflet-control-layers-expanded .report-map-layers-hint { display: none; }
/* The map's «3D» mode: a two-part switch above the zoom, the model over the map, the zoom hidden while it shows. */
.report-map-mode { display: flex; border: 1px solid var(--map-line); border-radius: 4px; background: var(--map-ui); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); overflow: hidden; }
.report-map-mode button { padding: 6px 12px; border: 0; border-radius: 0; background: transparent; color: var(--map-ink); font: var(--fs-s)/1.2 var(--font-ui); cursor: pointer; }
.report-map-mode button[aria-pressed="true"] { background: var(--map-ink); color: #ffffff; font-weight: 700; }
.report-map-mode button:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.report-map-3d { position: absolute; inset: 0; z-index: 690; background: #0e1418; }
.report-map-3d[hidden] { display: none; }
.scene3d-canvas { display: block; width: 100%; height: 100%; touch-action: none; }
.scene3d-attribution { position: absolute; right: 8px; bottom: 22px; color: rgba(230, 233, 231, .72); font: 11px/1.3 var(--font-ui); pointer-events: none; }
.report-map-3d-note { position: absolute; left: 10px; top: 128px; max-width: min(420px, 60%); margin: 0; color: rgba(230, 233, 231, .82); font: var(--fs-xs)/1.35 var(--font-ui); pointer-events: none; }
.leaflet-container.is-3d .leaflet-control-zoom { display: none; }
/* «Рельеф ×3» under the switch, only while the model shows. */
.report-map-relief { padding: 5px 10px; border: 1px solid var(--map-line); border-radius: 4px; background: var(--map-ui); color: var(--map-ink); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); font: var(--fs-xs)/1.2 var(--font-ui); cursor: pointer; }
.report-map-relief[aria-pressed="true"] { background: var(--map-ink); color: #ffffff; font-weight: 700; }
.report-map-relief:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.leaflet-container:not(.is-3d) .report-map-relief { display: none; }
/* «Объекты» under the relief's button: a folded list of things to put on the plot, only while the model shows. */
.report-map-objects { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.report-map-objects button { padding: 5px 10px; border: 1px solid var(--map-line); border-radius: 4px; background: var(--map-ui); color: var(--map-ink); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); font: var(--fs-xs)/1.2 var(--font-ui); cursor: pointer; text-align: left; }
.report-map-objects button[aria-expanded="true"], .report-map-objects button[aria-pressed="true"] { background: var(--map-ink); color: #ffffff; font-weight: 700; }
.report-map-objects button:disabled { opacity: .55; cursor: default; }
.report-map-objects button:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.report-map-objects-list { display: grid; grid-template-columns: repeat(2, auto); gap: 3px; padding: 6px; border-radius: 4px; background: rgba(14, 20, 24, .72); }
.report-map-objects-list[hidden] { display: none; }
.report-map-objects-list p { grid-column: 1 / -1; max-width: 220px; margin: 2px 0 0; color: rgba(230, 233, 231, .86); font: var(--fs-xs)/1.3 var(--font-ui); }
.leaflet-container:not(.is-3d) .report-map-objects { display: none; }
/* The model's compass: the north, turning with the view. */
.scene3d-north { position: absolute; right: 12px; top: 58px; width: 32px; height: 32px; pointer-events: none; }
.scene3d-north svg { display: block; }
.scene3d-north span { position: absolute; left: 0; right: 0; top: -15px; color: #f0b54a; font: 700 var(--fs-xs)/1 var(--font-ui); text-align: center; }
/* The preparation screen's model grows over its living map, under the scan line and the captions. The flat map stays
   visible until the model has drawn its ground (owner, 2026-10-19). */
.live-3d { position: absolute; inset: 0; z-index: 450; visibility: hidden; opacity: 0; pointer-events: none; background: transparent; transition: opacity .5s ease; }
.live-3d.is-visible { visibility: visible; opacity: 1; pointer-events: auto; background: #0e1418; }
@media (prefers-reduced-motion: reduce) { .live-3d { transition: none; } }
@media print { .report-map-3d, .report-map-mode, .report-map-relief, .report-map-objects { display: none !important; } }
/* The prevailing-wind mark on the report map: a caption in the corner, not a layer; ink on the light map whatever the
   page's theme (owner, 2026-10-16: it was white on white on the dark screen). */
.report-map-wind { padding: 3px 8px; border-radius: 4px; background: rgba(255, 253, 248, .94); border: 1px solid var(--map-line, rgba(28, 32, 30, .24)); font: var(--fs-xs)/1.2 var(--font-ui); color: #1c201e; white-space: nowrap; }
.report-map-wind-arrow { font-size: 15px; font-weight: 700; }
.report-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 26px; }

/* Technical report (report.html): the same hairline style for its many specialist blocks. */
.report-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 18px 0; }
.report-stats article { padding: 12px 12px 12px 0; }
.report-stats span { color: var(--muted); display: block; font-size: var(--fs-xs); margin-bottom: 4px; }
.report-stats strong { font-size: var(--fs-m); font-weight: 600; }
.report-section { padding: 28px 0 0; margin: 0; }
.decision-summary h2 { font-size: var(--fs-l); line-height: 1.35; }
.analysis-section, .history-section, .change-section { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr); gap: 22px; }
.analysis-section figure, .history-section figure, .change-section figure, .timeline-viewer figure { margin: 0; }
.analysis-section img, .history-section img, .change-section img, .timeline-viewer img { display: block; width: 100%; object-fit: contain; background: var(--soft); border-radius: 3px; }
.analysis-section figcaption, .history-section figcaption, .change-section figcaption, .timeline-viewer figcaption, .method { color: var(--muted); font-size: var(--fs-xs); line-height: 1.5; margin: 8px 0 0; }
.timeline-viewer { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(320px, 1.15fr); gap: 22px; }
.timeline-viewer input[type="range"] { padding: 0; border: 0; accent-color: var(--ink); }
.timeline-viewer output { font-weight: 600; }
.compact-stats { margin-top: 14px; }
.zone-section table { min-width: 760px; }
.history-conclusion, .history-action, .radar-explanation, .cross-evidence, .unavailable, .disclaimer { margin: 10px 0; padding: 2px 0 2px 12px; border-left: 2px solid var(--line-strong); line-height: 1.5; background: none; color: inherit; }
.history-action, .unavailable, .disclaimer, .radar-stronger, .radar-weaker { border-left-color: #c9a86a; }
.radar-explanation p, .cross-evidence p { margin: 6px 0; }
.radar-explanation span, .cross-evidence span { color: var(--muted); font-size: var(--fs-xs); }
.geojson { overflow: auto; max-height: 250px; background: var(--soft); padding: 12px; border-radius: 3px; font-size: var(--fs-xs); }
.source-list, .finding-list, .answer-grid, .sector-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.context-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; }
.source-list article, .finding-list article, .context-card, .answer-card, .sector-card { padding: 0 0 14px; background: none; }
.source-list p, .finding-list p { color: var(--muted); font-size: var(--fs-s); margin: 6px 0; }
.source-list span, .finding-list span { color: var(--muted); font-size: var(--fs-xs); }
.source-list span.ready { color: var(--ok); }
.answer-card h3, .sector-card h3 { margin: 0 0 6px; font-size: var(--fs-m); }
.answer-confidence, .sector-summary-text, .sector-sources { color: var(--muted); font-size: var(--fs-xs); margin: 8px 0 0; }
.sector-card ul { margin: 10px 0; padding-left: 18px; }
.sector-card li { margin: 5px 0; line-height: 1.45; }
.sector-action { margin: 10px 0 0; line-height: 1.45; }
.context-stats, .ndvi-stats, .metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; margin: 10px 0; }
.context-stats div, .ndvi-stats article, .metrics div { padding: 5px 0; }
.context-stats dt, .ndvi-stats span, .metrics dt { display: block; color: var(--muted); font-size: var(--fs-xs); }
.context-stats dd, .metrics dd { margin: 2px 0 0; font-weight: 600; }
.composition-list { list-style: none; padding: 0; margin: 10px 0; }
.composition-list li { display: flex; justify-content: space-between; gap: 8px; padding: 3px 0; font-size: var(--fs-s); }
.source-section h2, .appendix h2 { font-size: var(--fs-m); }
@media (max-width: 760px) {
  .report-stats, .source-list, .analysis-section, .history-section, .change-section, .timeline-viewer, .finding-list, .context-grid, .answer-grid, .sector-grid { grid-template-columns: 1fr; }
  .report-page { padding: 0 0 30px; }
}
@media print {
  @page { size: A4; margin: 12mm; }
  .report-actions, .monitor-status, .technical-details, .timeline-viewer, .report-map-section, .sar-history-section, .radar-observations, .source-section, .appendix { display: none; }
  .report-page { padding: 0; }
  body { background: white; }
  .report-section, .report-stats article, .context-card, .finding-list article, .sector-card { break-inside: avoid; }
  .timeline-viewer input { display: none; }
}

/* Paid orders (order page, order form, prices) */
.button-link { display: inline-block; cursor: pointer; border-radius: 4px; padding: 8px 14px; font-size: var(--fs-s); font-weight: 600; text-decoration: none; line-height: 1.3; margin: 0 8px 8px 0; }
.rr-kicker { margin: 0 0 6px; color: var(--muted); font-size: var(--fs-s); }
.order-items, .price-table { width: 100%; border-collapse: collapse; margin: 0 0 12px; }
.order-items td, .price-table td, .price-table th { padding: 6px 0; text-align: left; font-weight: 400; }
.price-table thead th { border-bottom: 1px solid var(--line-strong); }
.order-items td:last-child, .price-table td:last-child, .price-table th:last-child { text-align: right; white-space: nowrap; }
.order-total td { font-weight: 600; }
.order-terms-body { display: grid; gap: 6px; padding-bottom: 10px; }
.shop-form { display: grid; gap: 8px; max-width: 460px; margin: 0 0 18px; }
.shop-form button { justify-self: start; }
.order-code-field { padding-bottom: 10px; }
.sale-form { margin-top: 12px; }
.sale-form select { width: auto; }

/* The cross-section page (owner, 2026-10-31): a column of depths, one block per layer, no frames or cards — the
   depths are set in the mono face and the layers are separated by the sheet's own hairlines. */
.soil-profile-form { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 22px; max-width: 640px; }
.soil-profile-form input { flex: 1 1 260px; min-width: 0; padding: 9px 12px; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--field); color: var(--ink); font: inherit; }
.soil-profile-form input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.soil-profile { display: flex; flex-direction: column; gap: 0; margin: 14px 0 8px; }
.soil-layer { display: grid; grid-template-columns: minmax(120px, 180px) 1fr; gap: 6px 24px; padding: 14px 0; border-top: 1px solid var(--line); }
.soil-layer:last-child { border-bottom: 1px solid var(--line-strong); }
.soil-layer-depth { display: flex; flex-direction: column; gap: 2px; }
.soil-layer-depth .rr-mono { color: var(--muted); }
.soil-layer-values { display: flex; flex-wrap: wrap; gap: 6px 28px; min-width: 0; }
.soil-value { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.soil-value-name { color: var(--muted); }
.soil-value-range { color: var(--muted); font-size: var(--fs-s); }
.soil-layer-meaning { grid-column: 2; margin: 2px 0 0; color: var(--ink-soft); }
@media (max-width: 620px) { .soil-layer { grid-template-columns: 1fr; } .soil-layer-meaning { grid-column: 1; } }

/* The note about cookies (owner, 2026-10-22: «маленькой в правом нижнем углу»): Metrika is on, the note only tells. */
.cookie-note { position: fixed; z-index: 2000; right: 16px; bottom: 16px; display: flex; align-items: center; gap: 10px; max-width: 300px; padding: 8px 10px 8px 12px; border-radius: 4px; background: var(--surface); box-shadow: 0 4px 16px rgba(0, 0, 0, .25); color: var(--ink); font-size: var(--fs-xs); line-height: 1.4; }
.cookie-note p { margin: 0; }
.cookie-note button { flex: 0 0 auto; padding: 4px 10px; border-radius: 4px; font-size: var(--fs-xs); font-weight: 600; }
@media print { .cookie-note { display: none; } }

/* The offer line of the home page (owner, 2026-11-01: the two numbered blocks filled the panel and read as an
   instruction manual). One sentence: who it is for, what the free check gives, what the paid report adds. */
/* The home panel's two actions in one row (owner, 2026-11-01): the free check and the paid report stand together at the
   foot of the panel, so both are seen at once instead of the paid one hiding under a paragraph. */
.home-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin-top: 2px; }
.home-actions .primary { justify-self: start; }
.home-actions .home-buy { margin: 0; }
/* What each product gives, folded behind «Что входит в отчёт?» (owner, 2026-11-01): two columns of concrete questions,
   the paid report first. */
.home-what { margin: 16px 0 0; font-size: var(--fs-s); }
.home-what > summary { cursor: pointer; color: var(--ink-soft); width: fit-content; }
.home-what > summary:hover { color: var(--ink); }
.home-what > summary::marker { color: var(--muted); }
.home-what-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px 28px; margin: 12px 0 0; }
.home-what-column ul { margin: 6px 0 0; padding-left: 18px; color: var(--ink-soft); line-height: 1.5; }
.home-what-column li { margin: 3px 0; }
.home-what-title { margin: 0; font-weight: 700; color: var(--ink); }
.home-offer { margin: 20px 0 0; color: var(--ink-soft); font-size: var(--fs-s); line-height: 1.55; }
.home-offer strong { color: var(--ink); font-weight: 700; }
.home-buy { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin: 16px 0 0; }
