@import url(style_cs.1792602737.css);
 
@import url(https://forumstatic.ru/files/001c/bd/d1/43828.css); 
 
@import url('https://fonts.googleapis.com/css2?family=Brygada+1918:ital,wght@0,400..700;1,400..700&family=Jura:wght@300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Infant:ital,wght@0,300..700;1,300..700&family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
@import url('https://forumstatic.ru/files/001c/bd/d1/84900.css');

:root {
    --bookmark-default: url("https://upforme.ru/uploads/001c/c0/46/2/t146237.png");
  --def-font: "Jura", sans-serif;
  --sec-font: "Jost", sans-serif;
  --cursivef: "Brygada 1918", serif;
  --newsf: "Lavoza", serif;
  --acc-color: #E1821D;
  --acc-deep: #A95319;
  --acc-soft: #F5E9DB;
  --pun-main: #F1EEE8;
  --pun-soft: #F7F4EE;
  --pun-light: #FCFAF6;
  --pun-muted: #DDD6CB;
  --pun-dark: #2B2119;
  --pun-dark-soft: #3D2E22;
  --text-main: #281F18;
  --text-soft: #6D5C4B;
  --line-color: #D4CCC0;
  --small-color: #6D7048;
  --bg-body: var(--pun-main);
}

@media screen and (max-width: 720px) {
	.post-box .post-content {
		font-size: 1.4em !important;
	}

	.punbb textarea#main-reply {
		font-size: 1.7em !important;
	}
}

@font-face {
    font-family: 'Druzhok';
    src: url('https://forumstatic.ru/files/001c/be/8c/15463.woff2?v=1') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Lavoza';
    src: url('https://forumstatic.ru/files/001c/c4/75/92515.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
html,
body {
    background: #000 url(https://upforme.ru/uploads/001c/c0/46/2/750027.png) center top / cover no-repeat fixed;
}

.acchide,
#pun-index #pun-main h1,
#pun-navlinks 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,
.punbb .modmenu .container span,
#pun-userlist .main h2,
#pun-title h1,
#pun-announcement h2 {
  font-size: 0;
  height: 0;
  width: 0;
  line-height: 0.0;
  position:absolute;
  left: -9999px;
  overflow: hidden
}

#pun:after,
.punbb .post-links ul:after,
.punbb .main div.inline:after,
.punbb .post-box:after,
.punbb .linksb:after,
.punbb .container:after {clear: both; content: "."; display: block; height: 0; visibility: hidden; overflow:hidden; line-height: 0.0; font-size: 0;}

.punbb th,
.punbb thead {
display: none;
}

#pun-index .tc2,
#pun-index .tc3,
#pun-index .tcmod {
	display: none
}

#pun-main.show_new .tc3 {
    display: none;
}

.topic a.sharelink, .topic a.translatelink {display: none;}

.lastedit, li#navawards, .pa-invites, .pa-gifts, #pun-live-rusff, #button-files_rusff, #button-graffiti_rusff, 
.pl-share, .sharelink, .pl-reports, li.pl-share, .post-links li.pl-reports {display: none !important;}

#pun-status .status-right {display: none;}
fieldset legend span {
display:none;
}
.pa-respect a[href*="relation"] {
    display: none;}

td#button-smile {
display: none;}
* {margin: 0; padding: 0;}
body {margin: 0;}
ul, dl, li, dd, dt {list-style: none;}

body {font: 12px Verdana;}
h1, h2 {
    padding: 5px 10px;
    margin: 0;
    font: 500 19px / 1 var(--def-font);
    color: var(--text-soft);
    text-transform: lowercase;
    text-align: center;
}

address, em {font-style: normal}

a {text-decoration: none;}
* {
scrollbar-width: thin;
    scrollbar-color: var(--acc-color) transparent;
}
*::-webkit-scrollbar {width: 5px; height: 9px;}
*::-webkit-scrollbar-track {background-color: var(--acc-color);}
*::-webkit-scrollbar-thumb {background-color: transparent;}

#pun-adnav li {
    margin-bottom: 6px;
    background: var(--pun-soft);
    border-radius: 5px;
    display: flex;
    align-items: center;
    font: 500 13px / 1 var(--sec-font);
    text-transform: lowercase;
    transition: background 0.15s ease;
}

#pun-adnav li:last-child {
    margin-bottom: 0;
}

#pun-adnav li:hover {
    background: var(--pun-main);
}

#pun-adnav li a {
    color: inherit;
    font: inherit; 
    text-decoration: none;
    display: block;
    width: 100%;
}
.punbb {
font: normal 100% verdana, arial, helvetica, sans-serif;
	float: left;
	width: 100%;
	height: auto;
}
#pun-title table {
width: 1000px;
    height: 460px;
    margin: -51px auto auto -15px;
    background: url(https://upforme.ru/uploads/001c/c0/46/2/650903.jpg);
    border-radius: 40px 40px 0 0;
overflow: hidden;
background-clip: padding-box;
}

#pun {
width: 970px;
    padding: 0px 15px 0px 15px;
    margin: 100px auto 35px auto;
    border-radius: 40px 40px 28px 28px;
    color: var(--text-main);
    background: var(--pun-main);}
#pun-navlinks {
    height: 0;
    overflow: visible;
}

#pun-navlinks > .container {
    position: relative;
    z-index: 20;

    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 24px;

    width: max-content;
    max-width: none;
    margin: 0 auto;
    padding: 0;

    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;

    transform: translateY(-485px);
}

#pun-navlinks > .container > li {
    position: relative;
    display: block;
    border: 0;
}

#pun-navlinks > .container > li > a {
    position: relative;
    display: block;
    padding: 0;

    color: var(--text-main);
    font: 600 13px/1 var(--def-font);
    letter-spacing: 0.035em;
    text-transform: lowercase;
    text-decoration: none;
}

#pun-navlinks > .container > li > a::before,
#pun-navlinks > .container > li > a::after {
    content: none !important;
    display: none !important;
}
#pun-navlinks > .container > li::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 5;

    width: 16px;
    height: 16px;
    background: var(--acc-color);

    clip-path: polygon(
        18% 0,
        50% 32%,
        82% 0,
        100% 18%,
        68% 50%,
        100% 82%,
        82% 100%,
        50% 68%,
        18% 100%,
        0 82%,
        32% 50%,
        0 18%
    );

    opacity: 0;
    transform: translate(-50%, -50%);
    transition: opacity 0.15s ease;
    pointer-events: none;
}

#pun-navlinks > .container > li:hover::after {
    opacity: 1;
}

#pun-navlinks > .container > li > a:hover,
#pun-navlinks > .container > li.isactive > a {
    color: var(--text-main);
}
#pun-ulinks {
    position: relative;
    top: auto;
    z-index: 15;
}

#pun-ulinks > .container {
    box-sizing: border-box;
    position: relative;
    top: auto;
    left: auto;

    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0;

    width: 1000px;
    min-height: 44px;
    margin: 0 0 0 -15px;
    padding: 14px 18px 12px;

    text-transform: lowercase;
    transform: none;

    background: transparent;
    border: 0;
    box-shadow: none;
}

#pun-ulinks > .container > li {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    margin: 0;
    padding: 0;
}

#pun-ulinks > .container > li + li {
    margin-left: 8px;
    padding-left: 16px;
}
#pun-ulinks > .container > li + li::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;

    width: 7px;
    height: 7px;
    background: var(--acc-color);

    clip-path: polygon(
        18% 0,
        50% 32%,
        82% 0,
        100% 18%,
        68% 50%,
        100% 82%,
        82% 100%,
        50% 68%,
        18% 100%,
        0 82%,
        32% 50%,
        0 18%
    );

    opacity: 0.85;
    transform: translateY(-50%) rotate(5deg);
    pointer-events: none;
}

#pun-ulinks > .container > li > a::before,
#pun-ulinks > .container > li > a::after {
    content: none !important;
    display: none !important;
}

#pun-ulinks > .container > li > a,
#pun-ulinks > .container > li > a:link,
#pun-ulinks > .container > li > a:visited {
    display: block;
    padding: 2px 0;

    color: var(--text-main);
    font: 650 10px/1 var(--def-font);
    letter-spacing: 0.015em;
    text-transform: lowercase;
    white-space: nowrap;
    text-decoration: none;
    text-shadow: none;

    transition: color 0.18s ease, transform 0.18s ease;
}

#pun-ulinks > .container > li > a:hover {
    color: var(--acc-deep);
    transform: translateY(-1px);
}
#custom_table .header-meta {
    position: absolute;
    left: 50%;
    right: auto;
    bottom: 27px;
    z-index: 25;

    display: flex;
    align-items: center;
    gap: 22px;

    width: auto;
    margin: 0;
    padding: 0;

    white-space: nowrap;
    transform: translateX(-50%);

    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

#custom_table .header-meta > .genre,
#custom_table .header-meta > .autumn-ed,
#custom_table .header-meta > .spirit_nav-wrap {
    box-sizing: border-box;
    position: relative;
    inset: auto;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 39px;
    margin: 0;
    padding: 0 14px;

    color: var(--pun-light);
    background: rgba(31, 24, 18, 0.86);

    border: 0;
    border-radius: 4px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 3px 8px rgba(15, 10, 7, 0.18);

    font: 700 11px/1 var(--def-font);
    letter-spacing: 0.025em;
    text-transform: lowercase;

    transition: background 0.18s ease, transform 0.18s ease;
}

#custom_table .header-meta > .genre {
    min-width: 150px;
}

#custom_table .header-meta > .autumn-ed {
    min-width: 165px;
}

#custom_table .header-meta > .spirit_nav-wrap {
    min-width: 135px;
}

#custom_table .header-meta > * + * {
    padding-left: 14px;
    border-left: 0;
}
#custom_table .header-meta > * + *::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -16px;

    width: 10px;
    height: 10px;
    background: var(--acc-color);

    clip-path: polygon(
        18% 0,
        50% 32%,
        82% 0,
        100% 18%,
        68% 50%,
        100% 82%,
        82% 100%,
        50% 68%,
        18% 100%,
        0 82%,
        32% 50%,
        0 18%
    );

    opacity: 0.95;
    transform: translateY(-50%) rotate(7deg);
    pointer-events: none;
}

#custom_table .header-meta span {
    margin-right: 7px;
    color: var(--acc-color);
    font: 750 9px/1 var(--def-font);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

#custom_table .header-meta .nav_button {
    position: relative;
    inset: auto;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 31px;
    margin: 0;
    padding: 0;

    color: var(--pun-light);
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;

    font: 700 11px/1 var(--def-font);
    letter-spacing: 0.025em;
    cursor: pointer;
}

#custom_table .header-meta > .genre:hover,
#custom_table .header-meta > .autumn-ed:hover,
#custom_table .header-meta > .spirit_nav-wrap:hover {
    background: rgba(48, 31, 19, 0.96);
    transform: translateY(-2px);
}

#custom_table .header-meta .nav_block {
    right: 50%;
    bottom: calc(100% + 9px);
    width: 250px;
    padding: 11px 13px;

    background: rgba(27, 21, 16, 0.96);
    border: 0;
    border-radius: 4px;
    box-shadow: 0 7px 16px rgba(16, 10, 6, 0.28);

    transform: translateX(50%);
}
#pun-announcement .container {
    padding: 0 10px 21px;
    text-align: center;
}

#pun-announcement .news-list {
box-sizing: border-box;
    position: relative;
    top: auto;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 941px;
    max-width: 100%;
    min-height: 32px;
    margin: 0 auto;
    padding: 2px 0 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    background: transparent;
    border: 0;
    box-shadow: none;
}

#pun-announcement .news-list::-webkit-scrollbar {
    display: none;
}

#pun-announcement a.news-btn,
#pun-announcement a.news-btn:link,
#pun-announcement a.news-btn:visited {
    box-sizing: border-box;
    position: relative;

    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;

    width: auto;
    height: 25px;
    margin: 0;
    padding: 0 10px;

    color: var(--pun-light);
    background: var(--pun-dark);
    border: 0;
    border-radius: 3px;
    box-shadow: none;

    text-decoration: none;
    transform: none;
    transition: background 0.18s ease, transform 0.18s ease;
}

#pun-announcement .news-date {
    margin-right: 7px;
    color: var(--acc-color);
    font: italic 700 11px/1 var(--cursivef);
    white-space: nowrap;
}

#pun-announcement .news-title {
color: var(--pun-light);
    font: 650 11px / 1 var(--def-font);
    letter-spacing: 0.02em;
    text-transform: lowercase;
    white-space: nowrap;
}

#pun-announcement a.news-btn:hover {
    color: var(--pun-light);
    background: var(--pun-dark-soft);
    transform: translateY(-2px);
    filter: none;
}
#pun-announcement a.news-btn.news-hot,
#pun-announcement a.news-btn.news-hot:link,
#pun-announcement a.news-btn.news-hot:visited {
    padding-left: 28px;
}

#pun-announcement a.news-btn.news-hot::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 9px;

    width: 8px;
    height: 8px;
    background: var(--acc-color);

    clip-path: polygon(
        18% 0,
        50% 32%,
        82% 0,
        100% 18%,
        68% 50%,
        100% 82%,
        82% 100%,
        50% 68%,
        18% 100%,
        0 82%,
        32% 50%,
        0 18%
    );

    transform: translateY(-50%) rotate(6deg);
    pointer-events: none;
}

#pun-announcement a.news-old {
    background: #5f5a3d;
    opacity: 0.68;
}

#pun-announcement a.news-old:hover {
    opacity: 1;
}
#pun-status .container {
    margin-top: 0;
    padding-bottom: 14px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 8px 30px;
}

#pun-status .container > .item1,
#pun-status .container > .item2,
#pun-status .container > .item3,
#pun-status .container > .item4 {
    flex: 0 1 auto;
    text-align: center;
}

#pun-status .container > .item1 { order: 1; }
#pun-status .container > .item2 { order: 2; }
#pun-status .container > .item3 { order: 3; }
#pun-status .container > .item4 { order: 4; }

#pun-status span {
    white-space: nowrap;
    margin-right: 5px;
    font: 11px / 1 var(--def-font);
    text-transform: lowercase;
}

#pun-crumbs1, #pun-crumbs2 {
margin-top: 0;
    overflow: hidden;
    text-align: center;
    font: 400 14px / 1 var(--sec-font);
    text-transform: lowercase;
}

#pun-crumbs2 {
    margin-top: 10px;
}

#pun-crumbs1 p.container {
	padding: 1em 1em 0.8em 1em;
	border-top: none;
}

#pun-crumbs1 .crumbs a:last-of-type,
#pun-crumbs2 .crumbs a:last-of-type {
color: var(--small-color);
}

#pun-crumbs1 .crumbs em,
#pun-crumbs2 .crumbs em {
    font-style: normal;
    font-size: 0;
}

#pun-crumbs1 .crumbs em::before,
#pun-crumbs2 .crumbs em::before {
    content: '\f54c';
    font-size: 12px;
    font-weight: 600;
    padding: 0 9px 0 4px;
    color: var(--pun-muted);
    font-family: 'Font Awesome 6 Pro';
}

#pun-crumbs1 .crumbs em:first-of-type,
#pun-crumbs2 .crumbs em:first-of-type {
    display: none;
}
#pun-about {
    margin: 0 !important;
    padding: 0 0 8px !important;
}

#pun-about .container {
    margin: 0 !important;
    padding: 5px 10px !important;
    text-align: center;
    font: var(--def-font);
    font-size: 10px;
    line-height: 1.15;
    text-transform: lowercase;
}

#pun-about p {
    margin: 1px 0 !important;
    padding: 0 !important;
    line-height: 1.15;
}

table {table-layout: fixed; width: 100%;}
#respect {width: auto;}

.tcl {width: 65%;}
.tc2, .tc3, .tcmod {text-align: center; width: 10%;}
.tcr {width: 40%;}

.punbb .main :is(.tc2, .tc3, .tcmod) {
    background-color: var(--bg-body);
    color: var(--text-main);
}
.punbb .main .tcr a {
    font-weight: 600;}

td {padding: 8px 10px;}
th {padding: 4px 10px;}
tbody.hasicon td.tcl {padding-left: 40px;}

#pun-debug table .tcl {width: 15%; white-space: normal;}
#pun-debug .tcr {width: 90%; white-space: normal;}

#pun-searchtopics .tcl,
#pun-modviewforum .tcl {width: 40%;}
#pun-searchtopics .tc2 {text-align: left; width: 20%;}
#profile.messages-container tbody .pmtcl1 {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    max-width: none;
}

#profile.messages-container tbody .pmtc22 {
    flex: 0 0 180px;
    width: 180px;
    min-width: 180px;
    max-width: 180px;
    justify-content: flex-start;
    text-align: left;
    gap: 6px;
    white-space: nowrap;
}

#profile.messages-container tbody .pmtc33 {
    flex: 0 0 90px;
    width: 90px;
    min-width: 90px;
    max-width: 90px;
    justify-content: center;
    white-space: nowrap;
}

#profile.messages-container tbody .pmtc24 {
    flex: 0 0 26px;
    width: 26px;
    min-width: 26px;
    max-width: 26px;
    padding: 8px 0;
    justify-content: center;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) thead {
    display: none;
}
:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody tr {
    display: flex;
    align-items: stretch;
    width: 100%;
    gap: 35px;
    font: 14px / 1 var(--sec-font);
    padding: 4px 12px;
    box-sizing: border-box;
    border-bottom: 1px solid rgba(94, 72, 51, 0.16);
    transition: background-color 0.16s ease;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody tr:hover {
    background: rgba(252, 250, 246, 0.78);
}
:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody td {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-width: 0;
    padding: 7px 0;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody td.tcl {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    padding-left: 0;
    text-transform: lowercase;
    align-items: flex-start;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody td.tcl .intd {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    min-width: 0;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody td.tcl .icon {
    flex: 0 0 auto;
    margin-top: 2px;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody td.tcl .tclcon {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 6px;
    row-gap: 5px;
    flex: 1 1 auto;
    min-width: 0;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody td.tcl .tclcon > a {
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum,
    #profile.messages-container) tbody td.tcl .tclcon .byuser {
    flex: 1 1 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum)
tbody :is(.tc2, .tc3, .tcmod) {
    flex: 0 0 60px;
    width: 60px;
    min-width: 60px;
    max-width: 60px;
    padding: 8px 0;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum, #profile.messages-container) tbody .tcr {
    display: flex;
    flex-wrap: wrap;
    width: 230px;
    max-width: 240px;
    min-width: 0;
    margin-left: 0;
    justify-content: flex-end;
    align-items: center;
    column-gap: 6px;
    row-gap: 5px;
    text-transform: lowercase;
    text-align: right;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum, #profile.messages-container) tbody .tcr em.user-avatar {
    flex: 0 0 auto;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum, #profile.messages-container) tbody .tcr > a {
    flex: 0 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum, #profile.messages-container) tbody .tcr .byuser {
    flex: 1 1 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum, #profile.messages-container) tbody .tcr .byuser::before,
:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum, #profile.messages-container) tbody td.tcl .tclcon .byuser::before {
    content: "àâòîð:";
    color: var(--text-soft);
}

#profile.messages-container tbody tr:has([id^="imageupload"]) {
    display: revert;
    width: auto;
    gap: 0;
    padding-bottom: 0;
}

#profile.messages-container [id^="imageupload"],
#profile.messages-container [id^="imageupload"] tr,
#profile.messages-container [id^="imageupload"] td {
    display: revert;
    align-items: initial;
    min-width: 0;
    padding: revert;
}
#pun-index #pun-category1 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/933799.png");
}
#pun-index #pun-category2 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/251653.png");
}
#pun-index #pun-category3 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/558635.png");
}
#pun-index #pun-category4 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/313044.png");
}
#pun-index #pun-category5 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/483333.png");
}
#pun-index #pun-category6 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/305581.png");
}
#pun-index #pun-category7 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/958118.png");
}
#pun-index #pun-category8 {
    --category-picture: url("https://upforme.ru/uploads/001c/c0/46/2/918949.png");
}
#pun-index .category { box-sizing:border-box; position:relative; background:var(--pun-soft); border:1px solid rgba(94,72,51,.16); overflow:hidden!important; }
#pun-index .category::after { content:""; position:absolute; top:0; bottom:0; z-index:1; background:var(--category-picture) center/cover no-repeat; filter:sepia(.18) saturate(.72) contrast(.96) brightness(.86); pointer-events:none; }
#pun-index .category > h2 { display:none!important; }
#pun-index .category > .container { box-sizing:border-box; position:relative; z-index:2; max-width:none!important; }
#pun-index .category tr { margin:0; border-bottom:1px solid rgba(94,72,51,.16); }
#pun-index .category tr:last-child { border-bottom:0; }
#pun-index .category .tcl,#pun-index .category .tcr { width:100%!important; position:static; left:auto; }
#pun-index .category .tclcon { box-sizing:border-box; width:100%; max-width:100%; }
#pun-index .category .tcr { text-align:left; }
#pun-searchtopics .tcl,#pun-modviewforum .tcl { width:40%; }
#pun-index .category {
    min-height: 0;
    border-radius: 3px!important;
    box-shadow: none;
    margin: 14px 0!important;
}

#pun-index .category::after {
    width: 92px;
    left: 0!important;
    right: auto!important;
}

#pun-index .category > .container {
    width: calc(100% - 92px)!important;
    margin-left: 92px!important;
    margin-right: 0!important;
}

#pun-index .category table,#pun-index .category tbody {
    display: block;
    width: 100%;
}

#pun-index .category tr {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px 254px;
    grid-template-areas:         'tcl mark tcr'        'links mark tcr';
    gap: 19px;
    align-items: center;
    min-height: 96px;
    padding: 15px 18px;
    background: transparent;
    box-sizing: border-box;
    height: auto !important;
    row-gap: 8px;
}

#pun-index .category tr:not(:has(.awrt-section-links)) {
    grid-template-columns: minmax(0, 1fr) 32px 223px;
    grid-template-areas: 'tcl mark tcr';
}

#pun-index .category tr .tcl {
    grid-area: tcl;
    min-width: 0;
    padding: 0!important;
}

#pun-index .category .tclcon {
    color: var(--text-soft);
    font: 500 11px/1.55 var(--def-font);
    text-transform: none;
    font-size: 11px;
    line-height: 1.45;
}

#pun-index .category .tcl h3 {
    font: 700 21px/1.15 var(--def-font);
    margin: 0 0 10px;
    text-transform: uppercase;
    letter-spacing: .015em;
    font-size: 17px;
    margin-bottom: 6px;
}

#pun-index .category .awrt-section-links {
    grid-area: links;
    width: auto;
    min-width: 0;
    padding: 0;
    border-right: 1px solid var(--line-color);
    padding-right: 10px;
    border: 0;
    align-self: start;
}

#pun-index .category .podlink-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px 0;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

#pun-index .category .podlink-container .podlink {
    display: inline-flex;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    color: #483323;
    font: 700 9px/1.35 var(--def-font);
    letter-spacing: 0;
    text-transform: lowercase;
    text-decoration: none;
    transition: background .15s,color .15s;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.4;
    align-items: center;
    white-space: nowrap;
}

#pun-index .category .podlink::before,#pun-index .category .podlink::after {
    content: none!important;
}

#pun-index .category .podlink-container .podlink:hover {
    color: #a95319;
    background: none;
    transform: none;
    text-decoration: none;
}

#pun-index .category tr::before {
    content: '\00d7';
    grid-area: mark;
    align-self: center;
    justify-self: center;
    font: 300 29px/1 Georgia,serif;
    color: #b8ae9c;
    width: 23px;
    height: 23px;
    text-align: center;
    border: 0;
    transform: none;
    font-size: 23px;
}

#pun-index .category tr.inew,#pun-index .category tr:has(.icon.inew) {
    background: transparent;
}

#pun-index .category tr.inew::before,#pun-index .category tr:has(.icon.inew)::before {
    color: var(--acc-color);
    border-color: var(--acc-color);
    background: #e1821d0b;
}

#pun-index .category tr .tcr {
    grid-area: tcr;
    display: block;
    padding: 0!important;
    min-width: 0;
    text-transform: none;
    font: 500 12px/1.45 var(--def-font);
    color: var(--text-soft);
}

#pun-index .category tr .tcr .user-avatar {
    display: block!important;
    float: left;
    width: 30px;
    height: 30px;
    margin: 0 8px 6px 0;
}

#pun-index .category tr .tcr .user-avatar a,#pun-index .category tr .tcr .avatar-image {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-size: cover;
}

#pun-index .category tr .tcr .lastpost-link {
    display: block;
    max-width: none;
    white-space: normal;
    overflow-wrap: anywhere;
    color: var(--acc-deep);
    font-weight: 700;
}

#pun-index .category tr .tcr br {
    display: none;
}

#pun-index .category tr .tcr .lastpost {
    display: block;
    margin-top: 4px;
    font-size: 10px;
}

#pun-index .category tr .tcr .datetime::before {
    content: none;
}

#pun-index .category tr :is(.tc2,.tc3) {
    display: none;
}

#pun-index .category .tcl h3 a {
    font: inherit;
    color: #30271f;
    text-decoration: none;
}

#pun-index .category .tcl h3 a:hover {
    color: var(--acc-deep);
    text-decoration: none;
}

#pun-index .category .podlink-container .podlink:focus-visible {
    outline: 2px solid var(--acc-color);
    outline-offset: 2px;
}

#pun-index .category .podlink-container .podlink + .podlink::before {
    content: "\00d7"!important;
    display: inline-block;
    position: static;
    margin: 0 8px;
    width: auto;
    height: auto;
    background: none;
    color: var(--acc-color);
    font: 700 12px/1 Arial,sans-serif;
    transform: none;
}

#pun-index :is(#pun-category1,#pun-category2,#pun-category3,#pun-category4,#pun-category5,#pun-category6,#pun-category7,#pun-category8) > .container {
    width: calc(100% - 92px)!important;
    margin-left: 92px!important;
    margin-right: 0!important;
}
#viewprofile table {
    width: 100%;
    border-collapse: collapse;
}

#viewprofile tbody {
    display: block;
    width: 100%;
}

#viewprofile tr {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    width: 100%;
}

#viewprofile td {
    display: block;
    padding: 0;
    vertical-align: top;
}

#viewprofile #profile-left {
    flex: 0 0 255px;
}

#profile-left strong {
    font-weight: inherit!important;
}

#viewprofile #profile-right {
display: flex !important;
    flex-wrap: wrap;
    flex: 1;
    gap: 12px;
    width: auto !important;
    padding: 20px !important;
    box-sizing: border-box;
    justify-content: center;
    text-transform: lowercase;
    font: 11px var(--def-font);
}

#viewprofile #profile-right .pa-fld5 {
    position: static;
    left: auto;
    bottom: auto;
    width: auto;
    height: auto;
    z-index: auto;
}
#viewprofile #profile-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    box-sizing: border-box;
    padding: 12px !important;
    background: var(--pun-soft);
    border-radius: 5px;
    text-align: center;
    text-transform: lowercase;
    font-family: var(--def-font);
    color: var(--text-main) !important;
    border: 1px solid rgba(94, 72, 51, 0.16);
    box-shadow: 3px 3px 4px rgba(43, 33, 25, 0.05);
}
#viewprofile #profile-name {
    width: 100%;
}

#viewprofile #profile-name strong {
    font: 700 16px / 18px var(--def-font);
    color: var(--text-main);
}
#viewprofile #pa-fld1 {
    width: 100%;
    margin: 0;
    padding: 0;
    background: transparent;
    font: 400 12px "Jost";
    color: var(--text-soft);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

#viewprofile #pa-fld1 strong {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

#viewprofile #pa-fld1 > span {
    display: none;
}

#viewprofile #pa-fld1 .char-name,
#viewprofile #pa-fld1 .char-race,
#viewprofile #pa-fld1 .char-desc {
    width: 100%;
    text-align: center;
padding: 0px 10px 0 10px;
}

#viewprofile #pa-fld1 .char-divider {
    margin: 0 auto 8px auto;
    background-repeat: no-repeat;
}

#viewprofile #profile-title {
font: 500 10px / 1 Jost;
color: var(--text-soft);
    letter-spacing: 0.3px;
text-transform: lowercase;}
#viewprofile #pa-avatar {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

#viewprofile #pa-avatar img {
    display: block;
    max-width: 180px;
    max-height: 180px;
    width: auto;
    height: auto;
    border-radius: 5px;
}
#viewprofile #profile-left #pa-fld3 {
    background: var(--pun-light);
    border: 1px solid var(--line-color);
    width: max-content;
    border-radius: 10px;
    padding: 4px 10px 4px 7px;
    font: 500 11px / 1 Jost;
    margin: 0 auto;
}

#viewprofile #profile-left #pa-fld3::before {
    content: "\f3c5";
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    margin-right: 4px;
    color: var(--acc-deep);
}

#viewprofile #profile-left #pa-fld3 > span {
    display: none;
}
#viewprofile #profile-left {
    position: relative; 
    overflow: visible;
}

#viewprofile #profile-left > div.status-container {
    position: absolute !important;
    width: 16px !important;
    height: 16px !important;
    top: -6px;
    right: auto;
    left: -6px;
    text-align: center;
    z-index: 20;
}

#viewprofile #profile-left .status-container {
    position: absolute !important;
    top: 8px;
    right: 8px;
    left: auto;
    width: 14px;
    height: 14px;
    z-index: 20;
}

#viewprofile #profile-left .status-container::after {
    font-size: 13px;
}

#viewprofile #pa-online,
#viewprofile #pa-last-visit {
    display: none;
}
.pa-fld1 .fld-name {display: none;}
.pa-fld3 .fld-name {display: none;}
.pa-fld4 .fld-name {display: none;}

#profile8 .fs-box {
    display: flex;
    flex-direction: column;
}

#profile8 .infofield {
    order: -1;
    margin-bottom: -4px; 
    font: 500 14px 'Jost';
}
#viewprofile #profile-left > div,
#viewprofile #profile-left > dl,
#viewprofile #profile-left > ul,
#viewprofile #profile-left > p {
    width: 100%;
    text-align: center;
}

#viewprofile li#pa-invites { display: none!important; }
#viewprofile #profile-right > li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1 1 180px;
    min-width: 180px;
    min-height: 50px;
    position: relative;
    padding: 10px !important;
    gap: 4px;
    background: var(--pun-soft);
    border: 1px solid rgba(94, 72, 51, 0.14);
    border-radius: 5px;
    text-align: center;
}

#viewprofile #profile-right li>span {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 171px;
    height: 23px;
    padding: 0 20px;
    margin: 0;
    border-radius: 0 0 7px 7px;
    background: rgba(252, 250, 246, 0.78);
    font: 500 12px var(--sec-font);
    text-transform: lowercase;
}

#profile-right li strong {
padding-top: 13px;
    padding-left: 0 !important;
    font-weight: 600;
    font-size: 12px;
}
#viewprofile #profile-right #profile-edit-wrap {
    flex: 0 0 100%;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}

#viewprofile #profile-right #profile-edit-wrap a {
    display: inline-block;
    padding: 4px 10px 6px 10px;
    background: var(--pun-dark);
    color: var(--pun-light);
    font: 600 11px / 1 var(--def-font);
    text-transform: lowercase;
    border-radius: 4px;
    transition: all .2s ease;
}

#viewprofile #profile-right #profile-edit-wrap a:hover {
    background: var(--acc-color);
    color: var(--pun-dark);
}
.category td .modlist {
display: block;
padding-top: 5px;
}
#pun-stats { box-sizing:border-box; width:100%; margin:20px 0 0; padding:0 8px 5px; border:0; background:none; }
#pun-stats > h2 { display:none; }
#pun-stats .statscon > ul.container { display:grid; grid-template-columns:auto auto auto 1fr; gap:0; margin:0!important; padding:0!important; list-style:none; border:0; background:none; font:500 11px/1.6 var(--def-font); color:var(--text-soft); }
#pun-stats .container > li { box-sizing:border-box; float:none; width:auto; margin:0; }
#pun-stats .container > :is(.item1,.item2,.item3,.item4) { display:flex; flex-direction:row; align-items:baseline; gap:5px; padding:7px 10px; border:0; text-align:left; white-space:nowrap; font-size:9px; }
#pun-stats .container > :is(.item1,.item2,.item3,.item4) > strong { font:700 10px/1.2 var(--def-font); color:var(--acc-color); }
#pun-stats .container > :is(.item1,.item2,.item3,.item4) > span { min-height:0; }
#pun-stats .container > .item4 > strong a { color:var(--acc-deep); }
#pun-stats .container > li.item5 { grid-column:1/-1; padding:3px 0!important; text-align:justify!important; font:500 10px/1.6 var(--def-font); }
#pun-stats .container > li.item5 div { padding:0!important; }
#pun-stats .item5 div > a { color:var(--acc-deep); font-weight:700; }
#pun-stats .item5 span { margin-left:8px; }
#awrt-footer-art { width:calc(100% + 30px); height:100px; margin:0 -15px; background:url("https://upforme.ru/uploads/001c/c0/46/2/70535.png") center 57%/cover no-repeat; border-radius:0 0 28px 28px; }

.multipage {margin-top: 30px;}

.linkst,
.linksb {
    font-family: var(--def-font);
    text-transform: lowercase;
}

.linkst .pagelink strong,
.linkst .postlink strong,
.linksb .pagelink strong,
.linksb .postlink strong {
background: var(--pun-light);
    padding: 0px 5px;
    border-radius: 3px;
    font: 600 12px / 1 var(--sec-font);
}

.linkst {
    position: relative;
    height: 0;
    padding-bottom: 10px;
}

.linkst .pagelink,
.linkst .postlink {
    position: absolute;
    top: -50px;
}

.linkst .pagelink { left: 10px; }
.linkst .postlink { right: 10px; text-align: right; }

.linksb {
    text-align: right;
    padding: 4px 10px;
}

.linksb .pagelink {
    float: left;
    text-align: left;
}

.linksb .postlink {
    float: right;
}

.subscribelink {
    clear: both;
    padding: 5px 0;
}
.modmenu .container {padding: 5px 10px;text-align: right;}
.modmenu .container strong {float: left;}
.modmenu input {margin-left: 10px;}

.punbb input, .punbb select {
    color: var(--text-main);
    background-color: var(--pun-light);
    padding: 3px 10px 3px 10px;
    border: 1px solid rgba(94, 72, 51, 0.18);
    border-radius: 5px;
    display: inline-block;
}
.post {margin-top: 10px;}

.post {
    position: relative;
    z-index: 0;
}

.toppost, .topicpost {margin-top: 0;}
.post h3 span {
padding: 5px 10px;
    margin-bottom: 3px;
    display: block;
    margin-left: 247px;
    color: var(--text-main);
    background-color: var(--pun-soft);
    font: 800 13px / 1 var(--def-font);
    text-transform: uppercase;
    border-radius: 5px;
}
.post h3 strong {
    float: right;
    text-align: right;
    font: 600 21px / 1 var(--cursivef);
    color: var(--text-main);
    margin: -1px 0 0px 0;
}
.post-author {
    float: left;
    width: 200px;
    font-size: 10px;
    margin: 0 0 50px 33px; 
    font-family: verdana;
    position: relative;
    border-radius: 10px;
    text-align: center;
    z-index: 1;
}

.post-author ul::before {
    z-index: 5;
    background: var(--pun-soft);
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    inset: 0;
    border-radius: 8px;
}

.post-author ul {
    z-index: 10;
    background-color: var(--pun-soft);
    position: relative;
    border-radius: 8px;
}

.post-author ul li:is(:not(.pa-fld4)):not(.pa-fld6) {
    position: relative;
    z-index: 10;
}

/* ÍÈÊ ÀÂÒÎÐÀ */
.pa-author {
    position: absolute !important;
    top: -38px;
    left: 44px;
    width: 100px;
    height: 34px;
    display: flex;
    align-items: center;
    text-transform: lowercase;
    justify-content: flex-start;
    text-align: left;
    font: 800 17px / 18px var(--def-font);}

.pa-title {
    text-transform: lowercase;
    margin-top: 7px;
    padding: 7px;
    color: var(--text-soft);
    background-color: var(--pun-soft);
    letter-spacing: 0.3px;
    font: 500 11px / 1 Jost;
border-radius: 8px 8px 0 0;}

li.pa-avatar item2 {
background-color: var(--pun-soft);
}
.pstats {
display: flex;
    gap: 2px;
    padding: 10px 0;
    justify-content: center;
    align-items: center;
    font: 400 9px "Jost";
    text-transform: lowercase;
    color: var(--text-main);
    flex-wrap: nowrap;
    white-space: nowrap;
    word-spacing: -2px;
}

.pa-fld1 {
    line-height: 110%;
    margin-top: 7px;
text-transform: lowercase;
}

.pa-fld1 .char-name a {
    color: var(--text-main)!important;
}
.pa-fld1 .char-name a:hover {
    color: var(--acc-deep) !important;
}

.char-name {
font: italic 900 15px / 1 var(--cursivef);
    color: var(--text-main);
    text-transform: lowercase;
    margin-bottom: 2px;
}

.char-race {
    text-transform: lowercase;
    color: var(--text-soft);
    margin: 4px 0 7px 0;
    font: 500 10px / 1 var(--sec-font);
}

.char-divider {
    width: 180px;
    height: 1px;
    background: url(https://upforme.ru/uploads/001c/be/8c/2/684010.png);
    margin: 0 auto 8px auto;
}

.char-desc {
   color: var(--text-main);
    padding: 0px 10px 15px 10px;
    font: 400 11px / 1 Jost;
    text-align: justify;
    text-transform: lowercase;
}

.pa-fld1 a {    color: var(--text-main) !important;
    font-weight: 600;}
.pa-fld1 a:hover {color: var(--acc-deep)!important;}

.pa-fld3 {
background: var(--pun-light);
    border: 1px solid var(--line-color);
    width: max-content;
    border-radius: 10px;
    padding: 4px 10px 4px 7px;
    font: 500 11px / 1 Jost;
    margin: 0 auto;}

.pa-fld3::before {
content: "\f3c5";
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    margin-right: 4px;
    color: var(--acc-deep);
}

.post-author::before {
    content: '';
    position: absolute;
    left: -28px;
    top: -37px;
    width: 65px;
    height: calc(100% + 50px);
    z-index: -1;
    border-radius: 8px;
    background-image: var(--bookmark-default);
    background-size: cover;
    background-position: center;
}
.pa-fld4 {
    position: absolute;
    left: -28px;
    top: -44px;
    width: 65px;
    height: calc(100% + 82px);
    z-index: 0;
    border-radius: 8px;
    background-image: var(--bookmark-default);
    background-size: cover;
    background-position: center;
}

.pa-fld4 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    display: block;
}

.pa-fld4 .perspage1 {
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.pa-fld4 .perspage1 a.modal-link {
    display: block;
    width: 100%;
    height: 100%;
}

.pa-fld6 {
align-content: center;
    position: absolute;
    left: 22px;
    bottom: -45px;
    height: 53px;
    width: 168px;
    box-sizing: border-box;
    padding: 11px 7px 5px 23px;
    background-color: #C99746;
    background-size: cover;
    background-position: center;
    border-radius: 0 0 8px 8px;
    text-transform: lowercase;
    color: var(--pun-dark);
    font: 500 11px / 11px var(--sec-font);
    text-align: center;
    z-index: -2;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.pa-posts, .pa-respect, .pa-fld2, .pa-fld5 {
    display: inline-flex;
    gap: 5px;
    font-size: 10px;
    padding: 0 5px !important;
    margin-top: 4px !important;
    margin-bottom: 15px;
    width: auto;
    height: auto;
    line-height: 13px;
    text-transform: lowercase;
}

.pa-fld2 a {
    font-size: 10px;
    text-transform: uppercase;
    color: var(--text-main) !important;
}

.pa-posts .fld-name:before,
.pa-respect .fld-name a:before,
.gid3 .pa-respect .fld-name:before,
.pa-fld2 .fld-name:before, 
.pa-fld5 .fld-name:before {
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    display: block;
    width: 10px;
    height: 10px;
    font-size: 10px;
    line-height: 10px;
    margin-top: 1px !important;
    text-align: center;
}
.pa-posts .fld-name:before { content: "\f0e0"; }
.pa-respect .fld-name a:before,
.gid3 .pa-respect .fld-name:before { content: "\f004"; }
.pa-fld2 .fld-name:before { content: "\f4d3"; } 

.pa-fld5 .fld-name:before { content: "\f56b"; } 

.pa-posts .fld-name,
.pa-respect .fld-name,
.pa-fld2 .fld-name, 
.pa-fld5 .fld-name {
    font-size: 0;
    height: 16px;
    justify-content: center;
    opacity: 0.4;
}

.post-body {margin-left: 245px;}

.post-box {
    height: auto;
    min-height: 0;
    align-self: flex-start;
    padding: 16px 18px;
    color: var(--text-main);
    border-radius: 8px;
    box-sizing: border-box;
    text-align: justify;
}

.punbb .post-content {
padding: 14px 11px;
    box-sizing: border-box;
    width: 105%;
    margin-left: -17px;
    background: var(--pun-light);
    border: 1px solid rgba(94, 72, 51, 0.16);
    border-radius: 10px;
}

li.pa-avatar img {
    max-width: 180px;
    max-height: 180px;
    border-radius: 5px;}

.post-links {margin-left: 300px;}

.post-links ul {
padding: 9px 0px 40px 0;
    margin-left: -300px;
    text-align: right;
    text-transform: lowercase;
}

.post-links li {
    display: inline;
    padding-left: 5px;
transition: all .2s ease;
}

.post-links li a {
    display: inline-block;
    border: 1px solid var(--line-color);
    background: var(--pun-soft);
    border-radius: 5px;
    padding: 2px 9px;
    font: 400 12px/1 var(--sec-font);
    letter-spacing: 0.3px;
}
.post-links li a:hover {
    border: 1px solid var(--acc-deep);
    background: var(--pun-light);
    color: var(--acc-deep);
}

.pl-email, .pl-website {float: left;}
.clearer {clear: both; height: 0; font-size: 0;}

textarea#main-reply {
text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-moz-text-size-adjust: 100%; 
-webkit-text-size-adjust: 100%;
}

.punbb textarea {
    color: var(--text-main);
    background: var(--pun-light);
    padding: 10px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid rgba(94, 72, 51, 0.18);
    font: 1em verdana, arial, helvetica, sans-serif;
}
button,
.button,
input[type="button"],
input[type="submit"] {
    background: var(--pun-dark);
    color: var(--pun-light);
    margin: 4px !important;
    padding: 5px 10px;
    font: 400 13px / 1 var(--sec-font);
    text-transform: lowercase;
    cursor: pointer;
    transition: all .2s ease;
    display: inline-flex;
border: none;
    border-radius: 5px;
}

button:hover,
.button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
  background: var(--acc-color);
  color: var(--pun-dark);
}

button:disabled,
.button:disabled,
input:disabled {
  background: rgb(20 20 20 / .12);
  color: rgb(20 20 20 / .388);
  cursor: not-allowed;
}

button:disabled:hover,
.button:disabled:hover,
input:disabled:hover {
  background: rgb(20 20 20 / .12) !important;
  color: rgb(20 20 20 / .388) !important;
}
.post-sig dt, .post-sig dd, .post-sig dl {margin: 0} 
.post-sig dt {
display: block;
margin: 5px 0;
}
pre {font: 11px monaco;}
.post-content em {font-style: italic}
.post .post-content td {border-width: 0px !important;}
.post-content em.bbuline {font-style: normal; text-decoration: underline;}
.post-content p {
margin: 0;
line-height: 150%;
padding: 8px 0 12px 0;
overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
}

.post-content p a {
font-weight: bold;
    color: var(--acc-deep) !important;
}
.post-content p a:hover {
    color: var(--acc-color)!important;
}

.post-content .highlight-text {
    background-color: #D9C394!important;
}

.post-content img {vertical-align: middle;}
.scrollbox {
width: 100%;
overflow: auto;
max-height: 200px;
}
.quote-box, .code-box {
margin: 10px 0px 10px;
    padding: 13px;
    background: var(--pun-soft);
    border: 1px solid rgba(94, 72, 51, 0.16);
    border-radius: 10px;
}
.quote-box cite {
    display: block;
    text-transform: lowercase;
    padding-bottom: 6px;
    font: 800 15px / 1 var(--def-font);
}

.code-box strong.legend {
    display: block;
    padding-bottom: 13px;
    text-transform: lowercase;
    font: 800 14px / 1 var(--def-font);
}

.code-box pre {
    font: 400 11px / 160% 'courier new';
    white-space: break-spaces;
    color: var(--text-soft);}

blockcode,
blockquote {
  overflow: hidden;
}

.code-box .scrollbox {
  width: 100%;
  overflow: hidden auto;
  height: auto !important;
  max-height: 20vh;
}
.checkfield input[type="checkbox"], .radiofield input[type="radio"] {margin: 0 3px;}
p[class="checkfield"] *, div[class="checkfield"] *, fieldset[class="radiofield"] * {height: 20px; vertical-align: middle;}

textarea, input, select, optgroup {font-size: 14px;}
optgroup {font-weight: bold;}

#pun-admain textarea, #pun-admain input, #pun-admain select, #pun-admain optgroup {
    font: 1em verdana, arial, helvetica, sans-serif;
}

.formal .container {padding: 10px 20px;}

.formsubmit {
padding: 0 0 0 15px;
margin: 0px 0 0 0;
}
.formsubmit input, .formsubmit a, .formsubmit span {margin: 0 6px 0 0;}

fieldset {border: none;}
fieldset legend {
font-style: italic;
font-weight: bold
}
fieldset fieldset {
border: none;
margin: 0;
padding: 0 0 8px 0
}
.fs-box {padding: 5px 0;}
.fs-box p, .fs-box fieldset {padding: 0 0 8px 0;}

.inline .inputfield, .inline .selectfield, .inline .passfield {float: left;margin-right: 1em;}
.inline .infofield {clear:both}
.datafield br {display: none}
.required label, .datafield span.input {font-size: 10px;}
textarea, .longinput input {width: 64%; margin: 0;}
.hashelp {position: relative;}
#pun-post .topic {margin-top: 10px;}
#profile .container {padding-left: 0px;}

#profilenav {
display:block;
width:auto;
padding-top: 0px; 
text-align: center; 
}
#profilenav li {
    margin: auto 2px 6px 2px;
    padding: 2px 5px;
    border-radius: 4px;
    font: 400 12px var(--sec-font);
    background: var(--pun-dark);
    display: inline-flex;
    text-transform: lowercase;
    transition: all .1s ease-in-out;
}
#profilenav li:hover, #profilenav li:focus, #pun-main li.isactive {
background: var(--acc-color);}

#profilenav li a {
color: var(--pun-light);
}
#profilenav li a:hover {
color: var(--pun-dark);
}

#profilenav li.item9, li.item10 {
display:none;}

#viewprofile-next #profilenav {display: none;}

div#profilenav {
    display: block !important;
}

#viewprofile ul, #profilenav ul {
    margin: 0 0 1em 0;
    padding: 0.3em 1em 0.5em 1em;
    border-style: none;
    border-width: 0px;
    border-color: transparent;
}

#viewprofile ul:last-child, #profilenav ul:last-child {margin-bottom: 0em;}

#viewprofile h2 span, #profilenav h2 span {
position: relative;
padding: 0 5px;
display: none;
}

#viewprofile li, #setmods dl {margin-bottom: 0.2em; padding: 0 0 0 16em;}

label {
    cursor: default;
    font: 500 14px 'Jost';
    text-transform: lowercase;
}

#viewprofile h2, #profilenav h2 {
padding: 0;
margin: 0;
}
img.avatardemo {float: right;margin: 0 0 8px 18px;}
#pun-userlist .formal, #pun-userlist .formal .container {margin-bottom: 0;}
#pun-userlist .tc2 {
text-align: left;
width: 20%;
}
#pun-userlist .tcl {width: 40%}
.info .container {padding: 5px 10px;}
.info .container .backlink {padding-top: 8px;}
.info-box {
padding: 10px 15px;
margin: 0 0 10px 0;
}
.info-box * {padding: 0 0 5px 0;}
.info-box .legend {font-weight: bold;}
#pun-index .user-avatar, .punbb .user-avatar {
    display: none!important;
}

del {
    filter: blur(2px);
    text-decoration: none;
    transition:.10s;
}
del:hover {
    filter: initial;
    transition:.10s;
}
#pun_wrap #post .container[id$="-area"] {
	max-height: 195px;
	overflow: auto;
}

#pun_wrap #post .container[id$="-area"],
#video-area-tinp,
#image-area-tinp,
.pun-modal .modal-inner,
.inner,
#post-sig .container[id$="-area"] {
    color: var(--text-main);
    background: var(--pun-light);
    border: 1px solid rgba(94, 72, 51, 0.18);
    border-radius: 8px;
}

.spoiler-box>div[onclick]>p {
	display: inline-block;
	margin: 0 !important;
	padding: 0 !important;
}

.post-content .spoiler-box>div {
background: none !important;
    cursor: pointer;
    padding-left: 32px !important;
    position: relative;
    text-transform: lowercase;
    border-radius: 5px;
    font: 700 14px / 1 var(--def-font);
    color: var(--text-main);
}

.post-content .spoiler-box>div::before {
content: "\f6e2";
    font-family: "Font Awesome 6 Pro";
    font-weight: 600;
    font-size: 16px;
    font-style: normal;
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    transition: transform .25s ease;
    color: var(--acc-deep);
}

.post-content .spoiler-box>div.visible::before {
	transform: translateY(-50%) rotate(180deg);
}
::selection {
    background: rgba(225, 130, 29, 0.28);
    color: var(--pun-dark);
}
.post-content p abbr {
    text-decoration: underline;
    text-decoration-color: var(--acc-deep);
    text-decoration-style: wavy;
    text-decoration-thickness: 0.5px;
    cursor: pointer;
}

/* ÈÍÄÈÊÀÒÎÐ ÎÍËÀÉÍÀ deff, vandra */
.pa-online, .pa-last-visit {
    display: none;
}

.status-offline::after,
.status-online::after {
position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 900 !important;
    font-size: 12px;
}

.status-offline::after {
    content: '\f4c9';
    color: var(--pun-muted);
}

.status-online::after {
content: '\f4c9';
    color: var(--small-color);
}
.status-container,
.status-online,
.status-offline {
position: absolute !important;
    top: -2px;
    left: 192px;
    width: 10px;
    height: 10px;
    z-index: 100;
    cursor: pointer;
}
.post-rating p a {
display: inline-flex;
    align-items: center;
    gap: 5px;
    font: italic 700 13px / 0 var(--cursivef);
    background: var(--pun-soft);
    border-radius: 5px;
    padding: 3px 7px;
    color: var(--text-soft);
    text-decoration: none;
}

.post-rating p a::before {
content: "";
    width: 18px;
    height: 18px;
    display: inline-block;
    background-color: var(--text-soft);
    -webkit-mask: url(https://forumstatic.ru/files/001c/c4/75/12074.svg) center / contain no-repeat;
    mask: url(https://forumstatic.ru/files/001c/c4/75/12074.svg) center / contain no-repeat;
    transform: rotate(0deg);
    transition: background-color 0.3s ease, transform 0.3s ease-out;
}

.post-rating p:hover a::before {
    background-color: var(--acc-deep);
    animation: swing 0.7s ease-in-out infinite; 
}
.mylike .post-rating p a::before {
    background-color: var(--acc-color);
}

@keyframes swing {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(-15deg); }
    75% { transform: rotate(15deg); }
    100% { transform: rotate(0deg); }
}
div.post-vote {
    margin-bottom: 65px;
}
div.post-vote p>a {
font-size: 0 !important;
    position: absolute;
    cursor: pointer;
    z-index: 200;
    width: 15px;
    height: 15px;
    background-color: var(--text-soft);
    -webkit-mask: url(https://forumstatic.ru/files/001b/bd/50/86006.svg) center / contain no-repeat;
    mask: url(https://forumstatic.ru/files/001b/bd/50/86006.svg) center / contain no-repeat;
    display: block;
    background-size: 100%;
    margin-left: -4px;
    margin-top: 7px;
}

.fonchiki {
    display: grid;
    grid-template-columns: repeat(8, 70px);
    gap: 10px;
    justify-content: center;
    align-content: start;
    padding: 15px;
    box-sizing: border-box;
    line-height: 0; 
    font-size: 0;
}

.fonchiki br {
    display: none !important;
}

.fonchiki img {
    display: block !important;
    width: 70px !important;
    min-width: 70px !important;
    max-width: 70px !important;
    height: 200px !important;
    min-height: 200px !important;
    max-height: 200px !important;
    object-fit: cover;
    object-position: top;
    border-radius: 8px;
    box-shadow: 2px 2px 4px #0000003b;
    transition: all 0.2s ease-out;}

.fonchiki img:hover {
    filter: none;
    box-shadow: 2px 2px 4px #0000008c;
}

.hvStickerPackModal {
    padding: 12px 13px 9px!important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: solid 1px var(--line-color);
    border-radius: 11px!important;
    background: var(--pun-light)!important;
    position: absolute;
    display: none;
    bottom: 34px!important;
    left: 0;
    z-index: 100;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}

.hvStickerPackModalContent {
    border: none!important;
    padding: 9px!important;
    min-height: 70px!important;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -ms-flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    max-height: 233px!important;
    overflow-x: hidden;
    overflow-y: auto;
}

#pun-navlinks.section .multiacc-profilemenu {
  position: absolute;
  top: 20px;
  right: 0px;
  width: max-content;
  height: auto;
  background: var(--pun-light);
  border-radius: 20px;
  border-inline: 1px solid var(--line-color);
  color: var(--text-main);
}

.multiacc-profilemenu li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 12px;
  gap: 10px;
  width: 100%;
}

.multiacc-profilemenu li a {
  display: block;
  flex-grow: 1;
  text-align: left;
  padding-left: 20px;
  position: relative;
}

.multiacc-profilemenu li:first-child {
  background-color: var(--pun-soft);
  font-weight: 700;
}

#pun-navlinks.section .multiacc-profilemenu li {
  position: relative;
  display: flex;
  justify-content: space-evenly;
  align-items: flex-end;
  font-size: 0.8rem;
  padding: 6px 16px 10px;
  border-bottom: 1px solid rgba(94, 72, 51, 0.18);
  top: 0;
}

#pun-navlinks.section .multiacc-profilemenu li:last-child {
  border-bottom: 0;
}

#pun-navlinks.section .multiacc-profilemenu li:hover {
  background: rgba(225, 130, 29, 0.12);
  box-shadow: none;
}

#pun-navlinks.section .multiacc-profilemenu li a {
  color: var(--text-main);
}

#pun-navlinks.section .multiacc-profilemenu li a:hover {
  color: var(--acc-deep);
}

#navprofiles {
  position: relative;
  z-index: 10000;
}

.multiacc-profilemenu {
  position: absolute;
  z-index: 10000;
}

.multiacc-delete-btn {
  background: none;
  border: none;
  cursor: pointer;
  flex-shrink: 0;
  margin-left: auto;
}

.multiacc-dialog {
  z-index: 9999;
  padding: 10px;
  font-size: 0.8rem;
  background: var(--pun-light) !important;
  border: 1px solid var(--line-color);
  color: var(--text-main);
}

.multiacc-dialog > form {
  border: 1px solid rgba(94, 72, 51, 0.18);
  padding: 10px 10px 2px;
}

.multiacc-dialog input {
  padding: 4px 10px;
  border: 1px solid var(--line-color);
}

.multiacc-dialog div {
  display: flex;
  justify-content: center;
}

.multiacc-dialog div:not(.multiacc-dialog div:last-child) {
  flex-direction: column;
}

.multiacc-dialog button {
  margin: 6px;
  padding: 4px 8px;
  background: var(--pun-soft);
  color: var(--text-main);
  border-inline: 1px solid var(--line-color);
  border-block: 0;
  border-radius: 4px;
  cursor: pointer;
}

.multiacc-dialog button:hover {
  color: var(--pun-dark);
}

#gacha-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 9998;
}

#gacha {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 320px;
  padding: 10px;
  color: var(--text-main);
  background: var(--pun-light);
  border: 1px solid var(--line-color);
  z-index: 9999;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

#gacha-roll {
    background-color: var(--pun-dark);
    color: var(--pun-light);
    font-family: Noto Sans Mono;
    border: none;
    padding: 4px 10px;
    transition: background-color 1s ease-in;
    width: 100%
}

#gacha-roll:hover {
    background-color: var(--acc-color);
    color: var(--pun-dark);
}

#gacha input {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 6px;
    padding: 6px 10px;
}

#gacha-result-text {
    margin-bottom: 10px;
    text-align: center;
    font-family: Noto Sans Mono;
    font-size: 16px;
    font-style: italic;
}

#gacha-result-subline {
    font-size: 10px;
    text-align: center;
    margin-bottom: 6px;
}

#profile.messages-container #plng {
  display: none !important;
}

#profile.messages-container fieldset {
    border-radius: 6px;
    background: var(--pun-soft);
    padding: 12px 16px;
    margin-bottom: 20px;
}

#profile.messages-container fieldset legend {
  padding: 0;
  margin: 0 0 0 10px;
}

#profile.messages-container fieldset legend strong,
#profile.messages-container fieldset legend span {
display: inline-block;
    padding: 2px 11px;
    background: var(--pun-dark);
    border-radius: 4px;
    font: 400 13px "Jost", sans-serif;
    letter-spacing: .08em;
    text-transform: lowercase;
    color: var(--pun-light);
}

/***** Ñòèëü. Âêëàäêè â ïîñòàõ ââ-êîäàìè. (done by Kolobdur) *****/
.wrapper{
  display: grid;
  grid-template:
                 ". buttop ." auto
                 "butleft windows butright" auto
                 ". butbottom ." auto 
                 / auto 1fr auto;				 
  overflow: hidden;
}

.buttop {grid-area: buttop;}
.butleft {grid-area: butleft;}
.butright {grid-area: butright;}
.butbottom {grid-area: butbottom;}

.buttons {z-index: 2;}

.buttons div {
  padding: 10px 20px;
  transition: background-color .3s;
  color: var(--text-main);
  text-align: center;
  cursor:pointer;
border-radius: 7px;
background: var(--pun-soft);
}

.buttop, .butbottom {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
font: 500 13px var(--def-font);
gap: 6px;
padding-top: 13px;
}

.windows{
  position: relative;
    display: grid;
    grid-area: windows;
    background: transparent;
    color: var(--text-main);
}

.window {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.window.activevkladka {
  position: static; 
}

.window {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  overflow: auto;
  line-height: 1.4em;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.2s, transform 0.2s;
  transition-delay: 0.4s;
    padding: 21px 10px 0 0;
  z-index: 0;
}

.wrapper > br, .wrapper > p, .buttons > br, .buttons > p, .windows > br, .windows > p {
  display: none;
}

.windows > div {
  transition: transform 0.2s;
  transform: translateX(86%);
}
 
.windows > .activevkladka {
  transform: translateX(0%);
  opacity: 1;
  z-index: 1;
}

.buttons div:hover,
.buttons > .activevkladka {
    background: var(--pun-dark) !important;
    color: var(--pun-light) !important;
}
.icons-vkladka:before {
  content: '\412\043A\043B\0430\0434\043A\0438';
  font-size: 12px;
} 
.icons-vkladka:hover:before{margin-top: -4px;}
.icons-vkladka:hover, .tab-list:hover {
  color: var(--acc-color);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -webkit-transition: transform 0.2s ease-in-out;
  -moz-transition: transform 0.2s ease-in-out;
  -ms-transition: transform 0.2s ease-in-out;
}
#vkladka-area div {
  cursor: pointer;
  font-weight: normal;
  width: 220px;
  margin-bottom: 10px;
}
#vkladka-area div:hover {overflow: hidden;}
.tab-list:hover {transform-origin: center left;}
#vkladka-area span {display: none;}
#episodesOpenBtn {
    color: var(--acc-color) !important;
    padding: 0px 5px;
    border-radius: 4px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;}
#custom_table .genre { cursor:pointer; user-select:none; }
#custom_table .genre:focus-visible { outline:1px solid var(--acc-color); outline-offset:4px; }
#header-scare-layer { position:absolute; inset:0; z-index:999; display:grid; place-items:center; overflow:hidden; border-radius:38px 38px 0 0; background:radial-gradient(ellipse at 50% 45%,#25231b 0%,#080a08 48%,#020302 85%); visibility:hidden; opacity:0; pointer-events:none; }
#header-scare-layer::after { content:""; position:absolute; inset:0; background:repeating-linear-gradient(0deg,transparent 0 3px,#0005 3px 4px); opacity:.3; box-shadow:inset 0 0 100px 45px #000; }
#header-scare-layer.is-active { visibility:visible; opacity:1; }
.header-scare-face { width:min(65%,530px); height:auto; opacity:0; transform-origin:50% 60%; filter:drop-shadow(0 0 7px #c8b78955); }
#header-scare-layer.is-active .header-scare-face { animation:awrt-scare-face 5s both; }
.header-scare-eyes { fill:#e1dcc2; filter:drop-shadow(0 0 5px #d8d4ac); }
.header-scare-teeth { fill:#c9c5ab; stroke:#45483b; stroke-width:.8; }
@keyframes awrt-scare-scene { 0%{opacity:0} 8%,100%{opacity:1} }
@keyframes awrt-scare-face { 0%,10%{opacity:.65;transform:scale(.75) rotate(-4deg)} 23%{opacity:.55;transform:scale(.82) rotate(-4deg)} 57%{opacity:.85;transform:scale(.94) rotate(-2deg)} 62%{opacity:1;transform:scale(1.26) rotate(3deg)} 67%{transform:scale(1.2) rotate(1deg)} 85%{opacity:1;transform:scale(1.3) rotate(2deg)} 100%{opacity:1;transform:scale(1.32) rotate(2deg)} }
@media(prefers-reduced-motion:reduce) { #header-scare-layer.is-active .header-scare-face { animation:none;opacity:1;transform:none; } }

html,
body {
    background:
        var(--pun-main)
        url("https://upforme.ru/uploads/001c/c0/46/2/750027.png")
        center top / cover no-repeat fixed !important;
}

#pun-redirect,
#pun-maint {
    box-sizing: border-box;
    float: none !important;

    width: 970px !important;
    margin: 120px auto !important;
    padding: 25px !important;

    color: var(--text-main);
    background: var(--pun-light) !important;

    border: 0;
    border-radius: 20px;
    box-shadow: none;
}

#pun-redirect .main,
#pun-redirect .container,
#pun-maint .main,
#pun-maint .container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.post-content :is(p, li, blockquote, dd) a:not(.button) {
    display: inline;
    padding: 0 2px;

    color: var(--acc-deep) !important;
    font-weight: 700;
    text-decoration: none;

    border-bottom: 1px solid rgba(225, 130, 29, 0.65);
    box-shadow: inset 0 -0.42em 0 rgba(225, 130, 29, 0.18);

    transition:
        color 0.18s ease,
        box-shadow 0.18s ease,
        border-color 0.18s ease;
}

.post-content :is(p, li, blockquote, dd) a:not(.button):hover {
    color: var(--pun-dark) !important;
    border-bottom-color: var(--acc-color);
    box-shadow: inset 0 -1.45em 0 var(--acc-color);
}

.post-content :is(p, li, blockquote, dd) a:not(.button):focus-visible {
    color: var(--pun-dark) !important;
    outline: 1px solid var(--acc-color);
    outline-offset: 2px;
    box-shadow: inset 0 -1.45em 0 var(--acc-color);
}

.post-content a:has(img) {
    padding: 0;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/***   ÐÀÇÄÅËÅÍÈÅ ÞÇÅÐÎÂ Â ÒÅÌÅ ÇÀÏßÒÎÉ   ***/
#topic-users-in a:not(:last-of-type):after {
content: ",";
}






/***   ÏÀÒ×È   ***/

.post-author > ul {
    display: grid !important;
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    column-gap: 0 !important;
    justify-content: normal;
    --stats-start: 1;
}

.post-author > ul > li:not(.pa-fld4):not(.pa-fld6) {
    grid-column: 1 / -1;
    flex: initial;
}

.post-author > ul > :is(.pa-posts, .pa-respect, .pa-fld5, .pa-fld2) {
    grid-column: span 2 !important;
    width: auto !important;
    min-width: 0;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    box-sizing: border-box;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.post-author > ul:has(
    > :nth-last-child(1 of .pa-posts, .pa-respect, .pa-fld5, .pa-fld2):nth-child(3 of .pa-posts, .pa-respect, .pa-fld5, .pa-fld2)
) {
    --stats-start: 2;
}

.post-author > ul:has(
    > :nth-last-child(1 of .pa-posts, .pa-respect, .pa-fld5, .pa-fld2):nth-child(2 of .pa-posts, .pa-respect, .pa-fld5, .pa-fld2)
) {
    --stats-start: 3;
}

.post-author > ul:has(
    > :nth-last-child(1 of .pa-posts, .pa-respect, .pa-fld5, .pa-fld2):nth-child(1 of .pa-posts, .pa-respect, .pa-fld5, .pa-fld2)
) {
    --stats-start: 4;
}

.post-author > ul > .pa-posts,
.post-author > ul:not(:has(> .pa-posts)) > .pa-respect,
.post-author > ul:not(:has(> .pa-posts, > .pa-respect)) > .pa-fld5,
.post-author > ul:not(:has(> .pa-posts, > .pa-respect, > .pa-fld5)) > .pa-fld2 {
    grid-column: var(--stats-start) / span 2 !important;
}

.post-author > ul > .pa-fld3 {
    width: fit-content !important;
    max-width: 100%;
    justify-self: center;
    box-sizing: border-box;
}

#viewprofile .profile-stats {
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: center;
    column-gap: 0 !important;
}

#viewprofile .profile-stats > div {
    flex: 0 0 25%;
    min-width: 0;
    margin-inline: 0;
    box-sizing: border-box;
    text-align: center;
}

:is(
    .unread-notifications #notifications-wrap,
    .post_reputation
) table,
table#respect,
table#all_voters {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    table-layout: auto !important;
    border-collapse: collapse;
    box-sizing: border-box;
}

:is(
    .unread-notifications #notifications-wrap,
    .post_reputation
) table > tbody,
table#respect > tbody,
table#all_voters > tbody {
    display: table-row-group !important;
    width: auto !important;
}

:is(
    .unread-notifications #notifications-wrap,
    .post_reputation
) table > tbody > tr,
table#respect > tbody > tr,
table#all_voters > tbody > tr {
    display: table-row !important;
    position: static !important;
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}

:is(
    .unread-notifications #notifications-wrap,
    .post_reputation
) table > tbody > tr > td,
table#respect > tbody > tr > td,
table#all_voters > tbody > tr > td {
    display: table-cell !important;
    position: static !important;
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    vertical-align: top;
    white-space: normal !important;
    overflow-wrap: anywhere;
    transform: none !important;
    box-sizing: border-box;
}

.unread-notifications #notifications-wrap table {
    table-layout: fixed !important;
}

.unread-notifications #notifications-wrap table > tbody > tr > td {
    text-align: left !important;
    position: relative !important;
    padding: 10px 14px !important;
    height: auto !important;
    min-height: 0 !important;
    border-bottom: 1px solid rgba(94, 72, 51, .12);
    font: 400 12px/1.45 var(--def-font, sans-serif);
}

.unread-notifications #notifications-wrap .notification-left {
    display: block !important;
    float: left !important;
    margin: 0 !important;
    width: 32px !important;
    height: 32px !important;
}

.unread-notifications #notifications-wrap .notification-right {
    display: block !important;
    float: none !important;
    width: auto !important;
    min-width: 0;
    max-width: none !important;
    white-space: normal;
    overflow-wrap: anywhere;
    min-height: 0 !important;
    padding: 0 18px 0 0 !important;
    line-height: 1.45 !important;
}

.unread-notifications #notifications-wrap
.notification-left + .notification-right {
    margin-left: 44px !important;
    min-height: 0 !important;
}

.unread-notifications #notifications-wrap .time-ago {
    display: block !important;
    float: none !important;
    width: auto !important;
    white-space: normal !important;
    clear: none !important;
    margin: 3px 0 0 44px !important;
    padding: 0 !important;
    font: 400 10px/1.35 var(--def-font, sans-serif);
    color: var(--text-soft, #857663);
    opacity: .8;
}

.unread-notifications #notifications-wrap .notification-type-toggle {
    float: none !important;
    display: block;
    text-align: right;
    position: absolute !important;
    right: 14px;
    bottom: 10px;
    width: auto !important;
    max-width: 48%;
    margin: 0 !important;
    font: 400 10px/1.35 var(--def-font, sans-serif);
    color: var(--acc-deep, #a95319);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
}

.unread-notifications #notifications-wrap tr::before,
.unread-notifications #notifications-wrap tr::after,
.post_reputation tr::before,
.post_reputation tr::after,
table#respect tr::before,
table#respect tr::after,
table#all_voters tr::before,
table#all_voters tr::after {
    content: none !important;
}

.unread-notifications #notifications-wrap .notification-image {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50%;
}

.unread-notifications #notifications-wrap tr:hover
.notification-type-toggle,
.unread-notifications #notifications-wrap tr:focus-within
.notification-type-toggle {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

@media (hover: none), (max-width: 540px) {
    .unread-notifications #notifications-wrap .notification-type-toggle {
        position: static !important;
        max-width: none;
        margin: 4px 0 0 44px !important;
        text-align: left;
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }
}

#pun-index .category.category > .container > table,
#pun-index .category.category > .container > table > tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
}

#pun-index .category.category tr[id^="forum_f"] {
    display: grid !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 16px 18px !important;
    box-sizing: border-box !important;
    grid-template-columns: minmax(0, 1fr) 32px 240px !important;
    grid-template-rows: auto auto !important;
    grid-template-areas: "tcl mark tcr"
        "links mark tcr" !important;
    column-gap: 18px !important;
    row-gap: 8px !important;
    align-items: center !important;
}

#pun-index .category.category tr[id^="forum_f"]::before {
    position: static !important;
    inset: auto !important;
    grid-area: mark !important;
    align-self: center !important;
    justify-self: center !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 24px !important;
    text-align: center !important;
    transform: none !important;
    pointer-events: none;
}

#pun-index .category.category tr[id^="forum_f"] > .tcl {
    grid-area: tcl !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
}

#pun-index .category.category .tcl .intd,
#pun-index .category.category .tcl .tclcon {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow-wrap: anywhere;
}

#pun-index .category.category tr[id^="forum_f"] > .awrt-section-links {
    grid-area: links !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
}

#pun-index .category.category tr[id^="forum_f"] > .tcr {
    grid-area: tcr !important;
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: 9px !important;
    row-gap: 4px !important;
    align-content: center !important;
    align-items: start !important;
    position: static !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#pun-index .category.category .tcr > .user-avatar {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;
    align-self: start;
    float: none !important;
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
}

#pun-index .category.category .tcr > .lastpost-link {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    overflow-wrap: normal !important;
}

#pun-index .category.category .tcr > .lastpost {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: block !important;
    min-width: 0 !important;
    margin: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
}

#pun-index .category.category .tcr > br {
    display: none !important;
}

@media (max-width: 760px) {
    #pun-index .category.category tr[id^="forum_f"] {
        grid-template-columns: minmax(0, 1fr) 24px 160px !important;
        column-gap: 10px !important;
        padding-inline: 12px !important;
    }
}

@media (max-width: 520px) {
    #pun-index .category.category tr[id^="forum_f"] {
        grid-template-columns: minmax(0, 1fr) 24px !important;
        grid-template-areas: "tcl mark"
            "links mark"
            "tcr tcr" !important;
    }
}
#viewprofile #profile-left {
    position: relative;
    isolation: isolate;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    flex: 0 0 200px !important;
    width: 200px !important;
    min-width: 200px !important;
    max-width: 200px !important;
    height: auto !important;
    box-sizing: border-box !important;
    padding: 10px 10px 12px !important;
    margin: 38px 20px 55px 33px !important;
    gap: 4px !important;
    overflow: visible !important;
}

#viewprofile #profile-left > :not(#pa-fld4):not(#pa-fld6):not(.status-container) {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    max-width: 100%;
}

#viewprofile #profile-left #pa-avatar {
    width: 100% !important;
    margin: 4px 0 !important;
    padding: 0 !important;
}

#viewprofile #profile-left #pa-avatar img {
    display: block;
    width: auto !important;
    height: auto !important;
    max-width: 180px !important;
    max-height: 180px !important;
    margin: auto;
}

#viewprofile #profile-left #pa-fld1,
#viewprofile #profile-left #pa-fld1 strong,
#viewprofile #profile-left #pa-fld1 .char-name,
#viewprofile #profile-left #pa-fld1 .char-race,
#viewprofile #profile-left #pa-fld1 .char-desc {
    box-sizing: border-box;
    max-width: 100%;
}

#viewprofile #profile-left #pa-fld3 {
    flex: 0 0 auto;
    width: fit-content !important;
    max-width: 100% !important;
    margin: 6px auto !important;
    box-sizing: border-box;
}

#viewprofile #profile-left .profile-stats {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 6px 0 2px !important;
    gap: 0 !important;
    box-sizing: border-box;
}

#viewprofile #profile-left .profile-stats > div {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 25% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 2px;
    text-align: center;
    box-sizing: border-box;
}

#viewprofile #profile-left .profile-stats > div > span {
    display: block !important;
    position: static !important;
    width: 13px !important;
    height: 13px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

#viewprofile #profile-left .profile-stats > div > span::before {
    display: block;
    position: static !important;
    width: 13px !important;
    height: 13px !important;
    margin: 0 !important;
    transform: none !important;
}

#viewprofile #profile-left .profile-stats > div > b {
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px;
    line-height: 18px;
    text-align: center;
    white-space: nowrap;
}

#viewprofile #profile-left #pa-fld6 {
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: absolute !important;
    inset: auto 12px -32px 12px !important;
    width: auto !important;
    max-width: none !important;
    height: 34px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    box-sizing: border-box;
    border-radius: 0 0 8px 8px;
    z-index: 0 !important;
    overflow: hidden;
}

#viewprofile #profile-left #pa-fld6 > span {
    display: none !important;
}

#viewprofile #profile-left #pa-fld6 strong {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    font: inherit;
    text-align: center;
}

#viewprofile #profile-left::after {
    content: "";
    display: block !important;
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    background: var(--pun-soft);
    border-radius: inherit;
    pointer-events: none;
    z-index: -1;
}

#viewprofile #profile-left::before,
#viewprofile #profile-left #pa-fld4 {
    z-index: -2 !important;
}

#viewprofile #profile-left #profile-title {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 0 4px !important;
}

#viewprofile #profile-left #profile-title:empty {
    display: none !important;
}

#pun-viewforum .main tbody td {
    background: transparent !important;
}

#pun-viewforum .main tbody td.tcl {
    flex: 1 1 0 !important;
    width: 0 !important;
    min-width: 0 !important;
}

#pun-viewforum .main tbody td.tc2 {
    flex: 0 0 130px !important;
    width: 130px !important;
    min-width: 0 !important;
    max-width: 130px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
}

#pun-viewforum .main tbody td.tcr {
    flex: 0 0 25% !important;
    width: 25% !important;
    min-width: 0 !important;
    overflow-wrap: anywhere;
}

#pun-viewforum .main .tclcon > a {
    white-space: normal !important;
    overflow-wrap: anywhere;
}

.punbb .post-content {
    width: 100%;
    margin-left: 0;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum)
.main tbody td {
    background: transparent !important;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum)
.main tbody td.tcl {
    flex: 1 1 0 !important;
    width: 0 !important;
    min-width: 0 !important;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum)
.main tbody td.tc2 {
    flex: 0 0 130px !important;
    width: 130px !important;
    min-width: 0 !important;
    max-width: 130px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum)
.main tbody td.tc3 {
    flex: 0 0 60px !important;
    width: 60px !important;
    min-width: 0 !important;
    max-width: 60px !important;
    justify-content: center;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum)
.main tbody td.tcr {
    flex: 0 0 25% !important;
    width: 25% !important;
    min-width: 0 !important;
    overflow-wrap: anywhere;
}

:is(#pun-viewforum, #pun-searchtopics, #pun-modviewforum)
.main .tclcon > a {
    white-space: normal !important;
    overflow-wrap: anywhere;
}

#pun-viewtopic .post-content {
    background: transparent;
    border: 0;
    border-radius: 0;
}



.post_reputation #rep_form table {
    display: table !important;
    width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse;
}

.post_reputation #rep_form td {
    display: table-cell !important;
    background: transparent !important;
    padding: 8px 12px !important;
    vertical-align: top !important;
    text-align: left !important;
    box-sizing: border-box;
}

.post_reputation #rep_form td.tcl {
    width: 28% !important;
    min-width: 0 !important;
    max-width: none !important;
}

.post_reputation #rep_form td.tc2 {
    width: 72% !important;
    min-width: 0 !important;
    max-width: none !important;
}

.post_reputation #reputationText {
    display: block;
    width: 100% !important;
    max-width: 100%;
    margin: 0 !important;
    box-sizing: border-box;
    resize: vertical;
}


#pun #title-logo-tr,
#pun #title-logo-tr:hover,
#pun #title-logo-tr > td,
#pun #title-logo-tr > td:hover {
    background: transparent !important;
    box-shadow: none !important;
}


.post-author .pa-avatar img,
#viewprofile #profile-left #pa-avatar img {
    display: block;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: none !important;
    margin: 0 auto !important;
}

#custom_table .author-name {
    display: table;
    width: fit-content;
    margin: 6px auto 0;
    padding: 4px 9px;
    background: var(--acc-color);
    border-radius: 4px;
}

#custom_table .author-name,
#custom_table .author-name a {
    color: #17130f !important;
    font: 700 10px/1 var(--def-font) !important;
    letter-spacing: .04em !important;
    text-transform: lowercase;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}


#pun-viewtopic .post-box {
    padding-top: 8px;
}

#pun-viewtopic .post-content {
    padding-top: 0;
}

#pun-viewtopic .post-content > p:first-child {
    margin-top: 0;
}

#custom_table .author-name,
#custom_table .author-name a {
    font: italic 700 10px/1.2 Georgia, serif !important;
    letter-spacing: normal !important;
    color: #FFFFFF !important;
}