/* ========================================
   SAF CONNECT — LIGHT GRAPHITE
   Только авторизованный интерфейс.
   ======================================== */

html body.light:not(.guest-mode) {
    --saf-light-graphite: #343b37;
    --saf-light-muted: #68716c;
    --saf-light-border: #dce2de;
    --saf-light-surface: #f2f4f2;
}

/* ===== ВЕРХНЯЯ ПАНЕЛЬ ===== */

html body.light:not(.guest-mode) .header,
html body.light.saf-ambient-ready:not(.guest-mode) .header {
    background: rgba(255,255,255,.94) !important;
    background-color: rgba(255,255,255,.94) !important;
    background-image: none !important;

    border-color: #dce2de !important;

    box-shadow:
        0 12px 36px rgba(38,44,40,.09),
        inset 0 1px rgba(255,255,255,.92) !important;
}

/* Убираем зелёное свечение, сохраняем движение */

html body.light.saf-ambient-ready:not(.guest-mode)
.header::before {
    background: radial-gradient(
        ellipse at center,
        rgba(110,118,113,.15) 0%,
        rgba(135,142,137,.08) 35%,
        transparent 75%
    ) !important;
}

html body.light.saf-ambient-ready:not(.guest-mode)
.header::after {
    background: linear-gradient(
        110deg,
        transparent 10%,
        rgba(100,108,103,.035) 50%,
        transparent 90%
    ) !important;
}

/* Название сервиса — без перекрашивания логотипа */

html body.light:not(.guest-mode)
.header .brand {
    color: #343b37 !important;
}

/* Навигация */

html body.light:not(.guest-mode)
#safDesktopNav .saf-desktop-nav-btn {
    color: #68716c !important;
}

html body.light:not(.guest-mode)
#safDesktopNav .saf-desktop-nav-btn.active {
    color: #343b37 !important;
}

html body.light:not(.guest-mode)
#safDesktopNav .saf-nav-slider {
    background: #edf0ed !important;
    border-color: #dce2de !important;
}

/* Кнопки верхней панели */

html body.light:not(.guest-mode)
.header .circle,
html body.light:not(.guest-mode)
.header #themeToggle,
html body.light:not(.guest-mode)
.header #languageToggle {
    background: #f1f3f1 !important;
    border-color: #dce2de !important;
    color: #343b37 !important;
}

/* Иконки, кроме флагов и логотипа */

html body.light:not(.guest-mode)
.header .circle svg,
html body.light:not(.guest-mode)
.header #themeToggle svg {
    color: #343b37 !important;
    stroke: currentColor !important;
}

/* ===== ГЛАВНАЯ СТРАНИЦА ===== */

/* Карточки */

html body.light #homePage #homeUserCard,
html body.light #homePage #homeDevicesCard {
    background: #ffffff !important;
    border-color: #dce2de !important;
    color: #343b37 !important;
    box-shadow:
        0 12px 38px rgba(38,44,40,.07) !important;
}

/* Основные заголовки */

html body.light #homePage #homeUserCard .plan,
html body.light #homePage #homeUserCard .saf-plus-name,
html body.light #homePage #homeDevicesCard .plan,
html body.light #homePage #homeDevicesCard .saf-devices-title {
    color: #343b37 !important;
}

/* Дополнительный текст */

html body.light #homePage #homeUserCard .label,
html body.light #homePage #homeUserCard .saf-plus-prefix,
html body.light #homePage #homeDevicesCard .action-sub {
    color: #68716c !important;
}

/* Полоса трафика */

html body.light #homePage #homeUserCard
.saf-plus-traffic-track-v9 {
    background: #e5e9e6 !important;
}

html body.light #homePage #homeUserCard
.saf-plus-traffic-fill-v9 {
    background: #343b37 !important;
}

/* Поля и подложки */

html body.light #homePage #homeUserCard
.saf-config-link-row,
html body.light #homePage #homeUserCard
#homeConfigurationUrl,
html body.light #homePage #homeUserCard
#homeConfigurationCopy {
    background: #f2f4f2 !important;
    border-color: #dce2de !important;
    color: #343b37 !important;
}

/* Срок подписки */

html body.light #homePage #homeUserCard
#safPlusRemainingV5:not(.warning):not(.danger) {
    background: #f2f4f2 !important;
    border-color: #dce2de !important;
}

/* Устройства */

html body.light #homePage #homeDevicesCard
#homeDevicesList > * {
    background: #f2f4f2 !important;
    border-color: #dce2de !important;
}

/* Обновление устройств */

html body.light #homePage #homeDevicesCard
.saf-devices-refresh {
    color: #343b37 !important;
}

/* ===== ФОНОВЫЕ АНИМАЦИИ ===== */

/* Анимации сохраняются, зелёный заменяем серым */

html body.light:not(.guest-mode):has(#homePage.active-page)
#safAmbientBackground .saf-ambient-glow-one {
    background: radial-gradient(
        circle,
        rgba(120,128,122,.15) 0%,
        rgba(150,156,151,.07) 38%,
        transparent 70%
    ) !important;
}

html body.light:not(.guest-mode):has(#homePage.active-page)
#safAmbientBackground .saf-ambient-glow-two {
    background: radial-gradient(
        circle,
        rgba(145,150,146,.13) 0%,
        rgba(170,175,170,.06) 40%,
        transparent 70%
    ) !important;
}

html body.light:not(.guest-mode):has(#homePage.active-page)
#safAmbientBackground .saf-ambient-glow-three {
    background: radial-gradient(
        circle,
        rgba(110,118,113,.11) 0%,
        rgba(145,150,146,.05) 40%,
        transparent 70%
    ) !important;
}

/* Сохраняем предупреждения о сроке подписки */

html body.light #homePage
#homeUserCard.expiry-critical
#safPlusRemainingV5 {
    background: #fff1f2 !important;
    border-color: #f4c5ca !important;
}

html body.light #homePage
#homeUserCard.expiry-critical
#safPlusRemainingValueV5 {
    color: #bd3047 !important;
}



/* SAF CONNECT — Light home contrast V1 */

/* Кнопка продления */
html body.light #homePage #homeUserCard
#homeBuyButton:not(.saf-renew-warning):not(.saf-renew-danger) {
    background: linear-gradient(135deg, #e5eae7 0%, #f1f3f1 100%) !important;
    border: 1px solid #cbd4ce !important;
    color: #343b37 !important;
}

/* Основной текст и подпись */
html body.light #homePage #homeUserCard
#homeBuyButton .saf-buy-tariff-content-v11 strong {
    color: #343b37 !important;
    opacity: 1 !important;
    -webkit-text-fill-color: #343b37 !important;
}

html body.light #homePage #homeUserCard
#homeBuyButton .saf-buy-tariff-sub-v11 {
    color: #616b65 !important;
    opacity: 1 !important;
    -webkit-text-fill-color: #616b65 !important;
}

/* Стрелка */
html body.light #homePage #homeUserCard
#homeBuyButton .saf-buy-tariff-arrow-v11 {
    color: #343b37 !important;
    opacity: 1 !important;
}

/* Иконка */
html body.light #homePage #homeUserCard
#homeBuyButton .saf-buy-tariff-icon-v11 {
    background: #d8e0da !important;
    color: #343b37 !important;
}

html body.light #homePage #homeUserCard
#homeBuyButton .saf-buy-tariff-icon-v11 svg {
    stroke: #343b37 !important;
}

/* Полоса трафика */
html body.light #homePage #homeUserCard
.saf-plus-traffic-track-v9 {
    background: #dce3de !important;
}

html body.light #homePage #homeUserCard
.saf-plus-traffic-fill-v9 {
    background: #343b37 !important;
}

/* Поле подключения */
html body.light #homePage #homeUserCard
#homeConfigurationUrl {
    background: #f0f3f0 !important;
    border-color: #cbd4ce !important;
    color: #343b37 !important;
}

/* Кнопка копирования */
html body.light #homePage #homeUserCard
#homeConfigurationCopy {
    background: #e5eae6 !important;
    border-color: #cbd4ce !important;
    color: #343b37 !important;
}

html body.light #homePage #homeUserCard
#homeConfigurationCopy svg {
    color: #343b37 !important;
    stroke: #343b37 !important;
    opacity: 1 !important;
}

/* Карточка срока */
html body.light #homePage #homeUserCard
#safPlusRemainingV5:not(.warning):not(.danger) {
    background: #f0f3f0 !important;
    border-color: #d1d9d3 !important;
}

/* Текст даты */
html body.light #homePage #homeUserCard
#safPlusRemainingValueV5 {
    color: #343b37 !important;
    -webkit-text-fill-color: #343b37 !important;
}

/* Подписи */
html body.light #homePage #homeUserCard
.saf-plus-remaining-label,
html body.light #homePage #homeUserCard
.saf-plus-remaining-label::after {
    color: #616b65 !important;
}

/* Адаптация для узких окон Telegram Desktop */
@media (max-width: 520px) {
    html body.light #homePage #homeUserCard
    #homeBuyButton {
        min-width: 0 !important;
    }

    html body.light #homePage #homeUserCard
    .saf-config-link-row {
        min-width: 0 !important;
    }

    html body.light #homePage #homeUserCard
    #homeConfigurationUrl {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}


/* SAF CONNECT — global expiry calendar */

/* Общее правило: одна иконка для всех экранов */
html body #homeUserCard
.saf-plus-remaining-label::before {
    content: "" !important;
    display: inline-block !important;

    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    flex: 0 0 22px !important;

    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 7px !important;

    background-color: #35e981 !important;
    background-image: none !important;

    -webkit-mask-image: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20%20%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%0A%20%20%20%20%20%20%20%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M7%203v4M17%203v4M3%2010h18%22%0A%20%20%20%20%20%20%20%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%2F%3E%0A%20%20%3Cpath%20d%3D%22m8%2015%202.5%202.5L16%2012%22%0A%20%20%20%20%20%20%20%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%0A%20%20%20%20%20%20%20%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A") !important;
    mask-image: url("data:image/svg+xml,%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20%20%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%222%22%0A%20%20%20%20%20%20%20%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M7%203v4M17%203v4M3%2010h18%22%0A%20%20%20%20%20%20%20%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%2F%3E%0A%20%20%3Cpath%20d%3D%22m8%2015%202.5%202.5L16%2012%22%0A%20%20%20%20%20%20%20%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%0A%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%0A%20%20%20%20%20%20%20%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A") !important;

    -webkit-mask-size: 18px 18px !important;
    mask-size: 18px 18px !important;

    -webkit-mask-position: center !important;
    mask-position: center !important;

    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* Светлая тема: графит */
html body.light #homeUserCard
.saf-plus-remaining-label::before,
html body.light-theme #homeUserCard
.saf-plus-remaining-label::before {
    background-color: #343b37 !important;
}

/* Тёмная тема: зелёный */
html body:not(.light):not(.light-theme)
#homeUserCard .saf-plus-remaining-label::before {
    background-color: #35e981 !important;
}


/* SAF CONNECT — light theme device controls */

/* Иконка устройства */
html body.light #homeDevicesList .saf-device-icon {
    background: #dce4de !important;
    border: 1px solid #c8d2cb !important;
    color: #343b37 !important;
}

html body.light #homeDevicesList .saf-device-icon svg,
html body.light #homeDevicesList .device-placeholder-icon svg {
    color: #343b37 !important;
    stroke: #343b37 !important;
    filter: none !important;
}

/* Поле редактирования имени */
html body.light #homeDevicesList .saf-device-name-input {
    background: #f7f9f7 !important;
    border: 1px solid #cbd4ce !important;
    color: #343b37 !important;
    -webkit-text-fill-color: #343b37 !important;
    box-shadow: none !important;
    caret-color: #343b37 !important;
}

html body.light #homeDevicesList .saf-device-name-input:focus {
    background: #ffffff !important;
    border-color: #69776e !important;
    box-shadow: 0 0 0 3px rgba(52,59,55,.10) !important;
    outline: none !important;
}

html body.light #homeDevicesList .saf-device-name-input::selection {
    background: #c9d4cc !important;
    color: #252d28 !important;
}

/* Сохранить название */
html body.light #homeDevicesList .saf-device-save {
    background: #dfe6e1 !important;
    color: #343b37 !important;
    border: 1px solid #cbd4ce !important;
    opacity: 1 !important;
}

html body.light #homeDevicesList .saf-device-save:hover {
    background: #cfd9d2 !important;
}

html body.light #homeDevicesList .saf-device-save:disabled {
    opacity: .45 !important;
    cursor: not-allowed !important;
}

/* Отмена */
html body.light #homeDevicesList .saf-device-cancel {
    background: #edf0ee !important;
    color: #59635d !important;
    border: 1px solid #d5dcd7 !important;
}

html body.light #homeDevicesList .saf-device-cancel:hover {
    background: #dfe5e1 !important;
    color: #343b37 !important;
}

/* Удаление устройства */
html body.light #homeDevicesList .saf-device-delete,
html body.light #homeDevicesList .saf-free-slot-delete {
    background: #edf0ee !important;
    color: #59635d !important;
    border: 1px solid #d5dcd7 !important;
}

html body.light #homeDevicesList .saf-device-delete:hover,
html body.light #homeDevicesList .saf-free-slot-delete:hover {
    background: #e2e7e3 !important;
    color: #343b37 !important;
}

/* Остальные кнопки устройства */
html body.light #homeDevicesList .saf-device-edit {
    color: #59635d !important;
}

html body.light #homeDevicesList .saf-device-edit:hover {
    background: #e2e7e3 !important;
    color: #343b37 !important;
}

/* Компактный интерфейс Telegram */
@media (max-width: 520px) {
    html body.light #homeDevicesList .saf-device-name-input {
        min-width: 0 !important;
    }

    html body.light #homeDevicesList .saf-device-actions {
        flex-shrink: 0 !important;
    }
}


/* SAF CONNECT — graphite copy icon, light theme */

html body.light #homeConfigurationCopy,
html body.light-theme #homeConfigurationCopy {
    background: #e5eae6 !important;
    border: 1px solid #cbd4ce !important;
    color: #343b37 !important;
    -webkit-text-fill-color: #343b37 !important;
}

html body.light #homeConfigurationCopy svg,
html body.light-theme #homeConfigurationCopy svg,
html body.light #homeConfigurationCopy svg *,
html body.light-theme #homeConfigurationCopy svg * {
    color: #343b37 !important;
    stroke: #343b37 !important;
    opacity: 1 !important;
    filter: none !important;
}

html body.light #homeConfigurationCopy.copied,
html body.light-theme #homeConfigurationCopy.copied,
html body.light #homeConfigurationCopy.success,
html body.light-theme #homeConfigurationCopy.success {
    background: #dce4de !important;
    color: #343b37 !important;
    border-color: #bdc9c0 !important;
}


/* SAF CONNECT — unified refresh rotation on all platforms */

@-webkit-keyframes safUnifiedRefreshSpinV11 {
    from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    to   { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes safUnifiedRefreshSpinV11 {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* Traffic refresh */
html body #safPlusTrafficRefreshV9
.saf-plus-refresh-icon-v9.saf-refresh-spinning-v10 {
    display: inline-block !important;
    -webkit-transform-origin: center center !important;
    transform-origin: center center !important;
    -webkit-animation: safUnifiedRefreshSpinV11 .8s linear infinite !important;
    animation: safUnifiedRefreshSpinV11 .8s linear infinite !important;
}

/* Devices refresh */
html body #safDevicesRefreshButton.is-loading
.saf-devices-refresh-icon {
    display: inline-block !important;
    -webkit-transform-origin: center center !important;
    transform-origin: center center !important;
    -webkit-animation: safUnifiedRefreshSpinV11 .8s linear infinite !important;
    animation: safUnifiedRefreshSpinV11 .8s linear infinite !important;
}


/* SAF CONNECT — Unified animated theme toggle */

/* Не меняем размеры кнопки, заданные адаптивной шапкой */
html body .header #themeToggle {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    isolation: isolate !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent;
    transition:
        background-color .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        scale .24s ease !important;
}

/* Скрываем старую SVG-разметку только внутри переключателя */
html body .header #themeToggle > * {
    visibility: hidden !important;
}

/* Общая форма иконки */
html body .header #themeToggle::before {
    content: "" !important;
    position: absolute !important;
    inset: auto !important;
    top: 50% !important;
    left: 50% !important;
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 0 !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    transform: translate(-50%, -50%) rotate(0deg) !important;
    transform-origin: center center !important;
    opacity: 1 !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    -webkit-mask-position: center !important;
    mask-position: center !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
}

/* Убираем старую вторую фигуру */
html body .header #themeToggle::after {
    content: none !important;
    display: none !important;
}

/* Светлая тема: графит */
html body.light .header #themeToggle {
    background: #f1f3f1 !important;
    border-color: #d5ddd7 !important;
    color: #343b37 !important;
}

html body.light .header #themeToggle::before {
    background-color: #343b37 !important;
    -webkit-mask-image: url("data:image/svg+xml,%0A%20%20%20%20%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20%20%20%20%20%20%20viewBox%3D%220%200%2024%2024%22%0A%20%20%20%20%20%20%20%20%20fill%3D%22none%22%0A%20%20%20%20%20%20%20%20%20stroke%3D%22black%22%0A%20%20%20%20%20%20%20%20%20stroke-width%3D%222.2%22%0A%20%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%0A%20%20%20%20%20%20%20%20%20stroke-linejoin%3D%22round%22%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224.1%22%2F%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M12%202v2.3M12%2019.7V22%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M4.93%204.93l1.63%201.63%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M17.44%2017.44l1.63%201.63%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M2%2012h2.3M19.7%2012H22%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M4.93%2019.07l1.63-1.63%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M17.44%206.56l1.63-1.63%22%2F%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%3C%2Fsvg%3E%0A%20%20%20%20") !important;
    mask-image: url("data:image/svg+xml,%0A%20%20%20%20%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20%20%20%20%20%20%20viewBox%3D%220%200%2024%2024%22%0A%20%20%20%20%20%20%20%20%20fill%3D%22none%22%0A%20%20%20%20%20%20%20%20%20stroke%3D%22black%22%0A%20%20%20%20%20%20%20%20%20stroke-width%3D%222.2%22%0A%20%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%0A%20%20%20%20%20%20%20%20%20stroke-linejoin%3D%22round%22%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224.1%22%2F%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M12%202v2.3M12%2019.7V22%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M4.93%204.93l1.63%201.63%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M17.44%2017.44l1.63%201.63%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M2%2012h2.3M19.7%2012H22%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M4.93%2019.07l1.63-1.63%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20M17.44%206.56l1.63-1.63%22%2F%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%3C%2Fsvg%3E%0A%20%20%20%20") !important;
}

/* Тёмная тема: светлая луна */
html body:not(.light) .header #themeToggle::before {
    background-color: #edf4ef !important;
    -webkit-mask-image: url("data:image/svg+xml,%0A%20%20%20%20%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20%20%20%20%20%20%20viewBox%3D%220%200%2024%2024%22%0A%20%20%20%20%20%20%20%20%20fill%3D%22none%22%0A%20%20%20%20%20%20%20%20%20stroke%3D%22black%22%0A%20%20%20%20%20%20%20%20%20stroke-width%3D%222.2%22%0A%20%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%0A%20%20%20%20%20%20%20%20%20stroke-linejoin%3D%22round%22%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M20.2%2015.4A8.5%208.5%200%200%201%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%208.6%203.8a8.6%208.6%200%201%200%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2011.6%2011.6Z%22%2F%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%3C%2Fsvg%3E%0A%20%20%20%20") !important;
    mask-image: url("data:image/svg+xml,%0A%20%20%20%20%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%0A%20%20%20%20%20%20%20%20%20viewBox%3D%220%200%2024%2024%22%0A%20%20%20%20%20%20%20%20%20fill%3D%22none%22%0A%20%20%20%20%20%20%20%20%20stroke%3D%22black%22%0A%20%20%20%20%20%20%20%20%20stroke-width%3D%222.2%22%0A%20%20%20%20%20%20%20%20%20stroke-linecap%3D%22round%22%0A%20%20%20%20%20%20%20%20%20stroke-linejoin%3D%22round%22%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M20.2%2015.4A8.5%208.5%200%200%201%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%208.6%203.8a8.6%208.6%200%201%200%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2011.6%2011.6Z%22%2F%3E%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%3C%2Fsvg%3E%0A%20%20%20%20") !important;
}

/* Реакция на наведение */
@media (hover: hover) {
    html body.light .header #themeToggle:hover {
        background: #e4eae6 !important;
        border-color: #bfcac2 !important;
    }

    html body .header #themeToggle:hover::before {
        filter: none !important;
    }
}

/* Анимация при смене темы */
@keyframes safThemeIconTurnV1 {
    0% {
        transform: translate(-50%, -50%) rotate(-90deg) scale(.65);
        opacity: .35;
    }
    65% {
        transform: translate(-50%, -50%) rotate(12deg) scale(1.12);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) rotate(0deg) scale(1);
        opacity: 1;
    }
}

html body .header #themeToggle.saf-theme-animating::before {
    animation: safThemeIconTurnV1 .65s
        cubic-bezier(.2,.8,.2,1) both !important;
}

/* Нажатие */
html body .header #themeToggle:active {
    scale: .94 !important;
}

/* Доступность */
@media (prefers-reduced-motion: reduce) {
    html body .header #themeToggle.saf-theme-animating::before {
        animation: none !important;
    }
}


/* SAF CONNECT — unified language button */

/* Выравнивание элементов без изменения размеров кнопки */
html body .header #languageToggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    column-gap: 7px !important;
    white-space: nowrap !important;
}

/* Флаг */
html body .header #languageToggle > .saf-final-flag {
    display: block !important;
    width: 19px !important;
    height: 14px !important;
    min-width: 19px !important;
    min-height: 14px !important;
    max-width: 19px !important;
    max-height: 14px !important;
    flex: 0 0 19px !important;
    object-fit: cover !important;
    border-radius: 2px !important;
    margin: 0 !important;
    opacity: 1 !important;
}

/* Текст языка */
html body .header #languageToggle > .saf-lang-label-v5 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .1px !important;
}

/* Стрелка */
html body .header #languageToggle > .saf-final-lang-arrow {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    flex: 0 0 14px !important;
    margin: 0 !important;
    opacity: .9 !important;
    color: inherit !important;
    stroke: currentColor !important;
    transition: transform .22s ease, opacity .22s ease !important;
}

html body .header #languageToggle > .saf-final-lang-arrow path {
    stroke: currentColor !important;
    stroke-width: 2.3 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* Светлая тема */
html body.light .header #languageToggle {
    color: #343b37 !important;
}

html body.light .header #languageToggle > .saf-lang-label-v5,
html body.light .header #languageToggle > .saf-final-lang-arrow {
    color: #343b37 !important;
    -webkit-text-fill-color: #343b37 !important;
}

/* Тёмная тема */
html body:not(.light) .header #languageToggle > .saf-lang-label-v5,
html body:not(.light) .header #languageToggle > .saf-final-lang-arrow {
    color: #edf3ef !important;
}

/* Поворот стрелки при открытии меню */
html body .header #languageToggle.saf-lang-open
> .saf-final-lang-arrow {
    transform: rotate(180deg) !important;
    opacity: 1 !important;
}

/* Компактные экраны */
@media (max-width: 370px) {
    html body .header #languageToggle {
        column-gap: 5px !important;
    }

    html body .header #languageToggle > .saf-final-flag {
        width: 16px !important;
        min-width: 16px !important;
        max-width: 16px !important;
        height: 12px !important;
        min-height: 12px !important;
        max-height: 12px !important;
        flex-basis: 16px !important;
    }

    html body .header #languageToggle > .saf-final-lang-arrow {
        width: 12px !important;
        min-width: 12px !important;
        height: 12px !important;
        min-height: 12px !important;
        flex-basis: 12px !important;
    }
}


/* SAF_PLANS_LIGHT_BACKGROUND_V1 */

/* Только светлая тема, только страница тарифов */
body.light:has(#safPlansPage.active-page) {
    background: #f5f7f6 !important;
}

body.light #safPlansPage.active-page {
    background: #f5f7f6 !important;
    background-image: none !important;
    color: #25302b !important;
    min-height: 100vh;
}

/* Заголовок и описание */
body.light #safPlansPage .welcome,
body.light #safPlansPage .welcome h1,
body.light #safPlansPage .welcome h2 {
    color: #25302b !important;
}

body.light #safPlansPage .welcome p {
    color: #66736c !important;
}

/* Фон страницы при прокрутке */
html:has(body.light #safPlansPage.active-page) {
    background: #f5f7f6 !important;
}


/* SAF_LINUX_INSTALL_V1 */
#safConnectPage .saf-linux-downloads {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:12px;
}
#safConnectPage .saf-linux-downloads .saf-subscription-open {
    display:inline-flex;
    width:auto;
    min-width:0;
    justify-content:center;
    text-decoration:none;
    padding:10px 14px;
}
#safConnectPage .saf-linux-downloads .saf-subscription-open span {
    white-space:nowrap;
}


/* SAF_LINUX_REFERENCE_V2 */

/* Only the Linux guide */
#safConnectPage .saf-linux-timeline .saf-guide-step {
    padding-bottom: 28px;
}

#safConnectPage .saf-linux-step-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#safConnectPage .saf-linux-step-icon svg {
    width: 19px;
    height: 19px;
}

#safConnectPage .saf-linux-icon-install {
    color: #e2d9ff;
    background: rgba(110,84,202,.22);
    border: 1px solid rgba(151,121,255,.55);
}

#safConnectPage .saf-linux-icon-import,
#safConnectPage .saf-linux-icon-settings {
    color: #a9eaff;
    background: rgba(25,126,157,.23);
    border: 1px solid rgba(63,195,231,.48);
}

#safConnectPage .saf-linux-icon-done {
    color: #c5ffdf;
    background: rgba(29,139,90,.23);
    border: 1px solid rgba(43,197,130,.48);
}

#safConnectPage .saf-linux-downloads {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 8px;
}

#safConnectPage .saf-linux-download {
    display: inline-flex;
    width: auto;
    min-width: 0;
    min-height: 38px;
    padding: 8px 14px;
    gap: 8px;
    text-decoration: none;
    white-space: nowrap;
}

#safConnectPage .saf-linux-import-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-width: 0;
    min-height: 40px;
    padding: 9px 15px;
    margin-top: 8px;
    cursor: pointer;
}

#safConnectPage .saf-linux-unavailable {
    display: inline-block;
    margin-top: 12px;
    font-size: 13px;
    opacity: .65;
}

@media (max-width: 430px) {
    #safConnectPage .saf-linux-downloads {
        gap: 7px;
    }

    #safConnectPage .saf-linux-download {
        padding: 8px 11px;
    }
}

/* SAF_LINUX_SPACING_UNIFIED_V3 */

#safConnectPage .saf-linux-timeline
.saf-guide-content > .saf-guide-text:has(
    + .saf-linux-downloads
),
#safConnectPage .saf-linux-timeline
.saf-guide-content > .saf-guide-text:has(
    + .saf-linux-import-button
) {
    margin-bottom: 0;
}

#safConnectPage .saf-linux-timeline
.saf-linux-downloads,
#safConnectPage .saf-linux-timeline
.saf-linux-import-button {
    margin-top: 8px;
    margin-bottom: 0;
    padding-top: 0;
}


/* SAF_LINUX_SERVER_STICKERS_V1 */
#safConnectPage .saf-linux-step-icon
.saf-guide-icon-image {
    display: block;
    width: 22px;
    height: 22px;
    object-fit: contain;
}