@media (max-width: 1190px){
    .container{
        padding-left: 20px;
        padding-right: 20px;
    }
}
@media (max-width: 991px) {
    .onb {
        position: fixed;
        inset: 0;
        width: 100%;
        max-height: 100dvh;
        height: 100dvh;
        flex-direction: column;
        overflow: hidden;
        overscroll-behavior: none;
    }
    .onb__media {
        width: 100%;
        flex: 0 0 36dvh;
        height: 36dvh;
        max-height: 36dvh;
        min-height: 0;
    }
    .onb__media picture {
        display: block;
        width: 100%;
        height: 100%;
    }
    .onb__media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
    }
    .onb__content {
        width: 100%;
        flex: 1 1 auto;
        height: auto;
        min-height: 0;
        padding: 20px 16px calc(env(safe-area-inset-bottom, 0px) + 12px);
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        align-items: stretch;
        justify-content: flex-start;
    }
    .onb__box {
        min-height: 0;
        max-width: 560px;
        padding: 0;
        justify-content: flex-start;
        gap: 0;
        height: auto;
        min-height: 100%;
        margin: 0 auto;
    }
    .onb__step.is-active {
        gap: 16px;
        flex: 0 0 auto;
        justify-content: flex-start;
        align-items: center;
        overflow: visible;
        width: 100%;
    }
    .onb__field {
        margin-top: 10px;
    }
    .onb__footer {
        flex-shrink: 0;
        gap: 10px;
        width: 100%;
        margin-top: 20px;
        padding-top: 12px;
        padding-bottom: 8px;
    }
    .onb__title {
        font-size: 26px;
        line-height: 1.15;
    }
    .onb__text {
        font-size: 14px;
        line-height: 1.35;
        max-width: 340px;
    }
}
@media (max-width: 640px){
    .onb__media {
        flex: 0 0 32dvh;
        height: 32dvh;
        max-height: 32dvh;
        min-height: 0;
    }
    .onb__content {
        padding: 16px 14px calc(env(safe-area-inset-bottom, 0px) + 12px);
    }
    .onb__step.is-active {
        gap: 14px;
    }
    .onb__title {
        font-size: 22px;
    }
    .onb__text {
        font-size: 13px;
        line-height: 1.3;
    }
    .onb__field {
        margin-top: 8px;
    }
    .top-editProfileContent{
        padding-top: 15px;
    }
    .phone-invite button{
        font-size: 14px;
        padding: 10px 45px;
    }
    .logoHeader{
        display: none;
    }
    .flexHeaderLinks{
        justify-content: center;
        min-height: 36px;
        align-items: center;
    }
    header{
        top: auto;
        bottom: 0;
        z-index: 1000;
        padding: 6px 0 calc(env(safe-area-inset-bottom, 0px) + 6px);
        min-height: 52px;
        border-radius: 20px 20px 0 0;
        border: 1px solid rgba(0, 0, 0, 0.20);
        background: #FFF;
        box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.15);
        box-sizing: border-box;
    }
    .textOnMap{
        width: 95%;
        font-size: 14px;
    }
    h1, h2, h3, h4, h5{
        font-family: "Inter", sans-serif !important;
    }
    .sos-fab{
        right: 10px;
        bottom: 62px;
    }
    .modal-content{
        width: 90%;
    }
    .topInformationPage{
        margin-bottom: 20px;
    }
    .mapContentFlex{
        height: 82vh;
    }
    .sectionLKMain--map{
        padding-bottom: 0;
        height: 100dvh;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }
    .sectionLKMain--map > .topInformationPage{
        flex: 0 0 auto;
        margin-bottom: 12px;
    }
    .sectionLKMain--map > .container{
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }
    .sectionLKMain--map .mapContentFlex{
        flex: 1 1 auto;
        height: auto;
        min-height: 0;
        max-height: none;
    }
    .sectionLKMain--map .mapContentFlex .leaflet-container{
        z-index: 1;
    }
    .sectionLKMain--map .map-add-fab{
        bottom: calc(env(safe-area-inset-bottom, 0px) + 28px);
    }
    .sectionLKMain--map .map-page-back{
        display: none;
    }
    .flexHeaderLinks a{
        flex-direction: column;
        gap: 3px;
        font-size: 10px;
    }
    .sectionLKMain{
        padding-top: 0;
        padding-bottom: 58px;
    }
    .sectionLKMain--chat-list{
        height: 100dvh;
        min-height: 100dvh;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        box-sizing: border-box;
    }
    .sectionLKMain--chat-list > .topInformationPage{
        flex: 0 0 auto;
    }
    .sectionLKMain--chat-list > .container,
    .sectionLKMain--chat-list .flexLentaNews{
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }
    .sectionLKMain--chat-list .wrapper-flexLentaNews{
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 18px);
    }
    .sectionLKMain--no-nav{
        padding-bottom: 20px;
    }
    .topInformationPage{
        padding-top: 8px;
    }
    .container{
        padding-left: 8px;
        padding-right: 8px;
    }
    .onb__input {
        height: 48px;
        font-size: 15px;
    }
    .onb__sms {
        gap: 8px;
    }
    .onb__sms-input {
        width: 48px;
        height: 48px;
        font-size: 20px;
    }
    .onb__btn {
        font-size: 14px;
        padding: 10px 35px;
        width: fit-content;
    }
    .textMessagePeople{
        max-width: 250px;
    }
    .text-textMessagePeople-2{
        max-width: 270px;
    }
    .block-messagePeople-2 .textMessagePeople{
        justify-content: flex-end;
        align-items: flex-end;
    }
    .block-messagePeople{
        gap: 10px;
    }
}
@media (max-width: 400px){
    .text-textMessagePeople{
        width: fit-content;
        min-width: 120px;
        max-width: calc(100vw - 72px);
        padding-right: 40px;
    }
    .sectionLKMain--chat .text-textMessagePeople,
    .flexSupport--chat .text-textMessagePeople{
        width: fit-content;
        min-width: 120px;
        max-width: min(280px, calc(100vw - 72px));
        padding-right: 10px;
    }
    .textMessagePeople{
        width: auto;
        max-width: 100%;
    }
    .sectionLKMain--chat .block-messagePeople .textMessagePeople,
    .flexSupport--chat .block-messagePeople .textMessagePeople{
        width: auto;
        flex: 0 1 auto;
        max-width: calc(100% - 52px);
    }
    .sectionLKMain--chat .block-messagePeople-2 .textMessagePeople{
        max-width: calc(100% - 4px);
    }
    .text-textMessagePeople-2{
        max-width: 270px;
    }
    .sectionLKMain--chat .text-textMessagePeople-2{
        max-width: min(280px, calc(100vw - 16px));
    }
    .photo-textMessagePeople{
        height: auto;
        width: 100%;
    }
    .chatAllRooms{
    max-height: none;
}
.sectionLKMain--chat .chatAllRooms{
    max-height: none !important;
}
}

/* Полноэкранные чаты / комментарии / поддержка (как inline-стили в HTML-прототипах) */
@media (max-width: 640px) {
    body.immersive-chat header {
        display: none !important;
    }

    body.immersive-chat .sectionLKMain {
        padding-bottom: 0;
    }

    body.immersive-chat .sectionLKMain--chat,
    body.immersive-chat .sectionLKMain--comments {
        padding-top: 0;
        /* visualViewport height from useImmersiveLayout keeps input above keyboard */
        height: var(--vv-height, 100dvh);
        min-height: var(--vv-height, 100dvh);
        max-height: var(--vv-height, 100dvh);
        padding-bottom: 0;
        box-sizing: border-box;
    }

    /* Pin screen into the visible area above the keyboard (iOS pans offsetTop). */
    body.immersive-chat.keyboard-open .sectionLKMain--chat,
    body.immersive-chat.keyboard-open .sectionLKMain--comments {
        position: fixed;
        top: var(--vv-offset-top, 0px);
        left: 0;
        right: 0;
        width: 100%;
        z-index: 40;
    }

    /* Padding must be on the outer flex wrapper — never on .input-send,
       otherwise absolute #sendBtn centers against input+padding and floats low,
       leaving a white gap above the keyboard. */
    body.immersive-chat .sectionLKMain--chat .flex-input-send,
    body.immersive-chat .sectionLKMain--comments .flex-input-send {
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 8px);
    }
    body.immersive-chat.keyboard-open .sectionLKMain--chat .flex-input-send,
    body.immersive-chat.keyboard-open .sectionLKMain--comments .flex-input-send {
        /* Home indicator is covered by the keyboard — drop safe-area gap. */
        padding-bottom: 6px;
    }
    body.immersive-chat .sectionLKMain--chat .flex-input-send {
        width: calc(100% + 8px);
        margin-inline: -4px;
        gap: 6px;
        padding-top: 6px;
        background: #fff;
    }
    body.immersive-chat .sectionLKMain--comments .flex-input-send {
        width: 100%;
        padding-top: 2px;
        padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 4px);
        gap: 4px;
        background: #fff;
    }
    body.immersive-chat.keyboard-open .sectionLKMain--comments .flex-input-send {
        padding-bottom: 2px;
    }
    body.immersive-chat .sectionLKMain--chat .input-send input,
    body.immersive-chat .sectionLKMain--comments .input-send input {
        height: 56px;
        padding-left: 14px;
        padding-right: 48px;
        font-size: 16px;
    }
    body.immersive-chat .sectionLKMain--comments .input-send input {
        height: 48px;
    }
    body.immersive-chat .sectionLKMain--chat .attach-menu__trigger,
    body.immersive-chat .sectionLKMain--chat .voiceInput {
        width: 50px;
        height: 50px;
        flex: 0 0 50px;
    }

    body.immersive-chat .flexLentaNews {
        flex: 1;
        min-height: 0;
        height: auto;
        max-height: none;
        justify-content: flex-start;
        align-items: stretch;
        overflow: hidden;
    }

    body.immersive-chat .sectionLKMain--chat .chatAllRooms {
        max-height: none !important;
    }

    body.immersive-chat .wrapper-flexLentaNewsComments,
    body.immersive-chat .sectionLKMain--comments .chatAllRooms {
        max-height: none !important;
        flex: 1 1 auto;
        min-height: 0;
        width: 100%;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    body.immersive-chat .flexLentaNews--comments .comments-post-sticky {
        flex: 0 0 auto;
    }
}

/* ── Admin panel mobile (<=640px) ─────────────────────── */
@media (max-width: 640px) {
    .admin-panel .infoInviteBlock h4 {
        font-size: 18px;
    }
    .admin-panel .blockNotificationColumn {
        padding: 10px 12px;
    }
    .admin-tab-btn {
        padding: 6px 11px;
        font-size: 12px;
    }
    /* iPhone SE (375px) specific */
    .admin-panel .onb__input {
        font-size: 15px;
    }
    .admin-panel .btnModal {
        width: 100%;
        box-sizing: border-box;
    }
}

@media (min-width: 641px) {
    .sectionLKMain--chat,
    .sectionLKMain--comments {
        height: calc(100dvh - 56px);
        min-height: calc(100dvh - 56px);
        padding-top: 56px;
    }
    .sectionLKMain--chat > .topInformationPage,
    .sectionLKMain--comments > .topInformationPage {
        padding-top: 8px;
    }
    .sectionLKMain--chat .flex-input-send {
        padding-bottom: 10px;
    }
    .sectionLKMain--comments .flex-input-send {
        padding-top: 2px;
        padding-bottom: 4px;
    }
}