/* мобильная адаптация: house — правки только для узких экранов (@media max-width) */
/* зона: раздел «Дом» — План участка (#tab-plan), 3D и стройка по шагам (#tab-3d), Интерьер (#tab-interior) */

@media (max-width: 760px) {
  /* --- общий каркас разделов: без горизонтального скролла, всё на ширину --- */
  #tab-plan.on, #tab-3d.on { gap: 16px; }
  #tab-plan, #tab-3d, #tab-interior { max-width: 100%; }
  .stage, .side, #side-plan, #side-3d { max-width: 100%; min-width: 0; }
  .stage { border-radius: 12px; }

  /* --- канвас плана и 3D: на всю ширину, разумная высота, жесты пальцем --- */
  .svgwrap, .glwrap { height: 66vh; min-height: 340px; }
  .svgwrap svg, .glwrap canvas { touch-action: none; }

  /* --- тулбары: прокрутка по горизонтали, кнопки удобны пальцем (≥40px) --- */
  .toolbar { gap: 8px; padding: 8px 10px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .toolbar::-webkit-scrollbar { display: none; }
  .toolbar button { min-height: 40px; padding: 8px 14px; font-size: 13px; }
  .toolbar .accent-btn { padding: 8px 16px; }
  .toolbar label { min-height: 40px; font-size: 12.5px; }
  .toolbar .sep { height: 24px; }
  .sys-toggles { gap: 10px; flex-wrap: nowrap; }

  /* подсказки «колесо/ЛКМ/ПКМ» — для мыши, на телефоне прячем */
  .stage .hint { display: none; }

  /* --- боковые панели под канвасом: полной ширины, читаемые --- */
  .side { padding: 6px 2px 2px; }
  .side h3 { font-size: 24px; }
  .side .big { font-size: 36px; }
  table.sys-legend td { padding: 8px 4px; }

  /* --- плеер «Стройка по шагам»: нижний лист, который сворачивается --- */
  /* поднят над нижней навигацией (m-core: фикс-панель 58px + safe-area, отступ контента 96px) */
  .bp { left: 8px; right: 8px; top: auto; bottom: calc(66px + env(safe-area-inset-bottom)); width: auto; max-height: 50vh; gap: 8px; z-index: 40; }
  .bp-bar { padding: 8px; gap: 6px; }
  .bp-btn { width: 44px; height: 44px; font-size: 20px; }
  .bp-play { font-size: 14px; }
  .bp-range { min-width: 40px; }
  .bp-collapse { display: grid; }               /* перекрывает [hidden]: показываем только на телефоне */
  .bp.collapsed { max-height: none; }
  .bp.collapsed .bp-card { display: none; }       /* свёрнуто: видна только панель управления, модель открыта */
  .bp-card { max-height: 44vh; padding: 14px 16px 16px; }
  .bp-card h3 { font-size: 24px; }
  .bp-shots img { height: 96px; }

  /* --- интерьер: концепция, палитра, выбор комнаты --- */
  .i-concept { gap: 16px; margin-bottom: 20px; }
  .i-pal { grid-template-columns: 1fr 1fr; }
  .i-main { gap: 16px; }
  .i-side h3 { font-size: 24px; }
  .i-total b { font-size: 26px; }
  /* карточки товаров — одной колонкой */
  .i-items { display: block; }
  .i-it { grid-template-columns: 14px minmax(0, 1fr) auto; column-gap: 8px; }

  /* --- прогулка 360°: панорама на всю ширину, мини-карта меньше, стрелки крупнее --- */
  .pano-view { height: 60vh; min-height: 300px; border-radius: 12px; }
  .pano-help { display: none; }
  .pano-title { font-size: 13px; padding: 6px 10px; left: 12px; top: 12px; }
  .pano-title b { font-size: 16px; }
  .pano-fs { right: 12px; top: 12px; width: 40px; height: 40px; }
  .pano-map { width: 38%; max-width: 160px; right: 12px; bottom: 12px; }
  .pano-arrow { padding: 8px; }
  .pano-arrow span { display: none; }
  .pano-arrow i { width: 34px; height: 34px; font-size: 15px; }
}

@media (max-width: 420px) {
  .svgwrap, .glwrap { height: 62vh; min-height: 300px; }
  .toolbar button { padding: 8px 12px; }
  .toolbar label { font-size: 12px; }

  .bp { left: 6px; right: 6px; bottom: calc(64px + env(safe-area-inset-bottom)); max-height: 50vh; }
  .bp-card { max-height: 42vh; padding: 12px 14px 14px; }
  .bp-card h3 { font-size: 22px; }
  .bp-btn { width: 42px; height: 42px; }

  .i-pal { grid-template-columns: 1fr 1fr; }
  .pano-view { height: 56vh; }
  .pano-map { width: 42%; max-width: 140px; }
  .pano-arrow i { width: 32px; height: 32px; }
}