/* Загрузка сметы прямо на сайте (задача 128). Переменные и кнопки — из style.css,
   здесь только своё, все классы с приставкой «загрузка», чтобы не задеть чужие.
   Абзацы заданы через p.класс: на первом экране их иначе перебивает «.первый p»
   (крупный серый текст с отступом). */
.загрузка{margin-top:var(--ш4);max-width:620px}
.загрузка[hidden],.загрузка-ход[hidden],.загрузка-итог[hidden],.загрузка-список[hidden],
.загрузка-режим[hidden],.загрузка-ошибка[hidden]{display:none}

/* поле выбора: вся рамка — кнопка, файл можно и перетащить */
.загрузка-поле{display:block;position:relative;cursor:pointer;background:var(--белый);
  border:2px dashed #b9c4c1;border-radius:14px;padding:var(--ш4) var(--ш3);text-align:center;
  transition:border-color .15s,background .15s}
.загрузка-поле:hover,.загрузка-поле-над{border-color:var(--петроль);background:#f7faf9}
.загрузка-поле:focus-within{outline:3px solid rgba(14,94,104,.35);outline-offset:2px}
.загрузка-поле input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.загрузка-призыв{display:block;font-size:18px}
.загрузка-призыв b{color:var(--петроль)}
.загрузка-форматы{display:block;margin-top:6px;font-size:15px;color:var(--серый)}
.загрузка-поле-есть{padding:var(--ш3)}

.загрузка-список{list-style:none;margin:var(--ш2) 0 0;padding:0}
.загрузка-список li{display:flex;align-items:center;gap:var(--ш1);background:var(--белый);
  border:1px solid var(--рамка);border-radius:10px;padding:10px 8px 10px 14px;margin-top:8px}
.загрузка-имя{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.загрузка-вес{color:var(--серый);font-size:15px;white-space:nowrap}
.загрузка-убрать{border:0;background:transparent;color:var(--серый);font-size:24px;line-height:1;
  width:36px;height:36px;border-radius:8px;cursor:pointer}
.загрузка-убрать:hover{background:var(--бумага);color:var(--текст)}

.загрузка-режим{border:0;margin:var(--ш2) 0 0;padding:0}
.загрузка-режим label{display:flex;gap:10px;align-items:flex-start;margin-top:6px;cursor:pointer}
.загрузка-режим input{margin-top:6px;accent-color:var(--петроль)}

.загрузка-кнопка{border:0;cursor:pointer;font-family:inherit}
.загрузка-кнопка:disabled{background:#9fb5b3;cursor:default}
.загрузка p.загрузка-согласие{margin-top:var(--ш2);font-size:14px;color:var(--серый)}
.загрузка p.загрузка-ошибка{margin-top:var(--ш2);padding:12px 14px;border-radius:10px;
  background:#fbeee0;color:#7a4410;font-size:16px}

/* ход разбора */
.загрузка-ход{margin-top:var(--ш4);max-width:620px;background:var(--белый);
  border:1px solid var(--рамка);border-radius:14px;padding:var(--ш3)}
.загрузка-шаги{list-style:none;margin:0;padding:0;display:flex;gap:var(--ш2);flex-wrap:wrap}
.загрузка-шаги li{color:var(--серый);font-size:16px;display:flex;align-items:center;gap:8px}
.загрузка-шаги li::before{content:'';width:12px;height:12px;border-radius:50%;
  border:2px solid #b9c4c1;background:var(--белый)}
.загрузка-шаги li.сейчас{color:var(--текст);font-weight:600}
.загрузка-шаги li.сейчас::before{border-color:var(--петроль);animation:загрузка-пульс 1.2s infinite}
.загрузка-шаги li.сделано{color:var(--петроль)}
.загрузка-шаги li.сделано::before{border-color:var(--петроль);background:var(--петроль)}
@keyframes загрузка-пульс{50%{box-shadow:0 0 0 5px rgba(14,94,104,.15)}}
@media (prefers-reduced-motion:reduce){.загрузка-шаги li.сейчас::before{animation:none}}
.загрузка-ход p.загрузка-строка{margin-top:var(--ш2);color:var(--серый);font-size:16px}
.загрузка-ход p.загрузка-строка:empty{display:none}

.загрузка-итог{margin-top:var(--ш2)}
.загрузка-отчёт{margin-top:var(--ш1)}
.загрузка-итог p.мелко{margin-top:var(--ш1);font-size:15px}
.загрузка-ответ{margin-top:var(--ш3);font-size:16px;overflow-wrap:anywhere}
.загрузка-ответ + .загрузка-ответ{padding-top:var(--ш3);border-top:1px solid var(--рамка)}
.загрузка-итог p.загрузка-дальше{margin-top:var(--ш3);font-size:16px}
.загрузка-ещё{font-family:inherit;cursor:pointer;margin-left:0;margin-top:var(--ш3)}

/* мессенджеры — вторым рядом под формой */
p.загрузка-или{margin-top:var(--ш4);font-size:16px;color:var(--серый)}
/* отступ справа, а не слева: перенесённая на вторую строку кнопка встаёт ровно под первой */
.загрузка-или ~ .кнопка{margin-left:0;margin-right:10px;margin-top:var(--ш2)}
@media (max-width:640px){
  .загрузка-кнопка{width:100%}
  .загрузка-или ~ .кнопка{display:block;text-align:center;margin-right:0}
}

/* имя и почта — по желанию */
.загрузка-контакты{display:grid;grid-template-columns:1fr 1fr;gap:var(--ш2);margin-top:var(--ш3)}
@media (max-width:640px){.загрузка-контакты{grid-template-columns:1fr}}
.загрузка-подпись{display:block;font-size:15px;color:var(--текст)}
.загрузка-подпись i{font-style:normal;color:var(--серый)}
.загрузка-подпись input,.загрузка-слово input{display:block;width:100%;margin-top:6px;font:inherit;font-size:17px;
  padding:12px 14px;border:1px solid #b9c4c1;border-radius:10px;background:var(--белый);color:var(--текст)}
.загрузка-подпись input:focus,.загрузка-слово input:focus{outline:3px solid rgba(14,94,104,.25);border-color:var(--петроль)}
.загрузка-контакты p.загрузка-зачем{grid-column:1/-1;margin:0;font-size:14px;color:var(--серый)}
.загрузка-итог p.загрузка-письмо{margin-top:var(--ш1);color:var(--петроль)}

/* разговор после разбора — как в боте */
.загрузка-разговор{margin-top:var(--ш3)}
.загрузка-реплика{margin-top:var(--ш2);padding:var(--ш2);background:var(--бумага);border-radius:12px;
  font-size:16px;overflow-wrap:anywhere}
.загрузка-реплика-своя{margin-left:auto;max-width:80%;width:fit-content;background:rgba(14,94,104,.1);
  color:var(--петроль-тёмный)}
.загрузка-кнопки{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.загрузка-выбор{font:inherit;font-size:16px;font-weight:600;color:var(--петроль);background:var(--белый);
  border:2px solid var(--петроль);border-radius:10px;padding:10px 16px;cursor:pointer;text-decoration:none}
.загрузка-выбор:hover{background:rgba(14,94,104,.08)}
.загрузка-выбор:disabled{opacity:.5;cursor:default}
.загрузка-слово{display:flex;gap:8px;margin-top:var(--ш2)}
.загрузка-слово input{margin-top:0;flex:1;min-width:0}
.загрузка-слово .загрузка-слово-кнопка{margin-top:0;padding:12px 20px;font-size:16px;border:0;cursor:pointer;font-family:inherit}
@media (max-width:640px){.загрузка-выбор{flex:1 1 100%;text-align:center}}