/*
  EverGet (движок FrancescoCore) — все стили сайта в одном файле.

  Порядок: переменные и основа страницы (шапка, сетка, карточки, сайдбар), затем разделы
  по страницам — навигация, формы, редактор, комментарии, кабинет, сообщество, пагинация,
  в конце — подтверждение почты, cookie, страницы сайта, жалобы, зависимости и коллекции модов.
  Подсветка кода — отдельно, в code.css (тема Pygments monokai).
*/

/* --- Основа: сетка страницы, шапка, карточки, сайдбар --- */

:root{
  /*
    Цвета — только через эти переменные. Здесь светлая тема; тёмная — в блоке ниже
    (:root[data-theme="dark"] и он же в @media (prefers-color-scheme:dark) для :root:not([data-theme="light"])).
    Новый компонент, собранный из токенов, получает тёмную тему сам.

    Основные токены (берите их в новых компонентах):
      --shell         фон «листа» страницы под карточками
      --card          карточки и панели (белые), кнопки/вкладки на «листе»
      --card-2        мягкая серая подложка: чипы, теги, inline-код, рельсы вкладок
      --field         фон поля ввода;  --field-focus — поле в фокусе и поля без своей подложки
      --field-line    рамка поля ввода
      --heading       заголовки (самый тёмный текст)
      --text          основной текст;  --text-2 — вторичный текст кнопок, вкладок и чипов
      --muted         приглушённый текст: даты, подписи, счётчики
      --line          тонкие рамки и разделители
      --red-text      красный для текста и ссылок (в тёмной теме светлее --red, чтобы читался)
      --btn-dark      тёмные кнопки и активные вкладки/фильтры (текст на них — #fff)
      --tint-red, --tint-cyan, --tint-green, --tint-yellow, --tint-indigo
                      светлые подложки плашек, статусов и баннеров;
      --tint-*-text   текст на них;  --tint-*-line — рамка тонированного блока (кроме green)
      --shadow, --soft-shadow, --hover-shadow   тени карточек
    Остальное — оттенки тех же ролей (--card-2-*, --text-*, --tint-*-*, --banner-*): нужны, чтобы
    светлая тема осталась ровно прежней. В тёмной теме многие из них совпадают с основными.
    Одинаковы в обеих темах: --dark/--dark2 (шапка и тёмные блоки), --red/--red2/--cyan/--green
    (бренд: кнопки и бейджи) и белый текст на них.
  */
  color-scheme:light;

  /* Бренд и тёмные блоки */
  --bg:#20242b;               /* под фоновым узором страницы */
  --bg-blend:normal;          /* в тёмной теме узор затемняется умножением на --bg */
  --dark:#2f323a;
  --dark2:#1e2229;
  --red:#dc4e3c;
  --red2:#ff5a42;
  --cyan:#14adc4;
  --green:#28a745;
  --radius:18px;

  /* Поверхности */
  --shell:#f3f5f8;
  --card:#fff;
  --card-line:rgba(228,232,238,.78);   /* рамка карточки материала */
  --card-2:#f1f3f7;
  --card-2-btn:#f0f2f6;      /* серые кнопки и плитки: «Открыть», номер урока, иконка файла */
  --card-2-inset:#f5f7fa;    /* вставки в карточке: оглавление, шапка таблицы, список изменений */
  --card-2-text:#495166;     /* текст на --card-2: теги, чипы, статусы */
  --home-hero:linear-gradient(180deg,#fff,#f4f6f9);
  --btn-dark:var(--dark);
  --track:#e9edf2;           /* дорожка прогресс-бара */

  /* Поля ввода */
  --field:#fbfcfd;
  --field-2:#fafbfc;         /* поле выбора файла */
  --field-focus:#fff;
  --field-line:#d9dee6;
  --field-line-dashed:#d0d6df;

  /* Текст */
  --heading:#1e2229;
  --text:#313746;
  --text-btn:#333b4d;        /* на серых кнопках --card-2-btn */
  --text-2:#485166;
  --text-soft:#4a5161;       /* цитаты, список изменений, текст последних комментариев */
  --text-lead:#596274;       /* лид статьи */
  --text-desc:#626b7b;       /* описание в карточках */
  --text-meta:#687284;       /* строка мета-данных карточки, подвал */
  --muted:#747d8c;
  --faint:#b5bdc9;           /* номера мест 4+ в топе */
  --faint-2:#c2c8d2;         /* маркеры дерева разделов */
  --red-text:var(--red);
  --error-text:#8c2a1e;      /* сообщение об ошибке, баннер «отклонено», заметка модератора */
  --field-error:#b8321f;     /* ошибка под полем формы */

  /* Линии */
  --line:#e4e8ee;
  --line-dashed:#d6dbe3;     /* пунктир пустых состояний и вложенных форм */

  /* Тонированные плашки: подложка / текст / рамка */
  --tint-red:#fff1ee;      --tint-red-text:#a3301f;      --tint-red-line:#f3c3bb;
  --tint-cyan:#e3f5f8;     --tint-cyan-text:#0f7889;     --tint-cyan-line:#b6e4ec;
  --tint-green:#e3f5e8;    --tint-green-text:#1d7a35;
  --tint-yellow:#fff3d6;   --tint-yellow-text:#7a5a00;   --tint-yellow-line:#f0cf74;
  --tint-indigo:#eceeff;   --tint-indigo-text:#3a43a3;   --tint-indigo-line:#cfd4fb;
  /* их оттенки */
  --tint-red-pill:#fde4e0;     /* статус «отклонено», минус репутации */
  --tint-red-btn:#f3d9d4;      /* мягкая кнопка удаления */
  --tint-red-soft:#fff4f1;     /* цитата */
  --tint-red-hover:#fff5f3;    /* наведение на вкладку типа */
  --tint-red-select:#fff7f5;   /* выбранная карточка типа */
  --tint-red-current:#fff8f6;  /* текущий урок */
  --tint-red-unread:#fffaf8;   /* непрочитанное уведомление */
  --tint-red-reply:#f0d5cf;    /* линия ветки ответов */
  --tint-cyan-label:#e1f6f9;   /* метка «Новое» */
  --tint-green-soft:#eefaf3;   --tint-green-soft-text:#1d8a4b;   /* значение в топе */
  --tint-yellow-btn:#fff4d6;   /* нажатая закладка */
  --tint-yellow-soft:#fffdf4;  /* полученная награда, первое место */
  --tint-yellow-mark:#fff8e6;  /* комментарий по ссылке #id */
  --tint-yellow-flash:#fff3c4; /* вспышка нового комментария */
  /* Баннеры статуса материала: подложка / рамка / текст */
  --banner-yellow:#fff7e6;  --banner-yellow-line:#f4dca6;  --banner-yellow-text:#6d5212;
  --banner-cyan:#e8f7fa;    /* рамка --tint-cyan-line */    --banner-cyan-text:#145763;
  --banner-red:#fdecea;     /* рамка --tint-red-line, текст --error-text */
  --banner-blue:#eef7fb;    --banner-blue-line:#c9e6f0;    --banner-blue-text:#245466;
  --banner-indigo:#eef0ff;  /* рамка --tint-indigo-line */  --banner-indigo-text:#323a8c;

  /* Тени */
  --shadow:0 18px 45px rgba(20,24,31,.13);
  --soft-shadow:0 8px 24px rgba(20,24,31,.08);
  --hover-shadow:0 18px 40px rgba(20,24,31,.16);
}

/* Тёмная тема: выбрана явно (cookie theme=dark → <html data-theme="dark">) или включена в системе,
   если светлая не выбрана явно. Значения в обоих блоках одинаковые — меняйте их вместе. */
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#6e737d;  --bg-blend:multiply;
  --shell:#181b21;
  --card:#22262e;
  --card-line:#2c313a;
  --card-2:#2d323c;
  --card-2-btn:#30353f;
  --card-2-inset:#1c1f26;
  --card-2-text:#c3cad5;
  --home-hero:linear-gradient(180deg,#20242b,#181b21);
  --btn-dark:#464d5b;
  --track:#2f3540;
  --field:#1b1e25;
  --field-2:#1b1e25;
  --field-focus:#1f232a;
  --field-line:#3a404c;
  --field-line-dashed:#424957;
  --heading:#f1f3f7;
  --text:#d6dbe4;
  --text-btn:#e1e5ec;
  --text-2:#c3cad5;
  --text-soft:#b9c1cd;
  --text-lead:#b3bbc8;
  --text-desc:#a7b0be;
  --text-meta:#a0a9b8;
  --muted:#959fae;
  --faint:#5f6776;
  --faint-2:#545c6a;
  --red-text:#ff6d58;
  --error-text:#ff8b7b;
  --field-error:#ff7b68;
  --line:#30353f;
  --line-dashed:#3a404c;
  --tint-red:#3a2629;      --tint-red-text:#ff8f80;      --tint-red-line:#5e3732;
  --tint-cyan:#163840;     --tint-cyan-text:#62d2e3;     --tint-cyan-line:#235661;
  --tint-green:#1b3a27;    --tint-green-text:#72d98f;
  --tint-yellow:#3b3220;   --tint-yellow-text:#f0c75e;   --tint-yellow-line:#6b5626;
  --tint-indigo:#282c4f;   --tint-indigo-text:#adb4ff;   --tint-indigo-line:#41477e;
  --tint-red-pill:#3a2629;
  --tint-red-btn:#45282a;
  --tint-red-soft:#2b2326;
  --tint-red-hover:#2b2427;
  --tint-red-select:#2e2528;
  --tint-red-current:#2e2528;
  --tint-red-unread:#2a2428;
  --tint-red-reply:#4d3330;
  --tint-cyan-label:#163840;
  --tint-green-soft:#1b3a27;   --tint-green-soft-text:#72d98f;
  --tint-yellow-btn:#3b3220;
  --tint-yellow-soft:#29271f;
  --tint-yellow-mark:#2f2b1f;
  --tint-yellow-flash:#4a3f1c;
  --banner-yellow:#2e2a1e;  --banner-yellow-line:#5a4a22;  --banner-yellow-text:#f0cf7a;
  --banner-cyan:#16313a;    --banner-cyan-text:#7fdcea;
  --banner-red:#33221f;
  --banner-blue:#182c38;    --banner-blue-line:#2a4a5c;    --banner-blue-text:#93cfe6;
  --banner-indigo:#23264a;  --banner-indigo-text:#b7bdff;
  --shadow:0 0 0 1px rgba(255,255,255,.05),0 18px 45px rgba(0,0,0,.4);
  --soft-shadow:0 8px 24px rgba(0,0,0,.22);
  --hover-shadow:0 18px 40px rgba(0,0,0,.45);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#6e737d;  --bg-blend:multiply;
    --shell:#181b21;
    --card:#22262e;
    --card-line:#2c313a;
    --card-2:#2d323c;
    --card-2-btn:#30353f;
    --card-2-inset:#1c1f26;
    --card-2-text:#c3cad5;
    --home-hero:linear-gradient(180deg,#20242b,#181b21);
    --btn-dark:#464d5b;
    --track:#2f3540;
    --field:#1b1e25;
    --field-2:#1b1e25;
    --field-focus:#1f232a;
    --field-line:#3a404c;
    --field-line-dashed:#424957;
    --heading:#f1f3f7;
    --text:#d6dbe4;
    --text-btn:#e1e5ec;
    --text-2:#c3cad5;
    --text-soft:#b9c1cd;
    --text-lead:#b3bbc8;
    --text-desc:#a7b0be;
    --text-meta:#a0a9b8;
    --muted:#959fae;
    --faint:#5f6776;
    --faint-2:#545c6a;
    --red-text:#ff6d58;
    --error-text:#ff8b7b;
    --field-error:#ff7b68;
    --line:#30353f;
    --line-dashed:#3a404c;
    --tint-red:#3a2629;      --tint-red-text:#ff8f80;      --tint-red-line:#5e3732;
    --tint-cyan:#163840;     --tint-cyan-text:#62d2e3;     --tint-cyan-line:#235661;
    --tint-green:#1b3a27;    --tint-green-text:#72d98f;
    --tint-yellow:#3b3220;   --tint-yellow-text:#f0c75e;   --tint-yellow-line:#6b5626;
    --tint-indigo:#282c4f;   --tint-indigo-text:#adb4ff;   --tint-indigo-line:#41477e;
    --tint-red-pill:#3a2629;
    --tint-red-btn:#45282a;
    --tint-red-soft:#2b2326;
    --tint-red-hover:#2b2427;
    --tint-red-select:#2e2528;
    --tint-red-current:#2e2528;
    --tint-red-unread:#2a2428;
    --tint-red-reply:#4d3330;
    --tint-cyan-label:#163840;
    --tint-green-soft:#1b3a27;   --tint-green-soft-text:#72d98f;
    --tint-yellow-btn:#3b3220;
    --tint-yellow-soft:#29271f;
    --tint-yellow-mark:#2f2b1f;
    --tint-yellow-flash:#4a3f1c;
    --banner-yellow:#2e2a1e;  --banner-yellow-line:#5a4a22;  --banner-yellow-text:#f0cf7a;
    --banner-cyan:#16313a;    --banner-cyan-text:#7fdcea;
    --banner-red:#33221f;
    --banner-blue:#182c38;    --banner-blue-line:#2a4a5c;    --banner-blue-text:#93cfe6;
    --banner-indigo:#23264a;  --banner-indigo-text:#b7bdff;
    --shadow:0 0 0 1px rgba(255,255,255,.05),0 18px 45px rgba(0,0,0,.4);
    --soft-shadow:0 8px 24px rgba(0,0,0,.22);
    --hover-shadow:0 18px 40px rgba(0,0,0,.45);
  }
}
*{box-sizing:border-box}
button,input,select,textarea{font-family:inherit}  /* поля и кнопки — тем же шрифтом Exo 2, что и текст */
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg) url("../images/bg.8c0e161099be.png") repeat;background-blend-mode:var(--bg-blend);color:var(--text);font:15px/1.62 "Exo 2",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.site-shell{width:min(1180px,calc(100% - 28px));margin:30px auto;min-height:100vh;background:var(--shell);box-shadow:0 0 44px rgba(0,0,0,.32);padding-bottom:18px}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:12px 16px;background:linear-gradient(135deg,var(--dark),#242832);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.brand{display:flex;align-items:center;gap:10px;min-width:260px}
.brand-mark{width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,var(--red),#ff8a45);display:grid;place-items:center;font-size:24px;font-weight:900;box-shadow:0 8px 22px rgba(220,78,60,.38)}
.brand strong{display:block;font-size:22px;letter-spacing:.2px}
.brand small{display:block;margin-top:-4px;color:#b9c3d2;font-size:11px;text-transform:uppercase;letter-spacing:.12em}
.nav-links{display:flex;align-items:center;gap:2px;flex:1}
.nav-links a{padding:12px 10px;border-radius:10px;color:#d9e0ea;font-size:14px}
.nav-links a:hover{background:rgba(255,255,255,.08);color:#fff}
.search{display:flex;align-items:center;gap:6px;background:#1b1f27;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:5px}
.search input{width:190px;border:0;background:transparent;color:#fff;outline:0;padding:7px}
.search button,.menu-toggle{border:0;background:var(--cyan);color:#fff;border-radius:10px;padding:8px 11px;cursor:pointer}
.menu-toggle{display:none}
.eyebrow,.page-title span,.section-head span{display:inline-flex;padding:6px 10px;border-radius:99px;background:rgba(220,78,60,.12);color:var(--red-text);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45em;padding:12px 17px;border-radius:13px;font-weight:800}
.btn.primary{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;box-shadow:0 10px 25px rgba(220,78,60,.28)}
.btn.ghost{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.14)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;padding:8px 24px 24px}
.section-head,.page-title{margin:8px 0 16px}
.section-head h2,.page-title h1{margin:8px 0 6px;line-height:1.15}
.page-title p{color:var(--muted);margin:0}
.cards-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.cards-grid.compact{gap:14px}
.game-card{position:relative;background:var(--card);border-radius:18px;overflow:hidden;box-shadow:var(--soft-shadow);border:1px solid var(--card-line);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.game-card:hover{transform:translateY(-4px);box-shadow:var(--hover-shadow);border-color:rgba(220,78,60,.25)}
.card-cover{height:218px;background:#151922;overflow:hidden;position:relative;display:block}
.card-cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease,filter .5s ease}
.game-card:hover .card-cover img{transform:scale(1.055);filter:saturate(1.15)}
.cover-glow{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.43))}
.card-badges{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;align-items:center;gap:8px;z-index:2}
.card-badges span,.card-badges em{font-style:normal;color:#fff;font-weight:800;font-size:12px;padding:6px 9px;border-radius:999px;background:rgba(220,78,60,.92);box-shadow:0 8px 18px rgba(0,0,0,.18)}
.card-badges em{background:rgba(40,167,69,.94)}
.card-body{padding:16px 16px 13px}
.card-kicker{font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--red-text);font-weight:900}
.card-body h3{font-size:20px;line-height:1.22;margin:7px 0 8px}
.card-body h3 a:hover{color:var(--red-text)}
.card-body p{margin:0;color:var(--text-desc)}
.card-meta{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding:12px 16px;color:var(--text-meta);font-size:13px}
.card-meta a{margin-left:auto;background:var(--card-2-btn);color:var(--text-btn);border-radius:10px;padding:7px 10px;font-weight:800}
.card-meta a:hover{background:var(--btn-dark);color:#fff}
.sidebar{display:flex;flex-direction:column;gap:15px}
.side-card{background:var(--card);border-radius:18px;box-shadow:var(--soft-shadow);padding:16px;border:1px solid var(--line)}
.side-card h3{margin:0 0 10px}
.author-card{text-align:center}
.avatar-lg{width:76px;height:76px;border-radius:50%;margin:0 auto 10px;box-shadow:0 10px 25px rgba(0,0,0,.11)}
.side-card p{color:var(--muted);margin:0 0 12px}
.mini-stats{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.mini-stats span{background:var(--card-2);border-radius:999px;padding:6px 8px;font-size:12px;font-weight:800}
.side-list{list-style:none;margin:0;padding:0}
.side-list li{display:flex;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}
.side-list li:last-child{border-bottom:0}
.side-list a:hover{color:var(--red-text)}
.side-list b{color:var(--red-text)}
.pulse-card{background:linear-gradient(135deg,var(--card),var(--tint-red-soft))}
.small-btn{display:inline-flex;align-items:center;gap:.45em;padding:9px 12px;border-radius:10px;background:var(--btn-dark);color:#fff;font-weight:800}
.breadcrumbs{font-size:13px;color:var(--muted);margin:8px 0 14px}
.breadcrumbs a{color:var(--red-text)}
.full-article{background:var(--card);border-radius:20px;box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--line)}
.article-cover{width:100%;height:360px;object-fit:cover;background:#151922}
.article-body{padding:28px}
.article-labels{display:flex;gap:8px;flex-wrap:wrap}
.article-labels span{padding:6px 9px;border-radius:999px;background:var(--card-2);color:var(--card-2-text);font-weight:800;font-size:12px}
.full-article h1{font-size:36px;line-height:1.12;margin:16px 0}
.lead{font-size:18px;color:var(--text-lead)}
.full-article h2{margin-top:24px}
.download-box{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px;padding:16px;border-radius:16px;background:var(--card-2-inset);border:1px solid var(--line)}
.download-box a{margin-left:auto;background:var(--red);color:#fff;border-radius:10px;padding:9px 12px;font-weight:800}
.text-only pre{background:#20242b;color:#edf2f7;border-radius:14px;padding:16px;overflow:auto}
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.filter-bar button{border:0;border-radius:999px;padding:10px 14px;background:var(--card);color:var(--text-2);box-shadow:var(--soft-shadow);font-weight:800;cursor:pointer}
.filter-bar .is-active{background:var(--btn-dark);color:#fff}
.timeline{display:grid;gap:14px}
.timeline div{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--red);border-radius:16px;padding:18px;box-shadow:var(--soft-shadow)}
.timeline time{color:var(--red-text);font-weight:900}
.timeline h3{margin:4px 0}
.timeline p{margin:0;color:var(--muted)}
.profile-hero{display:flex;gap:18px;align-items:center;background:linear-gradient(135deg,#2f323a,#20242b);color:#fff;border-radius:20px;padding:24px;box-shadow:var(--shadow)}
.profile-hero img{width:110px;height:110px;border-radius:50%;background:#fff}
.profile-hero span{color:#ffb3a6;text-transform:uppercase;font-weight:900;font-size:12px;letter-spacing:.12em}
.profile-hero h1{margin:4px 0;font-size:38px}
.profile-hero p{margin:0;color:#d8dee9}
.footer{margin:0 24px;padding:18px;border-top:1px solid var(--line);color:var(--text-meta);text-align:center}
.footer p{margin:4px 0}
@media (max-width:1020px){
  .topbar{flex-wrap:wrap}
  .menu-toggle{display:block;margin-left:auto}
  .nav-links,.search{display:none;width:100%}
  .nav-links.is-open{display:grid;grid-template-columns:repeat(2,1fr)}
  .search.is-open{display:flex}
  .brand{min-width:auto}
  .layout{grid-template-columns:minmax(0,1fr)}
  .sidebar{grid-template-columns:repeat(3,1fr);display:grid}
}
@media (max-width:720px){
  .site-shell{width:100%}
  .layout{padding-left:14px;padding-right:14px}
  .cards-grid,.sidebar{grid-template-columns:1fr}
  .topbar{position:relative}
  .search input{width:100%}
  .nav-links.is-open{grid-template-columns:1fr}
  .article-cover{height:240px}
  .article-body{padding:20px}
  .full-article h1{font-size:28px}
  .profile-hero{align-items:flex-start;flex-direction:column}
  .card-cover{height:190px}
}

/* Навигация */
.nav-links a.is-current{background:rgba(255,255,255,.1);color:#fff}
.user-nav{display:flex;align-items:center;gap:8px}
.nav-write{padding:9px 12px;border-radius:12px;background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;font-weight:800;font-size:13px;white-space:nowrap;box-shadow:0 8px 20px rgba(220,78,60,.3)}
.nav-avatar{position:relative;display:block;width:38px;height:38px;border-radius:50%;border:2px solid rgba(255,255,255,.18)}
.nav-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;background:#fff}
.nav-badge{position:absolute;top:-6px;right:-8px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--cyan);color:#fff;font-size:11px;display:grid;place-items:center}
.nav-lang{display:grid;place-items:center;min-width:38px;height:38px;padding:0 8px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#fff;font-weight:800;font-size:12px;letter-spacing:.04em}
.nav-lang:hover{border-color:rgba(255,255,255,.3)}
.nav-login{padding:9px 13px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#fff;font-weight:800;font-size:13px}
.nav-links{flex-wrap:nowrap}
.nav-links a,.nav-drop summary{white-space:nowrap}
.brand{min-width:0}

/* Сообщения */
.messages{display:grid;gap:8px;padding:16px 24px 0}
.message{position:relative;padding:12px 42px 12px 16px;border-radius:14px;background:var(--card);border:1px solid var(--line);border-left:5px solid var(--cyan);box-shadow:var(--soft-shadow)}
.message.success{border-left-color:var(--green)}
.message.error{border-left-color:var(--red);color:var(--error-text)}
.message.warning{border-left-color:#f0a500}
.message-close{position:absolute;top:8px;right:10px;border:0;background:transparent;font-size:20px;line-height:1;color:var(--muted);cursor:pointer}

/* Обложка материала и ссылки «ещё» */
.article-cover{object-position:left top}
.more-link{margin:18px 0 26px;text-align:center}

/* Карточки */
.card-kicker small{font-weight:600;letter-spacing:.04em;color:var(--muted);text-transform:none}

/* Кнопки */
button.btn,.btn{border:0;cursor:pointer;font:inherit;font-weight:800}
.btn.light{background:var(--card);color:var(--text);border:1px solid var(--line);box-shadow:var(--soft-shadow)}
.btn.light:hover{border-color:rgba(220,78,60,.35)}
.btn.link{background:transparent;color:var(--muted);padding-left:6px;padding-right:6px}
.btn.link:hover{color:var(--red-text)}
.btn.link.danger,.manage-actions .danger{color:var(--red-text)}
.btn.primary.danger-btn{background:linear-gradient(135deg,#b8321f,var(--red))}
.small-btn{border:0;cursor:pointer;font:inherit;font-weight:800;font-size:13px}
.small-btn:hover{background:var(--red)}
.small-btn.danger{background:var(--tint-red-btn);color:var(--tint-red-text)}
.small-btn.danger:hover{background:var(--red);color:#fff}
.small-btn.light-on-dark{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2)}

/* Ленты, фильтры, сортировка */
.filter-bar a{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:10px 14px;background:var(--card);color:var(--text-2);box-shadow:var(--soft-shadow);font-weight:800}
.filter-bar a:hover{color:var(--red-text)}
.filter-bar a.is-active{background:var(--btn-dark);color:#fff}
.filter-bar small{font-size:11px;opacity:.7}
.list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:-4px 0 16px}
.search-summary{margin:0;color:var(--muted)}
.search-summary a{color:var(--red-text);font-weight:700}
.sort-links{display:flex;gap:4px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:4px}
.sort-links a{padding:6px 10px;border-radius:9px;font-size:13px;font-weight:700;color:var(--muted)}
.sort-links a.is-active{background:var(--card-2-btn);color:var(--text)}
.empty-state{background:var(--card);border:1px dashed var(--line-dashed);border-radius:18px;padding:30px;text-align:center;color:var(--muted)}
.empty-state h3,.empty-state h1{color:var(--text);margin:0 0 6px}
.empty-state.big{padding:48px 30px}
.empty-state.big h1{font-size:34px;line-height:1.15;margin:14px 0 10px}
.empty-state code{background:var(--card-2);padding:2px 6px;border-radius:6px;color:var(--text)}
.inline-search{display:flex;gap:8px;max-width:440px;margin:18px auto}
.inline-search input{flex:1}

/* Пагинация */
.pagination{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:22px 0 6px}
.pagination a,.pagination span{min-width:40px;padding:9px 12px;border-radius:11px;background:var(--card);border:1px solid var(--line);text-align:center;font-weight:800;color:var(--text-2)}
.pagination a:hover{border-color:var(--red);color:var(--red-text)}
.pagination .is-current{background:var(--btn-dark);border-color:var(--btn-dark);color:#fff}
.pagination .gap{background:transparent;border-color:transparent}

/* Статья */
.status-banner{margin:0 0 14px;padding:13px 16px;border-radius:14px;background:var(--banner-yellow);border:1px solid var(--banner-yellow-line);color:var(--banner-yellow-text)}
.status-banner.status-pending{background:var(--banner-cyan);border-color:var(--tint-cyan-line);color:var(--banner-cyan-text)}
.status-banner.status-rejected{background:var(--banner-red);border-color:var(--tint-red-line);color:var(--error-text)}
.status-banner.status-original{background:var(--banner-blue);border-color:var(--banner-blue-line);color:var(--banner-blue-text)}
.status-banner.status-scheduled{background:var(--banner-indigo);border-color:var(--tint-indigo-line);color:var(--banner-indigo-text)}
.article-labels a{padding:6px 9px;border-radius:999px;background:var(--tint-red);color:var(--red-text);font-weight:800;font-size:12px}
.article-labels a.tag-label{background:var(--card-2);color:var(--card-2-text)}
.article-labels a:hover{background:var(--red);color:#fff}
.article-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 16px;color:var(--muted);font-size:14px;margin:-4px 0 14px}
.article-author{display:inline-flex;align-items:center;gap:8px;color:var(--text);font-weight:800}
.article-author img{width:30px;height:30px;border-radius:50%;object-fit:cover}
.article-author:hover{color:var(--red-text)}
.article-toc{margin:18px 0;padding:14px 18px;border-radius:14px;background:var(--card-2-inset);border:1px solid var(--line)}
.article-toc summary{cursor:pointer;font-weight:900;color:var(--text)}
.article-toc ul{margin:8px 0 0;padding-left:18px}
.article-toc li{margin:3px 0}
.article-toc a{color:var(--card-2-text)}
.article-toc a:hover{color:var(--red-text)}
.article-content{font-size:16px;overflow-wrap:break-word}
/* Заголовки разделов выделены, чтобы длинное описание легко пробегать глазами:
   h2 — серая плашка с красной полосой слева (цитата — розовая, не путаются), h3 — красный маркер */
.article-content h2{margin:30px 0 14px;padding:10px 16px;border-left:4px solid var(--red);border-radius:4px 12px 12px 4px;
  background:var(--card-2-inset);color:var(--heading);font-size:22px;line-height:1.3;scroll-margin-top:80px}
.article-content h3{position:relative;margin:24px 0 10px;padding-left:18px;color:var(--heading);font-size:18px;line-height:1.35;
  scroll-margin-top:80px}
.article-content h3::before{content:"";position:absolute;left:0;top:.42em;width:8px;height:8px;border-radius:2px;background:var(--red)}
.article-content > h2:first-child,.article-content > h3:first-child{margin-top:4px}
.article-content a{color:var(--red-text);text-decoration:underline;text-underline-offset:3px}
.article-content img{border-radius:14px;margin:14px auto;box-shadow:var(--soft-shadow)}
.article-content blockquote{margin:18px 0;padding:12px 18px;border-left:4px solid var(--red);background:var(--tint-red-soft);border-radius:0 12px 12px 0;color:var(--text-soft)}
.article-content blockquote p{margin:0}
.article-content code{background:var(--card-2);padding:2px 6px;border-radius:6px;font-size:.92em}
.article-content pre{background:#20242b;color:#edf2f7;border-radius:14px;padding:16px;overflow:auto}
.article-content pre code{background:transparent;padding:0;color:inherit}
.article-content table{width:100%;border-collapse:collapse;margin:16px 0;font-size:15px;display:block;overflow-x:auto}
.article-content th,.article-content td{padding:9px 12px;border:1px solid var(--line);text-align:left}
.article-content th{background:var(--card-2-inset)}
.article-content hr{border:0;border-top:1px solid var(--line);margin:24px 0}
.text-only ul{padding-left:20px}
.article-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.vote-box{display:flex;gap:6px}
.vote-btn,.bookmark-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--card);border-radius:12px;padding:9px 14px;font:inherit;font-weight:800;color:var(--text-2);cursor:pointer;transition:.18s ease}
.vote-btn:hover,.bookmark-btn:hover{border-color:rgba(220,78,60,.4);color:var(--red-text)}
.vote-btn.like:hover{border-color:rgba(40,167,69,.5);color:var(--green)}
.vote-btn.like.is-active{background:var(--green);border-color:var(--green);color:#fff}
.vote-btn.dislike.is-active{background:var(--red);border-color:var(--red);color:#fff}
.bookmark-btn.is-active{background:var(--tint-yellow-btn);border-color:var(--tint-yellow-line);color:var(--tint-yellow-text)}
.owner-actions{display:flex;gap:8px;margin-left:auto}

/* Комментарии */
.comments{margin:20px 0;background:var(--card);border-radius:20px;border:1px solid var(--line);box-shadow:var(--soft-shadow);padding:22px}
.comments>h2{margin:0 0 14px;display:flex;align-items:center;gap:10px}
.comments>h2 b{font-size:14px;background:var(--tint-red);color:var(--red-text);padding:3px 10px;border-radius:99px}
.comment{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--line)}
.comment:first-of-type{border-top:0}
.comment.is-reply{grid-template-columns:34px 1fr;margin-top:12px;padding:12px 0 0 14px;border-top:0;border-left:2px solid var(--tint-red-reply)}
.comment-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:var(--card-2)}
.comment.is-reply .comment-avatar{width:34px;height:34px}
.comment-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}
.comment-head a{font-weight:800}
.comment-head a:hover{color:var(--red-text)}
.comment-head time{color:var(--muted);font-size:12px}
.comment-badge{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;background:var(--red);color:#fff;border-radius:99px;padding:2px 7px}
.comment-text{margin:4px 0 6px;overflow-wrap:anywhere}
.comment-actions{display:flex;gap:12px;align-items:center}
.comment-actions button{border:0;background:transparent;padding:0;font:inherit;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer}
.comment-actions button:hover{color:var(--red-text)}
.comment:target>.comment-body{background:var(--tint-yellow-mark);border-radius:10px}
.comment-form{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.reply-to{margin-bottom:8px;font-size:14px;color:var(--muted)}
.reply-to button{border:0;background:transparent;color:var(--red-text);font:inherit;font-weight:700;cursor:pointer}
.muted{color:var(--muted)}
.muted a{color:var(--red-text);font-weight:700}
.how-list b{color:var(--muted);font-weight:700;text-align:right}
.inline-form{display:inline;margin:0}

/* Формы */
.form-card{background:var(--card);border-radius:20px;border:1px solid var(--line);box-shadow:var(--soft-shadow);padding:24px}
.form-card.narrow{max-width:520px}
.form-card h3{margin-top:0}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;min-width:0}
.field>label{font-weight:800;font-size:14px}
.field .req{color:var(--red-text)}
.field input[type=text],.field input[type=email],.field input[type=url],.field input[type=password],.field input[type=search],
.field input[type=datetime-local],.field input[type=number],.field select,.field textarea,.inline-search input,.moderation-form input{
  width:100%;border:1px solid var(--field-line);border-radius:12px;background:var(--field);padding:11px 13px;font:inherit;color:var(--text);outline:0;transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus,.field textarea:focus,.inline-search input:focus,.moderation-form input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(20,173,196,.15);background:var(--field-focus)}
.field textarea{resize:vertical;min-height:90px}
.field input[type=file]{font:inherit;font-size:14px}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--red)}
.field .help{color:var(--muted);font-size:13px}
.field-error{color:var(--field-error);font-size:13px;font-weight:700}
.field ul{list-style:none;margin:0;padding:0}
.field-check>label{display:flex;align-items:center;gap:8px;font-weight:700;cursor:pointer}
.field-check input{width:18px;height:18px;accent-color:var(--red)}
.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.field-row.three{grid-template-columns:1.3fr 1fr .6fr}
.field-row .field-check{justify-content:flex-end;padding-bottom:12px}
.field-group{border:1px solid var(--line);border-radius:16px;padding:16px 16px 2px;margin:0 0 16px}
.field-group legend{padding:0 8px;font-weight:900;color:var(--red-text);text-transform:uppercase;letter-spacing:.1em;font-size:12px}
.form-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.counter{align-self:flex-end;font-size:12px;color:var(--muted)}
.profile-edit-head{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.profile-edit-head .avatar-lg{margin:0}
.profile-edit-head p{margin:2px 0 0}
.profile-edit-head a{color:var(--red-text)}
.danger-card{border-color:var(--tint-red-line)}

/* Обложки */
.cover-current img{width:100%;height:220px;object-fit:cover;object-position:center top;border-radius:14px;margin-bottom:14px;background:#151922}
.preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.preset{position:relative;display:block;border-radius:12px;overflow:hidden;border:2px solid transparent;cursor:pointer;background:#151922}
.preset input{position:absolute;opacity:0;pointer-events:none}
.preset img{width:100%;height:70px;object-fit:cover;opacity:.85;transition:opacity .15s}
.preset span{display:block;padding:5px 8px;font-size:12px;font-weight:800;color:#fff;background:#20242b}
.preset:hover img{opacity:1}
.preset:has(input:checked){border-color:var(--red);box-shadow:0 0 0 3px rgba(220,78,60,.18)}
.preset:has(input:focus-visible){outline:2px solid var(--cyan)}

/* Редактор Markdown — общий с панелью управления: static/css/markdown-editor.css. Ниже — восстановление черновика */
.draft-restore{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;padding:12px 14px;border-radius:12px;background:var(--banner-indigo);border:1px solid var(--tint-indigo-line);color:var(--banner-indigo-text)}
.draft-restore button{border:0;border-radius:9px;padding:6px 10px;font:inherit;font-weight:800;cursor:pointer;background:#323a8c;color:#fff}
.draft-restore button+button{background:transparent;color:var(--banner-indigo-text)}
.md-help pre{margin:0 0 10px;background:#20242b;color:#edf2f7;border-radius:12px;padding:12px;font-size:12px;line-height:1.55;overflow:auto}
/* Редактор Markdown в тёмной теме сайта: его переменные --md-* и цвета предпросмотра — из токенов сайта.
   В markdown-editor.css тёмных правил нет: панель управления не подключает site.css и остаётся светлой. */
:root[data-theme="dark"] .md-editor{--md-line:var(--field-line);--md-soft:var(--card-2);--md-field:var(--field);--md-text:var(--text);--md-muted:var(--muted);--md-dark:var(--btn-dark);--md-red:var(--red-text);--md-red-soft:var(--tint-red)}
:root[data-theme="dark"] .md-editor-bar button{color:var(--text-2)}
:root[data-theme="dark"] .md-editor-bar button:hover{background:var(--card);color:var(--md-red)}
:root[data-theme="dark"] .md-editor-bar button[aria-pressed="true"]{background:var(--md-dark);color:#fff}
:root[data-theme="dark"] .md-editor-bar button:disabled{background:none;color:var(--text-2)}
:root[data-theme="dark"] .md-editor .md-editor-preview,:root[data-theme="dark"] .md-editor-foot{background:var(--card)}
:root[data-theme="dark"] .md-editor .md-editor-preview h2,:root[data-theme="dark"] .md-editor .md-editor-preview h3{color:var(--heading)}
:root[data-theme="dark"] .md-editor .md-editor-preview blockquote{background:var(--tint-red-soft);color:var(--text-soft)}
:root[data-theme="dark"] .md-editor .md-editor-preview th,:root[data-theme="dark"] .md-editor .md-editor-preview td,:root[data-theme="dark"] .md-editor .md-editor-preview hr{border-color:var(--line)}
:root[data-theme="dark"] .md-editor .md-editor-preview th{background:var(--card-2-inset)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .md-editor{--md-line:var(--field-line);--md-soft:var(--card-2);--md-field:var(--field);--md-text:var(--text);--md-muted:var(--muted);--md-dark:var(--btn-dark);--md-red:var(--red-text);--md-red-soft:var(--tint-red)}
  :root:not([data-theme="light"]) .md-editor-bar button{color:var(--text-2)}
  :root:not([data-theme="light"]) .md-editor-bar button:hover{background:var(--card);color:var(--md-red)}
  :root:not([data-theme="light"]) .md-editor-bar button[aria-pressed="true"]{background:var(--md-dark);color:#fff}
  :root:not([data-theme="light"]) .md-editor-bar button:disabled{background:none;color:var(--text-2)}
  :root:not([data-theme="light"]) .md-editor .md-editor-preview,:root:not([data-theme="light"]) .md-editor-foot{background:var(--card)}
  :root:not([data-theme="light"]) .md-editor .md-editor-preview h2,:root:not([data-theme="light"]) .md-editor .md-editor-preview h3{color:var(--heading)}
  :root:not([data-theme="light"]) .md-editor .md-editor-preview blockquote{background:var(--tint-red-soft);color:var(--text-soft)}
  :root:not([data-theme="light"]) .md-editor .md-editor-preview th,:root:not([data-theme="light"]) .md-editor .md-editor-preview td,:root:not([data-theme="light"]) .md-editor .md-editor-preview hr{border-color:var(--line)}
  :root:not([data-theme="light"]) .md-editor .md-editor-preview th{background:var(--card-2-inset)}
}

/* Кабинет автора */
.cabinet-nav{display:flex;align-items:center;gap:2px;flex-wrap:wrap;margin:6px 0 14px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--soft-shadow)}
.cabinet-nav a,.cabinet-nav button{padding:7px 10px;border-radius:10px;font:inherit;font-size:14px;font-weight:700;color:var(--text-2);border:0;background:transparent;cursor:pointer}
.cabinet-nav a:hover,.cabinet-nav button:hover{color:var(--red-text)}
.cabinet-nav a.is-active{background:var(--btn-dark);color:#fff}
.cabinet-nav b{background:var(--cyan);color:#fff;border-radius:99px;padding:1px 7px;font-size:12px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 16px}
.stats-grid div{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:15px;box-shadow:var(--soft-shadow)}
.stats-grid b{display:block;font-size:24px;color:var(--red-text);line-height:1.2}
.stats-grid span{color:var(--muted);font-size:13px}
.manage-list{display:grid;gap:12px}
.manage-item{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:16px;align-items:center;background:var(--card);border-radius:16px;border:1px solid var(--line);padding:12px;box-shadow:var(--soft-shadow)}
.manage-thumb img{width:120px;height:76px;object-fit:cover;border-radius:12px;background:#151922}
.manage-head{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.manage-head a:hover{color:var(--red-text)}
.manage-main h3{margin:5px 0;font-size:18px;line-height:1.25}
.manage-main h3 a:hover{color:var(--red-text)}
.manage-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--text-meta)}
.manage-note{margin:4px 0;font-size:14px;color:var(--error-text)}
.manage-excerpt{margin:4px 0 8px;color:var(--muted);font-size:14px}
.manage-actions{display:flex;flex-direction:column;align-items:flex-end;gap:8px;font-size:14px;font-weight:700}
.manage-actions a:not(.small-btn):hover{color:var(--red-text)}
.status-pill{display:inline-flex;padding:3px 9px;border-radius:99px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;background:var(--card-2);color:var(--card-2-text)}
.status-pill.status-published{background:var(--tint-green);color:var(--tint-green-text)}
.status-pill.status-pending{background:var(--tint-cyan);color:var(--tint-cyan-text)}
.status-pill.status-rejected{background:var(--tint-red-pill);color:var(--tint-red-text)}
.status-pill.status-scheduled{background:var(--tint-indigo);color:var(--tint-indigo-text)}
.moderation-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.moderation-form input{flex:1 1 220px;padding:8px 11px}

/* Сайдбар и прочее */
.tag-cloud{display:flex;flex-wrap:wrap;gap:6px}
.tag-cloud a{padding:5px 9px;border-radius:99px;background:var(--card-2);font-size:13px;font-weight:700;color:var(--card-2-text)}
.tag-cloud a:hover{background:var(--red);color:#fff}
.side-list li span{color:var(--text)}
.side-list li span.rank-chip{color:#313746}  /* звание на цветной плашке: тёмный текст в обеих темах */
.timeline-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.timeline-list li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.timeline-list li>a{font-weight:700}
.timeline-list a:hover{color:var(--red-text)}
.timeline-list small{color:var(--muted)}
.profile-hero .profile-link{color:#ffb3a6}
.profile-hero img{object-fit:cover}
.profile-hero p+p{margin-top:10px}
.footer-links a,.footer-langs a{color:var(--red-text)}
.layout.single{grid-template-columns:minmax(0,1fr)}

@media (max-width:1020px){
  .user-nav{display:none;width:100%;justify-content:flex-start}
  .user-nav.is-open{display:flex}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  .messages{padding:14px 14px 0}
  .field-row,.field-row.three{grid-template-columns:1fr}
  .manage-item{grid-template-columns:1fr}
  .manage-thumb img{width:100%;height:140px}
  .manage-actions{flex-direction:row;align-items:center;justify-content:flex-start;flex-wrap:wrap}
  .owner-actions{margin-left:0}
  .form-card{padding:18px}
  .comments{padding:16px}
  .list-toolbar{align-items:flex-start}
}

/* ===== Дерево категорий, файлы, галерея, AJAX-комментарии, уведомления ===== */

/* Меню «Игры» */
.nav-drop{position:relative}
.nav-drop summary{list-style:none;padding:12px 10px;border-radius:10px;color:#d9e0ea;font-size:14px;cursor:pointer;user-select:none}
.nav-drop summary::-webkit-details-marker{display:none}
.nav-drop summary:hover,.nav-drop[open] summary{background:rgba(255,255,255,.08);color:#fff}
.nav-drop-panel{position:absolute;top:calc(100% + 8px);left:0;z-index:40;display:grid;grid-template-columns:repeat(2,minmax(170px,1fr));gap:6px 18px;min-width:400px;padding:16px;border-radius:16px;background:#262a33;border:1px solid rgba(255,255,255,.1);box-shadow:0 22px 50px rgba(0,0,0,.4)}
.nav-drop-group{display:flex;flex-direction:column;gap:2px}
.nav-drop-group a{padding:4px 8px;border-radius:8px;color:#b9c3d2;font-size:13px}
.nav-drop-group a:hover{background:rgba(255,255,255,.08);color:#fff}
.nav-drop-group .nav-drop-title{color:#fff;font-weight:800;font-size:14px}
.nav-bell{position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);font-size:16px}
.nav-bell.has-unread{border-color:rgba(255,90,66,.6)}
.nav-badge{background:var(--red)}
.nav-badge.cyan{background:var(--cyan)}
.nav-bell .nav-badge{position:absolute;top:-6px;right:-8px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;color:#fff;font-size:11px;display:grid;place-items:center}
/* Переключатель темы: в светлой теме — луна, в тёмной — солнце */
.nav-theme{display:grid;place-items:center;flex:none;width:38px;height:38px;margin:0;padding:0;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#fff;font:inherit;font-size:16px;cursor:pointer}
.nav-theme:hover{border-color:rgba(255,255,255,.3)}
.nav-theme:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.nav-theme .theme-icon-light{display:none}
:root[data-theme="dark"] .nav-theme .theme-icon-dark{display:none}
:root[data-theme="dark"] .nav-theme .theme-icon-light{display:block}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .nav-theme .theme-icon-dark{display:none}
  :root:not([data-theme="light"]) .nav-theme .theme-icon-light{display:block}
}

/* Шапка категории */
.category-hero{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap;margin:0 0 16px;padding:26px;min-height:180px;border-radius:20px;overflow:hidden;color:#fff;background:#151922 var(--cover) center/cover no-repeat;box-shadow:var(--shadow)}
.category-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,21,28,.94),rgba(18,21,28,.55))}
.category-hero>*{position:relative}
.category-hero span{display:inline-flex;padding:5px 10px;border-radius:99px;background:rgba(220,78,60,.85);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.category-hero h1{display:flex;align-items:center;gap:10px;margin:10px 0 6px;font-size:34px;line-height:1.1}
.category-hero h1 img{width:40px;height:40px;border-radius:10px}
.category-hero p{margin:0;color:#d2d9e6;max-width:560px}
.category-hero-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.category-hero-actions small{color:#c9d2df}
.filter-bar.subcats a img{width:18px;height:18px;border-radius:5px}
.list-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.list-filters input[type=text]{width:160px;border:1px solid var(--line);border-radius:10px;padding:7px 10px;font:inherit;font-size:14px;background:var(--field-focus)}
.check-chip{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer}
.check-chip input{accent-color:var(--red)}
.sort-links{margin-bottom:16px;width:fit-content;max-width:100%}

/* Бейджи «Новое / Обновлено» */
.card-badges-right{display:flex;gap:6px;align-items:center;background:none!important;box-shadow:none!important;padding:0!important}
.card-badges i{font-style:normal;color:#fff;font-weight:800;font-size:12px;padding:6px 9px;border-radius:999px;box-shadow:0 8px 18px rgba(0,0,0,.18)}
.badge-new{background:rgba(20,173,196,.95)}
.badge-updated{background:rgba(240,165,0,.95)}
.article-labels .label-new{background:var(--tint-cyan-label);color:var(--tint-cyan-text)}
.article-labels .label-updated{background:var(--tint-yellow);color:var(--tint-yellow-text)}
.source-line{margin:-6px 0 12px;font-size:14px;color:var(--muted)}
.source-line a{color:var(--red-text);font-weight:700}
.block-title{display:flex;align-items:center;gap:8px;margin-top:28px}
.block-title small{font-size:14px;color:var(--muted)}

/* Файлы */
.files-block{margin:20px 0;background:var(--card);border-radius:20px;border:1px solid var(--line);box-shadow:var(--soft-shadow);padding:20px}
.block-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.block-head h2{margin:0;display:flex;align-items:center;gap:10px}
.block-head h2 b{font-size:14px;background:var(--tint-red);color:var(--red-text);padding:3px 10px;border-radius:99px}
.block-head>div{display:flex;gap:8px}
.small-btn.light{background:var(--card-2-btn);color:var(--text-btn)}
.small-btn.light:hover{background:var(--btn-dark);color:#fff}
.file-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:start;padding:14px 0;border-top:1px solid var(--line)}
.files-block .file-row:first-of-type{border-top:0}
.file-row.is-main .file-icon{background:linear-gradient(135deg,var(--red),#ff8a45);color:#fff}
.file-row.is-pending{opacity:.75}
.file-icon{width:44px;height:44px;border-radius:12px;background:var(--card-2-btn);color:var(--text-2);display:grid;place-items:center;font-size:18px;font-weight:900}
.file-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.file-title b{font-size:16px}
.file-chip{padding:2px 8px;border-radius:99px;background:var(--card-2);color:var(--card-2-text);font-size:11px;font-weight:800}
.file-chip.main{background:var(--tint-red);color:var(--red-text)}
.file-chip.pending{background:var(--tint-cyan);color:var(--tint-cyan-text)}
.file-meta{display:flex;gap:4px 12px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-top:3px}
.file-meta a{color:var(--text);font-weight:700}
.file-changelog{margin-top:6px;font-size:14px}
.file-changelog summary{cursor:pointer;color:var(--red-text);font-weight:700}
.file-changelog div{margin-top:6px;padding:10px 12px;border-radius:10px;background:var(--card-2-inset);color:var(--text-soft)}
.file-actions{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.file-actions .btn{padding:9px 14px;font-size:14px}
.file-manage{font-size:12px;color:var(--muted)}
.file-manage a:hover,.file-manage .danger{color:var(--red-text)}
.file-forms{display:grid;gap:12px;margin-bottom:12px}
.file-form{border:1px dashed var(--line-dashed);border-radius:14px;padding:14px 14px 0;background:var(--field)}
.file-form.has-error{border-color:var(--red)}
.file-form-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.file-form-head small{margin-right:auto}
.file-delete{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--red-text);cursor:pointer}
.manage-thumb.file-thumb{width:120px;height:76px;border-radius:12px;background:var(--card-2-btn);display:grid;place-items:center;font-size:26px;color:var(--text-2)}

/* Скриншоты и просмотр */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:12px 0}
.gallery a{display:block;border-radius:12px;overflow:hidden;background:#151922;aspect-ratio:16/10}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.gallery a:hover img{transform:scale(1.05)}
.lightbox{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;gap:12px;padding:20px;background:rgba(10,12,16,.92)}
.lightbox[hidden]{display:none}
.lightbox figure{margin:0;max-width:min(1200px,88vw);text-align:center}
.lightbox img{max-height:82vh;margin:0 auto;border-radius:12px}
.lightbox figcaption{color:#c9d2df;margin-top:10px;font-size:14px}
.lightbox button{border:0;background:rgba(255,255,255,.1);color:#fff;font-size:30px;width:48px;height:48px;border-radius:50%;cursor:pointer}
.lightbox button:hover{background:var(--red)}
.lightbox .lb-close{position:absolute;top:16px;right:16px}
.no-scroll{overflow:hidden}
.shots-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;margin-bottom:10px}
.shots-grid:empty{display:none}
.shot-thumb{position:relative;display:block;border-radius:10px;overflow:hidden;background:#151922;cursor:pointer}
.shot-thumb img{width:100%;height:72px;object-fit:cover}
.shot-thumb span{position:absolute;inset:auto 0 0;padding:3px 6px;font-size:11px;font-weight:800;color:#fff;background:rgba(0,0,0,.6)}
.shot-thumb input{position:absolute;top:6px;left:6px;accent-color:var(--red)}
.shot-thumb:has(input:checked){outline:3px solid var(--red)}
.shot-thumb:has(input:checked) img{opacity:.4}
.shot-thumb.is-new{outline:2px dashed var(--cyan)}

/* Дерево комментариев */
.comment{grid-template-columns:42px minmax(0,1fr)}
.comment-replies:empty{display:none}
.comment-replies{margin-top:4px}
.comment.is-reply{margin-top:10px}
.comment.is-new>.comment-body{animation:comment-flash 2.6s ease}
@keyframes comment-flash{0%{background:var(--tint-yellow-flash)}100%{background:transparent}}
.comment.is-removing{opacity:0;transform:translateX(12px);transition:.25s ease}
.comment-body{border-radius:10px;padding:2px 4px}
.comment-time{color:var(--muted);font-size:12px}
.comment-edited{font-size:11px;color:var(--muted);font-style:italic}
.comment-vote{display:inline-flex;align-items:center;gap:4px;margin-right:4px}
.comment-vote button{border:1px solid var(--line)!important;border-radius:7px;padding:1px 7px!important;background:var(--card)!important;font-size:11px!important}
.comment-vote button.is-active{background:var(--btn-dark)!important;color:#fff!important;border-color:var(--btn-dark)!important}
.comment-vote button.is-active[value="1"]{background:var(--green)!important;border-color:var(--green)!important}
.comment-vote button.is-active[value="-1"]{background:var(--red)!important;border-color:var(--red)!important}
.comment-vote b{min-width:18px;text-align:center;font-size:13px;color:var(--muted)}
.comment-vote b.pos{color:var(--green)}
.comment-vote b.neg{color:var(--red-text)}
.comment-vote.static b{font-size:12px}
.comment-edit textarea{width:100%;border:1px solid var(--cyan);border-radius:10px;padding:9px 11px;background:var(--field-focus);font:inherit;resize:vertical}
.comment-edit-actions{display:flex;gap:8px;align-items:center;margin:6px 0}
.comment-form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.form-error{color:var(--field-error);font-weight:700}
.comment .comment-form{margin:10px 0 6px;padding:12px;border:1px dashed var(--line-dashed);border-radius:14px;background:var(--field)}
.is-online{box-shadow:0 0 0 2px var(--card),0 0 0 4px var(--green)!important}

/* Сайдбар: дерево, вкладки, топы, последние комментарии, онлайн */
.cat-tree{list-style:none;margin:0;padding:0}
.cat-tree .cat-tree{padding-left:14px;border-left:1px dashed var(--line);margin-left:6px}
.cat-tree li{margin:1px 0}
.cat-tree summary,.cat-tree .leaf{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 6px;border-radius:9px;cursor:pointer}
.cat-tree summary{list-style:none}
.cat-tree summary::-webkit-details-marker{display:none}
.cat-tree summary::before{content:"▸";color:var(--muted);font-size:11px;transition:transform .15s}
.cat-tree details[open]>summary::before{transform:rotate(90deg)}
.cat-tree .leaf::before{content:"•";color:var(--faint-2);font-size:11px}
.cat-tree summary a,.cat-tree .leaf a{flex:1;display:flex;align-items:center;gap:6px}
.cat-tree img{width:18px;height:18px;border-radius:5px}
.cat-tree a:hover{color:var(--red-text)}
.cat-tree b{color:var(--red-text);font-size:12px}
.cat-tree li.is-current>details>summary,.cat-tree li.is-current>.leaf{background:var(--tint-red);font-weight:800}
.tabs{display:flex;gap:4px;background:var(--card-2);border-radius:10px;padding:3px;margin-bottom:8px}
.tabs button{flex:1;border:0;background:transparent;border-radius:8px;padding:6px;font:inherit;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer}
.tabs button.is-active{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.top-list{margin:0;padding-left:20px}
.top-list li{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px solid var(--line)}
.top-list li:last-child{border-bottom:0}
.top-list a:hover{color:var(--red-text)}
.top-list b{color:var(--green);font-size:12px;white-space:nowrap}
.top-list li.muted{list-style:none;margin-left:-20px}
.last-comments{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.last-comments li{display:grid;grid-template-columns:30px 1fr;gap:9px}
.last-comments img{width:30px;height:30px;border-radius:50%;object-fit:cover}
.last-comments div{display:flex;flex-direction:column;min-width:0}
.lc-author{font-weight:800;font-size:13px}
.lc-text{font-size:13px;color:var(--text-soft);overflow-wrap:anywhere}
.lc-text:hover,.lc-author:hover{color:var(--red-text)}
.last-comments small{color:var(--muted);font-size:11px}
.online-summary{margin:0 0 10px;color:var(--muted);font-size:13px}
.online-summary b{color:var(--text)}
.online-list{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.online-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:3px 10px 3px 3px;border-radius:99px;background:var(--card-2);font-size:13px;font-weight:700;color:var(--text-2)}
.online-chip:hover{background:var(--btn-dark);color:#fff}
.online-chip img{width:22px;height:22px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px var(--green)}
.online-list .muted{font-size:12px}
.online-label{margin:12px 0 6px;color:var(--muted);font-size:12px;font-weight:700}
.online-chip.is-bot{gap:5px;padding:3px 10px 3px 7px;background:var(--tint-cyan);color:var(--tint-cyan-text);cursor:default}
.online-chip.is-bot:hover{background:var(--tint-cyan);color:var(--tint-cyan-text)}
.online-chip.is-bot .icon{width:14px;height:14px}
.side-card h3 small{font-size:13px;font-weight:700}

/* Профиль */
.profile-hero img.is-online{box-shadow:0 0 0 3px #2f323a,0 0 0 6px var(--green)!important}
.profile-hero-main{min-width:0}
.profile-facts{margin-top:8px!important;font-size:14px;color:#b9c3d2!important}
.online-dot{color:#7ee59a}
.profile-actions{display:flex;gap:8px;margin-top:12px}
.small-btn.accent{background:linear-gradient(135deg,var(--red),var(--red2))}
.profile-stats{margin-top:16px}
.profile-comments{display:grid;gap:10px}
.profile-comment{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--soft-shadow)}
.pc-article{display:block;font-weight:800;color:var(--red-text);margin-bottom:4px}

/* Уведомления */
.notification-list{display:grid;gap:8px}
.notification{display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;box-shadow:var(--soft-shadow)}
.notification.is-unread{border-left:4px solid var(--red);background:var(--tint-red-unread)}
.notification img{width:38px;height:38px;border-radius:50%;object-fit:cover}
.notification p{margin:0}
.notification a:hover{color:var(--red-text)}
.notification-remove{border:0;background:transparent;font-size:20px;color:var(--muted);cursor:pointer}
.notification-remove:hover{color:var(--red-text)}

/* Прочее */
.toast-box{position:fixed;right:18px;bottom:18px;z-index:120;display:grid;gap:8px}
.toast{padding:12px 16px;border-radius:12px;background:#20242b;color:#fff;box-shadow:0 14px 30px rgba(0,0,0,.3);font-size:14px;max-width:340px;transition:opacity .4s ease,transform .4s ease}
.toast.is-hiding{opacity:0;transform:translateY(8px)}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.live-hint{font-size:13px;font-weight:700}
.live-hint.ok{color:var(--green)}
.live-hint.bad{color:var(--field-error)}

@media (max-width:1020px){
  .nav-drop-panel{position:static;min-width:0;grid-template-columns:1fr;margin-top:6px}
}
@media (max-width:720px){
  .file-row{grid-template-columns:36px minmax(0,1fr)}
  .file-actions{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between}
  .category-hero{padding:20px}
  .category-hero h1{font-size:26px}
  .notification{grid-template-columns:32px 1fr auto}
}

/* ===== Типы материалов, платформы, курсы ===== */
.platform-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.platform-chips span,.platform-chips a{display:inline-flex;align-items:center;gap:4px;padding:3px 9px 3px 7px;border-radius:99px;background:var(--card-2);color:var(--card-2-text);font-size:12px;font-weight:700}
.platform-chips .icon{width:14px;height:14px}
.platform-chips a:hover{background:var(--btn-dark);color:#fff}
.article-labels .label-kind{background:var(--btn-dark);color:#fff}
/* Ячейки тянутся на всю строку — без пустых серых клеток в конце */
.app-info{display:flex;flex-wrap:wrap;gap:1px;margin:16px 0;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--line)}
.app-info>div{flex:1 1 140px;background:var(--field);padding:10px 14px}
.app-info>div.wide{flex-basis:260px}
.app-info .icon{width:14px;height:14px}
.app-info .platform-chips a{color:var(--card-2-text)}
.app-info .platform-chips a:hover{color:#fff}
.app-info dt{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.app-info dd{margin:2px 0 0;font-weight:700}
.app-info dd.platform-chips{margin-top:4px}
.app-info a{color:var(--red-text)}
.choice-chips{display:flex;flex-wrap:wrap;gap:6px}
.chip-option{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:99px;border:1px solid var(--line);background:var(--card);font-size:14px;font-weight:700;cursor:pointer}
.chip-option input{accent-color:var(--red)}
.chip-option:has(input:checked){border-color:var(--red);background:var(--tint-red);color:var(--tint-red-text)}
.field-row.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.file-hash{margin-top:4px;font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.file-hash code{background:var(--card-2);padding:1px 5px;border-radius:5px}
.file-platform{font-weight:800;color:var(--text)}

.progress{height:8px;border-radius:99px;background:var(--track);overflow:hidden;margin:6px 0}
.progress span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--green),#5ad47a);transition:width .4s ease}
.progress.big{height:12px}
.course-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-bottom:18px}
.course-card{background:var(--card);border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--soft-shadow);display:flex;flex-direction:column;transition:transform .2s ease}
.course-card:hover{transform:translateY(-3px)}
.course-cover{position:relative;display:block;height:130px;background:#151922}
.course-cover img{width:100%;height:100%;object-fit:cover;object-position:left top}
.level-chip{position:absolute;left:10px;top:10px;padding:4px 9px;border-radius:99px;font-size:11px;font-weight:800;color:#fff;background:rgba(40,167,69,.94)}
.level-chip.level-middle{background:rgba(240,165,0,.95)}
.level-chip.level-advanced{background:rgba(220,78,60,.95)}
.course-body{padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.course-body h3{margin:2px 0;font-size:18px;line-height:1.25}
.course-body h3 a:hover{color:var(--red-text)}
.course-body p{margin:0;color:var(--text-desc);font-size:14px}
.course-meta{display:flex;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-top:4px}
.my-courses{margin:-4px 0 16px;font-size:14px;color:var(--muted)}
.my-courses a{color:var(--red-text);font-weight:700}
.course-hero-meta{margin-top:8px!important;font-size:14px}
.course-hero-meta a{color:#fff;font-weight:700}
.lesson-list{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.lesson-list li{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 14px;box-shadow:var(--soft-shadow)}
.lesson-list li>div{display:flex;flex-direction:column}
.lesson-list a{font-weight:800}
.lesson-list a:hover{color:var(--red-text)}
.lesson-num{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--card-2-btn);font-weight:900;color:var(--text-2)}
.lesson-list li.is-done .lesson-num{background:var(--green);color:#fff}
.lesson-list li.is-current{border-color:var(--red);background:var(--tint-red-current)}
.lesson-list.compact{margin:8px 0 0;gap:4px}
.lesson-list.compact li{padding:6px 10px;box-shadow:none;grid-template-columns:28px 1fr}
.lesson-list.compact .lesson-num{width:26px;height:26px;font-size:12px}
.lesson-list.drafts li{opacity:.75}
.course-nav{margin:0 0 14px;padding:14px 16px;border-radius:16px;background:linear-gradient(135deg,#2f323a,#20242b);color:#fff;box-shadow:var(--soft-shadow)}
.course-nav-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.course-nav-head span{color:#b9c3d2;font-size:14px}
.course-nav .progress{background:rgba(255,255,255,.12)}
.course-nav summary{cursor:pointer;color:#ffb3a6;font-weight:700;font-size:14px}
.course-nav .lesson-list li{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.08)}
.course-nav .lesson-list li.is-current{background:rgba(220,78,60,.25)}
.course-nav .lesson-list a{color:#fff;font-weight:600}
.lesson-nav{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.lesson-nav>a:last-child{justify-self:end}
.rank-progress{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 16px;margin:0 0 16px;box-shadow:var(--soft-shadow)}
.rank-progress>div:first-child{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* ===== Сообщество: звания, репутация, награды, подарки ===== */
.user-badges{display:inline-flex;align-items:center;gap:5px;flex-wrap:wrap}
.rank-chip{display:inline-flex;padding:2px 8px;border-radius:99px;font-size:11px;font-weight:800;color:#fff;background:#8a93a3;white-space:nowrap}
.rank-2{background:#4f9bd9}.rank-3{background:#28a745}.rank-4{background:#14adc4}
.rank-5{background:#a066d3}.rank-6{background:#f0a500}.rank-7{background:linear-gradient(135deg,var(--red),#ff8a45)}
.rep-chip{display:inline-flex;padding:2px 7px;border-radius:99px;font-size:11px;font-weight:800;background:var(--card-2);color:var(--text-meta)}
.rep-chip.pos{background:var(--tint-green);color:var(--tint-green-text)}
.rep-chip.neg{background:var(--tint-red-pill);color:var(--tint-red-text)}
.user-badges.compact .rank-chip,.user-badges.compact .rep-chip{font-size:10px;padding:1px 6px}
.profile-badges{display:flex;align-items:center;gap:8px;margin:4px 0 8px}
.profile-badges small{color:#b9c3d2}
.profile-community{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}
.profile-community h3{display:flex;align-items:center;gap:8px}
.rep-value{font-weight:900;color:var(--text-meta)}
.rep-value.pos{color:var(--green)}
.rep-value.neg{color:var(--red-text)}
.muted-link{display:inline-block;margin-top:8px;font-size:13px;color:var(--red-text);font-weight:700}
.rep-form-box summary{list-style:none;cursor:pointer;width:fit-content}
.rep-form-box summary::-webkit-details-marker{display:none}
.rep-form{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.rep-form input{flex:1 1 180px;border:1px solid var(--field-line);border-radius:10px;padding:7px 10px;background:var(--field-focus);font:inherit;font-size:14px}
.small-btn.plus{background:var(--green)}
.rep-history{display:grid;gap:8px;margin-top:14px}
.rep-row{display:grid;grid-template-columns:44px 36px 1fr;gap:12px;align-items:start;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--green);border-radius:14px;padding:12px;box-shadow:var(--soft-shadow)}
.rep-row.neg{border-left-color:var(--red)}
.rep-row>b{font-size:18px;color:var(--green);text-align:center}
.rep-row.neg>b{color:var(--red-text)}
.rep-row img{width:36px;height:36px;border-radius:50%}
.rep-row p{margin:2px 0}
.rep-row a{font-weight:800}
.award-badge{display:inline-grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fff,#f1e3d3);box-shadow:0 0 0 2px #c98b4d,0 4px 10px rgba(0,0,0,.12)}
.award-badge.size-md{width:40px;height:40px;font-size:20px}
.award-badge.size-lg{width:58px;height:58px;font-size:30px}
.award-badge img{width:70%;height:70%;object-fit:contain}
.award-badge.tier-silver{background:radial-gradient(circle at 30% 30%,#fff,#e2e6ec);box-shadow:0 0 0 2px #9aa4b2,0 4px 10px rgba(0,0,0,.12)}
.award-badge.tier-gold{background:radial-gradient(circle at 30% 30%,#fffbe8,#ffe7a3);box-shadow:0 0 0 2px #e0a800,0 4px 12px rgba(224,168,0,.3)}
.award-badge.tier-platinum{background:radial-gradient(circle at 30% 30%,#fff,#d9f3f7);box-shadow:0 0 0 2px var(--cyan),0 4px 12px rgba(20,173,196,.3)}
.award-badge.tier-diamond{background:radial-gradient(circle at 30% 30%,#fff,#ffe1db);box-shadow:0 0 0 2px var(--red),0 4px 14px rgba(220,78,60,.35)}
.award-shelf,.gift-shelf{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.awards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-bottom:10px}
.award-card{display:grid;grid-template-columns:58px 1fr;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px;box-shadow:var(--soft-shadow);opacity:.62;filter:grayscale(.5)}
.award-card.is-owned{opacity:1;filter:none;border-color:var(--tint-yellow-line);background:var(--tint-yellow-soft)}
.award-card div{display:flex;flex-direction:column;gap:1px;min-width:0}
.award-card small{font-size:12px}
.gift-icon{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:18px;background:linear-gradient(135deg,var(--card),var(--tint-red));font-size:36px;box-shadow:var(--soft-shadow)}
.gift-icon.sm{width:40px;height:40px;font-size:22px;border-radius:12px}
.gift-icon img{width:75%;height:75%;object-fit:contain}
.gift-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin-bottom:12px}
.gift-card,.gift-option{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 8px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--soft-shadow);text-align:center}
.gift-card small,.gift-option small{color:var(--red-text);font-weight:800}
.gift-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-bottom:16px}
.gift-option{position:relative;cursor:pointer;transition:transform .15s}
.gift-option input{position:absolute;opacity:0}
.gift-option:hover{transform:translateY(-2px)}
.gift-option:has(input:checked){border-color:var(--red);box-shadow:0 0 0 3px rgba(220,78,60,.2)}
.gift-option.is-expensive{opacity:.45}
.gift-feed{display:grid;gap:8px;margin-bottom:12px}
.gift-feed-row{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 12px}
.gift-feed-row p{margin:0}
.gift-feed-row a{font-weight:800}
.leaderboard{display:grid;gap:8px}
.leader-row{display:grid;grid-template-columns:36px 44px minmax(0,1fr) auto;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:10px 14px;box-shadow:var(--soft-shadow)}
.leader-row img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.leader-place{font-size:18px;text-align:center;color:var(--muted)}
.leader-row.top-1{border-color:var(--tint-yellow-line);background:var(--tint-yellow-soft)}.leader-row.top-1 .leader-place{color:#e0a800}
.leader-row.top-2 .leader-place{color:#9aa4b2}.leader-row.top-3 .leader-place{color:#c98b4d}
.leader-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.leader-main>a{font-weight:800}
.leader-stats{display:flex;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.leader-stats .is-key{color:var(--red-text);font-weight:900}
.ledger{display:grid;gap:4px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:8px 14px;box-shadow:var(--soft-shadow)}
.ledger-row{display:grid;grid-template-columns:60px 1fr auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line);font-size:14px}
.ledger-row:last-child{border-bottom:0}
.ledger-row b.pos{color:var(--green)}
.ledger-row b.neg{color:var(--red-text)}

@media (max-width:1020px){
  .profile-community{grid-template-columns:1fr 1fr}
  .field-row.four{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .profile-community,.field-row.four{grid-template-columns:1fr}
  .lesson-nav{grid-template-columns:1fr}
  .lesson-nav>a:last-child{justify-self:start}
  .leader-row{grid-template-columns:28px 36px minmax(0,1fr)}
  .leader-stats{grid-column:1/-1}
  .leader-row img{width:36px;height:36px}
}


/* ===== Иконки, разделы по типам, редактор по типам, блок скачивания ===== */

/* Иконки Font Awesome из static/icons/sprite.svg: заливка цветом текста, размер — как у шрифта */
.icon{width:1em;height:1em;flex:none;fill:currentColor;vertical-align:-.125em}
.nav-drop summary .icon{width:.7em;height:.7em;margin-left:3px;opacity:.75}
/* Рейтинг: стрелка вверх — зелёная, вниз — красная; на нажатой кнопке — белая */
.icon.rate-up{color:var(--green)}
.icon.rate-down{color:var(--red-text)}
.vote-btn.is-active .icon,.comment-vote button.is-active .icon{color:#fff}
[data-kinds][hidden]{display:none!important}

/* Шапка: меню «Материалы» с разделами */
.nav-drop summary.is-current{background:rgba(255,255,255,.1);color:#fff}
.sections-panel{grid-template-columns:repeat(2,minmax(230px,1fr));min-width:520px;gap:4px;padding:10px}
.nav-section{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;color:#d9e0ea}
.nav-section:hover{background:rgba(255,255,255,.07);color:#fff}
.nav-section .icon{width:36px;height:36px;padding:8px;border-radius:11px;background:rgba(255,255,255,.07);color:#ff8a72}
.nav-section:hover .icon{background:var(--red);color:#fff}
.nav-section b{display:block;font-size:14px;color:#fff}
.nav-section small{display:block;font-size:12px;color:#9aa5b6;white-space:nowrap}
@media (max-width:1180px){
  .brand small{display:none}
  .search input{width:140px}
  .nav-links a,.nav-drop summary{padding-left:8px;padding-right:8px}
  .brand{flex:none}
  .nav-write span{display:none}  /* «+ Материал» → «+»: иначе шапка не помещается рядом с темой и языком */
}
@media (min-width:1021px) and (max-width:1100px){
  .search input{width:110px}
}
@media (max-width:1020px){
  .sections-panel{min-width:0;grid-template-columns:1fr}
  .nav-section small{white-space:normal}
}

/* Заголовок раздела и вкладки типов */
.section-title{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.section-title>div{flex:1;min-width:220px}
.page-title .section-icon{display:grid;place-items:center;width:60px;height:60px;padding:0;border-radius:18px;background:linear-gradient(135deg,var(--red),#ff8a45);color:#fff;box-shadow:0 10px 24px rgba(220,78,60,.3);letter-spacing:0}
.section-icon .icon{width:30px;height:30px}
.section-title .btn .icon{margin-right:2px}
.type-tabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 14px;padding:5px;border-radius:16px;background:var(--card);border:1px solid var(--line);box-shadow:var(--soft-shadow);width:fit-content;max-width:100%}
.type-tabs a{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:12px;font-weight:800;font-size:14px;color:var(--text-2)}
.type-tabs a:hover{color:var(--red-text);background:var(--tint-red-hover)}
.type-tabs a.is-active{background:var(--btn-dark);color:#fff}
.type-tabs .icon{width:17px;height:17px}

/* Платформы — кнопки вместо выпадающего списка */
.platform-filter{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.platform-filter a{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--text-2);font-size:13px;font-weight:800;transition:border-color .15s ease,color .15s ease}
.platform-filter a:hover{border-color:rgba(220,78,60,.45);color:var(--red-text)}
.platform-filter a.is-active{background:var(--red);border-color:var(--red);color:#fff}
.platform-filter .icon{width:16px;height:16px}

.article-labels a{display:inline-flex;align-items:center;gap:5px}
.card-kicker .icon{width:14px;height:14px;margin-right:2px;vertical-align:-.15em}
.article-labels .icon{width:14px;height:14px}
.source-line .icon{width:13px;height:13px}
.course-nav-head .icon{width:18px;height:18px;color:#ffb3a6}

/* Редактор: выбор типа карточками */
.kind-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.kind-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px 14px 12px;border:1.5px solid var(--line);border-radius:16px;background:var(--card);cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.kind-card:hover{border-color:rgba(220,78,60,.45);transform:translateY(-1px)}
.kind-card input{position:absolute;opacity:0;pointer-events:none}
.kind-card-icon{display:grid;place-items:center;width:38px;height:38px;margin-bottom:4px;border-radius:12px;background:var(--card-2);color:var(--text-2)}
.kind-card-icon .icon{width:21px;height:21px}
.kind-card b{font-size:15px}
.kind-card small{color:var(--muted);font-size:12px;line-height:1.35}
.kind-card:has(input:checked){border-color:var(--red);background:var(--tint-red-select);box-shadow:0 0 0 3px rgba(220,78,60,.12)}
.kind-card:has(input:checked) .kind-card-icon{background:linear-gradient(135deg,var(--red),#ff8a45);color:#fff}
.kind-card:has(input:focus-visible){outline:2px solid var(--cyan);outline-offset:2px}
.field-row.auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:0 16px}
.chip-option .icon{width:16px;height:16px}
@media (max-width:1020px){.kind-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.kind-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Поле файла: текущий файл и выбор нового */
.file-picker{display:grid;gap:6px}
.file-current{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 10px;border-radius:12px;background:var(--card-2);font-size:14px;min-width:0}
.file-current a{font-weight:700;color:var(--text);overflow-wrap:anywhere;min-width:0}
.file-current a:hover{color:var(--red-text)}
.file-clear{display:inline-flex;align-items:center;gap:5px;margin-left:auto;font-size:13px;font-weight:700;color:var(--red-text);cursor:pointer}
.field input[type=file]{width:100%;max-width:100%;padding:7px;border:1.5px dashed var(--field-line-dashed);border-radius:12px;background:var(--field-2);font:inherit;font-size:13px;color:var(--muted);cursor:pointer}
.field input[type=file]:hover{border-color:rgba(220,78,60,.5)}
.field input[type=file]::file-selector-button{margin-right:10px;padding:7px 12px;border:0;border-radius:9px;background:var(--btn-dark);color:#fff;font:inherit;font-weight:800;cursor:pointer}
.file-form-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--card-2);color:var(--text-2)}
.file-form-icon .icon{width:17px;height:17px}

/* Файлы: иконка платформы, кнопки с иконками */
.file-icon .icon{width:22px;height:22px}
.file-actions .btn{display:inline-flex;align-items:center;gap:6px}
.file-actions .btn .icon{width:17px;height:17px}

/* Блок скачивания под анонсом */
.download-box{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;margin:20px 0;padding:16px 18px;border:0;border-radius:18px;background:linear-gradient(135deg,#2a2e37,#1e2229);color:#fff;box-shadow:0 14px 30px rgba(20,24,31,.18)}
.download-info{display:flex;align-items:center;gap:14px;min-width:0;flex:1 1 240px}
.download-info b{display:block;font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.download-info small{display:block;margin-top:3px;color:#aab4c3;font-size:13px}
.download-icon{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,var(--red),#ff8a45);box-shadow:0 8px 20px rgba(220,78,60,.35)}
.download-icon .icon{width:25px;height:25px}
.download-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.download-box .download-btn{display:inline-flex;align-items:center;gap:8px;margin:0;padding:11px 18px;border-radius:13px;background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;font-weight:800;font-size:15px;box-shadow:0 10px 22px rgba(220,78,60,.35);transition:transform .15s ease,box-shadow .15s ease}
.download-box .download-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(220,78,60,.45)}
.download-box .download-btn .icon{width:19px;height:19px}
.download-box .download-btn.platform{padding:8px 16px 8px 12px;background:#fff;color:var(--dark);box-shadow:0 8px 18px rgba(0,0,0,.2)}
.download-box .download-btn.platform .icon{width:26px;height:26px}
.download-btn.platform span{display:flex;flex-direction:column;line-height:1.15}
.download-btn.platform small{font-size:11px;font-weight:700;color:#747d8c}
.download-btn.platform b{font-size:15px}
.download-box .download-more{margin:0;padding:8px 6px;background:none;color:#c9d2df;font-weight:700;font-size:14px;border-radius:0}
.download-box .download-more:hover{color:#fff}
@media (max-width:560px){
  .download-actions{width:100%}
  .download-box .download-btn{flex:1;justify-content:center}
}

/* Главная: два постера с лидерами дня, ниже — топ скачиваний и просмотров */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.home-hero{padding:24px 24px 18px;background:var(--home-hero)}
.day-posters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-bottom:26px}
.day-poster{position:relative;isolation:isolate;display:flex;min-height:390px;border-radius:var(--radius);overflow:hidden;background:#151922;color:#fff;box-shadow:var(--shadow)}
.day-poster>img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:left top;transition:transform .5s ease}
.day-poster:hover>img{transform:scale(1.03)}
.day-poster::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(15,17,22,0) 22%,rgba(15,17,22,.78) 58%,rgba(15,17,22,.96))}
.day-poster-body{width:100%;margin-top:auto;padding:22px 24px}
.day-poster-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;background:linear-gradient(135deg,var(--red),#ff8a45);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;box-shadow:0 8px 18px rgba(220,78,60,.35)}
.day-poster-badge .icon{width:15px;height:15px}
.day-poster-kicker{display:flex;align-items:center;gap:6px;margin:12px 0 6px;color:#c9d2df;font-size:13px;font-weight:700}
.day-poster-kicker .icon{width:15px;height:15px}
.day-poster h2{margin:0 0 8px;font-size:26px;line-height:1.15}
.day-poster h2 a{color:#fff}
.day-poster h2 a:hover{color:#ffb3a6}
.day-poster p{max-width:560px;margin:0 0 14px;color:#d2d9e6;font-size:15px}
.day-poster-foot{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap}
.day-poster-stat{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;background:rgba(255,255,255,.12);font-size:13px;font-weight:800}
.day-poster-stat .icon{width:15px;height:15px}
.day-poster-foot small{color:#aab4c3;font-size:12px}
.day-poster-foot .btn{margin-left:auto}
.hero-tops-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 18px;flex-wrap:wrap;margin-bottom:16px}
.hero-tops-head .section-head{margin:0}
.hero-tops-head .tabs{flex:0 0 auto;margin:0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:4px;box-shadow:var(--soft-shadow)}
.hero-tops-head .tabs button{flex:0 0 auto;padding:8px 16px;font-size:14px;white-space:nowrap}
.hero-tops-head .tabs button.is-active{background:var(--btn-dark);color:#fff}
.hero-tops-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.hero-tops-grid[hidden]{display:none}

/* Карточка топа — светлая, как остальные карточки сайта */
.top-card{min-width:0;padding:20px 22px 10px;border-radius:var(--radius);background:var(--card);border:1px solid var(--line);box-shadow:var(--soft-shadow)}
.top-card h3{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-size:19px}
.top-card h3 .icon{width:36px;height:36px;padding:8px;border-radius:12px;background:linear-gradient(135deg,var(--red),#ff8a45);color:#fff;box-shadow:0 8px 18px rgba(220,78,60,.3)}
.top-rank-list{list-style:none;margin:0;padding:0}
.top-rank-list li{display:grid;grid-template-columns:26px 64px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.top-rank-list li:first-child{border-top:0}
.top-rank{font-size:18px;font-weight:900;color:var(--faint);text-align:center}
.top-rank-list li:nth-child(-n+3) .top-rank{color:var(--red-text)}
.top-thumb img{display:block;width:64px;height:44px;border-radius:10px;object-fit:cover;object-position:left top;background:#151922}
.top-main{min-width:0}
.top-main a{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-weight:800;line-height:1.25}
.top-main a:hover{color:var(--red-text)}
.top-main small{display:flex;align-items:center;gap:4px;margin-top:3px;color:var(--muted);font-size:12px;overflow:hidden;white-space:nowrap}
.top-main small .icon{width:13px;height:13px}
.top-value{padding:4px 10px;border-radius:99px;background:var(--tint-green-soft);color:var(--tint-green-soft-text);font-size:13px;white-space:nowrap}
.top-rank-list li.top-empty{display:block;padding:14px 0;color:var(--muted)}

.card-badges .badge-pinned{background:rgba(47,50,58,.94)}

@media (max-width:1020px){
  .hero-tops-grid,.day-posters{grid-template-columns:1fr}
}
@media (max-width:720px){
  .home-hero{padding:16px 14px 12px}
  .day-posters{gap:14px;margin-bottom:20px}
  /* На телефоне обложка сверху, текст под ней — надписи обложки не перекрываются */
  .day-poster{flex-direction:column;min-height:0}
  .day-poster>img{position:static;z-index:auto;height:160px}
  .day-poster::before{display:none}
  .day-poster-body{padding:16px 18px 18px}
  .day-poster h2{font-size:22px}
  .hero-tops-head .tabs{width:100%}
  .hero-tops-head .tabs button{flex:1}
  .top-card{padding:16px 14px 6px}
  .top-rank-list li{grid-template-columns:22px 52px minmax(0,1fr) auto;gap:10px}
  .top-thumb img{width:52px;height:38px}
}

/* Логотип сайта в карточке «О сайте» */
.author-card .site-mark{width:76px;height:76px;margin:0 auto 10px;border-radius:22px;font-size:40px;color:#fff}

/* --- Подтверждение почты, cookie, страницы сайта, жалобы, зависимости и коллекции модов ---
   Цвета — только токены, поэтому блоки сами подстраиваются под светлую и тёмную тему. */
.inline-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;margin-top:16px}

/* Плашка «Подтвердите почту» под шапкой */
.notice-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 24px 0;padding:11px 14px;border-radius:14px;
  background:var(--tint-yellow);color:var(--tint-yellow-text);border:1px solid var(--tint-yellow-line);font-size:14px}
.notice-bar .icon{width:18px;height:18px;flex:none;fill:currentColor}
.notice-bar span{flex:1;min-width:220px}
.notice-bar form{margin:0}
.notice-bar button{border:0;border-radius:10px;padding:7px 12px;background:var(--btn-dark);color:#fff;font-weight:800;font-size:13px;cursor:pointer}
@media (max-width:760px){.notice-bar{margin:12px 12px 0}}

/* Плашка о cookie: внизу экрана, пока посетитель не ответил */
.cookie-banner{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:60;width:min(760px,calc(100% - 24px));
  display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:var(--card);color:var(--text);
  border:1px solid var(--line);box-shadow:var(--hover-shadow);font-size:14px}
.cookie-banner > .icon{width:26px;height:26px;flex:none;fill:var(--cyan)}
.cookie-banner p{margin:0;flex:1;line-height:1.45}
.cookie-banner a{color:var(--red-text);font-weight:700}
.cookie-actions{display:flex;gap:8px;flex:none}
.cookie-actions .btn{padding:9px 14px;font-size:13px}
@media (max-width:640px){.cookie-banner{flex-wrap:wrap;bottom:10px}.cookie-banner p{min-width:0;flex-basis:calc(100% - 40px)}
  .cookie-actions{width:100%}.cookie-actions .btn{flex:1;justify-content:center}}

/* Страницы сайта: правила, политика, «Правообладателям» */
.legal-page h1{margin-bottom:6px}
.legal-updated{margin:0 0 18px;color:var(--muted);font-size:14px}
.legal-page .claim-form{margin-top:12px;box-shadow:none}
.hp-field{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.footer-legal{font-size:13px}

/* Жалобы: кнопка у материала, ссылка у комментария, форма жалобы */
.report-link{display:inline-flex;align-items:center;gap:6px;margin-left:auto;padding:8px 12px;border-radius:12px;
  color:var(--muted);font-size:13px;font-weight:700;text-decoration:none}
.report-link .icon{width:14px;height:14px;fill:currentColor}
.report-link:hover{color:var(--red-text);background:var(--tint-red)}
.comment-actions .comment-report{color:var(--muted);font-size:13px;text-decoration:none}
.comment-actions .comment-report:hover{color:var(--red-text)}
.report-reasons{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.chip-option{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:12px;border:1px solid var(--field-line);
  background:var(--field);color:var(--text);font-size:14px;cursor:pointer}
.chip-option:has(input:checked){border-color:var(--red);background:var(--tint-red);color:var(--tint-red-text);font-weight:700}
.chip-option input{accent-color:var(--red);margin:0}
.report-form .help{display:block;margin:4px 0 0;color:var(--muted);font-size:13px}

/* Зависимости мода и блок «Коллекции» на странице мода */
.mod-block{margin:20px 0;background:var(--card);border-radius:20px;border:1px solid var(--line);box-shadow:var(--soft-shadow);padding:20px}
.mod-block h3{margin:16px 0 8px;font-size:15px;color:var(--heading)}
.mod-block .block-head + h3{margin-top:4px}
.install-order{margin:0;padding:0;list-style:none;counter-reset:step;display:grid;gap:6px}
.install-order li{counter-increment:step;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:9px 12px;border-radius:12px;background:var(--card-2-inset)}
.install-order li::before{content:counter(step);flex:none;display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;
  background:var(--card-2-btn);color:var(--text-btn);font-weight:800;font-size:13px}
.install-order li.is-self{background:var(--tint-green);color:var(--tint-green-text)}
.install-order li.is-self::before{background:var(--green);color:#fff}
.install-order .icon,.dep-list .icon{width:12px;height:12px;fill:currentColor}
.dep-list{margin:0;padding-left:20px;display:grid;gap:4px}
.dep-list.is-incompatible li::marker{color:var(--red)}
.dep-inline{margin:0}
.add-to-collection{display:flex;gap:6px;align-items:center}
.add-to-collection select{max-width:220px;padding:7px 10px;border-radius:10px;border:1px solid var(--field-line);background:var(--field);color:var(--text)}

/* Коллекции: карточки в списках */
.collection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.collection-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.collection-grid > .empty-state{grid-column:1/-1}
.collection-card{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:var(--card);border:1px solid var(--line);
  box-shadow:var(--soft-shadow);color:var(--text);min-width:0}
.collection-grid.compact .collection-card{box-shadow:none;background:var(--card-2-inset)}
.collection-card:hover{border-color:rgba(220,78,60,.35)}
.collection-icon{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--tint-cyan);color:var(--tint-cyan-text)}
.collection-icon .icon{width:20px;height:20px;fill:currentColor}
.collection-main{display:grid;gap:3px;min-width:0}
.collection-main b{color:var(--heading);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.collection-main small{color:var(--muted);font-size:13px}
.filter-bar .filter-action{margin-left:auto;background:var(--btn-dark);color:#fff}
.filter-bar .filter-action .icon{width:13px;height:13px;fill:currentColor}

/* Страница коллекции */
.collection-head{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;background:var(--card);border-radius:20px;
  border:1px solid var(--line);box-shadow:var(--soft-shadow);padding:22px;margin-bottom:16px}
.collection-head h1{margin:8px 0 10px}
.collection-desc{color:var(--text-soft);margin-top:12px}
.collection-desc p{margin:0 0 8px}
.collection-actions{display:flex;gap:8px;flex:none;flex-wrap:wrap;justify-content:flex-end}
.collection-external,.load-order-block{margin:16px 0;background:var(--card);border-radius:20px;border:1px solid var(--line);box-shadow:var(--soft-shadow);padding:20px}
.collection-external h2{margin-top:0}
.collection-external ul{margin:8px 0 0;padding-left:20px;display:grid;gap:4px}
.collection-external .icon{width:12px;height:12px;fill:currentColor}
.load-order{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.load-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:var(--card)}
.load-item.has-warning{border-color:var(--tint-yellow-line);background:var(--tint-yellow-soft)}
.load-item.is-hidden{opacity:.6}
.load-num{flex:none;width:30px;text-align:center;font-weight:800;color:var(--muted);font-variant-numeric:tabular-nums}
.load-thumb{flex:none;width:72px;height:46px;object-fit:cover;border-radius:10px;background:#151922}
.load-main{flex:1;min-width:0;display:grid;gap:2px}
.load-title{font-weight:800;color:var(--heading)}
.load-title:hover{color:var(--red-text)}
.load-note{margin:2px 0 0;color:var(--text-soft);font-size:14px}
.load-warning{margin:3px 0 0;display:flex;align-items:flex-start;gap:6px;font-size:13px;font-weight:700;color:var(--tint-yellow-text)}
.load-warning.is-conflict{color:var(--tint-red-text)}
.load-warning .icon{width:14px;height:14px;fill:currentColor;flex:none;margin-top:2px}
.load-controls{display:flex;gap:4px;flex:none}
.load-controls button{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:10px;background:var(--card-2-btn);color:var(--text-btn);cursor:pointer}
.load-controls button:hover:not(:disabled){background:var(--btn-dark);color:#fff}
.load-controls button.danger:hover{background:var(--red)}
.load-controls button:disabled{opacity:.35;cursor:default}
.load-controls .icon{width:14px;height:14px;fill:currentColor}

/* Формы: зависимости мода и список модов коллекции */
.dep-forms,.collection-items-form{display:grid;gap:10px;margin-bottom:8px}
.dep-form{display:grid;grid-template-columns:28px repeat(3,minmax(0,1fr));gap:0 12px;align-items:start;
  padding:12px 12px 0;border-radius:14px;background:var(--card-2-inset);border:1px solid var(--line)}
.dep-form.has-error{border-color:var(--tint-red-line)}
.dep-form .message{grid-column:1/-1}
.dep-num{grid-row:span 2;align-self:center;font-weight:800;color:var(--muted);text-align:center}
.dep-delete{align-self:center;display:flex;gap:6px;align-items:center;font-size:13px;color:var(--red-text);white-space:nowrap}
.item-form-row{display:grid;grid-template-columns:80px minmax(0,1fr) minmax(0,1.2fr) auto;gap:10px;align-items:center;padding:8px 10px;
  border-radius:12px;background:var(--card-2-inset)}
.item-form-row .field-error{grid-column:1/-1}
.item-form-title{font-weight:700;color:var(--heading);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media (max-width:980px){.collection-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.collection-grid,.collection-grid.compact{grid-template-columns:1fr}.collection-head{flex-direction:column}
  .dep-form{grid-template-columns:1fr}.dep-num{grid-row:auto;text-align:left}.load-thumb{display:none}
  .load-item{flex-wrap:wrap}.load-main{flex-basis:calc(100% - 50px)}.load-controls{width:100%;justify-content:flex-end}
  .item-form-row{grid-template-columns:64px minmax(0,1fr)}.item-form-row input[type=text]{grid-column:1/-1}
  .filter-bar .filter-action{margin-left:0}}

/* «В коллекцию» на странице мода: выпадающий список своих коллекций */
.collect-menu{position:relative}
.collect-menu summary{list-style:none}
.collect-menu summary::-webkit-details-marker{display:none}
.collect-menu[open] summary{border-color:rgba(220,78,60,.4);color:var(--red-text)}
/* Открывается вверх: кнопки стоят внизу карточки материала, а она обрезает всё, что выходит за край */
.collect-panel{position:absolute;bottom:calc(100% + 6px);left:0;z-index:15;display:grid;gap:2px;width:max-content;min-width:220px;
  max-width:min(320px,80vw);max-height:320px;overflow-y:auto;padding:6px;border-radius:14px;background:var(--card);
  border:1px solid var(--line);box-shadow:var(--hover-shadow)}
.collect-panel form{margin:0}
.collect-panel button,.collect-panel a{display:flex;align-items:center;gap:8px;width:100%;padding:9px 12px;border:0;border-radius:10px;
  background:none;color:var(--text);font:inherit;font-size:14px;font-weight:700;text-align:left;cursor:pointer}
.collect-panel button:hover,.collect-panel a:hover{background:var(--card-2);color:var(--red-text)}
.collect-panel .icon{width:14px;height:14px;flex:none;fill:currentColor}
.collect-panel .is-in{color:var(--tint-green-text)}
.collect-panel .collect-new{border-top:1px solid var(--line);border-radius:0 0 10px 10px;margin-top:2px;color:var(--muted)}

/* Необязательный раздел формы, свёрнутый по умолчанию: английская версия коллекции */
.form-extra{margin:4px 0 16px;padding:12px 14px;border:1px dashed var(--field-line-dashed);border-radius:14px;background:var(--card-2-inset)}
.form-extra summary{cursor:pointer;font-weight:800;color:var(--heading)}
.form-extra[open] summary{margin-bottom:8px}
.form-extra .help{display:block;margin:0 0 10px;color:var(--muted);font-size:13px}

/* Аватар в настройках: превью в круге и окно обрезки (js/avatar-crop.js), как в Telegram */
.avatar-picker{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.avatar-preview{position:relative;flex:none;width:96px;height:96px;border-radius:50%;overflow:hidden;background:var(--card-2);
  box-shadow:0 0 0 3px var(--card),0 0 0 4px var(--line)}
.avatar-preview img{display:block;width:100%;height:100%;object-fit:cover}
.avatar-preview img.is-cropped{position:absolute;left:0;top:0;max-width:none;object-fit:fill;transform-origin:0 0}
.avatar-picker-actions{display:grid;gap:8px;min-width:0;flex:1}
.avatar-buttons{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.avatar-choose{position:relative;cursor:pointer}
.avatar-choose:focus-within{outline:2px solid var(--cyan);outline-offset:2px}
.avatar-choose input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.avatar-clear{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:14px;cursor:pointer}
.avatar-dialog{width:min(380px,calc(100% - 24px));padding:20px;border:0;border-radius:20px;background:var(--card);color:var(--text);
  box-shadow:var(--hover-shadow)}
.avatar-dialog::backdrop{background:rgba(10,12,16,.6)}
.avatar-dialog h3{margin:0 0 14px;color:var(--heading)}
.avatar-stage{position:relative;width:100%;aspect-ratio:1;overflow:hidden;border-radius:14px;background:#111;cursor:grab;
  touch-action:none;user-select:none}
.avatar-stage:active{cursor:grabbing}
.avatar-stage:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.avatar-stage img{position:absolute;left:0;top:0;max-width:none;transform-origin:0 0;pointer-events:none}
.avatar-mask{position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 999px rgba(0,0,0,.55);outline:2px solid rgba(255,255,255,.85);
  outline-offset:-2px;pointer-events:none}
.avatar-zoom{width:100%;margin:14px 0 6px;accent-color:var(--red)}
.avatar-hint{margin:0 0 14px;color:var(--muted);font-size:13px}
.avatar-dialog-actions{display:flex;justify-content:flex-end;gap:10px}