/* PravoGO 2.0 — refined-слой Навигатора (дизайн «first-design», 22.07.2026).
   Накладывается поверх nav.css; вся логика — в nav-refined.js. */
/* Слой не заводит свою палитру: раньше здесь дублировались navy/line/bg/orange,
   которые уже есть в nav.css. Оставлены только те токены, которых в системе нет. */
:root{--ref-muted:#687487;--ref-line:#dce3eb;--ref-bg:#f4f7fa;--ref-orange-soft:#fff0e7}
body{background:var(--ref-bg)}
.vtag{display:none!important}
.v2head{padding:23px 0 27px;background:#17345d}
.v2head .crumbs{margin-bottom:17px;font-size:12.5px}
.v2hero-grid{grid-template-columns:minmax(0,1fr) 340px;gap:52px;align-items:center}
.v2head h1{max-width:760px;margin-top:9px;font-size:35px;line-height:1.12;letter-spacing:0}
.v2head .rk{font-size:12px;letter-spacing:0}
.mission{max-width:none;margin:0;padding:14px 16px;border-radius:var(--r-sm);background:rgba(255,255,255,.075);font-size:12.5px;line-height:1.5}
.refined-hero-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.refined-hero-meta span{display:inline-flex;align-items:center;min-height:29px;padding:5px 10px;border:1px solid rgba(255,255,255,.15);border-radius:var(--r-xs);background:rgba(255,255,255,.06);color:rgba(255,255,255,.78);font-size:11.5px;font-weight:650}
.refined-hero-meta span::before{content:"";width:5px;height:5px;margin-right:7px;border-radius:50%;background:#f0a875}
.v2tabs-wrap{top:var(--header-h);background:rgba(255,255,255,.97);box-shadow:0 5px 18px rgba(19,41,76,.07)}
body.header-hidden .v2tabs-wrap{top:0}
/* Вкладки — стиль эталона (nav.css): цветная плитка иконки, активная вкладка залита
   своим цветом. Вкладок бывает от 2 до 5, поэтому карточки не растягиваем на всю
   строку, а держим одинаковой ширины и прижимаем влево. */
.v2tabs{grid-template-columns:repeat(auto-fit,minmax(186px,214px));justify-content:start;gap:9px;padding:11px 24px}
.v2layout{grid-template-columns:minmax(0,1fr) 220px;gap:38px;padding:0 24px}
.v2body-wrap{padding:28px 0 84px}
.doc-panel{overflow:hidden!important;border:1px solid var(--ref-line)!important;border-radius:var(--r);background:#fff!important;box-shadow:0 12px 34px rgba(19,41,76,.075)!important}
.doc-host{min-height:700px;border-radius:0!important;background:#fff}
.v2rail{top:calc(var(--header-h) + var(--tabs-h) + 14px);margin-top:28px;padding:0 0 18px;border-bottom:1px solid var(--ref-line)}
body.header-hidden .v2rail{top:calc(var(--tabs-h) + 14px)}
.refined-rail-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.refined-rail-top b{color:var(--navy);font-size:11px;text-transform:uppercase}
.refined-rail-count{color:var(--ref-muted);font-size:11px;font-variant-numeric:tabular-nums}
.v2rail-track{left:7px;top:var(--ref-rail-start,34px);bottom:auto;height:var(--ref-rail-distance,0px);overflow:visible}
.v2rail-track i{height:var(--ref-rail-fill,0px);transition:none}
.v2rail nav{gap:2px}
.v2rail a{min-height:34px;padding:6px 0;color:#687487;font-size:12px;line-height:1.3}
/* длинную подпись обрезаем по второй строке и по границе слова, а не по символу.
   .t — обычный span, поэтому его надо явно вывести из-под правила точки-маркера
   `.v2rail a>span` (иначе подпись превращается во второй кружок). */
.v2rail a>span.t{width:auto;height:auto;margin:0;border:0;border-radius:0;background:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:break-word}
.v2rail a[hidden]{display:none!important}
.v2rail a>span:not(.t){width:8px;height:8px;margin-left:4px;background:var(--ref-bg);transition:none}
.v2rail a.on{color:var(--navy);font-weight:650}
.v2rail a.on>span:not(.t){width:8px;height:8px;margin-left:4px}
.refined-source-note{display:flex;align-items:flex-start;gap:8px;margin-top:15px;padding-top:13px;border-top:1px solid var(--ref-line);color:#7b8695;font-size:10.5px;line-height:1.45}
.refined-source-note svg{width:15px;height:15px;flex:none;color:#279176}
.v2rail.refined-rail-off{display:none}
/* на вкладках без документа прогресс ведёт сам nav.js — возвращаем ему полоску */
.v2rail.refined-rail-plain .v2rail-track{top:43px;bottom:18px;height:auto}
.v2rail.refined-rail-plain .v2rail-track i{height:var(--rail-progress)}
.v2layout.refined-no-rail{grid-template-columns:minmax(0,880px);justify-content:center}
.refined-mobile-outline{display:none;border-radius:var(--r-sm)}
.v2body-wrap>.related{margin-top:26px}
.v2body-wrap .panel:not(.doc-panel),.workcheck{border-radius:var(--r)}
.mode-mission{max-width:none}
@media(max-width:1080px){
  .v2layout{max-width:900px}
  .v2body-wrap{max-width:none}
  .refined-mobile-outline{display:block;margin:0 0 12px;border:1px solid var(--ref-line);border-radius:8px;background:#fff}
  .refined-mobile-outline summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;padding:10px 13px;color:var(--navy);font-size:12.5px;font-weight:750;cursor:pointer;list-style:none}
  .refined-mobile-outline summary::-webkit-details-marker{display:none}
  .refined-mobile-outline summary span{color:var(--ref-muted);font-size:11px;font-weight:650}
  .refined-mobile-outline nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;padding:0 8px 9px}
  .refined-mobile-outline a{padding:8px 9px;border-top:1px solid #edf0f4;color:var(--ref-muted);font-size:12px;line-height:1.3}
  .refined-mobile-outline a.on{color:var(--acc);font-weight:750}
}
@media(max-width:760px){
  :root{--tabs-h:70px}
  .v2hero-grid{grid-template-columns:1fr;gap:14px}
  .v2head{padding:18px 0 20px}
  .v2head h1{font-size:27px}
  .mission{padding:11px 13px}
  .refined-hero-meta{margin-top:14px;gap:6px}
  .refined-hero-meta span{min-height:27px;padding:4px 8px;font-size:10.5px}
  .v2tabs{grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:4px;padding:6px 16px}
  .v2layout{padding:0 16px}
  .v2body-wrap{padding:18px 0 58px}
  .refined-mobile-outline nav{grid-template-columns:1fr}
}
@media(max-width:430px){
  .mission{display:none}
}