@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/GolosText-400-cyr.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/GolosText-400-lat.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: 'Golos Text'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/GolosText-500-cyr.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/GolosText-500-lat.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: 'Golos Text'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/GolosText-600-cyr.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/GolosText-600-lat.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: 'Golos Text'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/GolosText-700-cyr.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Golos Text'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/GolosText-700-lat.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/Unbounded-500-cyr.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/Unbounded-500-lat.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/Unbounded-700-cyr.woff2') format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/Unbounded-700-lat.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 {
  /* Светлая тема: подстанция днём. Белые поверхности, яркий синий, янтарь мощности. */
  --ground: #f3f6fb;
  --ground-2: #e9eef7;
  --surface: #ffffff;
  --surface-solid: #ffffff;
  --surface-2: #eef2f8;
  --ink: #0d1626;
  --ink-2: #3b475a;
  --muted: #6a768a;
  --line: #d9e0eb;
  --line-soft: #e9edf4;

  /* Действие — яркий синий. Всё, что нажимают, синее; больше ничего. */
  --acc: #1f66ff;
  --acc-soft: rgb(31 102 255 / 10%);
  --acc-ink: #1650d0;
  --on-acc: #ffffff;

  /* Янтарь — мощность. Только для чисел мощности и знака. */
  --volt: #ffb000;
  --volt-soft: rgb(255 176 0 / 16%);
  --volt-ink: #a35f00;

  /* Служебные тона. На публичной карточке их нет: у сверки нет цвета. */
  --warn: #b86400;
  --warn-soft: rgb(255 150 30 / 14%);
  --bad: #d22f27;
  --bad-soft: rgb(210 47 39 / 9%);
  --ok: #138a45;
  --ok-soft: rgb(19 138 69 / 10%);

  --sans: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --display: "Unbounded", "Golos Text", -apple-system, "Segoe UI", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  --t-xs: 0.8125rem;
  --t-sm: 0.9375rem;
  --t-md: 1.0625rem;
  --t-lg: 1.25rem;
  --t-xl: 1.625rem;
  --t-xxl: 2.5rem;
  --t-huge: clamp(2.4rem, 5.2vw, 4.4rem);
  --lh: 1.5;
  --lh-tight: 1.12;

  --w-reg: 400;
  --w-mid: 600;
  --w-bold: 700;

  --r-sm: 8px;
  --r: 12px;
  --r-lg: 18px;
  --r-pill: 999px;

  --tap: 46px;
  --pad: 16px;
  --wide: 74rem;
  --narrow: 44rem;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; color-scheme: light; }
body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--sans);
  font-size: var(--t-md);
  line-height: var(--lh);
  -webkit-font-smoothing: antialiased;
  display: flex; flex-direction: column; min-height: 100dvh;
}
a { color: inherit; }
h1, h2, h3 { margin: 0; font-weight: var(--w-bold); letter-spacing: -0.02em; line-height: var(--lh-tight); text-wrap: balance; }
h1, h2, .display { font-family: var(--display); font-weight: 700; letter-spacing: -0.01em; line-height: 1.16; }
h1 { font-size: var(--t-xl); }
h2 { font-size: var(--t-lg); }
h3 { font-size: var(--t-md); letter-spacing: -0.012em; }
p { margin: 0; }
img { max-width: 100%; }
[hidden] { display: none !important; }

/* ——— шапка ——— */

.top { background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.top__in {
  max-width: var(--wide); margin: 0 auto; padding: 0 var(--pad);
  display: flex; align-items: center; gap: 18px; min-height: 60px;
}
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; flex: none; }
.brand__mark { width: 34px; height: 34px; display: block; filter: drop-shadow(0 3px 6px rgb(31 95 240 / 30%)); }
.brand__text { font-family: var(--display); font-weight: 700; letter-spacing: 0; font-size: var(--t-sm); white-space: nowrap; text-transform: uppercase; }
.top__nav { display: flex; gap: 2px; flex: 1; overflow-x: auto; scrollbar-width: none; }
.top__nav::-webkit-scrollbar { display: none; }
.top__right { display: flex; gap: 8px; align-items: center; flex: none; }
.tnav {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-radius: var(--r-sm);
  font-size: var(--t-sm); font-weight: var(--w-mid); color: var(--ink-2);
  text-decoration: none; white-space: nowrap;
}
.tnav--on { background: var(--surface-2); color: var(--ink); }
@media (hover: hover) { .tnav:hover { color: var(--ink); } }
.tnav__n {
  background: var(--acc); color: var(--on-acc); font-size: var(--t-xs); font-weight: var(--w-bold);
  min-width: 18px; height: 18px; border-radius: var(--r-pill); padding: 0 5px;
  display: inline-flex; align-items: center; justify-content: center;
}

/* ——— каркас ——— */

.main {
  flex: 1; width: 100%; max-width: var(--narrow); margin: 0 auto;
  padding: 24px var(--pad) 56px;
  display: flex; flex-direction: column; gap: 20px;
}
.main--wide { max-width: var(--wide); }
.back { font-size: var(--t-sm); color: var(--muted); text-decoration: none; align-self: flex-start; }

.foot { border-top: 1px solid var(--line); background: var(--surface); }
.foot__in {
  max-width: var(--wide); margin: 0 auto; padding: 22px var(--pad) calc(22px + env(safe-area-inset-bottom));
  display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  font-size: var(--t-sm); color: var(--muted);
}
.foot__col { display: flex; flex-direction: column; gap: 6px; }
.foot__col b { color: var(--ink); }
.foot a { text-decoration: none; }
@media (hover: hover) { .foot a:hover { color: var(--ink); text-decoration: underline; } }

.head { display: flex; flex-direction: column; gap: 6px; }
.head__sub { color: var(--ink-2); font-size: var(--t-sm); }
.head--row { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* ——— формы ——— */

form { display: contents; }
.form { display: flex; flex-direction: column; gap: 14px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field__label { font-size: var(--t-sm); font-weight: var(--w-mid); color: var(--ink-2); }
.field__hint { font-size: var(--t-sm); color: var(--muted); }
.field__hint--ok { color: var(--ok); font-weight: var(--w-mid); }
.field__error { font-size: var(--t-sm); color: var(--bad); font-weight: var(--w-mid); }
.field--error .input { border-color: var(--bad); }
.input {
  font: inherit; font-size: var(--t-md); color: var(--ink);
  background: var(--surface); border: 1.5px solid var(--line); border-radius: var(--r);
  padding: 0 14px; height: var(--tap); width: 100%; appearance: none;
}
textarea.input { height: auto; min-height: 96px; padding: 12px 14px; resize: vertical; }
select.input {
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: right 18px center, right 12px center; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat;
  padding-right: 34px;
}
.input:focus-visible { outline: 3px solid var(--acc-soft); outline-offset: 0; border-color: var(--acc); }
.input[type="file"] { padding: 10px 12px; height: auto; }
.input::placeholder { color: var(--muted); }
.input:disabled, .input[readonly] { background: var(--surface-2); color: var(--ink-2); }
.input--mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.row { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; }
.row-3 { display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); }
@media (max-width: 560px) { .row, .row-3 { grid-template-columns: 1fr; } }
.check { display: flex; align-items: flex-start; gap: 11px; min-height: var(--tap); cursor: pointer; font-size: var(--t-sm); padding: 8px 0; }
.check input { width: 20px; height: 20px; accent-color: var(--acc); flex: none; margin-top: 2px; }
.unit { position: relative; display: block; }
.unit .input { padding-right: 4.4rem; }
.unit__tag { position: absolute; top: 50%; right: 12px; transform: translateY(-50%); color: var(--muted); font-size: var(--t-sm); pointer-events: none; }
.field__act { display: flex; margin-top: -4px; }

/* ——— кнопки ——— */

.btn {
  font: inherit; font-weight: var(--w-bold); font-size: var(--t-md); letter-spacing: -0.01em;
  min-height: var(--tap); padding: 0 20px; border-radius: var(--r);
  border: 1.5px solid transparent; background: var(--acc); color: var(--on-acc);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  text-decoration: none; text-align: center; white-space: nowrap;
}
.btn:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }
.btn--block { width: 100%; }
.btn--ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn--quiet { background: var(--surface-2); color: var(--ink); font-weight: var(--w-mid); }
.btn--sm { min-height: 36px; font-size: var(--t-sm); padding: 0 14px; border-radius: var(--r-sm); }
.btn--danger { background: transparent; color: var(--bad); border-color: var(--line); }
.btns { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.btns--end { justify-content: flex-end; }

/* ——— карточки ——— */

.card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 18px; display: flex; flex-direction: column; gap: 12px;
  text-decoration: none; color: inherit;
}
.card--link { transition: border-color 0.12s ease, box-shadow 0.12s ease; }
@media (hover: hover) { .card--link:hover { border-color: var(--acc); box-shadow: 0 4px 18px rgb(31 79 216 / 8%); } }
.card--dim { opacity: 0.6; }
.card--flat { padding: 0; overflow: hidden; }
.card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.card__top > :first-child { min-width: 0; }
.card__title { font-weight: var(--w-bold); font-size: var(--t-md); letter-spacing: -0.015em; overflow-wrap: anywhere; }
.card__place { font-size: var(--t-sm); color: var(--ink-2); }
.card__section { padding: 16px 18px; border-top: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 10px; }
.card__section:first-child { border-top: 0; }
.card__section h2, .card__section h3 { margin-bottom: 2px; }
.cards { display: flex; flex-direction: column; gap: 12px; }
.tiles { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); }

/* Плитка объекта в каталоге. Главное число — интервал мощности. */
.tile__power { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.tile__mw { font-family: var(--display); font-size: var(--t-lg); font-weight: 700; letter-spacing: 0; font-variant-numeric: tabular-nums; color: var(--ink); }
.tile__mw::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--volt); margin-right: 8px; vertical-align: 0.1em; }
/* Что продаётся — из данных объекта, первой строкой плитки. */
.tile__what { font-size: var(--t-sm); font-weight: var(--w-mid); color: var(--ink-2); margin-bottom: 2px; }
.tile__fav { font-size: var(--t-xs); color: var(--acc-ink); background: var(--acc-soft); border-radius: 999px; padding: 1px 8px; white-space: nowrap; }
/* Группа галочек в фильтре (интервалы мощности). */
.fset { border: 0; padding: 0; margin: 0; min-width: 0; }
.fset__l { padding: 0; font-size: var(--t-sm); color: var(--muted); margin-bottom: 2px; }
.fset .check { min-height: 0; padding: 4px 0; }
@media (pointer: coarse) { .fset .check { min-height: var(--tap); } }
.specs { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; color: var(--ink-2); font-size: var(--t-sm); }
.spec { display: inline-flex; align-items: baseline; gap: 4px; }
.spec + .spec::before { content: "·"; color: var(--line); margin-right: 6px; }
.spec b { font-weight: var(--w-bold); color: var(--ink); }
.score { font-size: var(--t-sm); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.score b { color: var(--ink); }
.flags { display: flex; flex-wrap: wrap; gap: 6px; }
.flags .badge { white-space: normal; max-width: 100%; } /* длинный флаг переносится, а не вылезает из плитки */

/* ——— плашки и уведомления ——— */

.badge {
  font-size: var(--t-xs); font-weight: var(--w-mid); letter-spacing: 0.01em;
  padding: 4px 9px; border-radius: var(--r-sm); background: var(--surface-2); color: var(--ink-2); white-space: nowrap;
}
.badge--acc { background: var(--acc-soft); color: var(--acc-ink); }
.badge--volt { background: var(--volt-soft); color: var(--volt-ink); }
.badge--warn { background: var(--warn-soft); color: var(--warn); }
.badge--bad { background: var(--bad-soft); color: var(--bad); }
.badge--ok { background: var(--ok-soft); color: var(--ok); }
.badge--line { background: transparent; border: 1px solid var(--line); }
.card > .badge, .stack > .badge { align-self: flex-start; }

.alert { border-radius: var(--r); padding: 13px 15px; font-size: var(--t-md); border: 1px solid var(--line); background: var(--surface); }
.alert--info { background: var(--acc-soft); border-color: transparent; color: var(--acc-ink); }
.alert--ok { background: var(--ok-soft); border-color: transparent; color: var(--ok); font-weight: var(--w-mid); }
.alert--warn { background: var(--warn-soft); border-color: transparent; color: var(--warn); }
.alert--bad { background: var(--bad-soft); border-color: transparent; color: var(--bad); }
.alert b { font-weight: var(--w-bold); }

.attn { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; }
.attn__row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: var(--tap); padding: 0 14px; text-decoration: none; color: var(--ink);
  border-bottom: 1px solid var(--line-soft); border-left: 3px solid transparent;
}
.attn__row:last-child { border-bottom: 0; }
.attn__row--urgent { border-left-color: var(--acc); }
.attn__row--warn { border-left-color: var(--warn); }
@media (hover: hover) { .attn__row:hover { background: var(--surface-2); } }
.attn__text { font-size: var(--t-sm); font-weight: var(--w-mid); }
.attn__n {
  min-width: 24px; height: 24px; border-radius: var(--r-pill); padding: 0 7px;
  background: var(--acc-soft); color: var(--acc-ink); font-size: var(--t-sm); font-weight: var(--w-bold);
  display: inline-flex; align-items: center; justify-content: center; font-variant-numeric: tabular-nums;
}

/* «Новые события» на домашней странице роли */
.events { display: flex; flex-direction: column; gap: 10px; }
.events__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.attn__row--seen .attn__text { font-weight: var(--w-reg); color: var(--ink-2); }

.empty { text-align: center; padding: 44px 20px; color: var(--muted); display: flex; flex-direction: column; gap: 16px; align-items: center; }
.empty__pic { width: 72px; height: 72px; opacity: 0.5; }

/* ——— описательные списки ——— */

.kv { margin: 0; display: flex; flex-direction: column; }
.kv__row { display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr; gap: 6px 16px; padding: 9px 0; border-top: 1px solid var(--line-soft); }
.kv__row:first-child { border-top: 0; }
.kv dt { margin: 0; color: var(--muted); font-size: var(--t-sm); }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.kv__hint { display: block; color: var(--muted); font-size: var(--t-xs); margin-top: 2px; }
/* Многострочный текст из форм (цель заявки, задача покупателя): переносы строк видны. */
.pre { white-space: pre-line; }
@media (max-width: 560px) { .kv__row { grid-template-columns: 1fr; gap: 2px; } }
.kv--tight .kv__row { padding: 5px 0; font-size: var(--t-sm); }

/* Цитата из документа: моноширинно, с указанием страницы. */
.quote { font-family: var(--mono); font-size: var(--t-xs); background: var(--surface-2); border-radius: var(--r-sm); padding: 6px 9px; color: var(--ink-2); overflow-wrap: anywhere; }
.quote__where { color: var(--muted); font-family: var(--sans); margin-left: 6px; }

/* ——— рабочий стол: фильтры слева, список справа ——— */

.work { display: grid; gap: 20px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 62rem) {
  .work { grid-template-columns: 19rem 1fr; }
  .work--right { grid-template-columns: minmax(0, 1fr) 20rem; }
  .work__side { position: sticky; top: 76px; }
}
/* На узком экране боковая колонка карточки идёт первой: там действие. */
@media (max-width: 61.99rem) { .work--right .work__side { order: -1; } }
.work__side { display: flex; flex-direction: column; gap: 12px; }
.work__main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.fbox { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); }
.fbox__sum { list-style: none; cursor: pointer; min-height: var(--tap); padding: 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-weight: var(--w-mid); font-size: var(--t-sm); }
.fbox__sum::-webkit-details-marker { display: none; }
.fbox__chev { width: 9px; height: 9px; flex: none; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg) translate(-2px, -2px); }
.fbox[open] .fbox__chev { transform: rotate(225deg) translate(-2px, -2px); }
.fbox[open] .fbox__sum { border-bottom: 1px solid var(--line-soft); }
.fbox__body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 12px; }
.filters { display: flex; flex-direction: column; gap: 12px; }
.count { font-size: var(--t-sm); color: var(--muted); }

/* ——— таблицы ——— */

.tablewrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
table { border-collapse: collapse; width: 100%; font-size: var(--t-sm); }
th, td { padding: 10px 13px; text-align: left; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
th { font-size: var(--t-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); font-weight: var(--w-bold); white-space: nowrap; }
tr:last-child td { border-bottom: 0; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table--rows tr { cursor: pointer; }
@media (hover: hover) { .table--rows tbody tr:hover { background: var(--surface-2); } }

/* ——— сверка: строки результата ——— */

.rules { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); overflow: hidden; }
.rule { display: grid; grid-template-columns: 8.5rem 1fr; gap: 4px 14px; padding: 11px 15px; border-top: 1px solid var(--line-soft); font-size: var(--t-sm); }
.rule:first-child { border-top: 0; }
.rule__st { font-weight: var(--w-mid); color: var(--ink-2); }
.rule__t { color: var(--ink); }
.rule__x { color: var(--ink-2); }
@media (max-width: 560px) { .rule { grid-template-columns: 1fr; } }
.scoreline { font-size: var(--t-md); font-weight: var(--w-mid); }
.legal-note { font-size: var(--t-sm); color: var(--muted); border-left: 3px solid var(--line); padding: 4px 0 4px 12px; }

/* ——— мастер по шагам ——— */

.steps { display: flex; gap: 6px; flex-wrap: wrap; font-size: var(--t-sm); }
.step { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: var(--r-pill); background: var(--surface-2); color: var(--muted); }
.step--on { background: var(--acc-soft); color: var(--acc-ink); font-weight: var(--w-mid); }
.step--done { background: var(--ok-soft); color: var(--ok); }
.step__n { width: 20px; height: 20px; border-radius: 50%; background: currentColor; color: var(--surface); display: inline-flex; align-items: center; justify-content: center; font-size: var(--t-xs); font-weight: var(--w-bold); }
.step--on .step__n, .step--done .step__n { color: var(--surface); }

/* Чек-лист документов продавца */
.slot { display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
.slot--req { border-left: 3px solid var(--acc); }
.slot__t { font-weight: var(--w-mid); }
.slot__h { font-size: var(--t-sm); color: var(--muted); grid-column: 1 / -1; }
.slot__docs { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; }
.docrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: var(--t-sm); padding: 6px 0; border-top: 1px solid var(--line-soft); }
.docrow__n { overflow-wrap: anywhere; }
.docrow__m { color: var(--muted); font-size: var(--t-xs); white-space: nowrap; }

/* ——— документ и длинный текст ——— */

.doc { display: flex; flex-direction: column; gap: 12px; max-width: var(--narrow); }
.doc h2 { margin-top: 14px; }
.doc h3 { margin-top: 8px; }
.doc p, .doc li { font-size: var(--t-md); color: var(--ink-2); line-height: 1.62; }
.doc ul, .doc ol { margin: 0; padding-left: 1.3em; display: flex; flex-direction: column; gap: 6px; }
.doc table { font-size: var(--t-sm); }

/* ——— слои карточки ——— */

.layer { border: 1px dashed var(--line); border-radius: var(--r); padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; color: var(--muted); font-size: var(--t-sm); }
.layer b { color: var(--ink); }
.locked { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: var(--t-sm); }

/* ——— CTA ——— */

.cta { background: var(--ink); color: #fff; border-radius: var(--r-lg); padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.cta__text { display: flex; flex-direction: column; gap: 3px; min-width: 14rem; flex: 1; }
.cta__text b { font-size: var(--t-md); }
.cta__text span { font-size: var(--t-sm); opacity: 0.8; }
.cta .btn { background: var(--volt); color: var(--ink); }

/* ——— страницы-документы для печати (заключение, отчёт) ——— */

.paper { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 28px; display: flex; flex-direction: column; gap: 14px; }
.paper__head { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.paper__num { font-family: var(--mono); font-size: var(--t-sm); color: var(--muted); }
.paper h2 { font-size: var(--t-md); margin-top: 8px; }
.paper .kv__row { padding: 6px 0; font-size: var(--t-sm); }
.paper__fixed { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 10px 12px; font-size: var(--t-sm); color: var(--ink-2); background: var(--surface-2); }
@media print {
  .top, .foot, .back, .btns, .attn { display: none !important; }
  .main { max-width: none; padding: 0; }
  .paper { border: 0; padding: 0; }
  body { background: #fff; }
}

/* ——— главная ——— */

.hero { padding: 56px 0 28px; display: flex; flex-direction: column; gap: 18px; max-width: 46rem; }
.hero h1 { font-size: var(--t-xxl); }
.hero p { font-size: var(--t-lg); color: var(--ink-2); line-height: 1.45; }
@media (max-width: 560px) { .hero { padding-top: 28px; } .hero h1 { font-size: var(--t-xl); } .hero p { font-size: var(--t-md); } }
.trio { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.trio .card p { color: var(--ink-2); font-size: var(--t-sm); }
.trio .card b { font-size: var(--t-md); }
.num-list { counter-reset: n; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.num-list li { counter-increment: n; display: grid; grid-template-columns: 2rem 1fr; gap: 10px; font-size: var(--t-md); color: var(--ink-2); }
.num-list li::before { content: counter(n); font-weight: var(--w-bold); color: var(--acc); font-variant-numeric: tabular-nums; }
.section { display: flex; flex-direction: column; gap: 12px; padding-top: 16px; }
.section > h2 { font-size: var(--t-xl); }

/* ——— пагинация и мелочи ——— */

.pager { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: var(--t-sm); }
.pager__a { text-decoration: none; font-weight: var(--w-mid); color: var(--acc-ink); }
.pager__n { color: var(--muted); }
.stack { display: flex; flex-direction: column; gap: 12px; }
.muted { color: var(--muted); font-size: var(--t-sm); }
.small { font-size: var(--t-sm); }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.sep { height: 1px; background: var(--line); border: 0; margin: 4px 0; }
.hint { font-size: var(--t-sm); color: var(--muted); }
.right { text-align: right; }
.nowrap { white-space: nowrap; }
.ic { width: 20px; height: 20px; vertical-align: -4px; }
.code { font-family: var(--mono); font-size: var(--t-xl); letter-spacing: 0.2em; font-weight: var(--w-bold); }
.regcard { padding: 10px 12px; border-radius: var(--r-sm); background: var(--surface-2); font-size: var(--t-sm); }

/* Рабочее место основателя: страница документа слева, поля справа. */
.bench { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 70rem) { .bench { grid-template-columns: minmax(0, 3fr) minmax(20rem, 2fr); } }
.bench__page { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 12px; overflow: auto; max-height: 82vh; }
.bench__fields { display: flex; flex-direction: column; gap: 12px; }
.ocr { font-family: var(--mono); font-size: var(--t-xs); display: flex; flex-direction: column; gap: 2px; }
.ocr__line { padding: 2px 6px; border-radius: 4px; cursor: pointer; white-space: pre-wrap; }
@media (hover: hover) { .ocr__line:hover { background: var(--volt-soft); } }
.ocr__page { font-family: var(--sans); color: var(--muted); margin: 10px 0 4px; font-weight: var(--w-mid); }
.bind { font: inherit; font-size: var(--t-xs); border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-sm); padding: 2px 8px; cursor: pointer; }
.bind.is-active { background: var(--volt-soft); border-color: var(--volt); }
.pdfframe { width: 100%; height: 78vh; border: 0; border-radius: var(--r-sm); background: var(--surface-2); }
.pageimg { display: block; width: 100%; border-radius: var(--r-sm); border: 1px solid var(--line); margin-bottom: 12px; }

@media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }

/* ═══════════════ светлая тема: фон, тени, движение ═══════════════ */

/* Фон: небо днём — два мягких цветных свечения и тонкая сетка подстанции.
   Отдельный закреплённый слой, чтобы прокрутка не перерисовывала градиенты. */
body::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(1100px 640px at 8% -10%, rgb(31 102 255 / 12%) 0%, transparent 62%),
    radial-gradient(900px 560px at 100% 6%, rgb(255 176 0 / 14%) 0%, transparent 60%),
    radial-gradient(900px 700px at 60% 110%, rgb(0 170 255 / 10%) 0%, transparent 60%),
    linear-gradient(rgb(13 40 90 / 4%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(13 40 90 / 4%) 1px, transparent 1px);
  background-size: auto, auto, auto, 48px 48px, 48px 48px;
  background-color: var(--ground);
}
body.land::before { background-image: none; background-color: #eaf1fb; }

.top { background: rgb(255 255 255 / 82%); backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%); border-bottom-color: var(--line); }
.land .top { position: fixed; left: 0; right: 0; top: 0; background: linear-gradient(rgb(255 255 255 / 72%), rgb(255 255 255 / 0%)); backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 0; }
.tnav--on { background: var(--acc-soft); color: var(--acc-ink); }
.foot { background: #fff; }

.card, .fbox, .attn, .rules, .tablewrap, .slot, .regcard, .alert, .layer, .kv--box { box-shadow: 0 1px 2px rgb(13 30 60 / 4%), 0 6px 20px rgb(13 30 60 / 4%); }
.alert--info, .alert--ok, .alert--warn, .alert--bad, .layer, .regcard { box-shadow: none; }
.card--link { transition: transform 0.25s cubic-bezier(.2,.8,.2,1), border-color 0.2s, box-shadow 0.25s; will-change: transform; }
@media (hover: hover) { .card--link:hover { border-color: rgb(31 102 255 / 45%); box-shadow: 0 18px 46px rgb(20 50 120 / 14%); } }
.input { background: #fff; border-color: #cfd7e4; }
.input:focus-visible { outline-color: rgb(31 102 255 / 22%); }
.btn { box-shadow: 0 8px 22px rgb(31 102 255 / 26%); }
@media (hover: hover) { .btn:not(.btn--ghost):not(.btn--quiet):not(.btn--danger):hover { background: #1554e0; } }
.btn--ghost, .btn--quiet, .btn--danger, .btn--sm.btn--quiet { box-shadow: none; }
.btn--ghost { border-color: #c6cfdd; background: #fff; }
.badge--line { border-color: #c6cfdd; }
th { color: var(--muted); }
.cta { background: linear-gradient(120deg, #1f66ff, #2b7bff 55%, #10a6ff); color: #fff; border: 0; box-shadow: 0 24px 60px rgb(31 102 255 / 30%); }
.cta .btn { box-shadow: 0 8px 22px rgb(120 70 0 / 25%); }
.legal-note { border-left-color: var(--volt); }
.scoreline { color: var(--ink); }
.pageimg { box-shadow: 0 10px 34px rgb(13 30 60 / 14%); }

/* Появление при прокрутке. */
.rv { opacity: 0; transform: translateY(22px); transition: opacity 0.7s ease, transform 0.7s cubic-bezier(.2,.8,.2,1); }
.rv--in { opacity: 1; transform: none; }
.rv[data-delay="1"] { transition-delay: 0.08s; } .rv[data-delay="2"] { transition-delay: 0.16s; } .rv[data-delay="3"] { transition-delay: 0.24s; }

/* Наклон карточки за курсором. */
.tilt { transform-style: preserve-3d; transition: transform 0.35s cubic-bezier(.2,.8,.2,1); }
.tilt > * { transform: translateZ(0); }

.tile__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.tile__head .badge { align-self: flex-start; }

/* ——— главная: закреплённая сцена и наплывающие блоки ——— */

.land .main { max-width: none; padding: 0; gap: 0; }
.stage { position: relative; }
.stage__sticky { position: sticky; top: 0; height: 100vh; height: 100dvh; overflow: hidden; z-index: 0; background: #cfe0f3; }
/* Пролёт: видео и кадры на весь экран, подписи — в координатах кадра (film.js). */
.film { position: absolute; inset: 0; overflow: hidden; background: #cfe0f3; }
.film__still, .film__v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; will-change: opacity; }
.film__still { opacity: 0; transition: opacity 0.9s ease; z-index: 1; }
.film__still.is-on { opacity: 1; }
.film__v { opacity: 0; transition: opacity 0.4s ease; }
.film.is-video .film__v { opacity: 1; }
/* В видео-режиме кадр проявляется у блока и растворяется на время перелёта. */
.film.is-video .film__still { transition: opacity 0.55s ease; }
.ftag { position: absolute; z-index: 2; transform: translate(-50%, -50%) scale(0.9); opacity: 0; transition: opacity 0.35s ease, transform 0.35s cubic-bezier(.2,.8,.2,1);
  font: 600 var(--t-sm)/1 var(--sans); padding: 9px 14px; border-radius: var(--r-pill); white-space: nowrap; pointer-events: none;
  background: rgb(255 255 255 / 92%); color: var(--ink); box-shadow: 0 8px 24px rgb(10 30 60 / 28%); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.ftag.is-on { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.ftag--doc::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--acc); margin-right: 8px; vertical-align: 1px; }
.ftag--volt { background: var(--volt); color: #1a1200; font-family: var(--display); font-size: var(--t-md); padding: 11px 18px; }
.ftag--acc { background: var(--acc); color: #fff; }
.ftag::after { content: ''; position: absolute; left: 50%; top: 100%; width: 2px; height: 26px; background: linear-gradient(rgb(255 255 255 / 90%), transparent); transform: translateX(-50%); }
/* На телефоне кадр сильно обрезан и закрыт текстом — подписи только мешают. */
@media (max-width: 760px) { .ftag { display: none; } }
.stage__vignette { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(rgb(255 255 255 / 55%), transparent 14%, transparent 84%, var(--ground) 100%); }
.stage__s { position: relative; z-index: 2; min-height: 100vh; min-height: 100dvh; display: flex; align-items: center; padding: 96px var(--pad) 48px; pointer-events: none; }
.stage__s:first-of-type { margin-top: -100vh; margin-top: -100dvh; }
.stage__in { width: 100%; max-width: var(--wide); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 30rem) 1fr; gap: 24px; }
.stage__s--right .stage__in { grid-template-columns: 1fr minmax(0, 30rem); }
.stage__s--right .stage__box { grid-column: 2; }
.stage__s--center .stage__in { grid-template-columns: 1fr; justify-items: center; text-align: center; }
.stage__s--center .stage__box { align-items: center; max-width: 52rem; }
.stage__s--center .stage__p { margin: 0 auto; }
.stage__s--center .btns { justify-content: center; }
.stage__box { pointer-events: auto; display: flex; flex-direction: column; gap: 16px; opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s cubic-bezier(.2,.8,.2,1); }
.stage__s.is-on .stage__box { opacity: 1; transform: none; }
.stage__kicker { font-size: var(--t-xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--acc-ink); font-weight: var(--w-bold); display: inline-flex; align-items: center; gap: 10px; }
.stage__kicker::before { content: ''; width: 22px; height: 3px; border-radius: 2px; background: var(--volt); }
.stage__h { font-size: var(--t-huge); line-height: 1.08; letter-spacing: -0.02em; }
.stage__h em { font-style: normal; color: var(--acc); }
.stage__s h1.stage__h { font-size: clamp(1.9rem, 3.6vw, 3.2rem); }
.stage__s h2.stage__h { font-size: clamp(1.9rem, 3.8vw, 3.1rem); }
.stage__p { font-size: var(--t-lg); color: var(--ink-2); line-height: 1.45; max-width: 34rem; }
.stage__glass { background: rgb(255 255 255 / 80%); border: 1px solid rgb(255 255 255 / 90%); border-radius: var(--r-lg); padding: 22px 24px; backdrop-filter: blur(16px) saturate(160%); -webkit-backdrop-filter: blur(16px) saturate(160%); box-shadow: 0 24px 60px rgb(20 50 120 / 16%); }
.stats { display: flex; gap: 28px; flex-wrap: wrap; }
.stat { display: flex; flex-direction: column; gap: 2px; }
.stat b { font-family: var(--display); font-size: var(--t-xl); font-weight: 700; letter-spacing: 0; font-variant-numeric: tabular-nums; line-height: 1; }
.stat span { font-size: var(--t-sm); color: var(--muted); }
.stage__scroll { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 3; color: var(--muted); font-size: var(--t-xs); letter-spacing: 0.12em; text-transform: uppercase; display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; }
.stage.is-scrolled .stage__scroll { opacity: 0; transition: opacity 0.4s; }
.stage__scroll i { width: 1px; height: 34px; background: linear-gradient(var(--volt), transparent); animation: drop 1.8s ease-in-out infinite; }
@keyframes drop { 0% { transform: scaleY(0); transform-origin: top; opacity: 0; } 40% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(1) translateY(10px); opacity: 0; } }
.docs-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.docs-list li { display: flex; gap: 12px; align-items: center; font-size: var(--t-md); color: var(--ink-2); }
.docs-list li::before { content: ''; width: 9px; height: 9px; border-radius: 2px; background: var(--volt); flex: none; }
.wrap { width: 100%; max-width: var(--wide); margin: 0 auto; padding: 0 var(--pad); }
.land .section { padding: 56px 0; gap: 20px; }
.land .section > h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); letter-spacing: -0.03em; }
.land .foot { position: relative; z-index: 2; }
.after-stage { position: relative; z-index: 2; background: var(--ground); }
.trio .card { padding: 24px; gap: 12px; }
.trio .card b { font-size: var(--t-lg); }
.trio .card p { color: var(--ink-2); font-size: var(--t-md); }
.trio .card .ic { width: 28px; height: 28px; color: var(--volt); }
@media (max-width: 760px) {
  .stage__in, .stage__s--right .stage__in { grid-template-columns: 1fr; }
  .stage__s--right .stage__box { grid-column: 1; }
  .stage__s { padding-top: 80px; align-items: flex-end; padding-bottom: 72px; }
  .stage__glass { padding: 18px; }
  .stats { gap: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .rv { opacity: 1; transform: none; transition: none; }
  .stage__box { opacity: 1; transform: none; transition: none; }
  .stage.is-scrolled .stage__scroll { opacity: 0; transition: opacity 0.4s; }
.stage__scroll i { animation: none; }
}

/* ——— карта России ——— */
.rumap { width: 100%; height: auto; display: block; }
.rg { fill: rgb(226 232 242 / 38%); stroke: rgb(70 96 140 / 40%); stroke-width: 0.5px; vector-effect: non-scaling-stroke; stroke-linejoin: round; transition: fill 0.2s, stroke 0.2s; }
.rg--1 { fill: rgb(78 132 255 / 34%); } .rg--2 { fill: rgb(50 112 255 / 46%); } .rg--3 { fill: rgb(31 102 255 / 58%); }
.rumap a .rg { cursor: pointer; }
.rumap a:hover .rg, .rg--active { fill: rgb(255 176 0 / 55%); stroke: rgb(160 100 0 / 85%); }
.dot { pointer-events: none; }
.dot__halo { fill: rgb(255 176 0 / 26%); animation: halo 2.6s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
.dot__core { fill: #ffb000; stroke: #ffffff; stroke-width: 1.4; }
.dot__n { fill: var(--ink); font: 700 11px var(--display); text-anchor: middle; paint-order: stroke; stroke: #ffffff; stroke-width: 3px; }
@keyframes halo { 0%, 100% { transform: scale(0.8); opacity: 0.6; } 50% { transform: scale(1.15); opacity: 1; } }
.mapwrap { background: #fff radial-gradient(70% 70% at 50% 50%, rgb(31 102 255 / 6%), transparent 70%); box-shadow: 0 6px 24px rgb(13 30 60 / 6%); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 10px; }
.districts { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }
.district { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; }
.district__h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.district__h b { font-family: var(--display); font-size: var(--t-sm); }
.district__n { font-family: var(--display); font-size: var(--t-lg); color: var(--volt-ink); }
.district a { text-decoration: none; color: var(--ink-2); font-size: var(--t-sm); display: flex; justify-content: space-between; }
.district__hidden { color: var(--muted); font-size: var(--t-sm); }
@media (hover: hover) { .district a:hover { color: var(--ink); } }

/* ——— диалоги ——— */
.chat { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 62rem) { .chat { grid-template-columns: 21rem minmax(0, 1fr); align-items: start; } }
.chat__list { display: flex; flex-direction: column; gap: 6px; max-height: 72vh; overflow: auto; }
.chat__item { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 12px 14px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); text-decoration: none; color: inherit; }
.chat__item.is-active { border-color: rgb(31 102 255 / 45%); background: var(--acc-soft); }
@media (hover: hover) { .chat__item:hover { border-color: #c6cfdd; } }
.chat__who { font-weight: var(--w-mid); font-size: var(--t-sm); display: flex; gap: 8px; align-items: center; }
.chat__obj { grid-column: 1 / -1; font-size: var(--t-xs); color: var(--volt-ink); }
.chat__last { grid-column: 1; font-size: var(--t-sm); color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat__ago { grid-column: 2; grid-row: 1; font-size: var(--t-xs); color: var(--muted); }
.chat__pane { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); display: flex; flex-direction: column; min-height: 60vh; max-height: 78vh; }
.chat__head { padding: 14px 18px; border-bottom: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 2px; }
.chat__head a { color: var(--acc-ink); }
.chat__log { flex: 1; overflow: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
.chat__form { display: flex; gap: 10px; padding: 12px 18px 16px; border-top: 1px solid var(--line-soft); align-items: flex-end; }
.chat__form textarea { flex: 1; min-height: 52px; }
.chat__empty { flex: 1; display: flex; align-items: center; justify-content: center; color: var(--muted); padding: 40px; text-align: center; }
.msg { max-width: 72%; display: flex; flex-direction: column; gap: 3px; padding: 10px 14px; border-radius: 14px 14px 14px 4px; background: var(--surface-2); align-self: flex-start; }
.msg--me { align-self: flex-end; background: rgb(31 102 255 / 12%); border-radius: 14px 14px 4px 14px; }
.msg--op:not(.msg--me) { background: rgb(255 176 0 / 15%); }
.msg__who { font-size: var(--t-xs); color: var(--muted); font-weight: var(--w-mid); }
.msg__t { white-space: pre-wrap; overflow-wrap: anywhere; }
.msg__time { font-size: var(--t-xs); color: var(--muted); align-self: flex-end; }

/* ——— объект по масштабу в плитке: рендер на белом, белое растворяется умножением ——— */
.tier { width: clamp(96px, 40%, 150px); aspect-ratio: 1; flex: none; display: block; }
.tile__head > :first-child { min-width: 0; flex: 1; }
.card--link { overflow: hidden; }
.tier__img { width: 100%; height: 100%; object-fit: contain; display: block; mix-blend-mode: multiply; transition: transform 0.5s cubic-bezier(.2,.8,.2,1); }
.card--link:hover .tier__img { transform: translateY(-4px) scale(1.06); }
.trio--2 { grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); }
.trio--2 .num-list li { font-size: var(--t-sm); }

/* ——— путь объекта у продавца ——— */
.path { display: grid; gap: 8px; grid-template-columns: repeat(4, 1fr); }
@media (max-width: 760px) { .path { grid-template-columns: 1fr 1fr; } }
.path__step { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); font-size: var(--t-sm); color: var(--muted); }
.path__step b { color: var(--ink-2); font-size: var(--t-sm); }
.path__step.is-done { border-color: rgb(19 138 69 / 30%); } .path__step.is-done .path__n { background: var(--ok-soft); color: var(--ok); }
.path__step.is-on { border-color: var(--volt); background: rgb(255 176 0 / 8%); } .path__step.is-on b { color: var(--ink); } .path__step.is-on .path__n { background: var(--volt); color: #1a1200; }
.path__n { width: 24px; height: 24px; border-radius: 50%; background: var(--surface-2); display: inline-flex; align-items: center; justify-content: center; font-family: var(--display); font-size: var(--t-xs); font-weight: 700; }
.num-list li > span { display: block; }

.hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.ask { display: flex; gap: 8px; align-items: center; flex: 1 1 22rem; max-width: 30rem; }
.ask .input { height: 40px; }


/* Ссылки продавцу на рабочем столе объекта. */
.invites { list-style: none; margin: 8px 0 12px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.invites li { overflow-wrap: anywhere; }
.invites .btns { margin-top: 6px; }

/* ——— главная: «что вы увидите по объекту» — образец карточки поверх фото ——— */
.peek { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 40px; align-items: center; padding: 64px 0; }
.peek__text { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.peek__text h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); letter-spacing: -0.03em; }
.peek__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; counter-reset: pk; }
.peek__list li { counter-increment: pk; display: grid; grid-template-columns: 2.2rem 1fr; column-gap: 12px; row-gap: 2px; }
.peek__list li::before { content: counter(pk, decimal-leading-zero); grid-row: span 2; font-family: var(--display); font-size: var(--t-sm); color: var(--acc); padding-top: 3px; }
.peek__list b { font-size: var(--t-md); }
.peek__list span { color: var(--ink-2); font-size: var(--t-md); }
.peek__stage { position: relative; border-radius: var(--r-lg); background-size: cover; background-position: center; min-height: 420px; display: flex; align-items: center; justify-content: center; padding: 32px; overflow: hidden; box-shadow: 0 24px 60px rgb(13 30 60 / 18%); }
.peek__stage::before { content: ''; position: absolute; inset: 0; background: linear-gradient(120deg, rgb(10 25 50 / 25%), rgb(10 25 50 / 5%)); }
.peek__card { position: relative; width: min(100%, 26rem); display: flex; flex-direction: column; gap: 12px; padding: 22px 24px; border-radius: var(--r-lg);
  background: rgb(255 255 255 / 72%); border: 1px solid rgb(255 255 255 / 80%); backdrop-filter: blur(18px) saturate(160%); -webkit-backdrop-filter: blur(18px) saturate(160%); box-shadow: 0 20px 50px rgb(10 30 60 / 25%); }
.peek__top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.peek__mw { font-family: var(--display); font-size: var(--t-xl); font-weight: 700; }
.peek__mw::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--volt); margin-right: 10px; vertical-align: 0.15em; }
.peek__kv { font-size: var(--t-sm); font-weight: var(--w-mid); color: var(--acc-ink); background: var(--acc-soft); padding: 4px 10px; border-radius: var(--r-pill); }
.peek__place { font-size: var(--t-sm); color: var(--ink-2); }
.peek__row { display: grid; grid-template-columns: 6.5rem 1fr; gap: 10px; font-size: var(--t-sm); padding-top: 10px; border-top: 1px solid rgb(13 22 38 / 8%); }
.peek__k { color: var(--muted); }
.peek__chips { display: flex; gap: 6px; flex-wrap: wrap; }
.peek__chips i { font-style: normal; font-weight: var(--w-mid); font-size: var(--t-xs); padding: 3px 9px; border-radius: var(--r-pill); background: rgb(19 138 69 / 12%); color: var(--ok); }
.peek__btn { align-self: flex-start; margin-top: 4px; background: var(--acc); color: #fff; font-weight: var(--w-bold); font-size: var(--t-sm); padding: 10px 16px; border-radius: var(--r); }
@media (max-width: 860px) { .peek { grid-template-columns: 1fr; padding: 40px 0; } .peek__stage { min-height: 0; padding: 20px; } }

/* ——— карта: объекты выбранной области под картой ——— */
.region-objs { display: flex; flex-direction: column; gap: 14px; padding-top: 8px; scroll-margin-top: 80px; }
.region-objs h2 { font-size: var(--t-lg); }
.rumap a .rg { cursor: pointer; transition: fill 0.2s; }

/* ——— кабинет продавца: одно действие сейчас, свёрнутые подробности ——— */
.next { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 16px 20px; border-radius: var(--r-lg); background: var(--acc-soft); border: 1px solid rgb(31 102 255 / 20%); }
.next > div { display: flex; flex-direction: column; gap: 2px; }
.next b { font-size: var(--t-md); }
.next span { color: var(--ink-2); font-size: var(--t-sm); }
.more { border-top: 1px solid var(--line-soft); padding-top: 10px; }
.more > summary { cursor: pointer; font-weight: var(--w-mid); font-size: var(--t-sm); color: var(--acc-ink); list-style: none; padding: 4px 0; }
.more > summary::-webkit-details-marker { display: none; }
.more > summary::before { content: '+ '; }
.more[open] > summary::before { content: '− '; }
.more > .stack, .more > .rules { margin-top: 10px; }

/* ——— заявка по объекту: объект слева, форма справа ——— */
.apply { display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 30rem); gap: 32px; justify-content: center; align-items: start; padding: 24px 0 40px; }
.apply__obj { display: flex; flex-direction: column; gap: 6px; padding: 22px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); position: sticky; top: 80px; }
.apply__obj .tier { width: 100%; max-width: 180px; align-self: center; margin-bottom: 6px; }
.apply__obj .tile__mw { font-size: var(--t-xl); }
.apply__obj .tnav { padding-left: 0; margin-top: 8px; }
.apply__form { padding: 28px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); box-shadow: 0 20px 50px rgb(13 30 60 / 8%); }
.apply__form .head { margin-bottom: 4px; }
.apply__form .check { font-size: var(--t-xs); color: var(--muted); min-height: 0; padding: 0; }
.apply__form .hint { margin-top: -6px; }
@media (max-width: 760px) { .apply { grid-template-columns: 1fr; gap: 16px; padding-top: 8px; } .apply__obj { position: static; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 12px; } .apply__obj .tier { width: 64px; margin: 0; } }
.upl { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.upl .input { width: auto; min-width: 10rem; height: 36px; font-size: var(--t-sm); }
.upl__btn { position: relative; overflow: hidden; cursor: pointer; }
.upl__btn input { position: absolute; inset: 0; opacity: 0; cursor: pointer; font-size: 0; }
.upl .field__error { flex-basis: 100%; }
.slot { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.apply--done { grid-template-columns: minmax(0, 30rem); }
.done { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; padding: 40px 28px; }
.done__mark { width: 56px; height: 56px; border-radius: 50%; background: var(--ok-soft); color: var(--ok); display: inline-flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 700; }
.done .btns { justify-content: center; margin-top: 8px; }

/* ——— карточка объекта: проверка документов ——— */
.verify__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.verify__sub { color: var(--ink-2); font-size: var(--t-sm); }
.verify__nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.verify__nums div { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: var(--r); background: var(--surface-2); }
.verify__nums b { font-family: var(--display); font-size: var(--t-xl); line-height: 1; }
.verify__nums span { font-size: var(--t-sm); color: var(--muted); }
.todo { display: flex; flex-direction: column; gap: 12px; }
.todo__i { display: grid; grid-template-columns: 28px 1fr; gap: 12px; align-items: start; }
.todo__i > div { display: flex; flex-direction: column; gap: 2px; }
.todo__i span:not(.todo__n) { color: var(--ink-2); font-size: var(--t-sm); }
.todo__n { width: 28px; height: 28px; border-radius: 50%; background: var(--acc-soft); color: var(--acc-ink); display: inline-flex; align-items: center; justify-content: center; font-family: var(--display); font-size: var(--t-xs); font-weight: 700; }

/* ——— «Как это работает»: вкладки, шаги со скриншотами ——— */
.how__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 8px; }
.how__tabs { display: inline-flex; gap: 4px; padding: 4px; border-radius: var(--r-pill); background: var(--surface-2); }
.how__tab { padding: 10px 20px; border-radius: var(--r-pill); text-decoration: none; font-weight: var(--w-mid); color: var(--ink-2); }
.how__tab.is-on { background: var(--surface); color: var(--ink); box-shadow: 0 2px 8px rgb(13 30 60 / 10%); }
.how__pane { display: flex; flex-direction: column; gap: 56px; padding: 32px 0 16px; }
.how__step { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 48px; align-items: center; }
.how__step:nth-child(even) .how__txt { order: 2; }
.how__txt { display: flex; flex-direction: column; gap: 10px; }
.how__n { width: 40px; height: 40px; border-radius: 50%; background: var(--acc); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-family: var(--display); font-weight: 700; }
.how__txt h3 { font-family: var(--display); font-size: clamp(1.4rem, 2.4vw, 1.9rem); letter-spacing: -0.02em; line-height: 1.15; }
.how__txt p { color: var(--ink-2); font-size: var(--t-lg); line-height: 1.45; }
.how__shot { margin: 0; border-radius: var(--r-lg); overflow: hidden; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 30px 70px rgb(13 30 60 / 14%); max-height: 460px; display: flex; flex-direction: column; }
.how__shot img { display: block; width: 100%; height: auto; object-fit: cover; object-position: top; }
.how__bar { display: flex; gap: 6px; padding: 10px 14px; background: var(--surface-2); border-bottom: 1px solid var(--line); flex: none; }
.how__bar i { width: 10px; height: 10px; border-radius: 50%; background: #d4dbe6; }
.how__call { padding: 24px; gap: 16px; max-height: none; }
.how__callrow { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: center; }
.how__callrow > div { display: flex; flex-direction: column; gap: 2px; }
.how__callrow span:not(.how__ico) { color: var(--ink-2); font-size: var(--t-sm); }
.how__ico { width: 44px; height: 44px; border-radius: 12px; background: var(--acc-soft); color: var(--acc-ink); display: inline-flex; align-items: center; justify-content: center; font-size: 20px; }
.how__end { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 24px 28px; border-radius: var(--r-lg); background: linear-gradient(120deg, #1f66ff, #2b7bff 55%, #10a6ff); color: #fff; }
.how__end > div:first-child { display: flex; flex-direction: column; gap: 4px; }
.how__end b { font-size: var(--t-lg); }
.how__end span { opacity: 0.88; }
.how__end .btn { background: #fff; color: var(--acc-ink); box-shadow: none; }
.how__end .btn--ghost { background: transparent; color: #fff; border-color: rgb(255 255 255 / 60%); }
.how__faq { display: flex; flex-direction: column; gap: 4px; max-width: 46rem; padding: 24px 0 40px; }
.how__faq h2 { margin-bottom: 8px; }
.how__faq .more > summary { font-size: var(--t-md); color: var(--ink); padding: 10px 0; }
.how__faq .more p { color: var(--ink-2); padding: 0 0 12px 18px; }
@media (max-width: 860px) { .how__step { grid-template-columns: 1fr; gap: 20px; } .how__step:nth-child(even) .how__txt { order: 0; } .how__pane { gap: 40px; } }
.todo-line { font-size: var(--t-sm); font-weight: var(--w-mid); color: var(--acc-ink); }

/* ——— главная: доверие к документам ——— */
.trust { display: flex; flex-direction: column; gap: 28px; padding: 64px 0 8px; }
.trust__head { display: flex; flex-direction: column; gap: 12px; max-width: 46rem; }
.trust__head h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); letter-spacing: -0.03em; }
.trust__head h2 em { font-style: normal; color: var(--acc); }
.trust__head p { color: var(--ink-2); font-size: var(--t-lg); line-height: 1.45; }
.trust__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.trust__i { display: flex; flex-direction: column; gap: 8px; padding: 22px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); }
.trust__i .ic { width: 36px; height: 36px; padding: 8px; border-radius: 10px; background: var(--acc-soft); color: var(--acc-ink); box-sizing: border-box; }
.trust__i b { font-size: var(--t-md); }
.trust__i span { color: var(--ink-2); font-size: var(--t-sm); line-height: 1.45; }
@media (max-width: 860px) { .trust__grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .trust__grid { grid-template-columns: 1fr; } }

/* ——— рекомендации ——— */
.refer { display: flex; flex-direction: column; gap: 22px; padding: 56px 0 8px; }
.refer__head { display: flex; flex-direction: column; gap: 10px; }
.refer__head h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); letter-spacing: -0.03em; }
.refer__head h2 em { font-style: normal; color: var(--acc); }
.refer__head p { color: var(--ink-2); font-size: var(--t-lg); }
.refer__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.refer__i { display: flex; flex-direction: column; gap: 8px; padding: 26px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); text-decoration: none; color: inherit; transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s; }
@media (hover: hover) { .refer__i:hover { border-color: rgb(31 102 255 / 45%); box-shadow: 0 18px 46px rgb(20 50 120 / 12%); transform: translateY(-2px); } }
.refer__i .ic { width: 40px; height: 40px; padding: 9px; border-radius: 12px; background: var(--volt-soft); color: var(--volt-ink); box-sizing: border-box; }
.refer__i b { font-size: var(--t-lg); }
.refer__i span { color: var(--ink-2); font-size: var(--t-sm); }
.refer__i .refer__go { margin-top: 6px; color: var(--acc-ink); font-weight: var(--w-bold); }
.refer__kind { align-self: flex-start; }
.refer__kind input { position: absolute; opacity: 0; pointer-events: none; }
.refer__kind label { cursor: pointer; position: relative; }
@media (max-width: 700px) { .refer__grid { grid-template-columns: 1fr; } }

/* ——— карта: рельеф и объём ——— */
.mapwrap { perspective: 1600px; overflow: hidden; }
.rumap { transform: rotateX(16deg) scale(1.02); transform-origin: 50% 60%;
  filter: drop-shadow(0 1.2px 0 #cfd7e3) drop-shadow(0 1.2px 0 #c2cbd9) drop-shadow(0 1.2px 0 #b6c0cf) drop-shadow(0 14px 22px rgb(20 40 80 / 18%)); }
.rumap__relief { pointer-events: none; }
.rumap a:hover .rg { fill: rgb(255 176 0 / 55%); }
@media (prefers-reduced-motion: reduce) { .rumap { transform: none; } }
.dot__core { filter: drop-shadow(0 0 3px rgb(255 176 0 / 90%)) drop-shadow(0 0 8px rgb(255 160 0 / 60%)); }
.dot__halo { fill: rgb(255 176 0 / 32%); }
.dot__n { font-size: 15px; }
.districts { align-items: start; }
.district a { padding: 6px 0; border-top: 1px solid var(--line-soft); align-items: center; }
.district a i { font-style: normal; color: var(--acc); opacity: 0; transform: translateX(-4px); transition: opacity 0.2s, transform 0.2s; }
@media (hover: hover) { .district a:hover i { opacity: 1; transform: none; } }
@media (hover: none) { .district a i { opacity: 1; transform: none; } }

/* ——— телефон: меню ☰ вместо строки пунктов (пункты и кнопка уезжали за край) ——— */
.mnav { display: none; position: relative; margin-left: auto; }
.mnav__btn { list-style: none; width: 44px; height: 44px; border-radius: 12px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; cursor: pointer; background: var(--surface); border: 1px solid var(--line); }
.mnav__btn::-webkit-details-marker { display: none; }
.mnav__btn span { width: 18px; height: 2px; border-radius: 2px; background: var(--ink); transition: transform 0.2s, opacity 0.2s; }
.mnav[open] .mnav__btn span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.mnav[open] .mnav__btn span:nth-child(2) { opacity: 0; }
.mnav[open] .mnav__btn span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.mnav__panel { position: absolute; right: 0; top: calc(100% + 8px); width: min(86vw, 300px); display: flex; flex-direction: column; gap: 2px; padding: 10px; border-radius: var(--r-lg); background: #fff; border: 1px solid var(--line); box-shadow: 0 24px 60px rgb(13 30 60 / 18%); z-index: 50; }
.mnav__a { display: flex; align-items: center; justify-content: space-between; min-height: 46px; padding: 0 12px; border-radius: var(--r); text-decoration: none; font-weight: var(--w-mid); color: var(--ink); }
.mnav__a.is-on { background: var(--acc-soft); color: var(--acc-ink); }
.mnav__a--muted { color: var(--muted); }
.mnav__panel .btn { margin-top: 6px; }
@media (max-width: 760px) {
  .top__nav, .top__right { display: none; }
  .mnav { display: block; }
  .top__in { min-height: 60px; gap: 10px; }
  .brand__text { font-size: var(--t-xs); }
}
/* Телефон: заголовки скромнее, подсказки сбоку — прочь, чтобы объекты были на первом экране. */
@media (max-width: 560px) {
  h1 { font-size: 1.45rem; }
  .head h1, .how__head h1 { font-size: 1.55rem; }
  .hide-m { display: none !important; }
  .main { padding-top: 16px; gap: 16px; }
}
.mcta { display: none; }
@media (max-width: 760px) {
  .mcta { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgb(255 255 255 / 92%); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--line); }
  body:has(.mcta) .foot { padding-bottom: 76px; }
}
@media (max-width: 760px) {
  .apply__obj { padding: 10px 14px; flex-wrap: nowrap; }
  .apply__obj .tier { width: 48px; }
  .apply__obj .tile__mw { font-size: var(--t-md); }
  .apply__obj .tile__what, .apply__obj .tnav { display: none; }
  .apply__obj .card__place { font-size: var(--t-xs); }
  .apply__form { padding: 20px 18px; }
  .apply__form .head h1 { font-size: 1.4rem; }
}
.land .top { transition: background 0.25s; }
.land.past-stage .top { background: rgb(255 255 255 / 90%); backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%); border-bottom: 1px solid var(--line); }
@media (max-width: 560px) {
  .peek__mw { font-size: var(--t-lg); white-space: nowrap; }
  .peek__kv { white-space: nowrap; }
  .peek__card { padding: 18px; }
  .peek__row { grid-template-columns: 1fr; gap: 4px; }
  .apply__obj .tile__mw { white-space: nowrap; }
}
@media (max-width: 560px) {
  .how__tabs { display: flex; }
  .how__tab { flex: 1; padding: 9px 10px; text-align: center; white-space: nowrap; font-size: var(--t-sm); }
}
@media (max-width: 560px) {
  th, th.num { white-space: normal; letter-spacing: 0.02em; }
  th, td { padding: 9px 10px; }
  .rule { grid-template-columns: 1fr; gap: 2px; }
}
@media (max-width: 560px) {
  .slot { grid-template-columns: 1fr; }
  .upl .input { flex: 1 1 100%; min-width: 0; height: 40px; }
  .upl .upl__btn { flex: 1 1 100%; }
}
.chat__back { display: none; font-size: var(--t-sm); text-decoration: none; margin-bottom: 4px; }
@media (max-width: 61.99rem) {
  .chat__pane:has(.chat__empty) { min-height: 0; }
  .chat__list:has(.chat__item) + .chat__pane:has(.chat__empty) { display: none; }
  .chat:has(.chat__head) .chat__list { display: none; }
  .chat__back { display: inline-block; }
  .chat__pane { max-height: none; min-height: 0; }
  .chat__pane:has(.chat__head) { height: calc(100dvh - 150px); min-height: 420px; }
  .msg__t { font-size: var(--t-sm); }
  .msg { max-width: 86%; padding: 8px 12px; }
  .chat__empty { padding: 24px 16px; }
  .chat__form { padding: 10px 12px 12px; }
  .chat__log { padding: 12px; }
}
