/* ТЗ-23 З3 (11.11.2026): вкладка «Еда» на десктопе не показывала карту.

   modules/view_tabs.js доклеивает в конец <head> свой рантайм-<style> с
   «body.view-food #map{visibility:hidden}» и разворачивает панель «Вещи на
   борту» на весь экран (kit/kit.css: left/right/top/bottom 12px). На 1400×900
   это белый прямоугольник [12,48,1388,806] поверх всего кадра: кадры матрицы
   «Еда» не могли показать ни гексы (центр кадра попадал в div панели), ни
   тёмную тему (замер meanLum = 201.9 и в ru, и в en — светлая тема под любой
   темой). Тот же дефект ломал читаемость: menu-type.css:20 красит текст
   панели в #FFFFFF, а kit.css держит её фон --bg-surface:#fff → белые буквы
   по белому.

   Решение то же, что в З2 для 375px: карта важнее панелей. Панель становится
   боковой колонкой, левый «Пульт карты» в этой вкладке скрыт самим
   view_tabs.js, так что место с левой стороны свободно.

   Правила с !important и префиксом html body: без этого рантайм-<style>,
   доклеиваемый в конец head, выигрывал каскад по порядку, а не по весу. */

@media (min-width: 421px) {
    html body.view-food #map,
    html body.view-food #map-container {
        visibility: visible !important;
    }

    html body.view-food #ih-kit-panel:not([hidden]) {
        left: 12px !important;
        right: auto !important;
        top: 48px !important;
        bottom: 46px !important;
        /* 620px = 300 (боковик селектов) + 320 (таблица); правый край 632 <
           центра кадра 700, поэтому гекс под пальцем остаётся свободен */
        width: min(620px, 46vw);
    }

    html body.view-food .ih-kit-win-body {
        grid-template-columns: minmax(240px, 300px) 1fr;
    }

    /* линейка расстояния живёт в bottom-left со сдвигом 372px (под левое меню);
       без сдвига она уехала бы под боковую панель «Еды» */
    html body.view-food .leaflet-bottom.leaflet-left {
        left: calc(min(620px, 46vw) + 40px) !important;
    }

    /* панель не должна обрезаться из-за длинных заголовков таблиц */
    html body.view-food #ih-kit-panel:not([hidden]) {
        overflow: hidden;
    }

    /* Плашка шкал «Мир/Экран» и HUD пересчёта привязаны к левому пульту,
       которого в этой вкладке нет: color_scale.js при нулевой ширине меню
       откатывается на left:420, а style.css:1231 центрирует HUD от 50 %.
       Без сдвига оба залезали под панель «Еды» — в ru/dark/food от плашки
       шкал торчал обрывок «…13.8», а «Готово · 100 % · 237/237» резался по
       краю панели. Сдвиг = правый край панели (12 + min(620px, 46vw)) плюс
       зазор; на узких окнах min() по 46vw, поэтому ничего не уезжает за
       правый край кадра. */
    html body.view-food #scale-mode {
        left: calc(min(620px, 46vw) + 44px) !important;
    }
    html body.view-food #recalc-hud {
        left: calc(min(620px, 46vw) + 44px) !important;
        transform: none !important;
        max-width: calc(100vw - min(620px, 46vw) - 80px);
    }
}
