/* === ОБЩИЕ СТИЛИ === */
        html, body { 
            height: 100%; 
            width: 100%; 
            margin: 0; 
            padding: 0; 
            font-family: 'Roboto', Arial, sans-serif; 
            overflow: hidden; 
            background-color: #1a1a1a; 
            -webkit-tap-highlight-color: transparent; 
        }

        #map-container { 
            position: absolute; 
            top: 0; bottom: 0; left: 0; right: 0;
            width: 100%; height: auto;
            z-index: 1;
        }
        body.view-islands.isl-table-on #map-container { bottom: calc(min(52vh, 560px) + 8px); }
        body.view-islands.isl-table-on.isl-dock-on #map-container { bottom: calc(min(42vh, 420px) + 8px); }

        #map { height: 100%; width: 100%; }

        /* === КОМПАКТНАЯ ЛЕГЕНДА === */
        
        #oc-compare-bar { display:flex; flex-wrap:wrap; gap:6px; margin:6px 0 2px; }
        #oc-compare-bar .oc-chip {
            border:1px solid #888; background:#fff; color:#111; border-radius:14px;
            padding:4px 10px; cursor:pointer; font:13px/1.2 sans-serif;
        }
        #oc-compare-bar .oc-chip.active { background:#1a73e8; color:#fff; border-color:#1a73e8; }
        #oc-compare-hint { font-size:12px; color:#333; margin:2px 0 8px; }
        .legend {
            padding: 6px 8px;
            font: 11px Arial, sans-serif;
            background: rgba(255,255,255,0.95);
            box-shadow: 0 0 15px rgba(0,0,0,0.2);
            border-radius: 5px;
            line-height: 15px;
            color: #333;
            min-width: 168px;
            width: auto;
            max-width: 210px;
            max-height: 38vh !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
            position: absolute;
            bottom: 30px;
            right: 10px;
            z-index: 1000;
        }
        .legend i {
            width: 14px; height: 14px; float: left; margin-right: 6px; opacity: 0.85; border: 1px solid #999;
        }
        .legend h4 {
            margin: 0 0 4px; font-size: 11px; text-align: center;
        }
        body.dark-theme .legend { background: rgba(50,50,50,0.9); color: #f0f0f0; }
        body.dark-theme .legend h4 { color: #f0f0f0; }

        /* === ПАНЕЛЬ УПРАВЛЕНИЯ === */
        .controls-container {
            position: absolute;
            top: 48px; left: 12px !important; /* P1: пульт тоже под topbar */
            background: rgba(255, 255, 255, 0.95); 
            padding: 15px;
            border-radius: 8px; 
            box-shadow: 0 4px 20px rgba(0,0,0,0.15);
            z-index: 4000; 
            display: flex;
            flex-direction: column;
            gap: 12px;
            width: 378px; 
            max-width: 90%; 
            max-height: calc(100vh - 40px);
            overflow-y: auto;
            box-sizing: border-box;
            transition: transform 0.3s ease;
        }
        /* W12: каноническая z-шкала (2026-09-20). Новые слои — только в эти ступени:
             1      карта / содержимое (#map, #map-container)
             30     внутри-карточные контролы (leaflet, kit internals)
             800    легенда карты
             1000   панели внутри map-container (.controls-container и т.п.)
             2100   всплывающие панели поверх карты (right panels)
             2200   тултипы/хинты
             2400   kit-panel (еда/трюм) — fixed в body
             10001  мелкие fixed-кнопки
             20010  island-dock
             39990  мобильная шторка (view_tabs sheet)
             50000  #app-topbar — всегда поверх контента
             59990  оверлей перехода между вьюхами (#view-nav-overlay) — самый верх */
        /* W1: единый topbar 40px на всех вьюхах (табы вынесены из controls-container) */
        #app-topbar {
            position: fixed; top: 0; left: 0; right: 0; height: 40px; z-index: 50000;
            display: flex; align-items: center; gap: 8px;
            padding: 0 10px; box-sizing: border-box;
            background: #fff; border-bottom: 1px solid #dbe3ea;
            box-shadow: 0 1px 6px rgba(0,0,0,.10);
        }
        #view-tabs {
            display: flex; gap: 4px; flex: 0 1 auto;
            overflow-x: auto; scrollbar-width: none;
        }
        #view-tabs::-webkit-scrollbar { display: none; }
        .view-tab {
            flex: 0 0 auto;
            padding: 6px 10px;
            font: 700 13px/1.2 sans-serif;
            border: 1px solid #1b5e20;
            border-radius: 6px;
            background: #fff; color: #1b5e20;
            cursor: pointer;
            white-space: nowrap;
        }
        .view-tab:hover { background: #e8f5e9; color: #1b5e20; }
        .view-tab.on { background: #1b5e20; color: #fff; }
        .view-tab:focus-visible { outline: 2px solid #1b5e20; outline-offset: 2px; }
        .view-tab:disabled { opacity: .45; cursor: not-allowed; }
        #view-tab-hint {
            margin: 0; font-size: 12px; color: #444; line-height: 1.35;
            flex: 1 1 auto; min-width: 0;
            white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
        }
        #islands-overlay-head { flex-wrap: wrap; }
        #islands-overlay-head select.col-search, input.col-search {
            min-width: 8.5em; flex: 1 1 8.5em; max-width: 100%;
        }
        #isl-hl-legend { font: 600 11px/1.2 sans-serif; color: #92400e; background: #fff3cd; border-radius: 4px; padding: 2px 6px; }
        #islands-grid .ag-row-hover, #islands-grid .ag-row-selected { background: #fff3cd !important; }
        #islands-grid .ag-header, #inline-table-display-area .ag-header,
        #island-dock .fd-tbl thead th, #ih-dishes-panel thead th, .fd-tbl thead th {
            position: sticky; top: 0; z-index: 3; background: #fafafa;
        }
        @media (max-width: 768px) {
            #app-topbar { height: auto; min-height: 40px; flex-wrap: wrap; align-items: flex-start; padding: 4px 6px; }
            #view-tabs { flex: 1 1 100%; }
            #view-tab-hint { display: block; flex: 1 1 100%; white-space: normal; overflow: visible; text-overflow: clip; }
            .controls-container { top: 78px; }
            .view-tab { padding: 6px 8px; font-size: 12px; }
        }
        /* W10: деление пульта — общие этажи vs контекстные */
        .panel-caption { font: 700 12px/1.3 system-ui,sans-serif; color: #475569; padding: 0 0 2px; }
        .panel-caption-ctx { font-weight: 400; color: #94a3b8; font-size: 10.5px; }
        .floor-ctx > summary { border-left: 3px solid #0e7490; padding-left: 6px; }
        .ctx-tag { font-size: 9.5px; color: #0e7490; border: 1px solid #99e3f0; border-radius: 4px; padding: 0 4px; vertical-align: middle; }
        @media (max-width: 768px) {
            #app-topbar { height: auto; min-height: 40px; flex-wrap: wrap; align-items: flex-start; padding: 4px 6px; }
            #view-tabs { flex: 1 1 100%; }
            #view-tab-hint { display: block; flex: 1 1 100%; white-space: normal; overflow: visible; text-overflow: clip; }
            .controls-container { top: 78px; }
            .view-tab { padding: 6px 8px; font-size: 12px; }
        }
        @media (max-width: 420px) {
            #view-tabs { scrollbar-width: thin; }
            #view-tabs::-webkit-scrollbar { display: block; height: 4px; }
            .view-tab { padding: 4px 6px; font-size: 12px; }
        }
        body.view-islands #floor-food { display: none; }

        #islands-overlay {
            display: none;
            flex-direction: column;
            position: fixed;
            left: 400px;
            right: 8px;
            bottom: 8px;
            top: auto;
            width: auto;
            height: min(52vh, 560px);
            background: #fff;
            z-index: 2500;
            box-shadow: 0 10px 40px rgba(0,0,0,0.3);
            border-radius: 8px;
            overflow: hidden;
            border: 1px solid #ddd;
        }
        body.view-islands #islands-overlay.open { display: flex; }
        body.view-islands.isl-dock-on #islands-overlay.open {
            display: flex !important;
            right: 8px;
            height: min(42vh, 420px);
        }
        body.view-islands.isl-dock-on #island-dock.open {
            bottom: calc(min(42vh, 420px) + 16px);
            top: 56px;
            height: auto;
            min-height: 200px;
            max-height: none;
        }
        #islands-overlay-head {
            min-height: 40px; padding: 6px 12px; display: flex; align-items: center; gap: 10px;
            background: #f5f5f5; border-bottom: 1px solid #ddd; font: 700 15px/1.3 sans-serif;
        }
        #islands-overlay .ov-btn {
            border: 1px solid #c9c9c9; background: #fff; border-radius: 6px; font: 600 13px sans-serif;
            padding: 4px 10px; cursor: pointer; color: #333;
        }
        #islands-overlay .ov-btn:hover { background: #f0f0f0; }
        #islands-overlay.collapsed { height: 40px !important; }
        #islands-overlay.collapsed #islands-grid { display: none; }
        #islands-overlay.maximized { left: 8px !important; top: 64px !important; height: calc(100vh - 72px) !important; }
        #isl-csv { font: 600 13px sans-serif; padding: 6px 12px; cursor: pointer; }
        #islands-overlay-head .spacer { margin-left: auto; }
        #islands-grid { flex: 1; min-height: 220px; }
        #islands-grid .ag-header-cell-label,
        #islands-grid .ag-header-cell-text {
            white-space: normal !important;
            line-height: 1.2 !important;
            overflow: visible !important;
            text-overflow: clip !important;
            font-size: 13px !important;
            font-weight: 700 !important;
            color: #111 !important;
        }
        #islands-grid .ag-header { min-height: 52px !important; }
        #islands-grid .ag-header-cell { padding: 6px 8px !important; }
        #islands-grid .ag-cell { font-size: 13px !important; line-height: 1.35 !important; }
        #islands-grid .ag-row { min-height: 32px; }
        #island-dock { display: none; position: fixed; z-index: 20010; background: #fff;
            box-shadow: 0 4px 20px rgba(0,0,0,0.2); flex-direction: column; overflow: hidden; }
        #island-dock.open { display: flex; }
        #island-dock .fd-body { overflow: auto; flex: 1; padding: 10px 12px; font: 13px/1.45 sans-serif; }
        body.view-islands .legend { bottom: 300px; min-width: 180px; }
        body.view-islands.isl-dock-on .legend { right: auto; left: 400px; bottom: 16px; }
        body.view-islands .who-row {
            display: grid !important;
            grid-template-columns: 86px 1fr 52px;
            grid-template-rows: auto;
            gap: 0 4px;
            margin: 0;
            min-height: 0;
        }
        body.view-islands .who-name { grid-column: 1; font-size: 11px; padding: 0 2px; }
        body.view-islands .who-row input[type=range] { grid-column: 2; height: 14px; }
        body.view-islands .who-row input[type=number] { grid-column: 3; width: 52px; height: 20px; }
        body.view-islands .who-title { margin: 0 0 1px; font-size: 11px; }
        body.view-islands #isl-stat { margin: 2px 0; font-size: 11px; }
        body.view-islands .floor { margin: 2px 0; }
        body.view-islands .floor > summary { padding: 3px 6px; font-size: 12px; }
        body.view-islands .controls-container { padding: 8px 10px; }
        body.view-islands .legend,
        body.view-islands.isl-dock-on .legend {
            max-height: 38vh !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
            line-height: 14px;
            font-size: 11px;
        }
        body.view-islands .legend { bottom: calc(52vh + 16px); }
        @media (max-width: 520px) {
            #islands-overlay { left: 8px; right: 8px; height: 42vh; bottom: 8px; }
            body.view-islands.isl-dock-on #islands-overlay.open { right: 8px; height: 36vh; }
            #island-dock.open { width: calc(100vw - 16px) !important; left: 8px !important; right: 8px !important;
                height: 40vh !important; top: auto; bottom: 44vh; }
            body.view-islands .legend, body.view-islands.isl-dock-on .legend { left: 8px; right: auto; bottom: 44vh; min-width: 140px; }
        }
        body.view-food #floor-look,
        body.view-food #floor-calc,
        body.view-food #floor-table,
        body.view-food #floor-islands,
        body.view-food #floor-food,
        body.view-food #floor-face { display: none; }
        body.view-dishes #floor-look,
        body.view-dishes #floor-calc,
        body.view-dishes #floor-table,
        body.view-dishes #floor-islands,
        body.view-dishes #floor-food,
        body.view-dishes #floor-face { display: none; }
        body.view-all #floor-islands,
        body.view-all #floor-food { display: none; }
        #floor-islands, #floor-food { display: none; }
        body.view-islands #floor-islands { display: block; }
        /* W1: на служебных вьюхах левое меню пустое — скрываем целиком (табы в topbar) */
        body.view-food .controls-container,
        body.view-dishes .controls-container,
        body.view-qa .controls-container { display: none !important; }

        .control-item { 
            display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
        }
        
        /* Поиск адреса */
        .address-search-container {
            position: relative; 
            width: 100%;
        }
        
        #address-search-input {
            flex-grow: 1;
            padding: 6px;
            border: 1px solid #ccc;
            border-radius: 4px;
            width: 100%;
            box-sizing: border-box;
        }
        
        #address-search-button {
            padding: 6px 12px;
            background: #2196F3;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            width: 100%;
            margin-top: 5px;
        }

        /* Выпадающий список поиска */
        #search-results-dropdown {
            position: absolute;
            top: 100%;
            left: 0;
            width: 100%;
            background: white;
            border: 1px solid #ccc;
            border-top: none;
            border-radius: 0 0 4px 4px;
            max-height: 200px;
            overflow-y: auto;
            z-index: 2000;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            display: none;
        }
        
        .search-result-item {
            padding: 8px 10px;
            font-size: 12px;
            cursor: pointer;
            border-bottom: 1px solid #eee;
            color: #333;
            line-height: 1.4;
        }
        .search-result-item:hover { background-color: #f0f0f0; }

        /* === ТАБЛИЦА ДАННЫХ (AG GRID) === */
        #inline-table-display-area {
            display: none;
            flex-direction: column;
            position: fixed;
            top: 48px; /* P1: под topbar #app-topbar 40px (W1-спека: top>=44) */
            left: 400px;
            width: min(950px, calc(100vw - 412px));
            height: 600px;
            background: white;
            z-index: 3000;
            box-shadow: 0 10px 40px rgba(0,0,0,0.3);
            border-radius: 8px;
            resize: both;
            overflow: hidden;
            min-width: 500px;
            min-height: 300px;
            border: 1px solid #ddd;
        }

        #inline-table-header {
            height: 45px;
            min-height: 45px;
            padding: 0 15px;
            background: #f5f5f5;
            border-bottom: 1px solid #ddd;
            display: flex;
            justify-content: flex-end; 
            align-items: center;
            box-sizing: border-box;
            flex-shrink: 0;
            cursor: move;
            user-select: none;
        }

        /* Кнопка экспорта (Зеленая) */
        .ag-export-btn {
            background-color: #2e7d32 !important;
            color: white !important;
            border: none !important;
            border-radius: 4px !important;
            padding: 6px 14px !important;
            font-family: 'Roboto', sans-serif;
            font-weight: 500;
            text-transform: uppercase;
            cursor: pointer !important;
            font-size: 11px !important;
            margin-right: auto; 
            margin-left: 0;
            box-shadow: 0 2px 4px rgba(0,0,0,0.2);
            display: flex;
            align-items: center;
            gap: 5px;
            transition: background 0.2s;
        }
        .ag-export-btn:hover { background-color: #1b5e20 !important; }

        /* Кнопка закрытия (Крестик) */
        #close-inline-table-button {
            background: #eeeeee;
            border: 1px solid #ddd;
            border-radius: 4px;
            width: 28px;
            height: 28px;
            font-size: 18px;
            cursor: pointer;
            color: #333;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.2s;
            padding: 0;
            line-height: 1;
        }
        #close-inline-table-button:hover {
            background: #f44336;
            color: white;
            border-color: #f44336;
        }

        #react-table-container {
            flex: 1;
            width: 100%;
            height: 100%;
            background: white;
            overflow: auto;
        }

        /* === СТИЛИ ДЛЯ ПОДПИСЕЙ ТОЧЕК (ИСПРАВЛЕННЫЕ) === */
        .static-point-label {
            background-color: rgba(255, 255, 255, 0.9);
            border: 1px solid #ccc;
            border-radius: 4px;
            padding: 2px 6px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.3);
            color: #333;
            font-family: 'Roboto', Arial, sans-serif;
            font-weight: 500;
            font-size: 12px;
            line-height: 1.2;
            text-shadow: none;
            white-space: nowrap;
            pointer-events: none;
            margin-top: -10px;
            margin-left: 10px;
        }

        body.dark-theme .static-point-label {
            background-color: rgba(40, 40, 40, 0.9);
            border-color: #666;
            color: #e0e0e0;
            box-shadow: 0 2px 5px rgba(0,0,0,0.5);
        }

        .leaflet-tooltip-top:before, 
        .leaflet-tooltip-bottom:before, 
        .leaflet-tooltip-left:before, 
        .leaflet-tooltip-right:before {
            display: none !important;
        }

        /* === ТЕМНАЯ ТЕМА ИНТЕРФЕЙСА === */
        body.dark-theme .controls-container { background: rgba(40, 40, 40, 0.95); color: #f0f0f0; }
        body.dark-theme .control-item label { color: #f0f0f0; }
        body.dark-theme #inline-table-display-area { background: #1e1e1e; border-color: #444; }
        body.dark-theme #inline-table-header { background: #2d2d2d; border-bottom-color: #444; }
        body.dark-theme #close-inline-table-button { background: #333; color: #ccc; border-color: #555; }
        body.dark-theme #search-results-dropdown { background: #333; border-color: #555; }
        body.dark-theme .search-result-item { color: #eee; border-bottom-color: #444; }
        body.dark-theme .search-result-item:hover { background-color: #444; }

        /* Индикатор загрузки */
        #loading-indicator {
            position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
            background: rgba(0, 0, 0, 0.8); color: white; padding: 15px 25px;
            border-radius: 6px; z-index: 10001; font-size: 16px; display: none;
        }

        /* Мобильная кнопка меню — внутри topbar */
        #toggle-menu-button {
            display: none; flex: 0 0 auto;
            font-size: 20px; padding: 3px 8px; background: white;
            border: 1px solid #cbd5e1; border-radius: 4px; cursor: pointer;
        }
        @media (max-width: 799px) {
            #toggle-menu-button { display: block; }
            .controls-container { transform: translateX(-110%); left: 0; height: calc(100vh - 56px); border-radius: 0; }
            .controls-container.open { transform: translateX(0); }
            #inline-table-display-area {
                left: 8px; top: 48px; min-width: 0;
                width: calc(100vw - 16px); max-width: calc(100vw - 16px);
            }
        }
        
        #inline-table-display-area::after {
            content: '⋰⋰'; position: absolute; bottom: 4px; right: 4px;
            font-size: 20px; color: #999; pointer-events: none;
        }