/* --- ДОПОЛНЕНИЯ ДЛЯ УНИФИКАЦИИ СТИЛЯ --- */

html, body {
    margin: 0;
    padding: 0;
    background-color: #000 !important; /* Гарантируем черный фон везде */
    width: 100%;
    min-height: 100vh;
}

/* Принудительно задаем единый размер для всех контейнеров */
.app-container {
    max-width: 450px !important; /* Твой стандарт ширины */
    width: 100% !important;
    margin: 0 auto !important; /* Центрирование */
    position: relative !important;
    background: #0a0a0a !important; /* Основной цвет фона приложения */
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
}

/* Унификация страниц внутри контейнера */
.page, #base-page {
    flex: 1 !important;
    width: 100% !important;
    padding: 20px 16px 100px !important; /* Единый отступ сверху и снизу под таб-бар */
    box-sizing: border-box !important;
    display: block !important;
}

/* Единый стиль и позиционирование для Tab Bar на всех страницах */
.tab-bar {
    position: fixed !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100% !important;
    max-width: 450px !important; /* Строго по ширине контейнера */
    background: rgba(10, 10, 10, 0.95) !important;
    backdrop-filter: blur(10px) !important;
    border-top: 1px solid #222 !important;
    height: 80px !important;
    display: flex !important;
    z-index: 10000 !important;
    box-sizing: border-box !important;
}

/* Центрирование иконок в таб-баре */
.nav-item {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
}

/* Убираем лишние скроллы, если они мешают */
body {
    overflow-x: hidden !important;
}