@import url(style_cs.1792965159.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;
}

.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;
    scrollbar-width: thin;
    scrollbar-color: var(--acc-color) transparent;
}

body {
    margin: 0;
    font: 12px Verdana;
}

ul, dl, li, dd, dt {
    list-style: none;
}

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;
}

*::-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;
    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: thin;
    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;
    min-height: 0;
    border-radius: 3px !important;
    box-shadow: none;
    margin: 14px 0 !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;
    left: 0 !important;
    right: auto !important;
}

#pun-index .category > h2 {
    display: none !important;
}

#pun-index .category > .container {
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    max-width: none !important;
    margin-left: 92px !important;
    margin-right: 0 !important;
}

#pun-index .category tr {
    margin: 0;
    border-bottom: 1px solid rgba(94,72,51,.16);
    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;
    height: auto !important;
    row-gap: 8px;
}

#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%;
    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 .tcr {
    text-align: left;
}

#pun-searchtopics .tcl,#pun-modviewforum .tcl {
    width: 40%;
}

#pun-index .category::after {
    width: 92px;
}

#pun-index .category > .container {
    width: calc(100% - 92px) !important;
}

#pun-index .category table,#pun-index .category tbody {
    display: block;
    width: 100%;
}

#pun-index .category tr {
    position: relative;
    display: grid;
    box-sizing: border-box;
}

#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 .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 {
    background: var(--pun-soft);
    border-radius: 5px;
    text-align: center;
    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);
}

#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 {
    text-transform: lowercase;
    font-family: var(--def-font);
}

#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);
    border-radius: 10px;
    padding: 4px 10px 4px 7px;
    font: 500 11px / 1 Jost;
}

#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 > 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;
    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: 2px 0 6px 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 6px auto;
}

.char-desc {
    color: var(--text-main);
    padding: 0px 10px 6px 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: 16px;
    bottom: -45px;
    height: 53px;
    width: 174px;
    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;
    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%;
    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;
}

.window.activevkladka {
    position: static;
}

.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 222px !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 {
    align-items: center;
    justify-content: center;
    max-width: none !important;
    min-height: 0 !important;
    overflow: hidden;
    visibility: visible !important;
    opacity: 1 !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;
}

.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;
}

.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 {
    text-transform: lowercase;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
    font: italic 700 10px/1.2 Georgia, serif !important;
    letter-spacing: normal !important;
    color: #FFFFFF !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;
}

#viewprofile #profile-left {
    margin-bottom: 60px !important;
}

#viewprofile #profile-left::before {
    top: -21px !important;
    height: calc(100% + 66px) !important;
}

#viewprofile #profile-left #pa-fld6 {
    display: block !important;
    position: absolute !important;
    inset: auto 0 -45px 22px !important;
    width: auto !important;
    height: 53px !important;
    margin: 0 !important;
    padding: 11px 7px 5px 23px !important;
    box-sizing: border-box;
    border-radius: 0 0 8px 8px;
    text-align: center;
    z-index: -2 !important;
}

#viewprofile #profile-left #pa-fld6 > span {
    display: none !important;
}

#viewprofile #profile-left #pa-fld6 > strong,
#viewprofile #profile-left #pa-fld6 > strong > span {
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    margin: 0 !important;
    font: 500 11px/11px var(--sec-font) !important;
}

#viewprofile #profile-left #pa-fld6 > strong {
    position: static !important;
    width: 100%;
    height: 100%;
    padding: 0 !important;
}

#viewprofile #profile-left #pa-fld6 > strong > span {
    position: absolute !important;
    inset: 0 !important;
    padding: 11px 7px 5px 23px !important;
    border-radius: inherit;
}
