/* ==========================
   David — landscape mobile
   ========================== */

@media (max-width: 1100px) and (orientation: landscape) {

    .david-background {
        left: 98% !important;
        top: -40px !important;

        width: 150px !important;
        height: 600px !important;

        overflow: hidden !important;
    }

    .david-background img {
        width: 360px !important;
        height: auto !important;

        max-width: none !important;
    }

}

/* =========================================================
   MOBILE PORTRAIT — только архитектура
   Дизайн оригинала НЕ меняем
   ========================================================= */

html.mobile-portrait #pun {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html.mobile-portrait .punbb {
    width: 100% !important;
    max-width: 100% !important;
}


/* ---------------------------------------------------------
   ШАПКА
   Не масштабируем её целиком.
   Просто даём ей ширину экрана.
   --------------------------------------------------------- */

html.mobile-portrait #pun-title.section {
    width: 100% !important;
    max-width: 100% !important;

    /*
     * Высоту пока НЕ трогаем.
     * Оригинал остаётся 430px.
     */
    
    box-sizing: border-box;
}

html.mobile-portrait #pun-title table {
    width: 100% !important;
    max-width: 100% !important;
}


/* ---------------------------------------------------------
   ОБЪЯВЛЕНИЕ В ШАПКЕ
   --------------------------------------------------------- */


/*
 * Левая колонка — navigation.
 *
 * Оригинальный margin-left:200px на телефоне
 * больше не нужен: он физически съедает ширину.
 */

html.mobile-portrait #navigation {
    width: 140px !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding: 5px !important;

    box-sizing: border-box;

    float: left;
}


/*
 * Правая колонка — "Ну погнали".
 *
 * Сохраняем оригинальный блок,
 * меняем только его положение и ширину.
 */

html.mobile-portrait #navigation + #scen {
    float: right !important;

    width: calc(100% - 150px) !important;

    max-width: none !important;

    height: 133px !important;

    margin-top: 0 !important;

    padding: 5px !important;

    box-sizing: border-box;
}


/*
 * Средняя колонка — 31/07 + 05/11.
 *
 * На вертикальном телефоне её убираем.
 *
 * В HTML оба блока имеют одинаковый id="scen",
 * поэтому второй определяем через соседний элемент.
 */

html.mobile-portrait #navigation + #scen + #scen {
    display: none !important;
}


/* ---------------------------------------------------------
   ВАЖНО:
   Никаких новых background / color / border здесь нет.
   Всё визуальное наследуется от оригинального CSS.
   --------------------------------------------------------- */

/* =========================================================
   MOBILE PORTRAIT — шапка
   Только изменение архитектуры.
   Оригинальный дизайн не меняем.
   ========================================================= */


/* ---------------------------------------------------------
   1. Убираем только розовую голову статуи.
   Остальной оригинальный фон body сохраняем.
   --------------------------------------------------------- */

html.mobile-portrait body {
    background:
        url(https://forumstatic.ru/files/0019/c1/0e/97865.png) top no-repeat,
        url(https://forumstatic.ru/files/0019/c1/0e/35646.png) repeat !important;
}


/* ---------------------------------------------------------
   2. Две колонки шапки ставим на один уровень.
   --------------------------------------------------------- */

html.mobile-portrait #navigation {
    float: none !important;
    display: inline-block !important;

    width: 140px !important;
    box-sizing: border-box;

    margin: 0 !important;
    padding: 5px !important;

    vertical-align: top !important;
}


html.mobile-portrait #navigation + #scen {
    float: none !important;
    display: inline-block !important;

    width: calc(100% - 150px) !important;
    max-width: none !important;
    box-sizing: border-box;

    margin: 0 !important;
    padding: 5px !important;

    vertical-align: top !important;
}


/* ---------------------------------------------------------
   3. Среднюю колонку на portrait не показываем.
   --------------------------------------------------------- */

html.mobile-portrait #navigation + #scen + #scen {
    display: none !important;
}

/* =========================================================
   MOBILE PORTRAIT — опускаем только сами иконки
   Остальную шапку не двигаем
   ========================================================= */

html.mobile-portrait #pun-navlinks .container > li {
    position: relative !important;
    top: 15px !important;
}

/* =========================================================
   MOBILE PORTRAIT — свои иконки поверх штатных кнопок
   Штатные пиктограммы полностью отключаем
   ========================================================= */

html.mobile-portrait #pun-navlinks .container > li > a {
    mask-image: none !important;
    -webkit-mask-image: none !important;

    mask: none !important;
    -webkit-mask: none !important;
}


/* Сама кнопка остаётся штатной */
html.mobile-portrait #pun-navlinks .container > li > a {
    position: relative !important;

    background-image: none !important;
}


/* Убираем штатные псевдоэлементы с иконками */
html.mobile-portrait #pun-navlinks .container > li > a::before,
html.mobile-portrait #pun-navlinks .container > li > a::after {
    content: none !important;

    background-image: none !important;
}


/* ---------------------------------------------------------
   Общий контейнер нашей иконки
   --------------------------------------------------------- */

html.mobile-portrait #pun-navlinks .container > li > a {
    background-repeat: no-repeat !important;
    background-position: center !important;
}


/* ---------------------------------------------------------
   ГЛАВНАЯ
   --------------------------------------------------------- */

html.mobile-portrait #navindex > a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.5L12 4l9 7.5M5 10.5V20h14v-9.5M9 20v-5h6v5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

    background-size: 24px 24px !important;
}


/* ---------------------------------------------------------
   УЧАСТНИКИ
   --------------------------------------------------------- */

html.mobile-portrait #navuserlist > a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8' r='3' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M3 19c.7-3.2 2.7-5 6-5s5.3 1.8 6 5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='9' r='2.5' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M15 14c2.5 0 4.2 1.5 5 4' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;

    background-size: 25px 25px !important;
}


/* ---------------------------------------------------------
   ПОИСК
   --------------------------------------------------------- */

html.mobile-portrait #navsearch > a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M16 16l5 5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;

    background-size: 25px 25px !important;
}


/* ---------------------------------------------------------
   ПРОФИЛЬ
   --------------------------------------------------------- */

html.mobile-portrait #navprofile > a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19l1.5-4.5L17 4l3 3-10.5 10.5z' fill='none' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M14 7l3 3' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") !important;

    background-size: 25px 25px !important;
}


/* ---------------------------------------------------------
   СООБЩЕНИЯ
   --------------------------------------------------------- */

html.mobile-portrait #navpm > a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h16v11H8l-4 4z' fill='none' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M8 9h8M8 12h5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;

    background-size: 25px 25px !important;
}


/* ---------------------------------------------------------
   АДМИНИСТРИРОВАНИЕ
   --------------------------------------------------------- */

html.mobile-portrait #navadmin > a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3l2 2.2 3-.2.8 2.9 2.5 1.6-1.4 2.7.9 2.9-2.8 1-1 2.8-3-.8-2.5 1.7-2-2.3-3 .1-.7-3-2.4-1.7 1.4-2.6-.9-2.9 2.8-1 1-2.8 3 .8z' fill='none' stroke='white' stroke-width='1.7' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='white' stroke-width='1.7'/%3E%3C/svg%3E") !important;

    background-size: 25px 25px !important;
}


/* ---------------------------------------------------------
   ВЫХОД
   --------------------------------------------------------- */

html.mobile-portrait #navlogout > a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 4H5v16h5M14 8l4 4-4 4M8 12h10' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

    background-size: 25px 25px !important;
}

/* =========================================================
   МОБИЛЬНАЯ НАВИГАЦИЯ — ДОПОЛНИТЕЛЬНЫЕ ПУНКТЫ
   Смена профиля / Администрирование / Выход
   ========================================================= */


/* ---------------------------------------------------------
   Общая кнопка
   --------------------------------------------------------- */

html.mobile-portrait #pun-navlinks .container > li#qps-item,
html.mobile-portrait #pun-navlinks .container > li#navadmin,
html.mobile-portrait #pun-navlinks .container > li#navlogout {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    top: 15px !important;
}


/* ---------------------------------------------------------
   Общие свойства ссылки
   --------------------------------------------------------- */

html.mobile-portrait #pun-navlinks .container > li#qps-item > a,
html.mobile-portrait #pun-navlinks .container > li#navadmin > a,
html.mobile-portrait #pun-navlinks .container > li#navlogout > a {

    display: inline-block !important;

    position: relative !important;

    width: 30px !important;
    height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 23px 23px !important;

    font-size: 0 !important;
    line-height: 0 !important;
}


/* ---------------------------------------------------------
   Убираем текст
   --------------------------------------------------------- */

html.mobile-portrait #pun-navlinks .container > li#qps-item > a > span,
html.mobile-portrait #pun-navlinks .container > li#navadmin > a > span,
html.mobile-portrait #pun-navlinks .container > li#navlogout > a > span {

    display: block !important;

    width: 30px !important;
    height: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 0 !important;
    line-height: 0 !important;

    color: transparent !important;

    background: none !important;
}


/* =========================================================
   СМЕНА ПРОФИЛЯ
   Человек + стрелка
   ========================================================= */

html.mobile-portrait #pun-navlinks .container > li#qps-item > a {

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='7.5' r='3.2' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M3.5 20c0-3.4 2.2-5.5 5.5-5.5s5.5 2.1 5.5 5.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M16 8h5M18.5 5.5L21 8l-2.5 2.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

}


/* =========================================================
   АДМИНИСТРИРОВАНИЕ
   Шестерёнка
   ========================================================= */

html.mobile-portrait #pun-navlinks .container > li#navadmin > a {

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3l2 2.2 3-.2.8 2.9 2.5 1.6-1.4 2.7.9 2.9-2.8 1-1 2.8-3-.8-2.5 1.7-2-2.3-3 .1-.7-3-2.4-1.7 1.4-2.6-.9-2.9 2.8-1 1-2.8 3 .8z' fill='none' stroke='white' stroke-width='1.7' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='white' stroke-width='1.7'/%3E%3C/svg%3E") !important;

}


/* =========================================================
   ВЫХОД
   Дверь + стрелка
   ========================================================= */

html.mobile-portrait #pun-navlinks .container > li#navlogout > a {

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 4H5v16h5M14 8l4 4-4 4M8 12h10' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

}

/* =========================================================
   MOBILE PORTRAIT — новые иконки навигации
   Меняем только содержимое SPAN.
   Фон кнопок, размеры и положение НЕ трогаем.
   ========================================================= */


/* Общая настройка */

html.mobile-portrait #pun-navlinks .container > li > a > span {
    display: block !important;

    width: 30px !important;
    height: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 0 !important;
    line-height: 0 !important;

    color: transparent !important;

    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
}


/* ---------------------------------------------------------
   ФОРУМ — домик
   --------------------------------------------------------- */

html.mobile-portrait #navindex > a > span {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.5L12 4l9 7.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5 10.5V20h14v-9.5' fill='none' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M9 20v-5h6v5' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E") !important;
}


/* ---------------------------------------------------------
   УЧАСТНИКИ — две фигуры
   --------------------------------------------------------- */

html.mobile-portrait #navuserlist > a > span {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8' r='3' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M3 20c0-3.2 2.4-5 6-5s6 1.8 6 5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='9' r='2.5' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M16 15c2.9.2 4.5 1.9 4.5 4.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}


/* ---------------------------------------------------------
   ПОИСК — лупа
   --------------------------------------------------------- */

html.mobile-portrait #navsearch > a > span {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M16 16l5 5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}


/* ---------------------------------------------------------
   ПРОФИЛЬ — пользователь
   --------------------------------------------------------- */

html.mobile-portrait #navprofile > a > span {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7' r='4' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M4.5 21c0-4.5 3-7 7.5-7s7.5 2.5 7.5 7' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}


/* ---------------------------------------------------------
   СООБЩЕНИЯ — конверт
   --------------------------------------------------------- */

html.mobile-portrait #navpm > a > span {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='14' rx='2' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M4 7l8 6 8-6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

/* =========================================================
   MOBILE PORTRAIT — размер дополнительных SVG-иконок
   ========================================================= */

html.mobile-portrait #navadmin > a > span > svg,
html.mobile-portrait #navlogout > a > span > svg,
html.mobile-portrait #qps-item > a > span > svg {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
}

/* =========================================================
   MOBILE NAV — прозрачные кнопки
   ========================================================= */

/* Убираем только цвет подложки */
html.mobile-portrait #pun-navlinks .container > li > a,
html.mobile-portrait #pun-navlinks .container > li > a > span {
    background-color: transparent !important;
    box-shadow: none !important;
}

/* НЕ отключаем background-image:
   в нём находятся сами иконки */

/* Вся группа левее и ниже */
html.mobile-portrait #pun-navlinks .container {
    transform: translate(-12px, 18px);
}

/* Иконки внутри своих кнопок возвращаем на нормальное положение */
html.mobile-portrait #pun-navlinks .container > li > a > span {
    top: 9px !important;
}

/* =========================================================
   MOBILE NAV — единый размер и единая линия
   ========================================================= */

/* Убираем только подложку кнопок */
html.mobile-portrait #pun-navlinks .container > li > a {
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Все иконки */
html.mobile-portrait #pun-navlinks .container > li > a > span {
    position: absolute !important;

    top: 19px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 20px !important;
    height: 20px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: block !important;

    font-size: 0 !important;
    line-height: 0 !important;

    color: transparent !important;

    /* ВАЖНО:
       background-image НЕ трогаем.
       Первые иконки используют его. */
    background-color: transparent !important;

    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 20px 20px !important;

    box-shadow: none !important;
}

/* Настоящие SVG внутри span */
html.mobile-portrait #pun-navlinks .container > li > a > span > svg {
    display: block !important;

    width: 20px !important;
    height: 20px !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* =========================================================
   MOBILE NAV — первые пять под линию последних трёх
   ========================================================= */

html.mobile-portrait #pun-navlinks .container > li#navindex > a > span,
html.mobile-portrait #pun-navlinks .container > li#navuserlist > a > span,
html.mobile-portrait #pun-navlinks .container > li#navsearch > a > span,
html.mobile-portrait #pun-navlinks .container > li#navprofile > a > span,
html.mobile-portrait #pun-navlinks .container > li#navpm > a > span {
    top: 14px !important;
}

/* =========================================================
   GUEST MOBILE NAV
   Родные Вход + Регистрация
   ========================================================= */

html.mobile-portrait #pun-navlinks .container > li#navlogin,
html.mobile-portrait #pun-navlinks .container > li#navregister {

    display: inline-block !important;

    position: relative !important;

    width: 42px !important;
    height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    vertical-align: top !important;

    background: transparent !important;

    box-shadow: none !important;
}


/* Ссылки */

html.mobile-portrait #pun-navlinks .container > li#navlogin > a,
html.mobile-portrait #pun-navlinks .container > li#navregister > a {

    display: block !important;

    position: relative !important;

    width: 42px !important;
    height: 48px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


/* Контейнер иконки */

html.mobile-portrait #pun-navlinks .container > li#navlogin > a > span,
html.mobile-portrait #pun-navlinks .container > li#navregister > a > span {

    position: absolute !important;

    top: 14px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    display: block !important;

    width: 18px !important;
    height: 18px !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 0 !important;
    line-height: 0 !important;

    color: transparent !important;

    background-color: transparent !important;

    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 18px 18px !important;
}


/* ВХОД */

html.mobile-portrait #pun-navlinks .container > li#navlogin > a > span {

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 5h6v14h-6' fill='none' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M4 12h11' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M11 8l4 4-4 4' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}


/* РЕГИСТРАЦИЯ */

html.mobile-portrait #pun-navlinks .container > li#navregister > a > span {

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8' r='3' fill='none' stroke='white' stroke-width='2'/%3E%3Cpath d='M3 20c0-3.2 2.4-5 6-5s6 1.8 6 5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M18 7v6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M15 10h6' fill='none' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

/* =========================================================
   MOBILE FORUMS — карточки
   ========================================================= */

html.mobile-portrait #pun-index .main table tr.mobile-forum-card .tclcon {

    width: auto !important;
    max-width: none !important;

    padding-left: 0 !important;

    box-sizing: border-box !important;

    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
}


/* Название форума — всегда в одну строку */

html.mobile-portrait #pun-index .main table tr.mobile-forum-card .tclcon h3 {

    white-space: nowrap !important;

    overflow: visible !important;

    text-overflow: clip !important;

    font-size: 14px !important;

}


/* Описание занимает оставшуюся ширину */

html.mobile-portrait #pun-index .main table tr.mobile-forum-card td.tcl {

    overflow: hidden !important;
}

/* =========================================================
   MOBILE PORTRAIT — ПРОФИЛЬ ПОСТА v2
   ========================================================= */

html.mobile-portrait .punbb .post .post-author {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 10px 10px 12px !important;

    box-sizing: border-box !important;

    position: relative !important;
    overflow: hidden !important;

    text-align: left !important;

    background: #a9ced4 !important;
}


/* общий список */
html.mobile-portrait .punbb .post .post-author > ul {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}


/* все li возвращаем в нормальный поток */
html.mobile-portrait .punbb .post .post-author > ul > li {
    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: left !important;
}


/* НИК — фиолетовая плашка */
html.mobile-portrait .punbb .post .post-author li.pa-author {
    width: calc(100% - 78px) !important;

    padding: 7px 8px !important;

    background: linear-gradient(
    90deg,
    #ed1260 0%,
    #a31371 55%,
    #321661 100%
) !important;

    color: #ffffff !important;

    position: relative !important;
    z-index: 2 !important;
}


/* ТИТУЛ */
html.mobile-portrait .punbb .post .post-author li.pa-title {
    width: calc(100% - 78px) !important;

    margin: 0 !important;
    padding: 4px 8px 5px !important;

    background: transparent !important;

    color: #c9195c !important;
}


/* ONLINE */
html.mobile-portrait .punbb .post .post-author li.pa-online {
    width: calc(100% - 78px) !important;

    margin: 0 !important;
    padding: 0 8px 6px !important;

    font-size: 10px !important;
}


/* АВАТАР */
html.mobile-portrait .punbb .post .post-author li.pa-avatar {
    position: absolute !important;

    top: 10px !important;
    right: 10px !important;

    width: 65px !important;
    height: 65px !important;

    margin: 0 !important;
    padding: 0 !important;

    z-index: 3 !important;
}


html.mobile-portrait .punbb .post .post-author li.pa-avatar img {
    max-width: 65px !important;
    max-height: 65px !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;
}


/* поля */
html.mobile-portrait .punbb .post .post-author li.pa-fld1,
html.mobile-portrait .punbb .post .post-author li.pa-fld2,
html.mobile-portrait .punbb .post .post-author li.pa-fld3 {
    width: 100% !important;

    margin: 4px 0 !important;
    padding: 0 8px !important;

    box-sizing: border-box !important;
}


/* сообщения / уважение */
html.mobile-portrait .punbb .post .post-author li.pa-posts,
html.mobile-portrait .punbb .post .post-author li.pa-respect {
    display: inline-block !important;

    width: auto !important;

    margin: 8px 8px 4px 8px !important;
    padding: 4px 8px !important;

    background: rgba(255,255,255,.3) !important;
}


/* кнопки */
html.mobile-portrait .punbb .post .post-author > .post-author-actions {
    display: flex !important;

    justify-content: center !important;
    gap: 8px !important;

    width: 100% !important;

    margin: 8px 0 0 !important;
    padding: 0 !important;
}