:root{
  --teal:#0e5c5c; --teal-d:#0a4747; --teal-l:#e7f0f0;
  --ink:#1a2632; --muted:#5d6e7a; --line:#dce3e6; --bg:#f4f6f7; --card:#fff;
  --excellent:#1b8a5a; --stable:#2563a8; --risk:#c77b1a; --critical:#c23b3b;
  --ok:#1b8a5a; --err:#c23b3b;
  --r:8px; --shadow:0 1px 3px rgba(20,40,55,.08),0 1px 2px rgba(20,40,55,.04);
}
*{box-sizing:border-box}
body{margin:0;font-family:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--bg);color:var(--ink);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{line-height:1.2;margin:0 0 .4em;font-family:"Spectral",Georgia,serif;letter-spacing:.1px}
h1{font-size:1.7rem;font-weight:700}
h2{font-size:1.25rem;font-weight:600}
h3{font-size:1.02rem;font-weight:600}

/* topbar */
.top{background:var(--teal-d);color:#fff;padding:0 22px;display:flex;align-items:center;
  justify-content:space-between;height:58px;position:sticky;top:0;z-index:20}
.top .brand{font-weight:700;font-size:1.05rem;letter-spacing:.2px;color:#fff}
.top .brand small{display:block;font-weight:400;font-size:.7rem;opacity:.75;letter-spacing:.3px}
.top nav{display:flex;align-items:center;gap:18px}
.top nav a{color:#cfe3e3;font-size:.9rem}
.top nav a:hover{color:#fff;text-decoration:none}
.top .who{font-size:.8rem;opacity:.85;text-align:right}
.top .who b{display:block;font-size:.85rem;opacity:1}

.wrap{max-width:1080px;margin:26px auto;padding:0 22px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:22px;margin-bottom:18px;box-shadow:var(--shadow)}
.muted{color:var(--muted)}
.small{font-size:.85rem}
.row{display:flex;gap:18px;flex-wrap:wrap}
.spread{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}

/* buttons */
.btn{display:inline-block;background:var(--teal);color:#fff;border:none;border-radius:6px;
  padding:9px 16px;font-size:.9rem;font-weight:600;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--teal-d);text-decoration:none;color:#fff}
.btn.sec{background:#fff;color:var(--teal);border:1px solid var(--teal)}
.btn.sec:hover{background:var(--teal-l)}
.btn.ghost{background:transparent;color:var(--muted);border:1px solid var(--line)}
.btn.danger{background:var(--critical)}
.btn.sm{padding:5px 11px;font-size:.82rem}

/* forms */
label{display:block;font-weight:600;font-size:.85rem;margin:14px 0 4px}
label.inline{display:flex;align-items:center;gap:8px;font-weight:400;margin:7px 0}
input[type=text],input[type=password],input[type=number],input[type=date],select,textarea{
  width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:6px;font:inherit;background:#fff}
input:focus,select:focus,textarea:focus{outline:2px solid var(--teal);outline-offset:-1px;border-color:var(--teal)}
textarea{min-height:60px;resize:vertical}
.field{margin-bottom:6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* flash */
.flash{padding:11px 15px;border-radius:6px;margin-bottom:14px;font-size:.9rem}
.flash.ok{background:#e6f4ec;color:#13603d;border:1px solid #b7dcc7}
.flash.error{background:#fbeaea;color:#8f2727;border:1px solid #ecc3c3}

/* tables */
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
th{font-size:.75rem;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700}
tr:hover td{background:#fafcfc}

/* status pills */
.pill{display:inline-block;padding:3px 10px;border-radius:20px;font-size:.75rem;font-weight:700;
  letter-spacing:.3px;white-space:nowrap}
.pill.draft{background:#eef1f3;color:#5d6e7a}
.pill.pending_review{background:#fff3df;color:#9a5b08}
.pill.approved{background:#e6f4ec;color:#13603d}
.pill.rejected{background:#fbeaea;color:#8f2727}

/* zone banner */
.zone{border-radius:var(--r);padding:18px 22px;color:#fff;margin-bottom:18px}
.zone.excellent{background:var(--excellent)}
.zone.stable{background:var(--stable)}
.zone.risk{background:var(--risk)}
.zone.critical{background:var(--critical)}
.zone .pct{font-size:2.4rem;font-weight:800;line-height:1}
.zone .ztitle{font-size:1.15rem;font-weight:800;letter-spacing:.5px}
.zone .zdesc{opacity:.92;font-size:.9rem;margin-top:4px}
.zdot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:7px;vertical-align:middle}
.zdot.excellent{background:var(--excellent)} .zdot.stable{background:var(--stable)}
.zdot.risk{background:var(--risk)} .zdot.critical{background:var(--critical)}

/* indicator block */
.kpi{border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin-bottom:14px;background:#fff}
.kpi .head{display:flex;gap:12px;align-items:baseline}
.kpi .no{flex:0 0 auto;width:30px;height:30px;border-radius:6px;background:var(--teal);color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:.95rem}
.anchors{font-size:.82rem;color:var(--muted);margin:10px 0;padding-left:2px}
.anchors div{padding:3px 0;border-left:3px solid var(--line);padding-left:10px;margin:3px 0}
.calcbox{background:var(--teal-l);border-radius:6px;padding:10px 13px;font-size:.88rem;margin-top:8px}
.calcbox b{color:var(--teal-d)}
.scoreline{display:flex;align-items:center;gap:14px;margin-top:10px;flex-wrap:wrap}
.scoreline .sval{font-size:1.3rem;font-weight:800;color:var(--teal-d)}

.matrix-opt{display:inline-flex;gap:4px}
.matrix-opt label{display:inline-flex;align-items:center;gap:5px;font-weight:600;margin:0;
  padding:6px 12px;border:1px solid var(--line);border-radius:6px;cursor:pointer}

.totalbar{display:flex;gap:22px;flex-wrap:wrap;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 20px}
.totalbar .blk{text-align:center}
.totalbar .blk .v{font-size:1.6rem;font-weight:800;color:var(--teal-d)}
.totalbar .blk .l{font-size:.72rem;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}

.bar{height:8px;background:#eef1f3;border-radius:5px;overflow:hidden;min-width:120px;flex:1}
.bar > i{display:block;height:100%}

.notice{background:#fff8ec;border:1px solid #f0dcb4;border-radius:6px;padding:11px 14px;
  font-size:.85rem;color:#7a5a18;margin-bottom:16px}
.crumb{font-size:.85rem;color:var(--muted);margin-bottom:10px}
.tag{font-size:.72rem;background:#eef1f3;color:#5d6e7a;padding:2px 8px;border-radius:4px}

/* public survey */
.survey-wrap{max-width:560px;margin:30px auto;padding:0 18px}
.survey-wrap .card{padding:26px}
.opt-group label.inline{padding:10px 12px;border:1px solid var(--line);border-radius:6px;margin:6px 0}
.opt-group label.inline:hover{background:var(--teal-l)}

@media(max-width:720px){
  .grid2{grid-template-columns:1fr}
  .top nav{gap:12px}
  .top .who{display:none}
}

/* статус завершено */
.pill.completed{background:#e6f4ec;color:#13603d}

/* плитки сводной статистики */
.stats{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.stats .stat{flex:1;min-width:150px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--shadow);padding:16px 18px}
.stats .stat .v{font-family:"Spectral",serif;font-size:1.9rem;font-weight:700;color:var(--teal-d);line-height:1}
.stats .stat .l{font-size:.72rem;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-top:6px}

/* строки распределения (зоны, индикаторы, опрос) */
.distrow{display:flex;align-items:center;gap:10px;padding:6px 0}
.distrow .dlabel{flex:0 0 auto;min-width:150px;max-width:230px;font-size:.85rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.distrow .dnum{flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:var(--teal-l);
  color:var(--teal-d);font-size:.75rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.distrow .dcount{flex:0 0 auto;min-width:38px;text-align:right;font-weight:700;color:var(--ink)}

/* галерея фото-доказательств */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.thumb{position:relative;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#f7f9f9}
.thumb img{display:block;width:100%;height:120px;object-fit:cover}
.thumb .cap{padding:6px 8px;font-size:.78rem;color:var(--muted);line-height:1.3}
.thumb form{position:absolute;top:6px;right:6px;margin:0}
.thumb .del{width:26px;height:26px;border:none;border-radius:50%;background:rgba(194,59,59,.92);
  color:#fff;font-size:1.1rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.thumb .del:hover{background:var(--critical)}
input[type=file]{padding:7px;background:#fff;border:1px dashed var(--line);border-radius:6px;width:100%}

/* справочник: метки и списки */
.tag{display:inline-block;background:var(--teal-l);color:var(--teal-d);border-radius:5px;
  padding:2px 8px;font-size:.78rem;margin:2px 3px 2px 0;white-space:nowrap}
.taglist{line-height:2}

/* справочник реестра */
.searchbar{display:flex;gap:8px;margin:14px 0 20px}
.searchbar input{flex:1}
.reggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.regcard{display:flex;justify-content:space-between;align-items:center;gap:10px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow);padding:16px 18px;color:var(--ink)}
.regcard:hover{text-decoration:none;border-color:var(--teal);box-shadow:0 2px 10px rgba(14,92,92,.12)}
.regcard .rn{font-weight:600;font-family:"Spectral",serif}
.regcard .rc{font-size:1.3rem;font-weight:800;color:var(--teal-d);white-space:nowrap}
.regcard .rc span{font-size:.7rem;font-weight:600;color:var(--muted);text-transform:uppercase}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 16px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;
  border:1px solid var(--line);background:#fff;color:var(--muted);font-size:.82rem}
.chip:hover{text-decoration:none;border-color:var(--teal);color:var(--teal-d)}
.chip.on{background:var(--teal);border-color:var(--teal);color:#fff}
.chip b{font-weight:700}
.chip.on b{color:#fff}

/* экспресс-чек-лист учреждения */
.qrow{padding:9px 0;border-bottom:1px solid var(--line)}
.qrow:last-child{border-bottom:none}
.qlbl{font-size:.9rem;font-weight:600;margin-bottom:5px}
.optline{display:flex;flex-wrap:wrap;gap:6px}
.opt{display:inline-flex;align-items:center;gap:5px;font-weight:400;font-size:.85rem;
  border:1px solid var(--line);border-radius:6px;padding:4px 10px;margin:0;cursor:pointer;background:#fff;
  transition:background .12s,border-color .12s}
.opt:hover{border-color:var(--teal)}
.opt:has(input:checked){background:var(--teal-l);border-color:var(--teal);color:var(--teal-d);font-weight:600}
.bscore{font-family:"Manrope",sans-serif;font-size:.78rem;font-weight:600;color:var(--teal-d);
  background:var(--teal-l);padding:2px 9px;border-radius:12px;margin-left:8px;white-space:nowrap}
h2 .bscore{vertical-align:middle}
table.cards{width:100%;border-collapse:collapse}
table.cards th,table.cards td{border:1px solid var(--line);padding:6px 8px;text-align:center}
table.cards td.qlbl{text-align:left;font-weight:400}
.cardcell label{display:inline-flex;align-items:center;gap:3px;margin:0 4px;font-size:.85rem}

/* ============================================================
   АДАПТИВ ДЛЯ МОБИЛЬНЫХ (выездной аудит с телефона)
   ============================================================ */
@media (max-width: 760px) {
  body { font-size: 15px; }

  /* Шапка: бренд сверху, меню — прокручиваемая строка под ним */
  .top { flex-direction: column; align-items: stretch; height: auto;
         padding: 10px 14px; gap: 8px; position: static; }
  .top .brand { font-size: 1rem; }
  .top .brand small { font-size: .65rem; }
  .top nav { gap: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch;
             padding-bottom: 4px; white-space: nowrap; }
  .top nav::-webkit-scrollbar { display: none; }
  .top .who { display: none; }            /* имя/роль скрываем ради места */

  .wrap { margin: 14px auto; padding: 0 12px; }
  h1 { font-size: 1.35rem; }
  h2 { font-size: 1.1rem; }
  .card { padding: 16px 14px; }

  /* Формы в одну колонку */
  .grid2 { grid-template-columns: 1fr; }

  /* Поля ввода 16px — чтобы iOS не зумил при фокусе */
  input[type=text], input[type=password], input[type=number],
  input[type=date], select, textarea { font-size: 16px; }

  /* Широкие таблицы → горизонтальная прокрутка */
  .card > table, table.cards {
    display: block; width: 100%; overflow-x: auto;
    -webkit-overflow-scrolling: touch; white-space: nowrap;
  }

  /* Чек-лист: варианты ответа — крупные плашки во всю ширину под палец */
  .optline { flex-direction: column; gap: 8px; }
  .opt { width: 100%; justify-content: flex-start; padding: 13px 14px;
         font-size: 1rem; border-radius: 8px; }
  .opt input[type=radio] { width: 20px; height: 20px; margin-right: 6px; }
  .qlbl { font-size: 1rem; margin-bottom: 8px; }
  .qrow { padding: 14px 0; }
  .bscore { display: inline-block; margin: 6px 0 0 0; }
  h2 .bscore { display: block; }

  /* Карты аудита: ячейки + / – крупнее */
  .cardcell label { margin: 0 2px; font-size: 1rem; padding: 2px; }
  .cardcell input[type=radio] { width: 18px; height: 18px; }

  /* Шапка: убираем подпись бренда, чтобы меню не налезало */
  .top .brand small { display: none; }

  /* Сводные плитки и итог-бар компактнее */
  .stats .stat { min-width: 120px; }
  .totalbar { gap: 14px; }
  .totalbar .blk .v { font-size: 1.35rem; }

  /* Карточки регионов и галерея — в один столбец на узких экранах */
  .reggrid { grid-template-columns: 1fr 1fr; }
  .gallery { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }

  /* Кнопки удобнее тапать */
  .btn { padding: 11px 16px; }
  .btn.sm { padding: 7px 12px; }
}

@media (max-width: 420px) {
  .reggrid { grid-template-columns: 1fr; }
  .stats { gap: 10px; }
  .stats .stat { min-width: calc(50% - 5px); flex: 1 1 calc(50% - 5px); }
}

/* управление пользователями */
.linkbtn{background:none;border:none;color:var(--critical);cursor:pointer;font:inherit;font-size:.85rem;padding:0}
.linkbtn:hover{text-decoration:underline}
.regionsgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:4px 14px;
  border:1px solid var(--line);border-radius:8px;padding:12px;margin-top:4px}
.regionsgrid label.inline{margin:3px 0}

/* ============================ СОВРЕМЕННЫЙ ДАШБОРД ============================ */
.hero{background:linear-gradient(135deg,var(--teal) 0%,var(--teal-d) 100%);color:#fff;border-radius:14px;
  padding:24px 26px;margin-bottom:18px;display:flex;justify-content:space-between;align-items:center;
  gap:20px;flex-wrap:wrap;box-shadow:0 8px 24px rgba(14,92,92,.18)}
.hero h1{color:#fff;margin:0 0 4px}
.hero .sub{margin:0;opacity:.82;font-size:.92rem}
.hero-metrics{display:flex;gap:28px;flex-wrap:wrap}
.hm{display:flex;flex-direction:column}
.hm .hmv{font-family:"Spectral",serif;font-size:2rem;font-weight:800;line-height:1}
.hm .hml{font-size:.7rem;text-transform:uppercase;letter-spacing:.5px;opacity:.8;margin-top:5px}

.zonebar{display:flex;height:30px;border-radius:8px;overflow:hidden;background:#eef1f3;margin:8px 0 12px}
.zonebar i{display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.8rem}
.zonebar i.excellent{background:var(--excellent)} .zonebar i.stable{background:var(--stable)}
.zonebar i.risk{background:var(--risk)} .zonebar i.critical{background:var(--critical)}
.zlegend{display:flex;gap:18px;flex-wrap:wrap;font-size:.82rem;color:var(--muted)}

.ranklist{display:flex;flex-direction:column;gap:8px}
.rankrow{display:flex;align-items:center;gap:14px;padding:12px 15px;border:1px solid var(--line);
  border-radius:10px;background:#fff;border-left:4px solid var(--line);transition:box-shadow .12s,transform .12s}
a.rankrow:hover{text-decoration:none;box-shadow:var(--shadow);transform:translateY(-1px)}
.rankrow.excellent{border-left-color:var(--excellent)} .rankrow.stable{border-left-color:var(--stable)}
.rankrow.risk{border-left-color:var(--risk)} .rankrow.critical{border-left-color:var(--critical)}
.rankno{flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:var(--teal-l);color:var(--teal-d);
  font-weight:800;display:flex;align-items:center;justify-content:center;font-size:.9rem}
.rankmain{flex:1 1 170px;min-width:0}
.rankname{font-weight:700;color:var(--ink);font-family:"Spectral",serif}
.rankmeta{font-size:.78rem;color:var(--muted)}
.rankbarwrap{flex:1 1 160px;min-width:90px}
.rankbar{height:9px;background:#eef1f3;border-radius:5px;overflow:hidden}
.rankbar i{display:block;height:100%}
.rankval{flex:0 0 auto;text-align:right;min-width:100px}
.rankval b{font-size:1.15rem;font-family:"Spectral",serif}
.rankval .rankzone{display:block;font-size:.7rem;font-weight:700;letter-spacing:.3px}
.rankrow.noeval{opacity:.65} .rankrow.noeval .rankno{background:#eef1f3;color:var(--muted)}

.satbar{display:flex;height:14px;border-radius:7px;overflow:hidden;background:#eef1f3;margin:8px 0}
.satbar i.hi{background:var(--excellent)} .satbar i.mid{background:var(--risk)} .satbar i.lo{background:var(--critical)}
.emptybox{text-align:center;padding:34px 20px;color:var(--muted)}
.emptybox .big{font-size:2.2rem;margin-bottom:6px}

@media (max-width:760px){
  .hero{flex-direction:column;align-items:flex-start}
  .hero-metrics{gap:20px}
  .rankbarwrap{display:none}
  .rankval{min-width:78px}
}
