@import url(style_cs.1788728497.css);
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/v4-font-face.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/fontawesome.min.css');
@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700|Open+Sans:400,400i,600,600i,700,700i,800,800i|Roboto:100,300,400,700,900');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alegreya+Sans+SC:wght@500;700&family=Inter:wght@300;400;600;700&family=Oranienbaum&display=swap');

@font-face {font-family: AlegreyaSans; 
src: url(https://forumstatic.ru/files/001c/b5/f3/19482.ttf);}

@font-face {font-family: Inter; 
src: url(https://forumstatic.ru/files/001c/b5/f3/79961.otf);}

@font-face {font-family: Oranienbaum; 
src: url(https://forumstatic.ru/files/001c/b5/f3/85947.ttf);}

/* A2 Deal with browser defaults and wonkiness
-------------------------------------------------------------*/

/* A2.1 */
html,
body {
  background-color: #14130f !important;
  background-image: url("https://forumstatic.ru/files/001c/b5/f3/66003.png") !important;
  background-position: center top !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

/* A2.2 */
.punbb * {
margin: 0px
}

/* A2.3 */
.punbb ul,
.punbb dl,
.punbb li,
.punbb dd,
.punbb dt {
padding: 0;
list-style: none;
}

/* A2.4 */
.punbb img {
border: none
}

/* A2.5 */
.punbb .main table {
table-layout: fixed;
width: 100%;
}

/* A2.6 */
.checkfield input[type="checkbox"],
.radiofield input[type="radio"] {
margin: 0 0.3em;
}

/* A2.7 */
p[class="checkfield"] *,
div[class="checkfield"] *,
fieldset[class="radiofield"] * {
height: auto;
vertical-align: middle
}

/* A3 Text setup
-------------------------------------------------------------*/

/* A3.1 */
body {
	background: var(--base-bg) no-repeat fixed bottom left / cover !important;
	font-size: 100.01%;
}

/* A3.2 */
.punbb {font: normal 95% verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;}


/* 3.3 */
.punbb textarea,
.punbb input,
.punbb select,
.punbb optgroup {
font: 1em verdana, arial, helvetica, sans-serif
}

/* 2.2 */
#pun-admain textarea, #pun-admain input, #pun-admain select, #pun-admain optgroup {
  font: 1.10em verdana, arial, helvetica, sans-serif !important;
  }

/* A3.4 */
.punbb h1,
.punbb h2,
.punbb h3 {
font-size: 1em;
font-weight: bold;
}

.punbb th {
font-size: 0.9em;
font-weight: bold;
}

.punbb h4,
.punbb table {
font-size: 1em;
font-weight: normal;
}

/* A3.5 */
.punbb h1 span,
.punbb h2 span,
.punbb legend span {
font-size: 1.1em;
}

/* A3.6 */
.punbb pre {
font: 1.1em/140% verdana, arial, monaco, "bitstream vera sans mono", "courier new", courier, monospace
}

/* A3.7 */
.punbb address,
.punbb em {
font-style: normal
}

/* A3.8 */
.punbb .post-content em {
font-style: italic
}

/* A3.9 */
.punbb .post-content em.bbuline {
font-style: normal;
text-decoration: underline;
}

/* A3.10 */
.punbb a {
text-decoration: underline
}

/* A3.11 */
.punbb optgroup {
font-weight: bold;
}


/* A4 Float clearing and hidden items
-------------------------------------------------------------*/

/* A4.1 */
#pun:after,
.punbb .container:after,
.punbb .post-links ul:after,
.punbb .main div.inline:after,
.punbb dl.post-sig dt span,
.punbb .post-box:after,
.punbb .linksb:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
overflow: hidden;
line-height: 0.0;
font-size: 0;
}

/* A4.2 */
.acchide,
#pun-ulinks h2,
#pun-index #pun-main h1,
#pun-navlinks h2,
#pun-pagelinks h2,
#pun-status 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 {
font-size: 0;
height: 0;
width: 0;
line-height: 0.0;
position: absolute;
left: -9999px;
overflow: hidden
}


/* A5 Basic page layout and borders
-------------------------------------------------------------*/
/* A5.1 */
#pun {
background: var(--beg100);
margin: auto;
width: 1000px;
margin-top: 30px !important;
margin-bottom: 30px;
box-sizing: border-box;
color: var(--text1);
padding: 30px;
}

.punbb {
padding: 0;
}

h1.title-logo,
#pun-navlinks h2,
#pun-ulinks h2,
#pun-status h2,
#pun-crumbs1 strong,
#pun-crumbs2 strong,
thead,
th,
#pun-crumbs1 .container strong+em,
#pun-crumbs2 .container strong+em,
#pun-index #pun-main h1,
.stickytext,
.closedatafield,
#pun-live-rusff,
.pl-reports,
td .modlist,
li#navawards,
.pa-gifts,
.acchide,
.forum h2,
.usertable h2,
.topic h2,
a.sharelink,
#pun .pa-ua,
.pa-author img,
.lastedit,
fieldset legend,
#pun .pl-reports,
#pun .mini_gifts,
#pun-userlist .main h2,
#pun-search .main h1,
#profilenav h2,
#profile-gifts,
#messages li.pl-email,
#pun .email,
.catleft,
.catright,
#pun .pl-share,
p.inputfield label em,
p.selectfield label em,
p.passfield label em,
#pun-announcement h2,
.pa-awards
 {
display: none
}

.punbb {
height: auto;
}

#pun {
color: var(--text1);
}

#pun a {
color: var(--accent5)
}

#pun a:hover {
color: var(--text1)
}

/* A5.3 */
#pun-redirect,
#pun-maint {
margin: 50px 20% 12px 20%;
width: auto;
float: none;
min-height: 100px;
}

#pun-redirect {
border: 0 none !important;
margin: 0;
padding: 0;
left: 0;
right: 0;
top: 0;
bottom: 0;
position: fixed;
width: 100%;
height: 100%;
text-align: center;
background: 
var(--base-bg) no-repeat fixed bottom left / cover !important;
}

#pun-redirect #pun-main {
background: transparent;
}

#pun-redirect * {
border: 0 none;
}

#pun-redirect .main-title {
display: none;
}

#pun-redirect.punbb .info .container {
text-align: center;
font: 400 11px var(--font);
display: inline-block;
margin: 0 auto;
width: auto;
height: auto;
box-sizing: border-box;
background: var(--beg100);
padding: 30px;
width: 1000px !important;
margin-top: 50px;
border-radius: 20px
}

/* A5.4 */
.punbb .section,
.punbb .main {
margin-bottom: 0;
}

/* A5.5 */
.punbb .category,
.punbb .post {
margin-top: 0.4em;
}

/* A5.6 */
.punbb #pun-category1,
.punbb .toppost,
.punbb .topicpost {
margin-top: 0;
}

/* 5.7 */
#pun-post .topic {
margin-top: 1em;
}

/* A5.8 */
.punbb .section,
.punbb .forum,
.punbb .formal,
.punbb .modmenu,
.punbb .info,
.punbb .category,
.punbb .post {
border:none
}

/* A5.9 */
.punbb .container {
border: none
}

/* 9.5 */
#pun-admain .adcontainer td {
  border-style: solid none none solid;
  border-width: 1px 0 0 1px;
  padding: 0.8em 1em;
  border-color: transparent !important;
  }

/* B1 Parsed Content, Signatures and Scroll Boxes
-------------------------------------------------------------*/

/* B1.1 */
.punbb .post-content {
padding: 0;
margin: 0;
width: 100%;
overflow: hidden;
}

/* B1.2 */
.punbb .post-sig dt {
border: none;
background: rgba(0, 0, 0, .1);
height: 1px;
display: block;
margin: 5px auto 15px;
width: 80%;
}

/* B1.3 */
.punbb .post-content p {
margin: 0;
padding: 0 0 1em 0;
line-height: 160%;
font-family: var(--font), sans-serif;
font-weight: 400;
font-size: 12px;
}

/* B1.4 */
.punbb .post-content img {
vertical-align: text-top
}

/* B1.5 */
.punbb .post-content img.postimg {
vertical-align: middle;
}

/* B1.6 */
.punbb .post-content .blockcode,
.punbb .post-content blockquote {
width: 100%;
overflow: visible;
}

/* B1.7 */
.punbb .post-content .scrollbox {
width: 100%;
overflow: auto;
height: auto !important;
max-height: 200px
}

/* B1.8 */
.punbb .post-content .quote-box,
.punbb .post-content .code-box {
border: medium none;
margin: 0.4em 0em 0.8em;
padding: 0em;
}


/* B1.9 */
.punbb .quote-box cite,
.punbb .code-box strong.legend {
display: block;
font-size: 1.1em;
font-style: normal;
font-weight: bold;
margin: 0;
padding-bottom: 0.0em;
}

/* B2 Information boxes
-------------------------------------------------------------*/

/* B2.1 */
.punbb .info-box {
padding: 1.1em 1.7em 1em 1.7em;
border-style: solid;
border-width: 1px;
margin: 0 0 1.1em 0;
}

/* B2.2 */
.punbb .info-box * {
padding: 0 0 0.7em 0;
}

/* B2.3 */
.punbb #pun-main .info-box .legend {
font-size: 1.1em;
font-weight: bold;
}


/* B3 Pagination and posting links
-------------------------------------------------------------*/

/* B3.1 */
.punbb .linkst {
width: auto;
height: auto;
font: 400 11px var(--font);
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
margin: 0px 0px 15px !important;
position: relative;
padding: 0px;
text-transform: lowercase;
color: var(--text1);
}

/* B3.4 */
.linkst .postlink,
.linksb .postlink {
text-align: right;
font-weight: 600;
left: -17px;
}

#pun .postlink.long {
width: auto !important;
}

/* B3.5 */
.punbb .linksb {
width: auto;
height: auto;
font: 700 11px var(--font);
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
margin: 5px 0px 0px !important;
position: relative;
padding: 8px;
text-transform: lowercase;
color: var(--text1);
}

.gid3 .linksb {
margin-top: 5px  !important;
}

.linksb {
height: auto;
display: flex;
justify-content: space-between;
align-items: center;
width: auto;
}

#profile .button {
margin-top: 0 !important;
}

#profile .clearer {
display: none
}

#profile .linksb:after,
.linksb:after {
display: none !important;
}


.postlink span+span {
margin-left: -5px
}

/* B3.6 */
.linksb .pagelink {
float: left;
width: auto;
text-align: left;
order: 1;
}

/* B3.7 */
.linksb .postlink,
.linksb noindex {
width: auto;
order: 3;
position: relative
}

.subscribelink {
position: relative;
order: 2;
text-align: center;
}

.pagelink strong {
font-weight: 600
}

/*************************************************************
C - MAIN CONTENT - SPECIFIC
**************************************************************/

/* C1.1 */
.punbb .formal .container {
padding: 1.7em 2.3em 1.1em 2.3em;
}

#post.container {
/* padding: 0px !important; */
background-color: var(--beg900);
border-radius: 4px;
}

/* C1.2 */
.punbb .formsubmit {
padding: 0 0 15px 0em;
margin: 0em 0 0 0;
position: relative;
z-index: 1;
display: flex;
gap: 5px
}

#togglePreview {
margin-left: auto
}

/* C1.3 */
.punbb .formsubmit input,
.punbb .formsubmit a,
.punbb .formsubmit span {
margin: 0
}

/* C1.4 */
.punbb fieldset {
border-style: solid;
border-width: 1px;
padding: 0 0px 0 0px;
margin: 0 0 1em 0
}

/* 7.2 */
#pun-admain fieldset .handle, #pun-admain fieldset p {
  border-left-style: solid;
  border-left-width: 18em;
  margin-bottom: 6px !important;
  padding: 5px 5px 22px 0 !important;
  position:relative;
  border-color: #dedfdf;
  background-color: #eee;
  }

/* C1.5 */
.punbb fieldset legend {
padding: 0;
margin: 0 0 0 11px;
font-size: 1.1em
}

/* C1.6 */
.punbb fieldset legend span {
padding: 0 5px;
margin: 0;
}

#profile .container fieldset legend {
display: block;
font-size: 8px;
text-transform: uppercase;
margin: 0 0 5px !important;
font-family: var(--font);
padding: 4px 0;
}

/* C1.7 */
.punbb fieldset fieldset {
border-style: none;
margin: 0;
padding: 0 0 8px 0
}

/* C1.8 */
.punbb .fs-box {
padding: 0em 0 0em 0;
}

/* C1.9 */
.punbb .fs-box p,
.punbb .fs-box fieldset {
padding: 0 0 1.5em 0
}

/* C1.10 */
.punbb .inline .inputfield,
.punbb .inline .selectfield,
.punbb .inline .passfield {
float: left;
margin-right: 1em;
}

p label {
margin-bottom: 5px !important;
display: inline-block
}

/* C1.11 */
.punbb .inline .infofield {
clear: both
}

/* C1.12 */
.punbb .datafield br {
display: none
}

/* C1.13 */
.punbb .required label,
.punbb .datafield span.input {
font-weight: bold
}

/* C1.14 */
.punbb .datafield span.input a {
font-weight: normal;
}

/* C1.15 */
.punbb .areafield span.input,
.punbb p.longinput span.input {
display: block;
padding: 0 4em 0 0;
height: 100%;
/* For IE */
}

/* C1.16 */
.punbb textarea,
.punbb .longinput input {
width: 64%;
margin: 0;
}

/* C1.17 */
.punbb .hashelp {
position: relative;
}

/* C1.18 */
.punbb .helplinks {
display: block;
position: absolute;
top: 1em;
right: 0;
font-weight: normal;
width: 36%;
}

/* c1.19 */
.punbb #profile .helplinks {
top: 1.5em;
}

/* C1.20 */
.punbb .helplinks span {
display: block;
padding-bottom: 0.2em;
}

.punbb .helplinks span INPUT {
margin: 0px 2px 2px 0px;
}

/* C1.21 */
#pun-post .formal .info-box li {
padding-left: 4px;
list-style-type: square;
list-style-position: inside;
line-height: 1.5;
margin: 0;
}

/* C2 Table layout
-------------------------------------------------------------*/
/* C2.1 */
.punbb .main .tcl {
overflow: hidden;
text-align: left;
width: 35%;
}

/* C2.2 */
.punbb .main .tc2,
.punbb .main .tc3,
.punbb .main .tcmod {
text-align: center;
width: 6%;
}

/* C2.3 */
.punbb .main .tcr {
overflow: visible;
text-align: left;
width: 27%;
text-transform: lowercase;
}

/* C2.4 */
#pun-userlist .main .tcl,
#pun-searchtopics .main .tcl,
#pun-modviewforum .main .tcl {
width: 40%
}

/* C2.5 */
#pun-userlist .main .tc2,
#pun-searchtopics .main .tc2 {
text-align: left;
width: 20%;
}

/* C2.6 */
#pun-debug table .tcl {
width: 15%;
white-space: normal;
}

/* C2.7 */
#pun-debug .tcr {
width: 90%;
white-space: normal;
}

/* C2.8 */
#pun-index .tcl h3 {
font-size: 1.2em;
font-weight: bold;
}

/* C2.9 */
.punbb td span.youposted {
font-weight: bold;
margin-left: -1em;
position: absolute;
}

/* C2.10 */
.punbb td .modlist {
display: none;
padding-top: 0.3em
}

/* C2.11 */
.punbb .main td {
border-style: solid none none solid;
border-width: 1px 0 0 1px;
padding: 0.9em 0em;
}

/* C2.12 */
.punbb .main th {
border-style: none none none solid;
border-width: 0 0 0 1px;
padding: 0.4em 1em 0.4em 1em;
}

/* C2.13 */
.punbb .main .tcl {
border-left-style: none;
border-left-width: 0;
}

* html .tclcon {
height: 1px
}

/* C2.14 */
.punbb td div.tclcon {
line-height: 150%;
margin-left: 0;
text-align: left;
flex: 1
}

/* C3 Topics
-------------------------------------------------------------*/
/* C3.1 */
.punbb .post {
margin-top: 0px;
position: relative;
}

.post {scroll-margin: 65px}
.post + .post {margin-top: 20px}

/* C3.2 */
.punbb .post .container {
border: none;
background: var(--beg900);
/* border-radius: 10px; */
position: relative;
padding: 15px !important;
}

.punbb .post h3 {
    border-width: 0px;
    -webkit-text-size-adjust: 100%;
    width: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font: 700 11px / 1 Verdana, Arial, sans-serif !important;
    text-transform: lowercase;
    z-index: 1;
    margin: 0 0px -7px !important;
    padding: 5px 28px 15px !important;
    box-sizing: border-box;
    background: var(--dark600-const);
    color: var(--text3);
    border-radius: 4px 4px 0 0;
}

.punbb .post h3 a {
font-weight: 700;
color: var(--text3) !important;
}

.punbb .post h3 a:hover {
color: var(--accent) !important;
}

.post h3 span {
display: flex !important;
justify-content: flex-start;
gap: 2px;
flex-wrap: wrap;
position: relative;
padding: 0px;
width: 100%;
}

.post h3 strong {
order: 2;
font-weight: 700;
margin-left: auto !important;
}

.post h3 span strong:before {
content: "#"
}

/* C3.5 */
.punbb .post .post-author {
float: left;
}

/* C3.6 */
.punbb .post .post-author ul,
.punbb .post .post-author p {
line-height: 140%;
}

/* C3.7 */
.pa-author {
font-size: 1.1em;
font-weight: bold;
}

/* C3.8 */
.pa-author a {
text-decoration: none
}

/* C3.9 */
li.pa-title {
padding-bottom: 0.4em;
font-weight: bold;}

li.pa-online {
line-height: 0.8em;
border-left-style: solid;
border-left-width: 0.7em;
padding-left: 0.4em;
margin-top: 0.7em;}

/* C3.11 */
.punbb .post-body {
margin-left: 250px;
border: none !important;
}

/* C3.12 */
.punbb .post-box {
padding: 10px 0;
text-align: justify;
}

.post-box a {
color: var(--links) !important;
font-weight: bold
}

.post-box a:hover {
color: var(--accent3) !important;
}

/*C3.13 */
.punbb fieldset .post-box {
margin-bottom: 0.8em;
}

/*C3.14 */
.punbb .post-links {
margin: 0 0px 0px;
padding: 0;
position: relative;
}

.post-links ul {text-align: right;}
.post-links li {display: inline;}

.profile,
.pm,
.email {
float: left
}

.post-links li+li,
.pa-links li+li {
margin-left: 2px
}

.punbb .post-links ul li:first-child {
margin-left: 0
}

.endpost .post-links ul {
border: 0 !important;
}

#pun .post-links ul a,
.pa-links li a {
font: 600 10px var(--font);
text-transform: lowercase;
background: var(--beg900);
padding: 2px 10px 4px;
display: inline-block;
border-radius: 10px;
}

/* C3.17 */
.pl-email,
.pl-website {
float: left;
}

/* C3.18 */
.punbb .clearer {
clear: both;
height: 0;
font-size: 0;
}

/* C4 Moderator menu
-------------------------------------------------------------*/
.punbb .modmenu .container {
padding: 2px 10px;
text-align: justify;
font: 600 10px var(--font) !important;
margin: 10px 0;
background: var(--beg900);
border-radius: 4px;
}

.punbb .modmenu .container a {
font-weight: 600
}

.modmenu .container span:last-child {
display: none
}

.main.multipage {
padding: 0px;
}

.forum {
padding: 0px;
}

.forum tr {display: flex;padding: 8px 10px !important;/* gap: 30px; *//* font: 500 12px var(--font); */align-items: center;text-transform: lowercase;background: var(--beg900);border-radius: 4px;}


.forum .tr-divider {
font-size: 7px !important;
font-weight: 400 !important;
text-transform: uppercase !important;
color: var(--text1) !important;
padding: 0 !important;
padding-left: 0px !important;
background: transparent
}

.tr-divider.st, .tr-divider.imp {
margin-top: 10px !important;
margin-bottom: 3px !important;
}

.tr-divider .td-divider {
background: var(--beg100);
padding: 2px 10px !important;
border-radius: 5px;
line-height: 100%
}

.forum .tr-divider:first-child {
margin-top: 0 !important;
}

.forum tr + tr {
margin-top: 2px;
}

.forum tr a {
font-weight: 500;
font-size: 12px;
text-transform: lowercase;
}

.forum td {
padding: 0 !important;
}

.forum .tcl {
width: 500px !important;
}

.forum .tc2,
.forum .tc3 {
width: 80px !important;
font-weight: 200;
font-size: 10px;
color: var(--text1)
}

#pun .forum .tcr {
display: grid; 
  grid-template-columns: 40px 1fr; 
  grid-template-rows: auto auto; 
  gap: 0px 10px; 
  grid-template-areas: 
    "av link"
    "av user"; 
flex: 1;
line-height: 130%
}

.forum .user-avatar {grid-area: av;}
.forum .tcr > a {align-self: end; grid-area: link;}
.forum .tcr .byuser {align-self: start; grid-area: user; }
.forum table {margin: 0px 0}
.forum tr td {padding: 0 !important;}
.forum tr td {padding: 0 !important; border: none !important;}
.forum .byuser {display: block !important;}

.forum .byuser:before {content: "автор:"; opacity: .45}
#pun-viewforum .tcr, #pun-searchtopics .tcr {display: flex; align-items: center;}
#pun-searchtopics .tcl {width: 400px !important;}
#pun-searchtopics .tc2 {width: 200px !important;}

#pun .forum .user-avatar,
#pun .forum .user-avatar .avatar-image{
width: 40px !important;
height: 40px !important;
}

#pun .user-avatar {
    width: 40px !important;
    height: 40px !important;
margin-right: 10px !important;
margin-top: 0 !important;
border-radius: 100%
}

#pun-index .user-avatar {
margin-right: 0 !important;
margin-right: 10px !important;
}

#pun .user-avatar .avatar-image {
width: 40px;
    height: 40px;
    transition: all .5s linear 0s;
    box-sizing: border-box;
    border: none !important;
    position: relative;
    border-radius: 100%;
    opacity: .70;
    filter: grayscale(100%);
}

#pun .user-avatar .avatar-image:hover {
opacity: 1;
filter: none
}

#pun .user-avatar .isonline {
    margin: 0 !important;
    z-index: 1;
    border: none;
    top: calc(40% - 13px);
    right: -1px;
    border-radius: 10px 0 0 0px;
    padding: 1px 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

#pun .user-avatar .isonline:before {
content: "\25cf";
font: 9px FontAwesome;
}

.user-avatar .avatar-image[style*=default_avatar] {background-image: url(https://forumstatic.ru/files/001c/b5/f3/77627.png) !important;}

/* C4.2 */
.punbb .modmenu strong,
.punbb .modmenu a {
height: auto;
line-height: 1.8em;
}

/* C4.3 */
.punbb .modmenu .container strong {
float: left;
}

/* C4.4 */
.punbb .modmenu input {
margin-left: 1em;
}

/* C5 Message boxes
-------------------------------------------------------------*/
.punbb .info .container {
padding: 0.8em 1em
}

/* C5.2 */
.punbb .info .container .backlink {
padding-top: 0.8em;
}

/* C6 Profile
-------------------------------------------------------------*/
#profile .container {
padding-left: 18.6em;
border-radius: 0;
background-color: var(--beg100);}

/* C6.2 */
#profilenav {
float: left;
width: 14em;
margin-left: -18em;
display: inline;
background-color: var(--beg100);}

/* C6.3 */
#profilenav li {
padding-bottom: 0.8em;
font-weight: normal;
}

/* C6.4 */
#viewprofile ul,
#profilenav ul {
border: none;
padding: 1.5em 18px 0.8em 0;
margin: 0 0 1em 0;
font-family: var(--font)
}

/* C6.5 */
#viewprofile h2,
#profilenav h2 {
padding: 3px 0 0 10px;
margin: 0 14px -0.6em 14px;
text-align: left;
display: block
}

/* C6.6 */
#viewprofile h2 span,
#profilenav h2 span {
padding: 0 5px;
position: relative;
}

/* C6.7 */
#viewprofile li,
#setmods dl {
padding: 0 0 0 16em;
margin-bottom: 0.2em;
}

/* C6.8 */
#viewprofile li span {
font-weight: normal;
background: var(--html-base-dark);
color: var(--text1);
text-transform: uppercase;
border-radius: 2px;
padding: 3px 10px;
font-size: 8px;
}

/*C6.9 */
#setmods dt {
float: left;
width: 14em;
margin-left: -16em;
padding: 0.8em 1em;
font-weight: bold;
display: inline;
}

/* C6.10 */
#viewprofile li strong,
#viewprofile li div,
#setmods dd {
display: block;
padding: 0.5em 1em;
font-weight: normal;
}

/* C6.11 */
.punbb img.avatardemo {
float: right;
margin: 0 0 0.8em 1.8em
}


/* C7 User list
-------------------------------------------------------------*/
/* C7.1 */
#pun-userlist .formal,
#pun-userlist .formal .container {
border-bottom: none;
margin-bottom: 0;
}

/* C7.2 */
#pun-userlist .usertable .container {
padding:0px;
border: none;
}

/* C7.3 */
#pun-userlist .usertable table {
border: none;
font-family: var(--font);
}

#pun-userlist .usertable table td {
padding: 0 !important;
}

#pun-userlist .usertable tbody {
display: flex;
gap: 10px;
flex-wrap: wrap;
justify-content: center;
}

#pun-userlist .usertable tr {
background: var(--beg800);
padding: 8px;
flex: 1;
max-width: 240px;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
text-align: center;
border-radius: 4px;
}

#pun-userlist .usertable tr td {
width: 100% !important;
text-align: left !important;
padding: 2px 5px !important;
box-sizing: border-box;
border: none !important;
font-size: 9px
}

#pun-userlist .usertable .username {
display: flex;
align-items: center;
font: 700 9px var(--font);
overflow: hidden !important;
height: 30px
}

#pun-userlist span.usersname {
flex: 1;
text-align: right;
text-transform: uppercase
}

#pun-userlist .usertable .user-avatar {
float: none !important;
width: 100px !important;
height: 50px !important;
mask: linear-gradient(to right, #000 20%, rgba(0, 0, 0, 0) 100%);
-webkit-mask: linear-gradient(to right, #000 20%, rgba(0, 0, 0, 0) 100%);
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-size: contain;
-webkit-mask-size: contain;
margin: -5px 0 -5px -10px !important;
}

#pun-userlist .usertable .user-avatar .avatar-image {
width: 100px !important;
height: 50px !important;
border-radius: 0;
border: none !important;
}

#pun-userlist .usertable .user-avatar .isonline {
top: 10px; 
right: calc(100% - 20px)
}

#pun-userlist .usertable td:before {
text-transform: uppercase;
opacity: .45;
font-size: 9px;
font-weight: 300;
}

#pun-userlist .usertable .user_title:before {
content: "статус: "}
#pun-userlist .usertable .relation:before {
content: "репутация: "}
#pun-userlist .usertable .num_posts:before {
content: "сообщения: "}
#pun-userlist .usertable .registered:before {
content: "дата регистрации: "}
#pun-userlist .usertable .last_visit:before {
content: "последний визит: "}

/* D1 Logo and description
-------------------------------------------------------------*/

/* D1.1 */
#pun-title {
margin: 0;
border: none;
margin-bottom: -35px;
}

/* D1.2 */
#pun-title h1 {
display: block;
height: 10px;
margin: -1px 0px 0px -30px;
}

/* D1.3 */
#pun-title .container {
border: none;
padding: 0.2em 1em 0.8em 1em;
}

/* D1.4 */
#pun-title h1 span {
display: none;
}

#pun-title TD.title-logo-tdl {
border: none;
width: 100%;
}

#pun-title TD.title-logo-tdr {
border: none;
width: 420px;
}

/* D2 Page navigation
-------------------------------------------------------------*/

/* D2.1 */
#pun-pagelinks {
position: absolute;
top: -15px;
left: 0;
margin: 0;
border: none;
width: 100%;
}

/* D2.2 */
#pun-pagelinks .container {
background: transparent;
border: none;
padding: 0
}

/* D2.3 */
#pun-pagelinks .container li {
display: inline
}

/* D2.4 */
#pun-pagelinks li a,
#pun-pagelinks a:link,
#pun-pagelinks a:hover {
height: 2em;
line-height: 2em;
padding: 0;
font-size: 1.2em;
margin-left: -9999px;
display: block;
float: left;
width: 100%;
}

/* D2.5 */
#pun-pagelinks a:active,
#pun-pagelinks a:focus {
position: relative;
margin: 0;
}

#pun-pagelinks li a span {
display: block;
margin: 0 1em
}

/* D3 Forum navigation
-------------------------------------------------------------*/
#pun-navlinks {
border: none;
margin: 0;
}

#pun-navlinks .container {
border: none;
margin: 0;
}

/* D3.2 */
#pun-navlinks .container {
font-weight: normal;
}

/* D.3 */
#pun-navlinks li {
display: inline;
margin: 0;
}

/* D3.4 */
#pun-navlinks li a {
font-family: tahoma;
font-size: 0.8em;
padding: 10px 5px 10px 7px;
}

/* D4 User links
-------------------------------------------------------------*/
#pun-ulinks {
border: none;}

#pun-ulinks li,
#pun-ulinks li a {
display: block;
white-space: nowrap;}

#pun-ulinks li a {
font-size: 0.8em;
padding: 0 0 0 5px;}

/* D5 Welcome box and Top Breadcrumbs
-------------------------------------------------------------*/
#pun-status,
#pun-status .container {
border-bottom: none;
margin-bottom: 0;
}

/* D5.2 */
#pun-status .container {
text-align: left;
font: 700 11px var(--font);
display: flex;
gap: 0;
align-items: center;
box-sizing: border-box;
align-self: stretch;
color: var(--text5);
}

#pun-status {
    position: absolute;
    top: 383px;
    height: 17px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    margin-left: 1px !important;
    box-sizing: border-box;
    text-transform: lowercase;
    z-index: 11;
}

#pun-status .container strong {
font-weight: 600 !important;
}

#pun-status .status-right {
float: none !important;
}

#pun-status .status-right {
display: none
}

#pun-status .item2 {
display: none
}

/* D5.3 */
#pun-status span {
white-space: pre-line;
margin-right: 0.5em;
}

/* D5.4 */
#pun-crumbs1 {
font-weight: bold;
overflow: hidden;
margin-top: 15px;
position: relative
}

/* D5.5 */
#pun-crumbs1 p.container {
border-top: none;
}

/* D5.6 */
#pun-break1 {
margin: 0 1em;
border-style: solid none;
border-width: 1px 0;
height: 0;
margin: -2px 1em;
position: relative;
z-index: 1;
}

/* D6 Announcement
-------------------------------------------------------------*/
#pun-announcement h2 {
padding: 0;
margin: 0 1em -3.5em 1em;
border-style: none none solid none;
border-width: 0 0 1px 0;
position: relative;
font-weight: bold;
display: none
}

/* D6.2 */
#pun-announcement h2 span {
display: block;
padding: 1em 0 0.8em 0;
border-bottom-style: solid;
border-bottom-width: 1px;
}

/* D6.3 */
#pun-announcement .container {
padding: 0;
}

/* D7 Statistics
-------------------------------------------------------------*/
#pun-stats {
margin: 15px 20px 0 !important;
height: auto;
position: relative;
text-align: left;
}

#pun-stats .container {
font: 300 11px/150% var(--font);
position: relative;
gap: 10px;
padding: 0 0 0px;
  display: flex;
  text-align: justify;
flex-direction: column;
background: var(--beg900);
border-radius: 0;
padding: 20px;
border-bottom: 1px solid var(--borders-gray)
}

.ststitems {
display: grid; 
  grid-template-columns: 1fr 1fr; 
  grid-template-rows: 1fr 1fr; 
font-weight: 300;
font-size: 10px !important;
text-transform: lowercase;
line-height: 100%;
margin: 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
gap: 4px;
grid-template-areas: 
    "one two"
    "three four"; 
}

.ststitems li {
padding: 0px !important;
text-align: left;
gap: 3px;
padding: 0px !important;
box-sizing: border-box;
color: var(--text1);
font-size: 11px
}

.ststitems li span {
font-weight: 300;
text-transform: lowercase;
line-height: 100%;
}

.ststitems li strong {
font-weight: 500;
color: var(--text1)
}

.ststitems .item1 {
text-align: left;
grid-area: one;
}

.ststitems .item3 {
text-align: right;
grid-area: two;
}

.ststitems .item4 {
text-align: right;
grid-area: four;
}

.ststitems .item2 {
text-align: left;
grid-area: three;
}

#onlinelist {
font-weight: 400;
}

#onlinelist span {
font-weight: 300
}

#onlinelist strong {
font-weight: 400
}

.onlinelist, .users_24h {
margin: 0;
padding: 0px !important;
box-sizing: border-box;
position: relative;
text-transform: lowercase
}

.onlinelist {
margin-top: 10px !important;
}

#pun-stats a {
color: var(--links);
font-weight: 400;
}

#pun-stats a:hover {
color: var(--accent3)
}

#onlinelist span a {
color: var(--links)
}

#onlinelist span a:hover {
color: var(--accent3)
}

/* D8 Quick Jump - About - Bottom Breadcrumbs
-------------------------------------------------------------*/
#pun-qjump {
margin: 0;
border: none;
width: 50%;
position: relative;
float: left;
}

/* D8.2 */
#pun-qjump .container {
border: none;
background: transparent;
padding: 0.8em 1em;
}

/* D8.3 */
#pun-about {
margin-top: 0;
}

/* D8.4 */
#pun-about .container {
border-top-style: none;
text-align: right;
line-height: 150%;
padding: 0.8em 1em;
}

/* D8.5 */
#pun-about p span {
display: block;
}

/* D8.7 */
#pun-crumbs2 .container {
font-size: 1.1em;
}

/* D8.8 */
#pun-break4 {
margin: -2px 1em;
border-style: solid none;
border-width: 1px 0;
position: relative;
height: 0;
z-index: 1;
}

/* D8.9 */
div.punbb-admin #pun-about .container {
border-top-style: solid;
border-top-width: 1px;
}

/* D9 Help file
-------------------------------------------------------------*/
#pun-help .formal .info-box h3.legend {
border-bottom-style: solid;
border-bottom-width: 1px;
padding-bottom: 0;
margin-bottom: 0.8em;
}

/* D9.2 */
#pun-help .formal .info-box h3.legend span {
padding-bottom: 0.6em;
display: block;
border-bottom-style: solid;
border-bottom-width: 1px;
font-size: 1.1em;
}

/* D9.3 */
#pun-help .formal p,
#pun-help .formal dd {
margin-bottom: 1em
}

/* D9.4 */
#pun-help .formal ul,
#pun-help .formal dl {
padding: 0 0 0 1em
}

/* D9.5 */
#pun-help .formal li {
padding: 0;
line-height: 130%
}

/* D9.6 */
#pun-help .formal li * {
vertical-align: text-top
}

/* D9.7 */
#pun-help .formal dt span {
font: 1.4em/120% monaco, "bitstream vera sans"
}

.stickytext,
.closedatafield,
#pun-live-rusff,
.pl-reports {
display: none
}


input,
textarea {
outline: none;
}

input:active,
textarea:active {
outline: none;
}

:focus {
outline: none;
}

#pun-messages .fs-box {
padding: 0 0px;
}

#pun-messages #post-form .fs-box {
padding: 0 0px;
}

#pun-messages .post h3 {
width: auto;
}

#pun-messages .post h3 span {
width: auto !important;
}

#pun #pun-messages .post-author {
position: relative;
}

#pun-messages .pa-posts {
display: none
}

#pun-messages .pa-online {
clear: both
}

#main-reply {
height: 200px;
}

#mask_dialog .inner,
.modal-inner.section,
#pun-report .inner,
#pun-reputation .inner,
#pun-admin-award-form .inner,
.editBookmark {
border: 1px solid var(--borders) !important;
background: var(--beg100);
border-radius: 10px;
color: var(--text1);
padding: 15px 20px !important;
}

#post legend span {
display: none
}

#font-area,
#size-area,
#color-area,
#table-area,
#smilies-area,
#image-area,
#imageup-area,
#imageattach-area,
#keyboard-area,
#video-area,
#addition-area {
top: 55px !important;
}

.pl-reports {
display: none !important;
}

.pa-avatar {
display: inline-flex;
line-height: 0;
border-radius: 0px;
overflow: hidden
}

.pa-avatar img {
max-width: 180px;
max-height: 180px;
}

.post-content td {
border: none transparent !important;
overflow: hidden !important;
}

#tags .container{
  position:absolute;
  right:6px;
  top:43px;
  z-index:2;
  display:flex;
  flex-direction:column;
  row-gap:6px;
}

::selection {
background: var(--accent);
color: var(--text3);
}

@-moz-document url-prefix() {
body * {
scrollbar-width: thin;
scrollbar-color: var(--links2) rgba(20, 18, 15, 0.01);
}

html {
scrollbar-width: thin;
scrollbar-color: var(--links2) rgba(0, 0, 0, 0.01);
}

.personal_page-scroll {
scrollbar-width: thin;
scrollbar-color: var(--links2) rgba(0, 0, 0, 0.01);
}

::-webkit-scrollbar {
width: 4px;
height: 4px;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 10px !important;
}

::-webkit-scrollbar-thumb {
background-color: var(--links2);
width: 4px !important;
border-radius: 100px !important;
}}

.personal_page-scroll::-webkit-scrollbar-thumb {
background-color: var(--links2);
width: 4px !important;
border-radius: 100px !important;
}

#html-header {
color: var(--text1);
}

#html-header a {
    color: var(--beg800);
}

#html-header a:hover {
color: var(--beg800)
}

.post-content abbr {
text-decoration: underline;
text-decoration-style: dotted;
text-decoration-color: var(--text1)
}


#pun #pun-ulinks #Rz {
display: none !important;
}

.punbb-admin textarea {
width: 100% !important;
}

input[type="checkbox"] {
border-radius: 0%;
appearance: none;
padding: 5px !important;
cursor: pointer;
transition: all .2s ease-in-out 0s;
    margin-right: 10px !important;
border: 1px solid var(--borders) !important;
border-radius: 0;
display: inline-flex;
justify-content: center;
align-items: center;
}

input[type="radio"] {
border-radius: 0%;
appearance: none;
padding: 5px !important;
cursor: pointer;
transition: all .2s ease-in-out 0s;
    margin-right: 10px !important;
border: 1px solid var(--borders) !important;
display: inline-flex;
justify-content: center;
align-items: center;
}

input[type="checkbox"]:checked:after,
input[type="radio"]:checked:after {
content: "\f00c";
font-family: FontAwesome;
font-size: 8px;
position: absolute;
font-weight: bold
}

span.checkfield,
p.checkfield {
display: flex;
margin-top: 10px !important;
align-items: center
}

.pl-share {
display: none !important
}

.pl-email.email {
display: none !important;
}

body.post-content {
width: 100%;
}

#post-form {
padding: 0px 0px !important;
}

.intd {
display: flex;
align-items: center
}

#post-form h2 {
display: none
}

#profile fieldset #charcounter {
display: none
}

.rait_wrap {
display: flex;
  width: 100%;
  margin-top: 20px;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  overflow: visible;
  flex-direction: row;
}

.punbb .rait_wrap .post-rating,
.punbb .rait_wrap .post-vote {
  position: relative;
  float: none !important;
  display: flex;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center;
  justify-content: center;
  line-height: initial;
}

.punbb .rait_wrap .post-rating p,
.punbb .rait_wrap .post-vote p {
  position: relative;
  float: none !important;
  display: flex;
  width: 28px;
  height: 28px;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center;
  justify-content: center;
  border: 0 !important;
  border-radius: 0;
  background: transparent;
}

.punbb .rait_wrap .post-rating p::before,
.punbb .rait_wrap .post-vote p > a::before {
  display: flex;
  width: 36px;
  height: 32px;
  align-items: center;
  justify-content: center;
  color: var(--wine);
  font: 700 30px/1 FontAwesome;
  transition: color .2s linear;
}

.punbb .rait_wrap .post-rating p::before {
  content: "\f004";
}

.punbb .rait_wrap .post-vote p > a::before {
  content: "\f075";
  position: static;
  z-index: auto;
  opacity: 1;
}

.punbb .rait_wrap .post-rating p > a {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: inline-flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: var(--beg900) !important;
  font: 700 11px/1 Verdana, Arial, sans-serif !important;
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
}

.punbb .rait_wrap .post-rating p > a::before {
  content: none;
}

.punbb .rait_wrap .post-vote p > a {
  position: static;
  display: flex;
  width: 36px;
  height: 32px;
  align-items: center;
  justify-content: center;
  color: transparent !important;
  font-size: 0 !important;
  text-decoration: none !important;
  cursor: pointer;
}

.punbb .rait_wrap .post-rating:hover p::before,
.punbb .rait_wrap .post-vote p > a:hover::before {
  color: var(--accent5);
}

.punbb .rait_wrap .mylike .post-rating p::before,
.punbb .mylike .post-rating p::before {
  opacity: .55;
}

/* стабильная строка: реакции + быстроплюсы */

.punbb .rait_wrap {
  flex-wrap: nowrap !important;
  min-width: 0 !important;
}

.punbb .rait_wrap > .reactions-root,
.punbb .rait_wrap > .post-vote,
.punbb .rait_wrap > .post-rating {
  flex: 0 0 auto !important;
}

/* внутри блока реакций тоже запрещаем перенос */
.punbb .rait_wrap .reactions-container,
.punbb .rait_wrap .reaction-counters-container {
  flex-wrap: nowrap !important;
}

/* реакция не мелькает в старом месте,
   пока JS не переставил её в rait_wrap */
.punbb .reactions-root:not([data-lily-docked="1"]) {
  visibility: hidden !important;
}

.punbb .reactions-root[data-lily-docked="1"] {
  visibility: visible !important;
}

.punbb .mylike .post-vote {
display: none;
}

.punbb .reactions-root {
  order: -1;
  margin: 0;
  padding: 0;
}

.punbb .reactions-container {
    position: relative;
    /* top: 2px; */
    right: 5px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.punbb .reaction-picker {
  order: 1;
}

.punbb .reaction-picker-panel {
  right: 0;
  z-index: 100;
}

.punbb .reaction-picker-button.reaction-chip {
display: grid !important;
    width: 28px;
    margin: 0 !important;
    padding: 0 !important;
    place-items: center;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--beg100);
    box-shadow: none !important;
    cursor: pointer;
}

.punbb .reaction-picker-button.reaction-chip svg {
  width: 14px;
  height: 14px;
  color: var(--accent5) !important;
}

.punbb .reaction-counters-container {
  display: flex;
  align-items: center;
  gap: 4px;
}

#viewprofile-next .container {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0px 0px 0 !important;
font: 300 10px var(--font);
padding: 50px 15px 15px !important;
position: relative;
background: var(--beg900);
border-radius: 4px
}

#viewprofile ul {
padding: 0 !important;
margin: 0 !important;
}

#viewprofile-next #profilenav {
display: none
}

#viewprofile tr {
display: flex;
}

#viewprofile #profile-left {
text-align: left;
padding: 15px !important;
width: 230px;
display: flex;
flex-direction: column;
gap: 10px;
background: var(--beg900);
border-radius: 4px;
align-items: center;
color: var(--text1);
box-sizing: border-box;
}

#viewprofile #profile-left li, #viewprofile #profile-left div, #viewprofile #profile-left strong {
padding: 0 !important;
margin: 0 !important;
}

#profile-left li+li {
margin-top: 0px;
}

#pun #profile-left #profile-name {
position: absolute;
height: 25px;
top: 15px;
padding: 0 !important;
box-sizing: border-box;
left: 15px;
  color: var(--text1);
display: flex;
align-items: center;
justify-content: center;
text-transform: lowercase;
font: 200 13px var(--font-a);
width: calc(100% - 30px);
background: var(--beg900);
border-radius: 4px
}

#pun #profile-left li strong {
font-weight: 200 !important;
}

#pun #profile-left #profile-title strong {
font-weight: 300 !important;
text-align: center
}

#profile-right {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: flex-start;
gap: 5px;
width: auto !important;
background: var(--accent);
padding: 15px !important;
border-radius: 4px;
box-sizing: border-box;
flex: 1;
margin-left: 4px
}

#profile-right li {
display: flex;
flex-direction: column;
justify-content: center;
flex: auto;
text-align: center;
padding: 5px 10px !important;
font-size: 9px;
background: var(--beg900);
border-radius: 4px;
align-self: stretch;
align-items: center;
}

#pa-fld5 {
position: relative;
}

#pa-fld5 .personal_banner {
z-index: 0;
position: relative;
}

#pun-profile #viewprofile #pa-fld5 .profile-bg,
#pun-profile #viewprofile #pa-fld5 .personal_bg {
display: none !important;
}

#profile-right li strong {
font-weight: normal;
padding: 5px !important;
margin: 0 !important;
}

#pa-invites,
#pa-gifts,
#pa-awards {
display: none !important;
}

#profile {
display: flex;
}

#profile form.container {
width: 100%;
padding-left: 18.6em;
background-color: var(--beg100);
border-radius: 10px;
}

#pun #keyboard-span input {
font-family: Arial, Helvetica, sans-serif !important;
font-weight: 300;
font-size: 12px;
color: var(--text1) !important;
background-color: var(--beg100);
margin: 1px 1px 0 0;
margin-top: 1px;
border: 1px solid var(--borders) !important;
cursor: pointer;
padding: 0 10px !important;
height: 25px;
min-width: 30px;
}

#pun #keyboard-span input+input {
margin: 3px
}


#pun-index .datetime,
#pun-index .byuser {
font-size: 10.5px;
font-weight: 300;
color: var(--text1)
}

#BookmCntToggle {
margin-top: 1px !important;
z-index: 9999;
}

#MyBookmarks {
background: var(--fill);
text-shadow: none;
color: var(--links);
padding: 20px 20px 10px 20px;
box-sizing: border-box;
width: 280px !important;
}

#MyBookmarks inner {
padding-top: 40px !important;
}

#BookmCntToggle.default-style {
background: var(--fill) !important;
border-radius: 2px;
box-shadow: 2px 2px 1px #000;
opacity: .95;
}

#MyBookmarks h2 {
margin: 0 !important;
padding: 10px 20px !important;
background: var(--fill2);
border-radius: 6px;
border: 1px solid var(--borders) !important;
box-sizing: border-box;
margin-bottom: 20px !important;
}

.post .bookmark {
color: var(--links) !important;
}

#BookmCntToggle.default-style {
color: var(--links) !important;
z-index: 9999
}

#BookmCntToggle {
top: 10px;
left: 60px !important;
}

#MyBookmarks {
z-index: 99999 !important;
}

#bm2 {
right: 20px !important;
}

#pun .scrl.t,
#pun .scrl.b {
box-shadow: none !important;
background: var(--fill2);
border: 1px solid var(--borders);
border-radius: 6px;
width: 110px;
}

.scrl.t+.scrl.b {
margin-left: 10px !important;
}

#imageupload-left input[type=button] {
width: auto !important
}

#pun-respect td {
padding: .8em !important;
overflow-wrap: normal
}

#pun hr {
opacity: 1;
filter: none;
background: #c1bdbd;
border: none;
height: 1px;
margin: .8em auto;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}

#pun hr:after {
content: "";
display: block;
background: var(--cover);
border: 1px solid var(--borders);
height: 7px;
width: 7px;
position: absolute;
transform: rotate(45deg)
}

#topic-feed {
display: none
}

#navpm {
position: relative
}

#pun .num_msg {
position: absolute;
margin-top: 0;
margin-right: 0px;
top: 0px;
right: -15px;
font-size: 10px;
font-weight: 700;
background: red;
padding: 1px 4px;
border-radius: 100px;
height: 14px;
color: #fff;
cursor: pointer;
z-index: 10
}

#pun .num_msg:before {
display: none
}

#pun-messages #togglePreview {
top: -15px
}

.post-content table {
border-radius: 5px;
overflow: hidden
}

img[alt~="hide-autor2"] {
opacity: 0;
display: none
}

#form-buttons {
margin-bottom: 0px !important;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  width: 100%;
flex-direction: row;
padding: 10px 0 5px;
align-items: flex-start;
}

#plng {
    font-size: 12px !important;
    font-weight: 300 !important;
    margin-top: 0px !important;
    padding: 5px 0px !important;
    transition: all 0.3s ease-in-out 0s;
  text-transform: uppercase;
  white-space: nowrap;
font-family: var(--font);
box-sizing: border-box;
display: flex;
align-items: center;
align-self: stretch
}

#plng b {
  font-weight: 800;
font-size: 10px;
margin-right: 5px
}

#form-buttons td img {
position: relative
}

#form-buttons tr {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  gap: 5px;
  flex-wrap: wrap;
}

#form-buttons table {
  flex: auto;
  display: flex;
  flex-wrap: wrap;
  padding: 0px 0;
}

#form-buttons td {
transition: all .5s ease-in-out 0s;
color: var(--text1);
  width: 22px;
}

#form-buttons td:hover {
color: var(--text1);
}

#button-font,
#button-transL,
#button-size,
#button-bold,
#button-italic,
#button-underline,
#button-strike,
#button-indent,
#button-left,
#button-center,
#button-right,
#button-justify,
#floatbut,
#button-link,
#button-spoiler,
#button-image,
#button-video,
#button-hide,
#button-quote,
#button-code,
#button-color,
#button-table,
#button-smile,
#button-sticker,
#button-keyboard,
#button-addition,
#button-mask,
#button-html,
#button-vkladka,
#My_replic_meny,
#button-ChangeСase,
#button-smstory,
#button-smpost{
position: relative !important;
background: none !important;
}

#button-font:before,
#button-transL:before,
#button-size:before,
#button-bold:before,
#button-italic:before,
#button-underline:before,
#button-strike:before,
#button-indent:before,
#button-left:before,
#button-center:before,
#button-right:before,
#button-justify:before,
#floatbut:before,
#button-link:before,
#button-spoiler:before,
#button-image:before,
#button-video:before,
#button-hide:before,
#button-quote:before,
#button-code:before,
#button-color:before,
#button-table:before,
#button-smile:before,
#button-sticker::before,
#button-keyboard:before,
#button-addition:before,
#button-mask:before,
#button-html:before,
#button-vkladka:before,
#My_replic_meny:before,
#button-ChangeСase:before,
#button-smstory:before,
#button-smpost:before {
content: "";
height: 26px;
width: 100%;
display: block;
position: absolute;
top: 0;
left: 0;
font-family: FontAwesome;
text-align: center;
font-size: 15px;
line-height: 26px;
z-index: 0
}

#button-font:before {content: "\f031"}
#button-transL:before {content: "\f362"}
#button-ChangeСase:before {content: "\f15e"}
#button-size:before {content: "\f034"}
#button-bold:before {content: "\f032"}
#button-italic:before {content: "\f033"}
#button-underline:before {content: "\f0cd";top: 1px}
#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"}
#floatbut:before {content: "\f03b"}
#button-link:before {content: "\f0c1"}
#button-spoiler:before {content: "\f070";font-size: 17px}
#button-image:before {content: "\f03e";font-size: 18px}
#button-video:before {content: "\f167";font-size: 18px;top: 0px}
#button-hide:before {content: "\f023"}
#button-quote:before {content: "\f10e"}
#button-code:before {content: "\f121";}
#button-color:before {content: "\f576"}
#button-table:before {content: "\f0ce"}
#button-smile {display: none}
#button-smile:before {content: "\f118"}
#button-sticker:before {content: "\f118"}
#button-vkladka:before {content: "\f58d"}
td#button-files_rusff,
td#button-graffiti_rusff {display: none !important;}
#button-keyboard:before {content: "\f11c";font-size: 16px}
#button-addition:before {content: "\f0fe"}
#button-mask:before {content: "\f630"}
#button-html:before {content: "\f1c9"}

.settings_wrap {
width: auto;
height: auto;
position: relative;
box-sizing: border-box;
margin-left: 20px
}

.slide_button {
width: auto;
height: auto;
  font: 400 10px/120% var(--font) !important;
cursor: pointer;
text-transform: lowercase;
padding: 0;
color: var(--text1);
text-align: right;
box-sizing: border-box;
letter-spacing: .1em;
position: relative
}

.slide_button.i_active {
color: var(--links)
}

.slide_block {
position: absolute;
background: var(--beg100);
width: 250px;
top: calc(100% + 5px);
display: none;
left: 50%;
transform: translateX(calc(-50% - 20px));
border-radius: 0 0 20px 20px
}

.settings_container {
display: flex;
flex-direction: column;
gap: 15px;
padding: 15px 20px 20px;
}

#chfont {
text-align: center;
display: flex;
gap: 5px;
align-items: center;
justify-content: flex-start;
flex-wrap: wrap;
box-sizing: border-box;
}

#chfont:before {
content: "шрифт в постах";
font: 300 8px var(--font);
text-transform: uppercase;
display: block;
margin-bottom: 5px;
color: var(--text1);
width: 100%;
text-align: left
}

#chfontbut {
display: none !important;
}

#chfont select {
cursor: pointer;
}

#chfontsize {
width: auto;
display: flex;
align-items: center;
font: 400 12px var(--font);
gap: 5px;
}


.fsizeplus,
.fsizeminus {
box-sizing: border-box;
color: var(--text1);
cursor: pointer;
font-size: 0;
width: 13px;
height: 13px;
text-align: center;
display: flex;
align-items: center;
justify-content: center
}

.fsizeplus::after {
content: "";
mask: url(https://forumstatic.ru/files/001c/b5/f3/27804.svg) no-repeat center center;
-webkit-mask: url(https://forumstatic.ru/files/001c/b5/f3/35178.svg) no-repeat center center;
mask-size: cover;
-webkit-mask-size: cover;
background: var(--text1);
width: 12px;
height: 12px;
display: block;
}

.fsizeminus::after {
content: "";
mask: url(https://forumstatic.ru/files/001c/b5/f3/92207.svg) no-repeat center center;
-webkit-mask: url(https://forumstatic.ru/files/001c/b5/f3/44265.svg) no-repeat center center;
mask-size: cover;
-webkit-mask-size: cover;
background: var(--text1);
width: 12px;
height: 12px;
display: block;
}

/*Размытие на зачеркнутый текст*/
del {
    filter: blur(3px);
    text-decoration: none;
    transition:.33s;
}
del:hover {
    filter: initial;
    transition:.63s;
}

#pun .post-content p {
padding: 0
}

#pun .post-content p + p {
margin-top: 1em
}

#pun .post-content p {
padding: 0
}

#pun .post-content p + p, #pun .post-content p + .code-box, #pun .post-content p + .quote-box {
margin-top: 1em
}

#pun-userlist #userlist, #pun-userlist .usertable, #pun-respect #pun-main table, #pun-positive #pun-main table, .section.online-list {
background: var(--main-bg);
border-radius: 15px;
}

.section.online-list {
padding: 10px 30px
}

#pun-userlist #userlist, #pun-userlist .usertable {
margin-bottom: 10px
}

#filetable tr {
 display: flex !important;
gap: 10px;
}

#filetable tr + tr {
margin-top: 10px !important;
}

#filetable .tc0.ft-image {
flex: 1;
max-width: 100px
}

#notify-link .unreads,
#navpm .unreads {
  display:flex;
justify-content: center;
align-items: center;
  position:absolute;
  top:-.2em !important;
  right:-1.5em !important;
  height:13px !important;
  width:13px !important;
min-width: 13px !important;
  padding:0 !important;
  box-sizing:border-box;
  text-align:center;
  border-radius:8px;
  font:normal 9px Tahoma,Verdana !important;
line-height: 140% !important;
  cursor:pointer;
  color:#fff;
  background:red;
box-shadow: none !important;
  text-shadow:none;
  z-index:1
}

.punbb .view-dialog .fs-box > .container, .punbb .view-search .fs-box > .container, .punbb .view-bookmarks .fs-box > .container {
padding-right: 10px !important;
}

#pun .nav-item-notifications a {
display: flex !important;
gap: 2px;
align-items: center;
}

#pun .bubble {
  position: relative;
  right: 0px;
  text-align: center;
  top: -1px !important;
}
#pun .bubble:after {
  display: none !important;
}

.banners_wrapper {
background: var(--footer) no-repeat bottom left;
height: 110px;
margin: 10px -30px -30px;
border-radius: 0 0 4px 4px;
border-top: 2px solid var(--borders-gray);
padding: 10px 40px 10px;
box-sizing: border-box;
display: flex;
}

.banners_wrapper div {
overflow-y: auto;
height: 65px;
gap: 3px;
flex-wrap: wrap;
width: 390px;
}

.banners_wrapper img {
width: 88px;
height: 31px;
object-fit: cover;
opacity: .7;
filter: grayscale(100%);
transition: all .4s linear 0s
}

.banners_wrapper img:hover {
opacity: 1;
filter: none
}

.banners_wrapper:before {
content: "";
background: var(--beg800);
width: 100%;
height: 15px;
display: block;
top: -17px;
left: 0;
position: absolute;
border-radius: 20px 20px 0 0
}

#header_wrapper {
background: var(--header);
height: 449px;
margin: 5px -30px 0;
padding: 0;
box-sizing: border-box;
font: medium 9px var(--font);
color: var(--text6);
position: relative;
}

.header_writers {
position: absolute;
top: 54px;
left: 684px;
transform: rotate(-5deg);
width: 120px;
}

.header_writers, .header_flood {flex: 1}
.header-title {display: none}

.header_writers p, .header_flood p, .header_episode p {
font-weight: bold;
display: flex;
gap: 2px;
align-items: center;
}

.header_post {
text-transform: none;
font-size: 9.5px;
line-height: 135%;
max-width: 130px;
position: absolute;
top: 120px;
left: 725px;
text-align: justify;
transform: rotate(11deg);
}

.header_post .header-title {
display: block;
text-align: center;
font: normal 19px var(--font-a);
}

.header_post > a {
display: block;
margin-top: 5px;
text-align: right;
}


.header_post a {
color: var(--accent4) !important;
font-weight: 550;
}

.header_post a:hover {
color: var(--text6) !important;
}

.header_writers {
position: absolute;
top: 114px;
left: 570px;
transform: rotate(-11deg);
}

.header_flood {
position: absolute;
top: 265px;
left: 65px;
}

.header_writers p, .header_flood p {
display: flex;
flex-direction: row;
font-size: 10px;
justify-content: center;
}

.header_episode {
        position: absolute;
top: 54px;
left: 687px;
transform: rotate(-5deg);
width: 120px;
}

.header_episode p {
display: flex;
flex-direction: column;
width: 100%;
font-size: 10px;
}

.header_episode p a {
color: var(--accent3) !important;
font-weight: 500;
        font-size: 9.5px;
}

.header_episode p a:hover {
color: var(--text1) !important;
}

.header_episode p span {
font-size: 11px;
color: var(--accent3);
font-weight: 300;
text-align: left;
align-self: stretch;
}

.header_episode p span a {
font-weight: 600;
color: var(--accent3) !important;
}

.header_episode p span a:hover {
color: var(--accent) !important;
}


.header_episode p {
text-align: left;
}

.header_post .header-title {
display: block;
}

.header_battle {
position: absolute;
background: var(--beg100);
border-radius: 5px;
border: 1px dashed var(--borders-pink);
box-shadow: inset 0 0 11.2px rgba(0, 0, 0, 0.43);
width: 86px;
height: 62px;
top: 106px;
left: 205px;
display: flex;
flex-direction: column;
gap: 4px;
padding: 2px 4px;
box-sizing: border-box;
justify-content: center;
align-items: center;
opacity: 1;
font-size: 11px;
flex-wrap: nowrap;
align-content: center;
}

.header_battle img {
height: 16px;
width: 21px;
object-fit: contain;
}

.header_battle p {
display: flex;
align-items: center;
gap: 5px;
}

.header_daily-link {
position: absolute;
top: 42px;
left: 145px;
}

.header_daily-link img {
transition: all .4s linear 0s
}

.header_daily-link img:hover {
filter: grayscale(100%);
opacity: .6
}

.header_banners {
display: flex;
flex-direction: column;
gap: 2px;
width: 180px;
max-height: 120px;
overflow-y: auto;
position: absolute;
top: 320px;
left: 765px;
}

.header_banners a {
background: var(--beg700);
border-radius: 5px;
padding: 3px 15px;
height: 19px;
box-sizing: border-box;
display: flex;
flex-direction: row-reverse;
justify-content: flex-end;
gap: 5px;
align-items: center;
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.33), inset 0 0 4px 0 rgba(0, 0, 0, 0.19);
transition: all .6s cubic-bezier(0.25, 1, 0.5, 1) 0s !important;
text-shadow: 1px 1px 0 rgba(0,0,0,.5);
color: var(--text3) !important;
}

.header_banners a:hover {
background: var(--accent3)
}

.header_banners em {
font-style: italic;
padding: 0 0 5px;
color: var(--text3) !important;
}

.header_banners span {
color: var(--text3);
font-size: 9px;
}


.nav_wrap {
position: absolute;
z-index: 11
}

.nav_wrap.quick-link {
top: 332px;
left: 144px;
}

.nav_wrap.quick-link .slide_button {
background: var(--nav);
height: 94px;
width: 159px;
font-size: 0 !important;
display: flex;
align-items: center;
}

.slide_button.i_active {
opacity: .5
}

.nav_wrap .slide_block {
        left: 0;
        transform: unset;
        border-radius: 10px;
        top: -182%;
        background: var(--beg100);
        width: 100%;
        left: 45%;
}


.slide_block .link {
display: flex;
padding: 10px;
flex-direction: column;
text-align: center;
gap: 2px;
}

.slide_block .link a {
background: var(--beg700);
color: var(--text3) !important;
text-transform: uppercase;
text-shadow: 1px 1px 0 rgba(0,0,0,.6);
font: 400 8px var(--font);
padding: 3px 15px;
border-radius: 15px;
transition: all .3s linear 0s
}

.slide_block .link a:hover {
background: var(--accent3);
color: var(--text3) !important;
}

.nav_wrap.next-post {
top: 198px;
left: 463px;
}

.nav_wrap.next-post .slide_button {
background: var(--next-post);
height: 23px;
width: 35px;
font-size: 0 !important;
display: flex;
align-items: center;
}

.next-post .slide_block {
border-radius: 10px !important;
width: 250px
}

.next-post .link a {
display: flex;
align-items: center;
gap: 5px;
}

.next-post a em {
color: var(--text3);
font-style: italic;
}

.header_ams {
position: absolute;
top: 0px;
left: 380px;
z-index: 1
}

.header_ams img {
transition: all .3s linear 0s;
}

.header_ams a:hover img {
filter: brightness(0.77) grayscale(30%);
opacity: .25
}

.header_ams a {
position: absolute
}

.header_ams a:nth-child(1) {
top: 0;
left: 30px;
}

.header_ams a:nth-child(2) {
top: 10px;
left: 62px;
}

.header_ams a:nth-child(3) {
top: 5px;
left: 95px;
}

.header_ams a:nth-child(4) {
top: 13px;
left: 127px;
}

.header_ams a:nth-child(5) {
top: 52px;
left: 62px;
}

.header_ams a:nth-child(6) {
top: 46px;
left: 97px;
}

.header_ams a:nth-child(7) {
top: 52px;
left: 131px;
}

.header_ams a:nth-child(8) {
top: 20px;
left: 162px;
}

#stylelist {
position: absolute;
display: flex;
gap: 4px;
font: 400 11px var(--font);
top: 370px;
left: 620px;
}

#stylelist li {
display: flex;
align-items: center;
gap: 5px;
position: relative;
}

#pun #stylelist li a {
text-transform: none;
padding: 0 !important;
background: transparent;
font-size: 0;
width: 23px;
height: 23px;
display: block
}

#stylelist li:after {
content: "\f00c";
font-family: FontAwesome;
font-size: 6px;
width: 10px;
height: 10px;
display: flex;
justify-content: center;
align-items: center;
top: 1px;
left: 0;
position: absolute;
opacity: 0;
transition: all .3s linear 0s;
color: var(--text3);
background: var(--dark400);
border-radius: 100%
}

#stylelist li.active:after {
opacity: 1
}

#stylelist li.active a {
font-weight: 500 !important;
}

#MyBookmarks {
    display: none;
    position: fixed;
    z-index: 101;
    left: 0;
    top: 0;
    right: 0;
    height: 100%;
    box-shadow: 0 0 20px rgba(0, 0, 0, .5);
    width: 240px;
    background: #090909 !important;
}

Цвета style_cs.1788728497.css
body {
background:
var(--base-bg) no-repeat fixed bottom left / cover;
}

#pun-title {
display: none
}

#pun-navlinks ul a {
color: #d9d9d9;
transition: all .3s cubic-bezier(.64, .51, .55, 1.16) 0s !important;
font: normal 16px var(--font-a) !important;
text-transform: lowercase;
position: relative;
height: auto;
text-align: left !important;
display: flex;
justify-content: flex-start;
align-items: center;
        padding: 0px !important;
position: relative;
z-index: 1;
letter-spacing: .001em
}


#pun-navlinks ul.container a:hover {
color: var(--gold) !important;
}

#pun-navlinks>ul {
display: flex;
gap: 20px;
justify-content: center;
align-items: center;
height: auto;
padding: 0 !important;
text-align: center;
width: auto;
height: 100%;
}

#pun-navlinks {
display: block;
font-size: 0px !important;
height: 35px;
width: 1000px;
text-align: left;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
padding: 0px 0px;
top: 0;
z-index:10;
box-sizing: border-box;
margin-left: -30px !important;
position: absolute;
background: var(--dark400);
}

#pun-navlinks.fixed {
background: var(--dark400);
top: 0;
position: fixed;
height: 30px;
padding: 0;
}

#pun-navlinks.fixed > ul a:hover {
color: var(--gold) !important;
}

#navawards {
display: none !important;
}

#pun-ulinks {
box-sizing: border-box;
margin: 0px -30px 0 !important;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
top: auto;
z-index: 9;
background: var(--beg800);
border-bottom: 1px solid var(--borders-gray) !important;
}

#pun-ulinks .container {
padding: 0px !important;
text-align: left;
display: flex;
gap: 20px;
}

#pun-ulinks a {
font: 400 10px/120% var(--font) !important;
color: var(--text1) !important;
padding: 0 !important;
margin: 0 !important;
text-transform: lowercase;
letter-spacing: .1em
}

#pun-ulinks a:hover {
color: var(--links) !important;
}

#pun-ulinks.section {
margin: 0
}

.punbb-admin #pun-navlinks {
position: sticky;
background: var(--dark400);
top: 0
}

.punbb-admin #pun-status {
position: relative;
top: 0;
}


.offctgr {
display: block !important;
visibility: visible !important;
}

#profilenav h2 {
text-align: left !important;
}

/*фон авто*/
.post-author {
width: 224px;
font: 400 10px/100% var(--font);
margin-bottom: 10px;
box-sizing: border-box;
margin: 0px !important;
padding: 44px 9px 28px;
position: relative;
z-index: 1;
background: 
url(https://forumstatic.ru/files/001c/b5/f3/83740.png) no-repeat top center / cover;
overflow: hidden;
color: var(--text1);
border-radius: 10px;
}

.post-author p.pa-author {
padding-bottom: 10px !important;
}

.post-author>ul {
box-sizing: border-box;
text-align: center !important;
box-sizing: border-box;
margin: 0px;
padding: 13px 0 0 !important;
color: var(--text1);
display: flex;
flex-direction: column;
gap: 5px;
align-items: center;
background: var(--beg900);
position: relative;
border-radius: 10px
}

#pun .post-author>ul a {
color: var(--links)
}

#pun .post-author>ul a:hover {
color: var(--accent3)
}

.post[data-group-id="3"] .pa-avatar .indOffline {
display: none;
}

.pa-author {
font: bold 18px var(--font-a) !important;
text-align: center !important;
align-self: stretch;
}


#pun .pa-author a {
flex: 1
}

.pa-author span.flag-i {
display: none !important;
}

.pa-title {
text-align: center;
font-weight: 400 !important;
align-self: stretch;
opacity: .5;
padding: 5px 0 0px !important;
font-size: 9px;
text-transform: lowercase;
letter-spacing: .1em;
}

.pa-avatar img {
max-width: 180px;
}

.field_wrap2 {
width: auto;
display: flex;
justify-content: center;
gap: 10px;
align-self: stretch;
}

.pa-posts, .pa-respect, .pa-fld2, .pa-fld3 {
    text-align: center;
    font-size:9px;
line-height: 120%;
padding: 0px !important;
height: auto;
box-sizing: border-box;
font-weight: 500;
color: var(--text1)
}

.pa-posts .fld-name, .pa-respect .fld-name, .pa-fld2 .fld-name, .pa-fld3 .fld-name {
font-weight: 300;
text-transform: lowercase;
display: block;
font-size: 7px;
}

.pa-respect img {
  display: none
}

.indOnline,
.indOffline {
  display: flex !important;
  position: absolute;
  z-index: 1;
  top: 11px;
  left: 13px;
  width: 12px;
  height: 12px;
  align-items: center;
  justify-content: center;
  border: none !important;
  border-radius: 50%;
  box-sizing: border-box;
  background: transparent;
  cursor: pointer;
  font-size: 0 !important;
  mask: none !important;
  -webkit-mask: none !important;
}

.indOnline::before,
.indOffline::before {
  content: "\25D0"; /* ◐ */
  color: var(--wine);
  font: 12px/1 Arial, sans-serif;
}

.indOnline {
  opacity: 1;
}

.indOffline {
  opacity: 0.35;
}

.pa-fld1 .fld-name {
display: none
}

.pa-fld1 {
margin: -5px -13px 5px !important;
background: var(--beg900);
border-bottom: 1px solid var(--borders);
padding: 10px 13px !important;
}

.lz_wrap {
display: flex !important;
flex-direction: column;
gap: 2px;
}

.lz_ank {
font: normal 12px var(--font);
text-transform: lowercase
}

.lz_desc {
  padding-top: 2px;
  text-align: center;
  text-transform: lowercase;
}

.lz_desc a {
text-shadow: 1px 1px 0 rgba(0,0,0,.1);
color: var(--links) !important;
font-weight: 600
}

.lz_desc a:hover {
color: var(--text1) !important;
}

.pa-fld4 .fld-name {
display: none
}

.pa-fld4 {
margin: 5px -13px -13px !important;
border-radius: 0 0 10px 10px;
overflow: hidden;
align-self: stretch
}

.personal_banner {
background: #BD2C4A;
height: 30px;
display: flex !important;
flex-direction: column;
justify-content: center;
align-items: center;
color: var(--text3);
text-shadow: 1px 1px 0 rgba(0,0,0,.5);
font: normal 7px var(--font);
letter-spacing: .1em;
padding: 0 !important;
min-width: 180px
}

.pa-fld5 .fld-name {
display: none;
}

.pa-fld5 {
background: var(--beg100);
padding: 2px 15px !important;
border-radius: 3px;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.39);
margin: -30px 0 0 !important;
}

.modal-link img {
width: 25px;
height: 30px;
object-fit: contain;
}

.pa-online,
.pa-reg,
.pa-last-visit {
display: none;
}

.punbb th {
font-size: 0 !important;
}

.lastedit {
display: none !important;
}

.pa-gifts,
.pa-ua {
display: none !important;
}

.punbb .section .container,
.punbb .post-body,
.punbb .post-links,
.punbb td.tc2,
.punbb td.tc3,
.punbb .formal fieldset .post-box,
#viewprofile li strong,
#viewprofile li div,
#setmods dd,
.punbb .info-box,
.punbb #pun-main .info-box .legend,
.punbb .main .container,
.punbb .post .container,
.punbb .post h3,
.punbb-admin #pun-admain .adcontainer,
#pun-title,
#pun-title .container,
.punbb .modmenu .container,
.punbb legend span,
#viewprofile h2 span,
#profilenav h2 span,
.punbb-admin #pun-admain legend span,
.punbb .post h3 span,
.punbb th,
#viewprofile li,
#setmods dl {
border-color: transparent;
}

.punbb .post-box {
text-align: left
}

#pun-stats h2,
.punbb .main h1,
.punbb .main h2,
#pun-debug h2,
.punbb-admin #pun-admain h2 {
border-color: transparent;
font-style: normal;
font-weight: normal;
}

#pun #post-form {
position: relative;
margin: 0px 0px 10px;
padding: 0px !important;
}

#pun-messages #post-form {
margin-top: 10px
}

#post-form .formal span.input, #post-form .areafield.required {
padding: 0 !important;
}

.punbb textarea {
box-sizing: border-box;
border: 1px solid var(--borders) !important;
background: var(--beg100);
padding: 15px !important;
color: var(--text1);
width: 100% !important;
border-radius: 4px;
}

.punbb #pun-main .quote-box,
.punbb #pun-main .code-box {
padding: 0 !important;
position: relative;
text-align: justify;
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-direction: column;
gap: 2px;
overflow: visible;
box-sizing: border-box;
}

#pun-main .quote-box blockquote, #pun-main .code-box .blockcode {
    box-sizing: border-box;
    width: 100% !important;
    background: var(--beg300);
    border-radius: 4px;
    padding: 15px;
}

#pun .quote-box.spoiler-box {
    box-sizing: border-box;
    padding: 0 !important;
    overflow: hidden;
    background: var(--dark600-const);
    border-radius: 4px;
    padding: 15px;
}

.quote-box.spoiler-box>blockquote {
padding: 10px 15px !important;
box-sizing: border-box;
border: none !important;
margin: -2px 0 0 !important;
width: auto !important;
border-top: 1px solid var(--beg100) !important;
border-radius: 0 !important;
}

.quote-box.spoiler-box .spoiler-box {
border: 1px solid var(--beg100) !important;
}

.quote-box.spoiler-box>div {
color: var(--text3);
  padding: 5px 15px 4px !important;
font-family: var(--font);
font-weight: 500;
line-height: 150%
}

#pun .post-content .spoiler-box > div {
  background:transparent;
  position: relative;
width: 100%;
box-sizing: border-box
}

#pun .post-content .spoiler-box > div:before {
  content: "";
mask: url(https://forumstatic.ru/files/001c/b5/f3/30218.svg) no-repeat center center;
-webkit-mask: url(https://forumstatic.ru/files/001c/b5/f3/30218.svg) no-repeat center center;
mask-size: cover;
-webkit-mask-size: cover;
background: var(--beg100);
  width: 14px;
  height: 14px;
  transition: transform .5s ease-in-out 0s;
  box-sizing: border-box;
display: block;
margin-right: 10px;
float: left
}

#pun .post-content .spoiler-box > div.visible:before {
mask: url(https://forumstatic.ru/files/001c/b5/f3/65264.svg) no-repeat center center;
-webkit-mask: url(https://forumstatic.ru/files/001c/b5/f3/65264.svg) no-repeat center center;
mask-size: cover;
-webkit-mask-size: cover;
background: var(--text3);
}

#pun .post-content {
    overflow-wrap: anywhere;
}

#pun .quote-box cite,
#pun .code-box strong.legend {
display: block;
font-size: 8px;
text-transform: none;
font-family: var(--font);
margin-top: 0px !important;
padding: 5px 10px 18px;
margin-bottom: -15px;
text-align: left;
font-weight: 600;
color: var(--text3);
width: 100%;
box-sizing: border-box;
background: var(--dark600-const);
    text-transform: uppercase;
    border-radius: 4px;
}

#pun .quote-box cite a,
#pun .code-box strong.legend a {
color: var(--text3) !important;
}

#pun .quote-box cite a:hover,
#pun .code-box strong.legend a:hover {
color: var(--accent) !important;
}

#pun-main .code-box .scrollbox pre {
font-size: 11px;
font-family: 'Inter';
white-space: break-spaces
}

.punbb select,
input {
border: 0;
padding: 2px 15px 2px 15px !important;
color: var(--text1);
border: 1px solid var(--borders) !important;
background: var(--beg900);
font: 400 10px var(--font), verdana !important;
box-sizing: border-box;
border-radius: 10px
}

#pun-navlinks .container {
border-color: transparent;
color: #152115;
}

.offline li.pa-online strong {
font-weight: normal;
}

.punbb .container,
.punbb .post-body,
.post h3,
#pun-title,
.punbb .section,
.punbb .forum,
.punbb .formal,
.punbb .modmenu,
.punbb .info,
.punbb .category,
.punbb .post,
#pun-stats h2,
.punbb .main h1,
.punbb .main h2,
#pun-debug h2,
.punbb-admin #pun-admain h2,
.punbb td,
.punbb fieldset,
#viewprofile ul,
#profilenav ul,
.punbb .post .post-body,
.punbb .post h3 span,
.post-links ul,
.post-links,
.usertable table,
#pun-ulinks li,
#pun-announcement h2 span,
li#onlinelist,
#pun-help .formal .info-box h3.legend span,
#pun-ulinks li a,
#pun-announcement h2,
li#onlinelist div,
#pun-help .formal .info-box h3.legend,
.punbb .divider,
.punbb .quote-box,
.punbb .code-box,
.punbb th,
.punbb .formal fieldset .post-box,
.punbb .info-box,
li.pa-online,
.punbb .post-sig dt {
border-color: transparent;
}

.punbb a,
.punbb a:link,
.punbb a:visited,
.punbb-admin #pun-admain a,
.punbb-admin #pun-admain a:link,
.punbb-admin #punbb-admain a:visited,
.punbb li.isactive a,
.punbb li.isactive a:link,
.punbb li.isactive a:visited {
border-bottom: 0 none #000;
color: var(--accent3);
text-decoration: none;
transition: color 0.3s ease-in-out;
}

.punbb a:hover,
.punbb a:focus,
.punbb a:active,
.punbb-admin #pun-admain .nodefault,
.punbb-admin #punbb-admain a:hover,
.punbb-admin #punbb-admain a:focus,
.punbb-admin #punbb-admain a:active {
border-bottom: 0 none #000;
color: var(--links2);
text-decoration: none;
}

#pun-pagelinks a:active,
#pun-pagelinks a:focus {
background-color: #211a13;
color: #fff;
}

h1 {
display: none
}

h2, h1 {
font: 200 8px var(--font) !important;
color: var(--text1);
text-transform: uppercase
}

#MyBookmarks h2 {
display: block
}

#pun-index h2 {
box-shadow: none;
border: 0 !important
}

#pun-main div.catleft,
#pun-main div.catright {
display: none;
}

#pun-index table Div.icon {
display: none
}

div.icon {
margin-right: 10px;
box-sizing: border-box;
margin-top: 1px !important;
  width: 20px;
  height: 20px;
clip-path: polygon(98.2962913145% 62.9409522551%, 62.9409522551% 98.2962913145%, 14.6446609407% 85.3553390593%, 1.7037086855% 37.0590477449%, 37.0590477449% 1.7037086855%, 85.3553390593% 14.6446609407%);
-webkit-clip-path: polygon(98.2962913145% 62.9409522551%, 62.9409522551% 98.2962913145%, 14.6446609407% 85.3553390593%, 1.7037086855% 37.0590477449%, 37.0590477449% 1.7037086855%, 85.3553390593% 14.6446609407%);
background: var(--text1);
opacity: .2
}

.inew div.icon {
background: var(--accent);
opacity: 1
}

.isticky div.icon {
background: var(--links);
opacity: 1
}

.iclosed div.icon {
background: var(--text1);
opacity: 1
}


#pun-about p.container {
height: auto;
width: auto;
padding: 0 0 0px !important;
border: 0 !important;
font-size: 9px;
  font-family: var(--font);
text-align: center;
font-weight: 400;
}

#pun-about {
border: 0 !important;
padding: 3px 10px !important;
margin: 0 !important;
margin-top: 10px !important;
}

div#html-footer {
margin: 0px 0 0;
margin: 0px 0 0;
padding: 0px !important;
}

#pun-announcement.section h2 span {
display: none;
}

.punbb input {
border: medium none;
}

.button,
#pa-edit strong a,
input[type="button"],
button[type="button"] {
    background: transparent;
    border: none !important;
    color: var(--text3) !important;
    font-family: var(--font) !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    margin-top: 0px !important;
    padding: 3px 15px 5px !important;
    text-decoration: none;
    transition: all 0.3s ease-in-out 0s;
    text-transform: lowercase;
}

.button:hover,
#pa-edit strong a:hover,
input[type="button"]:hover,
input.active[type="button"],
button[type="button"]:hover {
cursor: pointer;
color: var(--text3) !important;
}

/* Кнопка редактирования на штатной странице профиля */
#pun-profile #pa-edit strong a {
  background: var(--wine) !important;
  border-radius: 4px !important;
}

input[type="button"] {
margin-bottom: 0
}

.dicebutton {
background: var(--links) url(https://forumstatic.ru/files/001c/b5/f3/89593.svg) no-repeat center !important;
font-size: 0 !important;
height: 23px;
width: 23px;
box-sizing: border-box;
transition: all 0.3s ease-in-out 0s;
}

.dicebutton:hover {
background: var(--accent) url(https://forumstatic.ru/files/001c/b5/f3/89593.svg) no-repeat center !important;
}

.button:active {
border-top-color: #2c5f75;
}

#pun-crumbs1 p.container,
#pun-crumbs2 p.container {
font: 400 11px var(--font);
text-transform: lowercase;
text-align: center;
border: none;
color: var(--text1);
padding: 0px
}

#pun-crumbs1 a,
#pun-crumbs2 a {
font-weight: 600;
}

#pun-crumbs1 p {
margin-bottom: 0px
}

#pun-crumbs1,
#pun-crumbs2 {
margin: 10px 0 10px !important;
position: relative;
z-index: 1;
}

#pun-crumbs1 .container strong+em,
#pun-crumbs2 .container strong+em {
display: none !important;
}

.post_reputation {
border: 1px solid var(--borders) !important;
background: var(--beg100);
border-radius: 10px;
color: var(--text1);
padding: 15px 20px !important;
}

#font-area,
.popup_graffiti,
#size-area,
#image-area,
#color-area,
#addition-area,
#video-area,
.inner .popup_graffiti,
#table-area,
#keyboard-area,
#smilies-area,
#spoiler-area,
#meny_My_replic {
border: 1px solid var(--borders) !important;
background: var(--beg100);
border-radius: 10px;
color: var(--text1);
padding: 15px 20px !important;
}

#keyboard-area input {
box-shadow: none;
}

#font-area {
height: 300px;
overflow-y: auto;
padding: 5px;
text-align: left;
width: 150px
}

#pun-index .tcmod {
display: none
}

#pun .category + .category {
margin-top: 15px
}

#pun .category h2, #pun-stats h2 {
margin: 0 0px -10px !important;
height: 38px;
display: flex;
justify-content: flex-end;
align-items:center;
position: relative;
text-align: left;
gap: 0px;
padding: 0 0 12px;
padding-right: 167px;
background: var(--cat);
border-radius: 15px 15px 0 0;
box-sizing: border-box
}

#pun .category h2 span, #pun-stats h2 span {
margin: 0 600px 0px 0 !important;
font: bold 10px/100% var(--font);
color: var(--text6);
text-shadow: -1px 0.5px var(--beg100);
position: relative;
box-sizing: border-box;
text-transform: lowercase
}

#pun-index .category tr + tr {
margin-top: 15px
}

#pun-index .category .container {
background: var(--beg900);
padding: 20px;
position: relative;
border-bottom: 1px solid var(--borders-gray) !important;
}

.category tr {
font: 300 10px var(--font);
display: flex;
align-items: center;
gap: 50px;
justify-content: flex-start;
padding: 0 0 25px;
box-sizing: border-box;
position: relative;
z-index: 1;
border-bottom: 1px solid rgb(0 0 0 / 7%);
}

.category tr:last-child {
border: none;
padding: 0
}

#pun-index #pun-category1 {
margin-top: 0 !important;
}

#pun-index .category td {
border: 0 !important;
padding: 0 !important;
}

#pun-index thead {
display: none
}

#pun-index .category .tcl {
width: 630px;
box-sizing: border-box;
position: relative;
display: flex;
gap: 15px;
align-items: flex-start;
padding-left: 65px !important;
}

#pun-index .tcl:before {
content: "";
display: block;
background: var(--icons) center / contain no-repeat;
width: 51px;
height: 50px;
top: 5px;
left: 0px;
position: absolute;
opacity: .5;
filter: grayscale(1) sepia(.45) saturate(.8) hue-rotate(35deg) brightness(.72);
}

#pun-index tr.inew .tcl:before {
filter: sepia(.8) saturate(1.4) hue-rotate(350deg) brightness(1.05);
opacity: 1
}

#pun-index tr:not(.inew) .tclcon h3 a {
color: var(--ink) !important;
}

#pun-index tr:not(.inew) .tclcon h3 a:hover {
color: var(--wine) !important;
}

#pun-index .tclcon > br {
display: none
}

#pun-index .tclcon {
position: relative;
font-size: 10px;
width: auto;
color: var(--text1);
text-align: justify;
display: flex; 
flex-direction: column;
gap: 5px
}

#pun-index .tclcon h3 a {
font: normal 22px/100% var(--font-b) !important;
text-transform: lowercase;
color: var(--links);
}

#pun-index .tclcon h3 a {
position: relative;
display: inline-flex;
flex-direction: column;
align-items: flex-start;
}

#pun-index .tclcon h3 a:hover {
color: var(--accent3) !important;
}

.f_wrap {
display: flex;
flex-direction: column;
gap: 5px;
}

.f_desc {
font-size: 11px;
color: var(--text1)
}

.f_links {
display: flex;
gap: 3px;
flex-wrap: wrap;
margin-top: 5px !important;
}

.f_links a {
font-size: 9px;
font-weight: 400;
color: var(--text3) !important;
background: var(--links2);
padding: 1px 15px 1px;
border-radius: 5px;
box-shadow:  0 2px 3px 0 rgba(0, 0, 0, 0.33);
text-shadow: 1px 1px 0 rgba(0,0,0,.5);
transition: all .3s linear 0s !important;
}

.f_links a:hover {
background: var(--accent3)
}

.f_link line {
display: contents
}

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

.tcr {
line-height: 120%;
padding-left: 0 !important;
margin: 0 0px !important;
}

#pun-index td.tcr {
flex: 1;
text-align: left;
display: flex;
align-items: center;
align-self: stretch;
padding: 0 !important;
}

#pun-index .tcr a.lastpost-link {
font-weight: 600;
font-size: 12px;
display: block;
height: auto;
line-height: 140%;
color: var(--links)
}

#pun-index .tcr a.lastpost-link:hover {
color: var(--accent3)
}

.category td+td {
padding: 0 0px;
}

#pun {
background-position: center top;
background-repeat: repeat-y;
}

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

.punbb .post {
border-color: transparent;
}

.topic a.sharelink {
display: none;
}

textarea#main-reply:focus {
outline: 1px solid rgba(0, 0, 0, 0) !important;
}

html .hvStickerPackModal {
background:
 var(--beg900);
box-shadow:
none !important;
left: 0;
border: 1px solid var(--borders) !important;
box-sizing: border-box !important;
border-radius: 15px
}

.hvStickerPackModal .hvStickerPackModalContent {
border: none !important;
background: var(--beg100);
padding: 15px 20px !important;
border-radius: 13px;
}

.hvStickerPackModalTab {
background: var(--beg900) !important;
color: var(--text1);
font-family: var(--font) !important;
font-size: 9px !important;
font-weight: 700 !important;
padding: 4px 15px 5px !important;
text-transform: uppercase;
border-radius: 15px !important;
}

.hvStickerPackModalTab.active {
background: var(--beg700) !important;
color: var(--text3)
}

.hvStickerPackModalAdd {
display: flex;
align-items: stretch;
}

.hvStickerPackModalInput {
border: none !important;
border-radius: 0 !important;
}

input.hvStickerPackModalAddButton {
box-shadow: none !important;
margin-bottom: 0 !important;
font-size: 12px !important;
border-radius: 0 !important;
}

#topic-users-in .container {
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-wrap: wrap;
line-height: 110% !important;
gap: 5px;
align-items: center
}

#topic-users-in a {
height: auto !important;
line-height: inherit !important;
font-weight: 700;
font-size: 9px;
text-transform: uppercase;
}

#float {
  background: var(--beg100);
  border: 1px solid var(--borders);
  width: auto;
  padding: 10px 15px;
  position: absolute;
  top: 20%;
  right: 40px;
  z-index: 20;
  font: 500 9px var(--font);
  text-transform: uppercase;
  border-radius: 12px;
}

.html_themes-wrapper {
background: var(--beg100);
width: 100%;
margin: auto;
border-radius: 10px;
box-sizing: border-box;
font: 400 10px var(--font)
}

.html_themes-header {
background: var(--html-img1);
height: 155px;
border-radius: 10px;
padding: 20px;
box-sizing: border-box;
justify-content: center;
display: flex;
align-items: center
}

.html_themes-body {
margin-top: -13px !important;
padding: 0px 30px 20px;
}

*{box-sizing:border-box}html{scroll-behavior:auto !important}body{margin:0;min-width:1040px;background:#14130f var(--world) center top/cover fixed no-repeat;color:#323232;font:11px/1.45 Inter,Arial,sans-serif}
a{color:inherit;text-decoration:none}

.forum-nav{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;width:1000px;height:30px;margin:13px auto 0;border-radius:3px 3px 0 0;background:var(--coal);font:700 12px Alegreya Sans SC,sans-serif;text-transform:uppercase}.forum-nav a{padding:8px 13px;color:#e6e6e6}.forum-nav a:hover,.forum-nav .is-active{color:var(--gold)}
.forum-shell{position:relative;width:1000px;margin:auto;background:var(--shell);border-radius:0 0 3px 3px;box-shadow:0 12px 45px #0008}.forum-header{position:relative;height:400px;background:var(--header) center/100% 100% no-repeat;overflow:hidden}.header-hotspot{position:absolute}.hotspot-nav{left:18px;top:232px;width:63px;height:120px}.hotspot-admin{left:300px;top:248px;width:70px;height:55px}.header-badge{position:absolute}.header-badge img{display:block;width:45px;height:72px;object-fit:cover;border-radius:3px;filter:sepia(.9) saturate(.9)}.header-badge span{position:absolute;left:-54px;top:-34px;width:95px;text-align:center;background:#e8e5d9;border:1px solid #817a68;font-size:8px}

.badge-active {
    left:660px;
    top:109px;
}

.badge-active a {
    display:block;
    transform:rotate(-.4deg);
}


.badge-writer{left:693px;top:214px}.badge-writer span{left:-25px;top:77px}.header-post{position:absolute;left:800px;top:60px;width:163px;height:285px;padding:16px 11px 14px;color:#323232}.header-post h2{margin:0 0 7px;color:#8c5b16;font:31px Oranienbaum,serif}.header-post p{height:193px;margin:0;overflow:hidden;text-align:justify;font-size:10px;line-height:17px}.header-post a{float:right;color:#a87138;font-weight:700;text-transform:lowercase}.header-episode{position:absolute;left:668px;top:320px;width:135px;text-align:center;color:#652b16;font:18px/1 Oranienbaum,serif}.profile-trigger{position:absolute;left:54px;bottom:0;width:185px;height:18px;border:0;background:transparent;color:var(--ink);font:600 9px Inter;text-align:left;text-transform:uppercase;cursor:pointer}
.user-links{display:flex;justify-content:center;height:21px;background:#dad4ca;color:var(--ink);font-size:10px}.user-links a{display:grid;place-items:center;padding:0 16px}.news-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding:10px 52px 9px}.news-strip a{display:flex;min-height:33px;flex-direction:column;justify-content:center;border:1px solid #dad4ca;border-radius:3px;background:var(--wine);box-shadow:1px 2px 2px #0004;color:#f4f4f4;text-align:center}.news-strip a:nth-child(even){background:var(--ochre)}.news-strip strong{font-size:9px}.news-strip em{font-size:9px;font-weight:300}.breadcrumbs{height:26px;text-align:center;color:#777765;font-weight:600}
.category,.statistics{margin:0 20px 18px;background:var(--paper)}

.category>h1,
.statistics>h2{display:grid;place-items:center;height:40px;margin:0; background:url('https://forumstatic.ru/files/001c/b5/f3/66003.png') center/cover no-repeat}

.category>h1 span,.statistics>h2 span{padding:2px 48px;border:3px double #ada492;background:#ddd6cd;color:#777;font-size:10px;font-weight:600}.forum-row{display:grid;grid-template-columns:55px 1fr 190px;gap:13px;align-items:center;min-height:133px;margin:0 32px;padding:18px 0;border-bottom:1px dashed #aaa}.forum-row:last-child{border:0}.forum-row.muted{filter:saturate(.55)}.forum-icon{display:grid;place-items:center;width:43px;height:43px;border:2px solid #a87138;border-radius:50%;color:#a87138;font-size:26px}.forum-copy h2{margin:0;color:#8c5b16;font:25px Oranienbaum,serif}.forum-copy p{margin:2px 0 9px;font-size:10px;font-style:italic;line-height:1.2}.forum-copy b,.stats-pills b{display:inline-block;min-width:85px;margin-right:7px;padding:2px 10px;background:var(--ochre);color:#eee;text-align:center;font-size:8px}.forum-copy b:nth-child(even),.stats-pills b:nth-child(even){background:var(--wine)}.last-post{display:grid;/* grid-template-columns:35px 1fr; */grid-template-rows:1fr 1fr;color:#9b5f52}.last-post .avatar{grid-row:1/3;width:31px;height:31px;border-radius:50%;background:url('https://forumstatic.ru/files/001c/b5/f3/66003.png') center 20%/cover}.last-post small{color:#777}.statistics{padding-bottom:22px}.stats-pills{padding:12px 36px}.stats-pills b{padding:7px 12px;font-size:8px}.statistics p{margin:5px 36px;color:#6a684f;font-size:10px}.forum-footer{height:150px;margin-top:20px;background:var(--footer) center/100% 100% no-repeat}

.profile-modal[hidden]{
display:none
}

.profile-modal{
position:fixed;
z-index:10000;
inset:0;
display:grid;
place-items:start center;
padding-top:55px
}

.modal-backdrop{
position:absolute;
inset:0;
border:0;
background:#111b;
backdrop-filter:blur(12px)
}

.profile-card{
position:relative;
width:850px;
min-height:530px;
overflow:hidden;
border:1px solid #9a8d72;
border-radius:4px;
background:#cec8bc url('https://forumstatic.ru/files/001c/b5/f3/66003.png') right bottom/47% auto no-repeat;
box-shadow:0 24px 90px #000
}

.modal-close{position:absolute;right:12px;bottom:10px;border:0;border-radius:3px;background:var(--coal);color:#eee;padding:5px 17px;cursor:pointer}

.profile-card__head{display:flex;align-items:center;gap:22px;height:185px;padding:25px 45px;background:linear-gradient(90deg,#24231edb,#24231eaa),url('https://forumstatic.ru/files/001c/b5/f3/66003.png') center/cover;color:#eee}.profile-avatar{width:118px;height:118px;border:5px double #c6a66b;border-radius:50%;

background:url('https://forumstatic.ru/files/001c/b5/f3/66003.png') center 18%/cover
}

.profile-card__head small{color:var(--gold);text-transform:uppercase}.profile-card__head h2{margin:3px 0;color:#e5d0a1;font:40px Oranienbaum}.profile-card__head p{margin:0;text-transform:lowercase}.profile-tabs{display:flex;height:35px;background:var(--coal)}.profile-tabs button{flex:1;border:0;background:transparent;color:#ddd;font:700 11px Alegreya Sans SC;text-transform:uppercase;cursor:pointer}.profile-tabs button.is-active{background:var(--wine);color:#fff}.profile-panel{display:none;min-height:270px;padding:35px 55px}.profile-panel.is-active{display:block}.profile-panel h3{margin:0 0 18px;color:#8c5b16;font:28px Oranienbaum}.profile-panel p{max-width:520px;font-size:12px}.profile-facts{display:flex;gap:12px;margin-top:28px}.profile-facts span,.relation-grid article{padding:12px 18px;border:1px solid #aaa08e;background:#e3ded5}.profile-facts b{display:block;color:var(--wine);font-size:9px;text-transform:uppercase}.relation-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.swatches{display:flex;gap:14px}.swatches i{width:90px;height:90px;border:6px solid #e1dace;background:#36362d;box-shadow:0 2px 8px #0004}.swatches i:nth-child(2){background:#945b4e}.swatches i:nth-child(3){background:#836946}.swatches i:nth-child(4){background:#c2c0b1}.awards{display:flex;gap:14px}.awards i{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:#78613c;color:#ffe598;font-size:30px;box-shadow:inset 0 0 0 6px #c6a66b,0 3px 8px #0004}
@media(max-width:1050px){body{min-width:0}.forum-nav,.forum-shell{width:min(100%,1000px)}.forum-nav a{padding-inline:8px}.profile-card{width:calc(100% - 28px)}}
.badge-writer span{left:-25px;top:75px}
.header-label,.header-badge span{display:block;height:14px;padding:1px 8px;border:1px solid #817a68;background:#e8e5d9;color:#323232;font:10px/10px Inter,Arial,sans-serif;text-align:center;white-space:nowrap;box-shadow:0 1px 1px #0003}
.header-label{position:absolute;z-index:3}
.label-navigation{left:13px;top:239px}
.label-needed{left:145px;top:181px;width:88px}
.label-admins{left:313px;top:275px}
.label-best-post{left:856px;top:44px;width:110px}
.label-best-episode{left:678px;top:376px;width:108px}
.header-episode{position:absolute;left:678px;top:335px;width:105px;text-align:center;color:#652b16;font:700 14px/1 Oranienbaum,serif}
.label-best-post{left:856px;top:44px;width:110px}
.badge-writer span{left:-25px;top:75px}
.label-needed{left:138px;top:144px;width:88px}
.label-navigation{left:14px;top:241px}
.label-admins{left:313px;top:276px}
.profile-trigger{position:absolute;left:80px;bottom:0;width:160px;height:18px;border:0;background:transparent;color:var(--ink);font:600 9px Inter;text-align:left;text-transform:uppercase;cursor:pointer}

#pun-status.profile-trigger {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    z-index: 4;
}

#pun-status.profile-trigger .container {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background: var(--beg800);
    border-radius: 0 4px;
}

#pun-status.profile-trigger .item2,#pun-status.profile-trigger .status-right{display:none!important}
#pun-status.profile-trigger .item1{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#pun-status.profile-trigger .item1 strong,#pun-status.profile-trigger .item1 a{color:var(--wine);font-weight:700;transition:color .2s ease}
#pun-status.profile-trigger .item1 a:hover,#pun-status.profile-trigger .item1 strong:hover a{color:var(--ink)!important}
.header-episode{transition:color .2s ease}
.header-episode:hover{color:var(--ink)!important}
.header-post h2,.header-post a{transition:color .2s ease}
.header-post h2:hover,.header-post a:hover{color:var(--wine)!important}
.header-label{pointer-events:none}
.header-hotspot{z-index:8}
.hotspot-trigger{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:pointer}
.header-popover{position:absolute;z-index:9;display:flex;visibility:hidden;opacity:0;transform:translateY(7px);flex-direction:column;gap:4px;padding:12px;border:1px solid #817a68;border-radius:3px;background:#e8e5d9eF;color:var(--ink);box-shadow:0 7px 18px #0008;transition:opacity .2s ease,transform .2s ease,visibility .2s;font:9px/1.25 Inter,Arial,sans-serif}
.header-popover>a{background:var(--accent3)}
.header-hotspot:hover .header-popover,.header-hotspot:focus-within .header-popover{visibility:visible;opacity:1;transform:translateY(0)}
.header-popover>strong{margin-bottom:4px;color:var(--wine);font:700 14px Oranienbaum,serif;text-transform:lowercase}
.navigation-popover{left:48px;top:14px;width:165px}
.navigation-popover a{padding:5px 7px;border-bottom:1px solid #817a6844;text-transform:lowercase}
.navigation-popover a:last-child{border-bottom:0}.navigation-popover a:hover{background:var(--wine);color:#f4f1e8}

/* Карточки администрации */
.admins-popover{width:230px}
.admins-popover>a{display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:18px 18px;column-gap:9px;min-height:46px;align-items:center}
.admins-popover .staff-avatar{grid-column:1;grid-row:1/3;width:36px;height:36px;border-radius:50%;object-fit:cover}
.admins-popover b{grid-column:2;grid-row:1;align-self:end}
.admins-popover small{grid-column:2;grid-row:2;align-self:start;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

#pun-navlinks .container,#pun-navlinks>ul,#pun-ulinks .container{overflow:visible!important;scrollbar-width:none}

.needed-person{position:absolute;z-index:4;display:block;width:59px;height:66px;overflow:hidden;border-radius:49px}
.needed-person-first{left:150px;top:67px;transform:rotate(-.4deg)}
.needed-person-second{left:150px;top:167px;transform:rotate(-.4deg)}
.needed-person img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;filter:sepia(.9) saturate(.9);transition:filter .2s ease,transform .2s ease}
.needed-person:hover img{filter:sepia(.25) saturate(1);transform:scale(1.04)}
.header-badge img{transition:filter .2s ease,transform .2s ease}
.header-badge:hover img{filter:sepia(.25) saturate(1);transform:scale(1.04)}
.user-links a{display:grid;place-items:center;padding:0 12px}
.needed-person-second{left:152px;top:169px;transform:rotate(-.4deg)}
.header-popover>strong{margin-bottom:4px;color:var(--wine);font:700 14px Oranienbaum,serif;text-transform:lowercase}
.admins-popover{left:-28px;top:-165px;width:190px}
.navigation-popover{left:-10px;top:-178px;width:165px}
.hotspot-nav{left:14px;top:232px;width:63px;height:30px}
.news-strip{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:140px;justify-content:start;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--wine) transparent}
.news-strip>a{scroll-snap-align:start}
.news-strip::-webkit-scrollbar{height:5px}
.news-strip::-webkit-scrollbar-track{background:transparent}
.news-strip::-webkit-scrollbar-thumb{border-radius:5px;background:var(--wine)}
.breadcrumbs{height:auto;text-align:center;color:#777765;font-weight:600;padding:15px;text-transform:lowercase;font-size:10px}
.news-strip strong{transition:color .2s ease}
.news-strip a:hover strong{color:var(--gold)}
.forum-copy{width:540px;max-width:100%}
.user-links a{transition:color .2s ease}
.user-links a:hover{color:var(--wine)}
.forum-icon{overflow:hidden}
.forum-icon img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;filter:sepia(.55) saturate(.8)}
.forum-icon{display:grid;place-items:center;width:43px;height:43px;border:0;border-radius:50%;color:#a87138;font-size:26px}
.hotspot-nav .hotspot-trigger{transform:translateX(2px)}
.forum-icon{isolation:isolate;background-color:rgb(176 133 89)}
.forum-icon img{filter:none;mix-blend-mode:luminosity}
.forum-copy h2{transition:color .2s ease}
.forum-copy h2:hover{color:var(--wine)}
.forum-copy a b{transition:color .2s ease}
.forum-copy a:hover b{color:var(--gold)}
.forum-copy>div>a:nth-child(odd) b{background:var(--wine)}
.forum-copy>div>a:nth-child(even) b{background:var(--ochre)}
.last-post strong{transition:color .2s ease;cursor:pointer}
.last-post strong:hover{color:var(--ink)}
.forum-row.no-new .forum-icon{background-color:var(--ink);opacity:50%}
.forum-row.no-new .forum-copy h2{color:var(--ink)}
.forum-row.no-new .forum-copy h2:hover{color:var(--wine)}
.forum-row.muted{filter:none}
.last-post .avatar{grid-row:1/3;width:31px;height:31px;border-radius:50%;background:url('__ASSET_BASE__/asset-13.png') center 20%/cover;filter:sepia(.7) saturate(.7)}
.stats-pills b:last-child{cursor:default}
.stats-pills b:last-child a{color:inherit;transition:color .2s ease}
.stats-pills b:last-child a:hover{color:var(--gold)}
.statistics p>strong{color:var(--ochre)}
.statistics p>a{transition:color .2s ease}
.statistics p>a:hover{color:var(--wine)}
.forum-footer{position:relative}
.footer-banners{position:absolute;left:28px;top:20px;display:grid;grid-template-columns:repeat(5,88px);grid-auto-rows:31px;gap:5px 6px;width:474px;height:112px;padding-right:8px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--wine) transparent}
.footer-banners a,.footer-banners img{display:block;width:88px;height:31px}
.footer-banners img{object-fit:cover;filter:sepia(.45) saturate(.75);transition:filter .2s ease}
.footer-banners a:hover img{filter:none}
.footer-banners::-webkit-scrollbar{width:5px}
.footer-banners::-webkit-scrollbar-track{background:transparent}
.footer-banners::-webkit-scrollbar-thumb{border-radius:5px;background:var(--wine)}
.footer-banners{position:absolute;left:28px;top:20px;display:grid;grid-template-columns:repeat(4,88px);grid-auto-rows:31px;gap:5px 6px;width:414px;height:112px;padding-right:8px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--wine) transparent}

#pun .forum-header{
width:calc(100% + 60px);
max-width:none;
margin-left:-30px
}

.scroll-arrows{position:fixed;z-index:20;left:calc(50% + 515px);top:50%;display:flex;transform:translateY(-50%);flex-direction:column;gap:12px}
.scroll-arrow{display:grid;place-items:center;width:46px;height:84px;padding:0;border:0;background:transparent;cursor:pointer;opacity:.78;transition:opacity .2s ease,transform .2s ease}
.scroll-arrow:hover{opacity:1;transform:scale(1.05)}
.scroll-arrow img{display:block;width:43px;height:80px;object-fit:contain}
.scroll-arrow-down img{transform:none}
.punbb-admin input[type="submit"],
.punbb-admin input[type="button"],
.punbb-admin button,
#pun-admain .button {
    display: inline-flex;
    width: auto !important;
    min-width: 100px;
    height: 24px;
    padding: 0 20px !important;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--wine) !important;
    border-radius: 4px;
    background: var(--wine) !important;
    color: #fff !important;
    font: 600 11px / 1 Inter, Arial, sans-serif !important;
    text-align: center;
    text-transform: lowercase;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
    transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.punbb-admin input[type="submit"]:hover,
.punbb-admin input[type="button"]:hover,
.punbb-admin button:hover,
#pun-admain .button:hover {
  background: var(--ochre) !important;
  border-color: var(--ochre) !important;
  color: var(--gold) !important;
  transform: translateY(-1px);
}

#pun {
  position: relative;
}

.admins-popover {
  left: -28px;
  top: -165px;
  width: 230px;
}

.admins-popover > a {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  grid-template-rows: 18px 18px;
  column-gap: 9px;
  min-height: 46px;
  padding: 5px 0 0 5px;
  box-sizing: border-box;
  align-items: center;
}

.admins-popover .staff-avatar {
  grid-column: 1;
  grid-row: 1 / 3;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.admins-popover b {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}

.admins-popover small {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.scroll-arrow {
background: transparent;
}

.scroll-arrow img {
  display: block;
  width: 43px;
  height: 80px;
  object-fit: contain;
}

.scroll-arrow-down {
  transform: none;
}

.scroll-arrow-down:hover {
  transform: scale(1.05);
}

.header-post h2 {
  margin: 0 0 7px;
  color: #8c5b16;
  font: 31px var(--font-b) !important;
  text-transform: lowercase;
}

#pun #tuser {
  display: inline-flex !important;
  flex: 0 0 20px;
  align-items: center;
  justify-content: center;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  margin-left: 7%;
  padding: 2px;
  box-sizing: border-box;
  cursor: pointer;
  opacity: .5;
  line-height: 1 !important;
}

#pun #tuser::before {
  display: block;
  font-size: 16px !important;
  line-height: 16px !important;
}

#html-header .header-post a {
  color: var(--accent5);
}

#html-header .header-episode {
  color: #591e11;
}

#html-header .news-strip a {
  color: var(--beg800);
}

#pun .category > h2,
#pun #pun-stats > h2 {
  display: grid;
  place-items: center;
  justify-content: center;
  align-content: center;
  width: 100%;
  margin: 0 !important;
  padding: 0;
  gap: 0;
  box-sizing: border-box;
  text-align: center;
  background: var(--cat) center / cover no-repeat;
  border-radius: 4px 4px 0 0;
}

#pun-index .category {
  background: transparent;
  border-radius: 0;
}

#pun .category > h2 span,
#pun #pun-stats > h2 span {
  position: relative;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 2px 48px;
  border: 3px double #ada492;
  background: #ddd6cd;
  color: #777;
  font: 600 10px/1 var(--font);
  text-shadow: none;
  text-transform: lowercase;
  justify-self: center;
  align-self: center;
}

#pun-navlinks,
#pun-navlinks > .container {
  background-color: var(--dark400) !important;
}

#pun-navlinks > .container {
  width: 100%;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-sizing: border-box;
}

body:not(#pun-admain) #pun #pun-navlinks {
  position: absolute !important;
  top: 0 !important;
  left: auto !important;
  width: 1000px !important;
  height: 35px;
  margin-left: -30px !important;
  border: 0 !important;
  background: var(--dark400) !important;
}

.punbb .formal input[type="submit"],
.punbb .formal input[type="button"]:not(.dicebutton),
.punbb .formal button[type="button"]:not(.dicebutton),
.punbb .formsubmit a,
.punbb .formsubmit span,
#togglePreview {
    border: 0 !important;
    border-radius: 4px !important;
    background: var(--wine) !important;
    color: var(--beg800) !important;
    cursor: pointer;
    padding: 3px 15px 5px !important;
    font: 10px var(--font);
    text-transform: lowercase;
    font-weight: 600;
}

.punbb .formal input[type="submit"]:hover,
.punbb .formal input[type="button"]:not(.dicebutton):hover,
.punbb .formal button[type="button"]:not(.dicebutton):hover,
.punbb .formsubmit a:hover,
.punbb .formsubmit span:hover,
#togglePreview:hover {
  background: var(--wine) !important;
  color: var(--gold) !important;
}

body:not(#pun-admain) #pun {
  padding-top: 10px !important;
}

body:not(#pun-admain) #html-header {
  margin-top: -27px !important;
}

body:not(#pun-admain) #pun #html-header > #pun-navlinks {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: flex !important;
  justify-content: center;
  align-items: center;
  width: calc(100% + 60px) !important;
  height: 25px !important;
  margin: 0 0 0 -30px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  background: var(--dark400) !important;
  box-sizing: border-box;
  z-index: 10;
}

body:not(#pun-admain) #pun #html-header > #pun-navlinks > .container,
body:not(#pun-admain) #pun #html-header > #pun-navlinks > ul {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  width: auto;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  box-sizing: border-box;
  scrollbar-width: none;
}

body:not(#pun-admain) #pun #html-header > #pun-navlinks.fixed {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: calc(100% + 60px) !important;
  height: 35px !important;
  margin: 0 0 0 -30px !important;
}

#main-reply {
    font-size: 13px !important;
}

/* Form Buttons © max, the murderer! — restored */
#form-buttons table {
  display: table;
  width: 100% !important;
  padding: 0;
  background: var(--beg900);
}

#form-buttons table tr {
  display: flex;
  width: 100%;
  justify-content: space-between;
  gap: 4px;
  margin-bottom: 4px;
  flex-wrap: nowrap;
}

#form-buttons td,
#form-buttons td#button-files_rusff,
#form-buttons td#button-graffiti_rusff {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 24px;
  width: 24px !important;
  height: 24px;
  align-items: center;
  justify-content: center;
  color: var(--links);
  background: none !important;
}

#form-buttons td::before {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: var(--links);
  font-family: FontAwesome;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  pointer-events: none;
}

#form-buttons td:hover::before {
  color: var(--accent5);
}

#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"; top: 0; }
#button-strike::before { content: "\f0cc"; }
#button-left::before { content: "\f036"; }
#button-right::before { content: "\f038"; }
#button-center::before { content: "\f037"; }
#button-link::before { content: "\f0c1"; }
#button-spoiler::before { content: "\f518"; font-size: 16px; }
#button-image::before { content: "\f302"; font-size: 16px; }
#button-video::before { content: "\f144"; font-size: 16px; }
#button-hide::before { content: "\f023"; }
#button-quote::before { content: "\f27a"; }
#button-code::before { content: "\f121"; }
#button-color::before { content: "\f53f"; }
#button-table::before { content: "\f009"; }
#button-smile::before { content: "\f118"; }
#button-keyboard::before { content: "\f11c"; }
#button-addition::before { content: "\f0d7"; }
#form-buttons td#button-files_rusff::before { content: "\f07b"; }
#form-buttons td#button-graffiti_rusff::before { content: "\f5bd"; }
#button-transL::before { content: "\f891"; }
#button-indent::before { content: "\f03c"; }
#button-justify::before { content: "\f039"; }
#floatbut::before { content: "\f03c"; }
#form-buttons #button-image ~ #button-image::before { content: "\f03e" !important; }
#button-mask::before { content: "\f630"; }
#button-sticker::before { content: "\f118"; }
#button-dice::before { content: "\f1b2"; }

#form-buttons td#button-mask { order: 98; }
#form-buttons td#button-addition { order: 99; }
#form-buttons td#button-smile { display: none !important; }

#pun input.button,
#pun #sub4,
#pun input[type="button"],
#pun input[type="submit"],
#pun-admain input.button,
#pun-admain input[type="button"],
#pun-admain input[type="submit"] {
  padding: 2px 10px;
  border: 1px solid var(--accent);
  border-radius: 4px;
  background: var(--beg300);
  color: var(--beg900);
  font-size: 12px;
  font-weight: bold;
  text-transform: lowercase;
  cursor: pointer;
  transition: all .2s linear 0s;
}

#pun input.button:hover,
#pun #sub4:hover,
#pun input[type="button"]:hover,
#pun input[type="submit"]:hover,
#pun-admain input.button:hover,
#pun-admain input[type="button"]:hover,
#pun-admain input[type="submit"]:hover {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--beg900);
}

/* =========================================
   RFU Image uploader modal — Lily-Dale new design
   ========================================= */

:root {
  --rfu-bg: #dedbd0;
  --rfu-bg-soft: #ebe9dd;
  --rfu-bg-deep: #c9c6b7;
  --rfu-text: #24241d;
  --rfu-muted: #5d5b50;
  --rfu-dark: #303127;
  --rfu-dark-2: #3a3a2f;
  --rfu-accent: #9f5d50;
  --rfu-accent-hover: #b06a5c;
  --rfu-border: #a8a394;
  --rfu-border-dark: #7d796b;
  --rfu-radius: 4px;
}

/* якорь и слой модалки */

.rfu-anchor {
  position: relative;
  overflow: visible;
}

.rfu-layer {
  position: absolute;
  inset: 0;
  z-index: 7000;
  overflow: visible;
  pointer-events: none;
}

.rfu-modal,
.rfu-modal * {
  box-sizing: border-box;
}

/* основное окно */

.rfu-modal {
  position: absolute;
  top: 8px;
  inset-inline-end: 8px;

  display: none;
  flex-direction: column;

  width: min(480px, calc(100vw - 24px));
  min-width: min(420px, calc(100vw - 24px));
  max-height: min(620px, calc(100vh - 32px));
  overflow: hidden;

  color: var(--rfu-text);
  font: 400 12px/1.45 Arial, Verdana, sans-serif;

  background:
    linear-gradient(180deg, var(--rfu-bg-soft), var(--rfu-bg));

  border: 1px solid var(--rfu-border);
  border-radius: var(--rfu-radius);

  box-shadow:
    0 16px 36px rgba(30, 30, 24, 0.28),
    inset 0 1px 0 rgba(255, 255, 245, 0.45);

  pointer-events: auto;
}

.rfu-modal.rfu-open {
  display: flex;
}

/* верхняя и нижняя панели */

.rfu-toolbar,
.rfu-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;

  padding: 10px 12px;

  background: var(--rfu-dark);
  color: var(--rfu-bg-soft);
}

.rfu-toolbar {
  position: relative;
  padding-right: 56px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.22);
}

.rfu-footer {
  justify-content: flex-end;
  border-top: 1px solid var(--rfu-border);
  background: var(--rfu-bg-deep);
}

/* группы настроек */

.rfu-seg {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  min-height: 32px;
  padding: 4px 6px;

  background: rgba(235, 233, 221, 0.08);
  border: 1px solid rgba(235, 233, 221, 0.16);
  border-radius: var(--rfu-radius);
}

.rfu-toolbar .rfu-seg {
  height: 36px;
  min-height: 36px;
  padding-top: 4px;
  padding-bottom: 4px;
}

.rfu-label {
  color: #d8d5c8;
  font: 700 10px/1.2 Arial, Verdana, sans-serif;
  text-transform: lowercase;
  letter-spacing: 0.04em;
}

/* выбор хоста */

.rfu-host {
  position: relative;
  display: inline-flex;
  align-items: center;
  color: var(--rfu-bg-soft);
  cursor: pointer;
}

.rfu-host input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.rfu-host span {
  display: inline-flex;
  align-items: center;

  min-height: 24px;
  padding: 0 9px;

  color: var(--rfu-text);
  background: var(--rfu-bg-soft);

  border: 1px solid var(--rfu-border);
  border-radius: var(--rfu-radius);

  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    border-color 0.18s ease;
}

.rfu-host input:checked + span {
  color: #ffffff;
  background: var(--rfu-accent);
  border-color: var(--rfu-accent);
}

/* кнопки и селекты */

.rfu-btn,
.rfu-select {
  min-height: 32px;

  color: var(--rfu-text);
  font: 700 12px/1.2 Arial, Verdana, sans-serif;

  background: var(--rfu-bg-soft);
  border: 1px solid var(--rfu-border);
  border-radius: var(--rfu-radius);
}

.rfu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;

  padding: 6px 12px;
  cursor: pointer;

  text-transform: lowercase;

  transition:
    color 0.18s ease,
    background-color 0.18s ease,
    border-color 0.18s ease,
    opacity 0.18s ease;
}

.rfu-select {
  max-width: 180px;
  padding: 5px 28px 5px 10px;
  cursor: pointer;
}

.rfu-toolbar .rfu-host span,
.rfu-toolbar .rfu-select {
  height: 26px;
  min-height: 26px;
}

.rfu-toolbar .rfu-select {
  max-width: 138px;
  padding-top: 4px;
  padding-bottom: 4px;
}

.rfu-btn:hover,
.rfu-btn:focus-visible,
.rfu-select:focus-visible,
.rfu-host:focus-within span {
  color: #ffffff;
  background: var(--rfu-accent);
  border-color: var(--rfu-accent);
  outline: none;
}

.rfu-btn[disabled] {
  opacity: 0.55;
  cursor: default;
}

/* кнопка закрытия */

.rfu-x {
  position: absolute;
  top: 10px;
  inset-inline-end: 12px;

  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;

  margin-left: 0;
  padding: 0;

  color: #ffffff;
  background: var(--rfu-accent);
  border-color: var(--rfu-accent);
}

.rfu-x:hover,
.rfu-x:focus-visible {
  color: #ffffff;
  background: var(--rfu-accent-hover);
  border-color: var(--rfu-accent-hover);
}

.rfu-x span {
  font-size: 18px;
  line-height: 1;
}

/* зона загрузки */

.rfu-drop {
  display: grid;
  place-items: center;
  gap: 12px;

  min-height: 128px;
  margin: 12px;
  padding: 18px;

  text-align: center;

  background: var(--rfu-bg-soft);
  border: 1px dashed var(--rfu-border-dark);
  border-radius: var(--rfu-radius);

  box-shadow: inset 0 1px 0 rgba(255, 255, 245, 0.5);
}

.rfu-drop.rfu-hover {
  border-color: var(--rfu-accent);
  box-shadow:
    inset 0 0 0 2px rgba(159, 93, 80, 0.22),
    inset 0 1px 0 rgba(255, 255, 245, 0.5);
}

.rfu-hint {
  max-width: 330px;

  color: var(--rfu-muted);
  font: 500 12px/1.45 Arial, Verdana, sans-serif;
}

.rfu-drop .rfu-seg {
  min-height: 0;
  padding: 0 !important;
  background: transparent;
  border: 0;
}

/* список файлов */

.rfu-list {
  display: grid;
  gap: 8px;

  max-height: 230px;
  padding: 0 12px 12px;
  overflow: auto;

  scrollbar-color: var(--rfu-accent) var(--rfu-bg-deep);
}

.rfu-item {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;

  padding: 8px;

  background: var(--rfu-bg-soft);
  border: 1px solid var(--rfu-border);
  border-radius: var(--rfu-radius);
}

.rfu-thumb {
  display: block;

  width: 64px;
  height: 54px;
  object-fit: cover;
  object-position: center;

  background: var(--rfu-bg-deep);
  border: 1px solid var(--rfu-border);
  border-radius: var(--rfu-radius);

  filter: grayscale(0.15) contrast(0.96);
}

.rfu-meta {
  min-width: 0;

  color: var(--rfu-muted);
  font: 400 12px/1.35 Arial, Verdana, sans-serif;
}

.rfu-meta b {
  color: var(--rfu-text);
  font-weight: 700;
}

.rfu-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

/* главная кнопка */

.rfu-btn--ok {
  color: #ffffff;
  background: var(--rfu-accent);
  border-color: var(--rfu-accent);
}

.rfu-btn--ok:hover,
.rfu-btn--ok:focus-visible {
  color: #ffffff;
  background: var(--rfu-accent-hover);
  border-color: var(--rfu-accent-hover);
}

/* прогресс */

.rfu-progress {
  height: 7px;
  margin-top: 7px;
  overflow: hidden;

  background: rgba(48, 49, 39, 0.18);
  border-radius: 99px;
}

.rfu-bar {
  width: 0;
  height: 100%;

  background: linear-gradient(90deg, var(--rfu-accent), var(--rfu-accent-hover));
  transition: width 0.12s linear;
}

/* ссылки */

.rfu-list a {
  color: var(--rfu-accent);
  text-decoration: none;
}

.rfu-list a:hover,
.rfu-list a:focus-visible {
  color: var(--rfu-accent-hover);
  text-decoration: underline;
}

/* ошибки */

.rfu-error {
  margin-top: 5px;
  color: var(--rfu-accent);
  font-weight: bold;
}

/* мобилка */

@media (max-width: 560px) {
  .rfu-modal {
    inset-inline: 8px;
    width: auto;
    min-width: 0;
  }

  .rfu-toolbar,
  .rfu-footer {
    align-items: stretch;
  }

  .rfu-seg,
  .rfu-select,
  .rfu-footer .rfu-btn {
    width: 100%;
  }

  .rfu-toolbar .rfu-select {
    flex: 1;
    width: auto;
    min-width: 0;
    max-width: none;
  }

  .rfu-item {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .rfu-thumb {
    width: 54px;
    height: 48px;
  }

  .rfu-actions {
    grid-column: 1 / -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rfu-btn,
  .rfu-host span,
  .rfu-bar {
    transition: none;
  }
}