test for test

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » test for test » Тестовый форум » коды и оформление.


коды и оформление.

Сообщений 1 страница 5 из 5

1

[html]
<style>
:root {
  --kshow-paper: #f4f3f1;
  --kshow-panel: #eae9e7;
  --kshow-text: #39393c;
  --kshow-muted: #737378;
  --kshow-line: #d8d7d5;
  --kshow-button: #414145;
  --kshow-hover: #595960;
  --kshow-light: #faf9f7;
}

.kshow {
  width: 100%;
  max-width: 820px;
  margin: 20px auto;
  overflow: hidden;
  border: 1px solid var(--kshow-line);
  border-radius: 14px;
  background: var(--kshow-paper);
  color: var(--kshow-text);
  font: 14px/1.7 Arial, sans-serif;
  box-sizing: border-box;
}

.kshow .kshow-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
  background: var(--kshow-panel);
}

.kshow .kshow-preview {
  display: block;
  min-width: 0;
  overflow: hidden;
  border-radius: 8px;
  color: var(--kshow-muted);
  text-decoration: none;
}

.kshow .kshow-preview img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0;
}

.kshow .kshow-copy {
  padding: 24px 28px 28px;
}

.kshow .kshow-label {
  margin: 0 0 8px;
  color: var(--kshow-muted);
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.kshow .kshow-title {
  margin: 0 0 16px;
  color: var(--kshow-text);
  font: italic 28px/1.2 Georgia, serif;
}

.kshow .kshow-text {
  margin: 0 0 14px;
  font: inherit;
}

.kshow .kshow-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--kshow-line);
}

.kshow .kshow-button {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 9px 16px;
  border-radius: 7px;
  background: var(--kshow-button);
  color: var(--kshow-light);
  font: 12px/1.5 Arial, sans-serif;
  text-decoration: none;
  transition: background-color 180ms ease;
}

.kshow .kshow-button:hover,
.kshow .kshow-button:focus-visible {
  background: var(--kshow-hover);
}

.kshow .kshow-credit {
  color: var(--kshow-muted);
  font: italic 14px/1.4 Georgia, serif;
}
</style>

<div class="kshow">
  <div class="kshow-gallery">
    <a class="kshow-preview"
       href="https://upforme.ru/uploads/000f/09/5e/16842/511464.png"
       target="_blank"
       rel="noopener noreferrer">
      <img src="https://upforme.ru/uploads/000f/09/5e/16842/511464.png"
           alt="Светлая версия оформления"
           loading="lazy">
    </a>

    <a class="kshow-preview"
       href="https://upforme.ru/uploads/000f/09/5e/16842/263333.png"
       target="_blank"
       rel="noopener noreferrer">
      <img src="https://upforme.ru/uploads/000f/09/5e/16842/263333.png"
           alt="Тёмная версия оформления"
           loading="lazy">
    </a>
  </div>

  <div class="kshow-copy">
    <p class="kshow-label">бесплатное оформление для теста</p>
    <h2 class="kshow-title">ЗИМА БЛИЗКО</h2>

    <p class="kshow-text">
      Всем привет. Делюсь простым оформлением с вайбами падающих снежинок и легкой анимацией в шапке и прочих неожиданных местах, в котором приятно оставаться.
    </p>

    <p class="kshow-text">
      Две версии — светлая и тёмная.
      На тестовом форуме можно рассмотреть детали и забрать коды.
      Тестировался малыми силами, можно принести в личку фидбеки и правки.
    </p>

    <div class="kshow-bottom">
      <a class="kshow-button"
         href="https://icash.rusff.me/"
         target="_blank"
         rel="noopener noreferrer">
        Посмотреть на тесте <span aria-hidden="true">↗</span>
      </a>

      <span class="kshow-credit">design by кешью.</span>
    </div>
  </div>
</div>
[/html]
[hideprofile]

0

2

НАСТРОЙКИ

HTML верх
Код:
<script>
(function () {
  'use strict';
  var viewport = document.querySelector('meta[name="viewport"]');
  if (!viewport) {
    viewport = document.createElement('meta');
    viewport.name = 'viewport';
    document.head.appendChild(viewport);
  }
  viewport.content = 'width=1200';
  window.RVContourConfig = {
    captions: {
      'pun-category1': 'Истории начинаются со знакомства',
      'pun-category2': 'Место для новых глав',
      'pun-category3': 'Длинное описание длинное описание длинное описание длинное описание длинное описание'
    }
  };
  try {
    document.documentElement.dataset.rvTone = localStorage.getItem('rv-contour-tone') === 'dark' ? 'dark' : 'light';
  } catch (error) {}

  function configure() {
    if (window.RusffCore && RusffCore.sets) {
      RusffCore.sets.show_reportBtn = 0;
      RusffCore.sets.share = false;
      if (RusffCore.sets.files) RusffCore.sets.files.button = false;
      RusffCore.sets.realtimeTopicReaders = false;
    }
    if (window.rusffLive) rusffLive.enable = false;
    if (window.ReactionsPlugin && typeof ReactionsPlugin.setConfig === 'function') {
      ReactionsPlugin.setConfig({ disable: true });
    }
  }
  configure();
  document.addEventListener('DOMContentLoaded', configure, { once: true });
  window.addEventListener('load', configure, { once: true });
})();
</script>

<!-- Быстроплюсы v.2 РЕНО, Deff -->
<script src="https://forumstatic.ru/files/0012/d8/04/58219.js" addcomment="1"></script>

<!-- скрытие профиля -->
<style>
#pun .post.hideprofile > .container {
  grid-template-columns: minmax(0, 1fr);
}

#pun .post.hideprofile .post-author,
#pun .post.hideprofile .pl-email,
#pun .post.hideprofile .pl-website,
#pun .post.hideprofile .post-sig {
  display: none !important;
}

#pun .post.hideprofile .post-body,
#pun .post.hideprofile .post-links,
#pun .post.hideprofile .post-links ul,
#pun .post.hideprofile h3 > span {
  margin-left: 0 !important;
}
</style>

<!-- Смена аватара в теме, Deff и Alex_63 -->
<script src="https://forumstatic.ru/files/0015/c4/3f/67169.js"></script>
HTML низ
Код:
<div class="rv-scroll">
  <button type="button" class="rv-icon-button" data-rv-top aria-label="В начало страницы" title="В начало страницы"></button>
  <button type="button" class="rv-icon-button" data-rv-bottom aria-label="В конец страницы" title="В конец страницы"></button>
</div>
<script>
(function () {
  'use strict';
  if (window.RVWinter2026) return;
  window.RVWinter2026 = true;

  function init() {
    var root = document.documentElement;
    var forum = document.getElementById('pun');
    if (!forum) return;
    var config = window.RVContourConfig || { captions: {} };
    var admin = !!document.getElementById('pun-admain');

    var ambience = document.createElement('div');
    ambience.className = 'rv-fireflies';
    ambience.setAttribute('aria-hidden', 'true');
    for (var particle = 0; particle < 5; particle++) ambience.appendChild(document.createElement('i'));
    document.body.prepend(ambience);

    /* Управление страницей */
    var title = document.getElementById('pun-title');
    if (title && !title.querySelector('[data-rv-tone]')) {
      var tone = document.createElement('button');
      tone.type = 'button';
      tone.className = 'rv-icon-button rv-tone';
      tone.setAttribute('data-rv-tone', '');
      title.appendChild(tone);
      function updateTone() {
        var dark = root.dataset.rvTone === 'dark';
        tone.title = dark ? 'Включить светлую тему' : 'Включить тёмную тему';
        tone.setAttribute('aria-label', tone.title);
        tone.setAttribute('aria-pressed', String(dark));
      }
      tone.addEventListener('click', function () {
        root.dataset.rvTone = root.dataset.rvTone === 'dark' ? 'light' : 'dark';
        try { localStorage.setItem('rv-contour-tone', root.dataset.rvTone); } catch (error) {}
        updateTone();
      });
      updateTone();
    }
    forum.querySelectorAll('[data-rv-top], [data-rv-bottom]').forEach(function (button) {
      button.addEventListener('click', function () {
        window.scrollTo({
          top: button.hasAttribute('data-rv-bottom') ? document.documentElement.scrollHeight : 0,
          behavior: matchMedia('(prefers-reduced-motion: reduce)').matches ? 'auto' : 'smooth'
        });
      });
    });

    /* Закреплённое меню */
var navigation = document.getElementById('pun-navlinks');
var userLinks = document.getElementById('pun-ulinks');
var forumTitle = document.getElementById('pun-title');

if (!admin && navigation && userLinks && forumTitle) {
  var menuDock = document.createElement('div');
  menuDock.className = 'rv-menu-dock';

  forumTitle.before(menuDock);
  menuDock.appendChild(navigation);
  forumTitle.after(userLinks);

  var menuFrame = 0;

  function updateMenuPosition() {
    menuFrame = 0;

    var menuHeight = menuDock.offsetHeight;
    var subHeight = userLinks.offsetHeight;
    var joined = userLinks.getBoundingClientRect().top <= menuHeight + 1;

    menuDock.classList.toggle('is-joined', joined);

var themeButton = document.querySelector('#pun .rv-tone');

if (themeButton) {
  var themeTarget = joined ? menuDock : forumTitle;

  if (themeButton.parentElement !== themeTarget) {
    themeTarget.appendChild(themeButton);
  }
}

    document.documentElement.style.setProperty(
      '--rv-nav-height',
      (menuHeight + (joined ? subHeight : 0)) + 'px'
    );
  }

  function scheduleMenuPosition() {
    if (!menuFrame) {
      menuFrame = requestAnimationFrame(updateMenuPosition);
    }
  }

  function measureMenus() {
    document.documentElement.style.setProperty(
      '--rv-menu-height',
      menuDock.offsetHeight + 'px'
    );

    scheduleMenuPosition();
  }

  var menuObserver = new ResizeObserver(measureMenus);
  menuObserver.observe(menuDock);
  menuObserver.observe(userLinks);

  window.addEventListener('scroll', scheduleMenuPosition, {
    passive: true
  });

  window.addEventListener('resize', measureMenus);
  window.addEventListener('pageshow', measureMenus);

  measureMenus();
}

    /* Категории */
    if (!admin) forum.querySelectorAll('.category').forEach(function (category, index) {
      var heading = category.querySelector('h2');
      var container = category.querySelector('.container');
      if (!heading || !container || category.dataset.rvReady) return;
      category.dataset.rvReady = 'true';
      var compact = true;
      container.querySelectorAll('table > tbody > tr').forEach(function (row) {
        var cell = row.querySelector('td.tcl');
        var layout = cell && cell.querySelector('.intd');
        var content = cell && cell.querySelector('.tclcon');
        var name = content && content.querySelector('h3');
        var topics = row.querySelector('td.tc2');
        var posts = row.querySelector('td.tc3');
        if (!name || !topics || !posts) { compact = false; return; }
        var counts = document.createElement('p');
        counts.className = 'rv-counts';
        counts.textContent = 'Тем: ' + topics.textContent.trim() + ' · Сообщений: ' + posts.textContent.trim();
        name.after(counts);
        var links = cell.querySelector('.rv-forum-links, .podfl');
        if (links) content.appendChild(links);
        content.querySelectorAll('strong, span, em').forEach(function (label) {
          if (/^\s*\[\s*Новые сообщения\s*\]\s*$/i.test(label.textContent)) {
            label.classList.add('rv-unread-label');
            row.classList.add('inew');
          }
        });
        var state = document.createElement('i');
        state.className = 'rv-forum-state';
        state.setAttribute('role', 'img');
        state.title = row.matches('.inew, .inewclosed') ? 'Есть непрочитанные сообщения' : 'Нет непрочитанных сообщений';
        state.setAttribute('aria-label', state.title);
        name.prepend(state);
      });
      if (compact) category.classList.add('rv-compact');
      var caption = config.captions && config.captions[category.id];
      if (caption) {
        var description = document.createElement('p');
        description.className = 'rv-caption';
        description.textContent = caption;
        heading.after(description);
      }
      var fold = document.createElement('div');
      var inner = document.createElement('div');
      fold.className = 'rv-fold';
      fold.id = 'rv-fold-' + index;
      inner.className = 'rv-fold-inner';
      container.before(fold);
      fold.appendChild(inner);
      inner.appendChild(container);
      var toggle = document.createElement('button');
      toggle.type = 'button';
      toggle.className = 'rv-toggle';
      toggle.setAttribute('aria-controls', fold.id);
      var categoryName = heading.textContent.trim();
      heading.appendChild(toggle);
      var key = location.host + ':rv-contour:' + (category.id || index);
      var closed = false;
      try { closed = localStorage.getItem(key) === 'closed'; } catch (error) {}
      function updateFold() {
        fold.classList.toggle('is-closed', closed);
        fold.inert = closed;
        fold.setAttribute('aria-hidden', String(closed));
        toggle.setAttribute('aria-expanded', String(!closed));
        toggle.setAttribute('aria-label', (closed ? 'Развернуть: ' : 'Свернуть: ') + categoryName);
      }
      toggle.addEventListener('click', function () {
        closed = !closed;
        updateFold();
        try { localStorage.setItem(key, closed ? 'closed' : 'open'); } catch (error) {}
      });
      updateFold();
    });

    /* Непрочитанные сообщения */
    function updateUnread() {
      forum.querySelectorAll('.category tbody tr').forEach(function (row) {
        row.querySelectorAll('.tclcon *').forEach(function (node) {
          if (node.children.length || !/^\s*\[?\s*Новы[еxх] сообщения\s*\]?\s*$/i.test(node.textContent)) return;
          node.classList.add('rv-unread-label');
          row.classList.add('inew');
        });
        var state = row.querySelector('.rv-forum-state');
        if (state) {
          state.title = row.matches('.inew, .inewclosed') ? 'Есть непрочитанные сообщения' : 'Нет непрочитанных сообщений';
          state.setAttribute('aria-label', state.title);
        }
      });
    }
    updateUnread();

    /* Посты */
    function preparePosts() {
    forum.querySelectorAll('.post').forEach(function (post) {
      if (post.dataset.rvPostReady || !post.querySelector('.post-body')) return;
      post.dataset.rvPostReady = 'true';
      var author = post.querySelector('.post-author');
      var body = post.querySelector('.post-body');
      var header = post.querySelector(':scope > h3');
      if (header && body) {
        var original = header.textContent.trim();
        var numberLink = Array.from(header.querySelectorAll('a')).find(function (a) {
          return /^\s*[#№]?\d+\s*$/.test(a.textContent);
        });
        var numberNode = header.querySelector('.post-num, .post-number');
        var number = numberLink ? numberLink.textContent : numberNode ? numberNode.textContent : '';
        if (!number) {
          var walker = document.createTreeWalker(header, NodeFilter.SHOW_TEXT);
          while (walker.nextNode()) {
            if (/^\s*[#№]?\d+\s*$/.test(walker.currentNode.textContent)) {
              number = walker.currentNode.textContent;
              break;
            }
          }
        }
        var dateLink = Array.from(header.querySelectorAll('a')).find(function (a) {
          return a !== numberLink && /\d{1,2}:\d{2}/.test(a.textContent);
        });
        var date = document.createElement('span');
        date.className = 'rv-post-date';
        if (dateLink) date.appendChild(dateLink);
        else date.textContent = original.replace(/^\s*(?:Сообщение\s*)?[#№]?\d+\s*(?=\d{4}-|Сегодня|Вчера)/i, '').replace(/^Сообщение\s*/i, '');
        var index = document.createElement('span');
        index.className = 'rv-post-number';
        if (numberLink) { numberLink.textContent = '#' + number.replace(/\D/g, ''); index.appendChild(numberLink); }
        else if (number) index.textContent = '#' + number.replace(/\D/g, '');
        header.replaceChildren(date, index);
        header.className = 'rv-post-heading';
        body.prepend(header);
      }
      var actions = post.querySelector('.post-links');
      if (actions) {
        post.appendChild(actions);
        var firstAction = false;
        actions.querySelectorAll('a').forEach(function (a) {
          var text = a.textContent.trim();
          var match = text.match(/^(Профиль|ЛС|E-mail|Удалить|Редактировать|Цитировать|Ответить)(?=\s|$)/i);
          if (!match) return;
          a.textContent = match[1];
          a.classList.add('rv-link-label');
          if (!firstAction && /^(Удалить|Редактировать|Цитировать|Ответить)$/i.test(match[1])) {
            var item = a.closest('li');
            if (item) item.classList.add('rv-action-start');
            firstAction = true;
          }
        });
      }
      if (author) {
        author.querySelectorAll('li').forEach(function (row) {
          if (/gift|user.?agent/i.test(row.className) || /^(Подарк(?:и|ов)|User[ -]?Agent)\s*:/i.test(row.textContent.trim())) row.hidden = true;
        });
        var status = author.querySelector('.pa-online');
        var active = author.classList.contains('online') || post.classList.contains('online') || !!(status && /Активен|В сети|Онлайн/i.test(status.textContent));
        if (status && /Не в сети|Оффлайн/i.test(status.textContent)) active = false;
        if (!status) {
          status = document.createElement('li');
          status.className = 'pa-online';
          (author.querySelector('ul') || author).appendChild(status);
        }
        var nickname = author.querySelector('.pa-author');
        if (nickname) {
          var badge = document.createElement('span');
          badge.className = status.className;
          status.remove();
          status = badge;
          nickname.appendChild(status);
        }
        status.classList.add('rv-presence');
        status.classList.toggle('is-online', active);
        status.textContent = '';
        status.title = active ? 'В сети' : 'Не в сети';
        status.setAttribute('role', 'img');
        status.setAttribute('aria-label', status.title);
      }
    });

    }
    preparePosts();

    /* Навигация */
    function prepareTopicLists() {
      forum.querySelectorAll('#pun-main .forum > h2, #pun-main .topic > h2, #pun-main .searchresults > h2, #pun-main h2:has(.item2)').forEach(function (heading) {
        if (heading.closest('.category, #post-form') || heading.dataset.rvSummary) return;
        heading.dataset.rvSummary = 'true';
        heading.classList.add('rv-list-summary');
        var meta = heading.querySelector('.item2');
        if (meta) {
          meta.classList.add('rv-list-meta');
          var value = meta.textContent.replace(/\s+/g, ' ').trim();
          value = value.replace(/(\d+)\s*страниц[аы]?/i, 'Страница $1 · ');
          meta.textContent = value;
        }
        var label = heading.querySelector('.item1');
        if (label && /^Тем$/i.test(label.textContent.trim())) label.textContent = 'Темы';
      });
      forum.querySelectorAll('#pun-main tr').forEach(function (row) {
        if (row.closest('.category, .post-content, #viewprofile') || !row.querySelector('.tcl')) return;
        var cell = row.querySelector('.tcl');
        var icon = cell.querySelector('.icon');
        if (!icon) return;
        if (icon.parentElement === cell) {
          var layout = document.createElement('div');
          layout.className = 'intd';
          var content = document.createElement('div');
          content.className = 'tclcon';
          layout.appendChild(icon);
          while (cell.firstChild) content.appendChild(cell.firstChild);
          layout.appendChild(content);
          cell.appendChild(layout);
        }
        row.classList.add('rv-topic-row');
        icon.classList.add('rv-topic-icon');
        var pinned = row.matches('.isticky, .sticky, .pinned') || !!cell.querySelector('.stickytext');
        var closed = row.matches('.iclosed, .inewclosed, .closed') || !!cell.querySelector('.closedtext');
        var unread = row.matches('.inew, .inewclosed') || !!cell.querySelector('.newtext');
        icon.dataset.rvKind = pinned && closed ? 'pinned-closed' : closed ? 'closed' : pinned ? 'pinned' : 'normal';
        icon.classList.toggle('is-unread', unread);
        var label = pinned && closed ? 'Важная закрытая тема' : closed ? 'Закрытая тема' : pinned ? 'Важная тема' : 'Обычная тема';
        if (unread) label += ', есть новые сообщения';
        icon.setAttribute('role', 'img');
        icon.setAttribute('aria-label', label);
        icon.title = label;
      });
    }
    if (!admin) prepareTopicLists();
    forum.querySelectorAll('#pun-crumbs1, #pun-crumbs2').forEach(function (bar) {
      var line = bar.querySelector('p') || bar;
      var result = document.createElement('div');
      result.className = 'rv-crumb-list';
      Array.from(line.childNodes).forEach(function (node) {
        if (node.nodeType === 1 && node.tagName === 'A') {
          node.classList.add('rv-crumb');
          result.appendChild(node);
        } else {
          var value = node.textContent.replace(/Вы здесь/gi, '').replace(/[»›]/g, '').trim();
          if (!value) return;
          var current = document.createElement('span');
          current.className = 'rv-crumb';
          current.textContent = value;
          result.appendChild(current);
        }
      });
      Array.from(result.children).slice(1).forEach(function (item) {
        var separator = document.createElement('i');
        separator.className = 'rv-crumb-separator';
        separator.setAttribute('aria-hidden', 'true');
        item.before(separator);
      });
      line.replaceChildren(result);
    });
    if (/search.php/.test(location.pathname) || forum.querySelector('[id*="search"]')) {
      forum.querySelectorAll('#pun-main .container > table').forEach(function (table) { table.classList.add('rv-search-table'); });
    }
    forum.querySelectorAll('#viewprofile li, #profile-right tr').forEach(function (row) {
      var label = row.querySelector('span, th, dt');
      var text = (label || row).textContent.trim();
      if (/gift|user.?agent/i.test(row.id) || /^(Подарк(?:и|ов)|Gifts|User[ -]?Agent)(?:\s*:|$)/i.test(text)) row.hidden = true;
    });

    /* Карточка профиля */
    var profile = document.getElementById('viewprofile');
    var profileLeft = document.getElementById('profile-left');
    var profileRight = document.getElementById('profile-right');
    if (profile && profileLeft && profileRight && profile.contains(profileLeft)) {
      var profileTable = profileLeft.closest('table');
      if (profileTable && profileTable !== profile) {
        var grid = document.createElement('div');
        grid.className = 'rv-profile-grid';
        [profileLeft, profileRight].forEach(function (cell) {
          var panel = document.createElement('div');
          panel.id = cell.id;
          while (cell.firstChild) panel.appendChild(cell.firstChild);
          grid.appendChild(panel);
        });
        profileTable.replaceWith(grid);
      }
    }
    forum.querySelectorAll('#pun-adnav li').forEach(function (item) {
      var link = item.querySelector('a');
      if (!link || !/^Формы(?:\s|$)/i.test(link.textContent.trim())) return;
      item.querySelectorAll('sup, .new').forEach(function (badge) { badge.remove(); });
      var walker = document.createTreeWalker(link, NodeFilter.SHOW_TEXT);
      while (walker.nextNode()) walker.currentNode.textContent = walker.currentNode.textContent.replace(/\(?новое\)?/gi, '');
    });
    forum.querySelectorAll('#pun-admain fieldset').forEach(function (fieldset) {
      var legend = fieldset.querySelector('legend');
      if (legend && /расположение полей под аватаром/i.test(legend.textContent)) fieldset.classList.add('rv-author-fields');
    });

    /* Личные сообщения и редактирование профиля */
    var navigationPanel = document.getElementById('profilenav');
    if (navigationPanel && !profile && !navigationPanel.closest('#viewprofile') && !navigationPanel.parentElement.classList.contains('rv-account-layout')) {
      var parent = navigationPanel.parentElement;
      if (!/^(TABLE|TBODY|TR|UL)$/.test(parent.tagName)) {
        var content = document.createElement('div');
        content.className = 'rv-account-content';
        Array.from(parent.childNodes).forEach(function (node) {
          if (node !== navigationPanel) content.appendChild(node);
        });
        parent.classList.add('rv-account-layout');
        parent.appendChild(content);
      }
    }
    function prepareMessageTables() {
      forum.querySelectorAll('#pun-messages table').forEach(function (table) {
        if (table.closest('#tags, #form-buttons, .post-content, #viewprofile')) return;
        if (table.querySelector('th') && table.querySelector('td.tcl, input[type="checkbox"]')) {
          table.classList.add('rv-pm-table');
        }
      });
    }
    prepareMessageTables();

    var stats = document.querySelector('#pun-stats h2');
    if (stats) {
      var caption = document.createElement('p');
      caption.className = 'rv-stats-caption';
      caption.textContent = 'Сообщество в цифрах';
      stats.after(caption);
    }

    /* Последние сообщения */
    forum.querySelectorAll('.category td.tcr, .forum td.tcr').forEach(function (cell) {
      if (cell.querySelector('.rv-lastpost')) return;
      var layout = document.createElement('div');
      var text = document.createElement('div');
      layout.className = 'rv-lastpost';
      text.className = 'rv-lastpost-text';
      var avatar = cell.querySelector('.user-avatar');
      if (avatar) layout.appendChild(avatar);
      while (cell.firstChild) text.appendChild(cell.firstChild);
      text.querySelectorAll('.lastpost br').forEach(function (br) { br.replaceWith(document.createTextNode(' · ')); });
      text.querySelectorAll('.byuser').forEach(function (author) {
        var previous = author.previousSibling;
        while (previous && previous.nodeType === 3 && !previous.textContent.trim()) previous = previous.previousSibling;
        if (previous && previous.nodeName === 'BR') previous.replaceWith(document.createTextNode(' '));
      });
      layout.appendChild(text);
      cell.appendChild(layout);
    });

    /* Метаданные автора */
    var metrics = {
      'pa-reg': 'Зарегистрирован',
      'pa-invites': 'Приглашений',
      'pa-posts': 'Сообщений',
      'pa-respect': 'Уважение',
      'pa-positive': 'Позитив',
      'pa-reputation': 'Репутация',
      'pa-awards': 'Наград',
      'pa-time-visit': 'На форуме',
      'pa-ip': 'IP'
    };
    function prepareAuthorFields() {
      forum.querySelectorAll('.post-author li').forEach(function (row) {
        var key = Object.keys(metrics).find(function (name) { return row.classList.contains(name); });
        if (!key || row.classList.contains('rv-metric')) return;
        var label = row.querySelector('.fld-name');
        var link = !label && row.querySelector('a');
        if (!label && link && /^(Наград|Уважение|Позитив|Репутация|Приглашений)/i.test(link.textContent.trim())) label = link;
        if (!label) {
          var firstText = Array.from(row.childNodes).find(function (node) {
            return node.nodeType === 3 && node.textContent.includes(':');
          });
          label = document.createElement('span');
          if (firstText) {
            var parts = firstText.textContent.split(':');
            label.textContent = parts.shift();
            firstText.textContent = parts.join(':').trim();
            firstText.before(label);
          } else {
            label.textContent = metrics[key];
            row.prepend(label);
          }
        }
        row.classList.add('rv-metric');
        label.classList.add('rv-metric-label');
        label.title = metrics[key];
        label.setAttribute('aria-label', metrics[key]);
        row.title = metrics[key] + ': ' + row.textContent.replace(label.textContent, '').replace(/^\s*:\s*/, '').trim();
        var next = label.nextSibling;
        if (next && next.nodeType === 3) next.textContent = next.textContent.replace(/^\s*:\s*/, '');
      });
    }
    prepareAuthorFields();

    /* Цитирование и копирование */
    function prepareTextTools() {
      forum.querySelectorAll('.quote-box cite').forEach(function (cite) {
        var walker = document.createTreeWalker(cite, NodeFilter.SHOW_TEXT);
        while (walker.nextNode()) walker.currentNode.textContent = walker.currentNode.textContent.replace(/написал(?:\(а\)|а)?/gi, 'пишет');
      });
      forum.querySelectorAll('.code-box').forEach(function (box) {
        var code = box.querySelector('pre');
        if (!code || box.querySelector('.rv-copy-code')) return;
        var copy = document.createElement('button');
        copy.type = 'button';
        copy.className = 'rv-copy-code';
        copy.textContent = 'Скопировать код';
        copy.setAttribute('aria-live', 'polite');
        copy.addEventListener('click', async function () {
          try {
            if (!navigator.clipboard) throw new Error('Clipboard unavailable');
            await navigator.clipboard.writeText(code.innerText);
            copy.textContent = 'Скопировано';
          } catch (error) {
            var range = document.createRange();
            range.selectNodeContents(code);
            var selection = window.getSelection();
            selection.removeAllRanges();
            selection.addRange(range);
            copy.textContent = 'Нажмите Ctrl+C / ⌘C';
          }
          setTimeout(function () { copy.textContent = 'Скопировать код'; }, 2500);
        });
        box.prepend(copy);
      });
    }
    prepareTextTools();

    /* Динамические элементы платформы */
    var updateQueued = false;
    var dynamicObserver = new MutationObserver(function (records) {
      if (!records.some(function (record) { return record.addedNodes.length; }) || updateQueued) return;
      updateQueued = true;
      requestAnimationFrame(function () {
        dynamicObserver.disconnect();
        if (!admin) prepareTopicLists();
        prepareMessageTables();
        preparePosts();
        prepareAuthorFields();
        prepareTextTools();
        updateUnread();
        updateQueued = false;
        if (!admin) dynamicObserver.observe(forum, { childList: true, subtree: true });
      });
    });

    /* Редактор */
    var tags = document.getElementById('tags');
    var toolbar = document.getElementById('form-buttons');
    if (tags && toolbar) {
      function positionPalettes() {
        var tagsRect = tags.getBoundingClientRect();
        var toolbarRect = toolbar.getBoundingClientRect();
        tags.style.setProperty('--rv-editor-top', Math.max(0, toolbarRect.bottom - tagsRect.top + 8) + 'px');
      }
      new ResizeObserver(positionPalettes).observe(toolbar);
      window.addEventListener('resize', positionPalettes);
      positionPalettes();
    }
    /* Размер текста при чтении */
    if (forum.querySelector('.post-content')) {
      var reading = document.createElement('div');
      reading.className = 'rv-reading-size';
      var label = document.createElement('label');
      label.htmlFor = 'rv-reading-range';
      label.textContent = 'Размер текста';
      var slider = document.createElement('input');
      slider.type = 'range'; slider.id = 'rv-reading-range';
      slider.min = '12'; slider.max = '24'; slider.step = '1'; slider.value = '14';
      try { var saved = Number(localStorage.getItem('rv-reading-size')); if (saved >= 12 && saved <= 24) slider.value = saved; } catch (error) {}
      var output = document.createElement('output');
      output.htmlFor = slider.id;
      var reset = document.createElement('button');
      reset.type = 'button'; reset.textContent = 'Сброс';
      function resizeText() {
        root.style.setProperty('--rv-reading-size', slider.value + 'px');
        output.textContent = slider.value + ' px';
        try { localStorage.setItem('rv-reading-size', slider.value); } catch (error) {}
      }
      slider.addEventListener('input', resizeText);
      reset.addEventListener('click', function () { slider.value = '14'; resizeText(); });
      reading.append(label, slider, output, reset);
      var main = document.getElementById('pun-main');
      if (main) main.prepend(reading);
      resizeText();
    }
    var area = document.getElementById('main-reply');
    if (area) {
      forum.querySelectorAll('[data-rv-reply]').forEach(function (bar) {
        var counter = bar.querySelector('[data-rv-count]');
        var focus = bar.querySelector('[data-rv-focus]');
        if (!counter) return;
        bar.hidden = false;
        function count() { counter.textContent = Array.from(area.value).length + ' символов'; }
        area.addEventListener('input', count);
        if (focus) focus.remove();
        count();
      });
    }

    /* Приветствие и декорации */
    if (!admin && title) {
      var status = document.getElementById('pun-status');
      if (status) {
        status.querySelectorAll('a').forEach(function (link) {
          if (/улучшить\s+(?:аккаунт|профиль)/i.test(link.textContent)) link.remove();
        });
        var statusText = document.createTreeWalker(status, NodeFilter.SHOW_TEXT);
        while (statusText.nextNode()) {
          statusText.currentNode.nodeValue = statusText.currentNode.nodeValue.replace(/(?:ваш\s+)?последний\s+визит\s*:/gi, 'Виделись:');
        }
        title.appendChild(status);
      }
      if (!title.querySelector('.rv-header-weather')) {
        var weather = document.createElement('div');
        weather.className = 'rv-header-weather';
        weather.setAttribute('aria-hidden', 'true');
        weather.innerHTML = '<span class="rv-header-weather__snow"></span><span class="rv-header-weather__steam"></span>';
        title.prepend(weather);
      }
    }
    if (!admin) dynamicObserver.observe(forum, { childList: true, subtree: true });
  }
  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init, { once: true });
  else init();
})();
</script>

<div class="rv-footer-art">
  <nav class="rv-banners">
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
<a href="https://imagiart.ru/profile.php?id=16842" target="_blank" rel="noopener noreferrer"><img src="https://forumstatic.ru/files/001c/c7/69/50124.png" width="88" height="31" loading="lazy"></a>
  </nav>

  <div class="rv-design-credit">
    <a href="https://imagiart.ru/profile.php?id=16842">
      design by <span>кешью.</span>
    </a>
  </div>
</div>


<script>
(function () {
  'use strict';
  if (window.RVEditorExtras) return;
  window.RVEditorExtras = true;
var fonts = [
  'Arial',
  'Arial Black',
  'Comic Sans MS',
  'Courier New',
  'Georgia',
  'Impact',
  'Tahoma',
  'Times New Roman',
  'Trebuchet MS',
  'Verdana',
  'Amatic SC',
  'Bellota',
  'Caveat',
  'Comforter',
  'Cuprum',
  'Great Vibes',
  'Hachi Maru Pop',
  'Libre Barcode 39 Extended',
  'Montserrat Underline',
  'Neucha',
  'Play',
  'Roboto',
  'Rubik Glitch',
  'Rubik Pixels',
  'Rubik Scribble',
  'Stalinist One',
  'Train One',
  'Yanone Kaffeesatz',
  'Yeseva One'
];

  function init() {
    var forum = document.getElementById('pun');
    if (!forum) return;

    function addButton(id, after, title, action) {
      if (document.getElementById(id)) return;
      var anchor = document.querySelector('#form-buttons #' + after);
      if (!anchor) return;
      var cell = document.createElement('td');
      cell.id = id;
      cell.title = title;
      var image = document.createElement('img');
      image.src = '/i/blank.gif';
      image.alt = title;
      image.tabIndex = 0;
      image.setAttribute('role', 'button');
      image.addEventListener('click', action);
      image.addEventListener('keydown', function (event) {
        if (event.key === 'Enter' || event.key === ' ') {
          event.preventDefault();
          action();
        }
      });
      cell.appendChild(image);
      anchor.after(cell);
    }

    function changeLayout() {
      var field = document.getElementById('main-reply');
      if (!field) return;
      var start = field.selectionStart;
      var end = field.selectionEnd;
      if (start === end) return;
      var selected = field.value.slice(start, end);
      var latin = "qwertyuiop[]asdfghjkl;'zxcvbnm,.`";
      var russian = 'йцукенгшщзхъфывапролджэячсмитьбюё';
      var from = /[а-яё]/i.test(selected) ? russian : latin;
      var to = from === russian ? latin : russian;
      var converted = Array.from(selected).map(function (letter) {
        var lower = letter.toLowerCase();
        var index = from.indexOf(lower);
        if (index < 0) return letter;
        return letter !== lower ? to[index].toUpperCase() : to[index];
      }).join('');
      field.setRangeText(converted, start, end, 'select');
      field.dispatchEvent(new Event('input', { bubbles: true }));
      field.focus();
    }

    function prepareEditor() {
      addButton('button-transL', 'button-font', 'Сменить раскладку выделенного текста', changeLayout);
      addButton('button-indent', 'button-strike', 'Абзац', function () {
        if (typeof window.insert === 'function') window.insert('[indent]');
      });
      addButton('button-justify', 'button-center', 'По ширине', function () {
        if (typeof window.bbcode === 'function') window.bbcode('[align=justify]', '[/align]');
      });

      /* Нормализация дополнительной кнопки изображения */
      var imageButtons = document.querySelectorAll('#form-buttons td[id="button-image"], #form-buttons td[id="button-image-bbcode"]');
      var custom = null;
      imageButtons.forEach(function (cell) {
        var image = cell.querySelector('img');
        var action = image ? image.getAttribute('onclick') || '' : '';
        if (cell.id !== 'button-image-bbcode' && !/bbcode\s*\(\s*['"]\[img\]/.test(action)) return;
        if (custom) { cell.remove(); return; }
        custom = cell;
        cell.id = 'button-image-bbcode';
        cell.title = 'Изображение по ссылке';
        cell.querySelectorAll('b, p').forEach(function (badge) { badge.remove(); });
      });

      addButton('button-image-bbcode', 'button-image', 'Вставить тег изображения', function () {
        if (typeof window.bbcode === 'function') window.bbcode('[img]', '[/img]');
      });

var area = document.getElementById('font-area');
if (!area) return;

if (area.dataset.rvUnifiedFonts !== 'true') {
  area.dataset.rvUnifiedFonts = 'true';
  area.replaceChildren();
}

fonts.forEach(function (font) {
        if (Array.from(area.querySelectorAll('[data-rv-font]')).some(function (item) { return item.dataset.rvFont === font; })) return;
        var button = document.createElement('button');
        button.type = 'button';
        button.className = 'rv-font-option';
        button.dataset.rvFont = font;
        button.style.fontFamily = '"' + font + '"';
        button.textContent = font;
        area.appendChild(button);
      });
    }

    /* Выбор шрифта */
forum.addEventListener('mousedown', function (event) {
  if (!(event.target instanceof Element)) return;

  if (event.target.closest('#font-area [data-rv-font]')) {
    event.preventDefault();
  }
});

forum.addEventListener('click', function (event) {
  if (!(event.target instanceof Element)) return;

  var option = event.target.closest('#font-area [data-rv-font]');
  if (!option || typeof window.bbcode !== 'function') return;

  event.preventDefault();
  event.stopImmediatePropagation();

  window.bbcode(
    '[font=' + option.dataset.rvFont + ']',
    '[/font]'
  );

  option.closest('#font-area').style.display = 'none';
}, true);

    /* Обработка текста без пересоздания содержимого сообщений */
    function preparePosts() {
      forum.querySelectorAll('.post-content').forEach(function (content) {
        var walker = document.createTreeWalker(content, NodeFilter.SHOW_TEXT);
        var nodes = [];
        while (walker.nextNode()) nodes.push(walker.currentNode);
        nodes.forEach(function (node) {
          if (!node.parentElement || node.parentElement.closest('pre, code, .code-box, script, style, textarea')) return;
          var value = node.nodeValue.replace(/[-–]\s/g, '— ');
          if (value.indexOf('[indent]') < 0) {
            if (value !== node.nodeValue) node.nodeValue = value;
            return;
          }
          var fragment = document.createDocumentFragment();
          value.split('[indent]').forEach(function (part, index) {
            if (index) {
              var indent = document.createElement('span');
              indent.className = 'rv-text-indent';
              fragment.appendChild(indent);
            }
            fragment.appendChild(document.createTextNode(part));
          });
          node.replaceWith(fragment);
        });
        content.querySelectorAll('p').forEach(function (p) {
          while (p.firstChild && p.firstChild.nodeName === 'BR') p.firstChild.remove();
          if (!p.childNodes.length) p.remove();
        });
      });
      forum.querySelectorAll('#pun-viewtopic li.pa-respect span:last-child').forEach(function (item) {
        Array.from(item.childNodes).forEach(function (node) {
          if (node.nodeType === 3 && /^\s*\+/.test(node.nodeValue)) node.nodeValue = node.nodeValue.replace('+', '');
        });
      });
    }

    window.to = function (username) {
      if (typeof window.insert === 'function') window.insert('[b]' + username + '[/b], ');
    };
    if (window.FORUM && typeof FORUM.set === 'function') {
      FORUM.set('editor.link.short_url', function () { return false; });
    }

    prepareEditor();
    preparePosts();
    var queued = false;
    var observer = new MutationObserver(function (records) {
      if (queued || !records.some(function (r) { return r.addedNodes.length || r.removedNodes.length; })) return;
      queued = true;
      requestAnimationFrame(function () {
        observer.disconnect();
        prepareEditor();
        preparePosts();
        queued = false;
        observer.observe(forum, { childList: true, subtree: true });
      });
    });
    observer.observe(forum, { childList: true, subtree: true });
  }
  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init, { once: true });
  else init();
})();
</script>

<script>
(function () {
  'use strict';

  function hideProfiles() {
    document.querySelectorAll('#pun .post-content').forEach(function (content) {
      var post = content.closest('.post');
      var walker = document.createTreeWalker(
        content,
        NodeFilter.SHOW_TEXT
      );
      var matches = [];
      var node;

      while ((node = walker.nextNode())) {
        if (node.parentElement.closest(
          '.quote-box, .code-box, pre, code, textarea, script, style'
        )) {
          continue;
        }

        if (/\[hideprofile\]/i.test(node.nodeValue)) {
          matches.push(node);
        }
      }

      if (!post || !matches.length) return;

      post.classList.add('hideprofile');

      matches.forEach(function (textNode) {
        textNode.nodeValue = textNode.nodeValue.replace(
          /\[hideprofile\]/gi,
          ''
        );
      });
    });

    if (window.FORUM && typeof window.FORUM.set === 'function') {
      window.FORUM.set('editor.addition.tags.hideprofile', {
        name: 'Скрыть минипрофиль',
        onclick: function () {
          insert('[hideprofile]');
        }
      });
    }
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', hideProfiles, {
      once: true
    });
  } else {
    hideProfiles();
  }
})();
</script>
HTML в форме ответа
Код:
<div class="rv-reply-tools" data-rv-reply hidden>
  <span data-rv-count>0 символов</span>
</div>

[hideprofile]

0

3

Цвета style_cs.css
Код:
#pun :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--rv-accent);
  outline-offset: 3px;
}

#pun :is(h1, h2, h3, h4),
#pun .category h3 a,
#pun .quote-box:not(.spoiler-box) blockquote,
#pun :is(.quote-box:not(.spoiler-box) cite, .code-box strong) {
  color: var(--rv-text);
}

#pun img,
#pun .category :is(table, tbody, tr, td) {
  border: 0px;
}

#pun #pun-title a,
#pun :is(#pun-navlinks, #pun-ulinks) a:hover,
#pun #pun-ulinks a {
  color: var(--rv-on-dark);
}

#pun #pun-crumbs2,
#pun .post-links,
#pun #pun-stats #onlinelist,
#pun #pun-stats :is(#onlinelist2, .rv-visitors) {
  border-top: 1px solid var(--rv-line);
}

#pun :where(.main, #messages) .container > table > tbody > tr:hover,
#pun #pun-adnav a:hover,
#pun .category tr:hover,
#pun .category tr:focus-within,
#pun .spoiler-box > div,
#pun #pun-stats li:not(#onlinelist):not(#onlinelist2):not(.rv-visitors) {
  background: var(--rv-accent-soft);
}

#pun :is(.inew, .inewclosed) .icon {
  border-color: var(--rv-accent);
  background: var(--rv-accent);
}

#pun .iclosed .icon {
  border-radius: 1px;
}

#pun .pagelink strong,
#pun #profilenav .isactive > a,
#pun #pun-adnav .isactive > a {
  background: var(--rv-dark);
  color: var(--rv-on-dark);
}

#pun .category tr:last-child td,
#pun #pun-admain .adfs-box > p:last-child {
  border-bottom: 0px;
}

#pun .post-content td,
#pun .spoiler-box {
  border: 1px solid var(--rv-line);
}

#pun .post-content .highlight-text {
  background: var(--rv-accent-soft);
  color: var(--rv-text);
}

#pun legend span {
  background: var(--rv-panel);
  color: var(--rv-link);
}

#pun :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--rv-accent);
}

#pun :is(input[type="submit"], input[type="button"], button.rv-button):hover,
#pun #tags #table-area td.selected {
  background: var(--rv-accent);
}

#pun #tags .container {
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
  background: var(--rv-raised);
  color: var(--rv-text);
  box-shadow: 0 8px 24px var(--rv-shadow);
}

#pun #form-buttons td[id^="button-"]:hover {
  background-color: var(--rv-accent-soft);
  color: var(--rv-link);
}

#pun .rv-icon-button:hover,
#pun .rv-copy-code:hover,
#pun .rv-reading-size button:hover,
#pun ::selection {
  background: var(--rv-accent);
  color: var(--rv-dark);
}

#pun .category tr > td,
#pun #pun-adnav,
#pun #pun-admain :is(.adfs-box, .adlabel, .adinput, .adsubmitfield, .adsubmit),
#pun .post-author ul {
  background: var(--rv-clear);
}

.jGrowl .jGrowl-message,
.jGrowl .jGrowl-header {
  color: var(--rv-text) !important;
}

.jGrowl .jGrowl-message a {
  color: var(--rv-link) !important;
}

#pun #tags #table-area td {
  background: var(--rv-panel);
  border: 1px solid var(--rv-line) !important;
}

.jGrowl .jGrowl-message :is(a, button, input) {
  border-color: var(--rv-line);
  background: var(--rv-clear) !important;
  color: var(--rv-link) !important;
  text-shadow: none !important;
}

#pun .forum tr:is(.inew, .inewclosed) .icon {
  background: var(--rv-clear);
  color: var(--rv-link);
}

#pun tr.inew .rv-forum-state,
#pun tr.inewclosed .rv-forum-state {
  color: var(--rv-text);
  opacity: 1;
}

#pun #pun-navlinks {
  background: none;
  border: 0px;
  box-shadow: none;
}

#pun #pun-navlinks a:hover,
#pun #pun-navlinks a:focus-visible,
#pun #pun-ulinks a:hover,
#pun #pun-title #pun-status a:hover {
  color: var(--rv-accent);
}

#pun #pun-title #pun-status a {
  color: inherit;
}

#pun .rv-menu-dock.is-joined,
#pun .rv-menu-dock.is-joined #pun-navlinks::before,
#pun:has(#pun-admain) #pun-navlinks::before {
  background: var(--rv-bg);
}

#pun .category:has(tr:is(.inew, .inewclosed)),
#pun .post-author:hover .pa-ip,
#pun .post-author:focus-within .pa-ip,
#pun .rv-fold,
#pun .category {
  opacity: 1;
}

#pun .category:has(tr:is(.inew, .inewclosed)) .container::before {
  background-color: var(--rv-category-art-active);
  opacity: 1;
  filter: none;
}

#pun .category:has(tr:is(.inew, .inewclosed)) .container {
  box-shadow: none;
  background-color: var(--rv-raised);
}

#pun .post-author .pa-author a {
  color: var(--rv-author-ink);
}

#pun .post-author .pa-author a:hover,
#pun a:hover,
#pun a:focus-visible {
  color: var(--rv-hover);
}

body {
  background-color: var(--rv-bg);
  background-image: linear-gradient(180deg, var(--rv-bg), var(--rv-bg-bottom));
  color: var(--rv-text);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%;
}

#pun hr {
  border: 0px;
  background: var(--rv-line);
}

#pun #pun-title :is(table, tbody, tr, td),
#pun #pun-adnav :is(.adcontainer, #adnav-standard),
#pun #pun-admain .adcontainer {
  border: 0px;
  background: var(--rv-clear);
}

#pun :is(#pun-navlinks, #pun-ulinks) {
  background: var(--rv-dark);
}

#pun :is(#pun-status, #pun-crumbs1, #pun-crumbs2),
#pun th,
#pun :is(.byuser, .lastpost),
#pun .category :is(.tc2, .tc3),
#pun .rv-counts,
#pun .post-author :is(.pa-reg, .pa-posts, .pa-respect, .pa-positive, .pa-last-visit),
#pun .post-links a,
#pun :is(.post-edit, .lastedit),
#pun #profile-right li > span,
#pun .rv-reply-tools,
#pun #pun-adnav .adsubnav a,
#pun .rv-presence,
#pun .rv-presence::before,
#pun .rv-results-meta,
#pun .rv-results-heading .item2,
#pun .post-author .pa-title,
#pun .post-author :is(.pa-reg, .pa-registered, .pa-time-visit, .pa-ip),
#pun #pun-viewtopic #pun-main > h1::before,
#pun .rv-list-summary .rv-list-meta {
  color: var(--rv-muted);
}

#pun #pun-announcement {
  background: var(--rv-panel);
  border-left: 3px solid var(--rv-accent);
}

#pun table {
  border-collapse: collapse;
}

#pun :is(th, td),
#pun #profile-right li,
#pun #pun-admain .adfs-box > p {
  border-bottom: 1px solid var(--rv-line);
}

#pun :where(.main, #messages) .container > table,
#pun #messages .container {
  background: var(--rv-panel);
}

#pun :is(.user-avatar img, .avatar-image) {
  background-size: cover;
  background-position: center center;
  border-radius: var(--rv-radius);
}

#pun :where(.main, #messages) .icon {
  border: 1px solid var(--rv-muted);
  border-radius: 50%;
}

#pun .pagelink :is(a, strong),
#pun :is(.rv-forum-links, .podfl) a {
  border-radius: 6px;
}

#pun :is(.postlink, .subscribelink) a,
#pun #form-buttons {
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
  background: var(--rv-raised);
}

#pun .category > .container,
#pun .category .rv-fold-inner > .container {
  border-top: 0px;
  background-color: var(--rv-panel);
  border-radius: 0 0 var(--rv-radius) var(--rv-radius);
}

#pun :is(.podfl, .rv-forum-links) a,
#pun #pun-adnav li > sup {
  border-radius: 3px;
  background: var(--rv-accent-soft);
  color: var(--rv-link);
}

#pun .isonline {
  border-radius: 50%;
  background: var(--rv-online);
}

#pun .rv-toggle {
  border: 1px solid var(--rv-line);
  border-radius: 50%;
  background: var(--rv-clear);
  color: var(--rv-accent);
}

#pun .rv-toggle::before {
  border-right: 2px solid var(--rv-accent);
  border-bottom: 2px solid var(--rv-accent);
}

#pun .rv-fold.is-closed,
#pun #form-buttons td[id^="button-"] img {
  opacity: 0;
}

#pun .post > h3,
#pun .rv-post-heading {
  border-bottom: 1px solid var(--rv-line);
  color: var(--rv-muted);
}

#pun .post-author .pa-online,
#pun .rv-presence.is-online::before {
  color: var(--rv-online);
}

#pun .spoiler-box > div::before,
#pun legend,
#pun a,
#pun .rv-topic-row .rv-topic-icon[data-rv-kind="pinned"]::before,
#pun .rv-topic-row .rv-topic-icon.is-unread::after {
  color: var(--rv-link);
}

#pun #viewprofile,
#pun #pun-stats {
  background: var(--rv-clear);
  border: 0px;
}

#pun #profile-left,
#pun #profile-right {
  background: var(--rv-panel);
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
}

#pun #profile-left img {
  border-radius: 3px;
}

#pun #profilenav a {
  border-radius: var(--rv-radius);
}

#pun fieldset,
#pun #pun-admain fieldset {
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
  background: var(--rv-panel);
}

#pun :is(input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="search"], input[type="number"], select, textarea) {
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
  background: var(--rv-raised);
  color: var(--rv-text);
}

#pun :is(input[type="submit"], input[type="button"], input[type="reset"], button.rv-button) {
  border: 1px solid var(--rv-line);
  border-radius: var(--rv-radius);
  background: var(--rv-dark);
  color: var(--rv-on-dark);
}

#pun :is(input, button):disabled,
#pun #pun-main:has(.forum) > h1::before,
#pun #pun-main > h1::before,
#pun #pun-main .formal > h2::before,
#pun #post-form > h2::before,
#pun #pun-userlist h1::before {
  opacity: 0.5;
}

#pun #pun-admain {
  background: var(--rv-paper);
}

#pun #pun-adnav a {
  border: 0px;
  border-radius: var(--rv-radius);
  color: var(--rv-link);
}

#pun #pun-admain :is(.adformal, .adsection, .adinfo) > h2,
#pun #pun-adnav > h2 {
  border: 0px;
  background: var(--rv-dark);
  color: var(--rv-on-dark);
}

#pun #form-buttons td[id^="button-"] {
  border: 0px;
  border-radius: var(--rv-radius);
  background: var(--rv-clear);
  color: var(--rv-muted);
}

#pun .rv-footer-brand {
  color: var(--rv-on-dark-muted);
}

#pun .rv-icon-button {
  border: 1px solid var(--rv-accent);
  border-radius: 50%;
  background: var(--rv-dark);
  color: var(--rv-accent);
}

#pun .rv-forum-state {
  color: var(--rv-muted);
  opacity: 0.8;
}

.jGrowl .jGrowl-notification,
.jGrowl .jGrowl-closer {
  border-left: 3px solid var(--rv-accent);
  border-radius: var(--rv-radius);
  box-shadow: 0 8px 24px var(--rv-shadow);
  opacity: 1;
  background: var(--rv-raised) !important;
  color: var(--rv-text) !important;
}

.jGrowl .jGrowl-close,
#pun .forum .icon {
  background: var(--rv-clear);
  color: var(--rv-muted);
  border: 0px;
}

#pun .post-sig::before {
  background: linear-gradient(90deg, var(--rv-clear), var(--rv-muted), var(--rv-clear));
}

#pun #tags :is(#color-area, #table-area) table {
  border-collapse: separate;
  border-spacing: 4px;
}

#pun #tags :is(#color-area, #table-area) td {
  border-radius: 4px;
}

#pun #keyboard-span input {
  border-radius: 5px;
}

#pun .rv-crumb {
  background: var(--rv-accent-soft);
  color: var(--rv-link);
  border: 1px solid var(--rv-line);
  border-radius: 7px;
}

#pun .rv-crumb::after,
#pun :is(.rv-forum-links, .podfl) a::after {
  background: linear-gradient(90deg, var(--rv-clear), var(--rv-shine), var(--rv-clear));
}

#pun #pun-crumbs2 .rv-crumb {
  opacity: 0.7;
}

#pun #pun-admain .rv-author-fields .adfs-box > p {
  border-bottom: 1px solid var(--rv-line);
  background-image: none !important;
}

#pun .rv-reading-size input {
  accent-color: var(--rv-accent);
  background: var(--rv-clear);
  border: 0px;
}

#pun .rv-copy-code,
#pun .rv-reading-size button {
  background: var(--rv-accent-soft);
  color: var(--rv-link);
  border: 1px solid var(--rv-line);
  border-radius: 6px;
}

#pun .rv-crumb-separator {
  color: var(--rv-muted);
  opacity: 0.6;
}

.rv-fireflies i {
  background: var(--rv-firefly);
  border-radius: 50%;
  opacity: 0;
}

#pun #pun-stats > :is(.container, .statscon) {
  background: var(--rv-panel);
  border-radius: 0 0 var(--rv-radius) var(--rv-radius);
}

#pun #pun-main:has(.rv-search-table) > h1,
#pun #pun-main:has(.forum) > h1,
#pun #pun-main > h1,
#pun #post-form > h2,
#pun #pun-main .formal > h2,
#pun #pun-viewtopic #pun-main > h1 {
  border: 0px;
  border-radius: 0px;
  background: none;
  box-shadow: none;
  color: var(--rv-text);
}

#pun #pun-main:has(.forum) > h1::after,
#pun #post-form > h2::after,
#pun #pun-main > h1::after,
#pun #pun-main .formal > h2::after,
#pun #pun-userlist h1::after {
  background: var(--rv-line);
}

#pun :is(#post-form, #pun-post .formal, #pun-edit .formal) legend {
  background: none;
  color: var(--rv-muted);
}

#pun #pun-main > h1 > span,
#pun #post-form > h2 > span,
#pun #pun-main .formal > h2 > span,
#pun #pun-main fieldset > legend > span,
#pun #pun-admain fieldset > legend > span {
  background: none;
  color: inherit;
}

#pun #pun-main fieldset > legend {
  border: 0px;
  background: none;
  color: var(--rv-muted);
}

#pun #pun-userlist h1 {
  border: 0px;
  background: none;
  box-shadow: none;
  color: var(--rv-text);
}

#pun #html-footer {
  border-radius: 0 0 var(--rv-banner-radius) var(--rv-banner-radius);
  background-color: var(--rv-dark);
  color: var(--rv-on-dark);
}

#pun #html-footer .rv-footer-art {
  background-image: var(--rv-image-footer);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 0 0 var(--rv-banner-radius) var(--rv-banner-radius);
}

#pun #pun-navlinks a {
  background: none;
  color: var(--rv-bookmark-text);
}

#pun .rv-menu-dock #pun-navlinks a,
#pun .rv-menu-dock,
#pun .rv-menu-dock #pun-navlinks {
  background: none;
}

#pun #pun-ulinks {
  box-shadow: none;
  border: 0;
  background: var(--rv-menu-glass);
}

#pun #pun-title {
  background-color: var(--rv-dark);
  background-image: var(--rv-image-header-top);
  background-size: cover;
  background-repeat: no-repeat;
  color: var(--rv-on-dark);
  border-radius: var(--rv-banner-radius) var(--rv-banner-radius) 0 0;
  background-position: center center;
}

#pun .rv-menu-dock #pun-navlinks::before,
#pun .punbb > #pun-navlinks::before {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  z-index: -1;
  clip-path: none;
  border-radius: 0 0 16px 16px;
  background: var(--rv-menu-glass);
  pointer-events: none;
}

#pun #pun-title #pun-status {
  border: 0px;
  background: var(--rv-brand-bg);
  color: var(--rv-on-dark);
  border-radius: 4px 0px 0px 4px;
}

#pun .category > h2,
#pun #pun-stats > h2 {
  color: var(--rv-text);
  -webkit-text-stroke: 0px;
}

#pun .rv-caption,
#pun .rv-stats-caption {
  background: var(--rv-caption);
  color: var(--rv-on-dark);
}

#pun .category .container::before {
  background-color: var(--rv-category-art);
  background-image: var(--rv-image-category);
  opacity: 0.8;
  background-repeat: repeat-y;
  filter: none;
  background-position: center top;
  background-size: 100% 256px;
}

#pun .post {
  border: 1px solid var(--rv-line);
  background-color: var(--rv-panel);
}

#pun .post-author {
  border: 1px solid var(--rv-author-border);
  border-radius: 14px;
  background:
    linear-gradient(
      to bottom,
      color-mix(in srgb, var(--rv-author-top) 20%, var(--rv-clear)),
      var(--rv-author-top) 240px
    ),
    var(--rv-author-art) center top / 100% auto no-repeat;
  background-color: var(--rv-author-top);
  box-shadow:
    inset 0 0 0 4px var(--rv-panel),
    0 4px 14px var(--rv-author-shadow);
}

#pun .post-author .pa-avatar img {
  border-radius: 9px;
  box-shadow:
    0 0 0 3px var(--rv-raised),
    0 0 0 4px var(--rv-author-border),
    0 5px 12px var(--rv-author-shadow);
}

#pun .post-author .pa-fld1 {
  border: 0;
  background:
    linear-gradient(
      90deg,
      var(--rv-clear),
      var(--rv-author-border),
      var(--rv-clear)
    ) bottom center / 76% 1px no-repeat;
}

#pun :is(.quote-box:not(.spoiler-box), .code-box) {
  background: var(--rv-raised);
  border: 1px solid var(--rv-line);
  border-radius: 8px;
}

#pun .quote-box:not(.spoiler-box) {
  background: linear-gradient(
    125deg,
    var(--rv-quote-start),
    var(--rv-quote-end)
  );
  border: 1px solid var(--rv-line);
  border-left: 4px solid var(--rv-post-link);
}

#pun .quote-box:not(.spoiler-box) .quote-box:not(.spoiler-box) {
  background: var(--rv-panel);
  border: 0;
  border-left: 3px solid var(--rv-accent);
}

#pun .quote-box:not(.spoiler-box)::before {
  opacity: 0.55;
  color: var(--rv-muted);
}

#pun .post-sig {
  border-top: 0px;
  color: var(--rv-muted);
}

#pun #pun-navlinks :is(.notify-bubble, #navpm .unreads, #notify-link .unreads) {
  border-radius: 5px;
  border: 0px !important;
  background: var(--rv-accent) !important;
  color: var(--rv-dark) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

#pun .post-author .pa-ip {
  opacity: 0.6;
}

#pun_wrap,
#pun > .punbb {
  border-radius: var(--rv-banner-radius);
}

#pun {
  background-color: var(--rv-paper);
  box-shadow: 0 18px 56px var(--rv-shadow);
  color: var(--rv-text);
  border-radius: var(--rv-banner-radius);
}

#pun #pun-title h1 :is(a, span) {
  color: inherit;
  -webkit-text-fill-color: inherit;
}

#pun #pun-viewtopic #pun-main > h1::after {
  background: linear-gradient(
    90deg,
    var(--rv-line),
    var(--rv-clear)
  );
}

#pun #pun-navlinks #navpm .num_msg {
  border: 0px;
  border-radius: 5px;
  box-shadow: none;
  text-shadow: none;
  background: var(--rv-counter-bg) !important;
  color: var(--rv-counter-text) !important;
}

@media (prefers-reduced-motion: reduce) {
  #pun #pun-title h1 {
    text-shadow: none;
  }
}

#pun #pun-title h1 {
  opacity: 1;
  color: var(--rv-on-dark);
  -webkit-text-fill-color: var(--rv-on-dark);
  background: none !important;
}

#pun #pun-title h1::before {
  background: linear-gradient(
    90deg,
    var(--rv-brand-bg) 0,
    var(--rv-brand-bg) calc(100% - var(--rv-brand-fade)),
    var(--rv-clear) 100%
  );
  opacity: 1;
}

#pun-title > .rv-header-weather {
  border-radius: inherit;
}

.rv-header-weather__snow::before {
  background-image: radial-gradient(
    circle,
    var(--rv-snow-color) 0 1.5px,
    var(--rv-effect-clear) 2.5px
  ),
  radial-gradient(
    circle,
    var(--rv-snow-color) 0 2.5px,
    var(--rv-effect-clear) 3.5px
  ),
  radial-gradient(
    circle,
    var(--rv-snow-color) 0 1px,
    var(--rv-effect-clear) 2px
  );
  background-size: 173px 113px, 281px 157px, 359px 191px;
  background-position: 17px 9px, 93px 61px, 211px 37px;
  opacity: 0;
}

.rv-header-weather__steam::before,
.rv-header-weather__steam::after {
  background: var(--rv-steam-color);
  filter: blur(3px);
  opacity: 0;
}

#pun .post-author .rv-metric-label::before {
  color: var(--rv-author-accent);
}

#pun #pun-admain fieldset > legend {
  background: none;
  color: var(--rv-text);
}

#pun .rv-topic-row .rv-topic-icon {
  border: 0px;
  background: none;
  color: var(--rv-muted);
}

#pun .rv-topic-row .rv-topic-icon[data-rv-kind="pinned-closed"] {
  border-bottom: 2px solid var(--rv-accent);
}

#pun .rv-list-summary {
  color: var(--rv-text);
  background: none;
  border: 0px;
}

#pun .post-rating,
#pun .post-rating .container {
  background: var(--rv-clear);
  border: 0;
  box-shadow: none;
  color: var(--rv-muted);
}

#pun :is(.post-rating, .post-vote) a {
  background: var(--rv-panel);
  border: 1px solid var(--rv-line);
  border-radius: 7px;
  color: var(--rv-link);
}

#pun :is(.post-rating, .post-vote) a:hover {
  background: var(--rv-accent-soft);
  color: var(--rv-text);
}

#pun .rv-forum-state::after {
  color: var(--rv-snowflake-back);
  opacity: 0.22;
}

#pun .rv-menu-dock.is-joined ~ #pun-ulinks {
  background: var(--rv-bg);
}

#pun #font-area .rv-font-option {
  background: var(--rv-clear);
  color: var(--rv-text);
}

#pun #font-area .rv-font-option:is(:hover, :focus-visible) {
  background: var(--rv-accent-soft);
  color: var(--rv-hover);
}

#pun .rv-design-credit a {
  color: var(--rv-muted);
  background: color-mix(in srgb, var(--rv-panel) 25%, var(--rv-clear));
  border: 1px solid var(--rv-line);
}

#pun .rv-design-credit a:is(:hover, :focus-visible) {
  color: var(--rv-post-link);
  background: color-mix(in srgb, var(--rv-panel) 55%, var(--rv-clear));
}

#pun .rv-design-credit a:hover,
#pun .rv-design-credit a:focus-visible {
  color: var(--rv-post-link);
  background-color: var(--rv-raised);
}

#pun .rv-banners {
  background: color-mix(
    in srgb,
    var(--rv-panel) 25%,
    var(--rv-clear)
  );
  border: 1px solid var(--rv-line);
  scrollbar-color: var(--rv-accent) var(--rv-clear);
}

#pun .rv-banners a {
  opacity: 0.45;
  filter: grayscale(0.85);
}

#pun .rv-banners a:is(:hover, :focus-visible) {
  opacity: 1;
  filter: grayscale(0);
}

[hideprofile]

0

4

[hideprofile]

Структура style.css
Код:
@import url("style_cs.css");

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@1,600&family=Golos+Text:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=Kristi&family=Literata:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Amatic+SC&family=Bellota&family=Caveat&family=Comforter&family=Cuprum&family=Great+Vibes&family=Hachi+Maru+Pop&family=Libre+Barcode+39+Extended&family=Montserrat+Underline&family=Neucha&family=Play&family=Roboto&family=Rubik+Glitch&family=Rubik+Pixels&family=Rubik+Scribble&family=Stalinist+One&family=Train+One&family=Yanone+Kaffeesatz&family=Yeseva+One&display=swap");

@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/solid.min.css");

/* design by кешью. */

:root {
  --rv-brand-highlight: #ffffff;
  --rv-category-font: "Cormorant Garamond", Georgia, serif;
  --rv-category-size: 38px;
  --rv-category-sink: 7px;
  --rv-banner-radius: 12px;
  --rv-bookmark-text: var(--rv-on-dark);
  --rv-brand-bg: color-mix(in srgb, var(--rv-bg) 78%, var(--rv-clear));
  --rv-clear: transparent;
  --rv-dark: #343436;
  --rv-menu-glass: color-mix(in srgb, var(--rv-bg) 88%, var(--rv-clear));
  --rv-shine: #ffffff38;
  --rv-author: 206px;
  --rv-brand-fade: 70px;
  --rv-button-icon: "\f141";
  --rv-ease: cubic-bezier(.22, .61, .36, 1);
  --rv-editor-top: 48px;
  --rv-gap: 24px;
  --rv-menu-height: 50px;
  --rv-nav-height: 72px;
  --rv-radius: 12px;
  --rv-sidebar: 204px;
  --rv-width: 1120px;
  --rv-brand-font: "Kristi", cursive;
  --rv-brand-size: 68px;
  --rv-brand-strip-height: 46px;
  --rv-font: "Golos Text", Arial, sans-serif;
  --rv-forum-font: "Golos Text", Arial, sans-serif;
  --rv-icon-font: "Font Awesome 6 Free";
  --rv-mono: "IBM Plex Mono", Consolas, monospace;
  --rv-nick: "Literata", Georgia, serif;
  --rv-reading-size: 14px;
  --rv-title: "Literata", Georgia, serif;
  --rv-snow-color: #ffffff;
  --rv-effect-clear: #ffffff00;
  --rv-steam-left: 80%;
  --rv-steam-top: 51%;
  --rv-steam-width: 110px;
  --rv-steam-height: 140px;
  --rv-steam-color: #ffffffd9;
  --rv-accent: #858589;
  --rv-accent-soft: #88888c14;
  --rv-bg: #353334;
  --rv-bg-bottom: #414041;
  --rv-caption: #505054;
  --rv-category-art: #d9d9dc;
  --rv-category-art-active: #e5e5e7;
  --rv-firefly: #eeeeef;
  --rv-hover: #303034;
  --rv-line: #36363c24;
  --rv-link: #606066;
  --rv-muted: #6b6b70;
  --rv-on-dark: #f7f7f5;
  --rv-on-dark-muted: #ceced2;
  --rv-online: #696971;
  --rv-panel: #f5f5f3;
  --rv-paper: #e9e9e8;
  --rv-quote-end: #ededee;
  --rv-quote-start: #fafaf8;
  --rv-raised: #fcfcfa;
  --rv-text: #343436;
  --rv-shadow: #20202418;
  --rv-night-accent: #bcbcc4;
  --rv-night-accent-soft: #bcbcc414;
  --rv-night-line: #eeeeef22;
  --rv-night-link: #d0d0d6;
  --rv-night-muted: #b0b0b8;
  --rv-night-online: #c0c0c8;
  --rv-night-panel: #38383d;
  --rv-night-paper: #2e2e32;
  --rv-night-raised: #424248;
  --rv-night-text: #eeeeef;
  --rv-author-top: #fafaf8;
  --rv-author-bottom: #e2e2e5;
  --rv-author-border: #c6c6cc;
  --rv-author-accent: #74747c;
  --rv-author-ink: #3e3e45;
  --rv-author-shadow: #30303812;
  --rv-counter-bg: #dedee2;
  --rv-counter-text: #44444b;
  --rv-footer-height: 120px;
  --rv-header-height: 300px;
  --rv-category-art-width: 64px;
  --rv-image-author: linear-gradient(155deg, var(--rv-author-top), var(--rv-author-bottom));
  --rv-steam-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 160'%3E%3Cpath d='M50 154 C12 128 16 105 50 82 C86 58 86 34 50 6' fill='none' stroke='white' stroke-width='9' stroke-linecap='round'/%3E%3C/svg%3E");
--rv-snowflake-back: #777780;
--rv-submenu-overlap: 24px;
--rv-post-link: #79566d;
--rv-post-link-hover: #54384b;
--rv-post-link-bg: #79566d12;

--rv-image-header-top: url("https://forumstatic.ru/files/001c/c7/69/49922.png?v=1");
  --rv-image-footer: url("https://forumstatic.ru/files/001c/c7/69/69364.png?v=1");
  --rv-image-category: url("https://forumstatic.ru/files/001c/c7/69/17888.png");
--rv-author-art: url("https://forumstatic.ru/files/001c/c7/69/46159.png");
}

:root[data-rv-tone="dark"] {
  --rv-accent: var(--rv-night-accent);
  --rv-accent-soft: var(--rv-night-accent-soft);
  --rv-hover: var(--rv-night-accent);
  --rv-line: var(--rv-night-line);
  --rv-link: var(--rv-night-link);
  --rv-muted: var(--rv-night-muted);
  --rv-online: var(--rv-night-online);
  --rv-panel: var(--rv-night-panel);
  --rv-paper: var(--rv-night-paper);
  --rv-quote-end: var(--rv-night-panel);
  --rv-quote-start: var(--rv-night-raised);
  --rv-raised: var(--rv-night-raised);
  --rv-text: var(--rv-night-text);
  --rv-category-art: #3c3c42;
  --rv-category-art-active: #4b4b52;
  --rv-caption: #26262b;
  --rv-author-top: #48484f;
  --rv-author-bottom: #36363c;
  --rv-author-border: #606069;
  --rv-author-accent: #bbbbc5;
  --rv-author-ink: #eeeeef;
  --rv-counter-bg: #bdbdc7;
  --rv-counter-text: #303036;
  --rv-steam-top: 44%;
--rv-snowflake-back: #d5d5dd;
--rv-post-link: #d7b8cc;
--rv-post-link-hover: #f0dce8;
--rv-post-link-bg: #d7b8cc14;

  --rv-image-header-top: url("https://forumstatic.ru/files/001c/c7/69/83329.png");
  --rv-image-footer: url("https://forumstatic.ru/files/001c/c7/69/70256.png");
  --rv-image-category: url("https://forumstatic.ru/files/001c/c7/69/55802.png");
}

/* Основа */

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--rv-nav-height, 72px) + 12px);
}

body {
  margin: 0px;
  padding: 28px 16px 48px;
  font: 13px/1.6 var(--rv-font);
  overflow-wrap: break-word;
  min-height: 100vh;
}

#pun *,
#pun ::before,
#pun ::after {
  box-sizing: border-box;
}

#pun .punbb,
#pun .container,
#pun .category :is(.intd, .tclcon),
#pun #messages,
#pun :is(.inform, .fs-box, .adfs-box) {
  min-width: 0px;
}

#pun :is(h1, h2, h3, h4, p, ul, ol, dl, blockquote),
#pun .rv-account-content fieldset:first-child {
  margin-top: 0px;
}

#pun h1 {
  margin-bottom: 16px;
  font: 500 20px/1.4 var(--rv-title);
}

#pun h2 {
  font: 600 16px/1.4 var(--rv-title);
}

#pun h3 {
  font-size: 15px;
  line-height: 1.4;
}

#pun :is(img, video) {
  max-width: 100%;
  height: auto;
}

#pun abbr,
#pun :is(#pun-navlinks, #pun-ulinks) a:hover,
#pun .post-content a {
  text-decoration: none;
}

#pun hr {
  height: 1px;
  margin: 20px 0px;
}

#pun .clearer {
  clear: both;
  height: 0px;
  overflow: hidden;
}

#pun .hidden,
#pun [hidden],
#pun-live-rusff,
#pun .sharelink,
.post-share-tip,
#pun .pl-share,
#pun #button-smile,
#pun #smilies-area,
#pun #smilies,
#pun .modmenu a[href*="export.php"][href*="type=rss"],
#pun .modmenu a[href*="export.php"][href*="type=atom"],
#pun .modmenu span:has(> a[href*="export.php"]):not(:has(select, input, button)),
#pun .post h3 .item,
#pun .post h3 .item-num,
#pun .post h3 .post-title,
#pun .post-author .pa-author > span,
#pun .post-links a > span,
#pun .pagelink .pages,
#pun .tcl .item-num,
#pun #pun-index .isonline,
#pun #button-graffiti,
#pun #button-graffiti-box,
#pun #profile-gifts,
#pun #profile-useragent,
#pun #profile-user-agent,
#pun .rv-remove,
#pun #pun-about,
#pun #button-graffiti_rusff,
#pun :is(.pa-gifts, #pa-gifts, .pa-ua, #pa-ua, .pa-useragent, #pa-useragent, .pa-user-agent, #pa-user-agent, .user-agent),
#pun :is(#pun-messages, #pun-userlist) .isonline,
.jGrowl .jGrowl-notification:empty,
.jGrowl .jGrowl-notification:has(> .jGrowl-message:empty),
.jGrowl .jGrowl-closer:empty,
#pun .rv-unread-label,
#pun .tclcon > .acchide,
#pun .forum .isonline,
#pun #pun-main .forum td.tcl .byuser {
  display: none !important;
}

#pun :is(code, pre) {
  font-family: var(--rv-mono);
  font-size: 12px;
}

#pun #pun-title :is(table, tbody, tr, td) {
  display: block;
  width: 100%;
  margin: 0px;
  padding: 0px;
}

#pun :is(#pun-navlinks, #pun-ulinks) {
  position: static;
  float: none;
  clear: both;
  transform: none;
  width: auto;
  margin: 0px;
  padding: 0px;
}

#pun :is(#pun-navlinks, #pun-ulinks) ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 4px 18px;
  position: static;
  margin: 0px;
  padding: 9px 18px;
  list-style: none;
  transition: padding 0.2s, gap 0.2s;
}

#pun :is(#pun-navlinks, #pun-ulinks) li {
  float: none;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#pun :is(#pun-status, #pun-crumbs1, #pun-crumbs2) {
  position: static;
  clear: both;
  margin: 0px;
  padding: 12px 24px;
  font-size: 11px;
}

#pun :is(#pun-status, #pun-crumbs1, #pun-crumbs2) p,
#pun .formsubmit input,
#pun .post-sig dd {
  margin: 0px;
}

#pun #pun-status {
  padding-bottom: 0px;
}

#pun :is(#pun-navlinks, #pun-ulinks, #pun-status, #pun-crumbs1, #pun-crumbs2) h2,
#pun :is(#pun-break1, #pun-break2, #pun-break3, #pun-break4, #pun-pagelinks),
#pun #pun-index #pun-main > h1,
#pun :is(#html-header, #html-footer, #pun-announcement):empty,
#pun .category :is(.catleft, .catright),
#pun .category .icon,
#pun .category.rv-compact :is(thead, .tc2, .tc3),
#pun .rv-toggle span,
#pun .post-sig hr,
#pun :is(#pun-crumbs1, #pun-crumbs2) strong:first-child,
#pun .rv-partners:empty,
#pun .rv-metric br,
#pun .post-sig > hr,
#pun .rv-results-heading .acchide,
#pun .rv-reply-tools [data-rv-focus],
#pun .post-sig dt,
#pun #pun-navlinks :is(.notify-bubble, #navpm .unreads, #notify-link .unreads)::after,
#pun:has(#pun-admain) #pun-ulinks,
#pun:has(#pun-admain) #pun-title,
#pun .rv-topic-row .rv-topic-icon > img,
#pun:has(#pun-admain) .rv-footer-art {
  display: none;
}

#pun #pun-main {
  margin: 0px;
  padding: 12px 24px 28px;
  min-width: 0px;
  display: flow-root;
}

#pun #pun-announcement {
  margin: 12px 24px;
  padding: 16px 20px;
}

#pun table {
  width: 100%;
  font: inherit;
}

#pun :is(th, td) {
  padding: 12px;
  vertical-align: top;
  text-align: left;
}

#pun th {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

#pun td p:last-child,
#pun .post-content p:last-child {
  margin-bottom: 0px;
}

#pun :where(.main, #messages) .container > table,
#pun .category table,
#pun .post-content table,
#pun #pun-admain table {
  table-layout: fixed;
}

#pun :where(.main, #messages) .container > table .tcl,
#pun #pun-messages .rv-pm-table :is(th, td):nth-child(1) {
  width: 48%;
}

#pun :where(.main, #messages) .container > table :is(.tc2, .tc3) {
  width: 10%;
  text-align: center;
  font-size: 11px;
}

#pun :where(.main, #messages) .container > table .tcr {
  width: 32%;
  font-size: 11px;
}

#pun :where(.main, #messages) .tcl a {
  font-weight: 600;
}

#pun :is(.byuser, .lastpost),
#pun #profile-right li > span {
  font-size: 11px;
}

#pun .byuser {
  display: block;
  margin-top: 3px;
}

#pun .user-avatar {
  float: left;
  margin-right: 10px;
}

#pun :is(.user-avatar img, .avatar-image) {
  display: block;
  width: 34px;
  height: 34px;
  object-fit: cover;
}

#pun :where(.main, #messages) .icon {
  float: left;
  width: 7px;
  height: 7px;
  margin: 7px 10px 0px 0px;
}

#pun :is(.linkst, .linksb) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 12px 0px;
  padding: 0px;
  font-size: 11px;
  min-height: 0px;
}

#pun :is(.pagelink, .postlink, .subscribelink) {
  float: none;
  margin: 0px;
}

#pun .pagelink :is(a, strong) {
  display: inline-block;
  min-width: 24px;
  padding: 3px 7px;
  text-align: center;
}

#pun :is(.postlink, .subscribelink) a {
  display: inline-block;
  padding: 6px 12px;
}

#pun :is(.modmenu, #pun-qjump) {
  clear: both;
  margin: 12px 0px;
  font-size: 11px;
}

#pun .modmenu .container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0px;
  padding: 0px;
}

#pun .category > .container,
#pun .category .rv-fold-inner > .container {
  padding: 0 0 0 var(--rv-category-art-width);
  position: relative;
  overflow: hidden;
}

#pun .category td {
  padding: 0px;
  vertical-align: middle;
}

#pun .category .tcl {
  width: 58%;
}

#pun .category :is(.tc2, .tc3) {
  width: 7%;
  text-align: center;
  font-size: 10px;
}

#pun .category .tcr {
  width: 28%;
  font-size: 11px;
  padding: 12px;
}

#pun .category h3 {
  margin: 0px 0px 5px;
  font: 600 18px/1.4 var(--rv-forum-font);
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 10px;
}

#pun .category :is(.info, .forumdesc) {
  font-size: 12px;
  line-height: 1.65;
}

#pun .category :is(.info, .forumdesc) > p {
  margin: 8px 0px 0px;
}

#pun .rv-counts {
  margin: 0px 0px 12px;
  font-size: 10px;
  line-height: 1.4;
}

#pun .category.rv-compact .tcl {
  width: 68%;
}

#pun .category.rv-compact .tcr {
  width: 32%;
}

#pun :is(.podfl, .rv-forum-links) {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

#pun :is(.podfl, .rv-forum-links) a {
  display: inline-block;
  padding: 3px 7px;
  font-size: 10px;
  line-height: 1.5;
}

#pun .isonline {
  display: inline-block;
  width: 6px;
  height: 6px;
}

#pun .rv-toggle {
  position: absolute;
  right: 0px;
  top: 50%;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0px;
  transform: translateY(-50%);
  font-size: 0px;
  cursor: pointer;
}

#pun .rv-toggle::before {
  content: "";
  width: 7px;
  height: 7px;
  transform: translateY(-2px) rotate(45deg);
  transition: transform .25s var(--rv-ease);
}

#pun .rv-toggle[aria-expanded="false"]::before {
  transform: translateX(-2px) rotate(-45deg);
}

#pun .rv-fold {
  display: grid;
  grid-template-rows: 1fr;
  transition: grid-template-rows .3s var(--rv-ease), opacity .2s;
}

#pun .rv-fold.is-closed {
  grid-template-rows: 0fr;
}

#pun .rv-fold-inner {
  min-height: 0px;
  overflow: hidden;
}

#pun .post > h3 {
  display: flex;
  margin: 0px;
  padding: 10px 18px;
  font: 400 11px/1.5 var(--rv-font);
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#pun .post > h3 .post-num {
  float: none;
  order: 2;
  margin-left: auto;
  flex-shrink: 0;
}

#pun .post > h3 strong,
#pun #pun-title #pun-status strong {
  font-weight: 500;
}

#pun .post-author :is(.pa-reg, .pa-posts, .pa-respect, .pa-positive, .pa-last-visit),
#pun .post-author .pa-online,
#pun .rv-search-table th,
#pun .post-author :is(.pa-reg, .pa-registered, .pa-time-visit, .pa-ip) {
  font-size: 10px;
}

#pun .post-box {
  margin: 0px;
  padding: 0px;
  min-width: 0px;
}

#pun .post-content {
  font-size: var(--rv-reading-size);
  line-height: 1.8;
  overflow-wrap: anywhere;
}

#pun .post-content p {
  margin: 0px 0px 1em;
  padding: 0px;
}

#pun .post-content :is(ul, ol) {
  padding-left: 24px;
}

#pun .post-content img.postimg {
  margin: 8px 0px;
  vertical-align: middle;
}

#pun .code-box pre {
  max-height: 420px;
  margin: 0px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

#pun .spoiler-box {
  margin: 14px 0px;
}

#pun .spoiler-box > div {
  padding: 8px 12px;
  font-size: 12px;
  cursor: pointer;
}

#pun .spoiler-box > div::before {
  content: "\f013";
  display: inline-block;
  width: 18px;
  margin-right: 6px;
  font: 900 13px/1 var(--rv-icon-font);
  text-align: center;
  vertical-align: middle;
  transform: rotate(0deg);
  transform-origin: center;
  transition: transform 550ms var(--rv-ease);
  pointer-events: none;
}

#pun .spoiler-box > div.visible::before {
  transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
  #pun .spoiler-box > div::before {
    transition: none;
  }
}

#pun .spoiler-box > blockquote {
  display: none;
  margin: 0px;
  padding: 14px;
}

#pun .spoiler-box > blockquote.visible,
#pun #pun-adnav .isactive > .adsubnav,
#pun #pun-admain .adinput {
  display: block;
}

#pun .post-links {
  clear: both;
  padding: 10px 18px;
  font-size: 10px;
  width: 100%;
}

#pun .post-links ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 6px 16px;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#pun .post-links li,
#pun #profile-left ul,
#pun #profile-right ul,
#pun #profilenav :is(ul, li) {
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#pun .post-links a {
  display: inline-block;
  padding: 4px 0px;
}

#pun :is(.post-edit, .lastedit) {
  margin-top: 12px;
  font-size: 10px;
}

#pun #viewprofile {
  display: block;
  width: 100%;
  min-width: 0px;
  padding: 0px;
}

#pun #viewprofile > .container,
#pun #viewprofile > .container > ul {
  width: 100%;
  min-width: 0px;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#pun #viewprofile:has(> #profile-left),
#pun table#viewprofile,
#pun #viewprofile table:has(> tbody > tr > #profile-left) {
  display: grid;
  grid-template-columns: var(--rv-author) minmax(0, 1fr);
  align-items: start;
  gap: var(--rv-gap);
  width: 100%;
  min-width: 0px;
}

#pun table#viewprofile > tbody,
#pun table#viewprofile > tbody > tr,
#pun #viewprofile table:has(> tbody > tr > #profile-left) > tbody,
#pun #viewprofile table:has(> tbody > tr > #profile-left) > tbody > tr {
  display: contents;
}

#pun #profile-left {
  display: block;
  min-width: 0px;
  align-self: start;
  float: none;
  width: auto;
  margin: 0px;
  text-align: center;
  overflow: visible;
  padding: 16px !important;
}

#pun #profile-left li {
  padding: 5px 0px;
  list-style: none;
}

#pun #profile-left img {
  display: block;
  width: auto;
  max-width: 100%;
  margin: auto;
}

#pun #profile-right {
  display: block;
  float: none;
  width: auto;
  min-width: 0px;
  margin: 0px;
  padding: 12px 18px;
  overflow: visible;
}

#pun #profile-name {
  font: 700 24px/1.2 var(--rv-nick);
  margin: 0px 0px 8px;
}

#pun #profile-right li {
  display: grid;
  grid-template-columns: minmax(105px, 30%) minmax(0px, 1fr);
  gap: 12px;
  padding: 10px 0px;
  width: 100%;
  min-width: 0px;
  margin: 0px;
  list-style: none;
  font: 12px/1.5 var(--rv-font);
}

#pun #profile-right strong {
  padding-left: 0px;
  font-weight: 400;
  overflow-wrap: anywhere;
}

#pun #profilenav {
  float: left;
  width: var(--rv-sidebar);
  margin: 0px;
  padding: 0px;
}

#pun #profilenav h2 {
  font: 600 13px/1.5 var(--rv-font);
}

#pun #profilenav a {
  display: block;
  padding: 7px 10px;
  font-size: 11px;
}

#pun #profile {
  margin-left: 0px;
  min-width: 0px;
}

#pun #messages .container {
  padding: 12px;
}

#pun #pun-messages #post-form div.container {
  padding: 0px;
}

#pun #profile-navigation ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  padding: 0px;
  list-style: none;
}

#pun fieldset {
  min-width: 0px;
  margin: 16px 0px;
  padding: 18px;
}

#pun legend {
  padding: 0px 7px;
  font: 600 12px/1.5 var(--rv-font);
}

#pun label {
  font-size: 12px;
}

#pun :is(input, select, textarea, button) {
  font-family: var(--rv-font);
}

#pun :is(input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="search"], input[type="number"], select, textarea) {
  max-width: 100%;
  min-width: 0px;
  padding: 9px 11px;
  font-size: 12px;
  line-height: 1.5;
}

#pun textarea {
  width: 100%;
  min-height: 160px;
  resize: vertical;
}

#pun #main-reply {
  width: 100%;
  min-height: 280px;
  padding: 18px;
  font-size: 14px;
  line-height: 1.8;
}

#pun :is(input[type="submit"], input[type="button"], input[type="reset"], button.rv-button) {
  padding: 8px 14px;
  font-size: 11px;
  line-height: 1.5;
  cursor: pointer;
}

#pun :is(input, button):disabled {
  cursor: not-allowed;
}

#pun :is(.formsubmit, .submitend, .submittop) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 14px 0px;
}

#pun #post-form h2 {
  margin: 22px 0px 12px;
  font: 600 18px/1.4 var(--rv-title);
}

#pun #tags {
  position: relative;
  isolation: isolate;
  overflow: visible;
}

#pun .rv-reply-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0px;
  font-size: 11px;
}

#pun .rv-reply-tools button,
#pun #pun-stats li:not(#onlinelist):not(#onlinelist2):not(.rv-visitors) {
  padding: 5px 10px;
}

/* Администрирование */

#pun #pun-admain {
  display: flow-root;
  position: static;
  float: none;
  clear: both;
  width: auto;
  min-width: 0px;
  margin: 0px;
  padding: 18px 24px 28px;
}

#pun #pun-admain > h1 {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

#pun #pun-adnav {
  position: static;
  float: left;
  clear: none;
  transform: none;
  width: var(--rv-sidebar);
  margin: 0px;
  padding: 0px;
}

#pun #pun-adnav :is(.adcontainer, #adnav-standard) {
  position: static;
  margin: 0px;
  padding: 0px;
}

#pun #pun-adnav ul {
  display: block;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#pun #pun-adnav li {
  position: relative;
  display: block;
  float: none;
  min-height: 0px;
  margin: 0px;
  padding: 0px;
  list-style: none;
}

#pun #pun-adnav a {
  display: block;
  min-height: 0px;
  padding: 3px 9px;
  font: 500 12px/1.5 var(--rv-font);
  text-transform: none;
  text-decoration: none;
}

#pun #pun-adnav .adsubnav {
  display: none;
  padding: 2px 0px 4px 10px;
}

#pun #pun-adnav .adsubnav a {
  min-height: 0px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 400;
  text-transform: none;
}

#pun #pun-adnav li > sup {
  position: absolute;
  top: 7px;
  right: 6px;
  padding: 2px 4px;
  font: 500 8px/12px var(--rv-font);
  white-space: nowrap;
}

#pun #pun-admain > :is(.adformal, .adsection, .adinfo) {
  position: static;
  float: none;
  clear: none;
  width: auto;
  min-width: 0px;
  margin: 0 0 20px calc(var(--rv-sidebar) + var(--rv-gap));
  padding: 0px;
}

#pun #pun-admain :is(.adformal, .adsection, .adinfo) > h2,
#pun #pun-adnav > h2 {
  margin: 0px 0px 14px;
  padding: 9px 12px;
  font: 600 14px/1.45 var(--rv-font);
  overflow-wrap: anywhere;
}

#pun #pun-admain .adcontainer {
  margin: 0px;
  padding: 0px;
}

#pun #pun-admain :is(.adfs-box, .adlabel, .adinput, .adsubmitfield, .adsubmit) {
  position: static;
  float: none;
  width: auto;
  max-width: 100%;
  margin: 0px;
}

#pun #pun-admain .adlabel {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
}

#pun #pun-admain .adfs-box > p {
  margin: 0px;
  padding: 12px 0px;
}

#pun #pun-admain :is(.adsubmit, .adsubmitfield) {
  margin-top: 10px;
}

#pun #pun-admain textarea {
  width: 100%;
  min-height: 300px;
  font: 12px/1.6 var(--rv-mono);
  tab-size: 2;
}

#pun #pun-admain th {
  width: 28%;
}

#pun #pun-admain :is(th, td) {
  overflow-wrap: anywhere;
}

#pun #pun-stats {
  margin: 0px 24px 24px;
  padding: 0px;
}

#pun #pun-stats ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 0px;
  padding: 0px;
  list-style: none;
  justify-content: center;
}

#pun #pun-stats li {
  list-style: none;
  font-size: 11px;
}

#pun #pun-stats #onlinelist,
#pun #pun-stats :is(#onlinelist2, .rv-visitors) {
  flex-basis: 100%;
  padding: 16px 0px 0px;
  font-size: 12px;
  line-height: 1.8;
}

#pun .post-content a[href]:not(:has(img)) {
  color: var(--rv-post-link);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 0;
  box-shadow: none;
  border-radius: 3px;
  transition: color 180ms ease, background-color 180ms ease;
}

#pun .post-content a[href]:not(:has(img)):is(:hover, :focus-visible) {
  color: var(--rv-post-link-hover);
  background-color: var(--rv-post-link-bg);
}

/* Редактор */

#pun #form-buttons {
  margin-bottom: 10px;
  padding: 6px;
}

#pun #form-buttons table,
#pun #form-buttons tbody {
  display: block;
  width: 100%;
}

#pun #form-buttons tr {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

#pun #form-buttons td[id^="button-"] {
  position: relative;
  display: block;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  padding: 0px !important;
}

#pun #form-buttons td[id^="button-"]::before {
  content: var(--rv-button-icon, "\f141");
  position: absolute;
  inset: 0px;
  display: grid;
  place-items: center;
  font-family: var(--rv-icon-font);
  font-size: 14px;
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
}

#pun #form-buttons td[id^="button-"] img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0px;
  cursor: pointer;
}

#pun #button-font {
  --rv-button-icon: "\f031";
}

#pun #button-size {
  --rv-button-icon: "\f034";
}

#pun #button-bold {
  --rv-button-icon: "\f032";
}

#pun #button-italic {
  --rv-button-icon: "\f033";
}

#pun #button-underline {
  --rv-button-icon: "\f0cd";
}

#pun #button-strike {
  --rv-button-icon: "\f0cc";
}

#pun #button-left {
  --rv-button-icon: "\f036";
}

#pun #button-center {
  --rv-button-icon: "\f037";
}

#pun #button-right {
  --rv-button-icon: "\f038";
}

#pun #button-link {
  --rv-button-icon: "\f0c1";
}

#pun #button-spoiler {
  --rv-button-icon: "\f518";
}

#pun #button-image {
  --rv-button-icon: "\f03e";
}

#pun #button-video {
  --rv-button-icon: "\f03d";
}

#pun #button-hide {
  --rv-button-icon: "\f023";
}

#pun #button-quote {
  --rv-button-icon: "\f10e";
}

#pun #button-code {
  --rv-button-icon: "\f121";
}

#pun #button-color {
  --rv-button-icon: "\f53f";
}

#pun #button-keyboard {
  --rv-button-icon: "\f11c";
}

#pun #button-table {
  --rv-button-icon: "\f0ce";
}

#pun #button-addition {
  --rv-button-icon: "\f0c9";
}

#pun #button-transL {
  --rv-button-icon: "\f1ab";
}

#pun #button-indent {
  --rv-button-icon: "\f03c";
}

#pun #button-justify {
  --rv-button-icon: "\f039";
}

#pun #button-files_rusff {
  --rv-button-icon: "\f0c6";
}

#pun .rv-results-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: baseline;
  font: 500 12px/1.5 var(--rv-font);
  margin: 8px 0px 12px;
}

#pun .pagelink {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  font: 11px/1.5 var(--rv-font);
  margin: 0px;
}

#pun .post > h3 > :not(.post-num) {
  order: 1;
}

#pun .post-links .rv-link-label {
  font-size: 10px;
  font-weight: 400;
  text-transform: uppercase;
}

#pun .rv-presence {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  font-size: 0px;
}

#pun .rv-presence::before {
  content: "\f056";
  font: 900 13px/1 var(--rv-icon-font);
}

#pun .rv-account-layout {
  display: grid;
  grid-template-columns: var(--rv-sidebar) minmax(0, 1fr);
  gap: var(--rv-gap);
  align-items: start;
  margin: 0px;
  padding: 0px;
  width: 100%;
}

#pun .rv-account-layout > #profilenav,
#pun .rv-account-content > :is(#profile, form, .container, .formal) {
  float: none;
  width: auto;
  margin: 0px;
  padding: 0px;
}

#pun .rv-account-content {
  min-width: 0px;
  margin: 0px;
  padding: 0px;
}

#pun #profile-right li > :is(div, strong) {
  min-width: 0px;
  padding: 0px;
  overflow-wrap: anywhere;
  display: block;
  float: none;
  width: auto;
  margin: 0px;
  white-space: normal;
  word-break: normal;
}

#pun #profile-signature {
  grid-column: 1 / -1;
  padding: 14px 0px 0px;
}

#pun .rv-search-table .tc2 {
  width: 20%;
  text-align: left;
}

#pun .rv-search-table .tc3 {
  width: 8%;
  text-align: center;
}

#pun .rv-search-table .tcl {
  width: 42%;
  font-size: 12px;
}

#pun .rv-search-table .tcr {
  width: 30%;
  font-size: 11px;
}

#pun .rv-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  padding: 24px 0px;
  font-size: 11px;
}

#pun .rv-partners {
  display: flex;
  flex: 1 1 0%;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0px;
}

#pun .rv-footer-brand {
  margin-left: auto;
  text-align: right;
  font: italic 20px/1.4 var(--rv-title);
}

#pun .rv-icon-button {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0px;
  cursor: pointer;
}

#pun .rv-icon-button::before {
  font: 900 14px/1 var(--rv-icon-font);
}

#pun .rv-tone {
  position: absolute;
  top: 22px;
  right: 20px;

  .rv-menu-dock.is-joined > & {
    top: 50%;
    right: 10px;
    width: 26px;
    height: 26px;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    transform: translateY(-50%);
    z-index: 2;
  }
}

#pun .rv-tone::before {
  content: "\f186";
}

:root[data-rv-tone="dark"] #pun .rv-tone::before {
  content: "\f185";
}

#pun .rv-scroll {
  position: fixed;
  right: max(8px, calc((100vw - var(--rv-width)) / 2 - 48px));
  bottom: auto;
  z-index: 100;
  display: grid;
  gap: 8px;
  top: 50%;
  transform: translateY(-50%);
}

#pun [data-rv-top]::before {
  content: "\f062";
}

#pun [data-rv-bottom]::before {
  content: "\f063";
}

/* Состояния форумов */

#pun .rv-forum-state {
  display: grid;
  place-items: center;
  width: var(--rv-category-art-width);
  height: 32px;
  margin: 0px;
  flex: 0 0 18px;
  font-style: normal;
  position: absolute;
  left: calc(-1 * var(--rv-category-art-width));
  top: 50%;
  transform: translateY(-50%);
  font-size: 21px;
}

#pun .rv-forum-state::before {
  display: block;
  transform-origin: 50% 50%;
  content: "\f2dc";
  font: 900 16px/1 var(--rv-icon-font);
position: relative;
z-index: 1;
}

#pun .rv-post-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0px 0px 16px;
  padding: 0px 0px 12px;
  font: 500 11px/1.5 var(--rv-mono);
}

#pun .rv-post-heading .rv-post-date {
  min-width: 0px;
  order: 0;
}

#pun .rv-post-heading .rv-post-number {
  flex-shrink: 0;
  margin-left: auto;
  order: 1;
  font-weight: 400;
}

#pun .post-links li.rv-action-start {
  margin-left: auto;
}

#pun .category > h2 > span,
#pun #pun-stats > h2 > span {
  display: block;
  min-width: 0px;
  overflow-wrap: anywhere;
  transform: translateY(var(--rv-category-sink));
}

#pun .category .tclcon {
  padding: 12px;
  min-width: 0px;
  position: relative;
}

#pun .category tr {
  transition: background-color 0.18s;
  position: relative;
}

#pun tr:is(.inew, .inewclosed) .rv-forum-state::before {
  animation: 16s linear 0s infinite normal none running rv-snow-turn;
}

#pun .rv-lastpost {
  display: grid;
  grid-template-columns: minmax(0px, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 0px;
}

#pun .rv-lastpost:has(> .user-avatar) {
  grid-template-columns: 34px minmax(0px, 1fr);
}

#pun .rv-lastpost > .user-avatar {
  float: none;
  margin: 0px;
  grid-column: 1;
}

#pun .rv-lastpost-text {
  min-width: 0px;
  overflow-wrap: anywhere;
}

#pun .rv-lastpost-text .byuser {
  display: inline;
  margin: 0px;
  white-space: nowrap;
}

#pun .rv-lastpost-text .lastpost {
  display: inline;
}

#pun #navpm,
#pun #navpm > a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

#pun .rv-presence.is-online::before {
  content: "\f058";
}

#pun .rv-metric-label {
  display: inline-block;
  flex-shrink: 0;
  font-size: 0px;
}

#pun .rv-metric-label::before {
  content: var(--rv-metric-icon);
  font: 900 11px/1 var(--rv-icon-font);
}

#pun .post-author .pa-reg {
  --rv-metric-icon: "\f073";
}

#pun .post-author .pa-invites {
  --rv-metric-icon: "\f234";
}

#pun .post-author .pa-posts {
  --rv-metric-icon: "\f075";
}

#pun .post-author .pa-respect {
  --rv-metric-icon: "\f164";
}

#pun .post-author .pa-positive {
  --rv-metric-icon: "\f51e";
}

#pun .post-author .pa-reputation {
  --rv-metric-icon: "\f521";
}

#pun .post-author .pa-awards {
  --rv-metric-icon: "\f091";
}

#pun #pun-messages .rv-pm-table {
  display: table;
  table-layout: fixed;
  width: 100%;
  height: auto;
  margin: 0px;
  float: none;
}

#pun #pun-messages .rv-pm-table thead {
  display: table-header-group;
  position: static;
  float: none;
  transform: none;
  height: auto;
}

#pun #pun-messages .rv-pm-table tbody {
  display: table-row-group;
  position: static;
  float: none;
  transform: none;
  height: auto;
}

#pun #pun-messages .rv-pm-table tfoot {
  display: table-footer-group;
  position: static;
  float: none;
  transform: none;
  height: auto;
}

#pun #pun-messages .rv-pm-table tr {
  display: table-row;
  position: static;
  float: none;
  transform: none;
  height: auto;
}

#pun #pun-messages .rv-pm-table th,
#pun #pun-messages .rv-pm-table td {
  display: table-cell;
  position: static;
  float: none;
  transform: none;
  height: auto;
}

#pun #pun-messages .rv-pm-table :is(th, td) {
  padding: 12px 8px;
  overflow-wrap: anywhere;
  white-space: normal;
  vertical-align: middle;
  font-size: 12px;
}

#pun #pun-messages .rv-pm-table :is(th, td):nth-child(2) {
  width: 24%;
}

#pun #pun-messages .rv-pm-table :is(th, td):nth-child(3) {
  width: 23%;
}

#pun #pun-messages .rv-pm-table :is(th, td):nth-child(4) {
  width: 5%;
}

#pun #pun-messages .rv-pm-table :is(th, td):last-child:has(input[type="checkbox"]) {
  width: 32px;
  text-align: center;
}

#pun #pun-messages .rv-pm-table td .user-avatar {
  float: left;
  margin: 0px 8px 0px 0px;
}

#pun #pun-messages fieldset {
  height: auto;
  min-height: 0px;
  overflow: visible;
}

#pun #tags > .container {
  position: absolute;
  top: var(--rv-editor-top);
  left: 0px;
  right: auto;
  z-index: 50;
  width: max-content;
  min-width: 180px;
  max-width: min(640px, 100%);
  max-height: min(360px, 55vh);
  overflow: auto;
  padding: 12px;
  margin: 0px;
}

#pun #post-form :is(fieldset, .fs-box, .fs-box > p) {
  overflow: visible;
}

.jGrowl {
  z-index: 1000;
  font: 12px/1.5 var(--rv-font);
  position: fixed !important;
  top: calc(var(--rv-nav-height) + 16px) !important;
  bottom: auto !important;
  right: 12px !important;
  left: auto !important;
  width: auto !important;
}

.jGrowl .jGrowl-notification,
.jGrowl .jGrowl-closer {
  box-sizing: border-box;
  min-height: 0px;
  margin: 12px 16px;
  position: relative;
  overflow-wrap: anywhere;
  width: min(340px, -32px + 100vw) !important;
  padding: 16px 42px 16px 18px !important;
}

.jGrowl .jGrowl-close {
  position: absolute;
  top: 8px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 0px;
  font: 600 18px/1 var(--rv-font);
  cursor: pointer;
}

.jGrowl .jGrowl-header {
  margin-bottom: 5px;
  font-weight: 600;
}

#pun a {
  text-underline-offset: 3px;
  transition: color 0.18s, background-color 0.18s;
  text-decoration: none !important;
}

#pun a:hover,
#pun a:focus-visible,
.jGrowl a {
  text-decoration: none !important;
}

#pun .rv-post-date::before {
  content: "\f017";
  font: 900 11px/1 var(--rv-icon-font);
  margin-right: 7px;
}

#pun .rv-copy-code::before {
  content: "\f0c5";
  font: 900 10px/1 var(--rv-icon-font);
  margin-right: 6px;
}

#pun .post-sig::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 25%;
  width: 50%;
  height: 1px;
}

#pun #viewprofile .rv-profile-grid {
  display: grid;
  grid-template-columns: minmax(160px, 210px) minmax(0px, 1fr);
  gap: 20px;
  width: 100%;
  place-items: start stretch;
}

#pun #profile-right li > :is(span, strong, div) {
  min-width: 0px;
  width: auto;
  padding: 0px;
  float: none;
}

#pun #tags :is(#color-area, #table-area) table {
  display: table;
  table-layout: auto;
  margin: 0px;
  width: auto !important;
}

#pun #tags :is(#color-area, #table-area) tr {
  display: table-row;
}

#pun #tags :is(#color-area, #table-area) :is(tbody, thead) {
  display: table-row-group;
}

#pun #tags :is(#color-area, #table-area) td {
  display: table-cell;
  width: 22px;
  min-width: 22px;
  height: 22px;
  padding: 0px;
  line-height: 0;
}

#pun #tags :is(#color-area, #table-area) td img {
  display: block;
  width: 22px;
  height: 22px;
  max-width: none;
}

#pun #keyboard-span input {
  font: 500 11px/1 var(--rv-font);
  height: 28px;
  min-width: 28px;
  padding: 4px 6px;
  margin: 2px;
}

#pun #keyboard-area {
  max-width: min(620px, 100%);
}

#pun #post-form fieldset {
  margin-top: 18px;
  padding-top: 16px;
}

#pun #post-form legend {
  position: static;
  float: none;
  transform: none;
  padding: 0px 8px;
  font: 500 11px/1.5 var(--rv-font);
}

#pun .rv-crumb-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin: 0px;
  padding: 0px;
}

#pun .rv-crumb {
  position: relative;
  display: inline-block;
  overflow: hidden;
  padding: 6px 11px;
  font: 500 12px/1.5 var(--rv-font);
}

#pun .rv-crumb::after,
#pun :is(.rv-forum-links, .podfl) a::after {
  content: "";
  position: absolute;
  inset: 0px;
  transform: translateX(-130%) skewX(-20deg);
  pointer-events: none;
}

#pun .rv-crumb:is(:hover, :focus-visible, :active)::after,
#pun :is(.rv-forum-links, .podfl) a:is(:hover, :focus-visible, :active)::after {
  transform: translateX(130%) skewX(-20deg);
  transition: transform .55s var(--rv-ease);
}

#pun #pun-crumbs2 .rv-crumb {
  font-size: 10px;
  padding: 4px 8px;
}

#pun .rv-results-meta {
  font: 400 10px/1.5 var(--rv-mono);
}

#pun #pun-admain .rv-author-fields .adfs-box > p {
  display: grid;
  grid-template-columns: minmax(110px, 40%) minmax(0px, 1fr);
  gap: 12px;
  align-items: center;
  position: relative;
  min-height: 44px;
  padding: 10px 32px 10px 12px !important;
  margin: 0px !important;
}

#pun #pun-admain .rv-author-fields .adlabel {
  margin: 0px;
  padding: 0px;
  left: auto;
  display: block;
  width: auto !important;
  position: static !important;
  float: none !important;
}

#pun #pun-admain .rv-author-fields .adinput {
  margin: 0px;
  padding: 0px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

#pun .rv-reading-size {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin: 0px 0px 16px;
  font: 11px/1.5 var(--rv-font);
}

#pun .rv-reading-size input {
  width: 130px;
  height: 20px;
  padding: 0px;
  cursor: pointer;
}

#pun #pun-admain .rv-author-fields .adfs-box > p::after {
  content: "\f0b2";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font: 900 12px/1 var(--rv-icon-font);
  pointer-events: none;
}

#pun .rv-results-heading > span {
  display: inline-block;
  margin-right: 8px;
}

#pun .post-author .pa-author > .rv-presence {
  width: 14px;
  height: 14px;
  font-size: 0px;
  display: inline-flex !important;
}

#pun .rv-copy-code {
  position: absolute;
  top: 8px;
  right: 10px;
  padding: 5px 9px;
  font: 500 10px/1.5 var(--rv-font);
  cursor: pointer;
  transition: background-color 0.18s, color 0.18s;
}

#pun .rv-reading-size button {
  padding: 4px 8px;
  font-size: 10px;
  cursor: pointer;
  transition: background-color 0.18s, color 0.18s;
}

#pun .forum .icon {
  width: 18px;
  height: 18px;
  font: 900 11px/18px var(--rv-icon-font);
  text-align: center;
}

#pun .forum .icon::before {
  content: "\f15c";
}

#pun .rv-results-heading .item2 {
  font: 400 10px/1.5 var(--rv-mono);
  margin-left: auto;
}

#pun #viewprofile-next,
#pun .rv-account-content > #viewprofile-next {
  display: block;
  width: 100%;
  min-width: 0px;
  max-width: none;
  float: none;
  margin: 0px;
  padding: 0px;
}

#pun #viewprofile .rv-profile-grid > #profile-right {
  width: 100%;
  min-width: 0px;
  max-width: none;
  justify-self: stretch;
  float: none;
}

#pun #viewprofile .rv-profile-grid > #profile-left {
  width: 100%;
  min-width: 0px;
  max-width: none;
}

#pun .rv-crumb-separator {
  font: 900 8px/1 var(--rv-icon-font);
  flex: 0 0 auto;
}

#pun .rv-crumb-separator::before {
  content: "\f105";
}

#pun :is(.rv-forum-links, .podfl) a {
  position: relative;
  overflow: hidden;
  display: inline-block;
  padding: 4px 9px;
}

.rv-fireflies {
  position: fixed;
  inset: 0px;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}

.rv-fireflies i {
  position: absolute;
  width: 2px;
  height: 2px;
  animation: 17s ease-in-out 0s infinite normal none running rv-firefly;
}

.rv-fireflies i:nth-child(1) {
  left: 4%;
  top: 22%;
  animation-delay: -1s;
}

.rv-fireflies i:nth-child(2) {
  left: 94%;
  top: 38%;
  animation-delay: -7s;
}

.rv-fireflies i:nth-child(3) {
  left: 9%;
  top: 77%;
  animation-delay: -12s;
}

.rv-fireflies i:nth-child(4) {
  left: 89%;
  top: 88%;
  animation-delay: -4s;
}

.rv-fireflies i:nth-child(5) {
  left: 52%;
  top: 7%;
  animation-delay: -10s;
}

#pun #pun-stats > :is(.container, .statscon) {
  padding: 20px;
  overflow: hidden;
}

#pun #pun-main:has(.rv-search-table) > h1 {
  display: block;
  margin: 6px 0px 14px;
  padding: 0px;
  font: 500 16px/1.5 var(--rv-font);
  letter-spacing: normal;
  text-transform: none;
}

#pun #pun-main:has(.rv-search-table) > h1::before,
#pun #pun-navlinks a::before {
  content: none;
}

#pun #pun-viewtopic #pun-main > h1 > span,
#pun #pun-main:has(.rv-search-table) > h1 > span {
  font: inherit;
  overflow-wrap: anywhere;
}

#pun #pun-main:has(.forum) > h1,
#pun #pun-userlist h1 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0px 16px;
  padding: 0px;
  font: 500 16px/1.5 var(--rv-font);
  letter-spacing: 0.02em;
  text-transform: none;
}

#pun #pun-main:has(.forum) > h1 > span,
#pun #pun-userlist h1 > span {
  min-width: 0px;
  font: inherit;
}

#pun #pun-main:has(.forum) > h1::before,
#pun #pun-main > h1::before,
#pun #pun-main .formal > h2::before {
  content: "\f03a";
  flex: 0 0 auto;
  font: 900 11px/1 var(--rv-icon-font);
}

#pun #pun-main:has(.forum) > h1::after,
#pun #pun-userlist h1::after {
  content: "";
  flex: 1 1 0%;
  height: 1px;
}

#pun #pun-main .forum > h2 {
  margin: 8px 0px 12px;
  font: 400 12px/1.5 var(--rv-font);
}

#pun #pun-main .forum > h2 > span {
  font: inherit;
}

#pun :is(#post-form, #pun-post .formal, #pun-edit .formal) fieldset {
  min-width: 0px;
  padding: 18px;
}

#pun :is(#post-form, #pun-post .formal, #pun-edit .formal) legend {
  float: left;
  position: static;
  width: 100%;
  box-sizing: border-box;
  margin: 0px 0px 14px;
  padding: 0px;
  transform: none;
  font: 400 12px/1.5 var(--rv-font);
  white-space: normal;
}

#pun :is(#post-form, #pun-post .formal, #pun-edit .formal) legend + *,
#pun #pun-main fieldset > legend + *,
#pun #pun-admain fieldset > legend + * {
  clear: both;
}

#pun .post-author ul > li {
  text-align: center;
}

#pun .post-author ul > :is(.pa-reg, .pa-registered, .pa-time-visit, .pa-ip) {
  flex-basis: 100%;
}

#pun #pun-main > h1,
#pun #post-form > h2,
#pun #pun-main .formal > h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0px 16px;
  padding: 0px;
  font: 500 16px/1.5 var(--rv-font);
  letter-spacing: 0.02em;
  text-align: left;
  text-transform: none;
}

#pun #pun-main > h1 > span,
#pun #post-form > h2 > span,
#pun #pun-main .formal > h2 > span {
  min-width: 0px;
  padding: 0px;
  font: inherit;
  overflow-wrap: anywhere;
}

#pun #post-form > h2::before {
  flex: 0 0 auto;
  font: 900 11px/1 var(--rv-icon-font);
  content: "\f4ad";
}

#pun #post-form > h2::after,
#pun #pun-main > h1::after,
#pun #pun-main .formal > h2::after,
#pun #pun-viewtopic #pun-main > h1::after {
  content: "";
  flex: 1 1 24px;
  height: 1px;
}

#pun #pun-main fieldset {
  min-width: 0px;
  box-sizing: border-box;
  padding: 18px;
}

#pun #pun-main fieldset > legend {
  float: left;
  position: static;
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0px 0px 14px;
  padding: 0px;
  font: 500 12px/1.5 var(--rv-font);
  white-space: normal;
  overflow-wrap: anywhere;
  transform: none;
}

#pun #pun-main fieldset > legend > span {
  position: static;
  padding: 0px;
  font: inherit;
}

#pun #pun-main .forum tbody > tr > td {
  vertical-align: middle;
}

#pun #pun-main .forum td.tcl .intd {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0px;
  padding-left: 0px;
}

#pun #pun-main .forum td.tcl .icon {
  float: none;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0px;
  transform: none;
  position: relative;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
}

#pun #pun-main .forum td.tcl .tclcon {
  flex: 1 1 auto;
  min-width: 0px;
  margin: 0px;
  padding: 0px;
  line-height: 1.45;
}

#pun #pun-search .forum table {
  width: 100%;
  table-layout: fixed;
}

#pun #pun-search .forum :is(th, td).tcl {
  width: 38%;
}

#pun #pun-search .forum :is(th, td).tc2 {
  width: 24%;
  white-space: nowrap;
}

#pun #pun-search .forum :is(th, td).tc3 {
  width: 8%;
}

#pun #pun-search .forum :is(th, td).tcr {
  width: 30%;
}

#pun #pun-search .forum td.tc2 > a,
#pun #pun-main .forum td.tc2 a {
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
}

#pun #pun-main .forum :is(th, td).tc2 {
  width: 24%;
  min-width: 180px;
  white-space: nowrap;
}

#pun #pun-userlist h1::before {
  content: "\f0c0";
  flex: 0 0 auto;
  font: 900 12px/1 var(--rv-icon-font);
}

#pun form input:not([type="hidden"], [type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="reset"], [type="image"], [type="range"], [type="color"]),
#pun form select,
#pun form textarea {
  margin-top: 6px;
}

#pun #html-footer {
  clear: both;
  padding: 0px 24px;
  height: auto;
  min-height: 0px;
  padding-block: 0px;
}

#pun #html-footer .rv-footer-art {
  display: block;
position: relative;
  width: calc(100% + 48px);
  margin-inline: -24px;
  box-sizing: border-box;
  height: var(--rv-footer-height);
  min-height: 0px;
  aspect-ratio: auto;
}



#pun #pun-navlinks li {
  position: relative;
  flex: 0 0 auto;
}

#pun #pun-navlinks a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 0px;
padding: 4px 0;
  font: 600 10px/1.2 var(--rv-font);
  letter-spacing: 0.045em;
  text-transform: uppercase;
  white-space: nowrap;
  isolation: isolate;
  transition: color 0.2s;
}

#pun #pun-ulinks ul {
  justify-content: center;
  gap: 3px 12px;
  margin: calc(-1 * var(--rv-submenu-overlap)) 0 0;
  padding: 4px 16px;
}

#pun #pun-ulinks a {
  display: block;
  padding: 2px 0;
  font-size: 10px;
  line-height: 1.2;
}

#pun .rv-menu-dock #pun-navlinks a {
  min-height: 0px;
padding: 4px 0;
}

#pun #pun-ulinks {
  position: sticky;
  top: var(--rv-menu-height);
  z-index: 209;
  box-sizing: border-box;
  width: 100%;
  margin: 0px;
  padding: 0px;
}

#pun .rv-menu-dock {
  position: sticky;
  top: 0px;
  z-index: 210;
  display: flow-root;
  margin-bottom: calc(-1 * var(--rv-menu-height));
}

#pun .rv-menu-dock #pun-navlinks {
  position: relative;
  isolation: isolate;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
}

#pun #pun-navlinks ul,
#pun .rv-menu-dock #pun-navlinks ul {
  margin: 0;
  padding: 5px 22px;
  align-items: center;
  justify-content: center;
  gap: 3px 12px;
}

#pun #pun-title {
  width: 100%;
  padding-right: 70px;
  padding-bottom: 24px;
  box-sizing: border-box;
  height: var(--rv-header-height);
  min-height: 0px;
  aspect-ratio: auto;
  padding-left: 0px;
  position: relative;
  padding-top: calc(var(--rv-menu-height) + 18px);
  overflow: hidden;
  isolation: isolate;
}

#pun #pun-index #pun-crumbs1 {
  padding-top: 8px;
  padding-bottom: 4px;
}

#pun #pun-index #pun-main {
  padding-top: 0px;
}

#pun #pun-index .category {
  margin-top: 0px;
  margin-bottom: 14px;
}

#pun .rv-menu-dock.is-joined #pun-navlinks::before,
#pun:has(#pun-admain) #pun-navlinks::before {
  clip-path: none;
  border-radius: 0;
}

#pun .rv-menu-dock.is-joined #pun-navlinks::before,
#pun:has(#pun-admain) #pun-navlinks::before {
  clip-path: none;
  border-radius: 0;
}

#pun #pun-title #pun-status {
  position: absolute;
  box-sizing: border-box;
  margin: 0px;
  inset: auto 0 calc(var(--rv-submenu-overlap) + 8px) auto;
  width: fit-content;
  max-width: calc(100% - 24px);
  min-height: 0px;
  padding: 3px 12px;
  font: 400 10px/1.3 var(--rv-font);
  text-align: right;
}

#pun #pun-title #pun-status p {
  margin: 0px;
  padding: 0px;
  font: inherit;
}

#pun #pun-title #pun-status :is(a, span, strong) {
  font-size: inherit;
  line-height: inherit;
}

#pun .category {
  margin: 4px 0px 20px;
  transition: none;
}

#pun .category > h2,
#pun #pun-stats > h2 {
  position: relative;
  display: flex;
  margin-top: 0px;
  margin-right: 0px;
  margin-left: 0px;
  justify-content: center;
  text-align: center;
  min-height: 0px;
  align-items: center;
  padding: 10px 38px 0px;
  font: italic 600 var(--rv-category-size)/1.05 var(--rv-category-font);
  letter-spacing: 0.025em;
  text-transform: uppercase;
  margin-bottom: calc(-1 * var(--rv-category-sink));
}

#pun #pun-index .category > h2 {
  min-height: 0px;
  padding-top: 10px;
}

#pun .rv-caption {
  position: relative;
  z-index: 1;
  text-align: center;
  margin: 0px;
  padding: 3px 16px;
  font: 400 10px/1.35 var(--rv-font);
  letter-spacing: 0.035em;
}

#pun .rv-stats-caption {
  text-align: center;
  position: relative;
  z-index: 1;
  margin: 0px;
  padding: 3px 16px;
  font: 400 10px/1.35 var(--rv-font);
  letter-spacing: 0.035em;
}

#pun .category .container::before {
  content: "";
  position: absolute;
  inset: 0px auto 0px 0px;
  width: var(--rv-category-art-width);
  pointer-events: none;
  transition: opacity 0.25s, filter 0.25s;
}

#pun .post {
  position: relative;
  margin: 0px 0px 16px;
}

#pun .post > .container {
  display: grid;
  grid-template-columns: var(--rv-author) minmax(0, 1fr);
  margin: 0px;
  gap: 18px;
  padding: 12px;
}

#pun .post-author {
  position: sticky;
  float: none;
  width: auto;
  margin: 0px;
  align-self: start;
  text-align: center;
  top: calc(var(--rv-nav-height) + 12px);
  max-height: calc(100dvh - var(--rv-nav-height) - 24px);
  overflow-y: auto;
  scrollbar-width: thin;
  padding: 12px;
  font-size: 11px;
}

#pun .post-author li {
  margin: 0px;
  list-style: none;
  flex: 0 0 100%;
  padding: 0px;
  line-height: 1.4;
}

#pun .post-author .pa-author {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px 6px;
  padding: 4px 0 0;
  overflow-wrap: anywhere;
  font: italic 500 24px/1.15 var(--rv-nick);
}

#pun .post-author .pa-title {
  margin: 0 0 8px;
  font: 400 10px/1.4 var(--rv-font);
  letter-spacing: 0.025em;
}

#pun .post-author .pa-avatar {
  padding: 0;
  margin: 0 0 8px;
}

#pun .post-author .pa-avatar img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  margin: auto;
}

#pun .post-author .pa-fld1 {
  padding: 6px 0px;
  margin: 0px 0px 4px;
}

#pun .post-author .rv-metric {
  display: flex;
  align-items: baseline;
  justify-content: center;
  padding: 0px;
  gap: 4px;
  font-size: 11px;
  line-height: 1.4;
}

#pun .post-author .rv-presence {
  display: inline-flex;
  margin: 0px;
  flex: 0 0 auto;
  animation: none;

&.is-online {
  animation: rv-online-pulse 3s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  animation: none;
}
}

#pun .post-body {
  float: none;
  min-width: 0px;
  margin: 0px;
  padding: 0px;
  min-height: 0px;
}

#pun :is(.quote-box:not(.spoiler-box), .code-box) {
  position: relative;
  margin: 12px 0;
  padding: 13px 16px;
}

#pun .quote-box:not(.spoiler-box) {
  padding-left: 40px;
}

#pun .quote-box:not(.spoiler-box)::before {
  content: "\f10d";
  position: absolute;
  left: 13px;
  top: 17px;
  font: 900 12px/1 var(--rv-icon-font);
  pointer-events: none;
}

#pun :where(.quote-box:not(.spoiler-box)) blockquote {
  margin: 0;
  padding: 0;
  font-size: inherit;
}

#pun :is(.quote-box:not(.spoiler-box) cite, .code-box strong) {
  display: block;
  font: 600 11px/1.5 var(--rv-font);
  margin-bottom: 7px;
}


#pun .code-box {
  padding-top: 39px;
}

#pun .post-sig {
  font-size: 11px;
  line-height: 1.5;
  text-align: center;
  position: relative;
  margin-top: 20px;
  padding-top: 14px;
}

#pun #pun-navlinks :is(.notify-bubble, #navpm .unreads, #notify-link .unreads) {
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 16px;
  height: 16px;
  padding: 0px 4px;
  letter-spacing: normal;
  vertical-align: middle;
  position: static !important;
  inset: auto !important;
  float: none !important;
  transform: none !important;
  display: inline-flex !important;
  margin: 0px 0px 0px 4px !important;
  font: 600 10px/1 var(--rv-font) !important;
}

#pun #pun-navlinks :is(#navpm, #notify-link) > a > span:not(.unreads):not(.notify-bubble) {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

#pun .post-author ul {
  margin: 0px;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  padding: 0px;
  gap: 3px 6px;
}

#pun .post-author :is(.pa-reg, .pa-registered) {
  order: 10;
}

#pun .post-author :is(.pa-invites, .pa-posts, .pa-respect, .pa-positive, .pa-reputation, .pa-awards) {
  flex: 0 0 auto;
  width: auto;
  padding: 2px 0px;
  font-size: 12px;
  justify-content: center;
  order: 11;
}

#pun .post-author .pa-time-visit {
  --rv-metric-icon: "\f017";
  order: 12;
}

#pun .post-author .pa-ip {
  --rv-metric-icon: "\f233";
  transition: opacity 0.18s;
  order: 13;
}

#pun .punbb > #pun-navlinks {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 0;
  z-index: 210;
  isolation: isolate;
}



@media (hover: none) and (prefers-reduced-motion: no-preference) {
  #pun .rv-crumb::after,
  #pun :is(.rv-forum-links, .podfl) a::after {
    animation: rv-touch-shine 14s var(--rv-ease) infinite;
  }
}

@media (hover: none) and (prefers-reduced-motion: no-preference) {
  #pun :is(.rv-forum-links, .podfl) a:nth-child(2)::after {
    animation-delay: 0.4s;
  }
}

@media (hover: none) and (prefers-reduced-motion: no-preference) {
  #pun :is(.rv-forum-links, .podfl) a:nth-child(3)::after {
    animation-delay: 0.8s;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  #pun *,
  #pun ::before,
  #pun ::after {
    animation: auto ease 0s 1 normal none running none !important;
    transition: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #pun tr:is(.inew, .inewclosed) .rv-forum-state::before,
  #pun .rv-presence,
  #pun #pun-title h1::before,
  #pun #pun-title h1 {
    animation: auto ease 0s 1 normal none running none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rv-fireflies {
    display: none;
  }
}

#pun_wrap {
  width: 100%;
  max-width: var(--rv-width);
  margin-inline: auto;
}

#pun {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  min-width: 0px;
  max-width: var(--rv-width);
  margin-inline: auto;
  font: 13px/1.6 var(--rv-font);
}

#pun #pun-title h1 :is(a, span) {
  font: inherit;
  letter-spacing: inherit;
}

#pun #pun-viewtopic #pun-main > h1 {
  text-transform: none;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0px 16px;
  padding: 0px;
  font: 500 16px/1.5 var(--rv-font);
  letter-spacing: 0.02em;
}

#pun #pun-viewtopic #pun-main > h1::before {
  content: "\f02d";
  flex: 0 0 auto;
  font: 900 12px/1 var(--rv-icon-font);
}

#pun #pun-navlinks #navpm .num_msg {
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  order: 1;
  letter-spacing: normal;
  vertical-align: middle;
  min-width: 11px;
  position: static !important;
  inset: auto !important;
  float: none !important;
  transform: none !important;
  display: inline-flex !important;
  height: 11px !important;
  padding: 0px 3px !important;
  margin: 0px 0px 0px 3px !important;
  font: 500 8px/1 var(--rv-font) !important;
}

#pun #pun-navlinks #navpm .num_msg::before,
#pun #pun-navlinks #navpm .num_msg::after {
  content: none !important;
  display: none !important;
}

#pun #pun-title h1 {
  isolation: isolate;
  display: block;
  text-transform: none;
  white-space: normal;
  overflow-wrap: anywhere;
  position: absolute;
  top: 50%;
  left: 0px;
  box-sizing: border-box;
  width: fit-content;
  max-width: calc(100% - 70px);
  margin: 0px;
  transform: translateY(-50%);
  padding: 0 var(--rv-brand-fade) 0 24px;
  font-family: var(--rv-brand-font);
  font-size: var(--rv-brand-size);
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  letter-spacing: 0px;
  overflow: visible;
  animation: none;
text-shadow: none;
}

#pun #pun-title h1::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  animation: auto ease 0s 1 normal none running none;
  inset: 50% 0px auto;
  height: var(--rv-brand-strip-height);
  transform: translateY(-50%);
}

#pun #pun-title h1::after {
  content: "\f2dc";
  display: inline-block;
  margin-left: 19px;
  font: 900 20px/1 var(--rv-icon-font);
  vertical-align: middle;
  color: var(--rv-brand-highlight);
  transform-origin: center;
  animation: rv-snow-turn 16s linear infinite;
  pointer-events: none;
position: relative;
top: -19px;
}

/* Снег и пар */

#pun-title > .rv-header-weather {
  position: absolute;
  inset: 0px;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.rv-header-weather__snow {
  position: absolute;
  inset: 0px;
  overflow: hidden;
  clip-path: polygon(0px 0px, 83% 0px, 83% 40%, 73% 40%, 73% 60%, 0px 80%);
}

.rv-header-weather__snow::before {
  content: "";
  position: absolute;
  inset: -100px -20px;
  animation: 18s linear 0s infinite normal none running rv-header-snow;
}

.rv-header-weather__steam {
  position: absolute;
  left: var(--rv-steam-left);
  top: var(--rv-steam-top);
  width: var(--rv-steam-width);
  height: var(--rv-steam-height);
  transform: translate(-50%, -100%);
}

.rv-header-weather__steam::before {
  content: "";
  position: absolute;
  inset: 0px;
  mask-image: var(--rv-steam-shape);
  mask-size: 100% 100%;
  mask-repeat: no-repeat;
  transform-origin: center bottom;
  animation: 7s ease-out 0s infinite normal none running rv-cup-steam;
}

.rv-header-weather__steam::after {
  content: "";
  position: absolute;
  mask-image: var(--rv-steam-shape);
  mask-size: 100% 100%;
  mask-repeat: no-repeat;
  transform-origin: center bottom;
  animation: 7s ease-out -3.5s infinite normal none running rv-cup-steam;
  inset: 12% 20% -5%;
}

#pun:has(#pun-admain) .rv-menu-dock {
  position: relative;
  top: auto;
  margin-bottom: 0px;
}

#pun:has(#pun-admain) #pun-navlinks {
  position: relative;
  inset: auto;
  transform: none;
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

#pun #pun-admain fieldset {
  position: relative;
  min-width: 0px;
  margin: 0px 0px 14px;
  padding: 14px 16px;
}

#pun #pun-admain fieldset > legend {
  position: static;
  float: left;
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0px 0px 10px;
  padding: 0px;
  transform: none;
  font: 600 13px/1.5 var(--rv-font);
  white-space: normal;
}

#pun #pun-admain fieldset > legend > span {
  padding: 0px;
  font: inherit;
}

#pun .rv-topic-row .rv-topic-icon {
  position: relative;
  display: inline-grid;
  place-items: center;
  float: left;
  width: 24px;
  height: 24px;
  margin: 0px 12px 0px 0px;
  font: 900 13px/1 var(--rv-icon-font);
}

#pun .rv-topic-row .rv-topic-icon::before {
  content: "\f15c";
}

#pun .rv-topic-row .rv-topic-icon[data-rv-kind="pinned"]::before {
  content: "\f08d";
}

#pun .rv-topic-row .rv-topic-icon[data-rv-kind="closed"]::before,
#pun .rv-topic-row .rv-topic-icon[data-rv-kind="pinned-closed"]::before {
  content: "\f023";
}

#pun .rv-topic-row .rv-topic-icon.is-unread::after {
  content: "\f2dc";
  position: absolute;
  right: -5px;
  top: -4px;
  font: 900 10px/1 var(--rv-icon-font);
  animation: 16s linear 0s infinite normal none running rv-snow-turn;
}

#pun .rv-topic-row .tclcon {
  min-height: 24px;
  min-width: 0px;
}

#pun .rv-list-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 16px;
  margin: 8px 0px 12px;
  padding: 0px;
  font: 500 12px/1.5 var(--rv-font);
}

#pun .rv-list-summary .rv-list-meta {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 5px;
  font: 400 10px/1.5 var(--rv-mono);
}

#pun .forum th {
  white-space: nowrap;
  overflow-wrap: normal;
  font-size: 10px;
}

/* Анимация */

@keyframes rv-snow-turn {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rv-firefly {
  0%,
  65%,
  100% {
    opacity: 0;
    transform: translate(0px, 0px);
  }

  78% {
    opacity: 0.5;
  }

  92% {
    opacity: 0;
    transform: translate(14px, -38px);
  }
}

@keyframes rv-touch-shine {
  0%,
  8% {
    opacity: 0;
    transform: translateX(-130%) skewX(-20deg);
  }

  10% {
    opacity: 0.8;
    transform: translateX(-130%) skewX(-20deg);
  }

  20% {
    opacity: 0.8;
    transform: translateX(130%) skewX(-20deg);
  }

  22%,
  100% {
    opacity: 0;
    transform: translateX(130%) skewX(-20deg);
  }
}

@keyframes rv-header-snow {
  0% {
    opacity: 0;
    transform: translate3d(-8px, -45px, 0px);
  }

  15%,
  85% {
    opacity: 0.95;
  }

  100% {
    opacity: 0;
    transform: translate3d(12px, 65px, 0px);
  }
}

@keyframes rv-cup-steam {
  0% {
    opacity: 0;
    transform: translate3d(0px, 8px, 0px) scale(0.45, 0.65) rotate(-8deg);
  }

  25% {
    opacity: 0.85;
  }

  60% {
    opacity: 0.55;
    transform: translate3d(8px, -18px, 0px) scale(0.8, 1.1) rotate(7deg);
  }

  100% {
    opacity: 0;
    transform: translate3d(-5px, -45px, 0px) scale(1.1, 1.3) rotate(-5deg);
  }
}

@keyframes rv-online-pulse {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: 0.5;
  }
}

/* Скрыть кнопку плюса рядом с уважением */
#pun .post-author .pa-respect a[href*="relation.php"][href*="v=1"] {
    display: none !important;
}

#pun .post-box:has(> .post-rating) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 6px;
}

#pun .post-box > .post-content {
  flex: 0 0 100%;
  min-width: 0;
}

#pun .post-box > .post-rating {
  margin-left: auto;
}

#pun .post-box > :is(.post-rating, .post-vote) {
  position: static;
  float: none;
  clear: none;
  flex: 0 0 auto;
  width: auto;
  margin-top: 12px;
  margin-bottom: 0;
  padding: 0;
}

#pun :is(.post-rating, .post-vote) > .container {
  display: flex;
  align-items: center;
  gap: 6px;
  width: auto;
  margin: 0;
  padding: 0;
}

#pun .post-rating :is(p, span, a) {
  float: none;
  margin: 0;
}

#pun :is(.post-rating, .post-vote) a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  padding: 3px 8px;
  box-sizing: border-box;
  font: 500 12px/1 var(--rv-font);
  text-decoration: none;
  transition: background-color 0.2s, color 0.2s;
}

#pun .rv-forum-state::after {
  content: "\f2dc";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(calc(-50% - 13px), calc(-50% - 15px)) rotate(15deg);
  font: 900 30px/1 var(--rv-icon-font);
  pointer-events: none;
  z-index: 0;
}

#pun #button-image-bbcode {
  --rv-button-icon: "\f03e";
}

#pun #form-buttons #button-graffiti_rusff {
  display: none !important;
}

#pun #form-buttons #button-image-bbcode::after {
  content: "2";
  position: absolute;
  right: 3px;
  bottom: 2px;
  z-index: 2;
  font: 600 8px/1 var(--rv-font);
  pointer-events: none;
}

/* Дополнительные шрифты редактора */
#pun #font-area .rv-font-option {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 7px 12px;
  border: 0;
  text-align: left;
  font-size: 17px;
  line-height: 1.4;
  cursor: pointer;
}

#pun #font-area {
  max-height: 320px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

#pun .rv-text-indent {
  display: inline-block;
  width: 2.1em;
}

#pun .rv-design-credit {
  position: absolute;
  right: 16px;
  bottom: calc(50% - 44px);
  display: flex;
  padding: 0;
  z-index: 1;
}

#pun .rv-design-credit a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 20px;
  font: 400 10px/1.4 var(--rv-font);
  text-decoration: none;
  transition: color 200ms ease, background-color 200ms ease;
}

#pun .rv-design-credit span {
  font-weight: 600;
}

#pun .rv-banners {
  position: absolute;
  left: 16px;
  right: 140px;
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  grid-template-columns: repeat(auto-fit, 88px);
  grid-auto-rows: 31px;
  justify-content: center;
  align-content: start;
  gap: 8px;
  height: 88px;
  padding: 8px;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-gutter: stable both-edges;
  scrollbar-width: thin;
  border-radius: 12px;
}

#pun .rv-banners a {
  display: block;
  flex: 0 0 88px;
  width: 88px;
  height: 31px;
  border-radius: 4px;
  overflow: hidden;
transition:
  opacity 300ms var(--rv-ease),
  filter 300ms var(--rv-ease);
}

#pun .rv-banners img {
  display: block;
  width: 88px;
  height: 31px;
  object-fit: contain;
}

#pun #formkey {
  display: none;
}

0

5

ЗИМНИЙ ВЕЧЕР · ПРОВЕРКА ОФОРМЛЕНИЯ

Обычный текст сообщения. За окном медленно опускался снег. Он ложился на подоконник, цеплялся за тёмные ветви и исчезал в свете фонаря. В комнате пахло кофе и бумагой; здесь никто никуда не торопился.

Жирное начертание
Курсивное начертание
Подчёркнутый текст
Зачёркнутый текст
Жирный курсив

Обычный текст с выделенным фрагментом, продолжение предложения с курсивом и возвращение к стандартному начертанию.

1. РАЗМЕРЫ И ШРИФТЫ

Небольшая подпись: снег за окном, кофе на столе.
Основной размер: текст должен читаться свободно.
Крупный акцент: первый снег.

Рукописная заметка: «Останься ещё немного. На улице совсем зима».

Письмо, оставленное на подоконнике

ПЕРВЫЙ СНЕГ. ТИХИЙ ДОМ. ТЁПЛЫЙ СВЕТ.

Неровные строки в блокноте: купить кофе, забрать письма, не забыть перчатки.

Более собранный шрифт: заметки, даты, короткие пояснения.

Проверка кириллицы: Съешь ещё этих мягких французских булок, да выпей чаю. 0123456789.

После всех вставок снова должен отображаться стандартный шрифт сообщения.

2. ВЫРАВНИВАНИЕ И АБЗАЦ

Этот текст выровнен по левому краю.

Этот текст расположен по центру.
Вторая строка тоже должна оставаться по центру.

Этот текст выровнен по правому краю.
Подпись: хранитель зимних историй.

Этот абзац проверяет выравнивание по ширине. Когда за окном темнеет, знакомые вещи становятся немного другими: чашка отбрасывает длинную тень, стекло отражает комнату, а пустая улица кажется продолжением старой фотографии. Между словами не должно быть случайных разрывов, текст не должен выходить за пределы сообщения или перекрывать соседний блок автора.

[indent]Этот абзац начинается с пользовательского отступа. Проверь его после публикации: в начале строки должен появиться отступ вместо буквального тега.

3. ЦВЕТ И ССЫЛКИ

Нейтральный серый текст.
Приглушённый розово-серый акцент.
Небольшой тёплый акцент.

Ссылка на главную страницу форума

Обычное предложение со ссылкой внутри текста. Наведение не должно менять размеры строки.

4. ЦИТАТЫ

Простая цитата без указания автора.

Вторая строка внутри цитаты. Проверь фон, отступы, значок кавычек и расстояние до следующего блока.

Хранитель зимы написал(а):

Именная цитата: рядом с именем должно быть «пишет».

Гость написал(а):

Это цитата внутри цитаты. Она должна оставаться читаемой и отличаться от внешнего блока мягким оформлением.

Продолжение внешней цитаты после вложенной.

Выделение жирным и курсив внутри цитаты.

Обычный текст после цитат. Его отступ и размер не должны измениться.

5. КОД И КОПИРОВАНИЕ

Код:
function winterEvening(name) {
  const message = "Добрый вечер, " + name + "!";
  return message;
}

winterEvening("Гость");

Проверь кнопку «Скопировать код». При вставке в блокнот должны сохраниться переносы строк и отступы.

Код:
Это проверка буквального текста внутри кода:
[b]не должно становиться жирным[/b]
[i]не должно становиться курсивом[/i]
[indent]не должен превращаться в отступ[/indent]
обычный дефис - должен остаться дефисом
символы: < > & " ' { } ( )

6. СПОЙЛЕР

Открыть зимнюю записку

Внутри спойлера спрятана небольшая записка.

Первое правило: налить что-нибудь тёплое.
Второе правило: оставить спешку за дверью.

Иногда лучший план на вечер — никуда не уходить.

Последняя строка спойлера.

После открытия и закрытия спойлера сообщение должно сохранять правильную ширину.

7. ДЛИННЫЙ ТЕКСТ — ПРОВЕРКА ПРОКРУТКИ И БЛОКА АВТОРА

К вечеру город почти перестал звучать. Редкие машины проезжали по мокрой дороге, оставляя за собой короткий шелест, и снова становилось тихо. Снег ещё не успел укрыть землю целиком: он собирался небольшими островками у оград, на ступенях и под деревьями. Издалека казалось, будто кто-то осторожно рассыпал муку по тёмной поверхности стола.

В кофейне оставались всего несколько посетителей. У окна сидела женщина с раскрытой книгой, но уже давно не переворачивала страницы. Молодой человек возле двери писал что-то в телефоне, время от времени поднимая голову на улицу. За стойкой негромко звякали чашки. Эти звуки не нарушали тишину, а делали её обжитой, как потрескивание дерева в старом доме.

Он выбрал столик в углу и положил перчатки рядом с блюдцем. На ткани быстро растаяли несколько снежинок. Обычно в это время он уже возвращался домой, проверял почту и составлял список дел на завтра. Сегодня список остался пустым. Это казалось странным, почти непривычным удовольствием: не искать следующую задачу, не торопить вечер, не смотреть каждые пять минут на часы.

За стеклом остановился прохожий. Он поправил шарф, посмотрел на вывеску и улыбнулся чему-то своему. На секунду их взгляды встретились, но в этом не было ни вопроса, ни приглашения. Просто два человека одновременно заметили, что начался снег. Иногда такого маленького совпадения достаточно, чтобы день перестал казаться совершенно обыкновенным.

Кофе принесли в тяжёлой светлой чашке. Над поверхностью поднимался пар, изгибался и растворялся прежде, чем достигал лампы. Он обхватил чашку ладонями и только тогда понял, насколько замёрз. Тепло возвращалось постепенно, от кончиков пальцев к запястьям. На столе лежала салфетка с неровно отпечатанным рисунком ветки; один лист оказался смазан, словно его тоже коснулась вода.

В кармане нашлась старая записка. Несколько слов, адрес и дата, которую он давно собирался вычеркнуть. Бумага стала мягкой на сгибах. Он развернул её, прочитал и неожиданно вспомнил не само событие, а запах лестницы, по которой тогда поднимался: влажная шерсть, краска и чья-то домашняя выпечка. Память иногда выбирает странные вещи, чтобы сохранить целый день.

Женщина у окна наконец перевернула страницу. Молодой человек убрал телефон и попросил ещё чай. Дверь открылась, впуская прохладный воздух и человека в длинном пальто. Тот долго стряхивал снег с плеч, извинялся за мокрые следы и смеялся, когда бариста указал на такой же мокрый пол возле стойки. Никто не выглядел особенно счастливым, но всем, кажется, было достаточно хорошо.

Он достал блокнот и написал первую строку. Потом зачеркнул её, подумал и написал другую. Это не было ни письмом, ни планом, ни началом большого рассказа. Просто несколько наблюдений, которые хотелось удержать: свет на краю чашки, тень от стула, медленное движение снега за окном. Слова появлялись без усилия, будто давно ждали спокойного места.

Когда кофе закончился, уходить всё ещё не хотелось. Он заказал стакан воды и остался ещё на несколько минут. Улица постепенно светлела от снега, хотя небо становилось темнее. Машины теперь двигались осторожнее. На противоположной стороне дороги кто-то пытался сфотографировать фонарь, подняв телефон над головой, и каждый раз опускал его, недовольный результатом.

Дом встретил его привычной тишиной. Он оставил обувь у двери, включил маленькую лампу и подошёл к окну. С высоты снег выглядел совсем иначе: не отдельными хлопьями, а медленным движением воздуха. В соседнем доме зажигались окна. В каждом происходило что-то своё, невидимое с улицы: готовился ужин, заканчивался разговор, начиналась книга.

Он положил записку между страницами блокнота. Завтра можно будет решить, что с ней делать. Сегодня хотелось сохранить именно этот вечер — без вывода, без обещаний и без обязательного продолжения. Чашку он вымыл сразу, а перчатки оставил сушиться возле двери. На подоконнике лежала тонкая полоска снега, случайно попавшего внутрь, когда он открывал окно.

Перед сном он ещё раз посмотрел на улицу. Следы возле подъезда уже почти исчезли. Фонарь освещал пустую скамейку, ветви и небольшой участок дороги. Всё остальное растворялось в темноте. Он выключил лампу и подумал, что иногда день заканчивается именно так, как нужно: тихо, без торопливой последней мысли.

— Конец проверочного сообщения —

0


Вы здесь » test for test » Тестовый форум » коды и оформление.


Рейтинг форумов | Создать форум бесплатно