/* ==========================================================================
   ПОЛНЫЙ ПРЕМИАЛЬНЫЙ ФЕНТЕЗИ-ДИЗАЙН ФОРУМА ДЛЯ RUSFF (DRAGON TAMER СБОРКА)
   ========================================================================== */

/* --- 1. ГЛОБАЛЬНЫЙ СТИЛЬ ФОРУМА: ЖИВОЙ ФОН И УДАЛЕНИЕ НАЗВАНИЯ --- */
body, #pun { 
    background: linear-gradient(-45deg, #0e051c, #1a0b2e, #2d144d, #120924, #24143e) !important; 
    background-size: 400% 400% !important; 
    animation: fairyGradient 22s ease infinite !important; 
    background-attachment: fixed !important; 
    color: #e2e8f0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}
@keyframes fairyGradient { 
    0% { background-position: 0% 50%; } 
    50% { background-position: 100% 50%; } 
    100% { background-position: 0% 50%; }
}
body::before { 
    content: "" !important; 
    position: fixed !important; 
    top: 0; left: 0; right: 0; bottom: 0; 
    background: radial-gradient(circle at 50% 30%, rgba(186, 85, 211, 0.06), transparent 50%) !important; 
    pointer-events: none !important; 
    z-index: 0 !important;
}
#pun-title, .punbb h1, #pun-header h1, #pun-title h1 { display: none !important; }

.punbb, #pun-main, .main, #pun-crumbs1, #pun-crumbs2, #pun-stats, #pun-break1, #pun-break2 {
    width: 100% !important;
    max-width: 98% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* --- 2. ГЛОБАЛЬНЫЙ СТИЛЬ: КОМПАКТНАЯ НАВИГАЦИЯ --- */
#pun-navlinks ul { 
    display: flex !important; 
    flex-direction: row !important; 
    flex-wrap: wrap !important; 
    justify-content: center !important; 
    align-items: center !important; 
    gap: 4px !important; 
    padding: 8px 14px !important; 
    list-style: none !important; 
    background: rgba(14, 8, 26, 0.95) !important; 
    border: 1px solid rgba(223, 183, 67, 0.4) !important; 
    border-radius: 4px !important; 
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
}
#pun-navlinks li, #pun-navlinks li::before, #pun-navlinks a::before { 
    list-style: none !important; 
    content: "" !important; 
    display: inline-block !important; 
    margin: 0 !important; 
}

/* --- 3. ГЛОБАЛЬНЫЙ СТИЛЬ: УВЕЛИЧЕННЫЙ ШРИФТ И СЕТКА ТАБЛИЦ --- */
#pun .punbb, #pun td, #pun th, #pun p, #pun li, #pun span, #pun div, .post-content, .post-entry, .post-body, .post-box, .post-box p, .post-entry p, .post .post-content { 
    font-family: 'Segoe UI', Arial, sans-serif !important; 
    font-size: 16px !important; 
    line-height: 1.65 !important; 
    color: #ede7d5 !important; 
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9) !important;
}
.punbb h2 { font-size: 14px !important; }
.punbb a { color: #ffd700 !important; text-decoration: none !important; transition: all 0.25s ease !important; }
.punbb a:hover { color: #ff9d00 !important; text-shadow: 0 0 6px rgba(255, 157, 0, 0.6) !important; }

.punbb .main table { border-collapse: collapse !important; width: 100% !important; background: transparent !important; margin-bottom: 12px !important; }
.punbb td, .punbb th { padding: 12px 16px !important; border: 1px solid rgba(255, 215, 0, 0.15) !important; background: rgba(19, 12, 33, 0.82) !important; }

.category h2, .forum th, h2.title { 
    font-family: Georgia, serif !important; 
    background: linear-gradient(90deg, #441359, #20062e) !important; 
    border: 1px solid rgba(186, 85, 211, 0.3) !important; 
    padding: 10px 14px !important; 
}
.category h2 span { color: #ffffff !important; font-weight: 600 !important; text-transform: uppercase !important; letter-spacing: 1px !important; font-size: 11px !important; }

/* --- 4. ГЛОБАЛЬНЫЙ СТИЛЬ: СТРУКТУРНЫЕ РАЗДЕЛИТЕЛИ КАТЕГОРИЙ --- */
.punbb tr:hover td, .category tr:hover td { background: rgba(30, 19, 51, 0.92) !important; border-color: rgba(186, 85, 211, 0.4) !important; transition: all 0.2s ease !important; }
.category { margin-bottom: 60px !important; position: relative; background: rgba(255, 255, 255, 0.03) !important; border: 1px solid rgba(163, 163, 163, 0.15) !important; border-radius: 6px !important; padding: 10px !important; }
.category::after { content: "" !important; position: absolute; bottom: -30px; left: 10%; right: 10%; height: 1px; background: linear-gradient(to right, rgba(163,163,163,0), rgba(163,163,163,0.5) 20%, rgba(163,163,163,0.5) 80%, rgba(163,163,163,0)); display: block; }
.category::before { content: "" !important; position: absolute; bottom: -34px; left: 50%; transform: translateX(-50%) rotate(45deg); width: 8px; height: 8px; background-color: #a3a3a3; border: 1px solid #ffffff; display: block; }
.category:last-of-type::after, .category:last-of-type::before { display: none !important; }

/* --- 5. БЛОКИ СООБЩЕНИЙ --- */
.post { 
    background: rgba(19, 12, 33, 0.85) !important; 
    border: 1px solid rgba(223, 183, 67, 0.2) !important; 
    border-radius: 12px !important; 
    margin-bottom: 18px !important; 
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4) !important; 
    overflow: hidden !important; 
    width: 100% !important; 
}
.post table.post-table, .post table.post-table tr { width: 100% !important; }
.post td.post-body { display: block !important; width: 100% !important; padding: 25px !important; box-sizing: border-box !important; clear: both !important; }

/* --- 6. КАРТОЧКА АВТОРА И ПОСТБИТ (TAMER-GRID) --- */
.tamer-grid {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  padding: 12px !important;
  box-sizing: border-box !important;
}
.tamer-nick-row {
  font-size: 1.15em !important;
  font-weight: bold !important;
  margin-bottom: 12px !important;
  text-align: center !important;
  width: 100% !important;
}
.tamer-nick-row a { display: inline-block !important; }
.tamer-middle-container {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important; 
  gap: 14px !important;
  width: 100% !important;
  margin-bottom: 12px !important;
}
.tamer-left-avatar-block {
  flex-shrink: 0 !important;
  width: 100px !important; 
  height: 100px !important;
  background: transparent !important; 
  border: none !important;             
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.tamer-left-avatar-block img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}
.tamer-right-info-block {
  flex-grow: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;    
  justify-content: flex-start !important;
  text-align: right !important;              
  gap: 6px !important; 
  width: calc(100% - 114px) !important; 
}
.tamer-info-line {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
  text-align: right !important; 
  float: none !important;       
}
.tamer-grp, .tamer-pts, .tamer-onl {
  font-weight: bold !important; 
  display: inline-block !important;
  text-align: right !important;  
  float: right !important;       
  width: 100% !important;        
}
.tamer-pts { color: #94a3b8 !important; }
.tamer-onl { font-size: 0.85em !important; }

/* --- ИНТЕГРИРОВАННЫЙ БЛОК НАГРАД (TAMER-AWARDS) --- */
.tamer-bottom-row {
  width: 100% !important;
  background: rgba(14, 8, 26, 0.6) !important;          /* Глубокий темный фон подложки */
  border: 1px solid rgba(217, 119, 6, 0.25) !important;  /* Аккуратная рамка в тон общей темы */
  border-radius: 6px !important;
  padding: 8px !important;
  margin-top: 6px !important;
  box-sizing: border-box !important;
  max-height: 90px;                                     /* Максимум 2 ряда наград. Все, что выше, уйдет в скролл */
  overflow-y: auto;                                     /* Авто-скролл, защищающий постбит от растягивания */
}

/* Полное удаление мешающего системного текста «Награды:», ломающего верстку */
.tamer-bottom-row strong, 
.tamer-bottom-row .mini_awards_label,
.post .pa-awards strong { 
  display: none !important; 
}

.tamer-awards-title {
  font-size: 0.75em !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  color: #fbbf24 !important;
  margin-bottom: 6px !important;
  opacity: 0.9 !important;
  text-align: center !important;                        /* Центрирование заголовка в блоке */
  font-weight: bold !important;
}

/* Симметричная флекс-сетка для иконок-медалей */
.tamer-awd, 
.tamer-bottom-row .mini_awards, 
.tamer-bottom-row div {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;                                  /* Шаг между иконками по осям */
  justify-content: center !important;                   /* Выравнивание наград строго по центру */
  margin: 0 !important;
  padding: 0 !important;
}

/* Фентези-стилизация самих картинок-наград */
.tamer-custom-award-icon,
.tamer-bottom-row img {
  width: 24px !important;
  height: 24px !important;
  object-fit: contain !important;
  background: rgba(32, 18, 58, 0.8) !important;         /* Фиолетовая подложка под каждую медаль */
  border: 1px solid rgba(251, 191, 36, 0.4) !important;  /* Приглушенная золотая рамка */
  border-radius: 4px !important;
  padding: 2px !important;
  transition: all 0.25s ease-in-out !important;
  cursor: help !important;                              /* Знак вопроса при наведении на награду */
}

/* Эффект при наведении (Золотое премиальное свечение) */
.tamer-custom-award-icon:hover,
.tamer-bottom-row img:hover {
  border-color: #fbbf24 !important;
  transform: scale(1.18) !important;                    /* Аккуратное увеличение медальки */
  box-shadow: 0 0 8px rgba(251, 191, 36, 0.7) !important; /* Мягкое свечение */
}


/* ==========================================================================
   ЧИСТЫЙ CSS ДЛЯ НАГРАД (БЕЗ JAVASCRIPT, БЕЗ СБОЕВ БЫСТРОГО ОТВЕТА)
   ========================================================================== */

/* 1. Главный контейнер наград в профиле автора */
.post .post-author .pa-awards {
    display: block !important;
    margin: 10px auto 4px auto !important;
    padding: 8px !important;
    width: 95% !important;                  /* Ширина блока внутри профиля */
    max-height: 90px !important;            /* Вмещает около 2 рядов медалей */
    overflow-y: auto !important;            /* Включает скроллбар, если наград слишком много */
    background: rgba(14, 8, 26, 0.6) !important;          /* Глубокий темный фон под тему */
    border: 1px solid rgba(217, 119, 6, 0.25) !important;  /* Аккуратная рамка в тон Dragon Tamer */
    border-radius: 6px !important;
    box-sizing: border-box !important;
    text-align: center !important;          /* Центрирование наград */
}

/* 2. Полное удаление системного текста "Награды:", ломающего ряды */
.post .post-author .pa-awards > strong, 
.post .post-author .pa-awards > span.mini_awards_label,
.post .post-author .pa-awards br {
    display: none !important;
}

/* 3. Создание ровной флекс-сетки для медалей */
.post .post-author .pa-awards .mini_awards,
.post .post-author .pa-awards div {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;     /* Центрируем иконки внутри рамки */
    gap: 6px !important;                    /* Расстояние между медалями */
    margin: 0 !important;
    padding: 0 !important;
}

/* 4. Премиальная стилизация картинок наград */
.post .post-author .pa-awards img,
.post .post-author img.tamer-custom-award-icon {
    display: inline-block !important;
    width: 24px !important;                 /* Жесткий размер медалей */
    height: 24px !important;
    object-fit: contain !important;
    padding: 2px !important;
    background: rgba(32, 18, 58, 0.8) !important;         /* Фиолетовая подложка под иконку */
    border: 1px solid rgba(251, 191, 36, 0.4) !important;  /* Приглушенный золотой контур */
    border-radius: 4px !important;
    transition: all 0.25s ease-in-out !important;          /* Плавное увеличение */
    cursor: help !important;                /* Курсор в виде знака вопроса с подсказкой названия */
}

/* 5. Эффект при наведении (Премиальное золотое свечение) */
.post .post-author .pa-awards img:hover,
.post .post-author img.tamer-custom-award-icon:hover {
    border-color: #fbbf24 !important;
    transform: scale(1.18) !important;                    /* Легкое увеличение на 18% */
    box-shadow: 0 0 8px rgba(251, 191, 36, 0.7) !important; /* Мягкий золотой неон */
}

/* 6. Аккуратный тонкий скроллбар для наград */
.post .pa-awards::-webkit-scrollbar {
    width: 4px;
}
.post .pa-awards::-webkit-scrollbar-track {
    background: transparent;
}
.post .pa-awards::-webkit-scrollbar-thumb {
    background: rgba(217, 119, 6, 0.4);
    border-radius: 2px;
}
.post .pa-awards::-webkit-scrollbar-thumb:hover {
    background: rgba(251, 191, 36, 0.8);
}



/* ==========================================================================
   УСТРАНЕНИЕ МОБИЛЬНОЙ ТРЯСКИ ПРИ ГОРИЗОНТАЛЬНОМ ПОВОРОТЕ ТЕЛЕФОНА
   ========================================================================== */
@media screen and (max-width: 1024px) {
  /* Фиксируем ширину карточки и запрещаем ей прыгать */
  .tamer-grid {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  
  /* Намертво блокируем показ оригинального списка, чтобы он не дёргал верстку */
  .post .post-author ul.tamer-processed-list,
  .post .post-author ul.tamer-killed {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
  }
}


/* ЖЕСТКИЙ СТАБИЛИЗАТОР ВЫСОТЫ ПРОФИЛЯ ОТ ТРЯСКИ */
.post .post-author, td.post-author {
  min-height: 250px !important; /* Установите примерную высоту вашего нового красивого профиля */
  contain: layout style; /* Запрещает изменениям внутри профиля трясти всю остальную страницу */
}

/* Скрываем старый список мгновенно, до отрисовки скрипта, чтобы не было скачка */
.post .post-author ul:not(.tamer-processed-list) {
  opacity: 0;
  position: absolute;
  pointer-events: none;
}

/* ==========================================================
   ФИНАЛЬНЫЕ УЛЬТРА-МИКРО РАМОЧКИ DRAGON TAMER (ЧИСТЫЙ CSS)
============================================================= */

/* 1. Скрываем дефолтные круглые иконки-папки форума */
#vf td.tcl img, .forum td.tcl img, td.tcl img, td.tcl .icon, tr.isticky div.icon {
    display: none !important;
}

/* Настраиваем правильное положение ячейки темы */
td.tcl, #vf td.tcl {
    padding-left: 10px !important;
    text-align: left !important;
    position: relative !important;
}

/* Названия тем остаются крупными и сдвигаются вправо под рамочку */
td.tcl a, .tcl a {
    display: inline-block !important;
    vertical-align: middle !important;
    text-decoration: none !important;
    font-size: inherit !important;
    position: relative !important;
}

/* 2. РАЗДЕЛЕНИЕ ПЛАШЕК И ТЕКСТА (Создаем фиксированный отступ внутри ссылки) */
/* 🎯 ИСПРАВЛЕНО: Для двухэтажных плашек достаточно компактного отступа в 58px */
tr.isticky td.tcl a:not([href*="profile"]), 
tr.pinned td.tcl a:not([href*="profile"]), 
tr.iclosed td.tcl a:not([href*="profile"]), 
tr.ipoll td.tcl a:not([href*="profile"]), 
tr.inew td.tcl a:not([href*="profile"]) {
    padding-left: 58px !important; 
}

/* Начисто убираем старые встроенные теги префиксов */
td.tcl strong, .tcl strong, td.tcl em, .tcl em {
    font-weight: normal !important;
    font-style: normal !important;
}
.tclcon > strong:first-child, .intd > strong:first-child, td.tcl em {
    font-size: 0 !important;
    color: transparent !important;
}

/* Полный сброс отступов для модераторов, авторов и пагинации */
td.tcl a[href*="profile"], td.tcl .modlist a, td.tcl span.byuser a, #pun-modlist a, .linksb a {
    padding-left: 0 !important;
    margin-left: 0 !important;
    display: inline !important;
}

td.tcl span.byuser {
    font-weight: normal !important;
    font-style: normal !important;
    display: inline !important;
}

/* 3. ГЕНЕРАЦИЯ ОБЩИХ ПРАВИЛ ДЛЯ РАМОЧЕК */
tr.isticky td.tcl a:not([href*="profile"])::before,
tr.pinned td.tcl a:not([href*="profile"])::before,
tr.iclosed td.tcl a:not([href*="profile"])::before,
tr.ipoll td.tcl a:not([href*="profile"])::before,
tr.inew td.tcl a:not([href*="profile"])::before,
tr.isticky td.tcl a:not([href*="profile"])::after,
tr.iclosed td.tcl a:not([href*="profile"])::after {
    position: absolute !important;
    left: 0 !important;                /* Всегда прижаты к левому краю ссылки */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 50px !important;
    padding: 1px 6px !important;       
    height: 12px !important;            /* Сделали чуть тоньше для идеального двухэтажного отображения */
    font-family: 'Segoe UI', Tahoma, sans-serif !important;
    font-size: 7.5px !important;          
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;     
    border-radius: 1.5px !important;
    box-sizing: border-box !important;
    color: #ffffff !important;
    box-shadow: 0 1px 1px rgba(0,0,0,0.15) !important;
    z-index: 5 !important;
}

/* Абсолютный запрет на появление псевдоэлементов-рамок у любых модераторов */
td.tcl a[href*="profile"]::before, td.tcl .modlist a::before, td.tcl span.byuser a::before,
td.tcl span.pagelink a::before, #pun-modlist a::before, .linksb a::before,
td.tcl a[href*="profile"]::after, td.tcl .modlist a::after, td.tcl span.byuser a::after {
    display: none !important;
    content: "" !important;
}

/* 🔥 СТИХИЯ ОГНЯ: Важная тема (Микро-баннер ВАЖНО) */
/* 🎯 ИСПРАВЛЕНО: Если тема одновременно Важная и Закрытая, то ВАЖНО уходит на верхний «этаж» */
tr.isticky td.tcl a:not([href*="profile"])::before,
tr[class*="sticky"] td.tcl a:not([href*="profile"])::before {
    content: "ВАЖНО" !important;
    background: #2b0f02 !important;
    border: 1px solid #ff5500 !important;
    color: #ff9e00 !important;
    text-shadow: 0 0 1px #ff5500 !important;
}
/* Позиционирование по высоте: если комбо, то сверху, если обычная — строго по центру */
tr.isticky:not(.iclosed) td.tcl a:not([href*="profile"])::before,
tr[class*="sticky"]:not([class*="closed"]) td.tcl a:not([href*="profile"])::before {
    top: 50% !important;
    transform: translateY(-50%) skewX(-8deg) !important;
}
tr.isticky.iclosed td.tcl a:not([href*="profile"])::before,
tr[class*="sticky"][class*="closed"] td.tcl a:not([href*="profile"])::before {
    top: 22% !important; /* Верхний этаж */
    transform: translateY(-50%) skewX(-8deg) !important;
}
tr.isticky td.tcl a, tr[class*="sticky"] td.tcl a {
    font-weight: bold !important;
}

/* 🌊 СТИХИЯ ЛЬДА: Закрытая тема (Микро-баннер ЗАКРЫТО) */
/* 🎯 ИСПРАВЛЕНО: Если тема просто закрытая (без важно), центрируем её */
tr.iclosed:not(.isticky) td.tcl a:not([href*="profile"])::before,
tr[class*="closed"]:not([class*="sticky"]) td.tcl a:not([href*="profile"])::before {
    top: 50% !important;
    transform: translateY(-50%) skewX(-8deg) !important;
    content: "ЗАКРЫТО" !important;
    background: #091a2c !important;
    border: 1px solid #3ca5d9 !important;
    color: #51cbff !important;
    text-shadow: 0 0 1px #51cbff !important;
}
tr.iclosed td.tcl a {
    color: #8ab4f8 !important; 
    opacity: 0.75 !important;
}

/* 🎯 ИСПРАВЛЕНО: Если тема комбо (Важная + Закрытая), то ЗАКРЫТО уходит на нижний «этаж» через ::after */
tr.isticky.iclosed td.tcl a:not([href*="profile"])::after,
tr[class*="sticky"][class*="closed"] td.tcl a:not([href*="profile"])::after {
    top: 78% !important; /* Нижний этаж */
    transform: translateY(-50%) skewX(-8deg) !important;
    content: "ЗАКРЫТО" !important;
    background: #091a2c !important;
    border: 1px solid #3ca5d9 !important;
    color: #51cbff !important;
    text-shadow: 0 0 1px #51cbff !important;
}

/* 🔮 СТИХИЯ ТЬМЫ: Тема-Опрос (Микро-баннер ОПРОС) */
tr.ipoll:not(.iclosed):not(.isticky) td.tcl a:not([href*="profile"])::before {
    top: 50% !important;
    transform: translateY(-50%) skewX(-8deg) !important;
    content: "ОПРОС" !important;
    background: #1a092c !important;
    border: 1px solid #9b5de5 !important;
    color: #9b5de5 !important;
    text-shadow: 0 0 1px #9b5de5 !important;
}

/* 🌿 СТИХИЯ ЛЕСА: Новое сообщение (Микро-баннер НОВОЕ) */
tr.inew:not(.isticky):not(.pinned):not([class*="sticky"]):not(.iclosed):not([class*="closed"]) td.tcl a:not([href*="profile"])::before {
    top: 50% !important;
    transform: translateY(-50%) skewX(-8deg) !important;
    content: "НОВОЕ" !important;
    background: #05180c !important;
    border: 1px solid #52b788 !important;
    color: #74c69d !important;
    text-shadow: 0 0 1px #52b788 !important;
}

/* Очистка для обычных прочитанных тем */
tr:not(.isticky):not(.pinned):not([class*="sticky"]):not(.iclosed):not([class*="closed"]):not(.ipoll):not(.inew) td.tcl a::before,
tr:not(.isticky):not(.pinned):not([class*="sticky"]):not(.iclosed):not([class*="closed"]):not(.ipoll):not(.inew) td.tcl a::after {
    display: none !important;
}
tr:not(.isticky):not(.pinned):not([class*="sticky"]):not(.iclosed):not([class*="closed"]):not(.ipoll):not(.inew) td.tcl a {
    padding-left: 0 !important;
}