@import url(style_cs.1793567450.css);
@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans&display=swap');
@import url('https://kit-pro.fontawesome.com/releases/v6.6.0/css/pro.min.css');

/* =========================================================
   СЕРВИСНОЕ: прячем служебные надписи движка
   ========================================================= */

.acchide,
#pun-navlinks h2,
#pun-pagelinks h2,
#pun-status h2,
#pun-ulinks h2,
.punbb .forum h2,
.punbb .multipage .topic h2,
.punbb dl.post-sig dt span,
.punbb p.crumbs strong,
.punbb .divider hr,
.punbb .required label em,
.punbb .formsubmit label,
.punbb .submitfield label,
.punbb .modmenu label,
#pun-userlist .main h2 {
  position: absolute;
  left: -9999px;
  width: 0;
  height: 0;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
}

#pun:after,
.punbb .container:after,
.punbb .post-links ul:after,
.punbb .main div.inline:after,
.punbb .post-box:after,
.punbb .linksb:after {
  content: "";
  display: block;
  clear: both;
}
/* текст поста ровно по своей колонке: не шире и не уже, и в постах без карточки тоже */
.punbb .post .post-body,
.punbb .post .post-box {
  width: auto !important;
  max-width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}

.punbb .post .post-content {
  overflow-wrap: break-word;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
}  

/* пост с [hideprofile] — без карточки, текст на всю ширину */
.punbb .post.hideprofile {
  grid-template-columns: minmax(0, 1fr);
  column-gap: 0;
}
.punbb .post.hideprofile h3,
.punbb .post.hideprofile .post-body,
.punbb .post.hideprofile .post-links { grid-column: 1 / -1; }
/* модераторы, «отредактировано», «поделиться», live */
.modlist,
.lastedit,
.punbb div#pun-live-rusff,
.punbb .topic a.sharelink {
  display: none;
}


/* =========================================================
   ОБЩЕЕ
   ========================================================= */

* {
  margin: 0;
  padding: 0;
  border: none;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

ul, ol, li, dl, dd, dt { list-style: none; }
address, em { font-style: normal; }
:focus { outline: none; }

::selection {
  background: var(--active);
  color: var(--text);
}

/* скроллбар */
*::-webkit-scrollbar { width: 4px; height: 4px; }
*::-webkit-scrollbar-track { background: var(--cream); }
*::-webkit-scrollbar-thumb { background: var(--border); }

/* ссылки */
a {
  color: var(--link);
  text-decoration: none;
  transition: color .2s;
}
a:hover { color: var(--text); }

#pun-navlinks a,
.pagelink a,
.postlink a,
.subscribelink a,
#pun-index .tclcon h3 a,
.plate { color: var(--text); }

#pun-navlinks a:hover { color: var(--link); }

h1, h2 {
  font-weight: normal;
  text-align: center;
}


/* =========================================================
   ФОРМЫ И КНОПКИ
   ========================================================= */

input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
  padding: 5px 8px;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--text);
  font: 12px var(--font1);
  box-sizing: border-box;
}

textarea { width: 100%; }

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus { border-color: var(--border); }

/* обычные кнопки — светлые, с тонкой рамкой; главные (отправить, ответить) — синие, см. ниже */
.button,
input[type="submit"],
input[type="button"],
button {
  padding: 6px 12px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: none;
  color: var(--text);
  font: 400 10px/1.2 var(--font1);
  text-transform: lowercase;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}

.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover {
  background: var(--beige);
  border-color: var(--beige);
}

/* главная кнопка — синяя, как ссылки в карточках форумов, при наведении красная */
#post .formsubmit input[name="submit"],
.postlink a {
  background: var(--blue) !important;
  border: 1px solid var(--blue) !important;
  color: var(--card) !important;
}

#post .formsubmit input[name="submit"]:hover,
.postlink a:hover {
  background: var(--red) !important;
  border-color: var(--red) !important;
  color: var(--card) !important;
}

fieldset { border: none; }
fieldset legend { font-weight: normal; }

.checkfield input[type="checkbox"],
.radiofield input[type="radio"] {
  margin: 0 4px;
  accent-color: var(--accent);
}

.formsubmit { padding: 10px 0 0; }
.formsubmit input { margin-right: 6px; }

#pun-admain textarea,
#pun-admain input,
#pun-admain select { color: #000 !important; }


/* =========================================================
   ФОН И КАРКАС
   ========================================================= */

html { background: #c9d9e6 var(--bg) center top repeat fixed; }   /* --bg — фон из style_cs, x1 */

#pun {
  position: relative;
  width: 1020px;
  margin: 36px auto 40px;            /* сверху чуть места под брелок с котиком */
  background: var(--white);
  box-shadow: -1px 0 0 var(--frame), 1px 0 0 var(--frame), 0 1px 0 var(--frame);
}

.punbb {
  display: flex;
  flex-direction: column;
  font: 12px var(--font1);
  color: var(--text);
}


/* =========================================================
   МЕНЮ — в розовой строке заголовка окна (сама строка нарисована в шапке)
   ========================================================= */

#pun-navlinks {
  position: absolute;
  top: 0;
  left: 0;
  right: 240px;                      /* справа переключатель темы и кнопки окна _ □ × */
  z-index: 6;
  height: 30px;
}

#pun-navlinks .container {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 30px;
  padding: 0 0 0 33px;
}

#pun-navlinks a {
    font: 440 11px / 1 var(--font1);
    text-transform: lowercase;
    color: var(--pink-text);
}
#pun-navlinks a:hover { color: #fff; }
#pun-navlinks .isactive a {
  color: #fff;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

#navawards { display: none; }


/* =========================================================
   ШАПКА — картинка + детали поверх (разметка деталей в HTML-верхе)
   ========================================================= */

#pun-title {
  position: relative;
  z-index: 1;
  width: 1020px;
  height: 558px;
  background: #d4e2ed var(--header) 0 0 / 1020px 558px no-repeat;
}

#pun-title table { display: none; }

/* слой с деталями: клики проходят сквозь, кроме самих деталей */
.cb-head {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: 1020px;
  height: 558px;
  pointer-events: none;
}
.cb-head > * { position: absolute; pointer-events: auto; }

/* брелок с котиком — качается при наведении */
.cb-head__keychain {
  top: -27px;
  left: -186px;
  width: 324px;
  height: 324px;
  background: var(--keychain) center / contain no-repeat;
  transform-origin: 62% 4%;
  pointer-events: none !important;   /* картинка квадратная — ловим наведение только на самом котике */
}
.cb-head__keychain i {
  position: absolute;
  top: 10px;
  left: 140px;
  width: 95px;
  height: 300px;
  pointer-events: auto;
}
.cb-head__keychain:has(i:hover) { animation: cb-swing 1.6s ease-in-out; }
@keyframes cb-swing {
  20% { transform: rotate(9deg); }
  45% { transform: rotate(-6deg); }
  65% { transform: rotate(3deg); }
  85% { transform: rotate(-1deg); }
}

/* диск — крутится при наведении */
.cb-head__cd {
  top: 55px;
  left: 272px;
  width: 507px;
  height: 503px;
  background: var(--cd) center / contain no-repeat;
  border-radius: 50%;
  clip-path: circle(45% at 50% 49.5%);   /* наведение ловится только на самом диске */
}
.cb-head__cd:hover { animation: cb-spin 3.5s linear infinite; }
@keyframes cb-spin { to { transform: rotate(360deg); } }

/* помада — просто картинка, клики проходят сквозь неё к записке */
.cb-head__lip {
  top: 441px;
  left: 273px;
  width: 419px;
  height: 117px;
  background: var(--lipstick) center bottom / contain no-repeat;
  pointer-events: none !important;
}

/* очки — поверх всех деталей шапки и ниже строки меню, чтобы ничего на них не налезало;
   приподнимаются при наведении */
.cb-head__glasses {
  z-index: 2;
  top: 31px;
  left: 417px;
  width: 363px;
  height: 214px;
  background: var(--glasses) center / contain no-repeat;
  clip-path: polygon(0 0, 55% 0, 100% 55%, 100% 100%, 45% 100%, 0 45%);
  transition: transform .3s ease;
}
.cb-head__glasses:hover { transform: translateY(-6px) rotate(-3deg); }

/* --- значки daily check in / welcome pack — круглые ссылки поверх картинки --- */
.cb-head .cb-badge {
  top: 193px;
  width: 77px;
  height: 77px;
  border-radius: 50%;
  transition: box-shadow .2s, transform .2s;
}
.cb-head .cb-badge--daily   { left: 783px; }
.cb-head .cb-badge--welcome { left: 876px; }
.cb-head .cb-badge:hover {
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .85), 0 0 16px 2px rgba(229, 158, 180, .9);
  transform: rotate(-6deg);
}

/* --- окошки players / fluders: текст и кнопки (сами окна нарисованы в шапке) --- */
.cb-head .cb-win { width: 227px; }
.cb-head .cb-win--players { top: 277px; left: 46px; }
.cb-head .cb-win--fluders { top: 93px; left: 759px; }

.cb-head .cb-win p {
  height: 24px;
  margin: 0 0 16px;
  overflow: hidden;
  font: 300 9px/1.3 var(--font1);
  text-transform: lowercase;
  color: var(--ink);
}

.cb-head .cb-win__btns { display: flex; gap: 10px; }
.cb-head .cb-win__btns a {
  width: 69px;
  height: 22px;
  padding: 0 6px;
  box-sizing: border-box;
  overflow: hidden;
  background: var(--btn);
  border: 1px solid var(--btn-line);
  font: 400 10px/20px var(--font1);
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink);
  transition: background .2s, transform .15s, box-shadow .15s;
}
.cb-head .cb-win__btns a:hover {
  background: var(--blue);
  color: var(--ink);
  transform: translate(-1px, -1px);
  box-shadow: 2px 2px 0 rgba(0, 0, 0, .25);
}

.cb-head .cb-note {
    top: 462px;
    left: 235px;
    width: 104px;
    transform: rotate(-8.24deg);
    transform-origin: 0 0;
    font: 300 9px / 1.25 var(--font1);
    text-transform: lowercase;
    color: var(--ink);
}
.cb-head .cb-note p {
  max-height: 68px;
  margin: 0 0 3px;
  overflow: hidden;
}
.cb-head .cb-note a { font-weight: 590; color: var(--link); }
.cb-head .cb-note a:hover { color: var(--ink); }

.cb-head .cb-device {
    top: 342px;
    left: 856px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 131px;
    transform: rotate(5deg);
    transform-origin: 0 0;
    font: 600 12px / 1.15 var(--font2);
    text-transform: uppercase;
    color: #414c8b;
}
.cb-head .cb-device b { font-weight: 600; }
.cb-head .cb-device b:not(:first-child) { margin-top: 9px; }
.cb-head .cb-device a { color: inherit; }
.cb-head .cb-device a:hover { color: var(--red); }


/* =========================================================
   ПОДСКАЗКИ ПРИ НАВЕДЕНИИ (скрипт quicktip из HTML-верха)
   скрипт забирает title у элементов и показывает свой #tooltip у курсора —
   без этих стилей подсказка терялась внизу страницы
   ========================================================= */

#tooltip {
  position: absolute;
  z-index: 100002;
  max-width: 220px;
  padding: 4px 8px 5px;
  box-sizing: border-box;
  background: var(--card);
  border: 1px solid var(--btn-line);
  border-top: 3px solid var(--blue);
  box-shadow: 2px 2px 0 rgba(0, 0, 0, .18);
  font: 400 10px/1.35 var(--font1);
  text-align: left;
  text-transform: lowercase;
  color: var(--ink);
  pointer-events: none;
  white-space: normal;
}


/* =========================================================
   МЯГКАЯ ТЕМА — переключатель в строке заголовка окна
   включается классом cb-soft на html, выбор помнит браузер
   ========================================================= */

.cb-theme {
  position: absolute;
  top: 6px;
  right: 108px;
  z-index: 7;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 18px;
  margin: 0;
  padding: 0 4px;
  background: none;
  border: 0;
  box-shadow: none;
  font: 590 11px/1 var(--font1);
  text-transform: lowercase;
  color: var(--pink-text);
  cursor: pointer;
}
.cb-theme:hover { background: none; color: #fff; }
.cb-theme b { font-weight: 590; }

/* дорожка с бегунком */
.cb-theme__track {
  position: relative;
  width: 28px;
  height: 14px;
  box-sizing: border-box;
  background: rgba(255, 255, 255, .35);
  border: 1px solid #c5a3b3;
  transition: background .25s;
}
.cb-theme__track i {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 10px;
  height: 10px;
  background: #fff;
  box-shadow: 1px 1px 0 rgba(0, 0, 0, .2);
  transition: transform .25s;
}
html.cb-soft .cb-theme__track { background: var(--red); border-color: var(--red); }
html.cb-soft .cb-theme__track i { transform: translateX(14px); }

/* --- сама мягкая тема: другой фон, светлые цвета приглушены, лёгкое затемнение --- */
html.cb-soft {
  --white: #eae6e4;
  --card: #efebe9;
  --cream: #e9dadc;
  --panel: #e2dfdc;
  --bar: #e3e1df;
  --chip: #ebe4e4;
  --win: #e3e1df;
  background-color: #9bacb5;
  background-image: var(--bg-soft);
}
html.cb-soft body::after {
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 99980;
  background: #1e0f11;
  opacity: .1;
  pointer-events: none;
}


/* =========================================================
   ПЛАШКИ СПРАВА — из-под шапки торчит дата, при наведении выезжают
   ========================================================= */

.plates {
  position: absolute;
  top: 120px;
  left: 100%;
  z-index: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
}

.plate {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 5px 7px 5px 12px;
  box-sizing: border-box;
  background: var(--gray);
  border: 1px solid var(--ink);
  font-size: 11px;
  line-height: 1.15;
  color: var(--ink);
  white-space: nowrap;
  transform: translateX(calc(-100% + 54px));   /* видна только дата */
  transition: transform .35s ease;
}
.plate:hover {
  color: var(--ink);
  transform: translateX(0);
}

.plate span {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.plate b { font-weight: 400; }
.plate small { font-size: 10px; font-weight: 200; }

/* дата — розовая клетка */
.plate i {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 26px;
  box-sizing: border-box;
  background: var(--blue);
  border: 1px solid #773a4a;
  font-style: normal;
  font-size: 10px;
  color: var(--ink);
}


/* =========================================================
   ВЕРХНЯЯ ЗОНА: розовая полоса ссылок, адресная строка (крошки), статус
   ========================================================= */

/* «новые сообщения, активные темы…» — розовая полоса сразу под шапкой */
#pun-ulinks {
  position: relative;
  z-index: 2;
  height: 30px;
  box-sizing: border-box;
  background: #ecc4c9;
  border: 4px solid #ebccd1;
  box-shadow: inset 0 4px 4.8px #c3a7b3;
}

#pun-ulinks .container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 10px;
  height: 22px;
  padding: 0 0 0 29px;
  font-size: 11px;
  text-transform: lowercase;
}
#pun-ulinks li a { color: var(--ink); }
#pun-ulinks li a:hover { color: var(--link); }

/* «привет, ник · последний визит» — справа внутри адресной строки */
#pun-status {
  position: absolute;
  top: 602px;
  right: 79px;
  z-index: 2;
  display: flex;
  align-items: center;
  height: 20px;
}

#pun-status .container {
  display: flex;
  gap: 0 10px;
  font-size: 11px;
  text-transform: lowercase;
  color: var(--status);
}
#pun-status strong { font-weight: 400; color: var(--link); }
#pun-status .status-right { display: none; }

/* крошки — адресная строка браузера: https://cat bomb / раздел / тема */
.crumbs.container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 5px;
  width: 899px;
  min-height: 20px;
  margin: 14px auto 26px;
  padding: 0 18px;
  box-sizing: border-box;
  background: var(--bar);
  border: 1px solid rgba(0, 0, 0, .07);
  font-size: 11px;
  line-height: 18px;
  text-transform: lowercase;
  color: var(--status);
}
#pun-crumbs1 .crumbs.container { padding-right: 330px; }   /* справа статус */
.crumbs.container::before { content: "https://"; margin-right: -5px; }
.crumbs.container a { color: var(--status); }
.crumbs.container a:hover { color: var(--link); }
.crumbs.container .crumb-last { color: var(--text); }

/* разделители — косая черта, как в адресе */
.crumbs.container em { font-size: 0; }
.crumbs.container em::before {
  content: "/";
  font-size: 11px;
  color: #b9adb1;
}
.crumbs.container strong + em { display: none; }


/* =========================================================
   ОБЪЯВЛЕНИЕ
   ========================================================= */

#pun-main > h1 { display: none; }   /* огромное «Форум» над категориями */

#pun-announcement h2 { display: none; }
#pun-announcement .container { width: 899px; margin: 0 auto; padding: 0 0 20px; box-sizing: border-box; }


/* =========================================================
   ГЛАВНАЯ: КАТЕГОРИИ С ДИНОЗАВРИКАМИ, ФОРУМЫ КАРТОЧКАМИ
   ========================================================= */

#pun-index thead,
#pun-index .tc2,
#pun-index .tc3 { display: none; }

#pun-index .category {
  position: relative;
  width: 899px;
  margin: 0 auto;
}
#pun-index .category + .category { margin-top: 36px; }   /* чтобы прыгающий динозаврик не задевал карточку выше */

/* --- разделитель категории: дорожка, динозаврик, кактус и окошко с названием --- */
#pun-index .category h2 {
  position: relative;
  display: block;
  width: 605px;
  height: 80px;
  margin: 0 auto;
  padding: 0;
  background: var(--ground) 0 58px / 120px 8px repeat-x;
  font: 400 10px/1.2 var(--font1);
  text-align: center;
  cursor: default;
}

/* название категории — клавиша с крестиком */
#pun-index .category h2 span {
  position: absolute;
  top: 18px;
  left: 50%;
  z-index: 2;
  padding: 4px 10px;
  background: var(--btn);
  border: 1px solid var(--btn-line);
  white-space: nowrap;
  text-transform: lowercase;
  color: var(--ink);
  transform: translateX(-50%);
}
#pun-index .category h2 span::after {
  content: "";
  position: absolute;
  top: -8px;
  right: -8px;
  width: 15px;
  height: 15px;
  background: var(--xbox);
}

/* динозаврик */
#pun-index .category h2::before {
  content: "";
  position: absolute;
  top: 16px;
  left: 178px;
  width: 42px;
  height: 45px;
  background: var(--dino) center bottom / contain no-repeat;
}

/* кактус */
#pun-index .category h2::after {
  content: "";
  position: absolute;
  top: 37px;
  left: 385px;
  width: 31px;
  height: 24px;
  background: var(--cactus) center bottom / contain no-repeat;
}

/* при наведении: кактус едет на динозаврика, тот перепрыгивает — как в игре */
#pun-index .category h2:hover::after  { animation: cb-cactus 1.4s linear infinite; }
#pun-index .category h2:hover::before { animation: cb-jump 1.4s infinite; }

@keyframes cb-cactus {
  0%   { transform: translateX(0);      opacity: 0; }
  6%   { opacity: 1; }
  90%  { opacity: 1; }
  100% { transform: translateX(-260px); opacity: 0; }
}
@keyframes cb-jump {
  0%, 58%   { transform: translateY(0);     animation-timing-function: ease-out; }
  77%       { transform: translateY(-28px); animation-timing-function: ease-in; }
  96%, 100% { transform: translateY(0); }
}

/* --- карточка категории --- */
#pun-index .category .container {
  position: relative;
  padding: 0 30px 30px;
  background: rgba(239, 239, 237, .7);
  border: none;
  box-shadow: var(--soft);
}

#pun-index .category table,
#pun-index .category tbody {
  display: block;
  width: 100%;
}

/* --- форум: строка в карточке, между форумами пунктир --- */
#pun-index .category tbody tr {
  position: relative;
  display: block;
  min-height: 140px;
  padding: 32px 19px 22px;
  box-sizing: border-box;
  background: none;
  border: none;
  border-bottom: 1px dashed rgba(0, 0, 0, .1);
}
#pun-index .category tbody tr:last-child { border-bottom: none; }

#pun-index td.tcl {
  display: block;
  padding: 0;
  border: none;
}

#pun-index .tclcon {
  max-width: 395px;
  font: 300 10px/1.35 var(--font1);
  color: var(--text);
}
#pun-index .tclcon > br { display: none; }
#pun-index .tclcon h3 { margin-bottom: 10px; }

/* название форума — розовая плашка с крестиком */
#pun-index .tclcon h3 a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px 4px 12px;
  background: var(--blue);
  box-shadow: var(--shadow);
  font: 510 11px/13px var(--font1);
  color: var(--pink-text);
  transition: background .2s;
}
#pun-index .tclcon h3 a::after {
  content: "";
  flex: none;
  width: 13px;
  height: 13px;
  background: var(--xbox);
}
#pun-index .tclcon h3 a:hover { background: var(--blue-dark); color: #fff; }

/* NEW / OLD — круглые значки, чуть наклонены */
#pun-index div.icon {
  position: absolute;
  top: 10px;
  left: 490px;
  display: block;
  width: 84px;
  height: 85px;
  margin: 0;
  background: var(--badge-old) center / contain no-repeat;
  border: none;
  filter: drop-shadow(0 4px 4px rgba(0, 0, 0, .25));
  transform: rotate(14.82deg);
  transition: transform .3s ease;
}
#pun-index tr.inew div.icon {
  background-image: var(--badge-new);
  transform: rotate(-18.63deg);
}
#pun-index div.icon span { display: none; }   /* буквы от старого скрипта не нужны */
#pun-index tr:hover div.icon { transform: rotate(0) scale(1.06); }

/* последнее сообщение */
#pun-index td.tcr {
  position: absolute;
  top: 32px;
  left: 624px;
  width: 188px;
  min-height: 30px;
  padding: 0 0 0 43px;               /* 30 аватарка + 13 зазор */
  box-sizing: border-box;
  border: none;
  font: 300 10px/1.3 var(--font1);
  color: var(--muted);
}


#pun-index td.tcr .user-avatar {
  position: absolute;
  top: 0;
  left: 0;
  float: none;
  margin: 0;
  transform: none;
}

/* онлайн — чёрный квадратик у верхнего левого уголка аватарки */
#pun-index td.tcr .user-avatar .isonline {
  top: -6px !important;
  left: -7px !important;
  background: var(--ink) !important;
  box-shadow: none !important;
}

#pun-index td.tcr .user-avatar img,
#pun-index td.tcr .user-avatar .avatar-image {
  display: block;
  width: 30px !important;
  height: 30px !important;
  box-sizing: border-box;
  border: 1px solid var(--ink);
  border-radius: 0 !important;
  background-size: cover !important;
  background-position: center !important;
  object-fit: cover;
}

#pun-index td.tcr .lastpost-link,
#pun-index td.tcr > a:first-of-type {
  display: block;
  margin-bottom: 3px;
  overflow: hidden;
  font-size: 11px;
  font-weight: 510;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--link);
}
#pun-index td.tcr .lastpost-link:hover,
#pun-index td.tcr > a:first-of-type:hover { color: var(--text); }
#pun-index td.tcr a { color: var(--muted); }
#pun-index td.tcr br { display: none; }
/* =========================================================
   СПИСОК ТЕМ 
   ========================================================= */

.punbb .forum {
  width: 899px;
  margin: 0 auto;
}

.punbb .forum > h2 { display: none; }

.punbb .forum table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

/* заголовки колонок */
.punbb .forum th {
  padding: 0 12px 8px;
  border-bottom: 1px solid var(--border);
  font-size: 10px;
  font-weight: 400;
  text-transform: lowercase;
  text-align: left;
  color: var(--muted);
}

.punbb .forum td {
  padding: 14px 12px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}

.punbb .forum .tcl { width: auto; }
.punbb .forum .tc2,
.punbb .forum .tc3 { width: 70px; text-align: center; }
.punbb .forum .tcr { width: 230px; }
.punbb .forum th.tcr { padding-left: 50px; }


.punbb .forum .icon { display: none; }

.punbb .forum .tclcon {
  font-size: 10px;
  font-weight: 200;
  color: var(--muted);
}

.punbb .forum .tclcon > a {
  display: block;
  margin-bottom: 3px;
  font-size: 11px;
  font-weight: 400;
  color: var(--text);
}

.punbb .forum .tclcon > a:hover { color: var(--accent); }


.punbb .forum tr.inew .tclcon > a::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  background: var(--active);
  border: 1px solid var(--border);
  vertical-align: 1px;
}

.punbb .forum tr.isticky .tclcon > a { color: var(--accent); }


.punbb .forum td.tc2,
.punbb .forum td.tc3 {
  font-size: 11px;
  font-weight: 200;
  color: var(--muted);
}

/* последнее сообщение: квадратная аватарка + дата и автор */
.punbb .forum td.tcr {
    position: relative;
    padding-left: 50px !important;
    font-size: 10px;
    line-height: 1.4;
    color: var(--muted);
    padding-top: 0px !important;
}

.punbb .forum td.tcr .user-avatar {
  position: absolute;
  top: 50%;
  left: 12px;
  margin: 0;
  float: none;
  transform: translateY(-50%);
}

.punbb .forum td.tcr .user-avatar img,
.punbb .forum td.tcr .user-avatar .avatar-image {
  display: block;
  width: 26px !important;
  height: 26px !important;
  box-sizing: border-box;
  border: 1px solid var(--red);
  border-radius: 0 !important;
  background-size: cover !important;
  object-fit: cover;
}


.punbb .forum td.tcr > a {
  display: block;
  color: var(--accent);
}

.punbb .forum td.tcr > a:hover { color: var(--text); }
.punbb .forum td.tcr br { display: none; }

/* модераторские ссылки под таблицей */
.punbb .forum + .modmenu,
#pun-viewforum .modmenu { margin-top: 10px; }


/* =========================================================
   ПРОЧИЕ ТАБЛИЦЫ
   ========================================================= */

.punbb .main .container > table {
  width: 899px;
  margin: 0 auto;
  border-collapse: collapse;
  font-size: 11px;
}

.punbb .main .container > table th {
  padding: 0 12px 8px;
  border-bottom: 1px solid var(--border);
  font-size: 10px;
  font-weight: 400;
  text-transform: lowercase;
  text-align: left;
  color: var(--muted);
}

.punbb .main .container > table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  font-weight: 300;
  vertical-align: middle;
}


/* =========================================================
   СТАТИСТИКА — окошко «statistics», как окна в шапке; ПОДВАЛ — картинка с лого
   ========================================================= */

#pun-stats { padding: 30px 0 32px; }
#pun-stats h2 { display: none; }

#pun-stats .container {
  position: relative;
  display: grid;
  grid-template-columns: 220px 1fr;
  grid-auto-rows: min-content;
  grid-auto-flow: dense;
  column-gap: 40px;
  align-content: start;
  width: 899px;
  margin: 0 auto;
  padding: 37px 24px 18px;
  box-sizing: border-box;
  background: rgba(239, 239, 237, .7);
  border: 0;
  box-shadow: var(--soft);
  font-size: 10px;
  font-weight: 300;
  line-height: 1.8;
  text-transform: lowercase;
  color: var(--muted);
}

/* строка заголовка окна — спокойная светлая, с розовой клеткой (розовые строки остаются у всплывающих окон) */
#pun-stats .container::before {
  content: "statistics";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  height: 23px;
  padding: 0 0 0 24px;
  background:
    linear-gradient(var(--blue), var(--blue)) 10px 8px / 7px 7px no-repeat,
    var(--bar);
  border-bottom: 1px dashed rgba(0, 0, 0, .1);
  font: 400 10px/23px var(--font1);
  text-transform: lowercase;
  color: var(--muted);
}
#pun-stats .container::after {
  content: "";
  position: absolute;
  top: 3px;
  right: 9px;
  width: 15px;
  height: 15px;
  background: var(--xbox);
}

/* цифры — слева столбиком: подпись слева, число справа */
#pun-stats li.item1,
#pun-stats li.item2,
#pun-stats li.item3,
#pun-stats li.item4 {
  grid-column: 1;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px dashed rgba(0, 0, 0, .08);
}
#pun-stats li.item1 { grid-row: 1; }
#pun-stats li.item2 { grid-row: 2; }
#pun-stats li.item3 { grid-row: 3; }
#pun-stats li.item4 { grid-row: 4; border-bottom: none; }

#pun-stats li:empty { display: none; }
#pun-stats strong { font-weight: 500; color: var(--text); }
#pun-stats strong a { color: var(--link); }

/* кто онлайн / за сутки — справа */
#pun-stats li:not(.item1):not(.item2):not(.item3):not(.item4) { grid-column: 2; }
#pun-stats li:not(.item1):not(.item2):not(.item3):not(.item4) strong { font-weight: 300; color: var(--muted); }
#pun-stats li:not(.item1):not(.item2):not(.item3):not(.item4) a { font-weight: 500; }

/* подвал — картинка 1020 × 109 (лого cat bomb), копирайт rusff мелко справа */
#pun-about {
  position: relative;
  height: 109px;
  background: #c9d9e6 var(--footer) 0 0 / 1020px 109px no-repeat;
}
#pun-about .container {
  position: absolute;
  right: 150px;
  bottom: 12px;
  padding: 0;
  font-size: 9px;
  line-height: 1.3;
  text-align: right;
  color: #6f7f8c;
}
#pun-about a { color: #6f7f8c; }
#pun-about a:hover { color: var(--link); }
/* =========================================================
   ТЕМА: СТРАНИЦЫ, «ОТВЕТИТЬ», ПОДПИСКА
   ========================================================= */


.linkst, .linksb {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    width: 905px;
    margin: 0 auto 16px;
    font-size: 11px;
}

.linksb {
    margin: 16px auto;
    margin-right: 55px;
}


.linkst div:not(.pagelink),
.linksb div:not(.pagelink) { display: contents !important; }

.linkst p,
.linksb p {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0;
}

.linkst .pagelink,
.linksb .pagelink {
  order: -1;
  float: none !important;
  margin: 0 auto 0 0 !important;
  padding: 0;
}

.linkst .clearer,
.linksb .clearer { display: none !important; }


#pun-viewforum .linksb a { display: none !important; }
#pun-viewforum .linksb .pagelink a,
#pun-viewforum .linksb .subscribelink a { display: inline-block !important; }

/* модераторские ссылки */
.modmenu,
.modmenu a {
  font-size: 10px;
  color: var(--muted);
}

.modmenu a:hover { color: var(--accent); }

/* номера страниц — клетками, текущая оливковая */
.pagelink { font-size: 0; }

.pagelink a,
.pagelink strong,
.pagelink span {
  display: inline-block;
  min-width: 22px;
  height: 22px;
  margin-right: -1px;
  padding: 0 4px;
  box-sizing: border-box;
  background: var(--cream);
  border: 1px solid var(--border);
  font-size: 10px;
  font-weight: 400;
  line-height: 20px;
  text-align: center;
}

.pagelink strong { background: var(--active); }
.pagelink a:hover { background: var(--active); }

/* «Ответить», «Новая тема» — клавишами */
.postlink a,
.subscribelink a {
  display: inline-block;
  padding: 6px 12px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 2px;
  font-size: 10px;
  line-height: 1.2;
  text-transform: lowercase;
  color: var(--text);
  transition: background .2s, border-color .2s;
}

.postlink a::before { content: "// "; white-space: pre; }

.subscribelink a:hover {
  background: var(--beige);
  border-color: var(--beige);
  color: var(--text);
}





/* модерирование и «в теме сейчас» */
.modmenu .container,
#topic-users-in .container {
  width: 899px;
  margin: 0 auto 10px;
  font-size: 11px;
  color: var(--muted);
}

#topic-users-in a { color: var(--text); }


/* =========================================================
   ПОСТ — одна светлая панель: слева колонка автора, справа дата и текст,
   внизу полоска со ссылками; между постами просвет
   ========================================================= */

.punbb .post {
  position: relative;
  display: grid;
  grid-template-columns: 223px minmax(0, 1fr);
  grid-template-rows: auto 1fr auto;
  column-gap: 32px;
  width: 899px;
  margin: 0 auto 30px;
  padding-bottom: 34px;
  box-sizing: border-box;
  background: var(--panel);
  font-size: 11px;
  margin-bottom: 22px;
  padding: 16px 20px 18px 20px;
  border-radius: 0;
  box-shadow: var(--soft-post);
}

/* обёртка rusff «растворяется», и автор / текст / ссылки встают прямо в сетку поста */
.punbb .post > .container { display: contents; }
.punbb .post > .container::after { display: none; }
.punbb .post .clearer { display: none; }


/* --- дата и номер: верх правой колонки --- */

.punbb .post h3 {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 0;
  padding: 0;
  background: none;
  font-size: 9px;
  font-weight: 300;
  color: var(--hint);
  align-self: start;
  min-width: 0;
  min-height: 11px;
  border: 0;
  box-shadow: none;
  font: 400 9px/11px var(--font1);
}

.punbb .post h3 > span {
  display: flex;
  flex: 1;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
}

.punbb .post h3 > span > a,
.punbb .post h3 .permalink {
  order: 0;
  margin-right: auto;
  color: var(--hint);
  text-transform: none;
  padding: 0;
  font: inherit;
}

.punbb .post h3 > span > a:hover { color: var(--red); }

.punbb .post h3 .fontButtons {
  order: 9;
  display: flex;
  gap: 0;
  margin: 0 8px 0 0;
  padding: 0;
  float: none;
  background: none;
  border: none;
  align-self: start;
}

.punbb .post h3 .fontButtons button {
  min-width: 16px;
  height: 11px;
  padding: 0 3px;
  background: none;
  border: none;
  box-shadow: none;
  font-size: 9px;
  line-height: 11px;
  color: var(--muted);
  min-height: 0;
  padding-top: 0;
  padding-bottom: 0;
}

.punbb .post h3 .fontButtons button:hover { background: none; color: var(--red); }

.punbb .post h3 strong {
  order: 10;
  float: none;
  font-weight: 400;
  color: var(--hint);
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  font: inherit;
}

.punbb .post h3 strong::before { content: "#"; }

.FNTslider,
#fntSlider { display: none !important; }


/* =========================================================
   МИНИПРОФИЛЬ В ПОСТЕ
   хэдер (pa-fld1) сверху, карточка поверх него, плашка (pa-fld5) снизу,
   «онлайн» над карточкой с крестиком-окошком
   ========================================================= */

.punbb .post .post-author {
  position: relative;
  z-index: 0;                        /* картинки хэдера и плашки уходят под карточку */
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
  float: none;
  width: 223px;
  max-width: 100%;
  height: auto;
  margin: 16px 0 10px;               /* сверху место под «онлайн» */
  padding: 29px 11.5px 42px;
  box-sizing: border-box;
  /* если хэдер или плашка не заполнены — вместо картинки розовая полоса */
  background: linear-gradient(#e7e7e4 0 50px, var(--white) 50px calc(100% - 42px), #e7e7e4 calc(100% - 42px));
  border: 0;
  border-radius: 0;
  box-shadow: 1px 1px .5px rgba(0, 0, 0, .1);
  font: 400 9px/1.3 var(--font1);
  text-align: left;
  color: var(--text);
}

/* пунктир как в макете: штрих 2px, пробел 3px, снаружи картинок (обводка outside) */
.punbb .post .post-author::before,
.punbb .post .post-author::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: repeating-linear-gradient(90deg, #646464 0 2px, transparent 2px 5px);
  pointer-events: none;
}
.punbb .post .post-author::before { top: 50px; z-index: -1; }         /* сразу под хэдером */
.punbb .post .post-author::after  { bottom: 42px; z-index: -1; }      /* сразу над плашкой */

/* --- карточка --- */
.punbb .post .post-author > ul {
  position: static;
  display: grid;
  grid-template-columns: 1fr auto auto auto 1fr;   /* средние три — счётчики */
  align-content: start;
  min-height: 0px;
  margin: 0 0 1px;                   /* карточка заканчивается над нижним пунктиром, а не на нём */
  padding: 9px 17px 14px;
  box-sizing: border-box;
  background: var(--white);
  border: 1px solid #ededed;
}

.punbb .post .post-author > ul > li {
  grid-column: 1 / -1;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  transform: none;
}
.punbb .post .post-author .fld-name { display: none; }

/* ник */
.punbb .post .post-author > ul > li.pa-author {
  order: 1;
  padding-right: 32px;               /* справа иконка */
  font: 510 11px/13px var(--font1);
  color: var(--ink);
  overflow-wrap: anywhere;
}
.punbb .post .post-author .pa-author a { color: inherit; }
.punbb .post .post-author .pa-author a:hover { color: var(--link); }

/* статус */
.punbb .post .post-author > ul > li.pa-title {
  order: 2;
  margin-top: 2px;
  padding-right: 32px;
  font: 400 8px/10px var(--font1);
  color: #858585;
  overflow-wrap: anywhere;
}

/* аватар — по центру, своего размера (большие ужимаются по ширине карточки) */
.punbb .post .post-author > ul > li.pa-avatar {
  order: 3;
  display: flex;
  justify-content: center;
  margin: 14px 0 15px;
}
.punbb .post .post-author .pa-avatar img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* лз: имя курсивом ссылкой, ниже текст */
.punbb .post .post-author > ul > li.pa-fld2 {
  order: 4;
  margin-bottom: 14px;
  font: 300 8px/1.3 var(--font1);
  text-transform: lowercase;
  color: #646464;
  overflow-wrap: anywhere;
}
/* имя — ссылка в самом начале поля (скрипт помечает её классом lz-name) */
.punbb .post .post-author .pa-fld2 a.lz-name {
  display: block;
  margin-bottom: 6px;
  font: italic 400 9px/11px var(--font1);
  text-transform: none;
  color: #000;
}
.punbb .post .post-author .pa-fld2 a.lz-name:hover { color: var(--link); }

/* остальные ссылки в тексте лз (на пару, брата…) — обычные, в строку, без подчёркивания */
.punbb .post .post-author .pa-fld2 a:not(.lz-name) {
  display: inline;
  font: inherit;
  color: var(--link);
  border: 0;
  text-decoration: none;
}
.punbb .post .post-author .pa-fld2 a:not(.lz-name):hover { color: var(--text); }

/* --- счётчики: сообщения, уважение, деньги — иконка над числом, все в обводке --- */
.punbb .post .post-author > ul > li.pa-posts,
.punbb .post .post-author > ul > li.pa-respect,
.punbb .post .post-author > ul > li.pa-fld4 {
  position: relative;
  order: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin: 0 16px;
  font: 300 8px/10px var(--font1);
  white-space: nowrap;
  color: #646464;
}
.punbb .post .post-author > ul > li.pa-posts   { grid-column: 2; }
.punbb .post .post-author > ul > li.pa-respect { grid-column: 3; }
.punbb .post .post-author > ul > li.pa-fld4    { grid-column: 4; }

.punbb .post .post-author .pa-posts::before,
.punbb .post .post-author .pa-respect::before,
.punbb .post .post-author .pa-fld4::before {
  display: block;
  height: 9px;
  font: 400 8px/9px var(--fa);
  color: #646464;
}
.punbb .post .post-author .pa-posts::before   { content: "\f27a"; }   /* квадратное облачко */
.punbb .post .post-author .pa-respect::before { content: "\f004"; }   /* сердце */
.punbb .post .post-author .pa-fld4::before    { content: "\f555"; }   /* кошелёк */
.punbb .post .post-author .pa-fld4 img { display: none; }             /* картинка-иконка из поля не нужна */

.punbb .post .post-author .pa-respect a,
.punbb .post .post-author .pa-respect span:not(.pa-num) { font-size: 0; }
.punbb .post .post-author .pa-num { font-size: 8px !important; }
.punbb .post .post-author .pa-respect a img { display: none; }
.punbb .post .post-author .pa-link {
  position: absolute;
  inset: -2px -4px;
  z-index: 2;
}
.punbb .post .post-author .pa-posts:hover,
.punbb .post .post-author .pa-respect:hover,
.punbb .post .post-author .pa-posts:hover::before,
.punbb .post .post-author .pa-respect:hover::before,
.punbb .post .post-author .pa-respect:hover * { color: var(--link); }

/* --- иконка (pa-fld3): маленькое окошко справа от ника, картинка 14 × 14 --- */
.punbb .post .post-author > ul > li.pa-fld3 {
  position: absolute;
  top: 39px;
  right: 24px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  box-sizing: border-box;
  overflow: hidden;
  background: #f1f1f0;
  border: .9px solid #ededed;
  border-radius: 3px;
  box-shadow: inset 0 1.8px 2.6px rgba(0, 0, 0, .1);
  font-size: 13px;
  line-height: 1;
}
.punbb .post .post-author .pa-fld3 img {
  display: block;
  width: 14px;
  height: 14px;
  object-fit: contain;
}

/* --- хэдер (pa-fld1): картинка 223 × 50 под верхом карточки --- */
.punbb .post .post-author > ul > li.pa-fld1 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: -2;
  height: 50px;
  overflow: hidden;
}
.punbb .post .post-author .pa-fld1 img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  object-fit: cover;
}

/* --- плашка (pa-fld5): картинка 223 × 42 внизу + один или два текста поверх ---
   в поле: <img src="..."><span>текст плашки</span><span>мелкий текст</span>
   если текст один — он встаёт по центру */
.punbb .post .post-author > ul > li.pa-fld5 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  height: 42px;
  padding: 0 14px 0 29px;
  box-sizing: border-box;
  overflow: hidden;
}
.punbb .post .post-author .pa-fld5 img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  z-index: -1;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  object-fit: cover;
}
.punbb .post .post-author .pa-fld5 span {
  max-width: 100%;
  padding: 2px 6px;
  box-sizing: border-box;
  overflow: hidden;
  background: var(--white);
  filter: drop-shadow(1px 1px .95px rgba(0, 0, 0, .32));
  font: 300 10px/12px var(--font1);
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #000;
}
.punbb .post .post-author .pa-fld5 span:not(.fld-name) + span { font-size: 8px; line-height: 10px; }
/* текст один или два — всегда слева, по высоте плашки по центру */
.punbb .post .post-author .pa-fld5 br { display: none; }

/* --- «онлайн 2 часа» — над карточкой, с крестиком-окошком --- */
.punbb .post .post-author > ul > li.pa-online {
  position: absolute;
  top: -16px;
  left: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  font: 400 8px/10px var(--font1);
  text-transform: lowercase;
  white-space: nowrap;
  color: #858585;
}
.punbb .post .post-author .pa-online::before {
  content: "";
  flex: none;
  width: 10px;
  height: 10px;
  background: var(--xbox) center / contain no-repeat;
}
.punbb .post .post-author .pa-online strong { font-weight: 400; color: inherit; }
.punbb .post .post-author .pa-online br { display: none; }

.punbb .post .post-author .pa-last-visit,
.punbb .post .post-author .pa-gifts,
.punbb .post .post-author .pa-awards { display: none; }

/* --- текст поста --- */

.punbb .post .post-body {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
  padding: 15px 0 20px;
  font-size: inherit;
  font-weight: 400;
  line-height: 1.2;
  color: #000;
  align-self: start;
  float: none;
  width: auto !important;
  max-width: 100%;
  margin: 0 !important;
  box-sizing: border-box;
  background: none;
  border: 0;
  box-shadow: none;
  font-family: var(--font1);
}

.post-content p { margin-bottom: 10px; }
.post-content p:last-child { margin-bottom: 0; }
.post-content img { max-width: 100%; }
.post-content a { color: var(--accent); }
.post-content a:hover { color: var(--text); }

.post-sig {
  margin-top: 18px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-size: 10px;
  color: var(--muted);
}


/* --- Все действия внизу поста: иконки и подписи --- */
.punbb .post .post-links {
grid-column: 1 / -1;
  grid-row: 3;
  align-self: end;
  min-width: 0;
  min-height: 22px;
  margin: 18px 0 0;
  padding: 0 80px 0 0;
  box-sizing: border-box;
}
.punbb .post .post-links > ul {
display: flex !important;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  min-height: 22px;
  gap: 8px 16px;
  margin: 0;
  padding: 0;
}
.punbb .post .post-links li { margin: 0; padding: 0; }
.punbb .post .post-links li.cb-left { order: -1; }
.punbb .post .post-links li.cb-push { margin-left: auto; }
.punbb .post .post-links li.cb-hide { display: none !important; }
.punbb .post .post-links li a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font: 400 10px/1.5 var(--font1);
  text-transform: lowercase;
  color: var(--muted);
}
.punbb .post .post-links li a:hover { color: var(--red); }
.punbb .post .post-links li a::before { font: 400 8px/1 var(--fa); }
.punbb .post .post-links a[href*="profile.php"]::before { content: "\f007"; }
.punbb .post .post-links a[href*="pmsend"]::before,
.punbb .post .post-links a[href*="messages"]::before { content: "\f0e0"; }
.punbb .post .post-links a[href*="delete.php"]::before { content: "\f1f8"; }
.punbb .post .post-links a[href*="edit.php"]::before { content: "\f303"; }
.punbb .post .post-links li.pl-quote a::before { content: "\f10e"; }
.punbb .post .post-links .pl-email.email,
.punbb .post .post-links .pl-website { display: none; }

/* --- дополнения к посту --- */

.punbb .post::before {
  content: none;
}

.punbb .post h3 > span > a::before,
.punbb .post h3 .permalink::before {
  content: "//";
  display: inline-block;
  margin-right: 10px;
  color: var(--hint-light);
}

.punbb .post .post-box {
  width: auto !important;
  min-width: 0;
  max-width: 100%;
  margin: 0 !important;
  padding: 0;
  box-sizing: border-box;
  background: none;
  border: 0;
  box-shadow: none;
  font: inherit;
  color: inherit;
}

/* пост с [hideprofile] — всё на всю ширину, включая ссылки внизу */
.punbb .post.hideprofile h3,
.punbb .post.hideprofile .post-body,
.punbb .post.hideprofile .post-links {
  grid-column: 1 / -1;
}

/* --- быстроплюс --- */


.post-rating {
  position: absolute;
  right: 24px;
  bottom: 27px;
}

.post-vote {
  position: absolute;
  right: 0;
  bottom: 27px;
}

.punbb .post .post-vote p > a,
.post-vote p > a {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-left: 4px;
  box-sizing: border-box;
  background: var(--cream);
  border: 1px solid var(--border);
  font-size: 11px !important;
  line-height: 18px;
  text-align: center;
  color: var(--text);
}

.post-vote p > a:first-child { margin-left: 0; }
.post-vote p > a:hover { background: var(--active); }


.punbb .post .post-vote p > a { font-size: 0 !important; }
.post-vote p > a::before { content: "+"; font-size: 12px; font-weight: 200; }
.post-vote p > a[href*="v=0"]::before { content: "\2212"; }

.punbb .post .post-rating p > a,
.post-rating p > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  box-sizing: border-box;
  background: var(--red);
  border: 1px solid var(--border);
  font-size: 9px !important;
  color: var(--cream);
  transition: background .2s;
}

.post-rating p > a::before {
  content: "";
  width: 9px;
  height: 8px;
  background: var(--cream);
  -webkit-mask: var(--heart) center / contain no-repeat;
          mask: var(--heart) center / contain no-repeat;
  opacity: .55;
  transition: opacity .2s;
}

.post-rating p > a:hover { background: var(--accent); color: var(--cream); }

.post-rating p > a:hover::before,
.post-rating p > a.noNullLiked::before { opacity: 1; }

.post-rating p > a.active { animation: heart-pop .35s ease; }

@keyframes heart-pop {
  50% { transform: scale(1.18); }
}


/* сердечко и плюс — одной высоты с иконками действий */
.punbb .post .post-rating p > a,
.punbb .post .post-vote p > a {
  box-sizing: border-box;
  height: 22px;
  line-height: 20px;
}

/* Окна редактора — под панелью кнопок */
#tags {
  position: relative;
  z-index: 20;
}

#tags > .container {
  position: absolute;
  top: 0 !important;
  box-sizing: border-box;
  max-width: 100%;
  padding: 12px 14px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 0px;
  box-shadow: 0 4px 10px rgba(30, 15, 17, .12);
  color: var(--text);
  font: 12px/1.5 var(--font1);
}


/* =========================================================
   ФОРМА ОТВЕТА
   ========================================================= */

#post,
.punbb .formal {
  width: 899px;
  margin: 0 auto 30px;
}

#post-form h2,
#post h2,
#post fieldset legend,
#post-form legend { display: none; }

#main-reply {
  height: 220px;
  min-height: 120px;
  padding: 12px 14px;
  resize: vertical;
  line-height: 1.5;
}


.like-all-posts {
  display: block;
  margin: 0 0 10px auto;
}



/* панель редактора — полоска над полем, сливается с ним в один блок */
#form-buttons {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 0 !important;
  padding: 6px 10px !important;
  background: var(--bar);
  border: 1px solid var(--line);
  border-bottom: none;
}

#main-reply { border-top-style: dashed !important; }

#form-buttons table { width: auto !important; margin: 0 !important; }

#form-buttons table tr {
  display: flex !important;
  flex-wrap: wrap;
  gap: 4px;
}

#form-buttons td {
  position: relative;
  display: inline-flex;
  width: 24px !important;
  height: 24px;
  padding: 0;
  background: none !important;
}

#form-buttons td img {
  width: 100%;
  height: 100%;
  cursor: pointer;
}

/* родные картинки кнопок прячем, только когда иконки Font Awesome точно загрузились
   (класс fa-ok ставит скрипт в HTML-низе); если шрифт не загрузился — видны обычные кнопки rusff */
html.fa-ok #form-buttons td img { opacity: 0; }
html:not(.fa-ok) #form-buttons td::before { display: none; }

#form-buttons td::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 2px;
  font: 400 12px var(--fa);
  color: var(--muted);
  pointer-events: none;
  transition: color .2s, background .2s;
}

#form-buttons td:hover::before {
  background: var(--card);
  color: var(--red);
}

#button-font::before { content: '\f031'; }
#button-size::before { content: '\f034'; }
#button-bold::before { content: '\f032'; }
#button-italic::before { content: '\f033'; }
#button-underline::before { content: '\f0cd'; }
#button-strike::before { content: '\f0cc'; }
#button-indent::before { content: '\f03c'; }
#button-left::before { content: '\f036'; }
#button-center::before { content: '\f037'; }
#button-right::before { content: '\f038'; }
#button-justify::before { content: '\f039'; }
#button-link::before { content: '\f0c1'; }
#button-spoiler::before { content: '\f518'; }
#button-image::before { content: '\f302'; }
#button-video::before { content: '\f144'; }
#button-hide::before { content: '\f30d'; }
#button-quote::before { content: '\f27a'; }
#button-code::before { content: '\f121'; }
#button-color::before { content: '\f53f'; }
#button-table::before { content: '\f009'; }
#button-sticker::before { content: '\f6be'; }   /* котик — кнопка стикеров */
#form-buttons #button-sticker { background: none !important; }
#button-keyboard::before { content: '\f11c'; }
#button-smile::before { content: '\f118'; }
#button-addition::before { content: '\f0d7'; }
#button-upload::before { content: '\f093'; }

#button-files_rusff,
#button-graffiti_rusff { display: none !important; }


/* счётчик символов — только число, слева, маленькой синей плашкой с разделителем */
#plng {
  order: -1;
  float: none;
  display: flex;
  align-items: center;
  padding-right: 10px;
  border-right: 1px solid var(--line);
  font-size: 0;
}

#plng b {
  min-width: 18px;
  padding: 3px 6px;
  border-radius: 2px;
  background: var(--blue);
  font-size: 10px;
  font-weight: 400;
  line-height: 1.2;
  text-align: center;
  color: var(--card);
}


#post .formsubmit {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 10px;
}

#post .formsubmit input,
#togglePreview .button { margin: 0; }




/* =========================================================
   ПРОФИЛЬ
   меню — окошко «профиль» с клавишами; слева карточка как минипрофиль в постах
   (хэдер, иконку, лз, плашку и счётчики туда переносит скрипт из HTML-низа)
   ========================================================= */

#pun-profile h1 { display: none; }

/* --- меню профиля: тихая строка-закладки под адресной строкой,
       главные разделы на виду, остальные в «ещё» (собирает скрипт профиля) --- */
#profilenav {
  position: relative;
  z-index: 5;
  width: 899px;
  margin: -16px auto 26px;
  padding: 0 18px;
  box-sizing: border-box;
}
#profilenav h2 { display: none; }

#profilenav ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 16px;
  margin: 0;
  padding: 0;
}

#profilenav li a,
#profilenav .cb-more > button {
  position: relative;
  display: block;
  margin: 0;
  padding: 2px 0 2px 11px;
  background: none;
  border: 0;
  box-shadow: none;
  font: 400 10px/14px var(--font1);
  text-transform: lowercase;
  color: var(--muted);
  cursor: pointer;
}
/* клетка перед пунктом: серая, у текущего раздела — розовая */
#profilenav li a::before,
#profilenav .cb-more > button::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  width: 5px;
  height: 5px;
  background: var(--line);
}
#profilenav li a:hover,
#profilenav .cb-more > button:hover { color: var(--link); background: none; }
#profilenav li.isactive > a { color: var(--ink); }
#profilenav li.isactive > a::before,
#profilenav .cb-more.isactive > button::before { background: var(--blue); }

/* «ещё &#9662;» и выпадающий список */
#profilenav .cb-more { position: relative; }
#profilenav .cb-more > button::after {
  content: "\f107";
  margin-left: 4px;
  font: 400 8px/1 var(--fa);
}
#profilenav .cb-more > ul {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 10;
  display: none;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  min-width: 150px;
  padding: 6px 0;
  background: var(--card);
  border: 1px solid var(--btn-line);
  box-shadow: 2px 2px 0 rgba(0, 0, 0, .18);
}
/* невидимый мостик, чтобы список не закрывался, пока мышка идёт к нему */
#profilenav .cb-more > ul::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 0;
  right: 0;
  height: 8px;
}
#profilenav .cb-more:hover > ul,
#profilenav .cb-more.is-open > ul { display: flex; }
#profilenav .cb-more > ul a { padding: 3px 12px 3px 23px; }
#profilenav .cb-more > ul a::before { left: 12px; top: 7px; }
#profilenav .cb-more > ul a:hover { background: var(--chip); }

#profile .container { padding: 0; }

/* --- раскладка: карточка слева, поля справа --- */
#viewprofile {
  width: 899px;
  margin: 0 auto 30px;
}
#viewprofile table,
#viewprofile tbody { display: block; width: 100%; }
#viewprofile tr {
  display: flex;
  align-items: flex-start;
  gap: 32px;
}

/* --- карточка слева: тот же минипрофиль, что в постах --- */
#viewprofile #profile-left {
  position: relative;
  z-index: 0;
  flex: 0 0 223px;
  width: 223px !important;
  margin-top: 16px;                  /* сверху «активен …» */
  padding: 29px 11.5px 42px !important;
  box-sizing: border-box;
  background: linear-gradient(var(--cream) 0 50px, var(--white) 50px calc(100% - 42px), var(--cream) calc(100% - 42px));
  border: 0;
  box-shadow: 1px 1px .5px rgba(0, 0, 0, .1);
  font: 400 9px/1.3 var(--font1);
  color: var(--text);
  text-align: left;
}
#viewprofile #profile-left::before,
#viewprofile #profile-left::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: repeating-linear-gradient(90deg, #646464 0 2px, transparent 2px 5px);
  pointer-events: none;
}
#viewprofile #profile-left::before { top: 50px; z-index: -1; }
#viewprofile #profile-left::after  { bottom: 42px; z-index: -1; }

#viewprofile #profile-left:has(> li),
#viewprofile #profile-left *:has(> li) {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  position: static;
  min-height: 224px;
  margin: 0 0 1px;
  padding: 9px 17px 14px;
  box-sizing: border-box;
  background: var(--white);
  border: 1px solid #ededed;
}

#viewprofile #profile-left li {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left;
}
#viewprofile #profile-left strong,
#viewprofile #profile-left b { font-weight: 400 !important; }

/* подписи у перенесённых полей не нужны */
#viewprofile #profile-left li[id^="pa-fld"] > span:first-child { display: none; }
#viewprofile #profile-left li[id^="pa-fld"] > strong { display: contents; }

/* ник */
#viewprofile #profile-left #profile-name {
  order: 1;
  padding-right: 32px !important;
  font: 510 11px/13px var(--font1);
  color: var(--ink);
  overflow-wrap: anywhere;
}

/* статус */
#viewprofile #profile-left #profile-title {
  order: 2;
  width: auto !important;
  margin-top: 2px !important;
  padding: 0 32px 0 0 !important;
  background: none;
  border-radius: 0;
  box-shadow: none;
  font: 400 8px/10px var(--font1);
  color: #858585;
}

/* аватар */
#viewprofile #profile-left #pa-avatar,
#viewprofile #profile-left .pa-avatar {
  order: 3;
  display: flex;
  justify-content: center;
  margin: 14px 0 15px !important;
}
#viewprofile #profile-left img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

/* лз */
#viewprofile #profile-left #pa-fld2 {
  order: 4;
  margin-bottom: 14px !important;
  font: 300 8px/1.3 var(--font1);
  text-transform: lowercase;
  color: #646464;
  overflow-wrap: anywhere;
}
#viewprofile #profile-left #pa-fld2 a.lz-name {
  display: block;
  margin-bottom: 6px;
  font: italic 400 9px/11px var(--font1);
  text-transform: none;
  color: #000;
}
#viewprofile #profile-left #pa-fld2 a:not(.lz-name) { color: var(--link); text-decoration: none; }
#viewprofile #profile-left #pa-fld2 a:hover { color: var(--text); }

/* счётчики: сообщения, уважение, деньги — как в постах */
#viewprofile #profile-left .cb-stats {
  order: 5;
  display: flex;
  justify-content: center;
  gap: 32px;
}
#viewprofile #profile-left .cb-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  font: 300 8px/10px var(--font1);
  color: #646464;
}
#viewprofile #profile-left .cb-stat::before {
  display: block;
  height: 9px;
  font: 400 8px/9px var(--fa);
  color: #646464;
}
#viewprofile #profile-left .cb-stat--posts::before   { content: "\f27a"; }
#viewprofile #profile-left .cb-stat--respect::before { content: "\f004"; }
#viewprofile #profile-left .cb-stat--money::before   { content: "\f555"; }
#viewprofile #profile-left a.cb-stat:hover,
#viewprofile #profile-left a.cb-stat:hover::before { color: var(--link); }

/* «редактировать» — маленькая клавиша внизу карточки */
#viewprofile #profile-left .profile-edit {
  order: 6;
  margin-top: 14px !important;
  text-align: center;
}
#viewprofile #profile-left .profile-edit a {
  display: inline-block;
  padding: 3px 10px;
  background: var(--btn);
  border: 1px solid var(--btn-line);
  border-radius: 0;
  box-shadow: none;
  font-size: 9px;
  text-transform: lowercase;
  color: var(--ink);
}
#viewprofile #profile-left .profile-edit a:hover { background: var(--blue); }

/* иконка — окошко 25 &#215; 25, картинка 14 &#215; 14 */
#viewprofile #profile-left #pa-fld3 {
  position: absolute;
  top: 39px;
  right: 24px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  box-sizing: border-box;
  overflow: hidden;
  background: #f1f1f0;
  border: .9px solid #ededed;
  border-radius: 3px;
  box-shadow: inset 0 1.8px 2.6px rgba(0, 0, 0, .1);
  font-size: 13px;
  line-height: 1;
}
#viewprofile #profile-left #pa-fld3 img {
  width: 14px;
  height: 14px;
  object-fit: contain;
}

/* хэдер сверху */
#viewprofile #profile-left #pa-fld1 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: -2;
  height: 50px;
  overflow: hidden;
}
#viewprofile #profile-left #pa-fld1 img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover;
}

/* плашка снизу: картинка + один или два текста */
#viewprofile #profile-left #pa-fld5 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  height: 42px;
  padding: 0 14px 0 29px !important;
  box-sizing: border-box;
  overflow: hidden;
}
#viewprofile #profile-left #pa-fld5 img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover;
}
#viewprofile #profile-left #pa-fld5 span:not(:first-child) {
  max-width: 100%;
  padding: 2px 6px;
  box-sizing: border-box;
  overflow: hidden;
  background: var(--white);
  filter: drop-shadow(1px 1px .95px rgba(0, 0, 0, .32));
  font: 300 10px/12px var(--font1);
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #000;
}
#viewprofile #profile-left #pa-fld5 span:not(:first-child) + span { font-size: 8px; line-height: 10px; }


/* «активен …» — над карточкой с крестиком-окошком */
#viewprofile #profile-left #pa-online {
  position: absolute;
  top: -16px;
  left: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  font: 400 8px/10px var(--font1);
  text-transform: lowercase;
  white-space: nowrap;
  color: #858585;
}
#viewprofile #profile-left #pa-online::before {
  content: "";
  flex: none;
  width: 10px;
  height: 10px;
  background: var(--xbox) center / contain no-repeat;
}
#viewprofile #profile-left #pa-last-visit { display: none; }

/* --- поля справа: светлые карточки --- */
#viewprofile #profile-right {
  flex: 1;
  width: auto !important;
  padding: 0 !important;
}
#viewprofile #profile-right:has(> li),
#viewprofile #profile-right *:has(> li) {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
  padding: 0;
}
#viewprofile #profile-right li {
  margin: 0 !important;
  padding: 9px 14px 10px !important;
  background: var(--card);
  border: 1px solid var(--line);
}
#viewprofile #profile-right li > span:first-child {
  display: block;
  margin: 0 0 4px !important;
  padding: 0 !important;
  font-size: 9px;
  font-weight: 200;
  text-transform: lowercase;
  color: var(--muted);
}
#viewprofile #profile-right li > span:first-child a { color: var(--muted); }
#viewprofile #profile-right li strong {
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 11px;
  font-weight: 400;
  color: var(--text);
}
#viewprofile #profile-right #pa-email,
#viewprofile #profile-right #pa-posts { grid-column: 1 / -1; }

/* «у пользователя нет подарков. подарить первым» — прячем */
#pun-profile #profile-gifts,
#pun-profile .profile-gifts,
#viewprofile + p,
#viewprofile ~ .container { display: none; }


/* =========================================================
   КНОПКИ UP / DOWN — клавиши справа от форума
   ========================================================= */

#ToTop,
#OnBottom {
  position: fixed;
  left: calc(50% + 557px);
  z-index: 50;
  display: none;
  width: 50px;
  height: 22px;
  padding: 0;
  box-sizing: border-box;
  background: var(--btn);
  border: 1px solid var(--btn-line);
  font: 400 10px/20px var(--font1);
  text-align: center;
  color: var(--ink);
  cursor: pointer;
  transition: transform .15s ease, background .2s, box-shadow .15s;
}

#ToTop { top: calc(50% - 35px); }
#OnBottom { top: calc(50% + 13px); }

#ToTop:hover,
#OnBottom:hover {
  background: var(--blue);
  box-shadow: 2px 2px 0 rgba(0, 0, 0, .25);
  transform: translate(-1px, -1px);
}
/* =========================================================
   ДИММЕР ЯРКОСТИ
   ========================================================= */

#screenDimmer {
  position: fixed;
  top: 100px;
  right: 20px;
  z-index: 999;
  font-family: var(--font1);
}

#dimmerToggle {
  width: 32px;
  height: 32px;
  padding: 0;
  font-size: 15px;
}

#dimmerToggle i { font-style: normal; }

#dimmerPanel {
  position: absolute;
  top: 46px;
  right: 0;
  display: none;
  width: 150px;
  padding: 10px 12px;
  background: var(--cream);
  border: 1px solid var(--border);
}

#dimmerPanel.active { display: block; }

#dimmerPanel span {
  display: block;
  margin-bottom: 7px;
  font-size: 11px;
}

#dimmerRange {
  width: 100%;
  accent-color: var(--accent);
}


/* =========================================================
   РАЗМЕР И ШРИФТ В ПОСТАХ
   ========================================================= */

.fontButtons {
  display: inline-flex;
  gap: 4px;
  float: right;
  margin-right: 10px;
}

.fontButtons button {
  min-width: 26px;
  padding: 3px 6px;
  font-size: 11px;
}
#pun-admain a {    cursor: pointer;
    color: var(--red) !important;
    font-family: var(--font1);
    font-size: 11px;}



.punbb .post .post-rating p.container,
.punbb .post .post-vote p.container {
  margin: 0 !important;
  padding: 0 !important;
  width: auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  height: 22px;
}

.punbb .post .post-vote p.container > a {
  margin: 0 !important;
}

.punbb .post .post-rating {
right: 24px;
  bottom: 18px;
}
.punbb .post .post-vote {
right: 0;
  bottom: 18px;
}

/* не лайкнуто: светлая кнопка, красное сердечко */
.punbb .post .post-rating p > a {
  background: var(--cream);
  color: var(--red);
}
.punbb .post .post-rating p > a::before {
  background: var(--cb-heart, var(--red));
  opacity: 1;
}
.punbb .post .post-rating p > a:hover {
  background: var(--beige);
  color: var(--red);
}

/* =========================================================
   КОД — шапка с действиями «скопировать | в форму ответа» (их ставит скрипт в HTML-низе)
   ========================================================= */

.punbb .code-box {
  margin: 14px 0;
  padding: 0;
  overflow: hidden;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 3px;
}

.punbb .code-box strong.legend {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  background: var(--bar);
  border: none;
  border-bottom: 1px dashed var(--line);
  font: 400 10px/1.4 var(--font1);
  text-transform: lowercase;
  color: var(--muted);
}

/* маленькая синяя метка «код» слева */
.punbb .code-box strong.legend::before {
  content: "код";
  padding: 1px 6px;
  border-radius: 2px;
  background: var(--blue);
  font-size: 9px;
  color: var(--card);
}

.punbb .code-box .cb-code-act {
  color: var(--muted);
  cursor: pointer;
  transition: color .2s;
}

.punbb .code-box .cb-code-act:hover { color: var(--red); }
.punbb .code-box .cb-code-act.is-done { color: var(--blue); }

.punbb .code-box .cb-code-sep {
  width: 1px;
  height: 10px;
  background: var(--line);
}

.punbb .code-box pre {
  margin: 0;
  padding: 12px;
  max-height: 300px;
  overflow: auto;
  background: none;
  border: none;
  color: var(--text);
  font: 11px/1.6 Consolas, monospace;
  white-space: pre-wrap;
}


/* =========================================================
   ЦИТАТА — светлая карточка: имя плашкой внутри слева, значок кавычек в квадратике справа
   ========================================================= */

.punbb .quote-box:not(.spoiler-box) {
  position: relative;
  margin: 14px 0;
  padding: 34px 16px 14px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 3px;
}

/* «hello kitty написал(а):» — маленькая плашка в левом верхнем углу */
.punbb .quote-box:not(.spoiler-box) > cite {
  position: absolute;
  top: 8px;
  left: 8px;
  max-width: calc(100% - 50px);
  padding: 3px 7px;
  overflow: hidden;
  border-radius: 2px;
  background: var(--blue);
  font: 500 8px/1.3 var(--font1);
  letter-spacing: .02em;
  text-transform: uppercase;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--card);
}

.punbb .quote-box:not(.spoiler-box) > cite a { color: inherit; }
.punbb .quote-box:not(.spoiler-box) > cite a:hover { color: var(--beige); }

/* кавычки — в маленьком квадратике в правом верхнем углу */
.punbb .quote-box:not(.spoiler-box)::after {
  content: "\f10e";
  position: absolute;
  top: 8px;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: var(--white);
  font: 400 7px/1 var(--fa);
  color: var(--muted);
}

.punbb .quote-box:not(.spoiler-box) > blockquote {
  margin: 0;
  padding: 0;
  color: var(--text);
}


.punbb .post #post,
.punbb .post .formal {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

.punbb .post #post fieldset,
.punbb .post #post .fs-box,
.punbb .post #post .resizable-textarea {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.punbb .post #post textarea {
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}


/* =========================================================
   СПОЙЛЕР 
   ========================================================= */

.punbb .quote-box.spoiler-box {
  margin: 12px 0;
  padding: 0;
  background: var(--card);
  border: 1px solid var(--line);
}

.punbb .quote-box.spoiler-box > div {
  position: relative;
  display: block;
  margin: 0;
  padding: 7px 12px 7px 30px;
  background: none !important;           
  border: none;
  color: var(--muted);
  font: 400 10px/1.4 var(--font1);
  cursor: pointer;
  user-select: none;
  transition: color .2s;
}

.punbb .quote-box.spoiler-box > div:hover { color: var(--link); }

.punbb .quote-box.spoiler-box > div::before {
  content: "\f067";                     /* плюс */
  position: absolute;
  top: 50%;
  left: 12px;
  width: 10px;
  margin-top: -6px;
  font: 400 10px/12px var(--fa);
  text-align: center;
  transition: transform .3s ease;
}


.punbb .quote-box.spoiler-box > div.visible::before {
  content: "\f068";
  transform: rotate(180deg);
}

.punbb .quote-box.spoiler-box > div.visible { border-bottom: 1px dashed var(--line); }

.punbb .quote-box.spoiler-box > blockquote {
  margin: 0;
  padding: 12px;
  color: var(--text);
}


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

#pun-userlist .formal {
  width: 899px;
  margin: 0 auto 24px;
}

#pun-userlist .formal legend { display: none; }


#pun-userlist form .cb-fields,
#pun-userlist form.cb-fields {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 12px;
}

#pun-userlist form .cb-field {
  display: flex !important;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 4px;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

#pun-userlist form .cb-field br { display: none; }

#pun-userlist .formal label {
  font-size: 9px;
  font-weight: 200;
  text-transform: lowercase;
  color: var(--muted);
}

#pun-userlist .formal input[type="text"],
#pun-userlist .formal select {
  height: 28px;
  padding: 0 8px;
  font-size: 11px;
}

#pun-userlist .formal input[type="text"] { width: 200px; }


#pun-userlist form .cb-note {
  flex: 0 0 100%;
  margin: 6px 0 0 !important;
  font-size: 10px;
  font-weight: 200;
  line-height: 1.5;
  color: var(--muted);
}

#pun-userlist .formal .formsubmit { padding-top: 10px; }


#pun-userlist .user-avatar img,
#pun-userlist .user-avatar .avatar-image {
  width: 30px !important;
  height: 30px !important;
  box-sizing: border-box;
  border: 1px solid var(--red);
  border-radius: 0 !important;
  background-size: cover !important;
  object-fit: cover;
}


/* =========================================================
   ССЫЛКИ В ОПИСАНИЯХ ФОРУМОВ НА ГЛАВНОЙ
   ========================================================= */

#pun-index .tclcon a:not(h3 a) {
  color: var(--link);
  border-bottom: 1px dashed currentColor;
  transition: border-color .2s, color .2s;
}
#pun-index .tclcon a:not(h3 a):hover {
  color: var(--text);
  border-bottom-style: solid;
}

#pun-index .tclcon .f-links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 14px;
}

/* ссылки под описанием — клавиши: светлая, розовая с тенью, светлая… */
/* ссылки под описанием — светлые клавиши; при наведении розовые и «приподнимаются» с тенью
   (в макете это два состояния одной кнопки: обычное и ховер) */
#pun-index .tclcon .f-links a {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  background: var(--btn);
  border: 1px solid var(--ink);
  border-radius: 0;
  font: 400 10px/12px var(--font1);
  text-transform: lowercase;
  color: var(--ink);
  transition: transform .15s ease, box-shadow .15s ease, background .2s;
}
#pun-index .tclcon .f-links a::before { content: "// "; white-space: pre; }
#pun-index .tclcon .f-links a:hover {
  background: var(--blue);
  color: var(--ink);
  border-bottom-style: solid;
  box-shadow: 2px 2px 0 rgba(0, 0, 0, .25);
  transform: translate(-1px, -1px);
}
.punbb .post .post-content table,
.punbb .post .post-content tr,
.punbb .post .post-content th,
.punbb .post .post-content td {
  border: none;
  background: none;
}

.punbb .post .post-content table { border-collapse: collapse; }




.punbb .post-content table {
  border: none !important;
  border-collapse: collapse;
}

.punbb .post-content table th,
.punbb .post-content table td {
  border: none !important;
  vertical-align: top;
}



/* =========================================================
   ОНЛАЙН НА АВАТАРКЕ — маленький красный квадратик у нижнего края
   ========================================================= */

.punbb .user-avatar { position: relative; }

.punbb .user-avatar .isonline {
  position: absolute !important;
  top: 26px !important;
  left: 12px !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 3;
  display: block !important;
  width: 7px !important;
  height: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--red) !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: 0 0 0 1px var(--card) !important;
  filter: none;
  animation: none;
}

.punbb .user-avatar .isonline::before { display: none; }

/* в списке тем аватарка меньше (26px) */
.punbb .forum td.tcr .user-avatar .isonline { top: 22px !important; left: 10px !important; }


#form-buttons #button-sticker {
  background: none !important;
  cursor: pointer;
}

#form-buttons #button-sticker::before {
  content: "\f6be";
  font-family: var(--fa);
  font-weight: 900;
  font-size: 14px;
}

#form-buttons #button-sticker.loading::before {
  opacity: .45;
}

/* ===== ОКНО СТИКЕРОВ ===== */

.hvStickerPackModal {
  box-sizing: border-box;
  padding: 12px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 6px;
  box-shadow: 0 8px 28px rgba(30, 15, 17, .12);
  color: var(--text);
  font: 12px/1.4 var(--font1);
}


.hvStickerPackModalContent {
  box-sizing: border-box;
  gap: 6px;
  min-height: 100px;
  max-height: 280px;
  padding: 10px;
  background: var(--chip);
  border: 1px solid var(--line);
  border-radius: 4px;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
}

.hvStickerPackModalContent::-webkit-scrollbar {
  width: 5px;
}

.hvStickerPackModalContent::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 5px;
}


.hvStickerPackItem {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7px;
  border-radius: 4px;
  transition: background .2s;
}

.hvStickerPackItem:hover {
  background: var(--beige);
}

.hvStickerPackModalContent .hvStickerPackItem img {
  display: block;
  width: auto;
  height: auto;
  max-width: 90px;
  max-height: 80px;
  object-fit: contain;
  cursor: pointer;
}


.hvStickerPackModalTabs {
  gap: 6px;
  padding-top: 10px;
}

.hvStickerPackModalTab {
  margin: 0;
  padding: 6px 11px;
  background: var(--chip);
  border: 1px solid var(--line);
  border-radius: 3px;
  color: var(--muted);
  font: 500 11px/1.3 var(--font1);
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}

.hvStickerPackModalTab:hover {
  background: var(--beige);
  border-color: var(--beige);
  color: var(--text);
}

.hvStickerPackModalTab.active {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--card);
}

.hvStickerPackModalAdd {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
}

.hvStickerPackModalAdd.hidden {
  display: none;
}

.hvStickerPackModal .hvStickerPackModalInput {
  box-sizing: border-box;
  flex: 1;
  min-width: 0;
  width: auto;
  height: 32px;
  padding: 7px 10px;
  background: var(--chip);
  border: 1px solid var(--line);
  border-radius: 3px;
  color: var(--text);
  font: 12px var(--font1);
}

.hvStickerPackModal .hvStickerPackModalInput:focus {
  border-color: var(--blue);
  outline: none;
}

.hvStickerPackModal .hvStickerPackModalAddButton {
  box-sizing: border-box;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  background: var(--blue);
  border: 1px solid var(--blue);
  border-radius: 3px;
  color: var(--card);
  font: 20px/1 var(--font1);
}

.hvStickerPackModal .hvStickerPackModalAddButton:hover {
  background: var(--blue-dark);
  border-color: var(--blue-dark);
}

.hvStickerPackRemoveItem {
  top: 2px;
  right: 2px;
  width: 17px;
  height: 17px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--muted);
  font: 12px/17px var(--font1);
}

.hvStickerPackRemoveItem:hover {
  background: var(--red);
  border-color: var(--red);
  color: var(--card);
}

#form-buttons #button-sticker::before {
  font-weight: 400;
}

.hvStickerPackModal .hvStickerPackModalTab {
  margin: 0;
  padding: 6px 11px;
  background: var(--chip);
  border: 1px solid var(--line);
  border-radius: 3px;
  color: var(--muted);
  font: 500 11px/1.3 var(--font1);
}

.hvStickerPackModal .hvStickerPackModalTab:hover {
  background: var(--beige);
  border-color: var(--beige);
  color: var(--text);
}

.hvStickerPackModal .hvStickerPackModalTab.active {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--card);
}


#pun-stats .container {
  align-items: start;
}

#pun-stats .cb-stats-numbers {
  grid-column: 1;
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  position: relative;
  z-index: 1;
}

#pun-stats .cb-stats-online {
  grid-column: 2;
  display: flex;
  flex-direction: column;
  min-width: 0;
  position: relative;
  z-index: 1;
}

#pun #form-buttons td::before {
  display: flex !important;
}

/* =========================================================
   БЫСТРАЯ СМЕНА АККАУНТА — панель у ссылки «аккаунты» / «вход»
   ========================================================= */

.cb-acc {
  position: absolute;
  z-index: 100000;
  display: none;
  gap: 14px;
  width: 470px;
  max-width: calc(100vw - 20px);
  padding: 14px;
  box-sizing: border-box;
  background: var(--card);
  border: 1px solid var(--border);
  box-shadow: var(--shadow), 0 8px 24px rgba(30, 15, 17, .12);
  font: 400 11px/1.35 var(--font1);
  color: var(--text);
  text-align: left;
  text-transform: none;
}
.cb-acc.is-open { display: flex; }
.cb-acc *, .cb-acc *::before, .cb-acc *::after { box-sizing: border-box; }

.cb-acc__col {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  padding: 12px;
  background: var(--panel);
  border-radius: 8px;
}

/* заголовок колонки: плашка + счётчик клеткой */
.cb-acc__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.cb-acc__head b {
  padding: 4px 10px;
  background: var(--chip);
  box-shadow: var(--shadow);
  font-size: 10.5px;
  font-weight: 600;
}
.cb-acc__head span {
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  background: var(--blue);
  color: #fff;
  font: 400 10px/18px var(--font2);
  text-align: center;
}

/* --- список аккаунтов --- */
.cb-acc__list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  max-height: 196px;
  margin: 0 -4px;
  padding: 0 4px;
  overflow-y: auto;
  list-style: none;
  scrollbar-width: thin;
}
.cb-acc__row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: none;
  height: 32px;
  margin: 0;
  padding: 0 28px 0 6px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 6px;
  cursor: pointer;
  transition: border-color .15s, transform .15s;
}
.cb-acc__row:hover { border-color: var(--blue); transform: translateX(2px); }

/* первая буква ника в синей клетке */
.cb-acc__row i {
  flex: none;
  width: 20px;
  height: 20px;
  background: var(--blue);
  color: #fff;
  font: 600 10px/20px var(--font1);
  font-style: normal;
  text-align: center;
}
.cb-acc__row span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  font-weight: 600;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cb-acc__row em {
  flex: none;
  padding: 2px 6px;
  background: var(--beige);
  font: 500 8.5px/1 var(--font1);
  font-style: normal;
  color: var(--label);
}

/* текущий аккаунт */
.cb-acc__row.is-current { cursor: default; border-color: var(--line); transform: none; }
.cb-acc__row.is-current i { background: var(--red); }

/* пароль не подошёл / идёт вход */
.cb-acc__row.is-failed { border-color: var(--red); }
.cb-acc__row.is-busy { pointer-events: none; opacity: .6; }

/* крестик «забыть» — виден при наведении, на телефоне всегда */
.cb-acc button.cb-acc__del {
  position: absolute;
  top: 50%;
  right: 5px;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 50%;
  color: var(--muted);
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s, background .15s;
}
.cb-acc button.cb-acc__del::before { content: "\f00d"; font: 400 9px/18px var(--fa); }
.cb-acc__row:hover .cb-acc__del { opacity: 1; }
.cb-acc button.cb-acc__del:hover { background: var(--beige); color: var(--red); }
@media (hover: none) { .cb-acc button.cb-acc__del { opacity: 1; } }

.cb-acc__empty {
  margin: 0;
  padding: 14px 10px;
  border: 1px dashed var(--border);
  border-radius: 6px;
  color: var(--muted);
  font-size: 10px;
  text-align: center;
}

/* --- поля --- */
.cb-acc__label {
  display: block;
  margin: 0 0 8px;
  font-size: 10px;
  color: var(--label);
}
.cb-acc input[type="text"],
.cb-acc input[type="password"] {
  display: block;
  width: 100%;
  height: 28px;
  margin: 4px 0 0;
  padding: 0 12px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: none;
  font: 400 11px/1 var(--font1);
  color: var(--text);
  outline: none;
}
.cb-acc input[type="text"]:focus,
.cb-acc input[type="password"]:focus { border-color: var(--blue); }
.cb-acc input.cb-acc__search { margin: 0 0 8px; height: 24px; font-size: 10px; }

/* пароль с глазком */
.cb-acc__pw { position: relative; display: block; }
.cb-acc__pw input { padding-right: 32px !important; }
.cb-acc button.cb-acc__eye {
  position: absolute;
  top: 4px;
  right: 6px;
  width: 22px;
  height: 22px;
  padding: 0;
  background: none;
  border: 0;
  color: var(--muted);
  cursor: pointer;
}
.cb-acc button.cb-acc__eye::before { content: "\f06e"; font: 400 10px/22px var(--fa); }
.cb-acc button.cb-acc__eye.is-shown::before { content: "\f070"; }

.cb-acc__check {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 2px 0 10px;
  font-size: 10px;
  color: var(--label);
  cursor: pointer;
}
.cb-acc__check input { margin: 0; accent-color: var(--blue); }

.cb-acc__error {
  margin: 0 0 10px;
  padding: 6px 9px;
  background: var(--card);
  border-left: 3px solid var(--red);
  font-size: 10px;
  color: var(--red);
}
.cb-acc__hint {
  margin: 8px 0 0;
  font-size: 9px;
  color: var(--muted);
  text-align: center;
}

/* --- кнопки --- */
.cb-acc button.cb-acc__btn {
  height: 28px;
  padding: 0 14px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 3px;
  box-shadow: var(--shadow);
  color: var(--text);
  font: 600 10.5px/1 var(--font1);
  text-transform: none;
  cursor: pointer;
}
.cb-acc button.cb-acc__btn:hover { background: var(--beige); }
.cb-acc button.cb-acc__btn.is-main { width: 100%; background: var(--blue); border-color: var(--blue); color: var(--card); }
.cb-acc button.cb-acc__btn.is-main:hover { background: var(--red); border-color: var(--red); }
.cb-acc button.cb-acc__btn:disabled { opacity: .45; cursor: default; box-shadow: none; }

.cb-acc__tools {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
  padding-top: 12px;
}
.cb-acc__walk { width: 100%; }
.cb-acc.is-walking .cb-acc__walk { background: var(--blue); border-color: var(--blue); color: var(--card); }

.cb-acc button.cb-acc__link {
  align-self: center;
  padding: 2px 4px;
  background: none;
  border: 0;
  color: var(--muted);
  font: 400 9.5px/1 var(--font1);
  text-transform: none;
  cursor: pointer;
}
.cb-acc button.cb-acc__link:hover { color: var(--blue); }

/* перенос на другое устройство — раскрывается по клику */
.cb-acc__transfer {
  display: none;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
}
.cb-acc.is-moving .cb-acc__transfer { display: block; }
.cb-acc__line { display: flex; gap: 6px; margin: 4px 0 10px; }
.cb-acc__line input { margin: 0 !important; }
.cb-acc__line:last-child { margin-bottom: 0; }
.cb-acc__line .cb-acc__btn { flex: none; padding: 0 10px; }

/* выход */
.cb-acc a.cb-acc__out {
  margin-top: 10px;
  color: var(--red);
  font-size: 10px;
  text-align: center;
  text-decoration: none;
}
.cb-acc a.cb-acc__out:hover { color: var(--accent); text-decoration: underline; }

/* узкий экран: колонки друг под другом */
@media (max-width: 520px) {
  .cb-acc.is-open { flex-direction: column; }
}

/* --- аккаунты под новый дизайн: окошко «accounts» с розовой строкой заголовка,
       плашки и клавиши как на главной --- */
.cb-acc {
  padding: 37px 14px 14px;
  background: var(--win);
  border: 1px solid var(--win-line);
  box-shadow: var(--win-shadow);
}
.cb-acc::before {
  content: "accounts";
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  height: 23px;
  padding: 0 0 0 7px;
  background: var(--win-bar);
  font: 590 12px/23px var(--font1);
  color: var(--pink-text);
}
.cb-acc::after {
  content: "";
  position: absolute;
  top: 3px;
  right: 9px;
  width: 15px;
  height: 15px;
  background: var(--xbox);
}

.cb-acc__col {
  background: var(--card);
  border: 1px solid #ededed;
  border-radius: 0;
}

/* заголовки колонок — розовые плашки с крестиком, как названия форумов */
.cb-acc__head b {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px 4px 12px;
  background: var(--blue);
  box-shadow: var(--shadow);
  font: 510 11px/13px var(--font1);
  color: var(--pink-text);
}
.cb-acc__head b::after {
  content: "";
  width: 13px;
  height: 13px;
  background: var(--xbox);
}
.cb-acc__head span {
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  background: var(--btn);
  border: 1px solid var(--btn-line);
  font: 500 10px/18px var(--font1);
  color: var(--ink);
}

/* строки аккаунтов */
.cb-acc__row {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 0;
}
.cb-acc__row:hover { border-color: var(--btn-line); }
.cb-acc__row em {
  background: var(--btn);
  border: 1px solid var(--btn-line);
  color: var(--ink);
}

/* поля — прямые углы, без голубой заливки автозаполнения */
.cb-acc input[type="text"],
.cb-acc input[type="password"] {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 0;
}
.cb-acc input[type="text"]:focus,
.cb-acc input[type="password"]:focus { border-color: var(--btn-line); }
.cb-acc input:-webkit-autofill {
  -webkit-box-shadow: inset 0 0 0 40px var(--white);
  -webkit-text-fill-color: var(--text);
}
.cb-acc__check input { accent-color: var(--red); }

/* кнопки — клавиши */
.cb-acc button.cb-acc__btn {
  background: var(--btn);
  border: 1px solid var(--btn-line);
  border-radius: 0;
  box-shadow: none;
  font: 500 10.5px/1 var(--font1);
  color: var(--ink);
  transition: transform .15s, box-shadow .15s, background .2s;
}
.cb-acc button.cb-acc__btn:hover {
  background: var(--active);
  box-shadow: 2px 2px 0 rgba(0, 0, 0, .2);
  transform: translate(-1px, -1px);
}
.cb-acc button.cb-acc__btn.is-main {
  background: var(--blue);
  border-color: var(--btn-line);
  color: var(--ink);
  box-shadow: var(--shadow-btn);
}
.cb-acc button.cb-acc__btn.is-main:hover {
  background: var(--blue-dark);
  border-color: var(--btn-line);
  box-shadow: 4px 4px 0 rgba(0, 0, 0, .25);
}
.cb-acc button.cb-acc__btn:disabled { transform: none; box-shadow: none; }
.cb-acc.is-walking .cb-acc__walk { background: var(--blue); border-color: var(--btn-line); color: var(--ink); }


/* =========================================================
   УВЕДОМЛЕНИЯ — всплывашки внизу справа (скрипт Alex_63)
   всё через #jGrowl, чтобы перебить стандартный notifications.css
   ========================================================= */

#jGrowl.jGrowl { z-index: 100001; }

/* пустая служебная карточка jGrowl — не показываем */
#jGrowl .jGrowl-notification:empty { display: none; }

/* --- карточка --- */
#jGrowl .jGrowl-notification.notification {
  --type: var(--blue);          /* цвет типа: метка в шапке и значок на аватаре */
  --type-icon: "\f0f3";
  position: relative;
  width: 290px;
  min-height: 0;
  margin: 10px;
  padding: 0;
  overflow: hidden;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 0;
  box-shadow: var(--shadow), 0 6px 18px rgba(30, 15, 17, .14);
  opacity: 1;
  font: 400 11px/1.4 var(--font1);
  color: var(--text);
  text-align: left;
  cursor: pointer;
  animation: cb-notify-in .35s cubic-bezier(.2, .8, .3, 1.2);
  transition: transform .15s, box-shadow .15s;
}
#jGrowl .jGrowl-notification.notification:hover {
  transform: translateX(-3px);
  box-shadow: 3px 3px 0 var(--type), 0 8px 22px rgba(30, 15, 17, .18);
}
@keyframes cb-notify-in {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: none; }
}

/* типы уведомлений */
#jGrowl .notification.mention         { --type: var(--red);       --type-icon: "\40"; }
#jGrowl .notification.vote            { --type: var(--red);       --type-icon: ""; }
#jGrowl .notification.message         { --type: var(--blue);      --type-icon: "\f0e0"; }
#jGrowl .notification.reply           { --type: var(--blue);      --type-icon: "\f3e5"; }
#jGrowl .notification.topic_subscribed,
#jGrowl .notification.forum_subscribed{ --type: var(--blue-dark); --type-icon: "\f0f3"; }
#jGrowl .notification.important_post  { --type: var(--yellow);    --type-icon: "\f005"; }
#jGrowl .notification.poll_answer     { --type: var(--blue);      --type-icon: "\f681"; }

/* --- шапка: полоска как у постов, метка-клетка цвета типа --- */
#jGrowl .notification .jGrowl-header {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 7px 30px 6px 10px;
  background: var(--bar);
  border-bottom: 1px dashed var(--line);
  font: 400 9px/1.2 var(--font1);
  letter-spacing: .03em;
  text-transform: lowercase;
  color: var(--muted);
}
#jGrowl .notification .jGrowl-header::before {
  content: "";
  flex: none;
  width: 7px;
  height: 7px;
  background: var(--type);
}
/* значок «браузер не дал проиграть звук» прячем — вместо него своя кнопка звука */
#jGrowl .notification .jGrowl-header .font-icon.no-sound { display: none; }

/* кнопка звука: вкл / выкл */
#jGrowl .notification .jGrowl-header .cb-sound {
  flex: none;
  width: 18px;
  height: 18px;
  margin: -3px 0 -3px auto;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 50%;
  color: var(--muted);
  cursor: pointer;
}
#jGrowl .notification .jGrowl-header .cb-sound::before { content: "\f028"; font: 400 9px/18px var(--fa); }
#jGrowl .notification .jGrowl-header .cb-sound.is-off::before { content: "\f6a9"; }
#jGrowl .notification .jGrowl-header .cb-sound.is-off { color: var(--red); }
#jGrowl .notification .jGrowl-header .cb-sound:hover { background: var(--beige); color: var(--text); }

/* крестик */
#jGrowl .notification .jGrowl-close {
  position: absolute;
  z-index: 2;
  top: 4px;
  right: 5px;
  float: none;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 50%;
  font-size: 0;
  line-height: 20px;
  color: var(--muted);
  text-align: center;
  cursor: pointer;
}
#jGrowl .notification .jGrowl-close::before { content: "\f00d"; font: 400 10px/20px var(--fa); }
#jGrowl .notification .jGrowl-close:hover { background: var(--beige); color: var(--red); }

/* --- тело: аватар + текст --- */
#jGrowl .notification .jGrowl-message {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px 11px;
}

#jGrowl .notification .notification-left {
  position: relative;
  flex: none;
  float: none;
  width: 40px;
  height: 40px;
}
#jGrowl .notification .notification-image {
  display: block;
  width: 40px;
  height: 40px;
  border: 1px solid var(--border);
  border-radius: 0;
  background-color: var(--beige);
  background-size: cover;
  background-position: center;
  box-sizing: border-box;
}

/* значок типа в углу аватарки */
#jGrowl .notification .notification-left::after {
  content: var(--type-icon);
  position: absolute;
  right: -5px;
  bottom: -5px;
  width: 17px;
  height: 17px;
  background: var(--type);
  border: 1.5px solid var(--card);
  color: #fff;
  font: 400 8px/14px var(--fa);
  text-align: center;
  box-sizing: border-box;
}
#jGrowl .notification.mention .notification-left::after { font: 700 10px/13px var(--font1); }
#jGrowl .notification.important_post .notification-left::after { color: var(--ink); }
/* лайк — пиксельное сердечко, как на кнопках форума */
#jGrowl .notification.vote .notification-left::before {
  content: "";
  position: absolute;
  z-index: 1;
  right: -1px;
  bottom: -1px;
  width: 9px;
  height: 8px;
  background: var(--cream);
  -webkit-mask: var(--heart) center / contain no-repeat;
          mask: var(--heart) center / contain no-repeat;
}

#jGrowl .notification .notification-right,
#jGrowl .notification .notification-left + .notification-right {
  flex: 1;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow-wrap: anywhere;
}

/* ссылки: ник красный, тема синяя */
#jGrowl .notification a,
#jGrowl .notification em.guest-link {
  font: 600 11px/1.4 var(--font1);
  font-style: normal;
  color: var(--blue);
  text-decoration: none;
}
#jGrowl .notification .notification-right a[href*="profile.php"],
#jGrowl .notification em.guest-link { color: var(--link); }
#jGrowl .notification a:hover { text-decoration: underline; }

/* цитата из поста — светлая плашка, максимум 2 строки */
#jGrowl .notification .msg-preview {
  display: -webkit-box;
  margin-top: 6px;
  padding: 5px 8px;
  overflow: hidden;
  background: var(--chip);
  border-left: 2px solid var(--type);
  font-size: 10px;
  line-height: 1.4;
  color: var(--label);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
#jGrowl .notification .msg-preview:empty { display: none; }
#jGrowl .notification .notification-right br { display: none; }

/* --- «+3 уведомления» и «закрыть все» --- */
#jGrowl .notification-spoiler,
#jGrowl .jGrowl-closer {
  width: auto;
  margin: 10px;
  padding: 6px 12px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 0;
  box-shadow: var(--shadow);
  font: 600 10px/1.3 var(--font1);
  color: var(--text);
  text-align: center;
  text-transform: lowercase;
  opacity: 1;
  cursor: pointer;
}
#jGrowl .notification-spoiler { background: var(--blue); border-color: var(--blue); color: var(--card); }
#jGrowl .jGrowl-closer:hover { background: var(--beige); }
#jGrowl .notification-spoiler:hover { background: var(--blue-dark); }

/* узкий экран */
@media (max-width: 540px) {
  #jGrowl .jGrowl-notification.notification { width: calc(100vw - 20px); }
}

/* =========================================================
   УВЕДОМЛЕНИЯ — окно со списком (клик по «уведомления» в шапке)
   префикс #pun #pun-main нужен, чтобы перебить notifications.css
   ========================================================= */

/* затемнение фона */
#pun #pun-main .pun-modal.unread-notifications {
  background: rgba(30, 15, 17, .35);
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
}

/* само окно */
#pun #pun-main .pun-modal.unread-notifications .modal-inner {
  position: relative;
  width: 440px;
  max-width: 94vw;
  margin-top: 12vh;
  padding: 0;
  overflow: visible;
  background: var(--card) !important;
  border: 1px solid var(--border);
  border-radius: 0;
  box-shadow: var(--shadow), 0 10px 30px rgba(30, 15, 17, .2);
  font: 400 11px/1.4 var(--font1);
  color: var(--text);
  animation: cb-notify-pop .25s cubic-bezier(.2, .8, .3, 1.2);
}
@keyframes cb-notify-pop {
  from { opacity: 0; transform: translateY(12px) scale(.98); }
  to   { opacity: 1; transform: none; }
}

/* заголовок — кремовая плашка, как «помощь с кодами» */
#pun #pun-main .pun-modal.unread-notifications .modal-inner.section h2,
#pun #pun-main .pun-modal.unread-notifications .modal-inner h2 {
  position: static;
  display: inline-block;
  margin: -14px 0 0 14px;
  padding: 6px 14px;
  background: var(--chip) !important;
  border: 0;
  box-shadow: var(--shadow);
  font: 600 11px/1.2 var(--font1);
  letter-spacing: 0;
  text-align: left !important;
  text-transform: lowercase;
  color: var(--text);
}
#pun #pun-main .pun-modal.unread-notifications .modal-inner h2 span { font: inherit; color: inherit; }

/* крестик закрытия */
#pun #pun-main .pun-modal.unread-notifications .modal-inner .closer {
  position: absolute !important;
  z-index: 3;
  top: 8px;
  right: 8px;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 50%;
  font-size: 0 !important;
  line-height: 22px;
  color: var(--muted);
  text-align: center;
  text-indent: 0;
  cursor: pointer;
}
#pun #pun-main .pun-modal.unread-notifications .modal-inner .closer > * { display: none !important; }
#pun #pun-main .pun-modal.unread-notifications .modal-inner .closer::before {
  content: "\f00d";
  font: 400 11px/22px var(--fa);
}
#pun #pun-main .pun-modal.unread-notifications .modal-inner .closer:hover { background: var(--beige); color: var(--red); }

#pun #pun-main .pun-modal.unread-notifications .container {
  padding: 12px 0 0;
  overflow: hidden;
  background: none;
  border: 0;
}

/* --- верхняя строка: звук слева, настройки / назад справа --- */
#pun #pun-main .unread-notifications #notifications-settings {
  display: flex;
  align-items: center;
  gap: 6px;
  height: auto;
  margin: 0 14px 10px;
  padding: 0;
  font-size: 10px;
  line-height: 1;
  color: var(--label);
}
#pun #pun-main .unread-notifications #notifications-settings > span { float: none; margin: 0; }
#pun #pun-main .unread-notifications #notifications-settings #settings-sound {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-right: auto;
}
#pun #pun-main .unread-notifications #notifications-settings #settings-sound a,
#pun #pun-main .unread-notifications #notifications-settings #settings-advanced a,
#pun #pun-main .unread-notifications #notifications-settings #settings-back a {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: var(--chip);
  border: 1px solid var(--line);
  border-radius: 50%;
  font-size: 0;
  line-height: 22px;
  color: var(--label);
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
}
#pun #pun-main .unread-notifications #notifications-settings span a:hover { border-color: var(--blue); color: var(--blue); }
#pun #pun-main .unread-notifications #notifications-settings #settings-sound a::before { content: "\f028"; font: 400 10px/22px var(--fa); }
#pun #pun-main .unread-notifications #notifications-settings #settings-sound.disabled a::before { content: "\f6a9"; }
#pun #pun-main .unread-notifications #notifications-settings #settings-sound.disabled a { color: var(--red); }
#pun #pun-main .unread-notifications #notifications-settings #settings-advanced a::before { content: "\f013"; font: 400 10px/22px var(--fa); }
#pun #pun-main .unread-notifications #notifications-settings #settings-back a::before { content: "\f060"; font: 400 10px/22px var(--fa); }

/* --- подзаголовки «новые / просмотренные / настройки» --- */
#pun #pun-main .unread-notifications .notifications-block-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: auto;
  margin: 0;
  padding: 6px 14px;
  background: var(--bar);
  border: 1px dashed var(--line);
  border-width: 1px 0;
  line-height: 1.2;
}
#pun #pun-main .unread-notifications .notifications-block-title span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 400 9px/1.2 var(--font1);
  letter-spacing: .03em;
  text-transform: lowercase;
  color: var(--muted);
}
#pun #pun-main .unread-notifications .notifications-block-title span::before {
  content: "";
  width: 7px;
  height: 7px;
  background: var(--red);
}
#pun #pun-main .unread-notifications #stored-title span::before { background: var(--gray); }
#pun #pun-main .unread-notifications #advanced-title span::before,
#pun #pun-main .unread-notifications #common-title span::before { background: var(--blue); }

#pun #pun-main .unread-notifications #notifications-wrap #clear-stored {
  float: none;
  font-size: 9.5px;
  color: var(--muted);
  text-decoration: none;
}
#pun #pun-main .unread-notifications #notifications-wrap #clear-stored:hover { color: var(--red); }

/* --- список --- */
#pun #pun-main .unread-notifications #notifications-wrap,
#pun #pun-main .unread-notifications #notifications-advanced {
  max-height: 52vh;
  overflow-y: auto;
  scrollbar-width: thin;
}
#pun #pun-main .unread-notifications #notifications-wrap > p {
  margin: 0;
  padding: 26px 14px 30px !important;
  color: var(--muted);
  text-align: center;
}
#pun #pun-main .unread-notifications #notifications-wrap table {
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  background: none;
}

/* строка уведомления */
#pun #pun-main .unread-notifications #notifications-wrap tr {
  --type: var(--blue);
  --type-icon: "\f0f3";
}
#pun #pun-main .unread-notifications #notifications-wrap td {
  position: relative;
  padding: 10px 14px 10px 14px;
  background: var(--card);
  border: 0;
  border-bottom: 1px solid var(--line);
  font: 400 11px/1.4 var(--font1);
  color: var(--text);
  cursor: pointer;
  transition: background .15s;
}
#pun #pun-main .unread-notifications #notifications-wrap tr:last-child td { border-bottom: 0; }
#pun #pun-main .unread-notifications #notifications-wrap tr:hover td { background: var(--chip); }

/* новые — с цветной полоской слева */
#pun #pun-main .unread-notifications #notifications td { box-shadow: inset 3px 0 0 var(--type); }
/* просмотренные — тише */
#pun #pun-main .unread-notifications #notifications-stored td .notification-right,
#pun #pun-main .unread-notifications #notifications-stored td .notification-left { opacity: .65; }
#pun #pun-main .unread-notifications #notifications-stored tr:hover td .notification-right,
#pun #pun-main .unread-notifications #notifications-stored tr:hover td .notification-left { opacity: 1; }

/* типы — те же цвета и значки, что во всплывашках */
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="mention"]          { --type: var(--red);       --type-icon: "\40"; }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="vote"]             { --type: var(--red);       --type-icon: ""; }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="message"]          { --type: var(--blue);      --type-icon: "\f0e0"; }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="reply"]            { --type: var(--blue);      --type-icon: "\f3e5"; }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="important_post"]   { --type: var(--yellow);    --type-icon: "\f005"; }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="poll_answer"]      { --type: var(--blue);      --type-icon: "\f681"; }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="topic_subscribed"],
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="forum_subscribed"] { --type: var(--blue-dark); --type-icon: "\f0f3"; }

/* аватар + значок типа */
#pun #pun-main .unread-notifications #notifications-wrap .notification-left {
  position: relative;
  float: left;
  width: 38px;
  height: 38px;
}
#pun #pun-main .unread-notifications #notifications-wrap .notification-image {
  display: block;
  width: 38px;
  height: 38px;
  border: 1px solid var(--border);
  border-radius: 0;
  background-color: var(--beige);
  background-size: cover;
  background-position: center;
  box-sizing: border-box;
}
#pun #pun-main .unread-notifications #notifications-wrap .notification-left::after {
  content: var(--type-icon);
  position: absolute;
  right: -5px;
  bottom: -5px;
  width: 16px;
  height: 16px;
  background: var(--type);
  border: 1.5px solid var(--card);
  box-sizing: border-box;
  color: #fff;
  font: 400 7.5px/13px var(--fa);
  text-align: center;
}
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="mention"] .notification-left::after { font: 700 9px/12px var(--font1); }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="important_post"] .notification-left::after { color: var(--ink); }
#pun #pun-main .unread-notifications #notifications-wrap tr[data-type="vote"] .notification-left::before {
  content: "";
  position: absolute;
  z-index: 1;
  right: -1px;
  bottom: -1px;
  width: 8px;
  height: 7px;
  background: var(--cream);
  -webkit-mask: var(--heart) center / contain no-repeat;
          mask: var(--heart) center / contain no-repeat;
}

#pun #pun-main .unread-notifications #notifications-wrap .notification-left + .notification-right,
#pun #pun-main .unread-notifications #notifications-wrap .notification-left ~ .time-ago {
  margin-left: 50px;
  min-height: 0;
}
#pun #pun-main .unread-notifications #notifications-wrap .notification-right { padding-right: 14px; overflow-wrap: anywhere; }

/* ссылки: ник красный, тема синяя */
#pun #pun-main .unread-notifications #notifications-wrap a {
  font-weight: 600;
  color: var(--blue);
  text-decoration: none;
}
#pun #pun-main .unread-notifications #notifications-wrap .notification-right a[href*="profile.php"] { color: var(--link); }
#pun #pun-main .unread-notifications #notifications-wrap .notification-right a:hover { text-decoration: underline; }

/* кусок поста */
#pun #pun-main .unread-notifications #notifications-wrap .msg-preview {
  display: -webkit-box;
  margin-top: 5px;
  padding: 4px 8px;
  overflow: hidden;
  background: var(--chip);
  border-left: 2px solid var(--type);
  font-size: 10px;
  color: var(--label);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
#pun #pun-main .unread-notifications #notifications-wrap tr:hover .msg-preview { background: var(--card); }
#pun #pun-main .unread-notifications #notifications-wrap .msg-preview:empty { display: none; }
#pun #pun-main .unread-notifications #notifications-wrap .notification-right br { display: none; }

/* время */
#pun #pun-main .unread-notifications #notifications-wrap .time-ago {
  margin-top: 5px;
  opacity: 1;
  font-size: 9px;
  color: var(--muted);
}

/* «показать подобные / все» — появляется при наведении */
#pun #pun-main .unread-notifications #notifications-wrap .notification-type-toggle {
  float: right;
  margin-top: -1.15em;
  font-size: 9px;
  font-weight: 400;
  color: var(--muted);
}
#pun #pun-main .unread-notifications #notifications-wrap .notification-type-toggle:hover { color: var(--blue); }

/* удалить — крестик в углу строки при наведении */
#pun #pun-main .unread-notifications #notifications-wrap .delete-notification {
  position: absolute;
  z-index: 1;
  top: 8px;
  right: 8px;
  float: none;
  margin: 0;
  padding: 0;
}
#pun #pun-main .unread-notifications #notifications-wrap .delete-notification a {
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  font-size: 0;
  color: var(--muted);
  text-align: center;
}
#pun #pun-main .unread-notifications #notifications-wrap .delete-notification a::before { content: "\f00d"; font: 400 9px/20px var(--fa); }
#pun #pun-main .unread-notifications #notifications-wrap .delete-notification a:hover { background: var(--beige); color: var(--red); }

/* --- настройки (шестерёнка) --- */
#pun #pun-main .unread-notifications #notifications-advanced #settings-enabled { float: none; }
#pun #pun-main .unread-notifications #notifications-advanced #settings-enabled a {
  font-size: 9.5px;
  font-style: normal;
  color: var(--blue);
  text-decoration: none;
}
#pun #pun-main .unread-notifications .notifications-advanced-settings {
  margin: 0;
  padding: 8px 14px 10px !important;
  list-style: none;
}
#pun #pun-main .unread-notifications .notifications-advanced-settings li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 5px 0;
  border-bottom: 1px dashed var(--line);
}
#pun #pun-main .unread-notifications .notifications-advanced-settings li:last-child { border-bottom: 0; }
#pun #pun-main .unread-notifications .setting-input input {
  float: none;
  margin: 1px 0 0;
  accent-color: var(--blue);
  cursor: pointer;
}
#pun #pun-main .unread-notifications .setting-title {
  display: block;
  margin: 0;
  font-size: 10.5px;
  color: var(--text);
  cursor: pointer;
}
#pun #pun-main .unread-notifications .setting-title .setting-description {
  margin-top: 2px;
  font-size: 9.5px;
  color: var(--muted);
  opacity: 1;
}
#pun #pun-main .unread-notifications .setting-title .marker-new {
  position: static;
  margin-left: 4px;
  padding: 1px 4px;
  background: var(--red);
  color: #fff;
  font: 400 8px/1 var(--font2);
  vertical-align: middle;
}

/* копирайт автора скрипта — оставляем, но тихо */
#pun #pun-main .unread-notifications .notifications-promo {
  padding: 6px 0 8px;
  border-top: 1px solid var(--line);
  font-size: 8.5px;
}
#pun #pun-main .unread-notifications .notifications-promo a,
#pun #pun-main .unread-notifications .notifications-promo b { font-weight: 400; color: var(--hint-light); text-decoration: none; }

/* узкий экран */
@media (max-width: 540px) {
  #pun #pun-main .pun-modal.unread-notifications .modal-inner { margin-top: 10vh; }
  #pun #pun-main .unread-notifications #notifications-wrap .delete-notification a,
  #pun #pun-main .unread-notifications #notifications-wrap .notification-type-toggle { visibility: visible; opacity: 1; }
}

/* =========================================================
   ЛИЧНЫЕ СТРАНИЦЫ (.cb-lp) — коллекция персонажа: значки, плашки, иконки, фоны
   открываются окном поверх форума по клику на плашку (скрипт в HTML-низе);
   если открыть /pages/… напрямую — та же вёрстка, просто на странице
   ========================================================= */

/* --- плашка в минипрофиле со ссылкой на личную страницу --- */
.punbb .post .post-author .pa-fld5 a:has(img),
#viewprofile #profile-left #pa-fld5 a:has(img) {
  position: absolute;
  inset: 0;
  z-index: 0;
  cursor: pointer;
}
.punbb .post .post-author .pa-fld5 a:has(img)::after,
#viewprofile #profile-left #pa-fld5 a:has(img)::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0);
  transition: background .2s;
}
.punbb .post .post-author .pa-fld5 a:has(img):hover::after,
#viewprofile #profile-left #pa-fld5 a:has(img):hover::after { background: rgba(255, 255, 255, .18); }


/* =========================================================
   ОКНО ПОВЕРХ ФОРУМА
   ========================================================= */

.cb-lpm {
  position: fixed;
  inset: 0;
  z-index: 100003;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 6vh 16px 4vh;
  box-sizing: border-box;
  overflow-y: auto;
  background: rgba(30, 15, 17, .45);
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
  opacity: 0;
  transition: opacity .2s;
}
.cb-lpm.is-open { opacity: 1; }
html.cb-lpm-lock { overflow: hidden; }

.cb-lpm__win {
  position: relative;
  width: 800px;
  max-width: 100%;
  background: var(--white);
  border: 1px solid var(--win-line);
  box-shadow: var(--win-shadow), 0 18px 40px rgba(30, 15, 17, .25);
  transform: translateY(10px) scale(.985);
  transition: transform .25s cubic-bezier(.2, .8, .3, 1.2);
}
.cb-lpm.is-open .cb-lpm__win { transform: none; }

/* строка заголовка: крестик слева, как у старых маков */
.cb-lpm__bar {
  display: flex;
  align-items: center;
  gap: 9px;
  height: 25px;
  padding: 0 10px 0 6px;
  background: var(--win-bar);
}
.cb-lpm__close {
  flex: none;
  width: 15px;
  height: 15px;
  margin: 0;
  padding: 0;
  background: var(--xbox);
  border: 0;
  box-shadow: none;
  cursor: pointer;
  transition: transform .15s;
}
.cb-lpm__close:hover { background: var(--xbox); transform: scale(1.12); }
.cb-lpm__title {
  overflow: hidden;
  font: 590 12px/25px var(--font1);
  white-space: nowrap;
  text-overflow: ellipsis;
  text-transform: lowercase;
  color: var(--pink-text);
}


.cb-lpm__loading,
.cb-lpm__error {
  padding: 60px 0;
  font-size: 11px;
  text-align: center;
  color: var(--muted);
}
.cb-lpm__loading::before {
  content: "";
  display: block;
  width: 42px;
  height: 45px;
  margin: 0 auto 12px;
  background: var(--dino) center bottom / contain no-repeat;
  animation: cb-jump 1s infinite;
}


/* =========================================================
   САМА ЛИЧНАЯ СТРАНИЦА — по макету (Фигма: «лс», оформление + значки)
   ========================================================= */

/* крестик — круглая кнопка снаружи слева */
.cb-lpm { padding-top: 7vh; }
.cb-lpm__bar {
  position: absolute;
  top: 0;
  left: -52px;
  z-index: 3;
  height: auto;
  padding: 0;
  background: none;
}
.cb-lpm__title { display: none; }
.cb-lpm__close,
.cb-lpm__close:hover {
  width: 38px;
  height: 38px;
  background: #f6f5f4;
  border-radius: 50%;
  box-shadow: 0 6px 16px rgba(30, 15, 17, .25);
  font-size: 0;
  transition: transform .25s ease;
}
.cb-lpm__close::before {
  content: "\f00d";
  font: 400 14px/38px var(--fa);
  color: var(--ink);
}
.cb-lpm__close:hover { transform: rotate(90deg); }

/* окно 823 &#215; 628: голубой фон, слева пупырка */
.cb-lpm__win {
  width: 823px;
  max-width: 100%;
  background: #becad4;
  border: 0;
  border-radius: 3px;
  box-shadow: 0 24px 60px rgba(30, 15, 17, .3);
}
.cb-lpm__win::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 289px;
  background: var(--lp-bubbles) -64px 0 / 353px 628px no-repeat;
  border-radius: 3px 0 0 3px;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}
.cb-lpm__body { position: relative; padding: 0; }

.cb-lp {
  display: grid;
  grid-template-columns: 289px 515px;
  align-items: start;
  min-height: 628px;
  padding: 15px 19px 21px 0;
  box-sizing: border-box;
  font: 400 11px/normal var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-lp * { box-sizing: border-box; }
.cb-lp [hidden] { display: none !important; }

/* =========================================================
   КАРТОЧКА ПЕРСОНАЖА
   ========================================================= */

.cb-lp__card {
  position: relative;
  z-index: 0;                          /* свой слой, чтобы второй лист лёг под карточку, а не под окно */
  width: 230px;
  margin: 32px 0 50px 19px;            /* фото на 47px от верха окна */
}
/* второй лист под карточкой */
.cb-lp__card::before {
  content: "";
  position: absolute;
  top: 37px;
  left: 8px;
  right: -9px;
  bottom: -9px;
  z-index: -1;
  background: #eaeae9;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}
/* наклейка-смайлик на уголке */
.cb-lp__card::after {
  content: "";
  position: absolute;
  right: -18.6px;
  bottom: -38.6px;
  z-index: 2;
  width: 62px;
  height: 55px;
  background: var(--lp-sticker) center / 100% 100% no-repeat;
  transform: rotate(-16.34deg);
  pointer-events: none;
}

/* фото 230 &#215; 80, подстраивается под любую картинку */
.cb-lp__photo {
  height: 80px;
  overflow: hidden;
  background: #e6d7da;
}
.cb-lp__photo img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.cb-lp__body {
  padding: 22px 14px 22px;
  background: #f1f1f0;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}

.cb-lp__name {
  font: 590 12px/normal var(--font1);
  text-transform: uppercase;
  color: #0e0000;
  overflow-wrap: anywhere;
}

/* возраст &#215; профессия */
.cb-lp__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 7px;
  margin-top: 8px;
  font: 300 11px/normal var(--font1);
  text-transform: lowercase;
}
.cb-lp__meta span + span::before {
  content: "";
  display: inline-block;
  width: 3.43px;
  height: 3.43px;
  margin-right: 7px;
  vertical-align: middle;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3.43 3.43'%3E%3Cpath d='M.22.22l3 3M3.22.22l-3 3' stroke='%230E0000' stroke-width='.43' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* о себе — розовая линия слева */
.cb-lp__about {
  margin-top: 28px;
  padding-left: 15px;
  border-left: 1px solid #e59eb4;
  font: 300 8px/normal var(--font1);
  text-transform: lowercase;
  color: #646464;
  overflow-wrap: anywhere;
}

/* музыка — пунктирная плашка с кнопкой &#9654; */
.cb-lp__music {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  margin-top: 28px;
  padding-left: 8px;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-right: 0;
  border-radius: 3px;
  font: 510 8px/normal var(--font1);
  text-transform: uppercase;
  color: #0e0000;
}
.cb-lp__music::after {
  content: "";
  flex: none;
  width: 19px;
  height: 19px;
  margin: -1px 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 19'%3E%3Cpath d='M0 0h16.29A2.71 2.71 0 0 1 19 2.71v13.58A2.71 2.71 0 0 1 16.29 19H0z' fill='%231C0F0F'/%3E%3Cpath d='M13.57 9.77l-6.51 3.76V6.01z' fill='%23F1F1F0'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* =========================================================
   ПРАВАЯ ПАНЕЛЬ: вкладки «оформление / значки»
   ========================================================= */

.cb-lp__panel {
  min-height: 592px;
  padding: 9px 0 32px;
  background: #f6f5f4;
}

.cb-lp__tabs-nav {
  display: flex;
  gap: 10px;
  margin: 0 0 0 27px;
}
.cb-lp__tabs-nav button {
  margin: 0;
  padding: 4px 10px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-lp__tabs-nav button:hover { background: #e9edf0; }
.cb-lp__tabs-nav button.is-on { background: #becad4; }

/* пунктир под вкладками */
.cb-lp__line {
  height: 1px;
  margin: 11px 18px 11px 30px;
  background: repeating-linear-gradient(90deg, rgba(0, 0, 0, .1) 0 2px, transparent 2px 4px);
}

/* --- блок с подписью --- */
.cb-lp__block {
  position: relative;
  width: 479px;
  margin: 0 0 15px 18px;
  padding-top: 14px;
}
.cb-lp__label {
  position: absolute;
  top: 0;
  left: 9px;
  z-index: 2;
  padding: 4px 10px;
  background: #e6d7da;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 10px/normal var(--font1);
  color: #0e0000;
}

/* прокручиваемая коробка: фон только 469px, справа через 7px — полоска скролла 3px */
.cb-lp__scroll {
  display: flex;
  flex-wrap: wrap;
  align-content: safe center;
  justify-content: center;
  width: 479px;
  padding-right: 10px;
  overflow-y: auto;
  background: linear-gradient(#f1f1f0, #f1f1f0) 0 0 / 469px 100% no-repeat;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  scrollbar-width: auto;               /* сброс, если форум где-то задал своё — иначе Chrome рисует системный */
  scrollbar-color: auto;
}
/* скролл как в макете: полоска 3px, без стрелок.
   Chrome/Edge/Safari рисуют его по правилам ниже; если задать им scrollbar-width,
   они включают свой системный скролл со стрелками — поэтому он только для Firefox */
.cb-lp__scroll::-webkit-scrollbar { width: 3px; height: 3px; }
.cb-lp__scroll::-webkit-scrollbar-track { background: #e9e9e9; }
.cb-lp__scroll::-webkit-scrollbar-thumb { background: #becad4; border-radius: 0; }
.cb-lp__scroll::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
@supports (-moz-appearance: none) {
  .cb-lp__scroll {
    scrollbar-width: thin;
    scrollbar-color: #becad4 #e9e9e9;
  }
}

/* фоны 223 &#215; 50 */
.cb-lp__bgs {
  gap: 5px;
  height: 188px;
  padding-top: 14px;
  padding-bottom: 14px;
}
.cb-lp__bgs img {
  display: block;
  width: 223px;
  height: 50px;
  max-width: none;
  object-fit: cover;
}

/* плашки 223 &#215; 42 с одной или двумя надписями */
.cb-lp__plates {
  gap: 5px;
  height: 164px;
  padding-top: 14px;
  padding-bottom: 14px;
}
.cb-lp__plates > div {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  width: 223px;
  height: 42px;
  padding-left: 28.5px;
  overflow: hidden;
  background: #e6d7da;
}
.cb-lp__plates img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
.cb-lp__plates span {
  position: relative;
  z-index: 1;
  max-width: 100%;
  padding: 2px 6px;
  overflow: hidden;
  background: #f6f5f4;
  filter: drop-shadow(1px 1px .95px rgba(0, 0, 0, .32));
  font: 300 10px/normal var(--font1);
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #000;
}
.cb-lp__plates span + span { font-size: 8px; }

/* иконки — окошки 25 &#215; 25, как у ника в минипрофиле */
.cb-lp__icons {
  gap: 5px;
  height: 83px;
  padding-top: 14px;
  padding-bottom: 14px;
}
.cb-lp__icons > * {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  background: #f1f1f0;
  border: .893px solid #ededed;
  border-radius: 3px;
  box-shadow: inset 0 1.786px 2.589px 0 rgba(0, 0, 0, .1);
  font-size: 13.4px;
  line-height: 1;
}
.cb-lp__icons img {
  display: block;
  width: 14px;
  height: 14px;
  object-fit: contain;
}

/* =========================================================
   ЗНАЧКИ: сетка 3 &#215; 3, каждый значок в ячейке, подпись сбоку вертикально
   <off><img></off> — значок ещё не получен, ч/б
   ========================================================= */

.cb-lp__badges {
  display: grid;
  grid-template-columns: repeat(3, 135px);
  grid-auto-rows: 130px;
  gap: 10px;
  align-content: start;
  justify-content: center;
  width: 479px;
  height: 476px;
  margin: 6px 0 0 23px;
  padding: 33px 32px 33px 22px;        /* 22 слева, справа ещё +10 под скролл */
}

.cb-lp__badges > div {
  position: relative;
  overflow: hidden;
  background: #f6f5f4;
  border-radius: 2.73px;
  box-shadow: inset 0 1.625px 2.356px 0 rgba(0, 0, 0, .1);
}

.cb-lp__badges img {
  position: absolute;
  left: var(--x, 5px);
  top: var(--y, 16px);
  width: 105px;
  height: var(--h, 105px);
  max-width: none;
  object-fit: contain;
  transform: rotate(-4deg);
  transition: transform .3s ease;
}
.cb-lp__badges > div:hover img { transform: rotate(0) scale(1.04); }

/* расположение каждого значка в ячейке — как в макете (повторяется каждые 9) */
.cb-lp__badges > div:nth-child(9n+1) { --x: 5px;    --y: 16px; }
.cb-lp__badges > div:nth-child(9n+2) { --x: 8px;    --y: 16px; }
.cb-lp__badges > div:nth-child(9n+3) { --x: 5.5px;  --y: 16.5px; }
.cb-lp__badges > div:nth-child(9n+4) { --x: 5px;    --y: 16px; }
.cb-lp__badges > div:nth-child(9n+5) { --x: 1.6px;  --y: 15.8px; --h: 104.7px; }
.cb-lp__badges > div:nth-child(9n+6) { --x: 5.5px;  --y: 16.5px; }
.cb-lp__badges > div:nth-child(9n+7) { --x: 7px;    --y: 13px; }
.cb-lp__badges > div:nth-child(9n+8) { --x: 5px;    --y: 13px; }
.cb-lp__badges > div:nth-child(9n)   { --x: 9.3px;  --y: 20.5px; --h: 97.6px; }

/* несколько одинаковых значков: <div title="2"> &#8594; «&#215;2» в левом верхнем углу */
.cb-lp__badges > div[data-count]::after {
  content: "\d7" attr(data-count);
  position: absolute;
  top: 7px;
  left: 7px;
  z-index: 2;
  padding: 1px 6px;
  background: #becad4;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  font: 400 8px/12px var(--font1);
  color: #0e0000;
}

/* не получен — чёрно-белый */
.cb-lp__badges off { display: contents; }
.cb-lp__badges off img { filter: grayscale(1); opacity: .6; }

/* подпись значка — вертикальная пунктирная плашка справа */
.cb-lp__badges span {
  position: absolute;
  top: -3px;
  left: 116px;
  z-index: 1;
  padding: 9.1px 3.64px;
  background: #f1f1f0;
  border: .91px dashed rgba(14, 0, 0, .22);
  border-radius: 2.73px;
  font: 400 9.1px/normal var(--font1);
  white-space: nowrap;
  color: #0e0000;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

/* --- телефон --- */
@media (max-width: 900px) {
  .cb-lpm__bar { top: 10px; left: auto; right: 10px; }
  .cb-lp { grid-template-columns: 1fr; padding: 15px; }
  .cb-lp__card { margin: 32px auto 50px; }
  .cb-lp__panel { overflow-x: auto; }
}


/* =========================================================
   ТЕЛЕФОНЫ И ПЛАНШЕТЫ — ничего не торчит за правый край форума,
   поэтому браузер вписывает форум ровно в экран, без серой полосы справа
   (срабатывает только на сенсорных экранах, на компьютере всё как было)
   ========================================================= */

@media (hover: none) and (pointer: coarse) {

  /* --- UP / DOWN — в правом нижнем углу экрана --- */
  #ToTop,
  #OnBottom {
    left: auto;
    right: 12px;
  }
  #ToTop    { top: auto; bottom: 60px; }
  #OnBottom { top: auto; bottom: 24px; }
  #ToTop:hover,
  #OnBottom:hover { transform: none; box-shadow: none; }

  /* --- плашки справа: внутрь шапки, видна только дата, по тапу раскрываются влево --- */
  .plates {
    left: auto;
    right: 0;
    z-index: 4;
    align-items: flex-end;
  }
  .plate {
    justify-content: flex-end;
    max-width: 50px;
    padding-left: 0;
    overflow: hidden;
    transform: none;
    cursor: pointer;
    transition: max-width .35s ease, padding .35s ease;
  }
  .plate > * { flex-shrink: 0; }
  .plate:hover {
    max-width: 300px;
    padding-left: 12px;
    transform: none;
  }

  /* --- брелок не уезжает за левый край экрана --- */
  .cb-head__keychain { left: -120px; }
}

/* =========================================================
   «+ ЛС» ДЛЯ АДМИНОВ — кнопка у минипрофиля и окошко добавления
   ========================================================= */

.cb-lpa-btn {
  position: absolute;
  top: -17px;
  right: 0;
  z-index: 3;
  margin: 0;
  padding: 1px 7px;
  background: #becad4;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 8px/12px var(--font1);
  color: #0e0000;
  cursor: pointer;
  opacity: .7;
  transition: opacity .2s;
}
.cb-lpa-btn:hover { background: #becad4; opacity: 1; }
#profile-left .cb-lpa-btn { top: -16px; }

.cb-lpa {
  position: fixed;
  inset: 0;
  z-index: 100004;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 8vh 16px;
  background: rgba(30, 15, 17, .4);
}
.cb-lpa.is-open { display: flex; }
.cb-lpa.is-busy .cb-lpa__win { pointer-events: none; opacity: .8; }

.cb-lpa__win {
  width: 420px;
  max-width: 100%;
  background: #f6f5f4;
  border-radius: 3px;
  box-shadow: 0 20px 50px rgba(30, 15, 17, .3);
  font: 400 11px/1.4 var(--font1);
  color: #0e0000;
}
.cb-lpa__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 30px;
  padding: 0 10px 0 14px;
  background: #becad4;
  font-size: 11px;
}
.cb-lpa__x {
  width: 15px;
  height: 15px;
  margin: 0;
  padding: 0;
  background: var(--xbox);
  border: 0;
  box-shadow: none;
  cursor: pointer;
}
.cb-lpa__body { padding: 14px 16px 16px; }

.cb-lpa__row {
  display: block;
  margin: 0 0 10px;
  font-size: 9px;
  color: #646464;
}
.cb-lpa__row input {
  display: block;
  width: 100%;
  height: 26px;
  margin-top: 3px;
  padding: 0 10px;
  box-sizing: border-box;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  font: 400 11px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-lpa__row input:focus { border-style: solid; border-color: #becad4; }

.cb-lpa__types { display: flex; gap: 8px; margin: 4px 0 14px; }
.cb-lpa__types button,
.cb-lpa__actions button {
  margin: 0;
  padding: 4px 10px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-lpa__types button.is-on { background: #becad4; }
.cb-lpa__types button:hover,
.cb-lpa__actions button:hover { background: #e9edf0; }
.cb-lpa__actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.cb-lpa__actions .is-main { background: #e6d7da; }
.cb-lpa__actions .is-main:hover { background: #e59eb4; }

/* превью того, что добавится */
.cb-lpa__preview:empty { display: none; }
.cb-lpa__preview {
  display: block;
  min-height: 0;
  padding: 0;
}
.cb-lpa__preview .cb-lp__scroll {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 12px;
  background: #f1f1f0;
}
.cb-lpa__preview .cb-lp__badges { display: flex; height: auto; }
.cb-lpa__preview .cb-lp__badges > div { width: 135px; height: 130px; }

.cb-lpa__status { min-height: 14px; margin-top: 8px; font-size: 10px; color: #646464; }
.cb-lpa__status.is-ok { color: #3f7d4f; }
.cb-lpa__status.is-err { color: var(--link); }

/* значки страницы: клик — выдать / забрать */
.cb-lpa__badges { margin-bottom: 12px; font-size: 9px; color: #646464; }
.cb-lpa__badges p { margin: 0 0 6px; }
.cb-lpa__badge {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  width: 70px;
  margin: 0 4px 6px 0;
  padding: 4px 4px 5px;
  background: #f1f1f0;
  border: 1px solid transparent;
  border-radius: 3px;
  vertical-align: top;
  font: 400 7.5px/1.2 var(--font1);
  color: #0e0000;
}
.cb-lpa__badge:hover { border-color: #becad4; }
.cb-lpa__give {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}
.cb-lpa__give:hover { background: none; }
.cb-lpa__give img { display: block; width: 44px; height: 44px; object-fit: contain; transition: transform .2s; }
.cb-lpa__give:hover img { transform: scale(1.08); }
.cb-lpa__badge.is-off .cb-lpa__give img { filter: grayscale(1); opacity: .5; }
.cb-lpa__name { margin-top: 3px; text-align: center; }
.cb-lpa__count {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
}
.cb-lpa__count b { font-weight: 500; font-size: 8px; }
.cb-lpa__minus {
  width: 14px;
  height: 14px;
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 50%;
  box-shadow: none;
  font: 400 10px/11px var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-lpa__minus:hover { background: #e6d7da; }
.cb-lpa__minus:disabled { opacity: .3; cursor: default; }

/* =========================================================
   ПРОФИЛЬ &#8594; «ДОПОЛНИТЕЛЬНО»: окно оформления (скрипт profile_editor.js)
   хэдер, плашка, иконка с личной страницы + лз с проверкой, справа живое превью карточки
   ========================================================= */

.cb-ed {
  margin: 6px 0 26px;
  background: #f6f5f4;
  border-radius: 3px;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
  font: 400 11px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-ed * { box-sizing: border-box; }
.cb-ed.is-busy { pointer-events: none; opacity: .75; }

/* полоска окна */
.cb-ed__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 14px;
  min-height: 30px;
  padding: 4px 14px;
  background: #becad4;
  border-radius: 3px 3px 0 0;
}
.cb-ed__lp { display: flex; align-items: center; gap: 6px; font-size: 10px; color: #3d3d3d; }
.cb-ed__lp a { color: #0e0000; text-decoration: underline; text-underline-offset: 2px; }
.cb-ed__lp a:hover { color: var(--link); }
.cb-ed__lp input {
  width: 160px;
  height: 22px;
  margin: 0;
  padding: 0 8px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .3);
  border-radius: 3px;
  box-shadow: none;
  font: 400 10px/1 var(--font1);
  color: #0e0000;
  outline: none;
}

.cb-ed__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 258px;
  gap: 22px;
  align-items: start;
  padding: 18px 18px 20px;
}

/* ---------- блоки с подписью, как на личной странице ---------- */
.cb-ed__block {
  position: relative;
  margin: 0 0 18px;
  padding-top: 14px;
}
.cb-ed__label {
  position: absolute;
  top: 0;
  left: 9px;
  z-index: 2;
  padding: 4px 10px;
  background: #e6d7da;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 10px/normal var(--font1);
  color: #0e0000;
}
/* точка у подписи — в блоке есть несохранённые правки */
.cb-ed__block.is-changed .cb-ed__label::after {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 0 1px 6px;
  vertical-align: middle;
  background: var(--link);
  border-radius: 50%;
}

.cb-ed__box {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 6px;
  padding: 22px 12px 12px;
  overflow-y: auto;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
/* видно два ряда с хвостиком третьего — остальное скроллом */
.cb-ed__box--header { max-height: 168px; }
.cb-ed__box--plate  { max-height: 152px; }
.cb-ed__box--icon   { max-height: 96px; }
.cb-ed__box::-webkit-scrollbar { width: 3px; }
.cb-ed__box::-webkit-scrollbar-track { background: #e9e9e9; }
.cb-ed__box::-webkit-scrollbar-thumb { background: #becad4; }
.cb-ed__box::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
@supports (-moz-appearance: none) {
  .cb-ed__box { scrollbar-width: thin; scrollbar-color: #becad4 #e9e9e9; }
}
.cb-ed__note { flex-basis: 100%; margin: 4px 0 0; font-size: 9px; color: #767676; }

/* ---------- плитки ---------- */
.cb-ed .cb-ed__tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  flex: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #e6d7da;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font: inherit;
  color: #0e0000;
  cursor: pointer;
  outline: 1px solid transparent;
  outline-offset: 2px;
  transition: outline-color .15s;
}
.cb-ed .cb-ed__tile:hover { outline-color: rgba(36, 25, 21, .3); }
.cb-ed .cb-ed__tile.is-on { outline: 2px solid #8fa3b4; }
.cb-ed .cb-ed__tile:focus-visible { outline: 2px solid #8fa3b4; }
.cb-ed .cb-ed__tile img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  object-fit: cover;
}
/* «сейчас в профиле, на лс такого нет» — уголок */
.cb-ed .cb-ed__tile.is-cur::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border: 7px solid transparent;
  border-top-color: var(--link);
  border-right-color: var(--link);
}

.cb-ed .cb-ed__tile--header,
.cb-ed .cb-ed__none--header { width: 223px; height: 50px; }

.cb-ed .cb-ed__tile--plate,
.cb-ed .cb-ed__none--plate { width: 223px; height: 42px; gap: 3px; padding-left: 28.5px; }
.cb-ed .cb-ed__tile--plate span {
  position: relative;
  z-index: 1;
  max-width: 100%;
  padding: 2px 6px;
  overflow: hidden;
  background: #f6f5f4;
  filter: drop-shadow(1px 1px .95px rgba(0, 0, 0, .32));
  font: 300 10px/normal var(--font1);
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cb-ed .cb-ed__tile--plate span + span { font-size: 8px; }

/* иконки — окошки 25 &#215; 25, как у ника */
.cb-ed .cb-ed__tile--icon,
.cb-ed .cb-ed__none--icon {
  align-items: center;
  width: 25px;
  height: 25px;
  background: #f6f5f4;
  border: .9px solid #e4e4e4;
  border-radius: 3px;
  box-shadow: inset 0 1.8px 2.6px rgba(0, 0, 0, .1);
  font-size: 13px;
  line-height: 1;
}
.cb-ed .cb-ed__tile--icon img { position: static; width: 14px; height: 14px; object-fit: contain; }
.cb-ed .cb-ed__tile--icon i { font-style: normal; }

/* «без хэдера / без плашки / нет» */
.cb-ed .cb-ed__none {
  align-items: center;
  padding: 0;
  background: transparent;
  border: 1px dashed rgba(14, 0, 0, .25);
  font-size: 9px;
  color: #767676;
}
.cb-ed .cb-ed__none--icon { font-size: 8px; box-shadow: none; }

/* ---------- окошко текста под рядом с плашкой ---------- */
.cb-ed__drawer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 10px;
  flex-basis: 100%;
  margin: 4px 0 6px;
  padding: 10px 12px 12px;
  background: #f6f5f4;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
}
.cb-ed__drawer label { display: block; font-size: 9px; color: #646464; }
.cb-ed__drawer input {
  display: block;
  width: 100%;
  height: 26px;
  margin: 3px 0 0;
  padding: 0 10px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 11px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-ed__drawer input:focus { border-style: solid; border-color: #becad4; }
.cb-ed__drawer-btns { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; }

/* ---------- кнопки-пилюли ---------- */
.cb-ed__drawer-btns button,
.cb-ed__tools button,
.cb-ed__actions button,
.cb-ed__lp button,
.cb-ed .cb-ed__native {
  margin: 0;
  padding: 4px 10px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s;
}
.cb-ed__drawer-btns button:hover,
.cb-ed__tools button:hover,
.cb-ed__actions button:hover,
.cb-ed__lp button:hover { background: #e9edf0; }
.cb-ed__actions .is-main { background: #e6d7da; }
.cb-ed__actions .is-main:hover { background: #e59eb4; }
.cb-ed__actions button:disabled,
.cb-ed__actions button:disabled:hover { background: transparent; opacity: .4; cursor: not-allowed; }

/* ---------- лз ---------- */
.cb-ed__lz {
  padding: 22px 12px 12px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
.cb-ed__tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.cb-ed__count { margin-left: auto; font-size: 9px; color: #767676; }
.cb-ed__count.is-over { color: var(--link); }

.cb-ed__editor {
  position: relative;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
}
.cb-ed__editor:focus-within { border-style: solid; border-color: #becad4; }

/* поле и подсветка под ним — один и тот же шрифт и отступы, иначе подчёркивание съедет */
.cb-ed textarea.cb-ed__code,
.cb-ed pre.cb-ed__hl {
  display: block;
  width: 100%;
  margin: 0;
  padding: 9px 11px;
  border: 0;
  border-radius: 3px;
  box-shadow: none;
  font: 400 11px/1.55 ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  letter-spacing: 0;
  text-transform: none;
  white-space: pre-wrap;
  word-break: normal;
  overflow-wrap: anywhere;
  tab-size: 4;
}
.cb-ed pre.cb-ed__hl {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: none;
  color: transparent;
  pointer-events: none;
}
.cb-ed__hl mark {
  padding: 0;
  background: rgba(164, 14, 65, .07);
  color: transparent;
  text-decoration: underline wavy var(--link);
  text-decoration-thickness: 1px;
  text-decoration-skip-ink: none;
  text-underline-offset: 3px;
}
.cb-ed__hl mark.is-warn { background: none; text-decoration-color: #d6ad3a; }
.cb-ed textarea.cb-ed__code {
  position: relative;
  min-height: 84px;
  overflow: hidden;
  resize: none;
  background: transparent;
  color: #0e0000;
  caret-color: #0e0000;
  outline: none;
}
.cb-ed textarea.cb-ed__code::selection { background: #ecc4c9; }

/* ---------- кнопки форматирования — пилюли, как вкладки на лс ---------- */
.cb-ed__keys {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin: 0 0 10px;
}
.cb-ed__sep { width: 6px; }
.cb-ed .cb-ed__key {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 22px;
  margin: 0;
  padding: 0 8px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/1 var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-ed .cb-ed__key:hover { background: #e9edf0; }
.cb-ed .cb-ed__key:active { background: #becad4; }
.cb-ed .cb-ed__key.is-b { font-weight: 700; }
.cb-ed .cb-ed__key.is-i { font-style: italic; }
.cb-ed .cb-ed__key.is-u { text-decoration: underline; }
.cb-ed .cb-ed__key.is-s { text-decoration: line-through; }
.cb-ed .cb-ed__key.is-small { font-size: 7px; }
.cb-ed .cb-ed__key.is-big { font-size: 11px; }
.cb-ed .cb-ed__key[data-ic]::before { font: 400 8px/1 var(--fa); }
.cb-ed .cb-ed__key[data-ic="link"]::before    { content: "\f0c1"; }
.cb-ed .cb-ed__key[data-ic="sub"]::before     { content: "\f12c"; }
.cb-ed .cb-ed__key[data-ic="sup"]::before     { content: "\f12b"; }
.cb-ed .cb-ed__key[data-ic="left"]::before    { content: "\f036"; }
.cb-ed .cb-ed__key[data-ic="center"]::before  { content: "\f037"; }
.cb-ed .cb-ed__key[data-ic="right"]::before   { content: "\f038"; }
.cb-ed .cb-ed__key[data-ic="justify"]::before { content: "\f039"; }
.cb-ed .cb-ed__key[data-ic="br"]::before      { content: "\f1dd"; }
.cb-ed .cb-ed__key[data-ic="hr"]::before      { content: "\f068"; }
.cb-ed .cb-ed__key[data-ic="clear"]::before   { content: "\f12d"; }
/* цвет: кружок текущего цвета, палитра спрятана внутри */
.cb-ed .cb-ed__key.is-color b { width: 9px; height: 9px; background: #a40e41; border-radius: 50%; }
.cb-ed .cb-ed__key.is-color input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; }
.cb-ed select.cb-ed__key {
  width: auto;
  padding: 0 20px 0 10px;
  -webkit-appearance: none;
  appearance: none;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 5'%3E%3Cpath d='M.5.5l3.5 3.5 3.5-3.5' fill='none' stroke='%230E0000' stroke-width='.8'/%3E%3C/svg%3E") right 8px center / 7px 5px no-repeat;
}
.cb-ed select.cb-ed__key:hover { background-color: #e9edf0; }

/* ---------- проверка лз: белый листок с рваным краем, внутри просто текст ---------- */
.cb-ed__check {
  margin-top: 12px;
  padding: 13px 16px 22px;
  background: #fff;
  -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x;
  mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x;
}
.cb-ed__verdict { margin: 0; font: 400 10.5px/1.4 var(--font1); color: #646464; }
.cb-ed__check.is-err .cb-ed__verdict { color: var(--link); }

.cb-ed__check ol { margin: 0; padding: 0; list-style: none; }
.cb-ed__check li {
  margin: 12px 0 0;
  padding: 12px 0 0;
  border-top: 1px dashed #dcd2d4;
}
.cb-ed__row { display: flex; align-items: baseline; gap: 10px; }
.cb-ed__row p { margin: 0; font: 400 10.5px/1.45 var(--font1); color: #0e0000; }
.cb-ed__row p b { font-weight: 590; color: var(--link); }
.cb-ed__check li.is-warn .cb-ed__row p b { color: #a07a12; }
.cb-ed__snip {
  margin-top: 6px;
  font: 400 9.5px/1.5 var(--font1);
  color: #8a8a8a;
  overflow-wrap: anywhere;
}
.cb-ed__snip em { font-style: normal; color: var(--link); }
.cb-ed__check li.is-warn .cb-ed__snip em { color: #a07a12; }

.cb-ed .cb-ed__show {
  flex: none;
  margin: 0;
  padding: 3px 9px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  white-space: nowrap;
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-ed .cb-ed__show:hover { background: #e9edf0; }

@media (max-width: 600px) {
  .cb-ed__row { flex-direction: column; gap: 5px; }
}

/* ---------- правая колонка: превью ---------- */
.cb-ed__side { position: sticky; top: 16px; }

.cb-ed__prev {
  position: relative;
  display: flex;
  justify-content: center;
  padding: 10px 0 14px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
/* «+ лс» админов в превью не нужна */
.cb-ed .cb-lpa-btn { display: none !important; }
.punbb .cb-ed .cb-ed__post {
  position: relative;
  display: block;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}
.punbb .cb-ed .cb-ed__post .post-author { margin: 16px auto 0; }

.cb-ed__actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.cb-ed__status { min-height: 14px; margin-top: 8px; font-size: 10px; text-align: right; color: #646464; }
.cb-ed__status.is-ok { color: #3f7d4f; }
.cb-ed__status.is-err { color: var(--link); }
.cb-ed .cb-ed__native {
  display: block;
  margin: 10px 0 0 auto;
  padding: 0;
  border: 0;
  font-size: 9px;
  color: #767676;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
}
.cb-ed .cb-ed__native:hover { color: var(--link); background: none; }

/* обычные поля, которыми управляет окно, — спрятаны (кнопка внизу превью показывает) */
.cb-ed-hide { display: none !important; }
.cb-ed-showall .cb-ed-hide { display: revert !important; }

/* ---------- узкий экран ---------- */
@media (max-width: 900px) {
  .cb-ed__grid { grid-template-columns: 1fr; }
  .cb-ed__side { position: static; order: -1; }
  .cb-ed .cb-ed__tile--header,
  .cb-ed .cb-ed__tile--plate { max-width: 100%; }
  .cb-ed__drawer { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .cb-ed * { transition: none !important; }
}
/* =========================================================
   КОШЕЛЁК ДЛЯ АДМИНОВ (скрипт money_admin.js)
   клик по кошельку в карточке — маленькое окошко рядом: +300 / -200 / =500
   ========================================================= */

/* кошелёк кликабельный только у админов (класс на html ставит скрипт) */
.cb-money-admin .cb-money-hit { cursor: pointer; }
.cb-money-admin .punbb .post .post-author li.cb-money-hit:hover,
.cb-money-admin .punbb .post .post-author li.cb-money-hit:hover::before,
.cb-money-admin #viewprofile #profile-left .cb-money-hit:hover,
.cb-money-admin #viewprofile #profile-left .cb-money-hit:hover::before { color: var(--link); }
/* у игрока поле пустое — кошелёк с нулём видно только админам, бледным */
.cb-money-empty { opacity: .45; }

/* окошко — как окно «+ лс», только маленькое */
.cb-money {
  position: absolute;
  z-index: 100005;
  display: none;
  width: 212px;
  background: #f6f5f4;
  border-radius: 3px;
  box-shadow: 0 10px 28px rgba(30, 15, 17, .22);
  font: 400 11px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-money.is-open { display: block; }
.cb-money.is-busy .cb-money__body { pointer-events: none; opacity: .7; }

.cb-money__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 26px;
  padding: 0 8px 0 12px;
  background: #becad4;
  border-radius: 3px 3px 0 0;
  font-size: 10px;
}
.cb-money__who { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.cb-money__x {
  flex: none;
  width: 13px;
  height: 13px;
  margin: 0;
  padding: 0;
  background: var(--xbox) center / contain no-repeat;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}

.cb-money__body { padding: 11px 12px 12px; }
.cb-money__now { margin-bottom: 8px; font-size: 9px; color: #646464; }
.cb-money__now b { margin-left: 3px; font: 590 13px/1 var(--font1); color: #0e0000; }

.cb-money input.cb-money__in {
  display: block;
  width: 100%;
  height: 28px;
  margin: 0;
  padding: 0 10px;
  box-sizing: border-box;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 12px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-money input.cb-money__in:focus { border-style: solid; border-color: #becad4; }

.cb-money__chips { display: flex; gap: 4px; margin-top: 6px; }
.cb-money__chips button,
.cb-money .cb-money__go {
  margin: 0;
  padding: 3px 8px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-money__chips button:hover { background: #e9edf0; }

.cb-money__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; }
.cb-money__then { font-size: 9px; color: #646464; }
.cb-money__then b { font-weight: 590; color: #0e0000; }
.cb-money__then i { font-style: normal; color: var(--link); }
.cb-money .cb-money__go { margin-left: auto; background: #e6d7da; }
.cb-money .cb-money__go:hover { background: #e59eb4; }

.cb-money__status { min-height: 0; margin-top: 6px; font-size: 9px; color: #646464; }
.cb-money__status:empty { display: none; }
.cb-money__status.is-ok { color: #3f7d4f; }
.cb-money__status.is-err { color: var(--link); }

/* =========================================================
   ПРАВИЛА — html-блок в посте с [hideprofile]
   голубое окно с пупырками, как личная страница; внутри светлая панель,
   котики сидят на её верхнем краю, разделы — ярлык + серая карточка, как блоки на лс
   ========================================================= */

.cb-rules {
  position: relative;
  width: 813px;
  max-width: 100%;
  margin: 0 auto;
  padding: 140px 52px 48px;
  box-sizing: border-box;
  background: #becad4;
  border-radius: 3px;
  overflow: hidden;
  font: 300 11.5px/1.5 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-rules * { box-sizing: border-box; }

/* пупырка по всему окну — как слева в окне личной страницы */
.cb-rules::before {
  content: "";
  position: absolute;
  inset: 0;
  mix-blend-mode: lighten;
  opacity: .6;
  pointer-events: none;
}

/* светлая панель под текстом */
.cb-rules::after {
  content: "";
  position: absolute;
  inset: 108px 26px 26px;
  background: #f6f5f4;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
  pointer-events: none;
}

/* котики с репликами — сидят на верхнем краю панели */
.cb-rules__cats {
  position: absolute;
  z-index: 2;
  top: 4px;
  right: 70px;
  width: 312px;
  height: 115px;
  background: var(--rules-cats) center bottom / contain no-repeat;
  pointer-events: none;
}

/* раздел: ярлык + карточка, как блоки «фоны / плашки» на лс */
.cb-rules__block {
  position: relative;
  z-index: 1;
  padding-top: 14px;
}
.cb-rules__block + .cb-rules__block { margin-top: 22px; }

.cb-rules__tag {
  position: absolute;
  top: 0;
  left: 9px;
  z-index: 2;
  padding: 4px 10px;
  background: #e6d7da;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 11px/normal var(--font1);
  white-space: nowrap;
  color: #0e0000;     transform: rotate(-2deg);
}

.cb-rules__card {
  padding: 28px 26px 24px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}

.cb-rules__card p { margin: 0 !important; }          /* перебиваем общие отступы абзацев в постах */
.cb-rules__card p + p { margin-top: 8px !important; }

/* подпункты «- …» — с отступом и чуть тише */
.cb-rules__card .sub {
  display: block;
  margin-top: 3px;
  padding-left: 16px;
  color: #646464;
}

/* ссылки «в теме» — малиновые, с пунктиром */
.cb-rules__card a {
  color: var(--link);
  text-decoration: none;
  border-bottom: 1px dashed rgba(164, 14, 65, .4);
  transition: border-color .2s;
}
.cb-rules__card a:hover { border-bottom-style: solid; border-bottom-color: var(--link); }

/* узкий экран */
@media (max-width: 700px) {
  .cb-rules { padding: 132px 24px 34px; }
  .cb-rules::after { inset: 108px 10px 10px; }
  .cb-rules__cats { right: 50%; margin-right: -156px; }
  .cb-rules__card { padding: 26px 16px 20px; }
}

/* =========================================================
   СПИСОК ВНЕШНОСТЕЙ — html-блок в посте с [hideprofile] (шаблон в html_внешности.txt)
   скрипт looks.js раскладывает строки по буквам, сортирует и делает поиск
   ========================================================= */

.cb-looks {
  position: relative;
  width: 900px;
  max-width: 100%;
  margin: 0 auto;
  padding: 34px 93px 15px;
  box-sizing: border-box;
  background: #f6f5f4;
  border: 1px dashed rgba(0, 0, 0, .1);
  font: 400 12px/normal var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-looks * { box-sizing: border-box; }

/* заголовок-окошко с крестиком */
.cb-looks__title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 4px 10px;
  background: #e59eb4;
  border: 1px solid #241915;
  font: 400 12px/normal var(--font1);
  color: #0e0000;
}
.cb-looks__title i { width: 15px; height: 15px; background: var(--xbox) center / contain no-repeat; }

.cb-looks__intro { margin-top: 24px; font: 300 11px/normal var(--font1); color: #0e0000; }
.cb-looks__intro p { margin: 0 !important; }

/* ---------- поиск ---------- */
.cb-looks__search {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 20px;
  margin-top: 22px;
  min-height: 23px;
}
.cb-looks input.cb-looks__in {
  width: 305px;
  max-width: 100%;
  height: auto;
  margin: 0;
  padding: 4px 10px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .1);
  border-radius: 0;
  box-shadow: none;
  font: 400 12px/normal var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-looks input.cb-looks__in::placeholder { color: #646464; opacity: 1; }
.cb-looks input.cb-looks__in:focus { border-color: #93abbf; }

.cb-looks .cb-looks__btn {
  margin: 0;
  padding: 4px 10px;
  background: #e6d7da;
  border: 1px solid transparent;
  border-radius: 0;
  box-shadow: none;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 12px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s, border-color .15s, box-shadow .15s, transform .15s;
}
.cb-looks .cb-looks__btn:hover {
  background: #e59eb4;
  border-color: #0e0000;
  filter: none;
  box-shadow: 3px 3px 0 rgba(0, 0, 0, .25);
  transform: translate(-1px, -1px);
}
.cb-looks .cb-looks__btn:active { transform: none; box-shadow: none; }

/* итог поиска */
.cb-looks__found { min-height: 0; margin-top: 12px; font: 300 11px/1.4 var(--font1); color: #646464; }
.cb-looks__found:empty { display: none; }
.cb-looks__found b { font-weight: 590; }
.cb-looks__found.is-busy { color: var(--link); }
.cb-looks__found a { color: var(--link); border-bottom: 1px dashed rgba(164, 14, 65, .4); }
.cb-looks__found a:hover { border-bottom-style: solid; }

/* ---------- колонки ---------- */
.cb-looks__cols {
  display: grid;
  grid-template-columns: 299px 299px;
  justify-content: space-between;
  align-items: start;
  margin-top: 47px;
}

.cb-looks__side {
  display: inline-block;
  padding: 4px 19px;
  background: #f6f5f4;
  border: 1px solid #0e0000;
  border-radius: 34px;
  font: 400 12px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
  user-select: none;
  transition: background .15s;
}
.cb-looks__side:hover { background: #e9edf0; }
.cb-looks__col--boys.is-only .cb-looks__side { background: #becad4; }
.cb-looks__col--girls.is-only .cb-looks__side { background: #ecc4c9; }
.cb-looks__count { margin-left: 10px; font: 300 10px/normal var(--font1); color: #767676; }

.cb-looks__cards { margin-top: 37px; }
.cb-looks__col.is-off .cb-looks__cards { display: none; }
.cb-looks__col.is-off { opacity: .5; }

/* ---------- карточка буквы: лист + второй лист под ним ---------- */
.cb-looks__card {
  position: relative;
  width: 299px;
  max-width: 100%;
  height: 194px;
  margin-bottom: 44px;
}
.cb-looks__card::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  width: 301px;
  height: 192px;
  background: #eaeae9;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}
.cb-looks__face {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #f1f1f0;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}

.cb-looks__tag {
  position: absolute;
  top: -1px;
  left: -5px;
  z-index: 2;
  width: 124px;
  padding: 3.64px 9.1px;
  background: #f6f5f4;
  border: .91px dashed rgba(14, 0, 0, .22);
  border-radius: 2.73px;
  font: 590 12px/normal var(--font1);
  text-align: center;
  color: #0e0000;
}

/* список прокручивается; полоска 3px справа, как в макете */
.cb-looks__list {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 10px;
  overflow-y: auto;
  padding: 31px 8px 14px 18px;
}
.cb-looks__list::-webkit-scrollbar { width: 3px; }
.cb-looks__list::-webkit-scrollbar-track { margin: 10px 0 7px; background: #d9d9d9; }
.cb-looks__list::-webkit-scrollbar-thumb { background: #93abbf; }
.cb-looks__col--girls .cb-looks__list::-webkit-scrollbar-thumb { background: #e59eb4; }
.cb-looks__list::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
@supports (-moz-appearance: none) {
  .cb-looks__list { scrollbar-width: thin; scrollbar-color: #93abbf #d9d9d9; }
  .cb-looks__col--girls .cb-looks__list { scrollbar-color: #e59eb4 #d9d9d9; }
}

.cb-looks__list p { margin: 0 0 8px !important; font: 400 12px/normal var(--font1); color: #1e0f11; overflow-wrap: anywhere; }
.cb-looks__list a { color: inherit; text-decoration: none; transition: color .15s; }
.cb-looks__list a:hover { color: var(--link); }
.cb-looks__list p.cb-looks__nobody { font-weight: 300; color: #a8a8a8; }

/* найденное */
.cb-looks__hit { padding: 0 1px; background: #ecc4c9; color: inherit; }
.cb-looks.is-searching .cb-looks__row:not(.is-hit) { display: none; }
.cb-looks.is-searching .cb-looks__nobody { display: none; }
.cb-looks.is-searching .cb-looks__card.is-miss { display: none; }
.cb-looks__empty { display: none; margin: 0 !important; font: 300 11px/normal var(--font1); color: #a8a8a8; }
.cb-looks.is-searching .cb-looks__col.is-miss .cb-looks__empty { display: block; }

/* видно только админам: повтор имени и строка без ссылки */
.cb-looks__warn {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  background: #f4e5e7;
  border-radius: 39px;
  font: 400 9px/normal var(--font1);
  font-style: normal;
  vertical-align: 1px;
  color: var(--link);
}

/* исходные строки прячет скрипт; без скрипта они просто видны списком */
.cb-looks__src p { margin: 0 0 6px !important; }

/* динозаврик внизу */
.cb-looks__dino {
  width: 605px;
  max-width: 100%;
  height: 78px;
  margin: 18px auto 0;
  background: var(--sky);
  -webkit-mask: var(--looks-dino) center / contain no-repeat;
  mask: var(--looks-dino) center / contain no-repeat;
}

/* ---------- узкий экран: колонки друг под другом ---------- */
@media (max-width: 760px) {
  .cb-looks { padding: 28px 16px 15px; }
  .cb-looks__cols { grid-template-columns: minmax(0, 299px); justify-content: center; gap: 30px; margin-top: 30px; }
  .cb-looks input.cb-looks__in { width: 100%; }
}

/* =========================================================
   ГОСТЕВАЯ — html-блок в посте с [hideprofile] (шаблон в html_гостевая.txt)
   картинка 920 &#215; 630, всё остальное лежит поверх неё по координатам макета;
   на узком экране скрипт guest.js уменьшает композицию целиком
   ========================================================= */

.cb-guest {
  position: relative;
  width: 920px;
  max-width: 100%;
  height: 630px;
  margin: 0 auto;
  overflow: hidden;
  font: 400 11px/normal var(--font1);
  text-align: left;
  color: #1e0f11;
}
.cb-guest * { box-sizing: border-box; }

.cb-guest__stage {
  position: absolute;
  top: 0;
  left: 0;
  width: 920px;
  height: 630px;
  background: var(--guest-bg) 0 0 / 920px 630px no-repeat;
  transform-origin: 0 0;
}

/* ---------- текст на белом листе ---------- */
.cb-guest__text {
  position: absolute;
  top: 96px;
  left: 421px;
  width: 430px;
}
.cb-guest__text p { margin: 0 0 8px !important; font: 400 11px/normal var(--font1); color: #1e0f11; }
.cb-guest__text p:last-child { margin-bottom: 0 !important; }
.cb-guest__text b { font-weight: 510; }

/* ---------- цветочки — ссылки на амс, столбиком ---------- */
.cb-guest__flowers {
  position: absolute;
  top: 326px;
  left: 339px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.cb-guest__flowers a { position: relative; display: block; width: 34px; height: 33px; }
.cb-guest__flowers img {
  display: block;
  width: 34px;
  height: 33px;
  max-width: none;
  transition: transform .4s cubic-bezier(.34, 1.56, .64, 1), filter .2s;
}
.cb-guest__flowers a:hover img {
  transform: rotate(72deg) scale(1.2);
  filter: drop-shadow(0 2px 3px rgba(30, 15, 17, .25));
}
/* подпись при наведении — текст из data-tip */
.cb-guest__flowers a[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  top: 50%;
  left: 100%;
  margin-left: 8px;
  padding: 3px 8px;
  background: #f6f5f4;
  border: 1px solid #241915;
  font: 400 10px/normal var(--font1);
  white-space: nowrap;
  color: #0e0000;
  opacity: 0;
  pointer-events: none;
  transform: translate(-4px, -50%);
  transition: opacity .15s, transform .15s;
}
.cb-guest__flowers a[data-tip]:hover::after { opacity: 1; transform: translate(0, -50%); }

/* ---------- окна boys / girls ---------- */
.cb-guest__win {
  position: absolute;
  top: 234px;
  width: 224px;
  height: 240px;
  overflow: hidden;
  background: #f1f1f0;
  border: 1px dashed rgba(0, 0, 0, .13);
}
.cb-guest__win--boys { left: 401px; }
.cb-guest__win--girls { left: 639px; }

.cb-guest__bar {
  position: relative;
  height: 23px;
  padding: 5px 7px 0;
  background: linear-gradient(90deg, #97afc2, #83a0b6);
  font: 590 12px/normal var(--font1);
  color: #ffe5f3;
}
.cb-guest__win--girls .cb-guest__bar { background: linear-gradient(90deg, #dc9bae, #e497b2); }
.cb-guest__bar i { position: absolute; top: 4px; left: 196px; width: 15px; height: 15px; background: var(--xbox) center / contain no-repeat; }

.cb-guest__list {
  position: absolute;
  top: 23px;
  bottom: 0;
  left: 0;
  right: 12px;
  overflow-y: auto;
  padding: 16px 10px 14px 19px;
}
.cb-guest__list::-webkit-scrollbar { width: 3px; }
.cb-guest__list::-webkit-scrollbar-track { margin: 18px 0 12px; background: #d9d9d9; }
.cb-guest__list::-webkit-scrollbar-thumb { background: #93abbf; }
.cb-guest__win--girls .cb-guest__list::-webkit-scrollbar-thumb { background: #e59eb4; }
.cb-guest__list::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
@supports (-moz-appearance: none) {
  .cb-guest__list { scrollbar-width: thin; scrollbar-color: #93abbf #d9d9d9; }
  .cb-guest__win--girls .cb-guest__list { scrollbar-color: #e59eb4 #d9d9d9; }
}

.cb-guest__sec + .cb-guest__sec { margin-top: 15px; }
.cb-guest__chip {
  display: inline-block;
  margin-bottom: 10px;
  padding: 2px 15px;
  background: #efefed;
  border: 1px solid rgba(0, 0, 0, .07);
  font: 300 12px/normal var(--font1);
  text-transform: lowercase;
  color: #525252;
}
.cb-guest__sec p {
    margin: 0 0 8px !important;
    font: 400 11px / normal var(--font1);
    color: #1e0f11;
    overflow-wrap: anywhere;
    line-height: 15px;
}
.cb-guest__sec p:last-child { margin-bottom: 0 !important; }
.cb-guest__sec a {
    color: var(--frame);
    text-decoration: none;
    transition: color .15s;
}
.cb-guest__sec a:hover { color: var(--link); }

/* бронь заканчивается сегодня / завтра */
.cb-guest__soon,
.cb-guest__mark {
  margin-left: 6px;
  font: 400 9px/normal var(--font1);
  font-style: normal;
  color: var(--link);
}
/* истёкшие брони: игрокам не видны, админы видят бледными с пометкой «истекло» */
.cb-guest__sec.is-expired { display: none; }
.cb-guest.is-admin .cb-guest__sec.is-expired { display: block; opacity: .45; }
.cb-guest__nobody { margin: 0 !important; font: 300 11px/normal var(--font1); color: #a8a8a8; }

/* ---------- взять код ---------- */
.cb-guest__form {
  position: absolute;
  top: 495px;
  left: 401px;
  display: flex;
  align-items: center;
  gap: 19px;
}
.cb-guest input.cb-guest__in {
  width: 163px;
  height: 29px;
  margin: 0;
  padding: 4px 10px;
  background: #efefed;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 10px/normal var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-guest input.cb-guest__in::placeholder { color: #525252; opacity: 1; }
.cb-guest input.cb-guest__in:focus { background: #fff; }

.cb-guest .cb-guest__btn {
  margin: 0;
  padding: 5px 20px;
  background: #e6d7da;
  border: 1px solid #0e0000;
  border-radius: 0;
  box-shadow: none;
  font: 400 12px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s, box-shadow .15s, transform .15s;
}
.cb-guest .cb-guest__btn:hover { background: #e59eb4; box-shadow: 3px 3px 0 rgba(0, 0, 0, .25); transform: translate(-1px, -1px); }
.cb-guest .cb-guest__btn:active { transform: none; box-shadow: none; }
.cb-guest .cb-guest__btn:disabled { opacity: .6; cursor: wait; }

.cb-guest__status {
  position: absolute;
  top: 566px;
  left: 401px;
  max-width: 462px;
  padding: 6px 12px 6px 22px;
  background: #efefed;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .12));
  font: 400 10px/1.45 var(--font1);
  color: #525252;
  animation: cbGuestNote .25s ease-out;
}
.cb-guest__status:empty { display: none; }
/* точка-метка слева: голубая — всё ок, малиновая — есть на что глянуть */
.cb-guest__status::before {
  content: "";
  position: absolute;
  top: 11px;
  left: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #93abbf;
}
.cb-guest__status.is-warn::before,
.cb-guest__status.is-err::before { background: var(--link); }
.cb-guest__status b { font-weight: 510; color: #0e0000; }
.cb-guest__status.is-err { color: var(--link); }
@keyframes cbGuestNote {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: none; }
}
.cb-guest__status code { font: 400 10px/1.4 ui-monospace, Menlo, Consolas, monospace; color: #0e0000; user-select: all; }
.cb-guest .cb-guest__status button {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  font: inherit;
  color: inherit;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: pointer;
}

/* =========================================================
   МАГАЗИН — html-блок в посте (шаблон в html_магазин.txt), скрипт shop.js
   окно как личная страница: голубое с пупыркой, слева своя карточка-примерка и корзина,
   справа светлая панель с фонами, плашками и иконками
   ========================================================= */

.cb-shop {
  position: relative;
  width: 823px;
  max-width: 100%;
  margin: 0 auto;
  overflow: hidden;
  background: #becad4;
  font: 400 11px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-shop * { box-sizing: border-box; }
.cb-shop::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -64px;
  width: 353px;
  background: var(--lp-bubbles) 0 0 / 353px 628px repeat-y;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}

/* товары лежат в посте спрятанными, витрину собирает скрипт */
.cb-shop__data { display: none; }

.cb-shop__view {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 289px 515px;
  align-items: start;
  min-height: 628px;
  padding: 23px 19px 30px 0;
}

/* ---------- левая колонка ---------- */
.cb-shop__left { padding: 21px 0 0 27px; width: 250px; }

.punbb .cb-shop .cb-shop__post {
  position: relative;
  display: block;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}
.punbb .cb-shop .cb-shop__post .post-author { margin: 0; }
/* пост магазина с [hideprofile] прячет все карточки внутри себя — нашу примерку возвращаем */
.hideprofile .cb-shop .cb-shop__post .post-author,
.punbb .post.hideprofile .cb-shop .cb-shop__post .post-author { display: block !important; }

.cb-shop__cart { position: relative; margin-top: 24px; padding-top: 14px; width: 223px; }
.cb-shop__cartbox {
  max-height: 200px;
  overflow-y: auto;
  padding: 20px 10px 8px;
  background: #f6f5f4;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
.cb-shop__hint { margin: 0 0 4px !important; font: 300 9.5px/1.4 var(--font1); color: #767676; }

.cb-shop__row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto 11px;
  align-items: center;
  gap: 5px 8px;
  padding: 6px 0;
  border-bottom: 1px dashed rgba(0, 0, 0, .12);
}
.cb-shop__row:last-child { border-bottom: 0; }
.cb-shop__thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 14px;
  overflow: hidden;
  cursor: pointer;
  outline: 1px solid transparent;
  outline-offset: 1px;
}
.cb-shop__thumb img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.cb-shop__thumb--icon { height: 18px; }
.cb-shop__thumb--icon img { width: 14px; height: 14px; object-fit: contain; }
.cb-shop__thumb i { font-style: normal; font-size: 12px; line-height: 1; }
.cb-shop__row.is-try .cb-shop__thumb { outline-color: #e59eb4; }
.cb-shop__what { font: 400 10px/1.2 var(--font1); color: #0e0000; }
.cb-shop__sum { font: 400 9.5px/1.2 var(--font1); color: #646464; }
.cb-shop__x { width: 11px; height: 11px; background: var(--xbox) center / contain no-repeat; cursor: pointer; opacity: .7; }
.cb-shop__x:hover { opacity: 1; }
.cb-shop__row input {
  grid-column: 1 / -1;
  width: 100%;
  height: 22px;
  margin: 0;
  padding: 0 8px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 9.5px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-shop__row input:focus { border-style: solid; border-color: #becad4; }
.cb-shop__row input::placeholder { color: #a8a8a8; }

.cb-shop__total { margin-top: 9px; font: 400 10px/1.4 var(--font1); color: #0e0000; }
.cb-shop__total:empty { display: none; }
.cb-shop__total b { font-weight: 590; }
.cb-shop__total span { margin-left: 8px; color: #646464; }
.cb-shop__total em { display: block; font-style: normal; color: var(--link); }

.cb-shop__btns { display: flex; gap: 10px; margin-top: 14px; }
.cb-shop .cb-shop__pill {
  margin: 0;
  padding: 4px 10px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-shop .cb-shop__pill.is-main { background: #f6f5f4; }
.cb-shop .cb-shop__pill:hover { background: #e9edf0; }
.cb-shop .cb-shop__pill.is-main:hover { background: #e6d7da; }
.cb-shop .cb-shop__pill:disabled { opacity: .45; cursor: not-allowed; }
.cb-shop .cb-shop__pill:disabled:hover { background: #f6f5f4; }

.cb-shop__note { width: 223px; margin-top: 10px; font: 400 9.5px/1.45 var(--font1); color: #3d3d3d; }
.cb-shop__note:empty { display: none; }
.cb-shop .cb-shop__note button {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  font: inherit;
  color: inherit;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: pointer;
}
.cb-shop__note textarea { display: block; width: 100%; height: 90px; margin-top: 5px; font: 400 9px/1.4 ui-monospace, Menlo, Consolas, monospace; }

/* ---------- правая панель ---------- */
.cb-shop__panel { min-height: 575px; padding: 0 23px 20px; background: #f6f5f4; }
.cb-shop__line {
  display: block;
  height: 1px;
  margin: 21px 7px 10px;
  background: repeating-linear-gradient(90deg, rgba(0, 0, 0, .12) 0 2px, transparent 2px 4px);
}

.cb-shop__block { position: relative; padding-top: 14px; }
.cb-shop__label {
  position: absolute;
  top: 0;
  left: 9px;
  z-index: 2;
  padding: 4px 10px;
  background: #e6d7da;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 10px/normal var(--font1);
  white-space: nowrap;
  color: #0e0000;
}

.cb-shop__box {
  display: flex;
  flex-wrap: wrap;
  align-content: safe center;
  justify-content: center;
  gap: 5px;
  padding: 16px 6px 10px;
  overflow-y: auto;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
.cb-shop__box--bg { height: 188px; }
.cb-shop__box--plate { height: 164px; }
.cb-shop__box--icon { height: 83px; }
.cb-shop__box::-webkit-scrollbar { width: 3px; }
.cb-shop__box::-webkit-scrollbar-track { background: #e9e9e9; }
.cb-shop__box::-webkit-scrollbar-thumb { background: #becad4; }
.cb-shop__box::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
@supports (-moz-appearance: none) {
  .cb-shop__box { scrollbar-width: thin; scrollbar-color: #becad4 #e9e9e9; }
}
.cb-shop__empty { margin: 0 !important; font: 300 10px/1 var(--font1); color: #a8a8a8; }

/* плитки */
.cb-shop .cb-shop__tile {
  position: relative;
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #e6d7da;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font: inherit;
  color: #0e0000;
  cursor: pointer;
  outline: 2px solid transparent;
  outline-offset: -2px;
  transition: outline-color .15s;
}
/* затемняем при наведении только картинку: фильтр на всей плитке заставлял текст плашки прыгать */
.cb-shop .cb-shop__tile > img { transition: filter .15s; }
.cb-shop .cb-shop__tile:hover > img { filter: brightness(.94); }
.cb-shop .cb-shop__tile > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  object-fit: cover;
}
.cb-shop .cb-shop__tile--bg { width: 223px; height: 50px; }
.cb-shop .cb-shop__tile--plate { width: 223px; height: 42px; padding-left: 28.5px; }
.cb-shop .cb-shop__tile--plate > span:not(.cb-shop__del) {
  position: relative;
  z-index: 1;
  max-width: 100%;
  padding: 2px 6px;
  overflow: hidden;
  background: #f6f5f4;
  filter: drop-shadow(1px 1px .95px rgba(0, 0, 0, .32));
  font: 300 10px/normal var(--font1);
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cb-shop .cb-shop__tile--plate > span:not(.cb-shop__del) + span:not(.cb-shop__del) { font-size: 8px; }

.cb-shop .cb-shop__tile--icon {
  align-items: center;
  width: 25px;
  height: 25px;
  overflow: visible;
  background: #f1f1f0;
  border: .9px solid #ededed;
  border-radius: 3px;
  box-shadow: inset 0 1.8px 2.6px rgba(0, 0, 0, .1);
}
.cb-shop .cb-shop__tile--icon > img { position: static; width: 14px; height: 14px; object-fit: contain; }
.cb-shop__emoji { font-style: normal; font-size: 13.4px; line-height: 1; }

/* в корзине — голубая рамка и галочка; на примерке сейчас — розовая рамка */
.cb-shop .cb-shop__tile.is-on { outline-color: #93abbf; }
.cb-shop .cb-shop__tile.is-try { outline-color: #e59eb4; }
.cb-shop__tick {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 2;
  display: none;
  width: 14px;
  height: 14px;
  background: #e59eb4 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7.2l2.3 2.3 4.7-5' fill='none' stroke='%230E0000' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat;
  border: 1px solid #241915;
  border-radius: 50%;
}
.cb-shop__tile.is-on .cb-shop__tick { display: block; }
.cb-shop__tile--icon .cb-shop__tick { top: -5px; right: -5px; width: 11px; height: 11px; background-size: 11px; }

/* своя цена у товара */
.cb-shop__cost {
  position: absolute;
  top: 4px;
  right: 22px;
  z-index: 2;
  padding: 1px 6px;
  background: #e6d7da;
  border-radius: 39px;
  font: 400 8.5px/1.3 var(--font1);
  color: #0e0000;
}
.cb-shop__tile--icon .cb-shop__cost { display: none; }

/* уже есть на личной странице */
.cb-shop__own {
  position: absolute;
  right: 4px;
  bottom: 3px;
  z-index: 2;
  padding: 1px 6px;
  background: rgba(246, 245, 244, .92);
  border-radius: 39px;
  font: 400 8px/1.3 var(--font1);
  font-style: normal;
  color: #646464;
}
.cb-shop__tile--icon .cb-shop__own { right: auto; left: -3px; bottom: -3px; width: 7px; height: 7px; padding: 0; font-size: 0; background: #93abbf; border: 1px solid #f6f5f4; }

/* ---------- только амс ---------- */
.cb-shop__adm { position: absolute; top: 0; right: 0; z-index: 2; display: flex; gap: 4px; }
.cb-shop .cb-shop__adm button,
.cb-shop .cb-shop__addform button {
  margin: 0;
  padding: 3px 8px;
  background: #f6f5f4;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 8.5px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-shop .cb-shop__adm button:hover,
.cb-shop .cb-shop__addform button:hover { background: #e9edf0; }

.cb-shop .cb-shop__tile .cb-shop__del {
  position: absolute;
  top: 3px;
  left: 3px;
  z-index: 3;
  display: none;
  width: 13px;
  height: 13px;
  background: var(--xbox) center / contain no-repeat;
}
.cb-shop .cb-shop__tile:hover .cb-shop__del { display: block; }
.cb-shop .cb-shop__tile--icon .cb-shop__del { top: -6px; left: -6px; width: 11px; height: 11px; }

.cb-shop__addform {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 8px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
}
.cb-shop__addform[hidden] { display: none; }
.cb-shop__addform input {
  flex: 1 1 140px;
  height: 24px;
  margin: 0;
  padding: 0 8px;
  background: #f6f5f4;
  border: 1px solid #ededed;
  border-radius: 3px;
  box-shadow: none;
  font: 400 9.5px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-shop__addform input.is-short { flex: 0 1 100px; }
.cb-shop .cb-shop__addform textarea.cb-shop__bulk {
  flex: 1 1 100%;
  min-height: 74px;
  margin: 0;
  padding: 7px 9px;
  resize: vertical;
  background: #f6f5f4;
  border: 1px solid #ededed;
  border-radius: 3px;
  box-shadow: none;
  font: 400 9.5px/1.5 ui-monospace, Menlo, Consolas, monospace;
  color: #0e0000;
  white-space: pre;
  overflow-x: auto;
  outline: none;
}
.cb-shop .cb-shop__addform textarea.cb-shop__bulk:focus { border-color: #becad4; background: #fff; }
.cb-shop .cb-shop__addform textarea.cb-shop__bulk::placeholder { color: #a8a8a8; white-space: pre-line; }

/* режим «убрать несколько»: отмеченные — малиновая рамка и бледнее */
.cb-shop .cb-shop__tile.is-del { outline-color: var(--link); opacity: .55; }
.cb-shop .cb-shop__adm button.is-danger { background: #f4e5e7; color: var(--link); border-color: rgba(164, 14, 65, .5); }
.cb-shop__admnote { font: 400 9px/1.3 var(--font1); color: #646464; }
.cb-shop__admnote.is-bad { color: var(--link); }

/* «списать» под постом с покупкой (видят только амс) */
.cb-shop-pay { margin-top: 10px; font: 400 10px/1.4 var(--font1); color: #646464; }
.cb-shop-pay button {
  margin: 0 8px 0 0;
  padding: 4px 10px;
  background: #e6d7da;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9.5px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-shop-pay button:hover { background: #e59eb4; }
.cb-shop-pay button:disabled { opacity: .5; cursor: wait; }
.cb-shop-pay > span { display: inline-block; margin-right: 8px; }
.cb-shop-pay__note { color: #3d3d3d; }

/* ---------- узкий экран ---------- */
@media (max-width: 840px) {
  .cb-shop__view { grid-template-columns: 1fr; padding: 20px 10px 24px; justify-items: center; }
  .cb-shop__left { padding: 0 0 20px; }
  .cb-shop__panel { width: 100%; min-height: 0; padding: 0 10px 16px; }
  .cb-shop .cb-shop__tile--bg,
  .cb-shop .cb-shop__tile--plate { max-width: 100%; }
}

/* =========================================================
   КОДЫ АНКЕТЫ — html-блок в посте (шаблон в html_коды.txt), скрипт reg.js
   окно как личная страница и магазин: слева живая карточка, справа поля с кодами
   ========================================================= */

.cb-reg {
  position: relative;
  width: 823px;
  max-width: 100%;
  margin: 0 auto;
  overflow: hidden;
  background: #becad4;
  font: 400 11px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-reg * { box-sizing: border-box; }
.cb-reg::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -64px;
  width: 353px;
  background: var(--lp-bubbles) 0 0 / 353px 628px repeat-y;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}
.cb-reg__set { display: none; }

.cb-reg__view {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 289px 515px;
  align-items: start;
  min-height: 628px;
  padding: 23px 19px 30px 0;
}

/* ---------- левая колонка: карточка «как в постах» ---------- */
.cb-reg__left { position: sticky; top: 10px; padding: 21px 0 0 27px; width: 250px; }
.punbb .cb-reg .cb-reg__post {
  position: relative;
  display: block;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}
.punbb .cb-reg .cb-reg__post .post-author { margin: 0; }
.hideprofile .cb-reg .cb-reg__post .post-author,
.punbb .post.hideprofile .cb-reg .cb-reg__post .post-author { display: block !important; }

.cb-reg__btns { margin-top: 18px; }
.cb-reg .cb-reg__pill {
  margin: 0;
  padding: 5px 12px;
  background: #f6f5f4;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9.5px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-reg .cb-reg__pill:hover { background: #e6d7da; }
.cb-reg__note { width: 223px; margin-top: 10px; font: 400 9.5px/1.45 var(--font1); color: #3d3d3d; }
.cb-reg__note:empty { display: none; }
.cb-reg .cb-reg__note button {
  margin: 0; padding: 0; background: none; border: 0; box-shadow: none;
  font: inherit; color: inherit; text-decoration: underline dotted; text-underline-offset: 2px; cursor: pointer;
}
.cb-reg__note textarea { display: block; width: 100%; height: 120px; margin-top: 5px; font: 400 9px/1.4 ui-monospace, Menlo, Consolas, monospace; }

/* ---------- правая панель ---------- */
.cb-reg__panel { min-height: 575px; padding: 0 23px 22px; background: #f6f5f4; }
.cb-reg__line {
  display: block;
  height: 1px;
  margin: 21px 7px 10px;
  background: repeating-linear-gradient(90deg, rgba(0, 0, 0, .12) 0 2px, transparent 2px 4px);
}
.cb-reg__block { position: relative; padding-top: 14px; }
.cb-reg__label {
  position: absolute;
  top: 0;
  left: 9px;
  z-index: 2;
  padding: 4px 10px;
  background: #e6d7da;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 10px/normal var(--font1);
  color: #0e0000;
}
.cb-reg__box {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 24px 16px 16px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}

.cb-reg__field { display: block; }
.cb-reg__field > span { display: block; margin-bottom: 3px; font: 400 9px/1.3 var(--font1); color: #646464; }
.cb-reg .cb-reg__field input,
.cb-reg textarea.cb-reg__lz {
  display: block;
  width: 100%;
  height: 28px;
  margin: 0;
  padding: 0 10px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 10.5px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-reg .cb-reg__field input:focus,
.cb-reg textarea.cb-reg__lz:focus { border-style: solid; border-color: #becad4; }
.cb-reg .cb-reg__field input::placeholder,
.cb-reg textarea.cb-reg__lz::placeholder { color: #b0b0b0; }
.cb-reg textarea.cb-reg__lz {
  height: auto;
  min-height: 70px;
  padding: 8px 10px;
  overflow: hidden;
  resize: none;
  font: 400 10.5px/1.5 ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
}
.cb-reg__two { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }

/* boys / girls */
.cb-reg__sides { display: flex; gap: 6px; }
.cb-reg .cb-reg__sides button,
.cb-reg .cb-reg__keys button,
.cb-reg .cb-reg__set-edit {
  margin: 0;
  padding: 3px 11px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-reg .cb-reg__sides button:hover,
.cb-reg .cb-reg__keys button:hover,
.cb-reg .cb-reg__set-edit:hover { background: #e9edf0; }
.cb-reg .cb-reg__sides button.is-on { background: #becad4; }
.cb-reg .cb-reg__sides button[data-side="girls"].is-on { background: #ecc4c9; }

.cb-reg__out { min-height: 0; font: 400 9.5px/1.4 var(--font1); }
.cb-reg__out:empty { display: none; }
.cb-reg__out .is-busy { color: var(--link); }
.cb-reg__out .is-free { color: #646464; }

/* наборы оформления: хэдер + плашка + иконка одной карточкой */
.cb-reg__sets { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cb-reg__hint { margin: 0 !important; font: 300 9.5px/1.4 var(--font1); color: #a8a8a8; }
.cb-reg__set-card { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.cb-reg .cb-reg__set-pick {
  position: relative;
  display: block;
  width: 100%;
  height: 74px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #e6d7da;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  cursor: pointer;
  outline: 2px solid transparent;
  outline-offset: 2px;
  transition: outline-color .15s;
}
.cb-reg .cb-reg__set-pick:hover { outline-color: rgba(36, 25, 21, .25); }
.cb-reg__set-card.is-on .cb-reg__set-pick { outline-color: #e59eb4; }
.cb-reg__set-h, .cb-reg__set-p { position: absolute; left: 0; right: 0; overflow: hidden; }
.cb-reg__set-h { top: 0; height: 40px; border-bottom: 1px dashed rgba(14, 0, 0, .35); }
.cb-reg__set-p { bottom: 0; height: 34px; }
.cb-reg__set-h img, .cb-reg__set-p img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.cb-reg__set-i {
  position: absolute;
  top: 8px;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  background: #f1f1f0;
  border-radius: 3px;
  box-shadow: inset 0 1.8px 2.6px rgba(0, 0, 0, .1);
}
.cb-reg__set-i img { width: 13px; height: 13px; object-fit: contain; }
.cb-reg__set-i i { font-style: normal; font-size: 12px; line-height: 1; }
.cb-reg__set-name { font: 400 9.5px/1.2 var(--font1); color: #0e0000; }
.cb-reg__set-card.is-on .cb-reg__set-name { color: var(--link); }
.cb-reg .cb-reg__set-edit { padding: 2px 8px; font-size: 8.5px; }

/* кнопки над лз */
.cb-reg__keys { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
.cb-reg .cb-reg__keys .is-b { font-weight: 700; }
.cb-reg .cb-reg__keys .is-i { font-style: italic; }
.cb-reg .cb-reg__keys .is-u { text-decoration: underline; }
.cb-reg .cb-reg__keys .is-s { text-decoration: line-through; }

/* проверка лз — белый листок с рваным краем, как в профиле */
.cb-reg__check {
  padding: 12px 14px 20px;
  background: #fff;
  -webkit-mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x;
  mask: linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat, conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x;
}
.cb-reg__check:empty { display: none; }
.cb-reg__verdict { margin: 0 !important; font: 400 10px/1.4 var(--font1); color: #646464; }
.cb-reg__check.is-err .cb-reg__verdict { color: var(--link); }
.cb-reg__check ol { margin: 0; padding: 0; list-style: none; }
.cb-reg__check li { margin: 10px 0 0; padding: 10px 0 0; border-top: 1px dashed #dcd2d4; }
.cb-reg__check li p { margin: 0 !important; font: 400 10px/1.45 var(--font1); color: #0e0000; }
.cb-reg__check li p b { font-weight: 590; color: var(--link); }
.cb-reg__check li.is-warn p b { color: #a07a12; }
.cb-reg__snip { margin-top: 5px; font: 400 9.5px/1.5 var(--font1); color: #8a8a8a; overflow-wrap: anywhere; }
.cb-reg__snip em { font-style: normal; color: var(--link); }
.cb-reg__check li.is-warn .cb-reg__snip em { color: #a07a12; }

/* ---------- амс: «принять коды» под постом с кодами ---------- */
.cb-reg-accept {
  max-width: 470px;
  margin-top: 14px;
  background: #f6f5f4;
  border: 1px dashed rgba(14, 0, 0, .22);
  font: 400 10px/1.4 var(--font1);
  color: #0e0000;
}
.cb-reg-accept__bar { padding: 5px 12px; background: #becad4; font-size: 10px; }
.cb-reg-accept label { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 8px 12px 0; }
.cb-reg-accept input[type="checkbox"] { margin: 0; accent-color: #e59eb4; }
.cb-reg-accept input[type="text"] {
  width: 150px;
  height: 22px;
  margin: 0;
  padding: 0 8px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  font: 400 10px/1 var(--font1);
}
.cb-reg-accept > button {
  margin: 10px 12px 10px;
  padding: 4px 14px;
  background: #e6d7da;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9.5px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-reg-accept > button:hover { background: #e59eb4; }
.cb-reg-accept > button:disabled { opacity: .5; cursor: wait; }
.cb-reg-accept__log { padding: 0 12px 10px; }
.cb-reg-accept__log:empty { display: none; }
.cb-reg-accept__log p { margin: 0 0 2px !important; color: #3d3d3d; }
.cb-reg-accept__log p.is-bad { color: var(--link); }

/* ---------- узкий экран ---------- */
@media (max-width: 840px) {
  .cb-reg__view { grid-template-columns: 1fr; padding: 20px 10px 24px; justify-items: center; }
  .cb-reg__left { position: static; padding: 0 0 20px; }
  .cb-reg__panel { width: 100%; min-height: 0; padding: 0 10px 16px; }
  .cb-reg__two, .cb-reg__sets { grid-template-columns: 1fr; }
}

/* =========================================================
   ДЕЙЛИКИ — html-блок в посте (шаблон в html_дейлики.txt), скрипт daily.js
   окно как лс: голубое с пупыркой, внутри светлый лист, сетка 7 &#215; 4 из клеточек
   ========================================================= */

.cb-daily {
  position: relative;
  width: 823px;
  max-width: 100%;
  margin: 0 auto;
  padding: 18px 26px;
  overflow: hidden;
  background: #becad4;
  font: 400 11px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-daily * { box-sizing: border-box; }
.cb-daily::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -64px;
  width: 353px;
  background: var(--lp-bubbles) 0 0 / 353px 628px repeat-y;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}
.cb-daily__data, .cb-daily__paid { display: none; }

.cb-daily__view {
  position: relative;
  z-index: 1;
  padding: 20px 26px 26px;
  background: #f6f5f4;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}

/* ---------- шапка ---------- */
.cb-daily__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cb-daily__title {
  display: inline-flex;
  align-items: stretch;
  border: 1px dashed rgba(14, 0, 0, .35);
  font: 400 10px/1 var(--font1);
  letter-spacing: .02em;
  color: #0e0000;
}
.cb-daily__title { padding-left: 11px; }
.cb-daily__title { line-height: 24px; }
.cb-daily__title b {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  margin-left: 11px;
  background: #241915;
}
.cb-daily__title svg { width: 12px; height: 12px; fill: #f6f5f4; }
.cb-daily__month { font: 400 9.5px/1.3 var(--font1); color: #646464; }

.cb-daily__intro { margin-top: 14px; font: 300 10px/1.55 var(--font1); color: #1e0f11; }
.cb-daily__intro p { margin: 0 0 6px !important; }
.cb-daily__line {
  display: block;
  height: 1px;
  margin: 12px 0 18px;
  background: repeating-linear-gradient(90deg, rgba(0, 0, 0, .12) 0 2px, transparent 2px 4px);
}

/* ---------- сетка ---------- */
.cb-daily__board {
  padding: 40px 22px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
.cb-daily__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 83px));
  justify-content: center;
  gap: 14px 16px;
}
.cb-daily .cb-daily__cell {
  position: relative;
  display: block;
  width: 100%;
  height: 58px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #f6f5f4;
  border: 0;
  border-radius: 0;
  box-shadow: inset 0 2px 3px rgba(0, 0, 0, .08), 1px 1px .5px rgba(0, 0, 0, .06);
  font: inherit;
  color: #0e0000;
  text-align: left;
  cursor: pointer;
}
/* наведение — только уголок с номером становится розовым ярлыком, как подписи на лс */
.cb-daily__num { transition: background .15s; }
.cb-daily .cb-daily__cell:hover .cb-daily__num { background: #e6d7da; }

/* номер — в пунктирном уголке справа, как ярлыки на лс */
.cb-daily__num {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  min-width: 22px;
  height: 20px;
  padding: 0 5px;
  background: #f6f5f4;
  border-left: 1px dashed rgba(14, 0, 0, .3);
  border-bottom: 1px dashed rgba(14, 0, 0, .3);
  font: 400 9px/19px var(--font1);
  text-align: center;
  color: #0e0000;
}
.cb-daily__money {
  position: absolute;
  left: 7px;
  bottom: 5px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 5px;
  font: 510 9px/1 var(--font1);
  color: #3d3d3d;
}
.cb-daily__money i {
  padding: 1px 5px;
  background: #e6d7da;
  border-radius: 39px;
  font: 400 7.5px/1.3 var(--font1);
  font-style: normal;
  color: #0e0000;
}

/* превью бонуса в клетке */
.cb-daily__b { position: absolute; z-index: 1; }
.cb-daily__b img { display: block; max-width: none; }
.cb-daily__b--plate, .cb-daily__b--bg { left: 0; right: 0; top: 0; height: 30px; overflow: hidden; opacity: .9; }
.cb-daily__b--plate img, .cb-daily__b--bg img { width: 100%; height: 100%; object-fit: cover; }
.cb-daily__b--icon, .cb-daily__b--badge {
  top: 9px;
  left: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  background: #f1f1f0;
  border: .9px solid #e4e4e4;
  border-radius: 3px;
  box-shadow: inset 0 1.8px 2.6px rgba(0, 0, 0, .1);
}
.cb-daily__b--icon img { width: 14px; height: 14px; object-fit: contain; }
.cb-daily__b--icon i { font-style: normal; font-size: 13px; line-height: 1; }
.cb-daily__b--badge { border-radius: 50%; }
.cb-daily__b--badge img { width: 23px; height: 23px; border-radius: 50%; object-fit: cover; }

/* отмеченный день — голубой с белой звездочкой, как в макете */
.cb-daily .cb-daily__cell.is-done { background: linear-gradient(160deg, #a9bfd3, #93abbf); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35); }
.cb-daily__cell.is-done .cb-daily__num { background: #f6f5f4; }
.cb-daily__cell.is-done .cb-daily__money { color: rgba(255, 255, 255, .9); }
.cb-daily__cell.is-done .cb-daily__money i { display: none; }
.cb-daily__star { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; }
.cb-daily__star svg { width: 24px; height: 24px; }
.cb-daily__star svg { fill: #fff; filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .12)); }

/* следующий день — номер в темном квадрате, как звездочка в заголовке, и пунктир по краю */
.cb-daily .cb-daily__cell.is-next { outline: 1px dashed rgba(36, 25, 21, .45); outline-offset: -4px; }
.cb-daily .cb-daily__cell.is-next .cb-daily__num,
.cb-daily .cb-daily__cell.is-next:hover .cb-daily__num { background: #241915; border-color: #241915; color: #f6f5f4; }

/* ---------- полоса под сеткой ---------- */
.cb-daily__bar { margin-top: 16px; }
.cb-daily__stat { font: 400 10.5px/1.4 var(--font1); color: #0e0000; }
.cb-daily__stat b { font-weight: 590; }
.cb-daily__stat span { margin-left: 10px; color: #646464; }
.cb-daily__say { margin: 6px 0 0 !important; font: 300 10px/1.4 var(--font1); color: #646464; }
.cb-daily__go { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 8px; }
.cb-daily__today { font: 400 10.5px/1.4 var(--font1); }
.cb-daily__today b { font-weight: 590; }
.cb-daily__task { max-width: 560px; padding: 8px 12px; background: #f1f1f0; font: 400 10px/1.45 var(--font1); }
.cb-daily__task span, .cb-daily__pop-task span {
  display: inline-block;
  margin-right: 7px;
  padding: 1px 7px;
  background: #e6d7da;
  border-radius: 39px;
  font-size: 8.5px;
}
.cb-daily textarea.cb-daily__proof {
  display: block;
  width: 100%;
  max-width: 560px;
  min-height: 52px;
  margin: 0;
  padding: 8px 10px;
  resize: vertical;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 10.5px/1.45 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-daily textarea.cb-daily__proof:focus { border-style: solid; border-color: #becad4; }
.cb-daily .cb-daily__btn {
  margin: 0;
  padding: 6px 18px;
  background: #e6d7da;
  border: 1px solid #0e0000;
  border-radius: 0;
  box-shadow: none;
  font: 400 11px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s, box-shadow .15s, transform .15s;
}
.cb-daily .cb-daily__btn:hover { background: #e59eb4; box-shadow: 3px 3px 0 rgba(0, 0, 0, .25); transform: translate(-1px, -1px); }
.cb-daily .cb-daily__btn:disabled { opacity: .5; cursor: wait; transform: none; box-shadow: none; }
.cb-daily__note { margin: 6px 0 0 !important; font: 400 9.5px/1.4 var(--font1); color: #646464; }
.cb-daily__note:empty { display: none; }
.cb-daily__note.is-bad { color: var(--link); }

/* ---------- окошко с подробностями клетки ---------- */
.cb-daily__pop {
  position: absolute;
  z-index: 10;
  width: 240px;
  padding: 12px 14px 12px;
  background: #fff;
  border: 1px solid rgba(36, 25, 21, .2);
  box-shadow: 0 8px 22px rgba(30, 15, 17, .18);
  font: 400 10px/1.45 var(--font1);
}
.cb-daily__pop[hidden] { display: none; }
.cb-daily__pop p { margin: 4px 0 0 !important; }
.cb-daily__pop b { font-weight: 590; }
.cb-daily__pop-head { font: 590 11px/1.3 var(--font1); }
.cb-daily__pop-head span { margin-left: 8px; padding: 1px 7px; background: #e9edf0; border-radius: 39px; font: 400 8.5px/1.3 var(--font1); }
.cb-daily__pop-task em { display: block; font-style: normal; font-size: 9px; color: var(--link); }
.cb-daily .cb-daily__x {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 13px;
  height: 13px;
  margin: 0;
  padding: 0;
  background: var(--xbox) center / contain no-repeat;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}
.cb-daily__pv { position: relative; margin-top: 8px; overflow: hidden; }
.cb-daily__pv img { display: block; max-width: none; }
.cb-daily__pv--bg, .cb-daily__pv--plate { width: 212px; height: 47px; }
.cb-daily__pv--plate { height: 40px; display: flex; flex-direction: column; justify-content: center; gap: 2px; padding-left: 27px; }
.cb-daily__pv--bg img, .cb-daily__pv--plate img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cb-daily__pv--plate span { position: relative; align-self: flex-start; padding: 1px 6px; background: #f6f5f4; filter: drop-shadow(1px 1px .95px rgba(0, 0, 0, .32)); font: 300 9px/normal var(--font1); }
.cb-daily__pv--plate span + span { font-size: 7.5px; }
.cb-daily__pv--icon { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: #f1f1f0; border-radius: 3px; box-shadow: inset 0 1.8px 2.6px rgba(0, 0, 0, .1); }
.cb-daily__pv--icon img { width: 16px; height: 16px; object-fit: contain; }
.cb-daily__pv--icon i { font-style: normal; font-size: 15px; }

/* ---------- админка ---------- */
.cb-daily__admin { margin-top: 20px; padding-top: 14px; border-top: 1px dashed rgba(0, 0, 0, .15); }
.cb-daily .cb-daily__admin button {
  margin: 0;
  padding: 4px 11px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
}
.cb-daily .cb-daily__admin button:hover { background: #e9edf0; }
.cb-daily .cb-daily__admin button.is-main { background: #e6d7da; }
.cb-daily .cb-daily__admin button.is-main:hover { background: #e59eb4; }
.cb-daily__adm { margin-top: 12px; }
.cb-daily__adm-row, .cb-daily__adm-grid { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 12px; }
.cb-daily__adm label { display: flex; flex-direction: column; gap: 3px; font: 400 9px/1.3 var(--font1); color: #646464; }
.cb-daily__adm label.is-wide { flex: 1 1 260px; }
.cb-daily__adm label.is-check { flex-direction: row; align-items: center; gap: 6px; color: #0e0000; }
.cb-daily__adm label[hidden] { display: none; }
.cb-daily__adm input[type="text"], .cb-daily__adm select {
  width: 100%;
  min-width: 120px;
  height: 26px;
  margin: 0;
  padding: 0 9px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 10px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-daily__adm input[type="checkbox"] { margin: 0; accent-color: #e59eb4; }
.cb-daily__adm-hint { margin: 12px 0 6px !important; font: 300 9.5px/1.4 var(--font1); color: #767676; }
.cb-daily__adm-days { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 4px; }
.cb-daily .cb-daily__admin .cb-daily__adm-day {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 4px 0;
  border-radius: 3px;
  border-color: rgba(36, 25, 21, .2);
  background: #f1f1f0;
}
.cb-daily__adm-day b { font: 590 9px/1 var(--font1); }
.cb-daily__adm-day span { font: 400 8px/1 var(--font1); color: #646464; }
.cb-daily .cb-daily__admin .cb-daily__adm-day.has-bonus { background: #f4e5e7; }
.cb-daily .cb-daily__admin .cb-daily__adm-day.has-task { box-shadow: inset 0 -2px 0 #93abbf; }
.cb-daily .cb-daily__admin .cb-daily__adm-day.is-on { border-color: #e59eb4; outline: 1px solid #e59eb4; }
.cb-daily__adm-form { position: relative; margin-top: 12px; padding: 14px; background: #f1f1f0; }
.cb-daily__adm-title { margin-bottom: 8px; font: 590 10.5px/1 var(--font1); }
.cb-daily__adm-pv { position: relative; height: 36px; margin: 10px 0; }
.cb-daily__adm-pv .cb-daily__b--plate, .cb-daily__adm-pv .cb-daily__b--bg { width: 160px; height: 36px; right: auto; }
.cb-daily__adm-pv .cb-daily__b--icon, .cb-daily__adm-pv .cb-daily__b--badge { top: 4px; left: 0; }
.cb-daily__adm-foot { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.cb-daily__adm-note { font: 400 9.5px/1.3 var(--font1); color: #646464; }
.cb-daily__adm-note.is-bad { color: var(--link); }

/* «выдать все» у амс */
.cb-daily-pay { margin-top: 16px; padding: 10px 12px; background: #f1f1f0; font: 400 10px/1.4 var(--font1); }
.cb-daily-pay b { font-weight: 590; }
.cb-daily-pay button {
  margin: 0 0 0 10px;
  padding: 4px 14px;
  background: #e6d7da;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9.5px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-daily-pay button:hover { background: #e59eb4; }
.cb-daily-pay button:disabled { opacity: .5; cursor: wait; }
.cb-daily-pay__log p { margin: 3px 0 0 !important; color: #3d3d3d; }
.cb-daily-pay__log p.is-bad { color: var(--link); }

/* ---------- пост с отметкой ---------- */
.cb-daily-post {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 470px;
  padding: 10px 14px 10px 10px;
  background: #f6f5f4;
  border: 1px dashed rgba(14, 0, 0, .22);
  font: 400 10px/1.4 var(--font1);
  color: #0e0000;
}
.cb-daily-post__num {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  background: linear-gradient(160deg, #a9bfd3, #93abbf);
  font: 590 13px/1 var(--font1);
  color: #fff;
}
.cb-daily-post__txt { flex: 1 1 auto; min-width: 0; }
.cb-daily-post__txt b { display: block; font-weight: 590; font-size: 10.5px; }
.cb-daily-post__txt span { display: block; color: #646464; }
.cb-daily-post__txt em { display: block; margin-top: 4px; font-style: normal; color: #3d3d3d; overflow-wrap: anywhere; }
.cb-daily-post .cb-daily__b { position: relative; top: auto; left: auto; flex: none; }
.cb-daily-post .cb-daily__b--plate, .cb-daily-post .cb-daily__b--bg { width: 90px; height: 20px; }
.cb-daily-post__state { flex: none; font: 400 8.5px/1.3 var(--font1); }
.cb-daily-post__state:empty { display: none; }
.cb-daily-post__state { padding: 2px 8px; background: #f4e5e7; border-radius: 39px; color: var(--link); }
.cb-daily-post__state.is-paid { background: #e9edf0; color: #3d5a72; }
.cb-daily-post__state.is-dup { background: #fbefd2; color: #8a6a12; }

/* ---------- узкий экран ---------- */
@media (max-width: 760px) {
  .cb-daily { padding: 10px; }
  .cb-daily__view { padding: 16px 12px 18px; }
  .cb-daily__board { padding: 18px 10px; }
  .cb-daily__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  .cb-daily__adm-days { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}

/* служебное поле дейликов не показываем в карточке и профиле
   (если у тебя поле не fld6 — поменяй цифру и здесь, и в data-field в посте) */
.punbb .post .post-author li.pa-fld6,
#viewprofile #profile-left #pa-fld6 { display: none !important; }

/* «сообщение в теме не появилось?» — тихая ссылка-кнопка */
.cb-daily .cb-daily__resend {
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
  font: inherit;
  color: #8a8a8a;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: pointer;
}
.cb-daily .cb-daily__resend:hover { color: var(--link); }

/* =========================================================
   БАНК — html-блок в посте (шаблон в html_банк.txt), скрипт bank.js
   окно как лс и дейлики: голубое с пупыркой, внутри светлый лист;
   два столбца одинаковой высоты со скроллом, под ними расчет
   ========================================================= */

.cb-bank {
  position: relative;
  width: 823px;
  max-width: 100%;
  margin: 0 auto;
  padding: 18px 26px;
  overflow: hidden;
  background: #becad4;
  font: 400 11px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-bank * { box-sizing: border-box; }
.cb-bank::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -64px;
  width: 353px;
  background: var(--lp-bubbles) 0 0 / 353px 628px repeat-y;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}
.cb-bank__data, .cb-bank__done { display: none; }

.cb-bank__view {
  position: relative;
  z-index: 1;
  padding: 22px 26px 26px;
  background: #f6f5f4;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}
/* наклейка-смайлик в углу, как на макете */
.cb-bank__view::after {
  content: "";
  position: absolute;
  top: -14px;
  right: 18px;
  width: 48px;
  height: 48px;
  background: var(--lp-sticker) center / contain no-repeat;
  transform: rotate(12deg);
  pointer-events: none;
}

/* ---------- шапка ---------- */
.cb-bank__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-right: 56px; }
.cb-bank__title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 4px 10px;
  background: #e59eb4;
  border: 1px solid #241915;
  font: 400 12px/normal var(--font1);
}
.cb-bank__title i { width: 15px; height: 15px; background: var(--xbox) center / contain no-repeat; }
.cb-bank__balance { font: 400 10px/1.3 var(--font1); color: #646464; }
.cb-bank__balance b { margin-left: 4px; padding: 3px 10px; background: #fff; border: 1px dashed rgba(14, 0, 0, .25); font: 590 11px/1 var(--font1); color: #0e0000; }
.cb-bank__intro { margin: 14px 0 0 !important; font: 300 10px/1.55 var(--font1); color: #1e0f11; }

.cb-bank__find { margin-top: 14px; }
.cb-bank__find input {
  width: 100%;
  height: 28px;
  margin: 0;
  padding: 0 12px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 10.5px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-bank__find input:focus { border-style: solid; border-color: #becad4; }

/* ---------- два столбца ---------- */
.cb-bank__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 18px; }
.cb-bank__col, .cb-bank__calc { position: relative; padding-top: 14px; }
.cb-bank__label {
  position: absolute;
  top: 0;
  left: 9px;
  z-index: 2;
  padding: 4px 10px;
  background: #e6d7da;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 10px/normal var(--font1);
  color: #0e0000;
}
.cb-bank__col--spend .cb-bank__label { background: #d9e2ea; }

.cb-bank__list {
  height: 400px;
  overflow-y: auto;
  padding: 22px 8px 10px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
.cb-bank__list::-webkit-scrollbar, .cb-bank__cart::-webkit-scrollbar { width: 3px; }
.cb-bank__list::-webkit-scrollbar-track, .cb-bank__cart::-webkit-scrollbar-track { background: #e9e9e9; }
.cb-bank__list::-webkit-scrollbar-thumb, .cb-bank__cart::-webkit-scrollbar-thumb { background: #becad4; }
.cb-bank__list::-webkit-scrollbar-button, .cb-bank__cart::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
@supports (-moz-appearance: none) {
  .cb-bank__list, .cb-bank__cart { scrollbar-width: thin; scrollbar-color: #becad4 #e9e9e9; }
}

.cb-bank .cb-bank__item {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  width: 100%;
  margin: 0 0 4px;
  padding: 7px 9px;
  background: #f6f5f4;
  border: 0;
  border-radius: 0;
  box-shadow: 1px 1px .5px rgba(0, 0, 0, .06);
  font: inherit;
  text-align: left;
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s;
}
.cb-bank .cb-bank__item:hover { background: #fff; }
.cb-bank__mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border: 1px solid rgba(36, 25, 21, .45);
  border-radius: 50%;
  font: 590 7.5px/1 var(--font1);
  color: #0e0000;
}
.cb-bank__mark:empty::before { content: "+"; font: 400 11px/1 var(--font1); color: rgba(36, 25, 21, .6); }
.cb-bank__item.is-on .cb-bank__mark { background: #ecc4c9; border-color: #241915; }
.cb-bank__col--spend .cb-bank__item.is-on .cb-bank__mark { background: #becad4; }
.cb-bank__item.is-on .cb-bank__mark:empty::before {
  content: "";
  width: 7px;
  height: 4px;
  margin-top: -2px;
  border-left: 1.2px solid #0e0000;
  border-bottom: 1.2px solid #0e0000;
  transform: rotate(-45deg);
}
.cb-bank__name { font: 400 10.5px/1.3 var(--font1); }
.cb-bank__name small, .cb-bank__rname small { display: block; font: 300 8.5px/1.3 var(--font1); color: #8a8a8a; }
.cb-bank__price {
  min-width: 46px;
  padding: 2px 9px;
  background: #e9edf0;
  border: 1px solid rgba(36, 25, 21, .55);
  border-radius: 39px;
  font: 400 9.5px/1.3 var(--font1);
  text-align: center;
}
.cb-bank__col--earn .cb-bank__item.is-on .cb-bank__price { background: #f4e5e7; }
.cb-bank__tip { margin: 2px 6px 8px !important; font: 300 8.5px/1.4 var(--font1); text-align: center; color: #8a8a8a; }

/* ---------- расчет ---------- */
.cb-bank__calc { margin-top: 22px; }
.cb-bank__cart {
  max-height: 290px;
  overflow-y: auto;
  padding: 22px 12px 6px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
.cb-bank__empty { margin: 0 0 8px !important; font: 300 10px/1.4 var(--font1); color: #a8a8a8; }
.cb-bank__row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto 60px 13px;
  align-items: center;
  gap: 6px 10px;
  padding: 8px 0;
  border-bottom: 1px dashed rgba(0, 0, 0, .12);
}
.cb-bank__row:last-child { border-bottom: 0; }
.cb-bank__sign {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  background: #ecc4c9;
  font: 590 11px/1 var(--font1);
}
.cb-bank__row--spend .cb-bank__sign { background: #becad4; }
.cb-bank__rname { font: 400 10.5px/1.3 var(--font1); }
.cb-bank__qty { display: inline-flex; align-items: center; gap: 6px; }
.cb-bank__qty b { min-width: 14px; font: 590 10.5px/1 var(--font1); text-align: center; }
.cb-bank .cb-bank__qty button {
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  background: #f6f5f4;
  border: 1px solid rgba(36, 25, 21, .4);
  border-radius: 50%;
  box-shadow: none;
  font: 400 11px/1 var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-bank .cb-bank__qty button:hover { background: #e9edf0; }
.cb-bank__rsum { font: 510 10.5px/1 var(--font1); text-align: right; }
.cb-bank .cb-bank__del {
  width: 13px;
  height: 13px;
  margin: 0;
  padding: 0;
  background: var(--xbox) center / contain no-repeat;
  border: 0;
  box-shadow: none;
  opacity: .7;
  cursor: pointer;
}
.cb-bank .cb-bank__del:hover { opacity: 1; }
.cb-bank input.cb-bank__comment {
  grid-column: 2 / -1;
  width: 100%;
  height: 24px;
  margin: 0;
  padding: 0 9px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .2);
  border-radius: 3px;
  box-shadow: none;
  font: 400 9.5px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-bank input.cb-bank__comment:focus { border-style: solid; border-color: #becad4; }
.cb-bank input.cb-bank__comment.is-ask::placeholder { color: var(--link); opacity: .7; }

.cb-bank__sum { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 12px; }
.cb-bank__sum span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
  padding: 8px 12px;
  background: #f1f1f0;
  box-shadow: 1px 1px .5px rgba(0, 0, 0, .06);
}
.cb-bank__sum i { font: 400 9px/1 var(--font1); font-style: normal; color: #646464; }
.cb-bank__sum b { font: 590 13px/1 var(--font1); }
.cb-bank__sum .is-plus b::before { content: "+"; }
.cb-bank__sum .is-minus b::before { content: "\2212"; }
.cb-bank__sum .is-left { background: #e9edf0; }
.cb-bank__sum .is-left.is-bad { background: #f4e5e7; }
.cb-bank__sum .is-left.is-bad b { color: var(--link); }

.cb-bank__btns { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.cb-bank .cb-bank__go {
  margin: 0;
  padding: 6px 18px;
  background: #e6d7da;
  border: 1px solid #0e0000;
  border-radius: 0;
  box-shadow: none;
  font: 400 11px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s, box-shadow .15s, transform .15s;
}
.cb-bank .cb-bank__go:hover { background: #e59eb4; box-shadow: 3px 3px 0 rgba(0, 0, 0, .25); transform: translate(-1px, -1px); }
.cb-bank .cb-bank__go:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; background: #e6d7da; }
.cb-bank .cb-bank__pill {
  margin: 0;
  padding: 4px 11px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9.5px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
}
.cb-bank .cb-bank__pill:hover { background: #e9edf0; }
.cb-bank__note { margin: 8px 0 0 !important; font: 400 9.5px/1.4 var(--font1); color: #646464; }
.cb-bank__note:empty { display: none; }
.cb-bank__note.is-bad { color: var(--link); }

/* ---------- амс ---------- */
.cb-bank__admin { margin-top: 20px; padding-top: 14px; border-top: 1px dashed rgba(0, 0, 0, .15); }
.cb-bank__adm-hint { margin: 10px 0 !important; font: 300 9.5px/1.5 var(--font1); color: #646464; }
.cb-bank__adm-hint code { padding: 0 4px; background: #f1f1f0; font: 400 9px/1.4 ui-monospace, Menlo, Consolas, monospace; color: #0e0000; }
.cb-bank__adm-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cb-bank__adm-cols span { display: block; margin-bottom: 4px; font: 400 9px/1.3 var(--font1); color: #646464; }
.cb-bank__adm-cols textarea {
  width: 100%;
  height: 260px;
  margin: 0;
  padding: 8px 10px;
  resize: vertical;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  font: 400 9.5px/1.6 ui-monospace, Menlo, Consolas, monospace;
  color: #0e0000;
  white-space: pre;
  outline: none;
}
.cb-bank__adm-foot { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.cb-bank__adm-note { font: 400 9.5px/1.3 var(--font1); color: #646464; }

.cb-bank-pay { margin-top: 16px; padding: 10px 12px; background: #f1f1f0; font: 400 10px/1.4 var(--font1); }
.cb-bank-pay b { font-weight: 590; }
.cb-bank-pay button,
.cb-bank-req__adm button {
  margin: 0 0 0 10px;
  padding: 4px 14px;
  background: #e6d7da;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9.5px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-bank-pay button:hover, .cb-bank-req__adm button:hover { background: #e59eb4; }
.cb-bank-pay__log { margin-left: 10px; color: #3d3d3d; }

/* ---------- заявка в теме: аккуратный чек ---------- */
.cb-bank-req {
  max-width: 470px;
  padding: 12px 14px 12px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  font: 400 10.5px/1.4 var(--font1);
  color: #0e0000;
}
.cb-bank-req__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 8px; border-bottom: 1px dashed rgba(0, 0, 0, .15); }
.cb-bank-req__head b { font-weight: 590; }
.cb-bank-req__state { padding: 2px 8px; background: #f4e5e7; border-radius: 39px; font: 400 8.5px/1.3 var(--font1); color: var(--link); }
.cb-bank-req__state.is-ok { background: #e9edf0; color: #3d5a72; }
.cb-bank-req__state.is-no { background: #efefed; color: #767676; }
.cb-bank-req ul { margin: 8px 0 0; padding: 0; list-style: none; }
.cb-bank-req li { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; gap: 8px; align-items: baseline; padding: 3px 0; }
.cb-bank-req li i { font-style: normal; font-weight: 590; color: #a40e41; }
.cb-bank-req li.is-spend i { color: #3d5a72; }
.cb-bank-req li small { display: block; font: 300 9px/1.35 var(--font1); color: #8a8a8a; overflow-wrap: anywhere; }
.cb-bank-req li small a { color: var(--link); }
.cb-bank-req li b { font-weight: 510; }
.cb-bank-req__total { margin-top: 8px; padding-top: 8px; border-top: 1px dashed rgba(0, 0, 0, .15); text-align: right; }
.cb-bank-req__total b { font-weight: 590; }
.cb-bank-req__total em { display: block; font: 400 9px/1.3 var(--font1); font-style: normal; color: #8a6a12; }
.cb-bank-req__adm { margin-top: 8px; text-align: right; font-size: 9.5px; color: #646464; }
.cb-bank-req__adm:empty { display: none; }
.cb-bank-req__adm span { display: block; margin-top: 4px; }

/* ---------- узкий экран ---------- */
@media (max-width: 760px) {
  .cb-bank { padding: 10px; }
  .cb-bank__view { padding: 18px 12px 18px; }
  .cb-bank__cols, .cb-bank__adm-cols { grid-template-columns: 1fr; }
  .cb-bank__list { height: 300px; }
  .cb-bank__sum { grid-template-columns: 1fr 1fr; }
  .cb-bank__row { grid-template-columns: 18px minmax(0, 1fr) auto 13px; }
  .cb-bank__rsum { grid-column: 2 / 3; text-align: left; }
}

/* =========================================================
   НОВОСТИ — html-блок в посте с [hideprofile] (шаблон в html_новости.txt), скрипт news.js
   кассета амс слева выбирается атрибутом data-amc: leehan, riwoo, stella, sangwon
   окошки fluders / players и подписи растут под длину имен — ничего не обрезается
   ========================================================= */

.cb-news {
  position: relative;
  width: 665px;
  max-width: 100%;
  margin: 0 auto;
  font: 400 10px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-news * { box-sizing: border-box; }
.cb-news__stage { position: relative; width: 665px; padding-left: 60px; transform-origin: 0 0; }

/* ---------- кассета ---------- */
.cb-news__tape {
  position: absolute;
  top: 14px;
  left: 4px;
  z-index: 5;
  width: 288px;
  height: 470px;
  background: center / contain no-repeat;
  filter: drop-shadow(6px 6px 5px rgba(0, 0, 0, .25));
  pointer-events: none;
}
.cb-news[data-amc="leehan"] .cb-news__tape  { background-image: url(https://upforme.ru/uploads/001c/d1/3d/2/955687.png); }
.cb-news[data-amc="riwoo"] .cb-news__tape   { background-image: url(https://upforme.ru/uploads/001c/d1/3d/2/443350.png); }
.cb-news[data-amc="stella"] .cb-news__tape  { background-image: url(https://upforme.ru/uploads/001c/d1/3d/2/957249.png); }
.cb-news[data-amc="sangwon"] .cb-news__tape { background-image: url(https://upforme.ru/uploads/001c/d1/3d/2/867652.png); }

/* ---------- голубое окно с пупыркой и светлый лист ----------
   внутри — сетка: окошки и подписи растут под текст, остальное сдвигается, а не наезжает */
.cb-news__win {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto auto auto 1fr;   /* fluders, плеер, текст, анонс, players — последний прижат к низу */
  width: 605px;
  min-height: 488px;
  padding: 18px 11px 12px 198px;
  overflow: hidden;
  background: #becad4;
}
.cb-news__win::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -7px;
  width: 274px;
  background: var(--lp-bubbles) 0 0 / 274px 488px repeat-y;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}
.cb-news__win::after {
  content: "";
  position: absolute;
  top: 46px;
  bottom: 37px;
  left: 89px;
  right: 24px;
  background: #f1f1f0;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}
.cb-news__win > * { position: relative; z-index: 1; }

/* ---------- окошки fluders / players ---------- */
.cb-news__box {
  z-index: 3;
  width: max-content;
  min-width: 224px;
  max-width: 250px;
  overflow: hidden;
  background: #f1f1f0;
  border: 1px dashed rgba(0, 0, 0, .13);
}
.cb-news__box--fluders { justify-self: start; }
.cb-news__box--players { justify-self: end; align-self: end; margin: 14px 34px 0 0; }
.cb-news__bar {
  position: relative;
  height: 16px;
  padding: 1px 24px 0 7px;
  background: linear-gradient(90deg, #97afc2, #83a0b6);
  font: 590 10.5px/15px var(--font1);
  color: #f1f1f0;
}
.cb-news__bar i { position: absolute; top: 3px; right: 6px; width: 11px; height: 11px; background: var(--xbox) center / contain no-repeat; }
.cb-news__names {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px 14px;
  padding: 13px 14px 14px;
}
.cb-news__names > * {
  padding: 2px 10px;
  background: #efefed;
  border: 1px solid rgba(0, 0, 0, .07);
  font: 300 10px/normal var(--font1);
  text-transform: lowercase;
  white-space: nowrap;
  color: #525252 !important;
  text-decoration: none;
}
.cb-news__names a:hover { color: var(--link); }

/* ---------- плеер ---------- */
.cb-news__music {
  justify-self: start;
  margin-top: 22px;
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 351px;
  padding-left: 8px;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-right: 0;
  border-radius: 3px;
  font: 510 8px/1.2 var(--font1);
  text-transform: uppercase;
  color: #0e0000;
}
.cb-news__music i {
  flex: none;
  width: 19px;
  height: 19px;
  background: #1c0f0f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 19'%3E%3Cpath d='M13.6 9.8l-6.5 3.7V6z' fill='%23f6f5f4'/%3E%3C/svg%3E") center / 19px no-repeat;
  border-radius: 0 3px 3px 0;
}

/* ---------- текст новости ---------- */
.cb-news__text {
  margin-top: 11px;
  width: 351px;
  height: 171px;
  overflow-y: auto;
  padding: 12px 22px 12px 18px;
  background: #f6f5f4;
  border-radius: 2.73px;
  box-shadow: inset 0 1.6px 2.4px rgba(0, 0, 0, .07);
  font: 400 10px/1.45 var(--font1);
  color: #0e0000;
  overflow-wrap: anywhere;
}
.cb-news__text a { color: var(--link); }
.cb-news__text::-webkit-scrollbar { width: 3px; }
.cb-news__text::-webkit-scrollbar-track { margin: 12px 0; background: #d9d9d9; }
.cb-news__text::-webkit-scrollbar-thumb { background: #93abbf; }
.cb-news__text::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
@supports (-moz-appearance: none) {
  .cb-news__text { scrollbar-width: thin; scrollbar-color: #93abbf #d9d9d9; }
}

/* ---------- анонс под текстом ---------- */
.cb-news__more { margin-top: 11px; width: 318px; }
.cb-news__more p {
  display: -webkit-box;
  margin: 0 !important;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font: 300 9px/1.35 var(--font1);
  text-transform: lowercase;
  color: #0e0000;
}
.cb-news__more a { display: block; margin-top: 3px; padding-right: 62px; font: 400 9px/1.3 var(--font1); text-align: right; color: #0e0000; }
.cb-news__more a:hover { color: var(--link); }

/* ---------- пиксельные подписи: episode / couple ---------- */
.cb-news__episode,
.cb-news__couple {
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 3px;
  max-width: 130px;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 600 10px/1.15 var(--font2);
  text-transform: uppercase;
  color: #414c8b;
  overflow-wrap: anywhere;
}
.cb-news__episode b, .cb-news__couple b { font-weight: 600; font-size: 12px; }
.cb-news__episode a, .cb-news__couple a { color: inherit; text-decoration: none; }
.cb-news__episode a:hover, .cb-news__couple a:hover { color: var(--link); }
.cb-news .cb-news__episode {
    position: absolute;
    top: 60px;
    right: 45px;
    max-width: 118px;
    transform: rotate(-8deg);
}
.cb-news .cb-news__couple { position: absolute; left: 199px; bottom: 58px; max-width: 120px; transform: rotate(8deg); }

/* ---------- наклейки ---------- */
.cb-news .cb-news__st { position: absolute; z-index: 4; background-position: center; background-size: contain; background-repeat: no-repeat; pointer-events: none; }
.cb-news__st--smile { bottom: 94px; left: 484px; width: 62px; height: 55px; background-image: var(--lp-sticker); transform: rotate(18deg); }
.cb-news__st--cherry { top: 245px; left: 147px; width: 48px; height: 43px; background-image: var(--news-cherry, none); transform: rotate(-16.6deg); }
.cb-news__st--star { top: 109px; left: 528px; width: 31px; height: 39px; background-image: var(--news-star, none); transform: rotate(-16.6deg); }

/* =========================================================
   WELCOME PACK — html-блок в посте с [hideprofile] (шаблон в html_велкам.txt), скрипт welcome.js
   три набора на карточке смотрящего; гостю — карточка-заглушка
   ========================================================= */

.cb-wp {
  position: relative;
  width: 823px;
  max-width: 100%;
  margin: 0 auto;
  padding: 18px 26px;
  overflow: hidden;
  background: #becad4;
  font: 400 10px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-wp * { box-sizing: border-box; }
.cb-wp::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -64px;
  width: 353px;
  background: var(--lp-bubbles) 0 0 / 353px 628px repeat-y;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}
.cb-wp__set, .cb-wp__claimed { display: none; }

.cb-wp__view {
  position: relative;
  z-index: 1;
  padding: 19px 25px 26px;
  background: #f6f5f4;
  box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .1);
}

/* заголовок — как DAILY CHECK IN */
.cb-wp__title {
  display: inline-flex;
  align-items: stretch;
  padding-left: 11px;
  border: 1.4px dashed rgba(14, 0, 0, .22);
  border-right: 0;
  border-radius: 4px;
  font: 510 11px/26px var(--font1);
  letter-spacing: .02em;
}
.cb-wp__title b {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  margin-left: 11px;
  background: #1c0f0f;
  border-radius: 0 4px 4px 0;
}
.cb-wp__title svg { width: 13px; height: 13px; fill: #f6f5f4; }

.cb-wp__intro { margin-top: 12px; font: 400 9.5px/1.5 var(--font1); }
.cb-wp__intro p { margin: 0 0 8px !important; }
.cb-wp__intro ul { margin: 0; padding-left: 14px; }
.cb-wp__intro li { margin: 0 0 3px; }
.cb-wp__line {
  display: block;
  height: 1px;
  margin: 14px 0 17px;
  background: repeating-linear-gradient(90deg, rgba(0, 0, 0, .12) 0 2px, transparent 2px 4px);
}

/* ---------- три набора ---------- */
.cb-wp__board {
  padding: 14px 18px 14px;
  background: #f1f1f0;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
}
.cb-wp__grid { display: grid; grid-template-columns: repeat(3, 223px); justify-content: space-between; gap: 18px 9px; }
.cb-wp__col { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.cb-wp__name {
  padding: 4px 10px;
  background: #f6f5f4;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  font: 400 9px/normal var(--font1);
  white-space: nowrap;
  transition: background .2s;
}
.cb-wp__col.is-pick .cb-wp__name { background: #becad4; }
.cb-wp__card { width: 223px; }

/* карточка «как в постах» — стили берет из форума */
.punbb .cb-wp .cb-wp__post {
  position: relative;
  display: block;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}
.punbb .cb-wp .cb-wp__post .post-author { margin: 0; }
.hideprofile .cb-wp .cb-wp__post .post-author,
.punbb .post.hideprofile .cb-wp .cb-wp__post .post-author { display: block !important; }
.cb-wp .cb-lpa-btn { display: none !important; }   /* «+ лс» админов в превью не нужна */

/* аватар-заглушка для гостей: картинку можно задать переменной --wp-avatar */
.cb-wp .cb-wp__stub-ava img { background: var(--wp-avatar, #e6d7da) center / cover no-repeat; }

.cb-wp__acts { display: flex; gap: 6px; }
.cb-wp .cb-wp__btn,
.cb-wp .cb-wp__edit {
  margin: 0;
  padding: 4px 12px;
  background: #becad4;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .2s;
}
.cb-wp .cb-wp__btn:hover { background: #a9bccb; }
.cb-wp .cb-wp__btn:disabled { opacity: .45; cursor: not-allowed; background: #becad4; }
.cb-wp .cb-wp__btn.is-main { background: #e6d7da; }
.cb-wp .cb-wp__btn.is-main:hover { background: #e59eb4; }
.cb-wp .cb-wp__edit { background: transparent; }
.cb-wp .cb-wp__edit:hover { background: #e9edf0; }

.cb-wp__state { margin: 12px 0 0 !important; font: 300 9.5px/1.4 var(--font1); text-align: center; color: #646464; }
.cb-wp__state:empty { display: none; }

/* ---------- окошко «забрать» / правка у амс ---------- */
.cb-wp__form:empty { display: none; }
.cb-wp__claim {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px 12px;
  margin-top: 16px;
  padding: 12px 14px;
  background: #f6f5f4;
  border: 1px dashed rgba(14, 0, 0, .22);
}
.cb-wp__claim > p { flex-basis: 100%; margin: 0 !important; font: 400 10px/1.45 var(--font1); }
.cb-wp__claim b { font-weight: 590; }
.cb-wp__claim label { display: flex; flex-direction: column; gap: 3px; flex: 1 1 180px; font: 400 9px/1.3 var(--font1); color: #646464; }
.cb-wp__claim input {
  height: 26px;
  margin: 0;
  padding: 0 9px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 10px/1 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-wp__claim input:focus { border-style: solid; border-color: #becad4; }
.cb-wp__claim-btns { display: flex; gap: 8px; }
.cb-wp__note { flex-basis: 100%; margin: 0 !important; font: 400 9.5px/1.4 var(--font1); color: #646464; }
.cb-wp__note:empty { display: none; }
.cb-wp__note.is-bad { color: var(--link); }

/* ---------- пост «welcome pack — набор N» ---------- */
.cb-wp-post {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  max-width: 470px;
  padding: 10px 12px;
  background: #f6f5f4;
  border: 1px dashed rgba(14, 0, 0, .22);
  font: 400 10px/1.4 var(--font1);
}
.cb-wp-post > b { font-weight: 590; text-transform: uppercase; letter-spacing: .02em; }
.cb-wp-post > span { color: #646464; }
.cb-wp-post__h, .cb-wp-post__p { position: relative; display: block; width: 112px; height: 24px; overflow: hidden; }
.cb-wp-post__h img, .cb-wp-post__p img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.cb-wp-post__p em { position: absolute; top: 3px; left: 14px; padding: 0 4px; background: #f6f5f4; font: 300 8px/1.4 var(--font1); font-style: normal; }
.cb-wp-post > .cb-wp-post__state { margin-left: auto; padding: 2px 8px; background: #f4e5e7; border-radius: 39px; font-size: 8.5px; color: var(--link); }
.cb-wp-post > .cb-wp-post__state:empty { display: none; }
.cb-wp-post > .cb-wp-post__state.is-ok { background: #e9edf0; color: #3d5a72; }
.cb-wp-post > .cb-wp-post__state.is-dup { background: #fbefd2; color: #8a6a12; }
.cb-wp-post__adm:empty { display: none; }
.cb-wp-post__adm button {
  margin: 0 8px 0 0;
  padding: 3px 12px;
  background: #e6d7da;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9px/normal var(--font1);
  color: #0e0000;
  cursor: pointer;
}
.cb-wp-post__adm button:hover { background: #e59eb4; }
.cb-wp-post__adm small { font-size: 9px; color: #646464; }

/* ---------- узкий экран ---------- */
@media (max-width: 760px) {
  .cb-wp { padding: 10px; }
  .cb-wp__view { padding: 16px 12px 18px; }
  .cb-wp__grid { grid-template-columns: 223px; justify-content: center; }
}

/* галочка «и сразу надеть в профиль» */
.cb-wp__claim label.cb-wp__wear { flex: 0 1 auto; flex-direction: row; align-items: center; gap: 6px; font-size: 9.5px; color: #0e0000; }
.cb-wp__claim label.cb-wp__wear input { height: auto; margin: 0; accent-color: #e59eb4; }

/* =========================================================
   ПРОСТЫЕ ЗАПИСИ
   ========================================================= */

.ams-note {
  position: relative;
  width: 602px;
  max-width: 100%;
  margin: 0 auto;
  overflow: hidden;
  background: #f6f5f4;
  border: 1px dashed rgba(14, 0, 0, .18);
  font: 300 10px/1.45 var(--font1);
  text-align: left;
  color: #1e0f11;
}
.ams-note * { box-sizing: border-box; }

/* шапка 602 &#215; 68; на узком посте режется слева, куклы справа остаются на месте */
.ams-note__head {
  position: relative;
  height: 68px;
  background: #becad4 url(https://upforme.ru/uploads/001c/d1/3d/2/816088.png) right top / 602px 68px no-repeat;
}

/* заголовок — розовое окошко с крестиком, как «список внешностей» */
.ams-note__title {
  position: absolute;
  top: 24px;
  left: 27px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  max-width: calc(100% - 200px);
  padding: 4px 8px 4px 10px;
  background: #e59eb4;
  border: 1px solid #241915;
  font: 400 12px/normal var(--font1);
  color: #0e0000;
}
.ams-note__title i { flex: none; width: 15px; height: 15px; background: var(--xbox) center / contain no-repeat; }

.ams-note__text { padding: 26px 27px 30px; overflow-wrap: anywhere; }
.ams-note__text p { margin: 0 0 8px !important; }
.ams-note__text p:last-child { margin-bottom: 0 !important; }
.ams-note__text a { color: var(--link); text-decoration: none; border-bottom: 1px dashed rgba(164, 14, 65, .4); }
.ams-note__text a:hover { border-bottom-style: solid; }
.ams-note__text b, .cb-note__text strong { font-weight: 590; }

#pun-index #forum_f14 {
display: none !important;
}

/* =========================================================
   ОКОШКИ «ПОДНЯТЬ РЕПУТАЦИЮ» И «ПОЖАЛОВАТЬСЯ» — в стиле окна «+ лс»
   голубая полоска-заголовок вместо огромной надписи, светлое тело, кнопки-пилюли
   ========================================================= */

/* затемнение позади */
#pun-reputation .bg,
#pun-report .bg {
  background: rgba(30, 15, 17, .32) !important;
  opacity: 1 !important;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

/* само окно: маленькое, по центру экрана */
#pun-reputation .inner,
#pun-report .inner {
  left: 50% !important;
  top: 50% !important;
  width: 400px !important;
  max-width: calc(100vw - 32px);
  margin: 0 !important;
  transform: translate(-50%, -50%);
  overflow: hidden;
  background: #f6f5f4 !important;
  border: 0 !important;
  border-radius: 3px;
  box-shadow: 0 14px 40px rgba(30, 15, 17, .25) !important;
  font: 400 10.5px/1.45 var(--font1);
  text-align: left;
  color: #0e0000;
}

/* огромная надпись &#8594; тонкая голубая полоска окна */
#pun-reputation .inner h1,
#pun-report .inner h1 {
  margin: 0 !important;
  padding: 7px 14px !important;
  background: #becad4 !important;
  border: 0 !important;
  font: 400 10.5px/1.3 var(--font1) !important;
  text-align: left !important;
  text-transform: lowercase;
  letter-spacing: 0 !important;
  color: #0e0000 !important;
}
#pun-reputation .inner h1 *,
#pun-report .inner h1 * { font: inherit !important; color: inherit !important; }

#pun-reputation .container,
#pun-report .container { padding: 16px 16px 14px !important; background: none !important; }

/* таблицы и строки формы — в одну колонку */
#pun-reputation .container table, #pun-reputation .container tbody, #pun-reputation .container tr,
#pun-reputation .container td, #pun-reputation .container th,
#pun-report .container table, #pun-report .container tbody, #pun-report .container tr,
#pun-report .container td, #pun-report .container th {
  display: block;
  width: auto !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  text-align: left !important;
}
#pun-reputation .container fieldset,
#pun-report .container fieldset { margin: 0; padding: 0; border: 0; }

/* подписи «Пользователь», «Сообщение (причина…)» — мелко и серым */
#pun-reputation .container strong, #pun-reputation .container b, #pun-reputation .container label,
#pun-report .container strong, #pun-report .container b, #pun-report .container label {
  font: 400 9px/1.4 var(--font1) !important;
  text-transform: lowercase;
  color: #646464 !important;
}

/* поле сообщения */
#pun-reputation textarea,
#pun-report textarea {
  display: block;
  width: 100% !important;
  height: 90px;
  margin: 6px 0 12px !important;
  padding: 8px 10px !important;
  box-sizing: border-box;
  resize: vertical;
  background: #fff !important;
  border: 1px dashed rgba(14, 0, 0, .22) !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  font: 400 10.5px/1.45 var(--font1) !important;
  color: #0e0000 !important;
  outline: none;
}
#pun-reputation textarea:focus,
#pun-report textarea:focus { border-style: solid !important; border-color: #becad4 !important; }

/* кнопки «изменить» / «отменить» — пилюли; слово «или» между ними прячем */
#pun-reputation .container *:has(> input[type="submit"]),
#pun-report .container *:has(> input[type="submit"]) { display: flex; align-items: center; justify-content: flex-end; gap: 8px; font-size: 0 !important; }
#pun-reputation input[type="submit"], #pun-reputation input[type="button"], #pun-reputation button,
#pun-report input[type="submit"], #pun-report input[type="button"], #pun-report button {
  height: auto !important;
  margin: 0 !important;
  padding: 5px 14px !important;
  background: transparent !important;
  border: 1px solid rgba(36, 25, 21, .48) !important;
  border-radius: 39px !important;
  box-shadow: none !important;
  font: 400 9.5px/normal var(--font1) !important;
  text-transform: lowercase;
  color: #0e0000 !important;
  cursor: pointer;
  transition: background .2s;
}
#pun-reputation input[type="submit"], #pun-report input[type="submit"] { background: #e6d7da !important; }
#pun-reputation input[type="submit"]:hover, #pun-report input[type="submit"]:hover { background: #e59eb4 !important; }
#pun-reputation input[type="button"]:hover, #pun-reputation button:hover,
#pun-report input[type="button"]:hover, #pun-report button:hover { background: #e9edf0 !important; }
#pun-reputation .container a,
#pun-report .container a { color: var(--link); }

html:not(.cb-money-admin) .inputfield:has([name="form[fld6]"]),
html:not(.cb-money-admin) p:has(> * > [name="form[fld6]"]),
html:not(.cb-money-admin) p:has(> [name="form[fld6]"]),
html:not(.cb-money-admin) label[for="fld6"],
html:not(.cb-money-admin) [name="form[fld6]"] { display: none !important; }

/* маленькое меню по правому клику на ссылке (скрипт noinspect.js) */
.cb-ctx {
  position: fixed;
  z-index: 100010;
  display: none;
  padding: 4px;
  background: #f6f5f4;
  border: 1px solid rgba(36, 25, 21, .2);
  border-radius: 3px;
  box-shadow: 0 6px 18px rgba(30, 15, 17, .18);
}
.cb-ctx button {
  display: block;
  margin: 0;
  padding: 6px 12px;
  background: none;
  border: 0;
  border-radius: 2px;
  box-shadow: none;
  font: 400 10.5px/1.2 var(--font1);
  text-transform: none;
  white-space: nowrap;
  color: #0e0000;
  cursor: pointer;
}
.cb-ctx button:hover { background: #e9edf0; }

/* =========================================================
   КЭТГРАМ
   ========================================================= */

.cb-ig {
  --ig-w: 290px;
  --ig-h: 520px;
  --ig-accent: #e59eb4;
  --ig-accent-2: #93abbf;
  --ig-screen: linear-gradient(170deg, #f7f4f5 0%, #eef1f4 55%, #f6eef1 100%);
  --ig-ink: #1e0f11;
  --ig-muted: #8a8a8a;
  --ig-card: rgba(255, 255, 255, .72);
  --ig-line: rgba(255, 255, 255, .9);
  --ig-soft: rgba(30, 15, 17, .06);
  --ig-nav: #1e0f11;
  --ig-nav-ink: #f6f5f4;

  display: flex;
  flex-direction: column;
  width: var(--ig-w);
  max-width: 100%;
  height: var(--ig-h);
  margin: 10px auto;
  padding: 5px;
  box-sizing: border-box;
  background: #e6dfe1;
  border: 1px solid rgba(36, 25, 21, .18);
  border-radius: 30px;
  box-shadow: 0 10px 30px rgba(30, 15, 17, .12);
  font: 400 11px/1.35 var(--font1);
  color: var(--ig-ink);
  text-align: left;
}
.cb-ig--dark {
  --ig-screen: linear-gradient(170deg, #1b1a1d 0%, #121214 60%, #1d1619 100%);
  --ig-ink: #f3eff0;
  --ig-muted: #9b9599;
  --ig-card: rgba(40, 38, 42, .62);
  --ig-line: rgba(255, 255, 255, .1);
  --ig-soft: rgba(0, 0, 0, .3);
  --ig-nav: rgba(246, 245, 244, .92);
  --ig-nav-ink: #1e0f11;
  background: #2a2729;
  border-color: rgba(0, 0, 0, .4);
}
.cb-ig *, .cb-ig *::before, .cb-ig *::after { box-sizing: border-box; margin: 0; }
.cb-ig img { display: block; max-width: none; }
.cb-ig a { color: inherit; text-decoration: none; }

.cb-ig__screen {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  background: var(--ig-screen);
  border-radius: 25px;
  color: var(--ig-ink);
}

/* стекло */
.cb-ig__glass,
.cb-ig__who,
.cb-ig__stats,
.cb-ig__card,
.cb-ig__reply span,
.cb-ig__top > span {
  background: var(--ig-card);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
          backdrop-filter: blur(14px) saturate(1.4);
  border: 1px solid var(--ig-line);
  box-shadow: 0 4px 14px var(--ig-soft);
}

/* статус-бар */
.cb-ig__status {
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  padding: 9px 20px 0 24px;
  font-size: 11px;
  font-weight: 600;
}
.cb-ig__status::after { content: "\f012\2002\f1eb\2002\f240"; font: 400 10px/1 var(--fa); }
.cb-ig--story .cb-ig__status { color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .3); }

/* ---------- ПРОФИЛЬ ---------- */
.cb-ig__scroll {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  padding: 30px 10px 70px;
  scrollbar-width: none;
}
.cb-ig__scroll::-webkit-scrollbar { display: none; }

.cb-ig__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.cb-ig__top > span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 0 11px;
  border-radius: 13px;
  font-size: 11px;
  font-weight: 600;
}
.cb-ig__top > span.cb-ig__menu { width: 26px; padding: 0; justify-content: center; }
.cb-ig__top > span.cb-ig__menu::before { content: "\f142"; font: 400 11px/1 var(--fa); }
.cb-ig__tick { display: inline-block; width: 11px; height: 11px; border-radius: 50%; background: var(--ig-accent-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3.3 6.2l1.8 1.8 3.6-3.8' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat; }

.cb-ig__cover {
  height: 92px;
  border-radius: 18px;
  background: var(--ig-accent-2) center / cover no-repeat;
}
.cb-ig__ava {
  position: relative;
  width: 70px;
  height: 70px;
  margin: -36px auto 0;
  padding: 3px;
  border-radius: 50%;
  background: conic-gradient(from 200deg, var(--ig-accent), var(--ig-accent-2), var(--ig-accent));
}
.cb-ig__ava img { width: 100%; height: 100%; border: 2px solid var(--ig-card); border-radius: 50%; object-fit: cover; background: var(--ig-card); }
.cb-ig__name { margin-top: 6px; font-size: 13px; font-weight: 600; text-align: center; }
.cb-ig__bio { margin-top: 3px; padding: 0 12px; font-size: 10px; line-height: 1.4; text-align: center; color: var(--ig-muted); overflow-wrap: anywhere; }
.cb-ig__link { display: block; margin-top: 3px; font-size: 10px; text-align: center; color: var(--ig-accent) !important; }
.cb-ig__link::before { content: "\f0c1\2002"; font: 400 8px/1 var(--fa); }

.cb-ig__stats {
  display: flex;
  justify-content: space-around;
  margin: 10px 4px 0;
  padding: 7px 4px;
  border-radius: 16px;
  text-align: center;
}
.cb-ig__stats span { display: flex; flex-direction: column; gap: 1px; font-size: 8.5px; color: var(--ig-muted); }
.cb-ig__stats b { font-size: 12.5px; font-weight: 600; color: var(--ig-ink); }

.cb-ig__btns { display: flex; gap: 6px; margin: 9px 4px 0; }
.cb-ig__btns span {
  flex: 1;
  height: 26px;
  border-radius: 13px;
  background: var(--ig-card);
  border: 1px solid var(--ig-line);
  font: 500 10px/24px var(--font1);
  text-align: center;
}
.cb-ig__btns span.is-main { background: var(--ig-ink); border-color: var(--ig-ink); color: var(--ig-card); }
.cb-ig--dark .cb-ig__btns span.is-main { background: var(--ig-accent); border-color: var(--ig-accent); color: #1e0f11; }

.cb-ig__hl { display: flex; justify-content: center; gap: 10px; margin: 12px 0 2px; }
.cb-ig__hl span { display: flex; flex-direction: column; align-items: center; gap: 3px; width: 48px; font-size: 8px; color: var(--ig-muted); text-align: center; }
.cb-ig__hl img { width: 42px; height: 42px; padding: 2px; border: 1px solid var(--ig-line); border-radius: 50%; background: var(--ig-card); object-fit: cover; }
.cb-ig__hl i { font-style: normal; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.cb-ig__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-top: 12px; }
.cb-ig__grid > * { display: block; aspect-ratio: 1; overflow: hidden; border-radius: 9px; background: var(--ig-card); }
.cb-ig__grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.cb-ig__grid a:hover img { transform: scale(1.05); }
.cb-ig__grid:empty::before { content: "\43f\43e\441\442\43e\432  \43f\43e\43a\430  \43d\435\442"; grid-column: 1 / -1; padding: 18px 0; font-size: 9.5px; text-align: center; color: var(--ig-muted); }

/* нижняя навигация — плавающая капсула */
.cb-ig__nav {
  position: absolute;
  z-index: 5;
  left: 50%;
  bottom: 12px;
  display: flex;
  align-items: center;
  gap: 16px;
  height: 36px;
  padding: 0 16px;
  transform: translateX(-50%);
  border-radius: 18px;
  background: var(--ig-nav);
  color: var(--ig-nav-ink);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .18);
}
.cb-ig__nav::before { content: "\f015\2003\2002\f002\2003\2002\f067\2003\2002\f004\2003\2002\f007"; font: 400 11px/1 var(--fa); white-space: pre; }

/* ---------- ПОСТ ---------- */
.cb-ig__media { position: absolute; inset: 0; }   /* фото на весь экран, карточка с текстом парит снизу */
.cb-ig__slides {
  display: flex;
  height: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.cb-ig__slides::-webkit-scrollbar { display: none; }
.cb-ig__slides img { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; scroll-snap-align: center; }
.cb-ig__dots {
  position: absolute;
  z-index: 4;
  top: 72px;
  left: 50%;
  display: flex;
  gap: 4px;
  transform: translateX(-50%);
}
.cb-ig__dots i { width: 5px; height: 5px; border-radius: 50%; background: rgba(255, 255, 255, .55); }
.cb-ig__dots i:first-child { width: 12px; border-radius: 3px; background: #fff; }

.cb-ig__who {
  position: absolute;
  z-index: 4;
  top: 30px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: calc(100% - 20px);
  padding: 4px 12px 4px 4px;
  border-radius: 20px;
  font-size: 10.5px;
  font-weight: 600;
}
.cb-ig__who img { flex: none; width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.cb-ig__who span { display: flex; flex-direction: column; min-width: 0; }
.cb-ig__who small { overflow: hidden; font-size: 8.5px; font-weight: 400; white-space: nowrap; text-overflow: ellipsis; color: var(--ig-muted); }

.cb-ig__card {
  position: absolute;
  z-index: 3;
  left: 6px;
  right: 6px;
  bottom: 6px;
  max-height: 56%;
  padding: 10px 12px 12px;
  overflow-y: auto;
  border-radius: 20px;
  scrollbar-width: none;
}
.cb-ig__card::-webkit-scrollbar { display: none; }
.cb-ig__acts { display: flex; align-items: center; gap: 12px; margin-bottom: 7px; font-size: 10px; font-weight: 500; }
.cb-ig__acts > span::before,
.cb-ig__like summary::before { font: 400 13px/1 var(--fa); margin-right: 4px; vertical-align: -1px; }
.cb-ig__cm::before { content: "\f075"; }
.cb-ig__share::before { content: "\f1d8"; }
.cb-ig__save { margin-left: auto; }
.cb-ig__save::before { content: "\f02e"; margin-right: 0 !important; }

/* лайк: клик — сердце заливается и счетчик +1 */
.cb-ig__like summary { display: inline-flex; align-items: center; list-style: none; cursor: pointer; outline: none; }
.cb-ig__like summary::-webkit-details-marker { display: none; }
.cb-ig__like summary::before { content: "\f004"; transition: transform .2s, color .2s; }
.cb-ig__like[open] summary::before { color: var(--ig-accent); font-weight: 900; transform: scale(1.15); }
.cb-ig__like summary span + span,
.cb-ig__like[open] summary span:first-child { display: none; }
.cb-ig__like[open] summary span + span { display: inline; }

.cb-ig__cap { font-size: 10.5px; line-height: 1.45; overflow-wrap: anywhere; }
.cb-ig__cap b, .cb-ig__comments b { font-weight: 600; margin-right: 4px; }
.cb-ig__comments { margin-top: 6px; font-size: 10px; line-height: 1.4; }
.cb-ig__comments p { margin-top: 3px; overflow-wrap: anywhere; }
.cb-ig__comments summary { list-style: none; cursor: pointer; margin-top: 4px; font-size: 9.5px; color: var(--ig-muted); outline: none; }
.cb-ig__comments summary::-webkit-details-marker { display: none; }
.cb-ig__comments details[open] summary { display: none; }
.cb-ig__date { margin-top: 6px; font-size: 8.5px; text-transform: lowercase; color: var(--ig-muted); }

/* ---------- СТОРИС ---------- */
.cb-ig--story .cb-ig__screen { background: #222 center / cover no-repeat; }
.cb-ig--story .cb-ig__screen::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0, 0, 0, .3), transparent 22%, transparent 70%, rgba(0, 0, 0, .35));
  pointer-events: none;
}
.cb-ig__bars { position: absolute; z-index: 5; top: 26px; left: 12px; right: 12px; display: flex; gap: 3px; }
.cb-ig__bars i { flex: 1; height: 2px; overflow: hidden; border-radius: 2px; background: rgba(255, 255, 255, .4); }
.cb-ig__bars i::before { content: ""; display: block; height: 100%; width: 0; background: #fff; animation: cb-ig-story var(--dur, 6s) linear forwards; }
@keyframes cb-ig-story { to { width: 100%; } }
.cb-ig__who.is-story { top: 36px; background: transparent; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .35); }
.cb-ig__who.is-story small { color: rgba(255, 255, 255, .8); }

.cb-ig__sticker {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 50%;
  max-width: 78%;
  padding: 7px 12px;
  transform: translate(-50%, -50%) rotate(-3deg);
  border-radius: 8px;
  background: #fff;
  color: #1e0f11;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  overflow-wrap: anywhere;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .2);
}
.cb-ig__sticker.is-accent { background: var(--ig-accent); color: #fff; }
.cb-ig__sticker.is-clear { background: none; box-shadow: none; color: #fff; font-size: 15px; text-shadow: 0 1px 6px rgba(0, 0, 0, .45); }
.cb-ig__music {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: calc(50% + 38px);
  max-width: 78%;
  padding: 4px 10px;
  transform: translateX(-50%);
  overflow: hidden;
  border-radius: 12px;
  background: rgba(255, 255, 255, .85);
  color: #1e0f11;
  font-size: 9px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.cb-ig__music::before { content: "\f001\2002"; font: 400 8px/1 var(--fa); }
.cb-ig__reply { position: absolute; z-index: 5; left: 10px; right: 10px; bottom: 12px; display: flex; align-items: center; gap: 8px; color: #fff; }
.cb-ig__reply span {
  flex: 1;
  height: 32px;
  padding: 0 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .14);
  border-color: rgba(255, 255, 255, .35);
  font-size: 10px;
  line-height: 30px;
  color: rgba(255, 255, 255, .9);
}
.cb-ig__reply::after { content: "\f004\2003\f1d8"; font: 400 14px/1 var(--fa); text-shadow: 0 1px 3px rgba(0, 0, 0, .3); }

/* =========================================================
   ГЕНЕРАТОР (.cb-igen) — в стиле окон форума
   ========================================================= */
.cb-igen {
  position: relative;
  max-width: 823px;
  margin: 0 auto;
  padding: 18px;
  overflow: hidden;
  background: #becad4;
  font: 400 11px/1.4 var(--font1);
  text-align: left;
  color: #0e0000;
}
.cb-igen * { box-sizing: border-box; }
.cb-igen::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -64px;
  width: 353px;
  background: var(--lp-bubbles) 0 0 / 353px 628px repeat-y;
  mix-blend-mode: lighten;
  opacity: .76;
  pointer-events: none;
}
.cb-igen__in { position: relative; z-index: 1; display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 18px; align-items: start; }
.cb-igen__phone { position: sticky; top: 10px; }
.cb-igen__phone .cb-ig { margin: 0; }
.cb-igen__panel { padding: 16px 16px 18px; background: #f6f5f4; box-shadow: 1px 1px 1px rgba(0, 0, 0, .1); }

.cb-igen__row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 10px; }
.cb-igen__row > b { width: 100%; font: 400 9px/1.3 var(--font1); color: #646464; }
.cb-igen .cb-igen__chip {
  margin: 0;
  padding: 4px 11px;
  background: transparent;
  border: 1px solid rgba(36, 25, 21, .48);
  border-radius: 39px;
  box-shadow: none;
  font: 400 9.5px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
}
.cb-igen .cb-igen__chip:hover { background: #e9edf0; }
.cb-igen .cb-igen__chip.is-on { background: #becad4; }

.cb-igen__sec { position: relative; margin-top: 16px; padding-top: 14px; }
.cb-igen__sec[hidden] { display: none; }
.cb-igen__label {
  position: absolute;
  top: 0;
  left: 9px;
  z-index: 2;
  padding: 4px 10px;
  background: #e6d7da;
  filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1));
  font: 400 10px/normal var(--font1);
}
.cb-igen__box { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; padding: 22px 12px 12px; background: #f1f1f0; filter: drop-shadow(1px 1px .5px rgba(0, 0, 0, .1)); }
.cb-igen__box label { display: flex; flex-direction: column; gap: 3px; font: 400 9px/1.3 var(--font1); color: #646464; }
.cb-igen__box label.is-wide { grid-column: 1 / -1; }
.cb-igen__box label.is-check { flex-direction: row; align-items: center; gap: 6px; color: #0e0000; }
.cb-igen input[type="text"],
.cb-igen textarea {
  width: 100%;
  height: 26px;
  margin: 0;
  padding: 0 9px;
  background: #fff;
  border: 1px dashed rgba(14, 0, 0, .22);
  border-radius: 3px;
  box-shadow: none;
  font: 400 10px/1.3 var(--font1);
  color: #0e0000;
  outline: none;
}
.cb-igen textarea { height: 54px; padding: 6px 9px; resize: vertical; }
.cb-igen input[type="text"]:focus, .cb-igen textarea:focus { border-style: solid; border-color: #becad4; }
.cb-igen input[type="checkbox"] { margin: 0; accent-color: #e59eb4; }
.cb-igen input[type="color"] {
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(36, 25, 21, .3);
  border-radius: 50%;
  background: none;
  cursor: pointer;
  -webkit-appearance: none;
          appearance: none;
}
/* цвет заполняет кружок целиком, без квадрата внутри */
.cb-igen input[type="color"]::-webkit-color-swatch-wrapper { padding: 0; }
.cb-igen input[type="color"]::-webkit-color-swatch { border: 0; border-radius: 50%; }
.cb-igen input[type="color"]::-moz-color-swatch { border: 0; border-radius: 50%; }

/* шапка генератора: розовое окошко-заголовок и пояснение */
.cb-igen__head { position: relative; z-index: 1; margin-bottom: 16px; padding: 16px 18px; background: #f6f5f4; box-shadow: 1px 1px 1px rgba(0, 0, 0, .1); }
.cb-igen__title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 4px 8px 4px 10px;
  background: #e59eb4;
  border: 1px solid #241915;
  font: 400 12px/normal var(--font1);
}
.cb-igen__title i { width: 15px; height: 15px; background: var(--xbox) center / contain no-repeat; }
.cb-igen__head p { margin: 12px 0 0 !important; font: 300 10.5px/1.5 var(--font1); color: #1e0f11; }

.cb-igen__list { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; }
.cb-igen__item { display: grid; grid-template-columns: 110px minmax(0, 1fr) 14px; gap: 6px; align-items: center; }
.cb-igen .cb-igen__x { width: 13px; height: 13px; margin: 0; padding: 0; background: var(--xbox) center / contain no-repeat; border: 0; box-shadow: none; opacity: .7; cursor: pointer; }
.cb-igen .cb-igen__add { grid-column: 1 / -1; justify-self: start; }

.cb-igen__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 16px; }
.cb-igen .cb-igen__go {
  margin: 0;
  padding: 6px 18px;
  background: #e6d7da;
  border: 1px solid #0e0000;
  border-radius: 0;
  box-shadow: none;
  font: 400 11px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s, box-shadow .15s, transform .15s;
}
.cb-igen .cb-igen__go:hover { background: #e59eb4; box-shadow: 3px 3px 0 rgba(0, 0, 0, .25); transform: translate(-1px, -1px); }
.cb-igen .cb-igen__go:disabled { opacity: .5; cursor: wait; transform: none; box-shadow: none; }
.cb-igen__note { font: 400 9.5px/1.4 var(--font1); color: #3d3d3d; }

/* окно «новый пост» в теме аккаунта */
.cb-igen-modal {
  position: fixed;
  z-index: 100008;
  inset: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 30px 16px;
  overflow-y: auto;
  background: rgba(30, 15, 17, .35);
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
}
.cb-igen-modal .cb-igen { width: 823px; max-width: 100%; }
.cb-igen-modal__x {
  position: absolute;
  z-index: 3;
  top: 8px;
  right: 8px;
  width: 15px;
  height: 15px;
  padding: 0;
  margin: 0;
  background: var(--xbox) center / contain no-repeat;
  border: 0;
  box-shadow: none;
  cursor: pointer;
}
.cb-ig-newpost {
  display: inline-block;
  margin: 10px 0;
  padding: 6px 16px;
  background: #e6d7da;
  border: 1px solid #0e0000;
  border-radius: 0;
  box-shadow: none;
  font: 400 11px/normal var(--font1);
  text-transform: none;
  color: #0e0000;
  cursor: pointer;
  transition: background .15s, box-shadow .15s, transform .15s;
}
.cb-ig-newpost:hover { background: #e59eb4; box-shadow: 3px 3px 0 rgba(0, 0, 0, .25); transform: translate(-1px, -1px); }

@media (max-width: 680px) {
  .cb-igen__in { grid-template-columns: 1fr; justify-items: center; }
  .cb-igen__phone { position: static; }
  .cb-igen__panel { width: 100%; }
  .cb-igen__box { grid-template-columns: 1fr; }
}

/* пустые места, пока не вставлена картинка */
.cb-ig__empty { flex: 0 0 100%; width: 100%; height: 100%; background: linear-gradient(160deg, var(--ig-accent-2), var(--ig-accent)); opacity: .45; }
.cb-ig img[src^="data:image/gif"] { background: linear-gradient(160deg, var(--ig-accent-2), var(--ig-accent)); }
.cb-igen-modal .cb-igen__head p { display: none; }

/* ник + галочка в капсуле поста и сторис */
.cb-ig__who em { display: inline-flex; align-items: center; gap: 3px; font-style: normal; }
.cb-ig__who .cb-ig__tick { width: 10px; height: 10px; background-size: 10px; }

/* листание фото в посте */
.cb-ig .cb-ig__arrow {
  position: absolute;
  z-index: 4;
  top: 42%;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .7);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
  color: #1e0f11;
  cursor: pointer;
  opacity: 0;
  transition: opacity .2s;
}
.cb-ig .cb-ig__arrow[hidden] { display: none; }
.cb-ig__media:hover .cb-ig__arrow { opacity: 1; }
.cb-ig .cb-ig__arrow.is-prev { left: 8px; }
.cb-ig .cb-ig__arrow.is-next { right: 8px; }
.cb-ig .cb-ig__arrow::before { font: 400 10px/26px var(--fa); }
.cb-ig .cb-ig__arrow.is-prev::before { content: "\f053"; }
.cb-ig .cb-ig__arrow.is-next::before { content: "\f054"; }
.cb-ig__media.is-live .cb-ig__dots i { cursor: pointer; transition: width .2s, background .2s; }
.cb-ig__media.is-live .cb-ig__dots i:first-child { width: 5px; border-radius: 50%; background: rgba(255, 255, 255, .55); }
.cb-ig__media.is-live .cb-ig__dots i.is-on { width: 12px; border-radius: 3px; background: #fff; }

/* кнопка «новый пост» под последним сообщением темы */
.cb-ig-newpost-wrap { margin: 12px 0; text-align: center; }