/* Стили Leadar: лендинг, вход, модуль «Смены», анкета.
   Вынесены из index.html отдельным файлом — страница перевалила за 110 КБ,
   и браузер перекачивал всё целиком при каждой правке разметки. Отдаётся
   тем же сервером из /static/, внешних ссылок здесь нет. */

:root{
  --bg:#07090f;
  --panel:#141a2a;
  --panel-2:#0d111c;
  --text:#eaeef6;
  --muted:#8e9ab0;
  --dim:#606c82;          /* только разделители и скелетоны: контраст 3.8:1 */
  --accent:#e8401c;
  /* Контраст по WCAG: белый на #e8401c даёт 4.05:1 при 15px/600 — ниже порога
     AA 4.5:1. Для текста на акценте и для акцентного текста на фоне берём
     затемнённый и осветлённый варианты. */
  --accent-btn:#c9330f;
  --accent-text:#ff8a63;
  --accent-l:#ff7048;
  --green:#35c98a;
  --violet:#a78bfa;
  --red:#e5484d;
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.16);
  --r:12px;
  --r-sm:10px;
  --r-lg:14px;
  --r-xs:8px;    /* чипы, подсказки, иконки-кнопки — не изобретать 7/8px по месту */
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font-family:"Montserrat",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  font-size:15px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit}
button,input{font-family:inherit;font-size:inherit;color:inherit}
b,strong{font-weight:600}
.num{font-variant-numeric:tabular-nums}

:focus-visible{outline:2px solid var(--accent-l);outline-offset:2px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap;border:0}

.wrap{max-width:980px;margin:0 auto;padding:0 18px}

/* ── шапка ───────────────────────────────────────────────────────────── */
.top{border-bottom:.5px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;
           min-height:60px}
.logo{display:flex;align-items:center;gap:8px;font-size:21px;text-decoration:none}
.logo .bolt{color:var(--accent);display:flex}
.logo .bolt svg{width:16px;height:21px;display:block}
.logo .name{font-style:italic;font-weight:700;letter-spacing:-.02em}
.logo .sub{color:var(--muted);font-size:13px;font-weight:500;font-style:normal;
           letter-spacing:0}
.top .about{
  color:var(--muted);font-size:13.5px;text-decoration:none;
  border:.5px solid var(--line);border-radius:var(--r-sm);
  padding:9px 14px;min-height:38px;display:inline-flex;align-items:center;
}
.top .about:hover{color:var(--text);border-color:var(--line-2)}

/* ── первый экран ────────────────────────────────────────────────────── */
.hero{padding:34px 0 0}
.hero h1{margin:0;font-size:32px;line-height:1.15;font-weight:700;letter-spacing:-.02em}
.hero p{margin:10px 0 0;color:var(--muted);font-size:15.5px;max-width:62ch}

/* ── переключатель режима ────────────────────────────────────────────── */
.modes{display:flex;gap:8px;margin:22px 0 10px}
.mode{
  flex:1;min-height:46px;
  border:.5px solid var(--line);
  background:var(--panel-2);
  color:var(--muted);
  border-radius:var(--r-sm);
  padding:11px 12px;
  cursor:pointer;
  font-weight:500;
  font-size:14.5px;
  transition:color .12s,border-color .12s,background .12s;
}
.mode:hover{color:var(--text);border-color:var(--line-2)}
.mode[aria-checked="true"]{background:var(--panel);color:var(--text);border-color:var(--accent)}

/* ── форма ───────────────────────────────────────────────────────────── */
.form{
  background:var(--panel);
  border:.5px solid var(--line);
  border-radius:var(--r-lg);
  padding:16px;
}
.fields{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:12px}
.field{display:flex;flex-direction:column;gap:6px;position:relative;min-width:0}
.field label{font-size:12.5px;color:var(--muted);font-weight:500}
.field input{
  width:100%;
  min-height:46px;
  background:var(--panel-2);
  border:.5px solid var(--line-2);
  border-radius:var(--r-sm);
  padding:10px 12px;
  outline:none;
  font-variant-numeric:tabular-nums;
}
.field input:focus{border-color:var(--accent)}
.field input:focus-visible{outline:2px solid var(--accent-l);outline-offset:1px}
.field input::placeholder{color:var(--dim)}
.field input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.7);cursor:pointer}

.quick{display:flex;gap:6px;margin-top:2px}
.quick button{
  background:transparent;border:.5px solid var(--line);color:var(--muted);
  border-radius:var(--r-xs);padding:5px 10px;font-size:12.5px;cursor:pointer;min-height:32px;
}
.quick button:hover{color:var(--text);border-color:var(--line-2)}

.row-go{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
.go{
  background:var(--accent-btn);
  color:#fff;
  border:.5px solid var(--accent-btn);
  border-radius:var(--r-sm);
  padding:12px 22px;
  min-height:46px;
  font-weight:600;
  cursor:pointer;
}
.go:hover{background:var(--accent-l);border-color:var(--accent-l)}
.go:disabled{opacity:.55;cursor:default}
.reset{
  background:transparent;border:.5px solid var(--line);color:var(--muted);
  border-radius:var(--r-sm);padding:12px 16px;min-height:46px;cursor:pointer;
}
.reset:hover{color:var(--text);border-color:var(--line-2)}
.hint{color:var(--muted);font-size:12.5px}

/* ── подсказки мест ──────────────────────────────────────────────────── */
.suggest{
  position:absolute;top:100%;left:0;right:0;z-index:20;margin-top:4px;
  background:var(--panel-2);
  border:.5px solid var(--line-2);
  border-radius:var(--r-sm);
  max-height:250px;overflow-y:auto;padding:4px;
}
.suggest[hidden]{display:none}
.suggest div{padding:9px 10px;border-radius:var(--r-xs);cursor:pointer;font-size:14px}
.suggest div[aria-selected="true"],.suggest div:hover{background:rgba(255,255,255,.06)}

/* ── полоса доверия ──────────────────────────────────────────────────── */
.trust{
  margin-top:12px;padding:11px 14px;
  border:.5px solid var(--line);border-radius:var(--r-sm);
  background:var(--panel-2);
  color:var(--muted);font-size:12.5px;
  display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;
}
.stale{margin:0 0 12px;padding:10px 14px;border-radius:var(--r-sm);font-size:13px;
  line-height:1.45;color:var(--text);background:rgba(229,72,77,.10);
  border:.5px solid rgba(229,72,77,.5)}
.stale b{font-weight:600}
.hint-pay{display:block;margin-top:4px;color:var(--muted);font-size:11.5px;line-height:1.35}
.trust b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.trust .sep{color:var(--dim)}
.trust .fresh b{color:var(--green)}

/* ── результаты ──────────────────────────────────────────────────────── */
.results{margin-top:26px}
.summary{color:var(--muted);font-size:13.5px}
.summary b{color:var(--text);font-variant-numeric:tabular-nums}
.group{margin-top:20px}
.group-head{
  display:flex;align-items:baseline;gap:9px;margin-bottom:6px;
  padding-bottom:8px;border-bottom:.5px solid var(--line);
}
.group-head h2{margin:0;font-size:14.5px;font-weight:600}
.group-head .n{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.group-head .dot{width:6px;height:6px;border-radius:50%;background:var(--green);
                 align-self:center;flex:0 0 auto}
.group-head.far .dot{background:var(--violet)}
.group-note{color:var(--muted);font-size:12.5px;margin:0 0 12px}

.cards{display:grid;gap:10px}
.card{
  background:var(--panel);border:.5px solid var(--line);
  border-radius:var(--r);padding:14px 15px;
}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.who{font-weight:600;word-break:break-word;font-size:15.5px}
.who .role{display:inline-block;margin-left:8px;font-weight:400;font-size:12px;
           color:var(--muted)}
.rep{flex:0 0 148px;text-align:right}
.rep-line{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.rep-line b{color:var(--text);font-weight:600}
.bar{height:4px;border-radius:3px;background:rgba(255,255,255,.07);margin-top:6px;
     overflow:hidden}
.bar i{display:block;height:100%;border-radius:3px;background:var(--muted)}
.bar.high i{background:var(--green)}
.bar.mid i{background:var(--violet)}
.rep-sub{font-size:11.5px;color:var(--muted);margin-top:5px;font-variant-numeric:tabular-nums}

.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.chip{
  border:.5px solid var(--line);border-radius:var(--r-xs);padding:4px 9px;
  font-size:12.5px;color:var(--muted);
}
.chip b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.chip.here{border-color:rgba(53,201,138,.45);color:var(--green)}
.chip.here b{color:var(--green)}
.chip.far{border-color:rgba(167,139,250,.45);color:var(--violet)}
.chip.far b{color:var(--violet)}
.chip.pay b{color:var(--green)}

.text{margin:12px 0 0;color:var(--muted);font-size:14px;white-space:pre-wrap;
      word-break:break-word}
.card-foot{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  margin-top:12px;padding-top:11px;border-top:.5px solid var(--line);flex-wrap:wrap;
}
.posted{color:var(--muted);font-size:12px}
.tg{
  border:.5px solid var(--accent);color:var(--accent-text);
  border-radius:var(--r-sm);padding:11px 16px;min-height:44px;
  display:inline-flex;align-items:center;gap:7px;
  text-decoration:none;font-size:13.5px;font-weight:600;
}
.tg:hover{background:rgba(232,64,28,.1);color:var(--accent-l);border-color:var(--accent-l)}
.tg svg{width:15px;height:15px;display:block}
.tg.off{border-color:var(--line);color:var(--muted);cursor:default}

.more{
  display:block;width:100%;margin-top:14px;background:transparent;
  border:.5px solid var(--line-2);color:var(--text);
  border-radius:var(--r-sm);padding:12px;min-height:46px;cursor:pointer;font-weight:500;
}
.more:hover{border-color:var(--accent)}
.more:disabled{color:var(--muted);cursor:default;border-color:var(--line)}
.more-err{margin:8px 0 0;color:var(--red);font-size:12.5px;text-align:center}
.more-cap{margin:18px auto 0;max-width:520px;color:var(--muted);font-size:13px;
  line-height:1.5;text-align:center}
.more-cap b{color:var(--text);font-weight:600}
.more-err[hidden]{display:none}

/* ── состояния ───────────────────────────────────────────────────────── */
.state{
  border:.5px solid var(--line);border-radius:var(--r);background:var(--panel);
  padding:26px 18px;text-align:center;
}
.state h3{margin:0 0 7px;font-size:15.5px;font-weight:600}
.state p{margin:0;color:var(--muted);font-size:13.5px}
.state ul{margin:12px auto 0;padding:0;list-style:none;color:var(--muted);
          font-size:13px;max-width:440px;text-align:left}
.state li{padding:3px 0 3px 15px;position:relative}
.state li::before{content:"—";position:absolute;left:0;color:var(--accent)}
.state.err h3{color:var(--red)}
.state .retry{
  margin-top:14px;background:transparent;border:.5px solid var(--line-2);
  color:var(--text);border-radius:var(--r-sm);padding:11px 18px;min-height:44px;
  cursor:pointer;font-weight:500;
}
.state .retry:hover{border-color:var(--accent)}
/* «возможно, вы имели в виду» — исправление опечатки в районе в один клик */
.try{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:7px;
     margin-top:16px;padding-top:14px;border-top:.5px solid var(--line)}
.try-l{color:var(--muted);font-size:12.5px}
.try-b{background:transparent;cursor:pointer;color:var(--text);
       border-color:var(--line-2);min-height:32px;font-size:12.5px}
.try-b:hover{border-color:var(--accent);color:var(--accent-l)}

/* скелетоны: пульс прозрачностью, без градиентов */
.sk-card{background:var(--panel);border:.5px solid var(--line);border-radius:var(--r);
         padding:14px 15px}
.sk{background:rgba(255,255,255,.07);border-radius:6px;height:11px;
    animation:sk 1.3s ease-in-out infinite}
.sk-row{display:flex;gap:8px;align-items:center}
.sk-row+.sk-row{margin-top:11px}
.sk-card .sk:nth-child(2n){animation-delay:.15s}
@keyframes sk{0%,100%{opacity:.5}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.sk{animation:none}}

/* ── карта ───────────────────────────────────────────────────────────────
   Новых цветов нет: панель, линии и акцент те же, что у списка. Карта живёт
   ОТДЕЛЬНЫМ блоком, а не внутри #results — тот перерисовывается целиком через
   innerHTML, и карта внутри него умирала бы после каждого поиска. */
.views{display:flex;gap:8px;margin-top:22px}
.view{
  background:var(--panel-2);border:.5px solid var(--line);color:var(--muted);
  border-radius:var(--r-sm);padding:9px 15px;min-height:40px;cursor:pointer;
  font-size:13.5px;font-weight:500;display:inline-flex;align-items:center;gap:7px;
}
.view:hover{color:var(--text);border-color:var(--line-2)}
.view[aria-selected="true"]{background:var(--panel);color:var(--text);border-color:var(--accent)}
.view svg{width:14px;height:14px;display:block;flex:none}

.mapwrap[hidden]{display:none}
.mapwrap{margin-top:16px}
/* isolation: карта не имеет права всплыть над списком подсказок (z-index 20) */
.mapbox{
  position:relative;height:520px;isolation:isolate;
  border:.5px solid var(--line);border-radius:var(--r);overflow:hidden;
  background:var(--panel-2);
}
#lmap{position:absolute;inset:0}
.map-state{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  max-width:min(420px,86%);text-align:center;color:var(--muted);font-size:13.5px;
  line-height:1.5;background:var(--panel);border:.5px solid var(--line);
  border-radius:var(--r-sm);padding:14px 16px;
  /* сообщения браузера бывают одной длинной строкой без пробелов — она рвала
     ширину блока и уезжала за карту */
  overflow-wrap:anywhere;
}
.map-state[hidden]{display:none}
.map-state b{color:var(--text);font-weight:600}
.map-state .retry{margin-top:12px;display:inline-block}
.map-ctl{position:absolute;right:10px;bottom:10px;z-index:4;display:flex;
  flex-direction:column;gap:6px}
.map-ctl button{
  width:32px;height:32px;border-radius:var(--r-xs);background:var(--panel);
  border:.5px solid var(--line-2);color:var(--text);font-size:15px;cursor:pointer;
  padding:0;line-height:1;font-family:inherit;
}
.map-ctl button:hover{border-color:var(--accent)}
.map-at{
  position:absolute;right:50px;bottom:10px;z-index:4;max-width:250px;
  background:var(--panel);border:.5px solid var(--line);border-radius:var(--r-xs);
  padding:7px 9px;font-size:10.5px;line-height:1.45;color:var(--muted);
}
.map-at[hidden]{display:none}
.map-at a{color:var(--muted)}
.map-legend{
  position:absolute;left:10px;bottom:10px;z-index:4;
  background:var(--panel);border:.5px solid var(--line);border-radius:var(--r-xs);
  padding:7px 10px;font-size:11.5px;color:var(--muted);
  display:flex;align-items:center;gap:7px;
}
.map-legend i{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:none}
.map-note{margin:10px 0 0;color:var(--muted);font-size:12.5px;line-height:1.5}
.map-note b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.map-pick{margin-top:14px}
.map-pick .cards{margin-top:10px}
.map-pick-head{display:flex;align-items:baseline;gap:9px;padding-bottom:8px;
  border-bottom:.5px solid var(--line)}
.map-pick-head h2{margin:0;font-size:14.5px;font-weight:600}
.map-pick-head .n{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
/* без attributionControl штатная подпись не рисуется — своя за кнопкой ⓘ */
.maplibregl-ctrl-attrib{display:none!important}

/* ── как это работает ────────────────────────────────────────────────── */
.how{margin-top:46px;padding-top:26px;border-top:.5px solid var(--line)}
.how h2{margin:0 0 4px;font-size:19px;font-weight:700;letter-spacing:-.01em}
.how .lead{margin:0 0 16px;color:var(--muted);font-size:14px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.step{background:var(--panel-2);border:.5px solid var(--line);border-radius:var(--r);
      padding:15px}
.step .n{color:var(--accent);font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
.step h3{margin:6px 0 6px;font-size:15px;font-weight:600}
.step p{margin:0;color:var(--muted);font-size:13.5px}

/* ── подвал ──────────────────────────────────────────────────────────── */
.foot{margin-top:40px;padding:22px 0 60px;border-top:.5px solid var(--line);
      color:var(--muted);font-size:12.5px}
.foot p{margin:0 0 8px;max-width:78ch}
.foot .free{color:var(--text)}
.foot .mark{display:flex;align-items:center;gap:7px;margin-bottom:12px;color:var(--text)}
.foot .mark .bolt{color:var(--accent);display:flex}
.foot .mark svg{width:12px;height:16px;display:block}
.foot .mark .name{font-style:italic;font-weight:700}

/* ── адаптив ─────────────────────────────────────────────────────────── */
@media (max-width:860px){
  .fields{grid-template-columns:1fr 1fr}
  .field.place{grid-column:1 / -1}
  .steps{grid-template-columns:1fr}
  /* на узком экране карта ниже: под ней сразу карточки выбранной точки */
  .mapbox{height:400px}
  /* не заезжаем под столбик кнопок масштаба — он тоже у правого края */
  .map-at{right:52px;bottom:56px;max-width:none;left:10px}
}
@media (max-width:640px){
  /* легенда обязана остаться в одну строку: в две она наезжала на кнопки
     масштаба и на подпись источников */
  .lg-more{display:none}
  .map-legend{right:52px;font-size:11px;padding:6px 9px}
}
@media (max-width:640px){
  .wrap{padding:0 13px}
  .top .wrap{min-height:56px}
  .logo .sub{display:none}
  .hero{padding:24px 0 0}
  .hero h1{font-size:25px}
  .hero p{font-size:14.5px}
  .fields{grid-template-columns:1fr}
  .field.place{grid-column:auto}
  .modes{flex-direction:column}
  .mode,.go,.reset,.more,.quick button,.state .retry,.top .about,.try-b{min-height:44px}
  .try-b{padding:6px 12px}
  .quick button{flex:1}
  .row-go{gap:8px}
  .go,.reset{flex:1 1 auto}
  .hint{flex:1 1 100%}
  .card-top{flex-direction:column;gap:10px}
  .rep{flex:1 1 auto;text-align:left;width:100%}
  .rep .bar{max-width:190px}
  .tg{width:100%;justify-content:center}
  .card-foot{gap:10px}
}


/* ═══════════════════════════════════════════════════════════════════════════
   ЭКРАНЫ И ПЕРЕХОДЫ
   Страница одна, экранов несколько. Роутер прячет лишние через [hidden],
   поэтому display:none обязан быть сильнее любого display у самого экрана.
   ═══════════════════════════════════════════════════════════════════════════ */
.screen[hidden]{display:none!important}
.screen{animation:scr-in .18s ease-out}
@keyframes scr-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Карточки въезжают лесенкой. Задержка считается от --i, который ставит js
   ТОЛЬКО новым карточкам: при догрузке «показать ещё» старые не должны
   моргать заново. backwards — чтобы до начала анимации карточка была скрыта,
   а не мигала на месте. */
.card{animation:card-in .26s ease-out backwards;animation-delay:calc(var(--i,0) * 26ms)}
@keyframes card-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.card.seen{animation:none}
.card{transition:border-color .14s}
.card:hover{border-color:var(--line-2)}

/* Пульс молнии — единственная бесконечная анимация на странице, и гасить её
   надо во всех местах, где она заведена: на лендинге и в шапке экранов входа.
   Свечение при этом остаётся, уходит только мигание. */
@media (prefers-reduced-motion:reduce){
  .screen,.card{animation:none!important}
  .lp-bolt,.au-top img{
    animation:none;
    filter:drop-shadow(0 0 16px rgba(232,64,28,.55)) drop-shadow(0 0 44px rgba(255,85,51,.42));
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   ЛЕНДИНГ
   ═══════════════════════════════════════════════════════════════════════════ */

/* Подсветка молнии и мягкий фон унаследованы от пре-лонч ширмы: владелец
   просил оставить именно этот пульсирующий логотип. Это единственное место
   на странице, где есть свечение и радиальный фон. */
.lp-hero{
  position:relative;text-align:center;padding:52px 0 44px;
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(232,64,28,.08), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(232,64,28,.06), transparent 60%);
}
.lp-bolt{
  width:132px;height:132px;display:block;margin:0 auto 18px;user-select:none;
  animation:bolt-pulse 3.6s ease-in-out infinite;
}
@keyframes bolt-pulse{
  0%,100%{filter:drop-shadow(0 0 16px rgba(232,64,28,.55)) drop-shadow(0 0 44px rgba(255,85,51,.42))}
  50%{filter:drop-shadow(0 0 26px rgba(232,64,28,.75)) drop-shadow(0 0 64px rgba(255,85,51,.55))}
}
.lp-mark{
  display:block;font-style:italic;font-weight:700;font-size:34px;
  letter-spacing:-.02em;margin-bottom:22px;
}
.lp-hero h1{
  margin:0 auto;max-width:16ch;font-size:40px;line-height:1.1;font-weight:700;
  letter-spacing:-.025em;
}
.lp-hero .lp-sub{
  margin:14px auto 0;max-width:52ch;color:var(--muted);font-size:16px;line-height:1.55;
}

.lp-cta{display:flex;gap:10px;justify-content:center;margin:26px auto 0;max-width:520px}
.lp-cta a{flex:1;text-decoration:none}
.btn{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;min-height:50px;padding:13px 20px;
  border-radius:var(--r-sm);border:.5px solid var(--line-2);
  background:var(--panel-2);color:var(--text);
  font-weight:600;font-size:15px;font-family:inherit;cursor:pointer;
  transition:border-color .14s,background .14s,color .14s;
}
.btn:hover{border-color:var(--line-2);background:var(--panel)}
.btn-main{background:var(--accent-btn);border-color:var(--accent-btn);color:#fff}
.btn-main:hover{background:var(--accent-l);border-color:var(--accent-l)}
.btn:disabled{opacity:.55;cursor:default}
.lp-login{margin:16px 0 0;color:var(--muted);font-size:13.5px}
.lp-login a{color:var(--accent-text);text-decoration:none;font-weight:600}
.lp-login a:hover{text-decoration:underline}

/* живые цифры: пока не пришли — тире, а не ноль и не пустота */
.lp-nums{
  display:flex;justify-content:center;flex-wrap:wrap;gap:10px;
  margin:30px auto 0;max-width:660px;
}
.lp-num{
  flex:1 1 170px;background:var(--panel);border:.5px solid var(--line);
  border-radius:var(--r);padding:14px 12px;
}
.lp-num b{display:block;font-size:23px;font-weight:700;font-variant-numeric:tabular-nums;
  letter-spacing:-.01em}
.lp-num span{display:block;margin-top:3px;color:var(--muted);font-size:12.5px}
.lp-num.fresh b{color:var(--green)}

.lp-sec{margin-top:52px}
.lp-sec h2{margin:0 0 6px;font-size:22px;font-weight:700;letter-spacing:-.015em}
.lp-sec .lp-lead{margin:0 0 18px;color:var(--muted);font-size:14.5px}

.lp-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lp-card{
  background:var(--panel);border:.5px solid var(--line);border-radius:var(--r-lg);
  padding:20px;
}
.lp-card .lp-role{
  display:inline-flex;align-items:center;gap:7px;
  color:var(--accent-text);font-size:12.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.06em;
}
.lp-card h3{margin:10px 0 8px;font-size:17px;font-weight:600}
.lp-card p{margin:0 0 14px;color:var(--muted);font-size:14px;line-height:1.55}
.lp-card ul{margin:0 0 16px;padding:0;list-style:none;color:var(--muted);font-size:13.5px}
.lp-card li{padding:4px 0 4px 16px;position:relative}
.lp-card li::before{content:"—";position:absolute;left:0;color:var(--accent)}

.lp-foot{margin-top:56px;padding:24px 0 60px;border-top:.5px solid var(--line);
  color:var(--muted);font-size:12.5px}
.lp-foot p{margin:0 0 8px;max-width:78ch}

/* ═══════════════════════════════════════════════════════════════════════════
   ВХОД И РЕГИСТРАЦИЯ
   ═══════════════════════════════════════════════════════════════════════════ */
.au{max-width:420px;margin:0 auto;padding:38px 0 70px}
.au-top{text-align:center;margin-bottom:24px}
.au-top img{width:74px;height:74px;display:block;margin:0 auto 12px;
  animation:bolt-pulse 3.6s ease-in-out infinite}
.au-top .lp-mark{font-size:26px;margin-bottom:0}
.au h1{margin:22px 0 6px;font-size:25px;font-weight:700;letter-spacing:-.02em;text-align:center}
.au .au-sub{margin:0 0 22px;color:var(--muted);font-size:14px;text-align:center;line-height:1.5}

.au-box{background:var(--panel);border:.5px solid var(--line);
  border-radius:var(--r-lg);padding:20px}

/* выбор стороны: то же поведение, что у переключателя режима в модуле */
.au-sides{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}
.au-side{
  border:.5px solid var(--line);background:var(--panel-2);color:var(--muted);
  border-radius:var(--r-sm);padding:12px 10px;min-height:64px;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:600;text-align:center;
  transition:color .14s,border-color .14s,background .14s;
}
.au-side small{display:block;font-weight:400;font-size:11.5px;margin-top:3px;color:var(--dim)}
.au-side:hover{color:var(--text);border-color:var(--line-2)}
.au-side[aria-checked="true"]{border-color:var(--accent);color:var(--text);
  background:rgba(232,64,28,.08)}
.au-side[aria-checked="true"] small{color:var(--muted)}

.au-f{margin-bottom:14px}
.au-f label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:6px;font-weight:500}
.au-f input{
  width:100%;min-height:48px;background:var(--panel-2);color:var(--text);
  border:.5px solid var(--line-2);border-radius:var(--r-sm);
  padding:12px 13px;outline:none;font-family:inherit;font-size:15px;
}
.au-f input:focus{border-color:var(--accent)}
.au-f input::placeholder{color:var(--dim)}
.au-hint{display:block;margin-top:5px;color:var(--dim);font-size:11.5px;line-height:1.4}
.au-pwd{position:relative}
.au-pwd input{padding-right:64px}
.au-eye{
  position:absolute;right:5px;top:5px;height:38px;padding:0 11px;
  background:transparent;border:0;color:var(--muted);font-family:inherit;
  font-size:12px;cursor:pointer;border-radius:var(--r-xs);
}
.au-eye:hover{color:var(--text)}
.au-err{margin:0 0 14px;padding:11px 13px;border-radius:var(--r-sm);font-size:13px;
  line-height:1.45;color:var(--text);background:rgba(229,72,77,.10);
  border:.5px solid rgba(229,72,77,.5)}
.au-err[hidden]{display:none}
.au-alt{margin:16px 0 0;text-align:center;color:var(--muted);font-size:13px;line-height:1.7}
.au-alt a{color:var(--accent-text);text-decoration:none;font-weight:600}
.au-alt a:hover{text-decoration:underline}
.au-back{display:inline-block;margin-bottom:18px;color:var(--muted);font-size:13px;
  text-decoration:none}
.au-back:hover{color:var(--text)}

/* код восстановления показывается ровно один раз — экран под него отдельный */
.au-code{
  margin:4px 0 16px;padding:16px;text-align:center;
  border:.5px solid var(--accent);border-radius:var(--r-sm);
  background:rgba(232,64,28,.08);
  font-size:25px;font-weight:700;letter-spacing:.12em;
  font-variant-numeric:tabular-nums;user-select:all;
}
.au-copy{width:100%;margin-bottom:16px}

/* ═══════════════════════════════════════════════════════════════════════════
   ШАПКА ВОШЕДШЕГО
   ═══════════════════════════════════════════════════════════════════════════ */
.top .me{display:flex;align-items:center;gap:8px}
.me-name{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;
  max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-out{
  background:transparent;border:.5px solid var(--line);color:var(--muted);
  border-radius:var(--r-sm);padding:8px 13px;min-height:38px;cursor:pointer;
  font-family:inherit;font-size:13px;
}
.me-out:hover{color:var(--text);border-color:var(--line-2)}
.top .me[hidden],.top .about[hidden]{display:none}

/* ═══════════════════════════════════════════════════════════════════════════
   МОДУЛЬ «СМЕНЫ»: правка блоков
   ═══════════════════════════════════════════════════════════════════════════ */

/* Раньше строка «Собираю сводку…» и предупреждение о свежести стояли между
   формой и результатами и разрывали смысловой блок. Сводка теперь идёт
   вплотную к форме — это её подпись, а не отдельный экран. */
.trust{margin-top:12px}

/* Заголовок выдачи: число слева, вид справа, на одной линии. */
.res-head{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  flex-wrap:wrap;margin-top:26px;padding-bottom:10px;
  border-bottom:.5px solid var(--line);
}
.res-head .summary{font-size:14px}
.views{margin-top:0;gap:6px}

/* Скелетон повторяет геометрию карточки, иначе на его месте список прыгает. */
.sk-card{min-height:150px}

/* ── анкета ──────────────────────────────────────────────────────────── */
.su-bar[hidden]{display:none}
.su-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.su-open{
  background:transparent;color:var(--text);border:.5px solid var(--line-2);
  border-radius:var(--r-sm);padding:10px 16px;min-height:44px;cursor:pointer;
  font-size:13.5px;font-weight:600;font-family:inherit;
}
.su-open:hover{border-color:var(--accent);color:var(--accent-text)}
.su-why{color:var(--muted);font-size:12.5px}
.signup{
  margin:0 0 18px;padding:18px;border:.5px solid var(--line);
  border-radius:var(--r);background:var(--panel);
}
.signup[hidden]{display:none}
.su-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}
.su-head h2{margin:0;font-size:17px;font-weight:700;letter-spacing:-.01em}
.su-close{
  background:transparent;border:0;color:var(--muted);font-size:24px;line-height:1;
  cursor:pointer;padding:4px 8px;border-radius:var(--r-xs);font-family:inherit;
}
.su-close:hover{color:var(--text)}
.su-f{margin:16px 0 0}
.su-f > label.su-l{display:block;font-size:12.5px;color:var(--muted);margin-bottom:6px}
.su-f .req{color:var(--accent-text)}
.su-hint{display:block;margin-top:5px;color:var(--dim);font-size:11.5px;line-height:1.4}
.su-f input[type=text],.su-f input[type=number],.su-f input[type=date]{
  width:100%;background:var(--panel-2);color:var(--text);font-family:inherit;
  border:.5px solid var(--line-2);border-radius:var(--r-sm);padding:11px 12px;
  font-size:14px;min-height:44px;outline:none;
}
.su-f input:focus{border-color:var(--accent)}
.su-chips{display:flex;flex-wrap:wrap;gap:7px}
.su-chip{
  background:transparent;border:.5px solid var(--line-2);color:var(--text);
  border-radius:999px;padding:8px 13px;font-size:12.5px;cursor:pointer;
  font-family:inherit;min-height:36px;
}
.su-chip[aria-pressed=true]{border-color:var(--accent);color:var(--accent-text);
  background:rgba(232,64,28,.10)}
.su-check{display:flex;gap:9px;align-items:flex-start;cursor:pointer;font-size:13px;
  line-height:1.45;color:var(--text)}
.su-check input{margin-top:2px;width:17px;height:17px;accent-color:var(--accent);flex:none}
.su-consents{margin-top:20px;padding-top:16px;border-top:.5px solid var(--line)}
.su-consents .su-f{margin-top:11px}
.su-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.su-err{margin:14px 0 0;color:var(--red);font-size:13px;line-height:1.45}
.su-err[hidden]{display:none}
#su-send{margin-top:18px;width:100%}
.su-done{font-size:14px;line-height:1.55;color:var(--text);white-space:pre-line}
.su-done[hidden]{display:none}
.su-closed{color:var(--muted);font-size:13.5px;line-height:1.5}


/* Полоска «вы смотрите как гость». Тон спокойный: это не ошибка, а
   приглашение — красную рамку .stale она заимствовать не должна. */
.guest{
  margin:16px 0 0;padding:11px 14px;border-radius:var(--r-sm);
  border:.5px solid var(--line);background:var(--panel-2);
  color:var(--muted);font-size:13px;
}
.guest a{color:var(--accent-text);font-weight:600;text-decoration:none}
.guest a:hover{text-decoration:underline}
.guest[hidden]{display:none}

@media (max-width:640px){
  .lp-hero{padding:34px 0 32px}
  .lp-bolt{width:104px;height:104px}
  .lp-mark{font-size:28px}
  .lp-hero h1{font-size:29px}
  .lp-hero .lp-sub{font-size:14.5px}
  .lp-cta{flex-direction:column}
  .lp-two{grid-template-columns:1fr}
  .lp-num{flex:1 1 100%}
  .lp-sec h2{font-size:19px}
  .au{padding:24px 0 60px}
  .res-head{gap:10px}
  .views{width:100%}
  .view{flex:1;justify-content:center}
}
@media (max-width:860px){
  .lp-two{grid-template-columns:1fr}
}

/* Кнопка внутри ссылки. Подчёркивание от <a> к ней не относится: визуально
   это кнопка, а ссылка нужна только ради рабочего адреса и «открыть в новой
   вкладке». В .lp-cta это уже было, в карточках «кому это надо» — забылось. */
.lp-card a,.lp-cta a{text-decoration:none;display:block}