/* === base === */
*{box-sizing:border-box;line-height:1.2;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
@font-face{
  font-family:"Inter Bold";
  src:url("../fonts/6808f299811c1703a1cacc77ced26c5d.eot");
  src:url("../fonts/6808f299811c1703a1cacc77ced26c5d.eot?#iefix") format("embedded-opentype"),
      url("../fonts/6808f299811c1703a1cacc77ced26c5d.woff2") format("woff2"),
      url("../fonts/6808f299811c1703a1cacc77ced26c5d.woff") format("woff"),
      url("../fonts/6808f299811c1703a1cacc77ced26c5d.ttf") format("truetype"),
      url("../fonts/6808f299811c1703a1cacc77ced26c5d.svg#Inter Bold") format("svg");
}
@font-face {
    font-family: 'Inter';
    src: local('Inter Regular'), local('Inter-Regular'),
        url('../fonts/Inter-Regular.woff2') format('woff2'),
        url('../fonts/Inter-Regular.woff') format('woff'),
        url('../fonts/Inter-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
  }
html,body{width:100vw;height:100vh;font-family:"Inter Bold",Arial;touch-action:none;user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;overflow:hidden;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;text-size-adjust:none}

/* Дополнительная защита от масштабирования */
* {
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  -khtml-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  touch-action: none !important;
}

/* Разрешаем только панорамирование для карты */
.rf-map {
  touch-action: pan-x pan-y !important;
}

/* palette */
:root{
  --region-base:#CCCCCC;     /* фон карты */
  --region-has:#0E86C7;      /* регионы с данными */
  --region-hover:#CD563A;    /* жёлтый для hover/active */
  --ink:#003124;             /* тёмно-зелёный текст */
  --muted:#789a8f;           /* подписи */
  --card-bg:#ffffff;
  --card-shadow:0 24px 80px rgba(0,0,0,.18),0 6px 18px rgba(0,0,0,.12);
}

/* === layout === */
.map{
  width:100vw;height:100vh;position:relative;overflow:hidden;
  background:url("../img/bg.jpg") center/cover no-repeat;
}
.map__logo,.map__title,.map__zoom,.map__qr,.map__russia,.map__bottom{z-index:2}

.map__logo{height:89px;position: fixed;left: 54px;bottom:54px}
.map__logo img{height:100%}

.map__title{
  color:#000;text-align:center;font-size:80px;letter-spacing:-.64px;
  position:fixed;left:50%;transform:translateX(-50%);top:54px
}

.map__qr{width:99px;position: fixed;right:53px;bottom:53px}
.map__qr img{width:100%}

.map__zoom{
  position:fixed;top:50%;transform:translateY(-50%);left:52px;
  display:flex;flex-direction:column;gap:16px;z-index:3
}
.map__zoom-item{
  min-height:72px;max-height:72px;width:72px;background:#030404;
  display:flex;align-items:center;justify-content:center;cursor:pointer
}
.map__zoom-item svg{width:40%;height:40%;display:block}

/* === карта === */
.map__init{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.rf-map{position:relative;min-width:75%;margin:auto;transform-origin:0 0;will-change:transform;touch-action:pan-x pan-y}
.rf-map svg{width:100%;height:100%}
.rf-map path{stroke:#fff;stroke-width:1;stroke-linejoin:round}

/* заливки */
.rf-map [data-code]{fill:var(--region-base);transition:fill .15s ease,opacity .15s ease;cursor:default}
.rf-map [data-code].has-data{fill:var(--region-has);cursor:pointer}
.rf-map [data-code].has-data:hover{fill:var(--region-hover)}
.rf-map [data-code].active{fill:var(--region-hover)!important}

/* Специальный стиль для России */
.rf-map #RU{fill:rgb(37, 152, 1)!important;cursor:default}
.rf-map #RU:hover{fill:rgb(37, 152, 1)!important}
.rf-map #RU.active{fill:rgb(37, 152, 1)!important} /* Россия всегда остается зеленой, даже в активном состоянии */

/* Блок экспорта России (фиксированный справа) */
.russia-export-panel {
  position: fixed;
  top: 50%;
  right: 24px;
  transform: translateY(-50%);
  width: 600px;
  background: var(--card-bg);
  box-shadow: var(--card-shadow);
  border-radius: 12px;
  padding: 28px;
  z-index: 10;
  max-height: 85vh;
  overflow-y: auto;
}

.russia-export-panel__header {
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-bottom: 8px;
}

.russia-export-panel__title {
  margin: 0;
  font-size: 36px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.3px;
}

.russia-export-panel__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.russia-export-panel__stats {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.russia-export-panel__stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px 0;
}

.russia-export-panel__stat-label {
  font-size: 24px;
  color: var(--ink);
  opacity: 0.8;
}

.russia-export-panel__stat-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--ink);
}

.russia-export-panel__countries {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.russia-export-panel__countries-title {
  font-size: 28px;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 12px;
}

.russia-export-panel__countries-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.russia-export-panel__countries-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 650px;
  overflow: hidden;
  width: 100%;
}

.russia-export-panel__arrow {
  background: #efefef;
  border: none;
  border-radius: 6px;
  padding: 16px;
  color: var(--ink);
  cursor: pointer;
  transition: background-color 0.2s ease;
  width: 80px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.russia-export-panel__arrow svg {
  width: 60px;
  height: 60px;
}

.russia-export-panel__arrow:hover {
  background: rgba(0, 0, 0, 0.2);
}

.russia-export-panel__arrow:active {
  background: rgba(0, 0, 0, 0.3);
}

.russia-export-panel__arrow:disabled {
  background: #efefef;
	opacity: .8;
  color: rgba(0, 0, 0, 0.3);
  cursor: not-allowed;
}

/* SVG иконки уже имеют правильное направление */

.russia-export-panel__country {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
  background: rgba(0, 0, 0, 0.03);
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.2s ease;
  font-size: 36px;
  gap: 8px;
}

.russia-export-panel__country:hover {
  background: rgba(0, 0, 0, 0.08);
}

.russia-export-panel__country-number {
  font-size: 24px;
  color: var(--ink);
  font-weight: 700;
  min-width: 30px;
  text-align: right;
}

.russia-export-panel__country-name {
  font-size: 24px;
  color: var(--ink);
  font-weight: 500;
  flex: 1;
  margin-right: 8px;
}

.russia-export-panel__country-value {
  font-size: 24px;
  color: var(--ink);
  font-weight: 600;
  white-space: nowrap;
}

.russia-export-panel__country-placeholder {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  background: rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  opacity: 0.7;
  font-style: italic;
}

/* Адаптивность */
@media (max-width: 1200px) {
  .russia-export-panel {
    width: 280px;
    right: 16px;
  }
}

@media (max-width: 768px) {
  .russia-export-panel {
    position: relative;
    top: auto;
    right: auto;
    transform: none;
    width: 100%;
    margin: 16px;
    max-height: 400px;
  }
}

/* подсказка с названием региона (левый верх угла карты) */
.map__hover-name{
  position:fixed;left:38px;top:112px;z-index:3;
  padding:10px 14px;border-radius:10px;background:rgba(255,255,255,.9);
  color:var(--ink);font-size:24px;letter-spacing:-.3px;box-shadow:0 6px 18px rgba(0,0,0,.08);
  opacity:0;transform:translateY(-6px);pointer-events:none;transition:.15s ease;
}
.map__hover-name.is-visible{opacity:1;transform:translateY(0)}

/* === Модалка региона (карточка в HTML) === */
.region-modal{
  position:absolute;z-index:4;
  width:541px;
  background:var(--card-bg);box-shadow:var(--card-shadow);
  padding:26px;
	
	/* плавное появление */
  opacity:0;
  transform: translateY(10px) scale(.97);
  pointer-events:none;
  transition:
    opacity 280ms ease,
    transform 320ms cubic-bezier(.2,.7,0,1);
  will-change: opacity, transform;
	display: block;
}
.region-modal.is-open{
  opacity:1;
  transform: translateY(0) scale(1);
  pointer-events:auto;
}
.region-modal.dock-left{left:24px;right:auto}
.region-modal.dock-right{right:24px;left:auto}

/* заголовок и иконка */
.region-modal__top{display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
gap: 37px;}
.region-modal__icon{width:46px;height:46pz;flex:0 0 46px}
.region-modal__icon img{width: 100%;}
.region-modal__title{margin:0;font-size:54px;line-height:1.05;color:var(--ink);letter-spacing:-.8px;margin-bottom:158px}

/* крестик внутри карточки */
.region-modal__close{
  position:absolute;right:28px;top:28px;width:46px;height:46px;border:0;display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	-o-flex-direction: column;
	flex-direction: column;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
  background:#030404;cursor:pointer
}
.region-modal__close:hover{filter:brightness(.95)}

/* строки */
.district-row{display:flex;-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;width: 100%;justify-content:space-between;gap:4px;margin:12px 0}
.district-row__label{color:var(--ink);color: #030404;
font-size: 22px;
font-style: normal;
font-weight: 400;
line-height: normal;
font-family: "Inter";
letter-spacing: -0.32px;}
.district-row__value{color: #001D36;
font-size: 32px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.48px;}
.district-row__value .unit{font-weight:700}
.district-sep{border:0;border-top:1px solid #030404;margin:14px 0}
.region-modal__group-title{color:var(--ink);opacity:.7;margin:10px 0 4px}

.district-found{
  display:grid;
  grid-template-columns:auto 1fr; /* слева "Выявлено:", справа список */
  gap:24px;
  align-items:start;
}
.district-found__left{
  font-weight:700;
  padding-top:2px; /* выровнять с первой строкой справа */
}
.district-found__right{
  display:grid;
  row-gap:18px;
  justify-items:end;   /* всё вправо */
  text-align:right;
}
.found-row{
  display:flex;
  flex-direction:column;
  gap:4px;
  align-items:flex-end;
}
.found-row__label{ font-weight:700; }
.found-row__value{ font-weight:700; }


/* Вариант для «Данные по России», карточка открывается над кнопкой */
.region-modal--russia{bottom:calc(37px + 56px);left:50%;transform:translateX(-50%)} /* 56px ~ высота кнопки */
@media (max-width:680px){
  .region-modal{left:50%!important;right:auto!important;transform:translateX(-50%)}
}

/* ===== Idle-modal (из html, без изменений логики) ===== */
:root{
  --idle-bg:#ffffff;--idle-text:#030404;--idle-track:#e8efe9;--idle-accent:#0E86C7;--idle-btn:#0E86C7;--idle-btn-text:#0E86C7;
}
.idle-modal{position:fixed;inset:0;display:block;             /* всегда в потоке */
  opacity:0;                 /* спрятано визуально */
  pointer-events:none;       /* и некликабельно */
  transition: opacity 240ms ease;z-index:9999}
.idle-modal.is-open{
  opacity:1;
  pointer-events:auto;
}
.idle-modal.is-open{display:block}
.idle-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.35)}
.idle-modal__card{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:670px;background:var(--idle-bg);border-radius:12px;padding:89px 24px 69px;
  box-shadow:0 10px 36px rgba(0,0,0,.25);text-align:center
}
.idle-modal__title{color:var(--idle-text);font-weight:800;font-size:43px;margin-bottom:18px}
.idle-modal__ring{position:relative;width:171px;height:171px;margin:53px auto 64px}
.idle-modal__ring-circle{
  position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(var(--idle-accent) 0deg,var(--idle-track) 0deg 360deg);
  -webkit-mask:radial-gradient(circle 85px at 50% 50%,transparent 78px,#000 80px);
          mask:radial-gradient(circle 85px at 50% 50%,transparent 78px,#000 80px);
}
.idle-modal__ring-number{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:43px;font-weight:800;color:var(--idle-text)}
.idle-modal__btn{
  display:inline-block;margin-top:6px;padding:22px 0;border-radius:10px;border:2px solid var(--idle-btn);min-width:293px;font-size:24px;
  background:transparent;color:var(--idle-btn-text);font-weight:700;transition:.2s ease
}
.idle-modal__btn:hover{background:var(--idle-btn);color:#5e4f3d}

.map__yearbar {
  display: flex;
  align-items: center;
  gap: 16px;
  user-select: none;
	position: fixed;
	bottom: 53px;
	left: 50%;
	transform: translateX(-50%);
}

.yearbar__arrow {
  background: #efefef;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease;
  min-width: 104px;
  height: 104px;
  display: flex;
  align-items: center;
  justify-content: center;
	position: relative;
	z-index: 2;
}
.russiaExportPanelShowHideBlock{
	 background: #efefef;
  border: none;
  cursor: pointer;
  min-width: 160px;
  height: 104px;
  display: flex;
  font-size: 14px;
  align-items: center;
  justify-content: center;
	position: relative;
	z-index: 2;
}
.russiaExportPanelShowHideBlock input[type=checkbox]{
	margin-right: 7px;
}
.yearbar__arrow svg {
	width: 60px;
	height: 60px;
}

.yearbar__arrow:hover {
  background: rgba(0, 0, 0, 0.2);
}

.yearbar__arrow:active {
  background: rgba(0, 0, 0, 0.3);
}

.yearbar__arrow:disabled {
	  background: #efefef;
	opacity: 0.7;
  color: rgba(0, 0, 0, 0.3);
  cursor: not-allowed;
}
.yearbar__wrap {
  position: relative;
  cursor: pointer;
}
.yearbar__knob {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #111;
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
  pointer-events: none; /* перетаскиваем по обёртке */
}
.yearbar__label { font-size: 14px; }

#yearKnob {
  z-index: 10;
}
#yearTrack {
  z-index: 1;
}