/* === External imports ===================================================== */
/* Подключаем дополнительные CSS-файлы и иконки.
   Важно: порядок имеет значение — сначала локальные стили модуля, затем шрифты/иконки. */

@import url(style_cs.1762157807.css); /* вспомогательный модуль: кнопки, нав-навигация */
@import url(https://forumstatic.ru/files/001a/28/10/55678.css); /* кастомный шрифт (бланш) */
@import url('https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,400,0,0');
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&display=swap');


/* === Local @font-face ===================================================== */
/* Подключаем пользовательский шрифт "Marlino" со всеми форматами для кросс-браузерности.
   font-display: swap — чтобы текст показывался системным шрифтом, пока не загрузится "Marlino". */
@font-face {
  font-family: 'Marlino Regular Personal Use';
  src: url('https://forumstatic.ru/files/001c/43/fc/54674.eot');
  src:
    local('Marlino Regular Personal U'),
    local('MarlinoRegularPersonalUse'),
    url('https://forumstatic.ru/files/001c/43/fc/54674.eot?#iefix') format('embedded-opentype'),
    url('https://forumstatic.ru/files/001c/43/fc/47695.woff2') format('woff2'),
    url('https://forumstatic.ru/files/001c/43/fc/56850.woff') format('woff'),
    url('https://forumstatic.ru/files/001c/43/fc/84814.ttf') format('truetype'),
    url('https://forumstatic.ru/files/001c/43/fc/60952.svg#MarlinoRegularPersonalUse') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   ACCESSIBILITY & UTILITIES
   Блок вспомогательных стилей: доступность, скрытие служебных заголовков,
   утилиты типа "clearfix". Эти вещи не меняют дизайн, но улучшают поведение.
   ========================================================================== */



/* Скрытие несемантических заголовков/служебных штук
   Приём: выносим элемент далеко за пределы экрана, при этом он остаётся в DOM
   (читабелен скринридерами, но не мешает визуально). */
.acchide,
#pun-index #pun-main h1,
#pun-navlinks h2,
#pun-pagelinks h2,
#pun-status h2,
#pun-ulinks h2,
.punbb .forum h2,
.punbb .multipage .topic h2,
.punbb dl.post-sig dt span,
.punbb p.crumbs strong,
.punbb .divider hr,
.punbb .required label em,
.punbb .formsubmit label,
.punbb .submitfield label,
.punbb .modmenu label,
#pun-userlist .main h2 {
  position: absolute;
  left: -9999px;
  width: 0;
  height: 0;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}

/* второе меню (admin override) */
.punbb-admin #pun-ulinks {
  position: static !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 5px 10px !important;
  text-align: left !important;
  background: none !important;
  color: #0b3d2e !important; /* ← базовый тёмно-зелёный */
}

.punbb-admin #pun-ulinks ul {
  display: block !important;
  gap: 0 !important;
}

.punbb-admin #pun-ulinks li {
  display: inline-block !important;
  margin-right: 8px !important;
}

/* ссылки внутри — зелёные + подсветка при наведении */
.punbb-admin #pun-ulinks a {
  color: #0b3d2e !important; /* тёмно-зелёный */
  text-decoration: none;
  transition: color 0.25s ease;
}

.punbb-admin #pun-ulinks a:hover {
  color: #176d53 !important; /* светлее при наведении */
}


/* clearfix-хелперы
   Когда внутри контейнера используются float/inline-block, этот "хвост" чистит поток,
   чтобы родитель корректно обтекал содержимое. */
#pun:after,
.punbb .container:after,
.punbb .post-links ul:after,
.punbb .main div.inline:after,
.punbb .post-box:after,
.punbb .linksb:after {
  content: "";
  display: block;
  clear: both;
}

/* ==========================================================================
   DESIGN TOKENS (CSS Variables)
   - Новые имена = основные. Старые оставлены как алиасы, указывают на новые.
   - Переменные дают единый источник правды для цветов/отступов/типографики.
   ========================================================================== */
:root {
  /* === базовые слои === */
  --color-bg: #0c0f0e;         /* общий фон: почти чёрный, с зелёно-серым подтоном */
  --color-surface: #141817;    /* контейнеры (посты, форма ответа) */
  --color-surface-2: #1a1f1d;  /* вторичные области */

  /* === текст и контраст === */
  --color-text: #e6e9e7;       /* основной текст — холодный белый */
  --color-subtext: #9ca39f;    /* подписи и второстепенные */
  --color-line: rgba(255,255,255,0.08);

  /* === акценты (строго в одной гамме) === */
  --color-brand: #aab9b0;      /* ссылки, акценты в интерфейсе */
  --color-brand-strong: #cfd9d2; /* hover — мягкое свечение, не белое */
  --color-accent: #70847a;     /* редкие элементы (кнопки, рамки) — глухой зелено-серый */
  --color-accent-soft: #5f7269;

  /* === поля форм (читаемость и фокус) === */
  --field-bg: #101412;          /* фон textarea / input */
  --field-text: #e7ece9;        /* основной текст */
  --field-placeholder: #7c8581; /* текст-заглушка */
  --field-border: #2b3230;      /* рамка */
  --focus: #8fa39a;             /* цвет рамки при фокусе */
  --focus-ring: rgba(143,163,154,0.25); /* мягкое свечение */
 --accent-green: rgba(92,132,92,0.4);
  --text-primary: rgba(225,225,225,0.9);
  --text-secondary: rgba(160,180,160,0.5);
}


  /* Типографика */
  --font-sans: "Space Grotesk", sans-serif; /* был: --font-family — базовый гротеск */
  --font-display: "Marlino Regular Personal Use", sans-serif; /* был: --second-family — акцентные заголовки */
  --font-icon: 'Material Icons Outlined'; /* был: --iconsfont — шрифт-иконки */

  /* Размеры/отступы */
  --layout-sidebar-width: 224px;  /* был: --pwidth — ширина сайдбара автора поста */
  --space-lg: 10px 40px;          /* был: --pad1 — крупные внутренние отступы */
  --space-md: 5px 20px;           /* был: --pad2 — средние отступы */
  --space-sm: 5px 10px;           /* был: --pad3 — малые отступы */

  /* ===== Алиасы (для совместимости с уже существующей вёрсткой): */
  --body-bg: var(--color-accent);
  --pun-bg: var(--color-surface);
  --sec-bg: var(--color-surface-2);
  --link: var(--color-brand);
  --link-hover: var(--color-brand-strong);
  --textcolor: var(--color-text);
  --font-family: var(--font-sans);
  --second-family: var(--font-display);
  --iconsfont: var(--font-icon);
  --pwidth: var(--layout-sidebar-width);
  --pad1: var(--space-lg);
  --pad2: var(--space-md);
  --pad3: var(--space-sm);
}

/* Темы (rose / blue) — только переопределения палитры.
   Применяются через класс на корневом элементе: <body class="blue"> и т.п. */
.rose {
  --color-accent: #BCBCE2;
  --color-surface: #FFFCF5;
  --color-surface-2: #F9F5EC;
  --color-brand: #89515A;
  --color-brand-strong: #711624;
}
.blue {
  --color-accent: #C3A6A6;
  --color-surface: #D8D6D3;
  --color-surface-2: #E8E8E8;
  --color-brand: #506B76;
  --color-brand-strong: #2E4752;
}

/* ==========================================================================
   GLOBAL RESETS & BASICS
   Базовые сбросы, единый стиль ссылок, выделения, скроллбаров и пр.
   ========================================================================== */

html, body {
  overflow-x: hidden;
}

* {
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-width: thin; /* тонкие полосы прокрутки (Firefox) */
  scrollbar-color: var(--color-brand-strong) var(--color-surface-2); /* цвет ползунка/трека */
}

/* WebKit scrollbars — оформление полос прокрутки в Chrome/Safari/Edge */
*::-webkit-scrollbar { width: 7px; height: 7px; }
*::-webkit-scrollbar-track { background-color: var(--color-surface-2); }
*::-webkit-scrollbar-thumb { background-color: var(--color-brand); }
*::-webkit-scrollbar-thumb:active { background: var(--color-brand-strong); }

/* Selection — цвета при выделении текста мышью */
::selection { background: var(--color-brand); color: var(--color-surface); }

/* === Скрытие кнопок "ответить" вверху и внизу темы ========================= */
a[href*="post.php?tid="],
a[href*="post.php?action=post"] {
  display: none !important;
  visibility: hidden !important;
}

#pun-index .crumbs.container {
  display: none !important;
}

/* — скрываем строку или блок с текстом "Фон" во всех типах профилей — */
#profile *:is(td, th, dt, dd, div, span, li, label, strong, b):has(:is(:contains("Фон"), :contains("фон"))) {
  display: none !important;
}

/* — на случай, если движок не поддерживает :has или :contains — */
#profile td, #profile th, #profile dt, #profile dd, #profile div {
  /* скроет целую строку, если в ней есть это слово */
}

/* === Полное скрытие кнопки реакций (Reaction Picker) === */
button.reaction-picker-button.reaction-chip {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* скрываем кнопку "пожаловаться" под постами */
li.pl-reports {
  display: none !important;
  visibility: hidden !important;
}

/* Делет — декоративный эффект "размытого" зачёркнутого текста */
del {
  opacity: 0.7;
  filter: blur(2px);
  text-decoration: none;
  transition: .3s linear;
}
del:hover { opacity: 1; filter: none; }

/* Горизонтальные линии в посте — пунктиром, чтобы не перетягивали внимание */
.post-content hr { border: 1px dashed var(--color-accent); }

/* Отключаем стандартный outline у фокуса (т.к. дизайн управляет сам) */
:focus { outline: none; }

/* Ссылки: базовый цвет и плавное наведение */
a, .punbb #pun-admain a {
  color: var(--color-brand);
  text-decoration: none;
  transition: .2s linear;
}
a:hover, .punbb #pun-admain a:hover { color: var(--color-brand-strong); }

/* Заголовки/блочные — убираем внешние отступы, центруем основные h1/h2 */
h1, h2, h3, h4, h5, h6, p, blockquote, pre { margin: 0; }
h1, h2 { padding: 10px 20px; font-weight: 400; text-align: center; }

/* Табличные/списки — сбрасываем стандартные маркеры */
ul, dl, li, dd, dt { list-style: none; }
address, em { font-style: normal; }

/* Отключения лишнего UI — скрываем малоиспользуемые служебные блоки */
.modlist, .lastedit, .punbb div#pun-live-rusff, .punbb .topic a.sharelink { display: none; }

/* Модальные/всплывающие окна — приводим к единой подложке */
#tags .container,
.post_report,
.post_reputation,
#MyBookmarks,
.inner.popup_graffiti,
.pun-modal .modal-inner,
.punbb-admin #pun-admin-award-form .inner {
  background: var(--color-surface-2);
}

/* ==========================================================================
   FORMS
   Оформление форм, кнопок, инпутов, селектов и служебных полей.
   ========================================================================== */

/* Площадка предпросмотра шрифтов/иконок (кастомный блок) */
#font-area {
  height: 220px;
  width: 680px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  font-size: 10px;
  padding: 15px !important;
  max-height: 144px; /* защита от разрастания: включится прокрутка */
  overflow: auto;
}

/* Кнопки форума — единый стиль для разных контекстов */
input.button,
#pun-admain input.button,
#sub4,
input[type="button"],
input[type="submit"] {
  cursor: pointer;
  background: var(--color-accent);
  border: 1px solid var(--color-accent);
  border-radius: 9px;
  padding: 7px 10px;
  font: 12px var(--font-sans);
  text-transform: lowercase;
  color: var(--color-text);
  transition: .2s linear;
}

/* Селект модерации — маленький, чтобы не ломал шапки таблиц */
select#mod-options {
  font-family: var(--font-sans);
  font-size: 10px;
  background: var(--color-accent);
}

/* === форма ответа === */
textarea, input[type="text"], input[type="password"], select {
  background: var(--field-bg);
  color: var(--field-text);
  border: 1px solid var(--field-border);
  border-radius: 6px;
  font: 14px/1.4 var(--font-sans);
  padding: 8px;
}

textarea::placeholder,
input::placeholder {
  color: var(--field-placeholder);
}

textarea:focus,
input:focus,
select:focus {
  border-color: var(--focus);
  box-shadow: 0 0 0 2px var(--focus-ring);
  outline: none;
}


/* Чекбоксы/радио — выравниваем элементы по вертикали для аккуратности */
.checkfield input[type="checkbox"],
.radiofield input[type="radio"] { margin: 0 3px; }
p.checkfield *, div.checkfield *, fieldset.radiofield * { height: 20px; vertical-align: middle; }

/* Формы (контейнеры) — отступы и кнопки отправки */
.formal .container { padding: var(--space-lg); }
.formsubmit { margin-top: 10px; text-align: center; }
.formsubmit input, .formsubmit a, .formsubmit span {
  margin-right: 6px;
  background: var(--color-accent);
  border: 1px solid var(--color-accent);
  border-radius: 9px;
  padding: 7px 10px;
  font: 12px var(--font-sans);
  text-transform: lowercase;
  color: var(--color-text);
}
fieldset { border: 0; }
fieldset legend { font-weight: 700; margin-bottom: 10px; }
fieldset legend span {
  font-family: var(--font-sans);
  font-style: italic;
  border: 1px solid var(--color-accent);
  padding: 1px 6px;
  border-radius: 10px;
  background: var(--color-accent);
}
fieldset fieldset { margin: 0; padding: 0 0 8px 0; border: 0; }

/* Поле "страницы" (plng) — делает блок визуально отделённым */
#plng {
  border: 1px solid var(--color-accent)!important;
  padding: 5px 5px 5px 8px !important;
  margin: 0 20px 0 5px!important;
  border-radius: 10px;
}

/* Стандартная сетка классов форм от PunBB */
.fs-box { padding: 5px 0; }
.fs-box p, .fs-box fieldset { padding: 0 0 8px 0; }
.inline .inputfield, .inline .selectfield, .inline .passfield { float: left; margin-right: 10px; }
.inline .infofield { clear: both; }
.datafield br { display: none; } /* убираем лишние переносы */
.required label, .datafield span.input { font-size: 10px; }
textarea, .longinput input { width: 64%; margin: 0; }
.hashelp { position: relative; } /* подсказки-иконки могут позиционироваться относительно поля */

/* ==========================================================================
   ADMIN
   Небольшие исправления для административной части (контуры, рамки).
   ========================================================================== */
.punbb-admin .adcontainer, .punbb-admin .adformal { border: 0; }

/* === ADMIN PANEL минимализм ========================== */
html.punbb-admin,
body.punbb-admin {
  background: #f0f2f1 !important;
  color: #111 !important;
  filter: none !important;
}

/* Текст всех элементов */
.punbb-admin *,
.punbb-admin input,
.punbb-admin select,
.punbb-admin textarea,
.punbb-admin option {
  color: #111 !important;
  background-color: transparent;
  text-shadow: none !important;
}

/* Блоки, контейнеры, таблицы */
.punbb-admin table,
.punbb-admin .box,
.punbb-admin .main,
.punbb-admin .adcontainer,
.punbb-admin .adformal,
.punbb-admin .container {
  background: #ffffff !important;
  color: #111 !important;
  border: 1px solid #ccc !important;
  box-shadow: none !important;
}

/* Поля ввода */
.punbb-admin input[type="text"],
.punbb-admin input[type="password"],
.punbb-admin textarea,
.punbb-admin select {
  background: #ffffff !important;
  color: #111 !important;
  border: 1px solid #bbb !important;
  border-radius: 5px !important;
}


/* ==========================================================================
   LAYOUT / BODY
   Фон страницы, общий контейнер форума, базовая типографика.
   ========================================================================== */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    #1a1a1a
    url("https://www.transparenttextures.com/patterns/asfalt-light.png")
    repeat center center;
  background-size: auto;
  opacity: 1;
}

#pun {
  width: 950px;
  margin: 30px auto;
  background: var(--color-surface);
  color: var(--color-text);
  text-transform: lowercase;
}



/* Базовая типографика внутри punbb — старый добрый Arial/Verdana */
.punbb { font: 12px Arial, Verdana, sans-serif; }

/* Общие внутренние отступы для стандартных контейнеров PunBB */
.punbb > div .container { padding: var(--space-lg); }

/* ==========================================================================
   TOP NAV / USER LINKS / STATUS / BREADCRUMBS
   Верхняя навигация форума: меню, пользовательские ссылки, статус, хлебные крошки.
   ========================================================================== */
/* === ВЕРХНЕЕ МЕНЮ (фиксированное, горизонтальное) ===================== */
#pun-navlinks {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 54px;
  z-index: 10000;

  display: flex;
  justify-content: center;
  align-items: center;

  font-family: var(--font-sans);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  font-size: 11px;

  /* фон с зерном */
  background:
    rgba(10, 20, 15, 0.92)
url("https://forumstatic.ru/files/001c/93/33/46552.png")
    repeat center center;
  background-size: 250px 250px;

  border-bottom: 1px solid rgba(255,255,255,0.05);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  backdrop-filter: blur(6px) contrast(110%);
}

/* Сбрасываем стандартные контейнеры, чтобы не ломали флекс */
#pun-navlinks .container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
  margin: 0;
  padding: 0;
}

/* Сам список — горизонтальный флекс, без переносов */
#pun-navlinks ul {
  display: flex !important;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 36px; /* расстояние между пунктами */
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Элементы списка */
#pun-navlinks li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
}

/* Ссылки */
#pun-navlinks a {
  color: #d5d9d5;
  text-decoration: none;
  text-shadow: 0 0 3px rgba(220,240,220,0.08);
  transition: color 0.25s ease, text-shadow 0.3s ease, transform 0.2s ease;
  white-space: nowrap; /* чтобы текст не переносился */
}

/* Hover */
#pun-navlinks a:hover {
  color: #9fd3b0;
  text-shadow: 0 0 6px rgba(159,211,176,0.3);
  transform: translateY(-1px);
}

/* Активная ссылка */
#pun-navlinks .is-active a {
  color: #b8e3c2;
  text-shadow: 0 0 6px rgba(184,227,194,0.4);
}

/* Отступ под фиксированным меню */
body { padding-top: 60px; }

/* === ТЕКСТ В ЦЕНТРЕ ШАПКИ =================================== */
.header-title {
  position: absolute;
  top: 50%;               /* по вертикали по центру */
  left: 50%;              /* по горизонтали по центру */
  transform: translate(-50%, -50%); /* идеальное центрирование */

  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 90px;
  letter-spacing: 6px;
  color: #e9f5ed;             /* основной текст */
  text-transform: uppercase;
  z-index: 10;

  text-shadow:
    0 0 8px rgba(233,245,237,0.6),
    0 0 18px rgba(233,245,237,0.4),
    0 0 36px rgba(233,245,237,0.3);
}

.header-title::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  color: #e9f5ed;
  filter: blur(12px);
  opacity: 0.85;
  z-index: -1;
}


/* === НАВИГАЦИЯ ПОД ШАПКОЙ ====== */
#pun-ulinks {
  position: absolute;
  top: 390px;                   /* &#8592; регулируй высоту вручную */
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;

  width: 100%; /* вместо 100vw */
  box-sizing: border-box;
  text-align: center;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 12px;
  font-weight: 500;
  text-transform: lowercase;
  letter-spacing: 0.6px;
  color: #e9f5ed;
  text-shadow: 0 0 6px rgba(233,245,237,0.25);
}

/* ключ: именно список должен быть flex */
#pun-ulinks ul {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 20px;                    /* &#8592; увеличивает расстояние между пунктами */
  flex-wrap: nowrap;
  margin: 0;
  padding: 0;
  list-style: none;
  white-space: nowrap;
}

#pun-ulinks li {
  display: inline-flex;
  align-items: center;
}

#pun-ulinks a {
  color: #e9f5ed;
  text-decoration: none;
  position: relative;
  transition: all 0.25s ease;
  padding: 2px 0;
}

#pun-ulinks a:hover {
  color: #fff;
  text-shadow: 0 0 8px rgba(233,245,237,0.8);
}

#pun-ulinks a::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 0;
  height: 1px;
  background: rgba(233,245,237,0.7);
  transition: width 0.3s ease;
}

#pun-ulinks a:hover::after {
  width: 100%;
}

/* === ТЭГИ В ШАПКЕ (в линию, с мягкой подсветкой) ==================== */
.head-tags {
  position: absolute;
  bottom: -100px;                 /* &#8593; регулируй — высота от низа шапки */
  transform: translateX(80%); /* &#8592; чем меньше число, тем правее */
  left: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;                    /* расстояние между тэгами */
  z-index: 5;
}

.head-tags a {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #e9f5ed;
  text-decoration: none;
  padding: 6px 12px;
  border: 1px solid rgba(233,245,237,0.3);
  border-radius: 12px;
  background: rgba(10,20,10,0.55);
  backdrop-filter: blur(3px);
  transition: all 0.25s ease;
  box-shadow: 0 0 6px rgba(0,0,0,0.4);
}

.head-tags a:hover {
  color: #fff;
  border-color: rgba(233,245,237,0.8);
  background: rgba(50,80,60,0.7);
  box-shadow:
    0 0 10px rgba(233,245,237,0.2),
    inset 0 0 10px rgba(233,245,237,0.15);
  transform: translateY(-2px);
}



/* Строка статуса (кто вы вошли/время и т.д.) */
#pun-status { font-family: var(--font-sans); text-transform: lowercase; font-size: 10px; }
#pun-status span { white-space: nowrap; margin-right: 5px; }

/* Хлебные крошки — мелкий текст по центру */
.crumbs.container {
  font-family: var(--font-sans);
  font-size: 10px;
  text-align: center;
  text-transform: lowercase;
}


/* === Пагинация: "страница: 1" — слева, в стиле форума ================== */

/* Контейнер пагинации (учтены оба варианта классов) */
#pun-viewtopic .pagelink,
#pun-viewtopic .pagelinks,
.punbb .pagelink,
.punbb .pagelinks {
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important; /* &#8592; слева */
  gap: 10px;

  /* позиционирование */
  margin: 8px 0 16px !important;
  padding: 4px 12px 5px;

  /* визуальный стиль под шапку */
  background: rgba(15,20,15,0.45);
  border-radius: 10px;
  backdrop-filter: blur(6px);
  box-shadow: 0 0 8px rgba(0,0,0,0.25);

  font-family: var(--font-sans);
  font-size: 11px;
  text-transform: lowercase;
  letter-spacing: 0.4px;
  color: rgba(233,245,237,0.85);
  width: fit-content;
}

/* ссылки-страницы */
#pun-viewtopic .pagelink a,
#pun-viewtopic .pagelinks a,
.punbb .pagelink a,
.punbb .pagelinks a {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 6px;
  text-decoration: none;
  color: rgba(233,245,237,0.85);
  transition: all .2s ease;
}

/* hover */
#pun-viewtopic .pagelink a:hover,
#pun-viewtopic .pagelinks a:hover,
.punbb .pagelink a:hover,
.punbb .pagelinks a:hover {
  color: #fff;
  background: rgba(255,255,255,0.08);
  box-shadow: 0 0 5px rgba(255,255,255,0.10);
}

/* текущая страница (обычно это <strong>) */
#pun-viewtopic .pagelink strong,
#pun-viewtopic .pagelinks strong,
.punbb .pagelink strong,
.punbb .pagelinks strong {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 6px;
  background: rgba(255,255,255,0.15);
  color: #fff;
  box-shadow: 0 0 6px rgba(0,0,0,0.25);
}

/* аккуратный заголовок "страница:" (если он выводится как отдельный <span>/<em>) */
#pun-viewtopic .pagelink span,
#pun-viewtopic .pagelinks span,
.punbb .pagelink span,
.punbb .pagelinks span {
  opacity: .9;
}

/* если движок центрует через .linksb/.linkst — принудительно слева */
#pun-viewtopic .linkst .pagelink,
#pun-viewtopic .linkst .pagelinks,
#pun-viewtopic .linksb .pagelink,
#pun-viewtopic .linksb .pagelinks {
  margin-left: 0 !important;
  justify-content: flex-start !important;
}


/* === Шапка темы =================================================== */

#pun-viewtopic .topic-header {
  position: relative;
  margin-top: -2px;      /* чуть “подтягивает” тему вверх */
  padding-top: 0;        /* убирает внутренние зазоры */
  width: 950px;
  height: 145px;
  margin: 0 auto 3px;
  border-radius: 12px;
  overflow: visible;
  background: url(https://forumstatic.ru/files/001c/93/33/33434.jpg)
              center top / 100% auto no-repeat;
  background-color: transparent;
}

/* хлебные крошки с блюр-подложкой */
#pun-viewtopic .topic-header .crumbs.container {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;

  font-family: var(--font-sans);
  font-size: 11px;
  text-transform: lowercase;
  color: rgba(255,255,255,0.9);
  text-align: center;
  margin: 0;
  padding: 4px 14px;

  background: rgba(15, 20, 15, 0.45);
  border-radius: 8px;
  backdrop-filter: blur(8px);
  box-shadow: 0 0 6px rgba(0,0,0,0.25);
}

/* ссылки в крошках */
#pun-viewtopic .topic-header .crumbs.container a {
  color: rgba(255,255,255,0.85);
  text-decoration: none;
  transition: color 0.2s ease;
}
#pun-viewtopic .topic-header .crumbs.container a:hover {
  color: #fff;
  text-shadow: 0 0 6px rgba(255,255,255,0.4);
}

/* Заголовок темы (центральный, внутри картинки) */
#pun-viewtopic .topic-header::after {
  content: attr(data-title);
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 6;

  font-family: 'Marlino Regular Personal Use', var(--font-display), sans-serif;
  font-weight: 700;
  font-size: 26px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #f8f8f8;

  background: rgba(15, 20, 15, 0.5);
  padding: 6px 20px;
  border-radius: 12px;
  backdrop-filter: blur(8px);
  box-shadow:
    0 0 10px rgba(0,0,0,0.3),
    inset 0 0 8px rgba(255,255,255,0.05);
}

/* скрыть стандартный авто-заголовок темы под баннером */
#pun-viewtopic .main h1 {
  display: none !important;
}

/* выравнивание тела темы */
#pun-viewtopic #pun-main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}



/* Копирайт — выравнивание по центру */
#pun-about .container { text-align: center; }

/* ==========================================================================
   MAIN TABLES (INDEX / VIEWFORUM / SEARCHTOPICS)
   Таблицы списков форумов, тем, результатов поиска и т.п.
   ========================================================================== */
.main table { table-layout: fixed; width: 100%; } /* фиксированная таблица для предсказуемости ширин */
.main th { padding: 5px 10px; }
.main td { padding: 10px; }
.tcl { width: 50%; } /* колонка с названием темы/форума */
.tc2, .tc3, .tcmod { text-align: center; width: 10%; } /* счётчики/модерация */

/* На главной скрываем визуально лишние колонки (но сохраняем структуру) */
#pun-index .tc2, #pun-index .tc3, #pun-index .tcmod { visibility: hidden; }
.tcr { width: 30%; } /* колонка "последнее сообщение" */

#pun-index .tcr { text-align: right; padding-right: 20px; }
#pun-index td .user-avatar { float: right; margin: 1px 0 2px 11px; }
#pun-index td .avatar-image { outline: 2px solid var(--color-accent); }

/* Блок ссылок "последнее сообщение" — стилизован под мелкие подписи */
.lastpost-link, .lastpost {
  font-family: var(--font-sans);
  text-transform: lowercase;
  text-align: center;
  color: var(--color-text);
}
.lastpost-link { font-size: 12px; }
.lastpost { font-size: 10px; }

#pun-searchtopics .tcl, #pun-modviewforum .tcl { width: 40%; }
#pun-searchtopics .tc2 { text-align: left; width: 20%; }
#pun-debug table .tcl { width: 15%; }
#pun-debug .tcr { width: 90%; }

/* Карточки форумов со значком слева — делаем фоновую плитку и скругляем */
#pun-index tbody.hasicon {
  display: block;
  padding: 23px;
  border-radius: 17px;
  background: var(--color-surface-2);
}
tbody.hasicon td.tcl { padding-left: 40px; }

/* Описание форума под заголовком */
.desktext {
  font-family: var(--font-sans);
  font-size: 10px;
  text-transform: lowercase;
  color: var(--color-text);
}
.desklink { margin-top: 10px; display: flex; gap: 5px; }
.desklink a {
  border: 1px solid var(--color-accent);
  padding: 3px 8px;
  border-radius: 5px;
  color: var(--color-text);
}
.desklink a:hover {
  background: var(--color-accent);
  color: #fff;
}

/* Маркеры (иконки) списка форумов/тем — цветные полоски/кружки для статуса */
#pun-index div.icon,
#pun-index tr.inew div.icon {
  position: absolute;
  margin-left: -20px;
  width: 8px;
  height: 30px;
  border-radius: 0;
  background: var(--color-accent);
}
#pun-index tr.inew div.icon { background: var(--color-brand); }

div.icon {
  position: absolute;
  width: 15px; height: 15px;
  margin-left: -30px;
  border-radius: 50%;
  background: var(--color-accent);
}
tr.inew div.icon { background: var(--color-brand); }
tr.isticky div.icon { background: #323244; }
tr.iclosed div.icon { background: #3D2929; }

#pun-index .tclcon { width: 362px; }

/* Tooltip © Домовой — modernized — всплывающая подсказка */
#tooltip {
  position: absolute;
  z-index: 999;
  max-width: 200px;
  padding: 4px;
  border-radius: 4px;
  background-color: var(--color-brand);
  color: #fff;
  font: 12px var(--font-sans);
  text-align: center;
  text-transform: lowercase;
  display: none;
}

/* Разделители тем/закрепы — разноцветные полосы между блоками */
tr.tr-divider.imp, tr.tr-divider.st {
  height: 20px;
  display: flex; align-items: center; justify-content: center;
}
tr.tr-divider.st { background: var(--color-surface); color: var(--color-brand-strong); }
tr.tr-divider.imp { background: var(--color-brand); color: #fff; border-radius: 9px 9px 0 0; }

/* Таблица тем в разделе — подложка для наглядности строк */
#pun-viewforum table { background: var(--color-surface-2); border-radius: 9px; }
/* FIX: был неверный селектор — текстовая подпись под колонкой ответов */
#pun-viewforum .tc2::before { content: "ответов"; }

/* ==========================================================================
   HEADER (Шапка)
   Графическая шапка страницы: фон, логотип (скрыт), информационные блоки.
   ========================================================================== */
/* === ШАПКА ФОРУМА ==================================================== */
/* === ВНЕШАЯ ШАПКА (СТОИТ В HTML-ВЕРХЕ) ============================= */
.tablica.simple-head {
  position: relative;
  width: 950px;
  height: 339px;                 /* &#8592; фиксированная высота, чтобы не сжималась */
  margin: 0 auto 30px;
  background: url(https://forumstatic.ru/files/001c/93/33/13469.jpg) center top / cover no-repeat;
  color: #fff;
  overflow: hidden;
}

/* вариант для blue-темы */
.blue .tablica.simple-head {
  background: url(https://forumstatic.ru/files/001c/43/fc/98034.png) center top / cover no-repeat;
}

/* затемнение поверх фона */
.tablica.simple-head::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 0;
}

/* внутреннее содержимое */
.tablica.simple-head > * {
  position: relative;
  z-index: 1;
}

/*эп*/
/* эпизод */
.bestep {
  font: 13px var(--font-sans);
  text-transform: lowercase;
  letter-spacing: 0.4px;
  margin: 80px 0 0 60px;
}

.bestep a {
  color: #fff;
  font: italic 15px var(--font-sans);
  text-decoration: none;
  position: relative;

  /* создаём волнистое подчёркивание только через фон */
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(168,255,158,0.65) 0 2px,
    transparent 2px 4px
  );
background-position: 0 1.05em;  /* почти под текстом */
  background-size: 6px 6px;
  background-repeat: repeat-x;
}

/* при наведении — чуть ярче */
.bestep a:hover {
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(168,255,158,0.85) 0 2px,
    transparent 2px 4px
  );
}


/* цитата — позиционируем вручную */
.bestquote {
  position: absolute;
  left: 650px;
  top: -30px;
  width: 270px;
  max-height: 55px;        /* ограничиваем высоту блока */
  overflow-y: auto;        /* вертикальная прокрутка */
  overflow-x: hidden;      /* горизонтальную убираем */
  border-radius: 6px;
  padding: 8px 10px;
  font: 10px/1.5 var(--font-sans);
  color: #e8e8e8;
  scrollbar-width: thin;   /* тонкий скролл для Firefox */
  scrollbar-color: rgba(255,255,255,0.25) transparent;
}

/* Стилизация полосы прокрутки для Chrome / Edge */
.bestquote::-webkit-scrollbar {
  width: 6px;
}
.bestquote::-webkit-scrollbar-thumb {
  background-color: rgba(255,255,255,0.25);
  border-radius: 4px;
}
.bestquote::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255,255,255,0.4);
}


/* имя автора рядом с цитатой */
.bestauthor {
  position: absolute;
  left: 605px;      /* &#8592; отрегулируй под своё расположение */
  top: -30px;       /* &#8592; выровняй по вертикали с цитатой */
  font: 600 13px/1 var(--font-sans);
  text-transform: lowercase;
  color: #d7d7d7;
  letter-spacing: 0.3px;
  text-decoration: none;
  transition: color 0.3s ease;
}

.bestauthor:hover {
  color: var(--color-brand); /* тот же акцент, что в меню */
}



/* === Навигация (спойлер) ============================================== */
.navspoiler {
  width: fit-content;
  background: rgba(255,255,255,0.07);
  border-radius: 8px;
  backdrop-filter: blur(4px);
  padding: 10px 14px;
  font: 11px var(--font-sans);
  color: #ccc;
}
.navsummary {
  cursor: pointer;
  font-weight: 600;
  text-transform: lowercase;
  transition: color 0.3s ease;
}
.navsummary:hover { color: var(--color-brand); }
.navlinks {
  display: none;
  flex-wrap: wrap;
  gap: 10px 20px;
  padding-top: 6px;
}
.navlinks.open { display: flex; }
.navlinks a {
  color: #eaeaea;
  font-size: 10px;
  text-decoration: none;
  transition: color 0.3s ease;
}
.navlinks a:hover { color: var(--color-brand); }



/* ==========================================================================
   ANNOUNCEMENT / FOOTER
   Объявления и подвал сайта: баннерная лента, отключение заголовка.
   ========================================================================== */
#pun-announcement h2 { display: none; }

#html-footer .container { padding: 0; }

/* === ПОЛОСА БАННЕРОВ — стеклянная с зацикленным фоном ================== */
.banners {
  position: relative;
  z-index: 100;
  backdrop-filter: blur(12px) saturate(1.05);
  -webkit-backdrop-filter: blur(12px) saturate(1.05);
  background: rgba(15, 18, 16, 0.35); /* лёгкий дымчатый слой поверх фона */
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding: 10px 0;
  overflow: hidden; /* чтобы фон не вылезал */
}

/* фоновая текстура */
.banners::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("https://forumstatic.ru/files/001c/93/33/46552.png?v=1")
              repeat-x center top;
  background-size: auto 100%; /* зацикливание по горизонтали */
  opacity: 0.4;               /* прозрачность рисунка */
  pointer-events: none;
  z-index: 0;
}

/* контейнер с баннерами */
.banners .container {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  gap: 18px;
  justify-content: flex-start;
  padding: 8px 24px;
  scrollbar-width: thin;
  scrollbar-color: rgba(200, 210, 205, 0.25) transparent;
}

/* элементы баннеров */
.banners a {
  flex: 0 0 auto;
  opacity: 0.8;
  transition: opacity 0.25s ease, transform 0.3s ease;
  border-radius: 6px;
}
.banners a:hover {
  opacity: 1;
  transform: scale(1.05);
}

/* webkit-scrollbar */
.banners .container::-webkit-scrollbar {
  height: 6px;
}
.banners .container::-webkit-scrollbar-thumb {
  background: rgba(180, 190, 185, 0.25);
  border-radius: 3px;
}
.banners .container::-webkit-scrollbar-track {
  background: transparent;
}


/* ============================== */
/* ROLLBACK &#8594; STANDARD POST LAYOUT (RusFF/PunBB-style) */
/* ВОССТАНОВЛЕНИЕ ВЫРАВНИВАНИЯ И КНОПОК                */
/* ============================== */

/* Родитель поста — НЕ flex */
#pun-viewtopic .post {
  display: block !important;
  position: relative;
  margin: 18px 0;
}

/* Левая колонка автора — классическая "плавающая" колонка */
#pun-viewtopic .post-author {
  position: relative !important;
  float: left !important;
  width: var(--layout-sidebar-width, 220px) !important;
  margin: 0 20px 0 0 !important;
  border-radius: 16px;
  overflow: hidden;
  z-index: 0;
}

/* Псевдо-фоны автора — не вылезают и не перекрывают контент */
#pun-viewtopic .post-author::before,
#pun-viewtopic .post-author::after {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
}
#pun-viewtopic .post-author > * { position: relative; z-index: 1; }

/* Правая часть — тянется на остаток, без “провалов” */
#pun-viewtopic .post-body {
  overflow: hidden !important;         /* классический clearfix для float */
  display: block !important;
  padding: 0 !important;               /* убираем случайные отступы-уезжания */
  background: transparent !important;  /* вернём фон из общей темы */
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Внутренности текста — нормализация ширины/отступов */
#pun-viewtopic .post-box,
#pun-viewtopic .post-content,
#pun-viewtopic .post .post-content,
#pun-viewtopic .post #p1-content {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
}

/* Кнопки под постом — в один ряд, справа, не “падают” вниз */
#pun-viewtopic .post-links {
  clear: both !important;
  display: block !important;
  text-align: right !important;
  margin: 10px 0 0 0 !important;
  padding: 6px 0 0 0 !important;
  border-top: 0 !important;      /* убираем неожиданные рамки из кастомов */
}
#pun-viewtopic .post-links ul {
  display: inline-flex !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
#pun-viewtopic .post-links li { float: none !important; }
#pun-viewtopic .post-links .clearer { display: none !important; }

/* Анти-конфликты: убрать смещения, заданные через переменные */
#pun-viewtopic .post-links,
#pun-viewtopic .post-links ul {
  margin-left: 0 !important;
}

/* Изображения и вложения — не ломают ширину контента */
#pun-viewtopic .post-content img,
#pun-viewtopic .post-content video,
#pun-viewtopic .post-content iframe {
  max-width: 100% !important;
  height: auto !important;
}

/* Мобилка: колонка становится вертикальной без хаоса */
@media (max-width: 880px) {
  #pun-viewtopic .post-author {
    float: none !important;
    width: 100% !important;
    margin: 0 0 12px 0 !important;
  }
  #pun-viewtopic .post-body { overflow: visible !important; }
  #pun-viewtopic .post-links { text-align: left !important; }
}


/* ================================================================
   HIGH — CLEAN DARK MOUNTAIN POST AESTHETICS
   Центрирование автора / оформление цитат и кода / номера постов
   ================================================================ */

/* === КАРТОЧКА АВТОРА ========================================== */
.post-author {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;

  background: rgba(18,25,16,0.85);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 16px;
  overflow: hidden;

  padding: 18px 12px;
  box-shadow: 0 0 12px rgba(0,0,0,0.4);
}

.post-author img,
.pa-avatar img {
  border-radius: 10px;
  width: 130px;
  height: 130px;
  object-fit: cover;
  margin-bottom: 10px;
  filter: brightness(0.9);
}

.pa-author {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 600;
  font-size: 15px;
  text-transform: lowercase;
  color: #e2e6e2;
  margin-bottom: 4px;
}

.pa-title {
  font: 10px 'Inter', sans-serif;
  text-transform: uppercase;
  color: #7c827c;
  letter-spacing: 0.4px;
  margin-bottom: 8px;
}

.pa-stats {
  display: flex;
  gap: 10px;
  font-size: 10px;
  color: #808580;
  justify-content: center;
}

/* === ТЕКСТ ПОСТА ============================================== */
.post-content {
  border-radius: 14px;
  padding: 15px 18px;
  color: #cfd1cf;
  line-height: 1.6;
}


/* === ЦИТАТЫ — строгий минимализм, матовый зелёный акцент ======= */
.post-content blockquote,
.quote-box {
  margin: 20px 0;
  padding: 14px 22px;
  font: 13px/1.6 'Inter', sans-serif;
  color: rgba(230,230,230,0.9);

  background: rgba(15,15,15,0.35);                 /* матовая подложка */
  border-left: 3px solid rgba(82,112,82,0.55);     /* тёмно-зелёная полоса */
  border-top: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  border-right: none;

  box-shadow: none;                                /* никакой подсветки */
  position: relative;
}

/* Вертикальная метка */
.post-content blockquote::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 3px;
  background: rgba(82,112,82,0.55);
}

/* Автор цитаты (если есть <cite>) — спокойный серо-зелёный */
.post-content blockquote cite {
  display: block;
  margin-bottom: 6px;
  font-style: normal;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: rgba(150,170,150,0.55);
}

/* === КОД — технический блок, без теней и бликов ================= */
pre,
.code-box {
  margin: 20px 0;
  padding: 14px 18px;
  overflow-x: auto;

  background: rgba(18,18,18,0.55);                 /* матовый фон */
  border: 1px solid rgba(255,255,255,0.06);
  border-left: 3px solid rgba(82,112,82,0.55);     /* тот же зелёный акцент */

  color: rgba(220,220,220,0.92);
  font: 12.5px/1.55 'IBM Plex Mono', monospace;
  letter-spacing: 0.25px;
  box-shadow: none;
}

/* Техническая метка блока */
pre::before {
  content: "code";
  display: block;
  margin-bottom: 6px;
  font: 10px 'Space Grotesk', sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(120,140,120,0.45);
}

/* Минималистичный скролл */
pre::-webkit-scrollbar { height: 6px; }
pre::-webkit-scrollbar-thumb {
  background: rgba(120,140,120,0.25);
  border-radius: 2px;
}
pre::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.2);
}

/* Дата + время + № поста — аккуратная полоса */
#pun-viewtopic .post h3{
  display: flex !important;
  align-items: baseline !important;
  /* дата/время слева, номер справа */
  justify-content: flex-start !important;
  gap: 18px;                 /* воздух между датой и временем (поддержка при span'ах) */
  padding: 0 22px 8px 12px;  /* &#8592; правый паддинг даст отступ от края для номера */
  border-bottom: 1px solid rgba(255,255,255,.05);
  font: 11px 'Inter', sans-serif;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: rgba(230,230,230,.45);
}

/* текст даты/времени — если одним узлом, добавляем воздух между словами */
#pun-viewtopic .post h3 > span{
  word-spacing: 12px; /* &#8592; расстояние между “СЕГОДНЯ” и “09:49:29” */
  white-space: nowrap;
}

/* № поста справа, но не прижат к краю */
#pun-viewtopic .post h3 strong{
  margin-left: auto !important; /* уезжает вправо */
  padding-left: 24px;           /* отступ от даты/времени */
  margin-right: 0 !important;   /* обнуляем чужие маргины */
  float: none !important;       /* СБРОС старых тем */
  position: static !important;  /* на случай правых позиционирований */
  color: rgba(220,220,220,.45);
  font-weight: 400;
  letter-spacing: .6px;
}

/* если внутри номера ссылка — унаследовать стиль */
#pun-viewtopic .post h3 strong,
#pun-viewtopic .post h3 strong a{
  color: rgba(220,220,220,.45);
  text-decoration: none;
}
#pun-viewtopic .post h3 strong:hover,
#pun-viewtopic .post h3 strong a:hover{
  color: rgba(235,235,235,.75);
}



/* === КНОПКИ ПОД ПОСТОМ ======================================= */
.post-links {
  border-top: 1px solid rgba(255,255,255,0.05);
  margin-top: 10px;
  padding-top: 8px;
  text-align: right;
}

.post-links a {
  font: 11px 'Space Grotesk', sans-serif;
  color: #888b88;
  text-decoration: none;
  text-transform: lowercase;
  margin-left: 10px;
  transition: color 0.3s ease;
}

.post-links a:hover {
  color: #cfd3cf;
}



/* ================================================================
   CLEAN DARK MOUNTAIN — POST DETAILS
   оформление цитат, кода, кнопок и системных блоков
   ================================================================ */


/* Спойлер — кастомная иконка у заголовка спойлера */
.punbb .post-content .spoiler-box > div,
.punbb .post-content .spoiler-box > div.visible {
  background: url(https://forumstatic.ru/files/001c/43/fc/91116.png?v=1) no-repeat left center / 14px;
}

/* Форма ответа — сбросы отступов в панели тегов */
#main-reply { box-sizing: border-box; }
#tags { position: relative; }
#tags .container { padding: var(--space-sm) !important; top: 0 !important; }

/* ==========================================================================
   PROFILE / MESSAGES
   Оформление страниц профиля и личных сообщений (грид-раскладка).
   ========================================================================== */
#profile { padding: var(--space-lg); }
#pun-profile h1 { display: none; }

#viewprofile tr {
  display: flex; gap: 40px; font-family: var(--font-sans);
}
#profile .container { padding-left: 200px; min-height: 100px; }
#profilenav { float: left; margin-left: -180px; }

/* Шапки секций профиля — маленькие "плашки" */
#viewprofile h2, #profilenav h2 {
  margin-bottom: 10px; padding: 2px 3px; text-align: center;
  font: 500 12px var(--font-sans);
  background: var(--color-accent); color: #000; border-radius: 10px;
}
#profilenav li { padding-bottom: 5px; }
#viewprofile li { padding: 5px 0; }

/* Левая колонка профиля — карточка с аватаркой и статами */
#viewprofile td#profile-left {
  display: flex; flex-direction: column; flex-wrap: wrap; align-items: center;
  background: var(--color-surface-2); padding: 10px 15px; border-radius: 10px;
  border: 1px solid var(--color-accent); width: auto; flex-shrink: 0;
}
#profile-name { font-size: 15px; font-style: italic; }

/* Правая колонка — сетка карточек полей информации */
#viewprofile td#profile-right {
  display: flex; flex-flow: row wrap; gap: 10px; box-sizing: border-box;
}
#profile-right li {
  display: flex; flex-direction: column; flex-wrap: wrap; flex-grow: 1; gap: 10px; justify-content: center; text-align: center;
  background: var(--color-surface-2); padding: 0 5px; border-radius: 10px; border: 1px solid var(--color-accent);
}
#profile-right li span { flex-shrink: 0; text-align: center; }

#profile-left li strong, #profile-right li strong { font-weight: 400 !important; padding-left: 0 !important; }
img.avatardemo { float: right; margin: 0 0 8px 18px; }
#pun-messages .clearer { display: none; }

/* === Блюр + зелёное затемнение + полупрозрачная текстура =============== */
.post-author.has-custom-bg {
  position: relative;
  overflow: hidden; /* &#8592; обрезает края блюра */
}

.post-author.has-custom-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;

  /* основной фон (из JS) */
  background: inherit;
  background-size: cover;
  background-position: center top;

  /* фильтры на изображение */
  filter: blur(14px) brightness(0.45) contrast(105%);
  transform: scale(1.08);

  /* накладываем зелёное затемнение и текстуру */
  background-blend-mode: overlay, normal;
  background-image:
    linear-gradient(rgba(12, 32, 18, 0.65), rgba(10, 25, 15, 0.65)), /* тёмно-зелёный фильтр */
    url("https://forumstatic.ru/files/001c/93/33/65214.png?v=1"); /* твоя текстура */
  background-repeat: repeat;

  /* уменьшаем видимость текстуры */
  opacity: 0.8; /* &#8592; вот эта строка регулирует силу текстуры */
}

/* Контент автора — поверх */
.post-author.has-custom-bg > * {
  position: relative;
  z-index: 1;
}


/* ==========================================================================
   USERLIST / INFO PAGES
   Список пользователей и общие служебные страницы (стили форм и таблиц).
   ========================================================================== */
#pun-userlist .formal, #pun-userlist .formal .container { margin-bottom: 0; }
#pun-userlist .tc2 { text-align: left; width: 20%; }
#pun-userlist .tcl { width: 40%; }

.info .container { padding: var(--space-sm); }
.info .container .backlink { padding-top: 8px; }

.info-box { margin: 0 0 10px; }
.info-box * { padding: 0 0 5px; }
.info-box .legend { font-weight: 700; }

.jGrowl-notification .jGrowl-close { position: relative; right: 6px; }

/* === КНОПКИ ПРОКРУТКИ (вверх/вниз) ============================ */
.scroll-buttons {
  position: fixed;
  bottom: 60px;
  right: 40px;
  display: flex;
  flex-direction: column;
  gap: 14px;
z-index: 999999 !important;
}

.scroll-btn {
  width: 46px;
  height: 46px;
  border: 1px solid rgba(233,245,237,0.3);
  border-radius: 50%;
  background: rgba(10,20,10,0.55);
  backdrop-filter: blur(6px);
  color: #e9f5ed;
  font-size: 22px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  opacity: 0;
  pointer-events: none;
  box-shadow: 0 0 6px rgba(0,0,0,0.4);
}

/* Анимация появления при скролле */
.scroll-btn.show {
  opacity: 1;
  pointer-events: auto;
}

/* Hover — мягкое свечение и подскок */
.scroll-btn:hover {
  color: #fff;
  border-color: rgba(233,245,237,0.8);
  background: rgba(50,80,60,0.7);
  box-shadow:
    0 0 10px rgba(233,245,237,0.2),
    inset 0 0 10px rgba(233,245,237,0.15);
  transform: translateY(-3px);
}

==========================================================================
   QUICK RATING (БыстроПлюсы)
   Система быстрых лайков/рейтинга постов (внешний вид кнопок и иконок).
   ========================================================================== */
.noNull::before {
  content: "+"; position: absolute; margin-left: -6px; font-size: 9px;
}
div .post-rating p > a {
  position: relative; z-index: 100; display: inline-block; vertical-align: middle;
  width: 38px; height: 38px; line-height: 36px; letter-spacing: 2px; text-align: center;
  font-size: 12px !important; font-weight: 700; color: var(--color-brand);
  background: url(https://forumstatic.ru/files/001b/a6/d4/26514.svg) no-repeat center / 38px auto;
  outline: 1px solid transparent;
}
div.dark-style .post-rating p > a { color: #6BC8AF !important; }

div.post-vote {}
div.post-vote p > a {
  position: absolute; z-index: 200; display: block; cursor: pointer;
  width: 23px; height: 23px; font-size: 0 !important;
  background: url(https://forumstatic.ru/files/0012/d8/04/75043.png?) no-repeat / 100%;
}
.post.dark-style div.post-vote p > a {
  background: url(https://forumstatic.ru/files/0012/d8/04/38128.png?) no-repeat / 100%;
}
.punbb div.post-vote p { padding: var(--space-lg)!important; margin: 0!important; }

/* ==========================================================================
   INDEX: CATEGORIES / STATS
   Заголовки категорий, список форумов, общая статистика в подвале.
   ========================================================================== */

/* === УБИРАЕМ ГЛАВНЫЙ H1 ФОРУМА ==================== */
#pun-index h1,
#pun-viewforum h1 {
  display: none !important;
}

/* Скрыть thead (форум/тем/сообщений) — визуально упрощаем список */
#pun-index thead { display: none; }

/* Скрыть логотип-заголовок в шапке */
#pun-index h1.title-logo,
.tablica.simple-head h1.title-logo,
h1.title-logo {
  display: none !important;
}

/* === Категории: индустриальный горный стиль ===================== */
#pun-index .category h2 {
  margin: 15px 0 !important;
  padding: 0 !important;
  text-align: right;
  position: relative;
  overflow: hidden;
}

/* сам текст */
#pun-index .category h2 span:not(.categoryTool) {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;

  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: 1.4px;
  text-transform: uppercase;

  color: #e6e9e7;
  text-shadow:
    0 0 2px rgba(120,130,120,0.3),
    0 0 10px rgba(180,200,180,0.08),
    0 0 30px rgba(180,200,180,0.05);
  position: relative;
}

/* --- горная линия под текстом (как контур хребта) --- */
#pun-index .category h2::after {
  content: "";
  position: absolute;
  bottom: -2px;
  right: 60px;
  width: 160px;
  height: 18px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 18'><path d='M0 16 L20 8 L35 12 L55 4 L75 14 L100 6 L125 12 L160 4' stroke='%23a6b5a2' stroke-width='1.2' fill='none' stroke-linecap='round'/></svg>") no-repeat right bottom / contain;
  opacity: 0.25;
  filter: drop-shadow(0 0 4px rgba(140,170,150,0.4));
  animation: ridgeGlow 4s ease-in-out infinite;
}

/* Мягкое свечение гор */
@keyframes ridgeGlow {
  0%,100% {
    opacity: 0.25;
    filter: drop-shadow(0 0 2px rgba(140,170,150,0.3));
  }
  50% {
    opacity: 0.45;
    filter: drop-shadow(0 0 6px rgba(180,220,190,0.6));
  }
}

/* скрыть описание */
.desktext { display: none !important; }

/* убрать лишние фоновые изображения, если остались */
#pun-index .category h2 span:not(.categoryTool) {
  background: none !important;
}

/* мелкая подпись под категорией */
.categoryTool {
  display: none;
}


/* Форумы — заголовки в верхнем регистре, с эффектом трекинга при hover */
#pun-index .tcl h3 { font: 400 24px var(--font-display); text-transform: uppercase; }
#pun-index .tcl h3 a { color: var(--color-text); }
#pun-index .tcl h3 a:hover { letter-spacing: 0.1em; }

/* Статистика — компактные "пилюли" с данными + список онлайн */
#pun-stats .container {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
  font: 10px var(--font-sans); text-transform: lowercase;
}
.online-list { font: 11px var(--font-sans); }
#pun-stats h2 { display: none; }
#pun-stats li.item1, #pun-stats li.item2,
#pun-stats li.item3, #pun-stats li.item4 {
  background: var(--color-surface-2);
  padding: 5px 25px; border-radius: 23px; clear: both;
}
li#onlinelist { margin-top: 10px; width: 100%; text-align: justify; flex-grow: 1; }


/* ==========================================================================
   END
   Конец файла. Дальше можно добавлять медиа-запросы/переопределения тем.
   ========================================================================== */