/* =====================================================================
   Атлас ХПП (НИР) — «раскрашенный от руки лист сельскохозяйственного
   атласа»: гравюрные линии железо-галловыми чернилами по тёплой бумаге
   и прозрачная акварель хмелевой зелени, охры и киновари.

   Редакция «просто и понятно»: один экран — одна мысль; каждое число
   показано в одном месте; одна легенда; рамки — только у карточки
   региона и результата калькулятора; курсив — только для цитат НИР,
   латыни и ссылок-действий; подписи с данными — не мельче 15 px.

   Цвет по смыслу (единое правило):
     зелёный хмелевой — тонны, хмель, производство;
     киноварь — деньги и торговля (больше нигде);
     охра — «на это сейчас смотрят» (выбор);
     чернила — структура и текст.
===================================================================== */

/* ---------------- 1. Токены ---------------- */
:root{
  --paper:#F4ECD9; --paper-2:#ECE1C8; --paper-3:#E3D5B6; --paper-card:#FAF5E8;
  --ink:#33281D; --ink-2:#5A4A38; --ink-3:#6E5C46;
  --rule:rgba(51,40,29,.28); --rule-strong:rgba(51,40,29,.6);
  --hop:#56742A; --hop-ink:#465F21; --hop-wash:#B9C67F; --hop-pale:#DFE3B8;
  --sage:#CBD39B; --sage-edge:#8F9F55;
  --vermilion:#A8402A; --vermilion-ink:#93361F;
  --ochre:#C8953F; --ochre-wash:rgba(200,149,63,.32); --ochre-ink:#85591A;
  --on-dark:#FBF6EA;

  --f-display:"Old Standard TT","Times New Roman",serif;
  --f-text:"PT Serif",Georgia,"Times New Roman",serif;

  /* шкала текста — 6 ступеней */
  --t-display:clamp(32px,2.8vw,42px);
  --t-h2:clamp(28px,2.5vw,38px);
  --t-h3:clamp(21px,1.6vw,24px);
  --t-fig:clamp(26px,2.1vw,31px);
  --t-body:17px;
  --t-small:15px;

  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;
  --pad:clamp(20px,4.4vw,64px);
  --gutter:40px;
  --maxw:1320px;
  --head:64px;
  --shadow:0 1px 0 rgba(51,40,29,.15),0 10px 24px -14px rgba(51,40,29,.35);
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------------- 2. Основа ---------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--head) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{
  margin:0;color:var(--ink);background-color:var(--paper);
  font:400 var(--t-body)/1.6 var(--f-text);
  font-variant-numeric:lining-nums;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
  /* бумага: тонкое волокно + крупные «пятна времени»; текстура ≤ 6 % по светлоте */
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .32  0 0 0 0 .23  0 0 0 0 .11  0 0 0 .1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='900' height='900'><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='.005' numOctaves='3' seed='7' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .55  0 0 0 0 .42  0 0 0 0 .2  0 0 0 .2 -.07'/></filter><rect width='100%' height='100%' filter='url(%23m)'/></svg>");
}
/* неподвижная виньетка листа по краям */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:60;
  background:radial-gradient(ellipse 88% 78% at 50% 46%,transparent 62%,rgba(110,78,36,.12) 100%);
}
@supports (overflow:clip){body{overflow-x:clip}}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:400}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
a,button,input,label,summary{touch-action:manipulation;-webkit-tap-highlight-color:rgba(200,149,63,.25)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 3px var(--paper-card);border-radius:1px}
::selection{background:var(--hop-pale);color:var(--ink)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;background:var(--ink);color:var(--on-dark);text-decoration:none;font-size:15px}
.skip:focus{top:12px}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.num,.tnum{font-variant-numeric:lining-nums tabular-nums}
.u{font-family:var(--f-text);font-style:normal}
.nw{white-space:nowrap}
.print-shot,.print-cap{display:none}
.noscript{max-width:680px;margin:24px auto;padding:16px;border:1px solid var(--rule-strong);background:var(--paper-card)}
/* что показать в зависимости от ширины: рядом со списком глобус есть только от 1024 px */
.on-narrow{display:none}
/* плашка «Атлас открылся не полностью» (ошибка в файле данных или нет файла библиотеки) */
.fatal{position:relative;z-index:40;max-width:calc(var(--maxw) + 2 * var(--pad));margin:16px auto 0;padding:14px var(--pad) 12px;background:#F8E5DC;border-top:3px solid var(--vermilion);border-bottom:1px solid var(--vermilion);color:var(--ink);font-size:16px;line-height:1.5}
.fatal p{margin:0 0 .4em}
.fatal__k{font:700 15px/1.3 var(--f-text);color:var(--vermilion-ink)}
.fatal__k::before{content:"\26A0\FE0E  "}
.fatal code{font:15px/1.3 ui-monospace,Menlo,Consolas,monospace;background:rgba(255,255,255,.6);padding:0 4px;border-radius:2px}

/* типографические стили */
.display{font:400 var(--t-display)/1.08 var(--f-display);letter-spacing:-.01em;text-wrap:balance;font-variant-numeric:lining-nums proportional-nums}
.lead{font-size:clamp(17px,1.25vw,18.5px);line-height:1.55;color:var(--ink-2);max-width:44em;text-wrap:pretty}
/* знак «рассчитано по данным атласа» и сноска к нему */
.fn{font:400 .8em/0 var(--f-text);color:var(--ink-3);vertical-align:.45em;margin-left:1px;cursor:help}
.footnote{margin:var(--s-4) 0 0;font:400 var(--t-small)/1.45 var(--f-text);color:var(--ink-2)}
/* дословная формулировка НИР: зелёная линейка слева, курсив */
.quote{margin:0;padding:2px 0 2px 16px;border-left:2px solid var(--hop);font:italic 18px/1.5 var(--f-text);color:var(--ink);text-wrap:pretty}
.quote--sm{font-size:16px}
/* подпись к таблице или графику — обычным шрифтом, со строчной, без разрядки */
.chart__cap{display:block;margin:0 0 var(--s-3);padding:0;caption-side:top;text-align:left;font:400 19px/1.3 var(--f-display);color:var(--ink)}

/* ---------------- 3. Кнопки и ссылки ---------------- */
.btn{
  appearance:none;border:0;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;padding:0 22px;border-radius:2px;text-decoration:none;
  font:400 16px/1.1 var(--f-text);transition:background-color .15s var(--ease),color .15s,transform .1s;
}
.btn .ic{width:15px;height:15px;flex:none;transition:transform .15s var(--ease)}
.btn--primary{background:var(--hop);color:var(--on-dark);box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.btn--primary:hover{background:var(--hop-ink)}
.btn--secondary{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink-2)}
.btn--secondary:hover{background:rgba(51,40,29,.06)}
.btn:hover .ic{transform:translateY(1px)}
.btn--secondary:hover .ic{transform:translateX(2px)}
.btn:active{transform:translateY(1px)}
.btn--sm{min-height:44px;padding:0 16px;font-size:15px}
.link-act{font:italic 400 1.02em var(--f-display);color:var(--ink);text-decoration:underline dotted 1.4px;text-underline-offset:4px;white-space:nowrap}
.link-act span{display:inline-block;transition:transform .15s var(--ease)}
.link-act:hover span{transform:translateX(3px)}
.link-act:hover{color:var(--hop-ink)}
button.link-act{appearance:none;border:0;background:none;padding:6px 0;min-height:40px;cursor:pointer;border-radius:2px}
.icon-btn{appearance:none;display:inline-grid;place-items:center;width:40px;height:40px;padding:0;border:0;background:none;color:var(--ink-2);border-radius:2px;transition:background-color .15s,color .15s}
.icon-btn:hover{background:rgba(51,40,29,.07);color:var(--ink)}
.icon-btn svg{width:14px;height:14px}

/* сегменты */
.seg{display:inline-flex;border:1px solid var(--ink-2);background:var(--paper-card);border-radius:2px}
.seg button{
  appearance:none;position:relative;border:0;background:none;min-height:44px;padding:0 16px;
  font:400 16px/1 var(--f-text);color:var(--ink-2);transition:background-color .15s,color .15s;
}
.seg button+button{border-left:1px solid var(--rule)}
.seg button:hover{background:var(--hop-pale);color:var(--ink)}
.seg button[aria-pressed="true"],.seg button[aria-checked="true"]{background:var(--ink);color:var(--on-dark)}
.seg button[aria-pressed="true"]::after,.seg button[aria-checked="true"]::after{
  content:"";position:absolute;left:50%;bottom:-6px;width:0;height:0;transform:translateX(-50%);
  border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--ink);
}
.seg button:focus-visible{z-index:1}

/* ---------------- 4. Шапка и оглавление ---------------- */
.masthead{position:sticky;top:0;z-index:50;height:var(--head);background:rgba(244,236,217,.92);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.masthead::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:4px;border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule);pointer-events:none}
/* поля шапки чуть уже полей листа: так строка оглавления целиком помещается от 1440 px */
.masthead__in{height:100%;max-width:calc(var(--maxw) + 2 * var(--pad));margin:0 auto;padding:0 min(var(--pad),40px);display:flex;align-items:center;gap:var(--s-5)}
.brand{display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none;flex:none}
.brand__seal{width:40px;height:40px;flex:none}
.brand__seal svg{width:100%;height:100%}
.brand__text{display:flex;flex-direction:column;min-width:0}
.brand b{font:400 19px/1.15 var(--f-display);letter-spacing:.01em;white-space:nowrap}
.brand b i{font-style:italic}
/* текущий раздел под названием — только когда оглавление свёрнуто в кнопку
   (в строке оглавления текущий пункт и так подчёркнут) */
.brand__sheet{display:none;font:400 14px/1.3 var(--f-text);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .2s}
.is-compact .brand__sheet{display:block}
.toc{margin-left:auto;position:relative}
.toc__btn{display:none}
.toc__title{display:none}
.toc__list{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.toc__list a{display:flex;align-items:baseline;gap:5px;padding:9px 7px;text-decoration:none;font-size:15px;line-height:1.2;color:var(--ink-2);white-space:nowrap;border-radius:2px;transition:background-color .15s,color .15s;position:relative}
.toc__list a i{font:italic 400 14.5px var(--f-display);color:var(--ink-3)}
.toc__list a:hover{background:var(--hop-pale);color:var(--ink)}
.toc__list a[aria-current="true"]{color:var(--ink)}
.toc__list a[aria-current="true"]::after{content:"";position:absolute;left:8px;right:8px;bottom:3px;height:2px;background:var(--hop-ink)}
.toc__lead{display:none}
.toc__leaf{display:inline-block;width:11px;height:13px;transform:translateY(1px)}
.toc__leaf svg{width:100%;height:100%;color:var(--ink-3)}

/* ---------------- 5. Разворот листа I: титул слева, глобус справа ---------------- */
.spread,.sheet,.sheet-rule{max-width:calc(var(--maxw) + 2 * var(--pad));margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.spread{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);column-gap:var(--gutter);
  grid-template-areas:"hero stage" "work stage";
  position:relative;
}
.hero{grid-area:hero;min-height:calc(100svh - var(--head));display:flex;flex-direction:column;justify-content:center;gap:var(--s-5);padding:var(--s-6) 0}
.stage-col{grid-area:stage;position:sticky;top:var(--head);height:calc(100svh - var(--head));min-height:560px;display:flex;flex-direction:column;align-self:start;z-index:2}
.workbench{grid-area:work;padding:var(--s-8) 0 var(--s-7)}

/* картуш титульного листа: двойная рамка — и больше ничего */
.cartouche{position:relative;padding:34px 34px 26px;background:linear-gradient(rgba(250,245,232,.55),rgba(250,245,232,.3))}
.cartouche::before,.cartouche::after{content:"";position:absolute;pointer-events:none}
.cartouche::before{inset:0;border:1.5px solid var(--ink)}
.cartouche::after{inset:5px;border:.75px solid var(--ink)}
.wash{position:relative;display:inline-block;font-style:italic;color:var(--hop-ink);z-index:0}
.wash__stroke{position:absolute;left:-4%;top:30%;width:108%;height:70%;z-index:-1;overflow:visible}
.nir{margin:var(--s-4) 0 0;font-size:16.5px;line-height:1.55;color:var(--ink-2);text-wrap:pretty}
.nir b{color:var(--ink);font-weight:700}
.nir__short{display:none}

/* ведомость главных цифр: строки с отточиями */
.ledger{margin:0;padding:var(--s-2) 0 0;border-top:1.5px solid var(--ink);position:relative}
.ledger::before{content:"";position:absolute;left:0;right:0;top:3px;border-top:.75px solid var(--ink)}
.ledger__row{display:flex;align-items:baseline;gap:10px;padding:8px 0 7px}
.ledger dt{flex:none;max-width:60%;font-size:17px;line-height:1.3;color:var(--ink-2)}
.ledger__row::after{content:"";order:1;flex:1;min-width:20px;border-bottom:1.5px dotted rgba(51,40,29,.45);transform:translateY(-6px)}
.ledger dd{order:2;margin:0;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:baseline;gap:0 6px;white-space:nowrap;text-align:right}
.ledger__v{font:400 var(--t-fig)/1 var(--f-display);color:var(--ink);font-variant-numeric:lining-nums proportional-nums}
.ledger dd .u{font-size:15px;color:var(--ink-3)}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px}

/* ---------------- 6. Сцена глобуса ---------------- */
.stage{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;padding:14px 0 10px}
.stage__bar{flex:none;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;position:relative;z-index:5}
.stage__lbl{font:400 16px var(--f-text);color:var(--ink-2)}
.globe-box{position:relative;flex:1;min-height:0;margin-top:8px}
.globe-wash{position:absolute;left:50%;top:50%;width:min(100%,100vh);height:min(100%,100vh);transform:translate(-50%,-50%);pointer-events:none;z-index:0;overflow:visible}
.globe-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;cursor:grab;touch-action:pan-y;outline:none;-webkit-tap-highlight-color:transparent}
.globe-canvas.is-pointing{cursor:pointer}
.globe-canvas.is-dragging{cursor:grabbing}
.globe-canvas:focus-visible{box-shadow:none}
.globe-ring{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible}
.globe-ring .ring-focus{opacity:0;transition:opacity .15s}
.globe-canvas:focus-visible + .globe-ring .ring-focus{opacity:1}
.globe-ring .vine-main{stroke-dasharray:1;stroke-dashoffset:0;animation:vine-draw .9s .2s var(--ease) both}
.globe-ring .vi{animation:fade-in .5s both;animation-delay:calc(.35s + var(--i) * 55ms)}
.globe-ring.is-drawn .vine-main,.globe-ring.is-drawn .vi{animation:none}
@keyframes vine-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
/* подсказка по клавишам — видна, только пока глобус в фокусе клавиатуры */
.globe-kbd{display:none;position:absolute;left:50%;top:2px;transform:translateX(-50%);z-index:4;width:max-content;max-width:calc(100% - 40px);margin:0;padding:5px 11px 6px;background:rgba(250,245,232,.96);border:1px solid var(--ink-2);box-shadow:var(--shadow);font:14px/1.4 var(--f-text);color:var(--ink);text-align:center;pointer-events:none}
.globe-kbd b{font-weight:700;white-space:nowrap}
.globe-canvas:focus-visible ~ .globe-kbd{display:block}

/* строка-вывод под глобусом: одна мысль для текущего вида */
.view-cap{flex:none;min-height:calc(2 * 1.45em);margin:8px auto 0;max-width:40em;font:400 16.5px/1.45 var(--f-text);color:var(--ink-2);text-align:center;text-wrap:balance}
.view-cap b{font-weight:700;color:var(--ink)}
.hint--touch{display:none}
@media (pointer:coarse){.hint--mouse{display:none}.hint--touch{display:inline}}

/* легенда — одна, строкой под глобусом */
.legend-line{flex:none;list-style:none;margin:6px 0 0;padding:8px 0 0;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;justify-content:center;gap:4px 28px}
.legend-line li{display:flex;align-items:center;gap:8px;font-size:16px;line-height:1.3;color:var(--ink-2);min-width:0}
.legend-line li[hidden]{display:none}
/* на широком экране место под второй строкой легенды оставлено заранее: глобус не «прыгает»,
   когда в виде «США» появляется знак пунктира */
@media (min-width:1024px){.legend-line{min-height:66px;align-content:flex-start}}
.legend-line__ic{flex:none;width:26px;height:26px;display:grid;place-items:center}
.legend-line__ic svg{width:100%;height:100%}
.ruler{display:inline-flex;align-items:flex-end;gap:5px;height:28px;margin-left:4px;padding-left:9px;border-left:1px dotted var(--rule-strong)}
.ruler i{display:block;width:5px;height:20px;background:var(--hop);box-shadow:inset 0 0 0 1px rgba(51,40,29,.35);transition:height .4s var(--ease)}
.ruler em{font:400 15px/1 var(--f-text);font-style:normal;color:var(--ink-2);white-space:nowrap;font-variant-numeric:lining-nums}

/* ---------------- 7. Карточка региона ---------------- */
.rcard{
  position:absolute;right:0;bottom:calc(8px - var(--below-h,0px));z-index:7;width:300px;max-height:calc(100% - 8px + var(--below-h,0px));overflow:auto;
  background:var(--paper-card);border:1px solid var(--ink);box-shadow:var(--shadow);padding:14px 18px 10px;
  animation:card-in .22s var(--ease) both;overscroll-behavior:contain;
}
.rcard::before{content:"";position:absolute;inset:3px;border:.75px solid var(--rule-strong);pointer-events:none}
.rcard[hidden]{display:none}
@keyframes card-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.rcard__top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:-4px -8px 0 0}
.rcard__c{margin:0;font:400 15px/1.3 var(--f-text);color:var(--ink-3)}
.rcard h3{font:400 clamp(22px,1.8vw,26px)/1.15 var(--f-display);color:var(--ink);outline:none;text-wrap:balance}
.rcard h3:focus-visible{outline:2px dotted var(--ochre-ink);outline-offset:3px}
.rcard__v{margin:8px 0 0;display:flex;align-items:baseline;gap:7px;font:400 clamp(32px,2.8vw,40px)/1 var(--f-display);color:var(--ink)}
.rcard__v .u{font-size:17px;color:var(--ink-2)}
.rcard__s{margin:6px 0 0;font-size:15px;line-height:1.4;color:var(--ink-2)}
.rcard .quote{margin-top:12px}
.rcard__nav{display:flex;justify-content:space-between;gap:8px;margin-top:10px;padding-top:4px;border-top:.75px solid var(--rule)}
.rcard__nav button{appearance:none;border:0;background:none;min-height:40px;padding:4px 2px;font:italic 16px/1.2 var(--f-display);color:var(--ink-2);text-align:left;border-radius:2px}
.rcard__nav button:last-child{text-align:right}
.rcard__nav button:hover{color:var(--hop-ink)}
.rcard__nav button[disabled]{visibility:hidden}
.rcard__x{flex:none}
.rcard__back{margin:8px 0 0}
.rcard__back .link-act{white-space:normal;text-align:left}

/* ---------------- 8. Листы (разделы): шапка, отступы, разделители ---------------- */
/* переход по оглавлению: заголовок листа встаёт чуть ниже шапки (отступ над листом не прокручивается впустую) */
.sheet{padding-top:var(--s-8);padding-bottom:var(--s-2);scroll-margin-top:calc(16px - var(--s-8))}
.sheet-head{margin-bottom:var(--s-6)}
.sheet-head__h{font:400 var(--t-h2)/1.12 var(--f-display);text-wrap:balance;max-width:26em}
/* номер листа — тихой римской цифрой перед заголовком, как в оглавлении */
.sheet-n{display:inline-block;margin-right:.45em;font-style:italic;font-size:.62em;color:var(--ink-3);vertical-align:.12em}
.sheet-head .lead{margin:var(--s-3) 0 0}
.sheet-head--act{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:var(--s-4) var(--s-6)}
.sheet-rule{height:1px;margin-top:var(--s-7);position:relative}
.sheet-rule::before{content:"";position:absolute;left:var(--pad);right:var(--pad);top:0;height:4px;border-top:1px solid var(--rule-strong);border-bottom:.5px solid var(--rule)}
.sheet-rule--cone{display:flex;justify-content:center}
.sheet-rule--cone span{position:relative;top:-12px;width:110px;height:26px;padding:0 7px;background:var(--paper);z-index:1}
.sheet-rule--cone span svg{width:96px;height:26px}

/* ---------------- 9. Лист I · регионы по объёму + топ-6 ---------------- */
.workbench .sheet-head__h{font-size:clamp(27px,2.2vw,34px)}
.rlist{list-style:none;margin:0;padding:0}
.rlist button{
  appearance:none;width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:baseline;column-gap:10px;
  min-height:44px;padding:8px 6px 12px 2px;border:0;background:none;text-align:left;position:relative;border-radius:2px;
  transition:background-color .15s;
}
.rlist button .badge{align-self:center}
.rlist .nm{font-size:17px;line-height:1.3;color:var(--ink);min-width:0}
.rlist .nm small{margin-left:.45em;font:400 15px var(--f-text);color:var(--ink-3);white-space:nowrap}
.rlist .v{font:400 17px var(--f-text);color:var(--hop-ink);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.rlist .bar{position:absolute;left:40px;right:6px;bottom:4px;height:4px}
.rlist .bar i{display:block;height:100%;background:var(--hop-wash);box-shadow:inset 0 -1px 0 rgba(86,116,42,.5)}
.rlist button:hover,.rlist button.is-hot{background:var(--hop-pale)}
.rlist button[aria-pressed="true"]{background:var(--ochre-wash)}
.badge{display:inline-grid;place-items:center;width:24px;height:24px;border:1px solid var(--ink);border-radius:50%;background:var(--paper-card);font:700 13px/1 var(--f-text);color:var(--ink);font-variant-numeric:lining-nums}
[aria-pressed="true"] > .badge{background:var(--ink);color:var(--on-dark)}
.rlist__sum{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:6px 0 0;padding:10px 6px 0 2px;border-top:1.5px solid var(--ink);font-size:17px;color:var(--ink-2)}
.rlist__sum b{font:400 22px/1 var(--f-display);color:var(--ink);font-variant-numeric:lining-nums}
.chart{margin:var(--s-7) 0 0}
/* бар, ось и нулевая линия — в одной системе координат: ширина бара — доля
   от ширины дорожки (как и деления оси); подпись значения стоит за концом бара
   в зарезервированном справа поле и не сжимает бар */
.top6{position:relative;--c1:100px;--gap:12px;--lab:100px;--row-pad:4px}
.top6 .row{appearance:none;width:100%;display:grid;grid-template-columns:var(--c1) minmax(0,1fr);align-items:center;gap:var(--gap);min-height:40px;padding:5px var(--row-pad);border:0;background:none;text-align:left;border-radius:2px;transition:background-color .15s}
.top6 .row:hover{background:var(--hop-pale)}
.top6 .row[aria-pressed="true"]{background:var(--ochre-wash)}
.top6 .ctry{font-size:17px;color:var(--ink)}
.top6 .track{position:relative;height:24px;margin-right:var(--lab)}
.top6 .bar{position:absolute;left:0;top:3px;height:18px;border:.75px solid var(--hop-ink);border-left:0;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><rect width='5' height='5' fill='%23B9C67F'/><path d='M-1 6 6 -1' stroke='%2356742A' stroke-width='1'/></svg>");transform-origin:left;transition:transform .6s var(--ease)}
.top6 .val{position:absolute;top:50%;transform:translateY(-50%);margin-left:8px;font:400 17px var(--f-text);color:var(--ink);white-space:nowrap;font-variant-numeric:lining-nums;transition:opacity .3s .45s}
.top6 .val .u{font-size:15px;color:var(--ink-3)}
.top6 .axis-row{display:grid;grid-template-columns:var(--c1) minmax(0,1fr);gap:var(--gap);padding:0 var(--row-pad)}
.top6 .axis{position:relative;margin-right:var(--lab);height:22px;border-top:1px solid var(--ink-2)}
.top6 .axis span{position:absolute;top:3px;transform:translateX(-50%);font-size:15px;color:var(--ink-3);font-variant-numeric:lining-nums tabular-nums}
.top6::before{content:"";position:absolute;left:calc(var(--row-pad) + var(--c1) + var(--gap));top:0;bottom:22px;border-left:1px solid var(--ink-2);pointer-events:none}
.is-pre .top6 .bar{transform:scaleX(0)}
.is-pre .top6 .val{opacity:0;transition:none}
/* свёрнутое примечание к данным */
.datanote{margin:var(--s-3) 0 0;font-size:var(--t-small);line-height:1.5;color:var(--ink-2)}
.datanote summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;list-style:none;font:italic 16px var(--f-display);color:var(--ink);text-decoration:underline dotted 1.3px;text-underline-offset:4px}
.datanote summary::-webkit-details-marker{display:none}
.datanote summary::before{content:"";width:0;height:0;border-left:6px solid var(--ink-2);border-top:4.5px solid transparent;border-bottom:4.5px solid transparent;transition:transform .15s}
.datanote[open] summary::before{transform:rotate(90deg)}
.datanote summary:hover{color:var(--hop-ink)}
.datanote p{margin:4px 0 0;max-width:42em}

/* ---------------- 10. Лист II · торговые потоки ---------------- */
.trade{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:var(--gutter);align-items:start}
.plate{margin:0}
.plate__frame{position:relative;aspect-ratio:16/10;border:1.5px solid var(--ink);padding:16px;background:var(--paper-2)}
.plate__frame::before{content:"";position:absolute;inset:4px;border:.75px solid var(--ink);pointer-events:none;z-index:2}
.plate__canvas{position:absolute;inset:14px;width:calc(100% - 28px);height:calc(100% - 28px)}
.plate__inset{position:absolute;right:28px;bottom:28px;width:30%;aspect-ratio:1/0.82;z-index:3;background:var(--paper-card);border:1px solid var(--ink);box-shadow:0 0 0 3px var(--paper-card),0 0 0 3.75px var(--ink)}
.plate__inset-canvas{width:100%;height:100%}
.plate__inset-cap{position:absolute;right:-4px;bottom:100%;margin:0 0 7px;padding:2px 8px;background:rgba(250,245,232,.94);border:.75px solid var(--rule-strong);font:400 14px/1.25 var(--f-text);color:var(--ink-2);white-space:nowrap}
.plate__legend{display:flex;gap:10px;align-items:center;margin-top:var(--s-3);font-size:var(--t-small);line-height:1.45;color:var(--ink-2)}
.trade__side{padding-top:4px}
.trade__text{margin:var(--s-5) 0 0;font-size:17px;line-height:1.55;color:var(--ink-2)}
.trade__text b{color:var(--ink);font-weight:700}
.money{color:var(--vermilion-ink);white-space:nowrap}

/* таблицы */
.tbl{width:100%;border-collapse:collapse;font-size:16.5px;line-height:1.45}
.tbl caption{caption-side:top;text-align:left;padding:0 0 var(--s-3);font:400 19px/1.3 var(--f-display);color:var(--ink)}
.tbl thead th{text-align:left;font:400 14px/1.3 var(--f-text);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--paper-2);padding:10px 12px 9px;border-top:3px double var(--rule-strong);border-bottom:1px solid var(--ink-2)}
.tbl td,.tbl tbody th{padding:12px;border-bottom:.75px solid var(--rule);vertical-align:top;text-align:left}
.tbl .num{text-align:right;font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.tbl tbody tr{transition:background-color .15s}
.tbl tbody tr:hover{background:rgba(223,227,184,.5)}
.tbl tbody tr.is-sel{background:var(--ochre-wash)}
.tbl--flows{table-layout:fixed}
.tbl--flows th:nth-child(1){width:46%}
.tbl--flows th:nth-child(2){width:26%}
.tbl--flows td{vertical-align:middle}
.tbl--flows .route{white-space:nowrap}
.tbl--flows .m{color:var(--vermilion-ink);font-size:18px}
.tbl--flows .barc{padding-left:4px}
.tbl--flows .bar{display:block;height:12px;border:.75px solid var(--vermilion);background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='4'><rect width='4' height='4' fill='%23F1D9CE'/><path d='M-1 5 5 -1' stroke='%23A8402A' stroke-width='1'/></svg>")}
.tbl--flows tbody tr:focus-visible{outline-offset:-2px}

/* ---------------- 11. Лист III · хмелепродукты ---------------- */
.products{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,3fr);gap:var(--gutter);align-items:center}
.products__main{min-width:0}
.ptable{width:100%;border-collapse:collapse}
.ptable caption{display:table-caption;caption-side:top}
.ptable thead th{padding:0 8px 8px;text-align:left;font:400 16px/1.2 var(--f-text);color:var(--ink-2);border-bottom:1px solid var(--ink-2)}
.ptable tbody th{width:22%;padding:14px 12px 14px 0;text-align:left;font:400 18px/1.2 var(--f-text);color:var(--ink);border-bottom:.75px solid var(--rule)}
.ptable__c{padding:14px 8px;border-bottom:.75px solid var(--rule)}
.ptable__cell{display:flex;align-items:center;gap:10px}
.ptable__track{flex:1;min-width:0;height:20px;background:rgba(51,40,29,.06);box-shadow:inset 0 0 0 .75px var(--rule)}
.ptable__track i{display:block;height:100%;border-right:.75px solid var(--hop-ink);background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><rect width='5' height='5' fill='%23B9C67F'/><path d='M-1 6 6 -1' stroke='%2356742A' stroke-width='1'/></svg>");transform-origin:left;transition:transform .6s var(--ease)}
.ptable__track i[style*="width:0%"]{border-right:0}
.ptable__v{flex:none;width:3.4em;font:400 19px/1 var(--f-display);color:var(--ink);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.ptable.is-pre .ptable__track i{transform:scaleX(0)}
.products .quote{margin-top:var(--s-5)}
.herbarium{margin:0;justify-self:center;width:100%;max-width:280px}
.herbarium__sheet{position:relative;background:#F8F2E4;border:1px solid var(--rule-strong);padding:14px 14px 10px;box-shadow:0 1px 0 #fff inset,0 18px 30px -24px rgba(70,50,20,.45)}
.herbarium__plant svg{width:100%;height:auto;max-height:340px}
.herbarium__label{margin:6px 0 0;padding-top:6px;border-top:.75px solid var(--rule);font:400 14.5px/1.35 var(--f-text);color:var(--ink-2);text-align:center}
.herbarium__label i{font:italic 16px var(--f-display);color:var(--ink)}

/* ---------------- 12. Лист IV · особенности: ведомость из четырёх строк ---------------- */
.feats{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.feat{display:grid;grid-template-columns:120px minmax(150px,.9fr) minmax(0,2.2fr) auto;grid-template-areas:"map head q go" "map head meta go";column-gap:var(--s-6);align-items:center;padding:var(--s-4) 0;border-bottom:.75px solid var(--rule-strong)}
.feat__map{grid-area:map;width:120px;height:68px}
.feat__map svg{width:100%;height:100%}
.feat__head{grid-area:head}
.feat__c{margin:0;font-size:15px;line-height:1.3;color:var(--ink-3)}
.feat h3{font:400 var(--t-h3)/1.15 var(--f-display)}
.feat__q{grid-area:q;align-self:end}
.feat__meta{grid-area:meta;align-self:start;margin:6px 0 0 18px;font-size:var(--t-small);color:var(--ink-2)}
.feat__go{grid-area:go}

/* ---------------- 13. Лист V · аналитика ---------------- */
.analytics{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--gutter);align-items:start}
.thesis{padding-top:var(--s-2)}
.thesis__fig{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;margin:0;font:400 clamp(44px,4.2vw,60px)/1 var(--f-display)}
.thesis__fig .pre{font:400 19px var(--f-text);color:var(--ink-2)}
.thesis__fig .minus{font-family:var(--f-text);font-weight:400;margin-right:.04em}
.thesis__fig .u{font-size:21px;color:var(--ink-2)}
.thesis__cap{margin:var(--s-3) 0 0;font-size:18px;line-height:1.5;color:var(--ink-2);max-width:22em}
.thesis__second{margin:var(--s-4) 0 0;padding-top:var(--s-4);border-top:.75px dotted var(--rule-strong);font:400 22px/1.3 var(--f-display);color:var(--ink)}
.forecast{margin:0}
.forecast__take{margin:0 0 4px;font-size:17px;color:var(--ink-2)}
.forecast__take b{font:400 26px/1 var(--f-display);color:var(--vermilion-ink)}
.fchart text{font-family:var(--f-text)}
.fchart .pt{cursor:pointer}
.fchart .pt:focus{outline:none}
.fchart .pt:focus-visible circle.ring{stroke:var(--ink);stroke-width:2}

/* подсказка-карточка на графиках */
.tip{position:absolute;z-index:20;pointer-events:none;min-width:150px;max-width:240px;padding:8px 10px 7px;background:var(--paper-card);border:1px solid var(--ink);box-shadow:var(--shadow);font-size:15px;line-height:1.35;color:var(--ink);opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s}
.tip.on{opacity:1;transform:none}
.tip b{display:block;font:400 18px/1.2 var(--f-display)}
.tip .m{color:var(--vermilion-ink)}
.tip small{display:block;margin-top:2px;font:400 14px/1.3 var(--f-text);color:var(--ink-3)}

/* ---------------- 14. Лист VI · калькулятор: в один экран ---------------- */
.calc{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--gutter);align-items:start}
.calc__fields{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-5);min-width:0}
.zones{border:0;margin:0;padding:0;min-width:0}
.zones legend{padding:0;margin:0 0 8px;font:400 17px/1.3 var(--f-text);color:var(--ink)}
.zones .seg{display:flex;width:100%}
.zones .seg button{flex:1 1 0;min-width:0;min-height:52px;padding:6px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;line-height:1.15}
.zones .seg button small{font-size:15px;font-variant-numeric:lining-nums}
.field{position:relative}
.field__lbl{display:block;margin:0 0 8px;font:400 17px/1.3 var(--f-text);color:var(--ink)}
.field__row{display:grid;grid-template-columns:minmax(0,160px) minmax(0,1fr);align-items:center;gap:var(--s-5)}
.field__in{position:relative;display:flex;align-items:center;height:52px;background:var(--paper-card);border:1px solid var(--ink-2);border-radius:2px;transition:border-color .15s,box-shadow .15s}
.field__in:focus-within{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.field__in input{flex:1;min-width:0;height:100%;padding:0 10px 0 12px;border:0;background:none;font:400 clamp(23px,1.9vw,27px)/1 var(--f-display);color:var(--ink);font-variant-numeric:lining-nums tabular-nums;outline:none}
/* фокус показывает рамка поля (.field__in:focus-within), общая бумажная тень фокуса здесь не нужна */
.field__in input:focus,.field__in input:focus-visible{outline:none;box-shadow:none}
.field.is-err .field__in,.field.is-err .field__in:focus-within{border-color:var(--vermilion);box-shadow:0 0 0 1px var(--vermilion);background:#F8E5DC}
.field.is-err .field__in:focus-within{box-shadow:0 0 0 2px var(--vermilion)}
.field__err{display:none;align-items:center;gap:6px;margin:6px 0 0;font-size:15px;color:var(--vermilion-ink)}
.field__err svg{width:16px;height:16px;flex:none}
.field.is-err .field__err{display:flex}
.field__out{display:none;align-items:center;gap:5px;margin:6px 0 0;font-size:15px;color:var(--ink-3)}
.field.is-out .field__out{display:flex}
/* ползунок */
.range{position:relative;height:44px;--p:0%;max-width:100%}
.range input{position:absolute;inset:0;width:100%;height:100%;margin:0;background:none;-webkit-appearance:none;appearance:none;cursor:pointer}
.range input::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--hop) 0 var(--p),var(--ink-3) var(--p) 100%);border-radius:1px}
.range input::-moz-range-track{height:2px;background:var(--ink-3);border-radius:1px}
.range input::-moz-range-progress{height:2px;background:var(--hop)}
.range input::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:-11px;border-radius:50%;background:var(--paper-card) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'><path d='M11 6.2c2.6.7 3.6 3.2 3 5.8-.5 2.2-1.6 3.5-3 4.4-1.4-.9-2.5-2.2-3-4.4-.6-2.6.4-5.1 3-5.8Z' fill='%23B9C67F' stroke='%2333281D' stroke-width='.8'/><path d='M8.4 9.4q1.3 1.4 2.6 0 1.3 1.4 2.6 0M8.2 12q1.4 1.5 2.8 0 1.4 1.5 2.8 0' fill='none' stroke='%2333281D' stroke-width='.6'/></svg>") center/22px no-repeat;border:1.5px solid var(--ink);box-shadow:0 1px 2px rgba(51,40,29,.25);transition:border-color .15s}
.range input::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--paper-card);border:1.5px solid var(--ink)}
.range input:active::-webkit-slider-thumb{border-color:var(--ochre-ink)}
.range input:focus{outline:none}
.range input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--paper-card),0 0 0 5px var(--ink)}
.range input:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--paper-card),0 0 0 5px var(--ink)}
.range__bubble{position:absolute;top:-16px;left:var(--p);transform:translateX(calc(var(--p) * -1));padding:2px 6px;background:var(--ink);color:var(--on-dark);font-size:14px;line-height:1.2;border-radius:2px;white-space:nowrap;opacity:0;transition:opacity .15s;pointer-events:none}
.range.is-drag .range__bubble{opacity:1}
/* результат */
.calc__result{position:relative;background:var(--paper-card);border:1.5px solid var(--ink);padding:24px 26px 20px;box-shadow:var(--shadow)}
.calc__result::before{content:"";position:absolute;inset:4px;border:.75px solid var(--ink);pointer-events:none}
.calc__lbl{margin:0;font:400 17px/1.35 var(--f-text);color:var(--ink-2)}
.calc__big{position:relative;display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 12px;margin:12px 0 0;font:400 clamp(48px,5vw,68px)/1 var(--f-display);color:var(--ink);font-variant-numeric:lining-nums proportional-nums;min-width:0;z-index:0}
.calc__big #res-v{min-width:0;overflow-wrap:anywhere}
.calc__big.is-long{font-size:clamp(30px,3vw,44px)}
.calc__big.is-huge{font-size:clamp(22px,2vw,30px)}
.calc__big .u{font-size:21px;color:var(--ink-2)}
.calc__big::after{content:"";position:absolute;left:-6px;bottom:-10px;width:min(320px,80%);height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 20' preserveAspectRatio='none'><path d='M3 11C46 4 96 7 152 6S258 3 297 9L295 15C250 18 182 14 124 16S32 19 5 16Z' fill='%23C8953F' fill-opacity='.45'/></svg>") center/100% 100% no-repeat;z-index:-1}
.calc__alt{min-height:1.5em;margin:16px 0 0;font:400 16px/1.45 var(--f-text);color:var(--ink-2)}
/* формула — одна строка: числа, под каждым — что это */
.formula{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 6px;margin:var(--s-4) 0 0;padding:var(--s-4) 0 0;border-top:1px solid var(--rule-strong);font-size:17px;line-height:1.5;color:var(--ink)}
.formula .f{display:inline-flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:100%;padding:2px 6px 3px;border-radius:2px;transition:background-color .6s}
.formula .f b{font:400 21px/1.15 var(--f-display);font-variant-numeric:lining-nums;white-space:nowrap;overflow-wrap:anywhere}
.formula .f b .u{font:400 15px var(--f-text);color:var(--ink-2);margin-left:3px}
.formula .f small{font:400 14px/1.25 var(--f-text);color:var(--ink-3)}
.formula .f.flash{background:var(--hop-pale);transition:none}
.formula .op{font:400 19px var(--f-display);color:var(--ink-3)}
.formula .op:empty{display:none}
.formula .eq b{color:var(--hop-ink)}
.calc__note{margin:var(--s-4) 0 0;font-size:var(--t-small);line-height:1.45;color:var(--ink-3)}
/* на широком экране итог «едет» рядом с полями — смену ФО видно сразу */
@media (min-width:1024px){.calc__result{position:sticky;top:calc(var(--head) + 16px)}}

/* ---------------- 15. Лист VII · технологическая карта — один раз ---------------- */
.techtable__actions{display:flex;flex-wrap:wrap;gap:10px}
.csv-note{margin:0;font-size:var(--t-small);color:var(--ink-2)}
.csv-note:empty{display:none}
.csv-note:not(:empty){margin:0 0 var(--s-4)}
.tbl-wrap{width:100%}
.tbl--tech td:first-child{width:92px;padding-left:4px}
.tech-n{display:inline-flex;align-items:center;gap:8px}
.tech-n b{font:400 20px/1 var(--f-display);color:var(--ink-3)}
.tech-vig{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--ink);border-radius:50%;background:var(--paper-card)}
.tech-vig svg{width:34px;height:34px}
.tbl--tech tbody th{width:24%;font-weight:700;color:var(--ink);vertical-align:middle}
.tbl--tech td{vertical-align:middle}
.timeline{display:none}

/* ---------------- 16. Лист VIII · рекомендации ---------------- */
.recs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-6) var(--s-7)}
.rec{padding-top:var(--s-4);border-top:1px solid var(--rule-strong)}
.rec__n{display:inline-block;margin-right:.4em;font:400 30px/1 var(--f-display);color:var(--ochre-ink);white-space:nowrap}
.rec h3{display:flex;align-items:baseline;margin:0 0 8px;font:700 19px/1.3 var(--f-text);color:var(--ink)}
.rec p{margin:0;font-size:17px;line-height:1.6;color:var(--ink-2)}

/* ---------------- 17. Подвал — тёмный «переплёт» ---------------- */
.binding{margin-top:var(--s-9);background:var(--ink);color:var(--on-dark);position:relative}
.binding::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ochre)}
.binding__in{max-width:calc(var(--maxw) + 2 * var(--pad));margin:0 auto;padding:var(--s-8) var(--pad) var(--s-6);display:grid;grid-template-columns:auto 1fr 1.2fr;gap:var(--s-7);align-items:start}
.binding__mark{width:64px;height:64px}
.binding__mark svg{width:100%;height:100%}
.binding__h{margin:0 0 12px;font:400 16px/1.3 var(--f-text);color:#E7D7AE}
.devs{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.devs li{font:400 22px/1.35 var(--f-display)}
.binding__k{margin:0 0 10px;font:400 16px/1.3 var(--f-text);color:#E7D7AE}
.binding__title{margin:0;font:italic 19px/1.45 var(--f-display);color:var(--on-dark)}
.binding__meta{margin:12px 0 0;font-size:16px;color:#E7D7AE}
.binding__colophon{max-width:calc(var(--maxw) + 2 * var(--pad));margin:0 auto;padding:var(--s-4) var(--pad) var(--s-6);border-top:1px solid rgba(251,246,234,.18);display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:15px;color:#E7D7AE}
.binding a{color:var(--on-dark)}
.binding :focus-visible{outline-color:var(--on-dark);box-shadow:none}

/* ---------------- 18. Адаптив ---------------- */
/* Оглавление строкой показывается, только если целиком помещается в шапку
   (nav.js измеряет и ставит .is-compact); иначе — кнопка «Содержание» и панель */
.is-compact .toc__btn{display:inline-flex;align-items:center;gap:9px;min-height:44px;min-width:44px;padding:0 14px;border:1px solid var(--ink-2);background:var(--paper-card);border-radius:2px;font:400 15px var(--f-text);color:var(--ink)}
.is-compact .toc__btn svg{width:16px;height:12px}
.is-compact .toc__btn:hover,.is-compact .toc__btn[aria-expanded="true"]{background:var(--hop-pale)}
.is-compact .toc__panel{overscroll-behavior:contain;display:none;position:absolute;right:0;top:calc(100% + 10px);width:min(360px,calc(100vw - 2 * var(--pad)));max-height:calc(100svh - var(--head) - 24px);overflow:auto;background:var(--paper-card);border:1.5px solid var(--ink);box-shadow:var(--shadow);padding:16px 16px 12px}
.is-compact .toc__panel::before{content:"";position:absolute;inset:3px;border:.75px solid var(--ink);pointer-events:none}
.is-compact .toc.is-open .toc__panel{display:block;animation:card-in .22s var(--ease) both}
.is-compact .toc__title{display:block;margin:0 0 8px;font:400 19px/1.3 var(--f-display);color:var(--ink)}
.is-compact .toc__list{flex-direction:column;align-items:stretch}
.is-compact .toc__list a{padding:11px 6px;font-size:17px;gap:10px}
.is-compact .toc__list a i{order:3;min-width:2.4em;text-align:right;font-size:16px}
.is-compact .toc__lead{display:block;order:2;flex:1;border-bottom:1.5px dotted rgba(51,40,29,.35);transform:translateY(-5px)}
.is-compact .toc__list a[aria-current="true"]::after{display:none}
.is-compact .toc__list a[aria-current="true"]::before{content:"";position:absolute;left:-9px;top:50%;width:7px;height:7px;background:var(--ochre);transform:translateY(-50%) rotate(45deg)}
.is-compact .toc__list a[aria-current="true"]{background:var(--ochre-wash)}
/* Невысокий экран ноутбука (1366×768, 1440×800): титул плотнее, чтобы он целиком был на первом экране */
@media (min-width:1024px) and (max-height:860px){
  .hero{gap:18px;padding:22px 0 24px}
  .cartouche{padding:26px 28px 20px}
  .cartouche .display{font-size:clamp(30px,2.8vw,40px)}
  .nir{font-size:15.5px;line-height:1.5;margin-top:12px}
  .ledger__row{padding:6px 0 5px}
  .ledger__v{font-size:clamp(23px,1.8vw,27px)}
  .stage{padding-top:10px}
}
@media (max-width:1279px){
  .rcard{left:0;right:0;width:auto;bottom:calc(0px - var(--below-h,0px));max-height:none;display:grid;grid-template-columns:1fr 1fr;column-gap:20px}
  .rcard[hidden]{display:none}
  .rcard > *{grid-column:1}
  .rcard .quote{grid-column:2;grid-row:2/5;align-self:start;margin-top:4px}
  .rcard .rcard__top,.rcard .rcard__nav,.rcard .rcard__back{grid-column:1/-1}
  .stage__lbl{display:none}
  .feat{grid-template-columns:96px minmax(0,1fr) auto;grid-template-areas:"map head go" "map q q" "map meta meta";row-gap:6px}
  .feat__map{width:96px;height:58px;align-self:start}
  .feat__q{align-self:start;margin-top:4px}
  .feat__meta{margin-left:18px}
  .products{grid-template-columns:minmax(0,1fr) 220px}
}
@media (max-width:1023px){
  :root{--gutter:24px;--gb:min(92vw,560px)}
  .on-wide{display:none}
  .on-narrow{display:inline}
  .spread{display:flex;flex-direction:column}
  .hero,.stage-col,.stage{display:contents}
  /* порядок: заголовок → глобус → кнопки видов → вывод → легенда → цифры → кнопки → список */
  .cartouche{order:1;margin-top:28px}
  .globe-box{order:2;flex:none;height:var(--gb);margin:16px 0 0}
  .stage__bar{order:3;margin-top:10px}
  .seg--views{flex:1;display:grid;grid-template-columns:repeat(4,1fr)}
  .seg--views button{padding:0 4px;min-height:46px}
  .view-cap{order:4;margin-top:12px;min-height:0}
  .legend-line{order:5;margin-top:8px}
  .ledger{order:6;margin-top:var(--s-5)}
  .hero__cta{order:7;margin-top:var(--s-5)}
  .workbench{order:8;padding-top:var(--s-8)}
  .globe-kbd{max-width:calc(100% - 24px)}
  .rcard{position:fixed;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));top:auto;width:auto;max-height:min(58svh,520px);z-index:45;display:block}
  .rcard[hidden]{display:none}
  .rcard > *{grid-column:auto}
  .rcard .quote{margin-top:12px}
  .trade,.analytics,.calc{grid-template-columns:minmax(0,1fr)}
  .products{grid-template-columns:minmax(0,1fr)}
  .products .herbarium{display:none}
  .sheet{padding-top:var(--s-7);scroll-margin-top:calc(16px - var(--s-7))}
  .sheet-rule{margin-top:var(--s-7)}
  .thesis{max-width:34em}
}
/* планшет: карточка региона внизу экрана — в две колонки, так она ниже */
@media (min-width:768px) and (max-width:1023px){
  .rcard{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}
  .rcard > *{grid-column:1}
  .rcard .quote{grid-column:2;grid-row:2/5;align-self:start;margin-top:4px}
  .rcard .rcard__top,.rcard .rcard__nav,.rcard .rcard__back{grid-column:1/-1}
}
/* Телефон, повёрнутый горизонтально: высоты мало — глобус поменьше */
@media (max-width:1023px) and (max-height:500px){
  :root{--gb:min(84svh,330px)}
  .rcard{max-height:calc(100svh - var(--head) - 16px)}
}
/* без глобуса рядом (узкий экран) кнопка «Показать на глобусе» в особенностях не нужна:
   она уносила бы на самый верх страницы */
@media (max-width:1023px){
  .feat__go{display:none}
  .feat{grid-template-columns:84px minmax(0,1fr);grid-template-areas:"map head" "q q" "meta meta"}
  .feat__map{width:84px;height:50px}
  .feat__meta{margin-left:18px}
}
@media (max-width:767px){
  :root{--head:56px;--gb:min(94vw,400px);--t-body:16px}
  .brand{width:auto}
  .brand__seal{width:34px;height:34px}
  .brand b{font-size:17px}
  .brand__sheet{font-size:13.5px;max-width:52vw}
  .is-compact .toc__btn span{display:none}
  .is-compact .toc__btn{padding:0 12px}
  .cartouche{padding:0 2px;background:none;margin-top:24px}
  .cartouche::before,.cartouche::after{display:none}
  .cartouche .display{font-size:clamp(29px,8vw,36px);line-height:1.08}
  .nir{margin-top:10px;font-size:15.5px}
  .nir__full{display:none}
  .nir__short{display:inline}
  .globe-box{margin-top:10px}
  .view-cap{font-size:16px}
  .legend-line{gap:4px 16px;padding-top:6px}
  .legend-line li{font-size:15px;gap:6px}
  .legend-line__ic{width:22px;height:22px}
  .lg-x{display:none}
  /* цифры — сеткой 2 × 2 */
  .ledger{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding-top:var(--s-2)}
  .ledger__row{flex-direction:column;align-items:flex-start;gap:4px;padding:10px 0 8px;border-bottom:.75px solid var(--rule)}
  .ledger__row:nth-child(n+3){border-bottom:0}
  .ledger__row::after{display:none}
  .ledger dt{max-width:none;font-size:15px;line-height:1.3}
  .ledger dd{justify-content:flex-start;gap:0 5px}
  .ledger__v{font-size:26px}
  .ledger dd .u{font-size:14.5px}
  .hero__cta .btn{flex:1 1 100%}
  .sheet-head__h{font-size:clamp(26px,7vw,31px)}
  .sheet{padding-top:var(--s-6);scroll-margin-top:calc(16px - var(--s-6))}
  .sheet-rule{margin-top:var(--s-6)}
  .sheet-head{margin-bottom:var(--s-5)}
  .workbench{padding:var(--s-7) 0 var(--s-4)}
  .chart{margin-top:var(--s-6)}
  .workbench .sheet-head__h{font-size:clamp(26px,7vw,31px)}
  .rlist button{padding:9px 4px 13px 0;grid-template-columns:28px minmax(0,1fr) auto}
  .rlist .nm{font-size:16.5px}
  .rlist .nm small{margin-left:.35em;font-size:14.5px}
  .rlist .bar{left:38px}
  .top6{--c1:84px;--gap:8px;--lab:92px}
  .top6 .row{min-height:44px}
  .top6 .ctry{font-size:16px}
  .top6 .val{font-size:16px}
  .plate__frame{aspect-ratio:auto;height:auto;padding:10px}
  .plate__canvas{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1/0.8}
  .plate__inset{position:relative;right:auto;bottom:auto;width:100%;margin:14px 0 4px;aspect-ratio:auto}
  .plate__inset-canvas{height:auto;aspect-ratio:1/0.52}
  .plate__inset-cap{position:static;margin:0;padding:6px 8px 7px;border:0;border-top:.75px solid var(--rule-strong);background:none;white-space:normal}
  .plate__legend{align-items:flex-start}
  /* хмелепродукты: строка продукта — заголовок, под ним две полосы «в мире» и «в России» */
  .ptable thead{display:none}
  .ptable caption{display:block}
  .ptable,.ptable tbody,.ptable tr{display:block;width:100%}
  .ptable tr{padding:10px 0 12px;border-bottom:.75px solid var(--rule)}
  .ptable tbody th{display:block;width:auto;padding:0 0 4px;border:0;font-size:17px}
  .ptable__c{display:block;padding:3px 0;border:0}
  .ptable__c::before{content:attr(data-label);display:inline-block;width:5.6em;font-size:15px;color:var(--ink-2)}
  .ptable__cell{display:inline-flex;width:calc(100% - 5.7em);vertical-align:middle}
  .ptable__v{font-size:18px}
  .quote{font-size:17px}
  .recs{grid-template-columns:minmax(0,1fr)}
  .rec__n{font-size:26px}
  .binding__in{grid-template-columns:1fr;gap:var(--s-5)}
  .devs li{font-size:20px}
  .calc__result{padding:20px 18px}
  .formula .f b{font-size:19px}
  .field__row{grid-template-columns:minmax(0,128px) minmax(0,1fr);gap:var(--s-4)}
  /* формула на телефоне — ведомостью: «× урожайность …… 1,5 т/га» */
  .formula{display:grid;grid-template-columns:1.1em minmax(0,1fr);gap:2px 6px;align-items:baseline}
  .formula .op:empty{display:block}
  .formula .f{flex-direction:row-reverse;justify-content:space-between;align-items:baseline;gap:10px;padding:2px 4px}
  .formula .f small{font-size:15px}
  .formula .f b{font-size:19px;text-align:right}
  .calc input{scroll-margin-bottom:96px}
  /* техкарта: на экране — лента этапов, таблица — только для печати и CSV */
  .tbl-wrap{display:none}
  .timeline{display:block;list-style:none;margin:0;padding:0}
  .timeline li{position:relative;display:grid;grid-template-columns:56px 1fr;gap:14px;padding:0 0 18px}
  .timeline li::before{content:"";position:absolute;left:27px;top:56px;bottom:0;border-left:1px solid var(--ink-2)}
  .timeline li:last-child::before{display:none}
  .timeline .node{width:56px;height:56px;border-radius:50%;background:var(--paper-card);border:1px solid var(--ink);display:grid;place-items:center;position:relative}
  .timeline .node svg{width:40px;height:40px}
  .timeline .node .n{position:absolute;right:-4px;top:-4px;width:22px;height:22px;border-radius:50%;background:var(--paper);border:1px solid var(--ink);display:grid;place-items:center;font:700 13px var(--f-text)}
  .timeline h3{margin:6px 0 4px;font:400 20px/1.2 var(--f-display)}
  .timeline dl{margin:0;font-size:16px;line-height:1.45}
  .timeline dt{margin-top:4px;font:400 14.5px/1.3 var(--f-text);color:var(--ink-3)}
  .timeline dd{margin:2px 0 0}
  .sheet-head--act{align-items:flex-start}
}

/* ---------------- 19. Меньше движения ---------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rcard,.toc.is-open .toc__panel{animation:fade-only .12s both}
  .globe-ring .vine-main,.globe-ring .vi{animation:none}
  .top6 .bar,.ptable__track i{transition:none}
  .is-pre .top6 .bar,.ptable.is-pre .ptable__track i{transform:none}
  *{scroll-behavior:auto!important}
}
@keyframes fade-only{from{opacity:0}to{opacity:1}}

/* ---------------- Режим карты «Атлас» ----------------
   Полноэкранный лист: шапка с видами и слоями, карта, справа — список
   регионов и подробная панель (на телефоне — шторка снизу). */
.ic--open{transition:transform .15s var(--ease)}
.btn:hover .ic--open{transform:scale(1.12)}
.globe-hint{position:absolute;left:50%;top:50%;z-index:6;margin:0;max-width:300px;padding:10px 14px;transform:translate(-50%,-50%);
  background:rgba(51,40,29,.88);color:var(--on-dark);font:400 15px/1.4 var(--f-text);text-align:center;border-radius:2px;
  opacity:0;pointer-events:none;transition:opacity .2s var(--ease)}
.globe-hint.is-on{opacity:1}
.globe-hint b{font-weight:700}
.globe-box.is-engaged .globe-canvas{cursor:grab}

html.amap-lock,html.amap-lock body{overflow:hidden}
.amap{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;background:transparent}
.amap__bg{position:absolute;inset:0;z-index:0;background-color:var(--paper);
  background-image:radial-gradient(ellipse at 50% 45%,rgba(255,252,240,.55),rgba(244,236,217,0) 60%),radial-gradient(ellipse at 50% 50%,rgba(0,0,0,0) 55%,rgba(120,90,50,.12));opacity:0}
.amap.is-flat .amap__bg{opacity:1}
.amap__body{position:relative;z-index:1}
.amap__canvas.is-full{position:fixed;left:0;top:0;z-index:2}
.amap:not(.is-flat) .amap__canvas{pointer-events:none}
.amap__side{position:relative;z-index:3;background:#F7F0DF!important}
.amap__zoom,.amap__legend{z-index:4}
.globe-box{transition:opacity .28s var(--ease)}
.globe-box.is-handoff{opacity:0}
.amap[hidden]{display:none}
.amap__bar{flex:none;display:flex;align-items:center;gap:16px 24px;flex-wrap:wrap;padding:12px clamp(14px,2.4vw,32px);
  border-bottom:1px solid var(--rule-strong);box-shadow:0 3px 0 -2px var(--rule);background:rgba(244,236,217,.95);position:relative;z-index:3}
.amap__h{margin:0;font:400 clamp(20px,1.7vw,26px)/1.1 var(--f-display);color:var(--ink);white-space:nowrap}
.amap__h i{color:var(--hop-ink)}
.amap__ctrls{display:flex;gap:12px 16px;flex-wrap:wrap;flex:1;justify-content:center}
.amap__close{margin-left:auto;gap:8px}
.amap__body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,26vw,380px)}
.amap__stage{position:relative;min-width:0;min-height:0;overflow:hidden}
.amap__canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none;outline:none}
.amap__canvas:focus-visible{box-shadow:inset 0 0 0 2px var(--ochre-ink)}
.amap__canvas.is-pointing{cursor:pointer}
.amap__canvas.is-dragging{cursor:grabbing}

/* шапка, боковая панель и подсказки появляются, когда лист развернулся */
.amap__side,.amap__zoom,.amap__legend{transition:opacity .45s var(--ease),transform .45s var(--ease)}
.amap:not(.is-flat) .amap__side{opacity:0;transform:translateX(24px)}
.amap:not(.is-flat) .amap__zoom,.amap:not(.is-flat) .amap__legend{opacity:0}

.amap__zoom{position:absolute;right:16px;top:16px;display:flex;flex-direction:column;border:1px solid var(--ink-2);background:var(--paper-card);box-shadow:var(--shadow);border-radius:2px}
.amap__zoom button{appearance:none;width:44px;height:44px;border:0;background:none;color:var(--ink);font:400 24px/1 var(--f-display);cursor:pointer;display:grid;place-items:center}
.amap__zoom button+button{border-top:1px solid var(--rule)}
.amap__zoom button:hover{background:var(--hop-pale)}
.amap__zoom svg{width:18px;height:18px}
.amap__legend{position:absolute;left:16px;bottom:14px;right:80px;margin:0;display:flex;align-items:center;gap:10px;max-width:640px;
  padding:8px 12px;background:rgba(250,245,232,.92);border:1px solid var(--rule);font:400 15px/1.35 var(--f-text);color:var(--ink-2)}
.amap__legend .legend-line__ic{flex:none}

.amap__tip{position:absolute;left:0;top:0;z-index:4;min-width:200px;max-width:280px;padding:10px 14px 9px;pointer-events:none;
  background:var(--paper-card);border:1px solid var(--rule-strong);box-shadow:var(--shadow);border-radius:2px}
.amap__tip::before{content:"";position:absolute;inset:3px;border:.75px solid var(--rule);pointer-events:none}
.amap__tip p{margin:0}
.amap__tip-k{font:400 14px/1.3 var(--f-text);color:var(--ink-3)}
.amap__tip-h{font:400 21px/1.15 var(--f-display);color:var(--ink);margin-top:2px!important}
.amap__tip-v{font:400 27px/1.1 var(--f-display);color:var(--hop-ink);margin-top:4px!important}
.amap__tip-v .u{font-size:15px;color:var(--ink-2)}
.amap__tip-v--money{color:var(--vermilion-ink)}
.amap__tip-s{font:400 15px/1.35 var(--f-text);color:var(--ink-2);margin-top:3px!important}
.amap__tip-act{font:italic 400 14px/1.3 var(--f-display);color:var(--ochre-ink);margin-top:6px!important}

.amap__side{min-height:0;overflow:auto;overscroll-behavior:contain;border-left:1px solid var(--rule-strong);background:rgba(250,245,232,.7);padding:18px 18px 24px}
.amap__search{display:flex;align-items:center;gap:8px;padding:0 12px;height:46px;border:1px solid var(--ink-2);background:var(--paper-card);border-radius:2px}
.amap__search svg{width:17px;height:17px;flex:none;color:var(--ink-3)}
.amap__search input{flex:1;min-width:0;border:0;background:none;font:400 17px/1 var(--f-text);color:var(--ink);outline:none}
.amap__search:focus-within{box-shadow:0 0 0 2px var(--ochre-wash);border-color:var(--ochre-ink)}
.amap__sort{margin:12px 0 6px;width:100%}
.amap__sort button{flex:1}
.amap__list{list-style:none;margin:8px 0 0;padding:0}
.amap__list button{appearance:none;width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) auto;grid-template-rows:auto auto;gap:2px 10px;align-items:baseline;
  padding:9px 8px 10px;border:0;border-bottom:1px solid var(--rule);background:none;text-align:left;cursor:pointer;color:var(--ink);font:inherit;min-height:44px}
.amap__list button:hover{background:var(--hop-pale)}
.amap__list button[aria-current="true"]{background:var(--ochre-wash)}
.amap__li-n{font:400 15px/1 var(--f-display);color:var(--ink-3);text-align:right}
.amap__li-t{display:flex;flex-direction:column;min-width:0}
.amap__li-t b{font:400 17px/1.25 var(--f-text)}
.amap__li-t small{font:400 14px/1.3 var(--f-text);color:var(--ink-3)}
.amap__li-v{font:400 16px/1 var(--f-text);font-variant-numeric:tabular-nums;white-space:nowrap}
.amap__li-bar{grid-column:2/4;height:4px;background:rgba(51,40,29,.07);margin-top:4px}
.amap__li-bar i{display:block;height:100%;background:var(--hop)}
.amap__empty{padding:16px 8px;color:var(--ink-3)}
.amap__sum{display:flex;justify-content:space-between;gap:12px;margin:14px 0 4px;padding-top:10px;border-top:1px solid var(--rule-strong);font:400 16px/1.3 var(--f-text)}

.amap__dtop{display:flex;justify-content:space-between;align-items:center;margin:-6px -6px 10px 0}
.amap__kick{margin:0;font:400 15px/1.3 var(--f-text);color:var(--ink-3)}
.amap__dh{margin:2px 0 0;font:400 clamp(26px,2.1vw,32px)/1.1 var(--f-display);color:var(--ink);outline:none}
.amap__dh:focus-visible{outline:2px dotted var(--ochre-ink);outline-offset:3px}
.amap__big{margin:10px 0 0;font:400 clamp(34px,2.8vw,42px)/1 var(--f-display);color:var(--hop-ink)}
.amap__big .u{font-size:18px;color:var(--ink-2)}
.amap__note{margin:6px 0 0;font:400 15px/1.45 var(--f-text);color:var(--ink-2)}
.amap__sub{margin:20px 0 8px;padding-top:12px;border-top:1px solid var(--rule);font:400 15px/1.2 var(--f-text);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.amap__detail .quote{margin-top:4px}
.amap__bars{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.amap__bars li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(60px,1fr) auto;gap:10px;align-items:center;font:400 15px/1.3 var(--f-text)}
.amap__bars li.is-me{font-weight:700}
.amap__bars-t{height:9px;background:rgba(51,40,29,.07)}
.amap__bars-t i{display:block;height:100%;background:var(--hop)}
.amap__bars li.is-me .amap__bars-t i{background:var(--ochre)}
.amap__bars--money .amap__bars-t i{background:var(--vermilion)}
.amap__bars-v{white-space:nowrap;font-variant-numeric:tabular-nums}
.amap__lnk{appearance:none;border:0;background:none;padding:0;font:inherit;color:var(--ink);text-decoration:underline dotted 1.2px;text-underline-offset:3px;cursor:pointer;text-align:left}
.amap__lnk:hover{color:var(--hop-ink)}
.amap__nav{display:flex;justify-content:space-between;gap:10px;margin-top:22px}

/* телефон и узкий планшет: карта сверху, список — шторкой снизу */
@media (max-width:900px){
  .amap__bar{padding:8px 12px;gap:8px}
  .amap__h i{display:none}
  .amap__ctrls{order:3;flex-basis:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .amap__ctrls .seg{flex:none}
  .amap__body{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .amap__side{border-left:0;border-top:1px solid var(--rule-strong);max-height:42vh;padding:12px 14px 18px}
  .amap.has-detail .amap__side{max-height:58vh}
  .amap:not(.is-flat) .amap__side{transform:translateY(24px)}
  .amap__legend{right:72px;font-size:14px;padding:6px 10px}
  .amap__zoom{right:10px;top:10px}
  .amap__tip{display:none}
}
@media (prefers-reduced-motion:reduce){
  .amap,.amap__bar,.amap__side,.amap__zoom,.amap__legend{transition:none}
}
@media print{.amap{display:none!important}}
.amap__big .fn{font-size:.45em}
@media (max-width:900px){
  .amap__legend-x{display:none}
  .amap.has-detail .amap__legend{display:none}
  .amap.has-detail .amap__side{max-height:52vh}
  .amap__ctrls{padding-right:4px}
}
.amap__h{outline:none}
.amap__h:focus{box-shadow:none}

/* кнопка «Открыть атлас» под глобусом: та же основная кнопка сайта, крупнее.
   «Вау» — при наведении по кнопке проходит блик, значок-глобус «разворачивается» в карту;
   один раз после появления глобуса — мягкая волна-приглашение вокруг кнопки. */
.atlas-cta{flex:none;display:flex;justify-content:center;margin-top:12px;position:relative;z-index:5}
.atlas-btn{position:relative;min-height:52px;padding:0 26px 0 18px;gap:12px;font-size:18px;letter-spacing:.01em;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background-color .18s}
.atlas-btn:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(0,0,0,.18),0 14px 24px -14px rgba(51,40,29,.75)}
.atlas-btn:active{transform:translateY(0)}
.atlas-btn__ic{flex:none;width:26px;height:26px;position:relative}
.atlas-btn__ic svg{width:100%;height:100%;overflow:visible}
.atlas-btn__globe,.atlas-btn__map{transform-origin:20px 20px;transition:opacity .3s var(--ease),transform .45s var(--ease)}
.atlas-btn__map{opacity:0;transform:scaleX(.2) rotate(-8deg)}
.atlas-btn:hover .atlas-btn__globe,.atlas-btn:focus-visible .atlas-btn__globe{opacity:0;transform:scale(.5) rotate(40deg)}
.atlas-btn:hover .atlas-btn__map,.atlas-btn:focus-visible .atlas-btn__map{opacity:1;transform:none}
@media (prefers-reduced-motion:no-preference){
  .atlas-btn{animation:atlas-invite 1.4s ease-out 3.6s 2}
}
@keyframes atlas-invite{0%{box-shadow:inset 0 0 0 1px rgba(0,0,0,.18),0 0 0 0 rgba(86,116,42,.55)}100%{box-shadow:inset 0 0 0 1px rgba(0,0,0,.18),0 0 0 16px rgba(86,116,42,0)}}
@media (prefers-reduced-motion:reduce){.atlas-btn,.atlas-btn__globe,.atlas-btn__map{transition:none}}
@media print{.atlas-cta{display:none}}
/* узкий экран: кнопка — сразу под кнопками видов, под глобусом */
@media (max-width:1023px){
  .atlas-cta{order:3;margin-top:14px}
  .atlas-btn{width:100%;max-width:440px}
}

/* куст хмеля, разрастающийся из-за кнопки «Открыть атлас» (см. vinebtn.js) */
.atlas-cta .atlas-btn{z-index:1}
.atlas-vine{position:absolute;pointer-events:none;overflow:visible;z-index:0}
.atlas-vine--front{z-index:2}
.atlas-vine .v-st{stroke-dasharray:var(--l);stroke-dashoffset:var(--l);
  transition:stroke-dashoffset .4s cubic-bezier(.5,0,.75,0) var(--dout)}
.atlas-vine .v-st--hl{stroke:#9BB35A;stroke-opacity:.7}
.atlas-vine.is-grown .v-st{stroke-dashoffset:0;transition:stroke-dashoffset var(--dur) linear var(--din)}
.atlas-vine .v-it{transform-box:view-box;transform:scale(0) rotate(-30deg);opacity:0;
  transition:transform .3s cubic-bezier(.5,0,.75,0) var(--dout),opacity .24s ease-in var(--dout)}
.atlas-vine.is-grown .v-it{transform:none;opacity:1;
  transition:transform .55s cubic-bezier(.3,1.45,.55,1) var(--din),opacity .3s ease-out var(--din)}
.atlas-vine .v-it--cone{transform:scale(0) translateY(-5px)}
@media (prefers-reduced-motion:reduce){.atlas-vine .v-st,.atlas-vine .v-it{transition:none!important}}
@media print{.atlas-vine{display:none}}
.atlas-cta{margin-bottom:8px}
@media (max-width:1023px){.atlas-cta{margin-top:26px}}
.atlas-vine{max-width:none!important;max-height:none!important}
/* «← № / № →» — всегда на одном месте: прилипают к верху панели региона */
.amap__nav{position:sticky;top:-18px;z-index:2;margin:0 -18px 14px;padding:10px 18px;background:#F7F0DF;border-bottom:1px solid var(--rule)}
.amap__nav .btn{flex:1;max-width:48%}
@media (max-width:900px){.amap__nav{top:-12px;margin:0 -14px 12px;padding:8px 14px}}