/**
 * Адаптивный масштаб UI и пинов на 3D-панораме.
 * sm: ≤768px — 0.5 от исходного; md: 769–1280px — 0.7; lg: ≥1281px — 0.8.
 * Исходные (100%) размеры — в комментариях у переменных *-base.
 */
:root {
  --ui-scale: 0.7;

  /* --- Пины (исходный 100%) --- */
  --pin-circle-base: 50px;              /* original */
  --pin-icon-base: 50px;                /* original */
  --pin-border-base: 1.5px;             /* original */
  --pin-info-circle-base: 33px;         /* original */
  --pin-info-panel-height-base: 29px;   /* original */
  --pin-info-panel-left-base: 17px;     /* original */
  --pin-info-panel-max-base: 187px;     /* original */
  --pin-info-title-size-base: 10px;     /* original */
  --pin-info-title-pl-base: 32px;       /* original */
  --pin-info-title-pr-base: 11px;       /* original */
  --pin-info-border-hover-base: 2px;    /* original */
  --pin-house-text-base: 14px;          /* original */
  --pin-house-pad-y-base: 8px;          /* original */
  --pin-house-pad-x-base: 20px;         /* original */
  --pin-house-body-height-base: 36px;   /* original */
  --pin-pan-height-base: 40px;          /* original */
  --pin-pan-min-width-base: 80px;       /* original */
  --pin-pan-pad-x-base: 20px;           /* original */
  --pin-pan-gap-base: 10px;             /* original */
  --pin-pan-icon-base: 20px;            /* original */
  --pin-pan-title-base: 16px;           /* original */
  --pin-pan-title-max-base: 200px;      /* original */

  --pin-circle-size: calc(var(--pin-circle-base) * var(--ui-scale));
  --pin-icon-size: calc(var(--pin-icon-base) * var(--ui-scale));
  --pin-border: calc(var(--pin-border-base) * var(--ui-scale));
  --pin-info-circle-size: calc(var(--pin-info-circle-base) * var(--ui-scale));
  --pin-info-panel-height: calc(var(--pin-info-panel-height-base) * var(--ui-scale));
  --pin-info-panel-left: calc(var(--pin-info-panel-left-base) * var(--ui-scale));
  --pin-info-panel-max: calc(var(--pin-info-panel-max-base) * var(--ui-scale));
  --pin-info-title-size: calc(var(--pin-info-title-size-base) * var(--ui-scale));
  --pin-info-title-pl: calc(var(--pin-info-title-pl-base) * var(--ui-scale));
  --pin-info-title-pr: calc(var(--pin-info-title-pr-base) * var(--ui-scale));
  --pin-info-border-hover: calc(var(--pin-info-border-hover-base) * var(--ui-scale));
  --pin-house-text: calc(var(--pin-house-text-base) * var(--ui-scale));
  --pin-house-pad-y: calc(var(--pin-house-pad-y-base) * var(--ui-scale));
  --pin-house-pad-x: calc(var(--pin-house-pad-x-base) * var(--ui-scale));
  --pin-house-body-height: calc(var(--pin-house-body-height-base) * var(--ui-scale));
  --pin-pan-height: calc(var(--pin-pan-height-base) * var(--ui-scale));
  --pin-pan-min-width: calc(var(--pin-pan-min-width-base) * var(--ui-scale));
  --pin-pan-pad-x: calc(var(--pin-pan-pad-x-base) * var(--ui-scale));
  --pin-pan-gap: calc(var(--pin-pan-gap-base) * var(--ui-scale));
  --pin-pan-icon: calc(var(--pin-pan-icon-base) * var(--ui-scale));
  --pin-pan-title: calc(var(--pin-pan-title-base) * var(--ui-scale));
  --pin-pan-title-max: calc(var(--pin-pan-title-max-base) * var(--ui-scale));
  --pin-shadow: 0px 0px 10px 0px rgba(34, 60, 80, 0.7);

  /* --- UI (исходный 100%) --- */
  --ui-edge-base: 24px;                 /* original */
  --ui-edge-lg-base: 60px;              /* original */
  --ui-menu-bottom-base: 60px;          /* original */
  --ui-menu-width-base: 250px;          /* original */
  --ui-menu-icon-base: 60px;            /* original */
  --ui-menu-icon-inner-base: 30px;      /* original */
  --ui-menu-btn-font-base: 20px;        /* original */
  --ui-menu-btn-min-height-base: 50px;  /* original */
  --ui-round-btn-base: 50px;            /* original */
  --ui-round-btn-icon-base: 20px;      /* original */
  --ui-font-base: 16px;                 /* original */
  --ui-font-sm-base: 13px;              /* original */
  --ui-top-blocks-gap-base: 30px;       /* original */
  --ui-top-blocks-pad-y-base: 10px;     /* original */
  --ui-top-blocks-pad-x-base: 20px;     /* original */
  --ui-top-blocks-min-width-base: 128px;/* original */
  --ui-top-blocks-panel-top-base: 43px; /* original, заменено на calc в pan-ui.css */
  --ui-top-menu-sidebar-base: 290px;    /* original */
  --ui-top-menu-icon-w-base: 17px;      /* original */
  --ui-top-menu-icon-h-base: 14px;      /* original */
  --ui-filter-width-base: 300px;        /* original */
  --ui-filter-pad-base: 20px;           /* original */
  --ui-filter-h1-base: 24px;            /* original */
  --ui-filter-label-base: 14px;         /* original */
  --ui-map-width-base: 320px;           /* original */
  --ui-map-width-lg-base: 480px;        /* original */
  --ui-map-max-height-base: 420px;      /* original */
  --ui-map-max-height-lg-base: 560px;   /* original */
  --ui-back-height-base: 50px;          /* original */
  --ui-back-min-width-base: 128px;      /* original */
  --ui-back-pad-y-base: 10px;           /* original */
  --ui-back-pad-x-base: 20px;           /* original */
  --ui-back-gap-base: 10px;             /* original */
  --ui-back-arrow-w-base: 18px;         /* original */
  --ui-back-arrow-h-base: 14px;         /* original */
  --ui-zoom-btn-min-base: 44px;         /* original */
  --ui-zoom-btn-font-base: 18px;        /* original */
  --ui-zoom-btn-pad-x-base: 12px;       /* original */
  --ui-zoom-gap-base: 6px;              /* original */

  --ui-edge: calc(var(--ui-edge-base) * var(--ui-scale));
  --ui-edge-lg: calc(var(--ui-edge-lg-base) * var(--ui-scale));
  --ui-menu-bottom: calc(var(--ui-menu-bottom-base) * var(--ui-scale));
  --ui-menu-width: calc(var(--ui-menu-width-base) * var(--ui-scale));
  --ui-menu-icon: calc(var(--ui-menu-icon-base) * var(--ui-scale));
  --ui-menu-icon-inner: calc(var(--ui-menu-icon-inner-base) * var(--ui-scale));
  --ui-menu-btn-font: calc(var(--ui-menu-btn-font-base) * var(--ui-scale));
  --ui-menu-btn-min-height: calc(var(--ui-menu-btn-min-height-base) * var(--ui-scale));
  --ui-round-btn: calc(var(--ui-round-btn-base) * var(--ui-scale));
  --ui-round-btn-icon: calc(var(--ui-round-btn-icon-base) * var(--ui-scale));
  --ui-font: calc(var(--ui-font-base) * var(--ui-scale));
  --ui-font-sm: calc(var(--ui-font-sm-base) * var(--ui-scale));
  --ui-top-blocks-gap: calc(var(--ui-top-blocks-gap-base) * var(--ui-scale));
  --ui-top-blocks-pad-y: calc(var(--ui-top-blocks-pad-y-base) * var(--ui-scale));
  --ui-top-blocks-pad-x: calc(var(--ui-top-blocks-pad-x-base) * var(--ui-scale));
  --ui-top-blocks-min-width: calc(var(--ui-top-blocks-min-width-base) * var(--ui-scale));
  --ui-top-blocks-panel-gap: 3px;
  --ui-top-blocks-panel-list-py-base: 8px;     /* original */
  --ui-top-blocks-panel-list-pl-base: 0px;     /* original */
  --ui-top-blocks-panel-list-pl-yard-base: 12px; /* original, 3-колоночный список дворов */
  --ui-top-blocks-panel-option-mx-base: 8px;   /* original */
  --ui-top-blocks-panel-option-py-base: 12px;  /* original */
  --ui-top-blocks-panel-option-pl-base: 20px;  /* original */
  --ui-top-blocks-panel-option-pr-base: 20px;  /* original */
  --ui-top-blocks-panel-list-py: calc(var(--ui-top-blocks-panel-list-py-base) * var(--ui-scale));
  --ui-top-blocks-panel-list-pl: calc(var(--ui-top-blocks-panel-list-pl-base) * var(--ui-scale));
  --ui-top-blocks-panel-option-mx: calc(var(--ui-top-blocks-panel-option-mx-base) * var(--ui-scale));
  --ui-top-blocks-panel-option-py: calc(var(--ui-top-blocks-panel-option-py-base) * var(--ui-scale));
  --ui-top-blocks-panel-option-pl: calc(var(--ui-top-blocks-panel-option-pl-base) * var(--ui-scale));
  --ui-top-blocks-panel-option-pr: calc(var(--ui-top-blocks-panel-option-pr-base) * var(--ui-scale));
  --ui-top-blocks-panel-left: calc(0px - var(--ui-top-blocks-panel-list-pl) - var(--ui-top-blocks-panel-option-pl));
  --ui-top-menu-sidebar: var(--ui-top-menu-sidebar-base);
  --ui-top-menu-icon-w: calc(var(--ui-top-menu-icon-w-base) * var(--ui-scale));
  --ui-top-menu-icon-h: calc(var(--ui-top-menu-icon-h-base) * var(--ui-scale));
  --ui-filter-width: calc(var(--ui-filter-width-base) * var(--ui-scale));
  --ui-filter-pad: calc(var(--ui-filter-pad-base) * var(--ui-scale));
  --ui-filter-h1: calc(var(--ui-filter-h1-base) * var(--ui-scale));
  --ui-filter-label: calc(var(--ui-filter-label-base) * var(--ui-scale));
  --ui-map-width: calc(var(--ui-map-width-base) * var(--ui-scale));
  --ui-map-width-lg: calc(var(--ui-map-width-lg-base) * var(--ui-scale));
  --ui-map-max-height: calc(var(--ui-map-max-height-base) * var(--ui-scale));
  --ui-map-max-height-lg: calc(var(--ui-map-max-height-lg-base) * var(--ui-scale));
  --ui-back-height: calc(var(--ui-back-height-base) * var(--ui-scale));
  --ui-back-min-width: calc(var(--ui-back-min-width-base) * var(--ui-scale));
  --ui-back-pad-y: calc(var(--ui-back-pad-y-base) * var(--ui-scale));
  --ui-back-pad-x: calc(var(--ui-back-pad-x-base) * var(--ui-scale));
  --ui-back-gap: calc(var(--ui-back-gap-base) * var(--ui-scale));
  --ui-back-arrow-w: calc(var(--ui-back-arrow-w-base) * var(--ui-scale));
  --ui-back-arrow-h: calc(var(--ui-back-arrow-h-base) * var(--ui-scale));
  --ui-zoom-btn-min: calc(var(--ui-zoom-btn-min-base) * var(--ui-scale));
  --ui-zoom-btn-font: calc(var(--ui-zoom-btn-font-base) * var(--ui-scale));
  --ui-zoom-btn-pad-x: calc(var(--ui-zoom-btn-pad-x-base) * var(--ui-scale));
  --ui-zoom-gap: calc(var(--ui-zoom-gap-base) * var(--ui-scale));
}

/* lg — большие мониторы */
@media (min-width: 1281px) {
  :root {
    --ui-scale: 0.8;
  }
}

/* sm — мобильные */
@media (max-width: 768px) {
  :root {
    --ui-scale: 0.5;
  }
}