/* import */

@import url(style_cs.1785520238.css);
@import url('https://kit-pro.fontawesome.com/releases/v6.6.0/css/pro.min.css');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Onest:wght@100..900&display=swap');

/* структура */
:root {
  --pun-width: 1050px;
  --pun-gap: 30px;
  --pun-padding: 11px;
  --profile-width: 200px;
  --profile-gap: 14px;
  --profile-bg: url('https://forumstatic.ru/files/001c/c1/ef/53462.png?v=1');
  --fa: "Font Awesome 6 Pro";
  --icon-crumb: "\f6fd";
  --icon-online: "\f186";
  --font: 'Onest', sans-serif;
  --font-alt: 'Manrope', sans-serif;
}

/* цвета */
:root, .light {
  --bg: #D8D6D2;
  --bg-image: url('https://forumstatic.ru/files/001c/c1/ef/96971.png');
  --surface: #D8D6D2;
  --surface-raised: #E8E6E2;
  --text: #0B0D0D;
  --text-pale: rgb(11 13 13 / 55%);
  --accent: #C35B74;
  --accent-alt: #526E70;
  --accent-warm: #B9AA91;
  --link: #526E70;
  --link-hover: #C35B74;
  --border: transparent;
}

.dark {
}

/* скрыть ненужное */
.acchide, #pun-index #pun-main h1, #pun-navlinks h2, #pun-pagelinks h2, #pun-status h2, #pun-ulinks h2,
.punbb .forum h2, .punbb .multipage .topic h2, .punbb dl.post-sig dt span, .punbb p.crumbs strong,
.punbb .divider hr, .punbb .required label em, .punbb .formsubmit label, .punbb .submitfield label,
.punbb .modmenu label, #pun-userlist .main h2 { position: absolute; left: -9999px; width: 0; height: 0; font-size: 0; line-height: 0; overflow: hidden }

#pun-live-rusff, #pun-main .catleft, #pun-main .catright,
#pun-status .status-right, #pun span:has(> a[href*="export.php"]),
#post-form h2, #post-form fieldset legend, .reactions-root, #s-block, li.pa-ua { display: none!important}

/* тело */
html, body { margin: 0; padding: 0; background: var(--bg) var(--bg-image) no-repeat center top / cover fixed }
body { font: 11px var(--font); color: var(--text) }
.punbb * { margin: 0 }
.punbb ul, .punbb dl, .punbb li, .punbb dd, .punbb dt { padding: 0; list-style: none }
.punbb .main table { table-layout: fixed; width: 100% }
.punbb textarea, .punbb input, .punbb select, .punbb optgroup { font: 11px var(--font) }
.punbb h1, .punbb h2, .punbb h3, .punbb h4, .punbb table, .punbb th { font-size: 11px; font-weight: normal }
.punbb h1 span, .punbb h2 span, .punbb legend span { font-size: 12px }
.punbb pre { font: 12px/140% "courier new", courier, monospace }
.punbb address, .punbb em { font-style: normal }
.punbb optgroup { font-weight: bold }
.punbb a { color: var(--link); text-decoration: none; transition: color .12s ease-in-out }
.punbb a:hover { color: var(--link-hover) }
.checkfield input[type="checkbox"], .radiofield input[type="radio"] { margin: 0 3px }
#pun *:focus, #pun a:active { outline: none; -webkit-tap-highlight-color: transparent }
#pun :is(input, textarea, select, option, optgroup) { text-transform: none }

#pun:after, .punbb .container:after, .punbb .post-links ul:after,
.punbb .main div.inline:after, .punbb .post-box:after, .punbb .linksb:after { content: ""; display: block; clear: both }

#pun { position: relative; width: var(--pun-width); max-width: calc(100% - var(--pun-gap) * 2); margin: var(--pun-gap) auto; background: var(--surface); text-transform: lowercase }
.punbb { float: left; box-sizing: border-box; width: 100%; height: auto; padding: calc(var(--pun-padding) * 2) }
#pun-redirect, #pun-maint { margin: 50px 20% 12px; width: auto; float: none }
.punbb .section, .punbb .main { margin-bottom: 11px }
.punbb .category, .punbb .post { margin-top: 4px }
.punbb #pun-category1, .punbb .toppost, .punbb .topicpost { margin-top: 0 }
#pun-post .topic { margin-top: 11px }
.punbb .section h2, #pun-main h1, #pun-main h2, #pun-stats h2 { padding: 6px 0 }

/* шапка */
#pun-title { margin: 0 }
#pun-title h1 { display: block; height: 40px; padding: 22px 11px 0 }
#pun-title h1 span { font-size: 16px }
#pun-title table { width: 100%; height: 40px }
#pun-title td.title-logo-tdl { width: 100% }
#pun-title td.title-logo-tdr { width: 468px }

/* навигация */
#pun-pagelinks { position: absolute; top: -15px; left: 0; width: 100%; margin: 0; padding: 0 }
#pun-pagelinks .container { padding: 0; background: transparent }
#pun-pagelinks .container li { display: inline }
#pun-pagelinks li a, #pun-pagelinks a:link, #pun-pagelinks a:hover { display: block; float: left; width: 100%; height: 22px; margin-left: -9999px; padding: 0; line-height: 22px; font-size: 13px }
#pun-pagelinks a:active, #pun-pagelinks a:focus { position: relative; margin: 0 }
#pun-pagelinks li a span { display: block; margin: 0 11px }

#pun-navlinks, #pun-navlinks .container { margin: 0 }
#pun-navlinks .container { padding: 8px 11px; font-family: var(--font); text-transform: uppercase; font-weight: 600; text-align: center }
#pun-navlinks li { display: inline; padding-right: 11px }
#pun-navlinks li a { font-size: 12px }

/* юзерлинки */
#pun-ulinks { margin-top: 0 }
#pun-ulinks .container { padding: 8px 11px; font-family: var(--font-alt); font-size: 10px; text-align: center }
#pun-ulinks li, #pun-ulinks li a { display: inline; white-space: nowrap; border-left: 1px solid var(--border) }
#pun-ulinks li a { padding: 0 3px 0 7px }
#pun-ulinks li.item1, #pun-ulinks li.item1 a { padding-left: 0; border-left: none }

/* приветствие, крошки */
#pun-status, #pun-status .container { margin-bottom: 0 }
#pun-status .container { padding: 9px 11px 11px }
#pun-status span { margin-right: 6px; white-space: nowrap }
#pun-crumbs1, #pun-crumbs2 { margin: 0; overflow: hidden; text-align: center }
#pun-crumbs1 .container, #pun-crumbs2 .container { padding: 9px 11px; font-size: 11px; letter-spacing: .3px; color: var(--text-pale) }
#pun-crumbs1 em, #pun-crumbs2 em { display: none }
#pun-crumbs1 a, #pun-crumbs2 a { color: var(--text) }
#pun-crumbs1 a:hover, #pun-crumbs2 a:hover { color: var(--link-hover) }
#pun-crumbs1 a:not(:last-child):after, #pun-crumbs2 a:not(:last-child):after { content: var(--icon-crumb); font-family: var(--fa); font-weight: 300; font-size: 10px; margin: 0 5px 0 8px; color: var(--accent-warm) }

/* объявление */
#pun-announcement h2 { position: relative; margin: 0 11px -38px; padding: 0; border-bottom: 1px solid var(--border); font-weight: bold }
#pun-announcement h2 span { display: block; padding: 11px 0 9px; border-bottom: 1px solid var(--border) }
#pun-announcement .container { padding: 47px 11px 11px }

/* категории */
.punbb .category { margin: 0 0 14px }
.punbb .category h2 { padding: 0 4px 7px; font-size: 13px; font-weight: 500; letter-spacing: .4px; color: var(--text-pale) }
.punbb .category .container { padding: 6px; border-radius: 14px; background: var(--surface-raised) }
#pun-index thead { display: none }
#pun-index .category tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) 300px; column-gap: 14px; align-items: center; padding: 12px 14px }
#pun-index .category td { padding: 0; border: none }
#pun-index .category td.tc2, #pun-index .category td.tc3 { display: none }
#pun-index .category td.tcr { position: relative; min-height: 36px; padding-right: 46px; text-align: right; font-size: 10px; line-height: 160%; color: var(--text-pale) }
#pun-index tbody.hasicon td.tcl { padding-left: 26px }
#pun-index .tcl h3 { margin: 0 0 4px; font-size: 15px; font-weight: 500 }
#pun-index .tcl h3 a { color: var(--text) }
#pun-index .tcl h3 a:hover { color: var(--link-hover) }
#pun-index .tclcon { line-height: 150%; color: var(--text-pale) }
#pun-index .tcr > a:first-of-type { font-size: 12px; font-weight: 500; color: var(--text) }
#pun-index .tcr > a:first-of-type:hover { color: var(--link-hover) }
#pun-index .tcr .byuser, #pun-index .tcr .byuser a { color: var(--text-pale) }
#pun-index .tcr .byuser a:hover { color: var(--link-hover) }
#pun-index .user-avatar { position: absolute; top: 50%; right: 0; width: 36px !important; height: 36px !important; margin: -18px 0 0; border-radius: 50%; background: var(--surface) }
#pun-index .user-avatar a, #pun-index .user-avatar .avatar-image { display: block; width: 100%; height: 100%; overflow: hidden; background-position: center; background-size: cover; border-radius: 50% }
#pun-index div.icon { width: 7px; height: 7px; margin: 6px 0 0; border: none; border-radius: 50%; background: var(--accent-warm) }
#pun-index div.icon.inew { background: var(--accent) }
#pun-index table div.icon { margin-left: -22px }
#pun-index .user-avatar .isonline { position: absolute; top: auto; left: auto; right: -2px; bottom: -1px; width: auto; height: auto; margin: 0; border: none; border-radius: 0; background: none; box-shadow: none; font: 900 11px/1 var(--fa); color: var(--accent) }
#pun-index .user-avatar .isonline:before { content: var(--icon-online) }

/* таблицы */
.punbb .main .tcl { width: 50%; text-align: left; overflow: hidden; border-left: none }
.punbb .main .tc2, .punbb .main .tc3, .punbb .main .tcmod { width: 10%; text-align: center }
.punbb .main .tcr { text-align: left; overflow: hidden }
#pun-userlist .main .tcl, #pun-searchtopics .main .tcl, #pun-modviewforum .main .tcl { width: 40% }
#pun-userlist .main .tc2, #pun-searchtopics .main .tc2 { width: 20%; text-align: left }
.punbb .main td { padding: 9px 11px; border-top: 1px solid var(--border); border-left: 1px solid var(--border) }
.punbb .main th { padding: 4px 11px; border-left: 1px solid var(--border) }
.punbb td span.youposted { position: absolute; margin-left: -11px; font-weight: bold }
.punbb td .modlist { display: block; padding-top: 3px }
.punbb tbody.hasicon td.tcl { padding-left: 35px }
.punbb div.icon { width: 0; height: 0; margin-top: 1px; line-height: 0; border: 7px solid }
.punbb table div.icon { position: absolute; margin-left: -24px; font-size: 12px }

/* пагинация */
.punbb .linkst, .punbb .linksb { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; float: none; position: static; width: auto; height: auto; padding: 0; font-size: 11px }
.punbb .linkst { margin: 0 0 10px }
.punbb .linksb { margin: 10px 0 0 }
.punbb .linksb:after { display: none }
.multipage { margin-top: 0 }
.punbb .pagelink, .punbb .postlink, .punbb .subscribelink { position: static; float: none; clear: none; width: auto; padding: 0; font-weight: normal; text-align: left }
.punbb .pagelink { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-right: auto; color: var(--text-pale) }
.punbb .pagelink a, .punbb .pagelink strong { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; padding: 0 4px; font-weight: 400 }
.punbb .pagelink a { color: var(--text-pale) }
.punbb .pagelink a:hover { color: var(--accent) }
.punbb .pagelink strong { color: var(--text); font-weight: 500 }
.punbb .postlink { display: flex; gap: 6px }
.punbb .linksb .postlink { display: none }
.punbb .postlink a, .punbb .subscribelink a { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 16px; border-radius: 20px; background: var(--accent-alt); color: var(--surface-raised) }
.punbb .postlink a:hover, .punbb .subscribelink a:hover { background: var(--accent); color: var(--surface-raised) }
.punbb .postlink a:before, .punbb .subscribelink a:before { font: 400 11px/1 var(--fa) }
.punbb .postlink a[href*="fid="]:before { content: "\2b" }
.punbb .postlink a[href*="tid="]:before { content: "\f3e5" }
.punbb .subscribelink a { background: var(--surface-raised); color: var(--text) }
.punbb .subscribelink a:before { content: "\f0f3" }

/* пост */
.punbb .post .container { margin-top: -1px; padding-bottom: 1px }
.punbb .post h3 span { display: block; margin-left: calc(var(--profile-width) + var(--profile-gap)); padding: 6px 11px; border-left: 1px solid var(--border) }
.punbb .post h3 strong { float: right; width: 55px; text-align: right; font-weight: normal }
.punbb .post .post-author { float: left; box-sizing: border-box; width: var(--profile-width); margin-top: -16px; padding: 9px; overflow: hidden; border: 1px solid var(--surface-raised); border-radius: 22px; background: var(--profile-bg) center / 100% 100% no-repeat; text-align: center }
.punbb .post .post-author ul, .punbb .post .post-author p { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 7px 12px; padding: 16px 14px; border: 1px solid var(--accent-warm); border-radius: 16px; background: var(--surface-raised); line-height: 140% }
.punbb .post .post-author li { width: 100% }
.pa-author { font: 800 16px/22px var(--font-alt); letter-spacing: -.02em }
.pa-author a { color: var(--accent-alt) }
.pa-author a:hover { color: var(--link-hover) }
.pa-author .flag-i { display: none }
li.pa-title { font: 400 10px/13px var(--font); letter-spacing: -.02em; color: var(--text-pale) }
.pa-avatar img { max-width: 100%; border-radius: 14px }
.punbb .post .post-author li.pa-posts, .punbb .post .post-author li.pa-respect { width: auto; font: 400 7px/10px var(--font-alt); color: var(--text-pale) }
.post-author .pa-respect img { display: none }
li.pa-online { font-size: 10px; color: var(--accent) }
.punbb .post-body { margin-left: calc(var(--profile-width) + var(--profile-gap)); padding: 0 0 1px; border-left: 1px solid var(--border) }
.punbb .post-box { padding: 11px }
.punbb fieldset .post-box { margin-bottom: 9px }
.punbb .post-links { margin-left: calc(var(--profile-width) + var(--profile-gap)); border-left: 1px solid var(--border) }
.punbb .post-links ul { height: 22px; margin-left: calc(0px - var(--profile-width) - var(--profile-gap)); padding: 0 11px 0 0; line-height: 22px; text-align: right; border-top: 1px dashed var(--border); background: transparent }
.punbb .post-links li { display: inline; padding-left: 11px }
.pl-email, .pl-website { float: left }
.punbb .clearer { clear: both; height: 0; font-size: 0 }

/* быстроплюсы */
.post-rating, .post-vote { float: right; display: inline-flex; align-items: center }
.post-vote { margin-right: 8px }
.post-rating p, .post-vote p { float: none; margin: 0; padding: 0; border: none }
.post-rating p > a { display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 26px; padding: 0 12px; border-radius: 20px; background: var(--surface-raised); color: var(--accent-alt); font-size: 11px; font-weight: 500 }
.post-rating p > a:before { content: "\f004"; font: 400 10px/1 var(--fa) }
.post-rating p > a:hover { background: var(--accent-warm); color: var(--text) }
.voted .post-rating p > a { cursor: default }
.voted .post-rating p > a:hover { background: var(--surface-raised); color: var(--accent-alt) }
.voted .post-rating p > a:before { font-weight: 900; color: var(--accent) }
.voted .post-vote { display: none }
.post-vote p > a { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--accent-alt); color: var(--surface-raised); font-size: 0; cursor: pointer }
.post-vote p > a:before { content: "\2b"; font: 400 11px/1 var(--fa) }
.post-vote p > a:hover { background: var(--accent) }

/* контент поста */
.punbb .post-content { width: 100%; padding: 0; margin: 0; overflow: hidden }
.punbb .post-content p { margin: 0; padding: 0 0 11px; line-height: 150% }
.punbb .post-content em { font-style: italic }
.punbb .post-content em.bbuline { font-style: normal; text-decoration: underline }
.punbb .post-content img { vertical-align: text-bottom }
.punbb .post-content img.postimg { vertical-align: middle }
#pun .post-content table { width: auto; table-layout: auto; border-collapse: collapse }
#pun .post-content td, #pun .post-content th { border-color: transparent; vertical-align: top }
.punbb .post-content .blockcode, .punbb .post-content blockquote { width: 100%; overflow: hidden }
.punbb .post-content .scrollbox { width: 100%; overflow: auto }
.punbb .post-content .quote-box, .punbb .post-content .code-box { margin: 4px 20px 15px; padding: 11px; border: 1px solid var(--border) }
.punbb .quote-box cite, .punbb .code-box strong.legend { display: block; margin: 0; padding-bottom: 8px; font-size: 12px; font-weight: bold; font-style: normal }
.punbb .post-sig dt { display: block; width: 250px; margin: 5px 0; border-top: 1px solid var(--border) }

/* модменю, служебные сообщения */
.punbb .modmenu .container { padding: 0; text-align: left }
.punbb .modmenu a { height: 20px; line-height: 20px }
.punbb .modmenu input { margin-left: 11px }
#topic-modmenu { margin: 18px 0 0 }
#topic-users-in { margin: 12px 0 0; color: var(--text-pale) }
#topic-users-in .container span { font-weight: 400 !important }
#post-form { margin: 18px 0 0 }
.punbb .info .container { padding: 9px 11px }
.punbb .info .container .backlink { padding-top: 9px }
.punbb .info-box { margin: 0 0 12px; padding: 12px 19px 11px; border: 1px solid var(--border) }
.punbb .info-box * { padding: 0 0 8px }
.punbb #pun-main .info-box .legend { font-size: 12px; font-weight: bold }

/* формы */
.punbb .formal .container { padding: 19px 25px 12px }
.punbb .formsubmit { margin: 11px 0 0; padding: 0 0 0 19px }
.punbb .formsubmit input, .punbb .formsubmit a, .punbb .formsubmit span { margin: 0 7px 0 0 }
.punbb fieldset { margin: 0 0 11px; padding: 0 18px; border: 1px solid var(--border) }
.punbb fieldset legend { margin: 0 0 0 11px; padding: 0; font-size: 12px }
.punbb fieldset legend span { margin: 0 0 0 -15px; padding: 0 5px }
.punbb fieldset fieldset { margin: 0; padding: 0 0 8px; border: none }
.punbb .fs-box { padding: 11px 0 9px }
.punbb .fs-box p, .punbb .fs-box fieldset { padding: 0 0 9px }
.punbb .inline .inputfield, .punbb .inline .selectfield, .punbb .inline .passfield { float: left; margin-right: 11px }
.punbb .inline .infofield { clear: both }
.punbb .datafield br { display: none }
.punbb .required label, .punbb .datafield span.input { font-weight: bold }
.punbb .datafield span.input a { font-weight: normal }
.punbb .areafield span.input, .punbb p.longinput span.input { display: block; padding: 0 132px 0 0 }
.punbb textarea, .punbb .longinput input { width: 64%; margin: 0 }
.punbb .hashelp { position: relative }
.punbb .helplinks { display: block; position: absolute; top: 11px; right: 0; width: 36%; font-weight: normal }
.punbb #profile .helplinks { top: 16px }
.punbb .helplinks span { display: block; padding-bottom: 2px }
#pun-post .formal .info-box li { margin: 0; padding-left: 4px; line-height: 1.5; list-style: square inside }

.punbb :is(input:not([type]), input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="number"], select) { box-sizing: border-box; max-width: 100%; padding: 8px 12px; border: none; border-radius: 10px; background: var(--surface-raised); color: var(--text); font: 11px var(--font) }
.punbb :is(input:not([type]), input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="number"], select, textarea):focus { box-shadow: inset 0 0 0 1px var(--accent-warm) }
.punbb :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--accent) }
.punbb :is(.inputfield, .selectfield, .passfield) label { display: block; margin: 0 0 5px; font-weight: 500; color: var(--text-pale) }
.punbb .infofield { color: var(--text-pale) }
.punbb select option, .punbb select optgroup { background: var(--surface-raised); color: var(--text) }

/* редактор */
#post-form > form.container { padding: 0 }
#post-form fieldset, #post-form .fs-box { margin: 0; padding: 0; border: none }
#post-form .areafield span.input { padding: 0 }
.punbb .formal textarea { box-sizing: border-box; width: 100%; min-height: 180px; padding: 12px 14px; border: none; border-radius: 12px; background: var(--surface-raised); color: var(--text); line-height: 160%; resize: vertical }
.punbb .grippie, #box_file_uploader { display: none }
#form-buttons { display: flex; flex-wrap: wrap; gap: 3px; margin: 0 0 8px; padding: 4px; border-radius: 12px; background: var(--surface-raised) }
#form-buttons table, #form-buttons tbody, #form-buttons tr { display: contents }
#form-buttons td { position: relative; flex: 1 1 0; min-width: 26px; height: 26px; padding: 0; border: none; border-radius: 8px; background-image: none !important; color: var(--text-pale); cursor: pointer; transition: color .12s ease-in-out, background .12s ease-in-out }
#form-buttons td:hover { background: var(--surface); color: var(--accent) }
#form-buttons td:before { position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font: 400 13px/1 var(--fa) }
#form-buttons td img { position: relative; z-index: 2; display: block; width: 100%; height: 26px; opacity: 0 }
#button-font:before { content: "\f031" }
#button-size:before { content: "\f894" }
#button-bold:before { content: "\f032" }
#button-italic:before { content: "\f033" }
#button-underline:before { content: "\f0cd" }
#button-strike:before { content: "\f0cc" }
#button-left:before { content: "\f036" }
#button-center:before { content: "\f037" }
#button-right:before { content: "\f038" }
#button-link:before { content: "\f0c1" }
#button-spoiler:before { content: "\f0fe" }
#button-image:before { content: "\f03e" }
#button-video:before { content: "\f03d" }
#button-hide:before { content: "\f023" }
#button-quote:before { content: "\f10d" }
#button-code:before { content: "\f121" }
#button-color:before { content: "\f53f" }
#button-table:before { content: "\f00a" }
#button-smile:before { content: "\f118" }
#button-keyboard:before { content: "\f11c" }
#button-addition:before { content: "\2b" }
#button-files_rusff:before { content: "\f0c6" }
#button-graffiti_rusff:before { content: "\f1fc" }
#font-area, #size-area, #color-area, #table-area, #image-area, #video-area,
#spoiler-area, #keyboard-area, #addition-area, #smilies-area { max-height: 300px; padding: 10px; overflow-y: auto; border: none; border-radius: 12px; background: var(--surface-raised); box-shadow: 0 8px 24px rgb(11 13 13 / 14%); scrollbar-width: thin; scrollbar-color: var(--accent-warm) transparent }
#pun ::-webkit-scrollbar { width: 6px; height: 6px }
#pun ::-webkit-scrollbar-track, #pun ::-webkit-scrollbar-corner { background: transparent }
#pun ::-webkit-scrollbar-thumb { border-radius: 6px; background: var(--accent-warm) }
#font-area div, #size-area div, #addition-area div { padding: 5px 8px; border-radius: 8px; cursor: pointer }
#font-area div:hover, #size-area div:hover, #addition-area div:hover { background: var(--surface); color: var(--accent) }
#color-area td { width: 18px; height: 18px; padding: 0; border: none; border-radius: 6px; cursor: pointer }
#table-area td { width: 14px; height: 14px; padding: 0; border: 1px solid var(--surface); background: var(--surface-raised); cursor: pointer }
#table-area td.selected { background: var(--accent-warm) }
#smilies-area img { margin: 0 6px 6px 0; cursor: pointer }
#keyboard-span input { min-width: 26px; margin: 2px; padding: 4px 6px; border: none; border-radius: 8px; background: var(--surface); color: var(--text); font: 11px var(--font); cursor: pointer }
#keyboard-span input:hover { background: var(--accent-warm) }
#post-form .formsubmit { display: flex; gap: 8px; margin: 10px 0 0; padding: 0 }
.punbb input.button { padding: 8px 20px; border: none; border-radius: 20px; background: var(--surface-raised); color: var(--text); font: 11px var(--font); text-transform: lowercase; cursor: pointer; transition: color .12s ease-in-out, background .12s ease-in-out }
.punbb input.button:hover { background: var(--accent-warm) }
.punbb input.button.submit { background: var(--accent-alt); color: var(--surface-raised) }
.punbb input.button.submit:hover { background: var(--accent) }
#post-preview .post-box { padding: 12px 14px; border-radius: 12px; background: var(--surface-raised) }

/* профиль */
#profile .container { padding-left: 205px }
#profilenav { float: left; display: inline; width: 154px; margin-left: -179px }
#profilenav li { padding-bottom: 9px; font-weight: bold }
#viewprofile ul, #profilenav ul { margin: 0 0 11px; padding: 17px 18px 9px; border: 1px solid var(--border) }
#viewprofile h2, #profilenav h2 { margin: 0 14px -7px; padding: 0; background: transparent }
#viewprofile h2 span, #profilenav h2 span { position: relative; padding: 0 5px }
#viewprofile li, #setmods dl { margin-bottom: 2px; padding: 0 0 0 176px }
#viewprofile li span { float: left; width: 154px; margin-left: -176px; padding: 6px 11px; font-weight: bold }
#setmods dt { float: left; display: inline; width: 154px; margin-left: -176px; padding: 9px 11px; font-weight: bold }
#viewprofile li strong, #viewprofile li div, #setmods dd { display: block; padding: 6px 11px; font-weight: normal }
.punbb img.avatardemo { float: right; margin: 0 0 9px 20px }
#pun-userlist .formal, #pun-userlist .formal .container { margin-bottom: 0 }
#pun-userlist .usertable .container { padding: 0 25px 25px }
#pun-userlist .usertable table { border: 1px solid var(--border) }

/* статистика, футер */
#pun-stats .container { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; padding: 9px 0 }
#pun-stats .container:after { display: none }
#pun-stats li.item1, #pun-stats li.item2, #pun-stats li.item3, #pun-stats li.item4 { flex: 0 0 auto; padding: 7px 18px; border-radius: 20px; background: var(--surface-raised); text-align: center; line-height: 140%; white-space: nowrap }
#pun-stats li.item1 span, #pun-stats li.item2 span, #pun-stats li.item3 span, #pun-stats li.item4 span { display: none }
#pun-stats li.item1:before, #pun-stats li.item2:before, #pun-stats li.item3:before, #pun-stats li.item4:before { color: var(--text-pale) }
#pun-stats li.item1:before { content: "тем: " }
#pun-stats li.item2:before { content: "сообщений: " }
#pun-stats li.item3:before { content: "участников: " }
#pun-stats li.item4:before { content: "новичок: " }
#pun-stats li span { color: var(--text-pale) }
#pun-stats li strong { font-weight: 500 }
#pun-stats .onlinelist, #pun-stats .users_24h, #pun-stats .statistics { flex: 0 0 100%; line-height: 150% }
#pun-stats .onlinelist { margin-top: 3px }
#pun-stats #statistic-other { display: flex; flex-wrap: wrap; gap: 4px 14px }
#pun-stats #statistic-other span { padding-right: 0 }
#pun-qjump { float: left; position: relative; width: 50%; margin: 0 }
#pun-qjump .container { padding: 9px 11px; background: transparent }
#pun-about { margin-top: 0 }
#pun-about .container { padding: 9px 11px; text-align: right; line-height: 150% }
#pun-about p span { display: block; padding-left: 50% }

/* помощь */
#pun-help .formal .info-box h3.legend { margin-bottom: 9px; padding-bottom: 0; border-bottom: 1px solid var(--border) }
#pun-help .formal .info-box h3.legend span { display: block; padding-bottom: 7px; border-bottom: 1px solid var(--border); font-size: 12px }
#pun-help .formal p, #pun-help .formal dd { margin-bottom: 11px }
#pun-help .formal ul, #pun-help .formal dl { padding: 0 0 0 11px }
#pun-help .formal li { padding: 0; line-height: 130% }
#pun-help .formal li * { vertical-align: text-top }
#pun-help .formal dt span { font: 15px/120% "courier new", courier, monospace }
#pun-help .formal .parsedmsg, #pun-help .formal .parsedmsg .incode { padding-bottom: 0 }