/* ================================================================
   THE STORM ARCHIVE — modern forum skin
   Inspired by retro-occult 1960s editorial design and time anomalies.
   Clean replacement for the forum custom style.css.
   The platform's structural extra.css remains enabled.
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500&family=Manrope:wght@400;500;600;700&display=swap');
@import url('https://kit-pro.fontawesome.com/releases/v6.6.0/css/pro.min.css');

:root {
  --r99-ink: #142628;
  --r99-ink-2: #1d3738;
  --r99-ink-3: #294849;
  --r99-paper: #eee7d9;
  --r99-paper-2: #f8f3e9;
  --r99-paper-3: #ddd2bf;
  --r99-brass: #b59152;
  --r99-brass-light: #d8bf82;
  --r99-burgundy: #743f42;
  --r99-sage: #71847a;
  --r99-text: #253233;
  --r99-muted: #6f7773;
  --r99-line: rgba(93, 74, 43, .22);
  --r99-dark-line: rgba(216, 191, 130, .28);
  --r99-shadow: 0 18px 60px rgba(6, 20, 21, .2);
  --r99-shadow-soft: 0 8px 26px rgba(12, 31, 32, .12);
  --r99-radius: 18px;
  --r99-radius-sm: 11px;
  --r99-content: 1180px;
}

html {
  min-width: 0 !important;
  scroll-behavior: smooth;
}

body {
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--r99-text) !important;
  background:
    linear-gradient(180deg, rgba(8, 24, 25, .2) 0, #132829 640px),
    url('https://forumstatic.ru/files/0014/98/d3/83271.png') center top / max(1680px, 100vw) auto no-repeat fixed,
    #132829 !important;
  font: 400 14px/1.65 'Manrope', Arial, sans-serif !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden !important;
}

body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    repeating-linear-gradient(90deg, transparent 0 79px, rgba(216, 191, 130, .025) 80px),
    linear-gradient(90deg, rgba(8, 22, 23, .22), transparent 20%, transparent 80%, rgba(8, 22, 23, .22));
}

*, *::before, *::after {
  box-sizing: border-box;
}

::selection {
  color: var(--r99-paper-2);
  background: var(--r99-burgundy);
}

a {
  color: var(--r99-burgundy);
  text-decoration: none !important;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease;
}

a:hover { color: #9b585b; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--r99-brass-light) !important;
  outline-offset: 3px;
}

#pun_wrap {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 26px clamp(12px, 3vw, 40px) 64px !important;
  background: transparent !important;
}

#pun,
.punbb {
  width: min(100%, var(--r99-content)) !important;
  max-width: var(--r99-content) !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  color: var(--r99-text) !important;
  background: transparent !important;
  border: 0 !important;
  font-family: 'Manrope', Arial, sans-serif !important;
}

/* ---------- Hero / forum identity ---------- */

#pun-title {
  position: relative !important;
  display: grid !important;
  height: 350px !important;
  min-height: 350px !important;
  margin: 0 0 14px !important;
  overflow: hidden !important;
  color: var(--r99-paper-2) !important;
  background:
    linear-gradient(90deg, rgba(9, 27, 28, .88), rgba(9, 27, 28, .38) 52%, rgba(9, 27, 28, .66)),
    linear-gradient(0deg, rgba(9, 27, 28, .86), transparent 54%),
    url('https://forumstatic.ru/files/0014/98/d3/83271.png') center / cover no-repeat !important;
  border: 1px solid var(--r99-dark-line) !important;
  border-radius: 26px !important;
  box-shadow: 0 28px 90px rgba(2, 13, 14, .42) !important;
  isolation: isolate;
}

#pun-title::before {
  content: '1999 · THE STORM ARCHIVE · 1999';
  position: absolute;
  top: 26px;
  left: 30px;
  z-index: 2;
  color: var(--r99-brass-light);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .34em;
  text-transform: uppercase;
}

#pun-title::after {
  content: '';
  position: absolute;
  inset: 14px;
  z-index: 1;
  pointer-events: none;
  border: 1px solid rgba(216, 191, 130, .25);
  border-radius: 18px;
  background:
    linear-gradient(90deg, var(--r99-brass-light), var(--r99-brass-light)) left 20px top 20px / 52px 1px no-repeat,
    linear-gradient(var(--r99-brass-light), var(--r99-brass-light)) left 20px top 20px / 1px 52px no-repeat,
    linear-gradient(90deg, var(--r99-brass-light), var(--r99-brass-light)) right 20px bottom 20px / 52px 1px no-repeat,
    linear-gradient(var(--r99-brass-light), var(--r99-brass-light)) right 20px bottom 20px / 1px 52px no-repeat;
  opacity: .58;
}

#pun-title .container,
#pun-title table,
#pun-title tbody,
#pun-title tr,
#pun-title td {
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 350px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#pun-title h1,
#pun-title .title-logo {
  position: absolute !important;
  left: clamp(28px, 6vw, 74px) !important;
  bottom: 56px !important;
  width: min(650px, calc(100% - 56px)) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--r99-paper-2) !important;
  font: 600 clamp(42px, 6.2vw, 76px)/.9 'Cormorant Garamond', Georgia, serif !important;
  letter-spacing: -.035em !important;
  text-align: left !important;
  text-shadow: 0 5px 28px rgba(0, 0, 0, .42) !important;
  text-transform: none !important;
}

#pun-title h1::after,
#pun-title .title-logo::after {
  content: 'records displaced beyond the Storm';
  display: block;
  margin-top: 18px;
  color: var(--r99-brass-light);
  font: 600 10px/1.3 'Manrope', Arial, sans-serif;
  letter-spacing: .28em;
  text-transform: uppercase;
}

/* ---------- Navigation ---------- */

#pun-navlinks,
#pun-ulinks {
  position: relative !important;
  z-index: 10 !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: rgba(16, 39, 40, .92) !important;
  border: 1px solid var(--r99-dark-line) !important;
  border-radius: var(--r99-radius-sm) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, .18) !important;
  backdrop-filter: blur(16px);
}

#pun-navlinks h2,
#pun-ulinks h2,
#pun-status h2 { display: none !important; }

#pun-navlinks .container,
#pun-ulinks .container,
#pun-navlinks ul,
#pun-ulinks ul {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 7px !important;
  list-style: none !important;
  background: transparent !important;
  border: 0 !important;
}

#pun-navlinks li,
#pun-ulinks li {
  display: block !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap;
}

#pun-navlinks a,
#pun-ulinks a {
  display: block !important;
  padding: 10px 13px !important;
  color: rgba(248, 243, 233, .82) !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .09em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

#pun-navlinks a:hover,
#pun-ulinks a:hover {
  color: var(--r99-paper-2) !important;
  background: rgba(216, 191, 130, .1) !important;
  border-color: rgba(216, 191, 130, .24) !important;
}

#pun-ulinks {
  background: rgba(238, 231, 217, .96) !important;
  border-color: rgba(181, 145, 82, .35) !important;
}

#pun-ulinks a { color: var(--r99-ink-2) !important; }
#pun-ulinks a:hover { color: var(--r99-burgundy) !important; background: rgba(116, 63, 66, .07) !important; }

#pun-status {
  margin: 0 0 18px !important;
  padding: 0 !important;
  color: rgba(248, 243, 233, .76) !important;
  background: rgba(13, 33, 34, .88) !important;
  border: 1px solid var(--r99-dark-line) !important;
  border-radius: var(--r99-radius-sm) !important;
  backdrop-filter: blur(14px);
}

#pun-status .container {
  margin: 0 !important;
  padding: 12px 18px !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 11px !important;
}

#pun-status strong,
#pun-status a { color: var(--r99-brass-light) !important; }

#pun-status a { margin-inline: .18em; }

/* ---------- Breadcrumbs and outer sections ---------- */

.punbb .divider { display: none !important; }

#pun-crumbs1,
#pun-crumbs2 {
  margin: 0 0 14px !important;
  padding: 0 !important;
  color: var(--r99-muted) !important;
  background: transparent !important;
  border: 0 !important;
}

#pun-crumbs1 .container,
#pun-crumbs2 .container {
  margin: 0 !important;
  padding: 10px 4px !important;
  color: rgba(248, 243, 233, .72) !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 11px !important;
  letter-spacing: .035em;
}

#pun-crumbs1 a,
#pun-crumbs2 a { color: var(--r99-brass-light) !important; }

#pun-main {
  min-width: 0 !important;
  margin: 0 !important;
  padding: clamp(16px, 2.5vw, 30px) !important;
  background:
    radial-gradient(circle at 100% 0, rgba(181, 145, 82, .12), transparent 28%),
    var(--r99-paper) !important;
  border: 1px solid rgba(216, 191, 130, .4) !important;
  border-radius: 24px !important;
  box-shadow: var(--r99-shadow) !important;
}

#pun-main > h1 {
  margin: 0 0 22px !important;
  padding: 0 0 16px !important;
  color: var(--r99-ink) !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r99-line) !important;
  font: 600 clamp(32px, 4vw, 50px)/1 'Cormorant Garamond', Georgia, serif !important;
  letter-spacing: -.02em !important;
  text-transform: none !important;
}

#pun-main > h1::before {
  content: '\2726';
  display: inline-block;
  margin-right: 13px;
  color: var(--r99-brass);
  font-size: .46em;
  vertical-align: middle;
}

.punbb .section,
.punbb .category,
.punbb .forum,
.punbb .topic,
.punbb .formal {
  min-width: 0 !important;
}

.punbb .section .container,
.punbb .info-box,
.punbb .formal fieldset,
.punbb .formal .container {
  color: var(--r99-text) !important;
}

/* ---------- Category and forum cards ---------- */

#pun-main .category,
#pun-main .forum {
  margin: 0 0 20px !important;
  overflow: hidden !important;
  background: rgba(248, 243, 233, .88) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: var(--r99-radius) !important;
  box-shadow: var(--r99-shadow-soft) !important;
}

#pun-main .category > h2,
#pun-main .forum > h2,
#pun-stats > h2,
#pun-main .topic > h2,
#pun-main .formal > h2,
#pun-main .section > h2,
.punbb .block > h2 {
  position: relative !important;
  margin: 0 !important;
  padding: 16px 22px 15px 48px !important;
  overflow: hidden;
  color: var(--r99-paper-2) !important;
  background:
    linear-gradient(90deg, rgba(181, 145, 82, .1), transparent 25%),
    var(--r99-ink) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r99-dark-line) !important;
  font: 600 19px/1.1 'Cormorant Garamond', Georgia, serif !important;
  letter-spacing: .09em !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

#pun-main .category > h2::before,
#pun-main .forum > h2::before,
#pun-stats > h2::before,
#pun-main .topic > h2::before,
#pun-main .formal > h2::before,
#pun-main .section > h2::before,
.punbb .block > h2::before {
  content: '\25c7';
  position: absolute;
  left: 20px;
  top: 50%;
  color: var(--r99-brass-light);
  font: 400 17px/1 Georgia, serif;
  transform: translateY(-50%);
}

#pun-main .category > .container,
#pun-main .forum > .container,
#pun-main .topic > .container,
#pun-main .section > .container {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.punbb table {
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto !important;
  color: var(--r99-text) !important;
  background: transparent !important;
}

.punbb th {
  padding: 12px 16px !important;
  color: var(--r99-muted) !important;
  background: rgba(221, 210, 191, .62) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r99-line) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .13em !important;
  line-height: 1.3 !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

.punbb td {
  padding: 17px 16px !important;
  color: var(--r99-text) !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r99-line) !important;
  vertical-align: middle !important;
}

.punbb tr:last-child td { border-bottom: 0 !important; }

.punbb tbody tr {
  transition: background-color .18s ease, box-shadow .18s ease;
}

.punbb tbody tr:hover { background: rgba(181, 145, 82, .08) !important; }

.punbb td.tcl {
  width: auto !important;
  min-width: 240px !important;
  padding-left: 22px !important;
}

.punbb td.tc2,
.punbb td.tc3 {
  width: 8% !important;
  min-width: 70px !important;
  color: var(--r99-muted) !important;
  text-align: center !important;
}

.punbb td.tcr {
  width: 31% !important;
  min-width: 230px !important;
  color: var(--r99-muted) !important;
  font-size: 11px !important;
}

.punbb td h3 {
  margin: 0 0 5px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  font: 600 20px/1.1 'Cormorant Garamond', Georgia, serif !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
}

.punbb td h3 a { color: var(--r99-ink) !important; }
.punbb td h3 a:hover { color: var(--r99-burgundy) !important; }

.punbb .tclcon,
.punbb .tclcon a:not(h3 a) {
  color: var(--r99-muted) !important;
  font-size: 11px !important;
}

.punbb .intd {
  padding-left: 36px !important;
  background: none !important;
}

.punbb .intd::before {
  content: '\25c8';
  display: inline-block;
  width: 25px;
  margin-left: -31px;
  color: var(--r99-brass);
  font-size: 14px;
}

.punbb .inew .intd::before { color: var(--r99-burgundy); content: '\25c6'; }

.punbb tr.isticky td { background: rgba(181, 145, 82, .08) !important; }
.punbb tr.iclosed { opacity: .74; }

/* ---------- Links, pagination and action controls ---------- */

.linkst,
.linksb {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 44px !important;
  margin: 10px 0 16px !important;
  padding: 0 !important;
  color: var(--r99-muted) !important;
  background: transparent !important;
  border: 0 !important;
}

.linkst .pagelink,
.linksb .pagelink { float: none !important; color: var(--r99-muted) !important; }

.pagelink a,
.pagelink strong,
.pages a,
.pages strong {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  margin: 2px !important;
  padding: 0 9px !important;
  color: var(--r99-ink) !important;
  background: var(--r99-paper-2) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 9px !important;
  font-size: 11px !important;
}

.pagelink strong,
.pages strong {
  color: var(--r99-paper-2) !important;
  background: var(--r99-burgundy) !important;
  border-color: var(--r99-burgundy) !important;
}

.postlink,
.subscribelink,
.linkst .postlink,
.linksb .postlink {
  float: none !important;
}

.punbb .postlink.long {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: auto !important;
  max-width: 100% !important;
}

.postlink a,
.subscribelink a,
.linkst .postlink a,
.linksb .postlink a,
.punbb input[type='submit'],
.punbb input[type='button'],
.punbb button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  padding: 10px 16px !important;
  color: var(--r99-paper-2) !important;
  background: var(--r99-burgundy) !important;
  border: 1px solid rgba(255, 255, 255, .08) !important;
  border-radius: 9px !important;
  box-shadow: 0 5px 14px rgba(73, 33, 36, .16) !important;
  font: 700 10px/1 'Manrope', Arial, sans-serif !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  cursor: pointer;
}

.postlink a:hover,
.subscribelink a:hover,
.punbb input[type='submit']:hover,
.punbb input[type='button']:hover,
.punbb button:hover {
  color: #fff !important;
  background: #8d4d51 !important;
  transform: translateY(-1px);
}

/* ---------- Topic posts ---------- */

#pun-main .topic {
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.punbb .post {
  margin: 0 0 22px !important;
  overflow: hidden !important;
  color: var(--r99-text) !important;
  background: var(--r99-paper-2) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: var(--r99-radius) !important;
  box-shadow: var(--r99-shadow-soft) !important;
}

.punbb .post > h3 {
  margin: 0 !important;
  padding: 12px 20px !important;
  color: rgba(248, 243, 233, .72) !important;
  background: var(--r99-ink) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r99-dark-line) !important;
  font: 600 10px/1.4 'Manrope', Arial, sans-serif !important;
  letter-spacing: .06em !important;
}

.punbb .post > h3 a { color: var(--r99-brass-light) !important; }

.punbb .post > h3 span {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  width: 100% !important;
}

.punbb .post > h3 strong {
  order: 1;
  color: var(--r99-paper-2) !important;
}

.punbb .post > h3 .permalink { order: 2; }

.punbb .post > h3 .sharelink {
  order: 3;
  margin-left: auto !important;
}

.punbb .post > .container {
  display: grid !important;
  grid-template-columns: 235px minmax(0, 1fr) !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.punbb .post-author {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 24px 20px !important;
  color: rgba(248, 243, 233, .74) !important;
  background:
    radial-gradient(circle at 0 0, rgba(181, 145, 82, .17), transparent 34%),
    var(--r99-ink-2) !important;
  border: 0 !important;
  border-right: 1px solid var(--r99-dark-line) !important;
  font-size: 11px !important;
  text-align: center !important;
}

.punbb .post-author ul,
.punbb .post-author li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.punbb .post-author li { margin-bottom: 7px !important; }

.punbb .post-author a {
  color: var(--r99-brass-light) !important;
  font-weight: 600;
}

.punbb .post-author img {
  display: block !important;
  width: auto !important;
  max-width: min(100%, 180px) !important;
  height: auto !important;
  margin: 15px auto !important;
  border: 1px solid rgba(216, 191, 130, .4) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .22) !important;
}

.punbb .post-body {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 280px !important;
  margin: 0 !important;
  padding: clamp(24px, 4vw, 48px) !important;
  color: var(--r99-text) !important;
  background:
    linear-gradient(90deg, rgba(181, 145, 82, .045) 1px, transparent 1px) 0 0 / 42px 100%,
    var(--r99-paper-2) !important;
  border: 0 !important;
  font: 400 14px/1.82 'Manrope', Arial, sans-serif !important;
}

.punbb .post-content {
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.punbb .post-content p { margin: 0 0 1.2em !important; }
.punbb .post-content p:last-child { margin-bottom: 0 !important; }

.punbb .post-content h1,
.punbb .post-content h2,
.punbb .post-content h3,
.punbb .post-content h4 {
  color: var(--r99-ink) !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  line-height: 1.12 !important;
}

.punbb .post-links {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 10px 16px !important;
  color: var(--r99-muted) !important;
  background: #e5dccb !important;
  border: 0 !important;
  border-top: 1px solid var(--r99-line) !important;
}

.punbb .post-links ul {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.punbb .post-links li {
  display: block !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.punbb .post-links a {
  display: inline-flex !important;
  padding: 7px 10px !important;
  color: var(--r99-ink-2) !important;
  background: rgba(248, 243, 233, .78) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 7px !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

.punbb .post-links a:hover { color: var(--r99-burgundy) !important; border-color: rgba(116, 63, 66, .35) !important; }

.punbb blockquote,
.punbb .quote-box,
.punbb .code-box {
  margin: 22px 0 !important;
  padding: 18px 20px 18px 24px !important;
  color: var(--r99-text) !important;
  background: #e9e1d2 !important;
  border: 0 !important;
  border-left: 3px solid var(--r99-brass) !important;
  border-radius: 0 var(--r99-radius-sm) var(--r99-radius-sm) 0 !important;
}

.punbb .quote-box cite,
.punbb .code-box strong {
  color: var(--r99-burgundy) !important;
  font: 600 11px/1.4 'Manrope', Arial, sans-serif !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.punbb .code-box pre,
.punbb code {
  font-family: 'IBM Plex Mono', Consolas, monospace !important;
  font-size: 12px !important;
  white-space: pre-wrap !important;
}

.punbb .post-sig {
  margin-top: 30px !important;
  padding-top: 20px !important;
  color: var(--r99-muted) !important;
  border-top: 1px solid var(--r99-line) !important;
}

/* ---------- Forms and editor ---------- */

.punbb .formal,
.punbb .info-box,
#viewprofile,
#pun-main > .section {
  margin: 18px 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--r99-paper-2) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: var(--r99-radius) !important;
  box-shadow: var(--r99-shadow-soft) !important;
}

.punbb .formal > .container,
.punbb .formal form.container,
.punbb .formal fieldset,
.punbb .info-box > .container,
#viewprofile > .container,
#pun-main > .section > .container {
  margin: 0 !important;
  padding: 22px !important;
  background: transparent !important;
  border: 0 !important;
}

.punbb fieldset {
  min-width: 0 !important;
  border: 0 !important;
}

.punbb legend {
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: var(--r99-ink) !important;
  font: 600 22px/1.1 'Cormorant Garamond', Georgia, serif !important;
}

.punbb label,
.punbb .label {
  color: var(--r99-ink-2) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.punbb input[type='text'],
.punbb input[type='email'],
.punbb input[type='password'],
.punbb input[type='search'],
.punbb input[type='number'],
.punbb select,
.punbb textarea {
  max-width: 100% !important;
  min-height: 42px !important;
  padding: 10px 12px !important;
  color: var(--r99-text) !important;
  background: #fffdf8 !important;
  border: 1px solid rgba(93, 74, 43, .28) !important;
  border-radius: 9px !important;
  box-shadow: inset 0 1px 4px rgba(17, 38, 39, .06) !important;
  font: 400 13px/1.55 'Manrope', Arial, sans-serif !important;
}

.punbb textarea { min-height: 170px !important; resize: vertical !important; }

.punbb input[type='text']:focus,
.punbb input[type='email']:focus,
.punbb input[type='password']:focus,
.punbb input[type='search']:focus,
.punbb select:focus,
.punbb textarea:focus {
  background: #fff !important;
  border-color: var(--r99-brass) !important;
  box-shadow: 0 0 0 3px rgba(181, 145, 82, .14) !important;
}

#post-form .container { padding: 22px !important; }
#post-form table { margin-bottom: 12px !important; border: 1px solid var(--r99-line) !important; border-radius: 9px !important; overflow: hidden !important; }
#post-form table td { padding: 7px !important; background: #e5dccb !important; }
#post-form textarea { width: 100% !important; min-height: 230px !important; }
#post-form #form-buttons { width: 100% !important; max-width: 100% !important; overflow-x: auto !important; overflow-y: hidden !important; }
#post-form #form-buttons table { min-width: 338px !important; max-width: none !important; }

#form-buttons td {
  position: relative !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 34px !important;
  padding: 3px !important;
  color: var(--r99-ink-2) !important;
  text-align: center !important;
}

#form-buttons td::before {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 28px;
  color: var(--r99-ink-2);
  font: 400 14px/1 'Font Awesome 6 Pro', 'Font Awesome 6 Free';
  pointer-events: none;
}

#form-buttons td img {
  position: absolute !important;
  inset: 3px !important;
  z-index: 2 !important;
  width: 24px !important;
  height: 28px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

#form-buttons td:has(img[onclick*='editor.font.'])::before { content: '\f031'; }
#form-buttons td:has(img[onclick*='editor.size.'])::before { content: '\f034'; }
#form-buttons td:has(img[onclick*='editor.bold.'])::before { content: '\f032'; }
#form-buttons td:has(img[onclick*='editor.italic.'])::before { content: '\f033'; }
#form-buttons td:has(img[onclick*='editor.underline.'])::before { content: '\f0cd'; }
#form-buttons td:has(img[onclick*='editor.strike.'])::before { content: '\f0cc'; }
#form-buttons td:has(img[onclick*='editor.left.'])::before { content: '\f036'; }
#form-buttons td:has(img[onclick*='editor.center.'])::before { content: '\f037'; }
#form-buttons td:has(img[onclick*='editor.right.'])::before { content: '\f038'; }
#form-buttons td:has(img[onclick*='editor.link.'])::before { content: '\f0c1'; }
#form-buttons td:has(img[onclick*='editor.spoiler.'])::before { content: '\f070'; }
#form-buttons td:has(img[onclick*='editor.image.'])::before { content: '\f03e'; }
#form-buttons td:has(img[onclick*='editor.video.'])::before { content: '\f03d'; }
#form-buttons td:has(img[onclick*='editor.hide.'])::before { content: '\f2a8'; }
#form-buttons td:has(img[onclick*='editor.quote.'])::before { content: '\f10d'; }
#form-buttons td:has(img[onclick*='editor.code.'])::before { content: '\f121'; }
#form-buttons td:has(img[onclick*='editor.color.'])::before { content: '\f53f'; }
#form-buttons td:has(img[onclick*='editor.table.'])::before { content: '\f00a'; }
#form-buttons td:has(img[onclick*='editor.smile.'])::before { content: '\f118'; }
#form-buttons td:has(img[onclick*='editor.keyboard.'])::before { content: '\f11c'; }
#form-buttons td:has(img[onclick*='editor.addition.'])::before { content: '\f078'; }
#form-buttons td:has(img[onclick*='editor.files_rusff.'])::before { content: '\f15b'; }
#form-buttons td:has(img[onclick*='editor.graffiti_rusff.'])::before { content: '\f1fc'; }

/* ---------- Admin, profile, search and utilities ---------- */

#pun-main .block,
#pun-main .box,
.punbb .modmenu {
  margin: 16px 0 !important;
  overflow: hidden !important;
  color: var(--r99-text) !important;
  background: var(--r99-paper-2) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: var(--r99-radius-sm) !important;
}

.punbb .modmenu { padding: 12px 16px !important; font-size: 11px !important; }
.punbb .modmenu select { min-height: 36px !important; }

#pun-main .block .container,
#pun-main .box .container {
  margin: 0 !important;
  padding: 18px 20px !important;
  background: transparent !important;
  border: 0 !important;
}

#pun-admin #admin-menu,
#pun-admin .adminmenu,
.punbb .adminmenu {
  background: var(--r99-ink) !important;
  border: 1px solid var(--r99-dark-line) !important;
  border-radius: var(--r99-radius-sm) !important;
}

#pun-admin #admin-menu a,
#pun-admin .adminmenu a,
.punbb .adminmenu a { color: var(--r99-paper-2) !important; }

#viewprofile li,
#setmods dl { border-color: var(--r99-line) !important; }

#viewprofile li strong,
#viewprofile li div,
#setmods dd {
  color: var(--r99-text) !important;
  background: transparent !important;
}

/* ---------- Statistics and footer ---------- */

#pun-stats {
  margin: 18px 0 0 !important;
  overflow: hidden !important;
  color: rgba(248, 243, 233, .75) !important;
  background: rgba(16, 39, 40, .94) !important;
  border: 1px solid var(--r99-dark-line) !important;
  border-radius: var(--r99-radius) !important;
  box-shadow: 0 16px 45px rgba(0, 0, 0, .2) !important;
  backdrop-filter: blur(14px);
}

#pun-stats .container {
  margin: 0 !important;
  padding: 20px 24px !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
}

#pun-stats strong,
#pun-stats a { color: var(--r99-brass-light) !important; }

#pun-about,
#html-footer {
  margin: 16px 0 0 !important;
  padding: 0 !important;
  color: rgba(248, 243, 233, .52) !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 10px !important;
  letter-spacing: .04em;
  text-align: center !important;
}

#pun-about .container,
#html-footer .container {
  margin: 0 !important;
  padding: 10px !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
}

#pun-about a,
#html-footer a { color: var(--r99-brass-light) !important; }

/* ---------- Small platform elements ---------- */

.punbb .acchide,
.punbb .hidehead { position: absolute !important; clip: rect(0 0 0 0) !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

.punbb .clearer { clear: both !important; height: 0 !important; overflow: hidden !important; }

.punbb .notice,
.punbb .message,
.punbb .error-info {
  margin: 14px 0 !important;
  padding: 13px 16px !important;
  color: var(--r99-text) !important;
  background: rgba(181, 145, 82, .12) !important;
  border: 1px solid rgba(181, 145, 82, .3) !important;
  border-radius: 9px !important;
}

#pun-live-rusff {
  width: auto !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

[id^='Caramel_'].caramel-streamLine__block {
  right: 10px !important;
  left: auto !important;
  max-width: calc(100vw - 20px) !important;
}


/* Shared form geometry. The platform expects these layout rules to live in
   style.css, so keep them independent from the visual fieldset treatment. */

.punbb .formsubmit {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
}

.punbb .formsubmit input,
.punbb .formsubmit a,
.punbb .formsubmit span { margin: 0 !important; }

.punbb .fs-box {
  min-width: 0 !important;
  padding: 10px 0 0 !important;
}

.punbb .fs-box > p,
.punbb .fs-box > fieldset {
  min-width: 0 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

.punbb .fs-box > p:last-child,
.punbb .fs-box > fieldset:last-child { margin-bottom: 0 !important; }

.punbb .inline {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 12px !important;
}

.punbb .inline > .inputfield,
.punbb .inline > .selectfield,
.punbb .inline > .passfield {
  float: none !important;
  flex: 1 1 180px !important;
  margin: 0 !important;
}

.punbb .inline > .infofield {
  clear: both !important;
  flex: 1 0 100% !important;
}

.punbb .datafield br { display: none !important; }

.punbb .datafield > .label,
.punbb .datafield > .input {
  display: inline !important;
  width: auto !important;
}

.punbb .areafield > .input,
.punbb p.longinput > .input {
  display: block !important;
  width: 100% !important;
  max-width: 760px !important;
}

.punbb .areafield textarea,
.punbb .longinput input { width: 100% !important; }

.punbb .hashelp {
  position: relative !important;
  padding-right: min(260px, 34%) !important;
}

.punbb .hashelp > .helplinks {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  display: block !important;
  width: min(240px, 32%) !important;
  color: var(--r99-muted) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

.punbb .helplinks span { display: block !important; }

/* ---------- System interfaces: profiles, messages, search ---------- */

/* RusFF keeps part of its component geometry in style.css rather than
   extra.css. These rules restore that geometry without bringing the old
   skin back. */

#profile,
#viewprofile-next {
  min-width: 0 !important;
}

#profilenav {
  min-width: 0 !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--r99-paper-2) !important;
  background: var(--r99-ink) !important;
  border: 1px solid var(--r99-dark-line) !important;
  border-radius: 13px !important;
  box-shadow: 0 8px 24px rgba(7, 25, 26, .14) !important;
}

#profilenav h2 {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--r99-brass-light) !important;
  background: transparent !important;
  border: 0 !important;
  font: 700 9px/1.2 'Manrope', Arial, sans-serif !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}

#profilenav h2 span { padding: 0 !important; }

#profilenav ul {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 9px !important;
  list-style: none !important;
  border: 0 !important;
}

#profilenav li {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#profilenav a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 8px 11px !important;
  color: rgba(248, 243, 233, .78) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .055em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

#profilenav a:hover {
  color: var(--r99-paper-2) !important;
  background: rgba(216, 191, 130, .1) !important;
  border-color: rgba(216, 191, 130, .2) !important;
}

#profilenav li.isactive a {
  color: var(--r99-ink) !important;
  background: var(--r99-brass-light) !important;
  border-color: var(--r99-brass-light) !important;
}

#pun-profile #profilenav h2 { display: none !important; }

#pun-profile #profilenav ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
}

#pun-profile #profile > form.container {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  padding: 20px !important;
}

#pun-profile #profile > form.container > #profilenav,
#pun-profile #profile > form.container > .formsubmit {
  grid-column: 1 / -1 !important;
}

#pun-profile #profile fieldset {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 18px !important;
  background: rgba(238, 231, 217, .5) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 12px !important;
}

#pun-profile #profile fieldset legend {
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: var(--r99-ink) !important;
  font: 600 18px/1.15 'Cormorant Garamond', Georgia, serif !important;
}

#pun-profile #profile fieldset legend span { padding: 0 !important; }

#pun-profile #profile .fs-box {
  min-width: 0 !important;
  padding: 0 !important;
}

#pun-profile #profile .fs-box > p {
  min-width: 0 !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

#pun-profile #profile .fs-box > p:last-child { margin-bottom: 0 !important; }

#viewprofile-next > #profilenav {
  margin: 20px 20px 0 !important;
}

#viewprofile {
  margin: 14px 20px 20px !important;
  overflow: hidden !important;
  background: var(--r99-paper-2) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 14px !important;
  box-shadow: var(--r99-shadow-soft) !important;
}

#viewprofile > .container {
  margin: 0 !important;
  padding: 0 !important;
}

#viewprofile > .container > ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border: 0 !important;
}

#viewprofile table {
  width: 100% !important;
  margin: 0 !important;
  table-layout: fixed !important;
}

#viewprofile td { border-bottom: 0 !important; }

#profile-left {
  width: 230px !important;
  padding: 24px 20px !important;
  color: rgba(248, 243, 233, .78) !important;
  background:
    radial-gradient(circle at 0 0, rgba(181, 145, 82, .18), transparent 36%),
    var(--r99-ink-2) !important;
  border-right: 1px solid var(--r99-dark-line) !important;
  text-align: center !important;
  vertical-align: top !important;
}

#profile-left li,
#profile-right li {
  margin: 0 !important;
  list-style: none !important;
}

#profile-left li {
  padding: 0 !important;
  color: inherit !important;
}

#profile-name strong {
  color: var(--r99-paper-2) !important;
  font: 600 25px/1.05 'Cormorant Garamond', Georgia, serif !important;
}

#profile-title strong {
  display: block !important;
  margin-top: 6px !important;
  color: var(--r99-brass-light) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .045em !important;
}

#pa-avatar div { padding: 0 !important; }

#pa-avatar img {
  display: block !important;
  width: min(100%, 180px) !important;
  height: auto !important;
  margin: 18px auto !important;
  border: 1px solid rgba(216, 191, 130, .42) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .22) !important;
}

#pa-online strong,
#pa-edit strong {
  display: block !important;
  padding: 6px 8px !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

#pa-online strong { color: #9fc2ae !important; }
#pa-edit a { color: var(--r99-brass-light) !important; }

#profile-right {
  width: auto !important;
  padding: 12px 22px !important;
  background: var(--r99-paper-2) !important;
  vertical-align: top !important;
}

#profile-right > li {
  display: grid !important;
  grid-template-columns: minmax(135px, .65fr) minmax(0, 1.35fr) !important;
  align-items: start !important;
  gap: 14px !important;
  padding: 11px 2px !important;
  border-bottom: 1px solid var(--r99-line) !important;
}

#profile-right > li:last-child { border-bottom: 0 !important; }

#profile-right > li > span,
#profile-right > li > strong,
#profile-right > li > div {
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#profile-right > li > span {
  color: var(--r99-muted) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
}

#profile-right > li > strong,
#profile-right > li > div {
  color: var(--r99-text) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

#profile-right .plinf,
#profile-right .plinf p {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

#profile-gifts {
  padding: 16px 20px !important;
  border-top: 1px solid var(--r99-line) !important;
}

/* Personal messages use the same markup name for a two-group toolbar. */

#pun-messages #profile > .container {
  display: block !important;
  padding: 20px !important;
}

#pun-messages #profilenav {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px 14px !important;
  padding: 10px 12px !important;
}

#pun-messages #profilenav ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 0 !important;
}

#pun-messages #messages fieldset {
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 12px !important;
}

#pun-messages #messages legend {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 15px 18px !important;
  color: var(--r99-paper-2) !important;
  background: var(--r99-ink) !important;
  font: 600 18px/1.1 'Cormorant Garamond', Georgia, serif !important;
}

#pun-messages #messages .fs-box {
  padding: 0 !important;
  overflow-x: auto !important;
}

#pun-messages #messages td { padding-block: 11px !important; }

#pun-messages .user-avatar .avatar-image,
#pun-userlist .user-avatar .avatar-image {
  display: inline-block !important;
  width: 30px !important;
  height: 30px !important;
  margin-right: 8px !important;
  background-position: center !important;
  background-size: cover !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 50% !important;
  vertical-align: middle !important;
}

/* Compact, card-based search/filter forms. */

#pun-search form#punbbsearch {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)) !important;
  gap: 14px !important;
  padding: 20px !important;
}

#pun-search form#punbbsearch > fieldset,
#pun-userlist form#userlist > fieldset {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 18px !important;
  background: rgba(238, 231, 217, .52) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 12px !important;
}

#pun-search form#punbbsearch > fieldset legend,
#pun-userlist form#userlist > fieldset legend {
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: var(--r99-ink) !important;
  font: 600 18px/1.12 'Cormorant Garamond', Georgia, serif !important;
}

#pun-search form#punbbsearch .fs-box.inline,
#pun-userlist form#userlist .fs-box.inline {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  align-items: end !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding: 0 !important;
}

#pun-search form#punbbsearch .fs-box.inline > p,
#pun-userlist form#userlist .fs-box.inline > p {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#pun-search form#punbbsearch .fs-box.inline > .infofield,
#pun-userlist form#userlist .fs-box.inline > .infofield {
  grid-column: 1 / -1 !important;
  align-self: stretch !important;
  padding: 10px 12px !important;
  color: var(--r99-muted) !important;
  background: rgba(181, 145, 82, .08) !important;
  border-left: 2px solid var(--r99-brass) !important;
  border-radius: 0 8px 8px 0 !important;
  font-size: 10px !important;
  line-height: 1.55 !important;
}

#pun-search form#punbbsearch input[type='text'],
#pun-search form#punbbsearch select,
#pun-userlist form#userlist input[type='text'],
#pun-userlist form#userlist select {
  width: 100% !important;
}

#pun-search form#punbbsearch > .formsubmit,
#pun-userlist form#userlist > .formsubmit {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  padding: 2px 0 0 !important;
}

#pun-userlist form#userlist {
  padding: 20px !important;
}

#pun-userlist .usertable .container {
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 12px !important;
}

#pun-userlist .usertable td { padding-block: 10px !important; }

/* Admin navigation: contained and scrollable instead of extending the page. */

#pun-admain {
  min-width: 0 !important;
  margin: 0 0 16px !important;
}

#pun-adnav {
  background: var(--r99-ink) !important;
  border: 1px solid var(--r99-dark-line) !important;
  border-radius: 12px !important;
  box-shadow: var(--r99-shadow-soft) !important;
}

#pun-adnav > h2 {
  margin: 0 !important;
  padding: 15px 16px !important;
  color: var(--r99-paper-2) !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--r99-dark-line) !important;
  font: 600 18px/1.1 'Cormorant Garamond', Georgia, serif !important;
}

#pun-adnav .adcontainer {
  max-height: calc(100vh - 190px) !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
  scrollbar-color: var(--r99-brass) transparent;
}

#pun-adnav ul {
  margin: 0 !important;
  padding: 8px !important;
  list-style: none !important;
}

#pun-adnav li { margin: 0 !important; padding: 0 !important; list-style: none !important; }

#pun-adnav a {
  display: block !important;
  padding: 8px 10px !important;
  color: rgba(248, 243, 233, .72) !important;
  border-radius: 7px !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

#pun-adnav a:hover,
#pun-adnav li.isactive > a {
  color: var(--r99-paper-2) !important;
  background: rgba(216, 191, 130, .12) !important;
}

#pun-adnav .adsubnav {
  margin: 2px 0 5px 8px !important;
  padding: 3px 0 3px 8px !important;
  border-left: 1px solid var(--r99-dark-line) !important;
}

#pun-admain1 {
  min-width: 0 !important;
  overflow: hidden !important;
  background: var(--r99-paper) !important;
  border: 1px solid var(--r99-line) !important;
  border-radius: 14px !important;
  box-shadow: var(--r99-shadow-soft) !important;
}

.punbb hr {
  height: 1px !important;
  margin: 22px 0 !important;
  background: var(--r99-line) !important;
  border: 0 !important;
}

img { max-width: 100%; }

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
  :root { --r99-radius: 15px; }

  body { background-attachment: scroll !important; }

  #pun_wrap { padding: 12px 10px 40px !important; }
  #pun-title { height: 340px !important; min-height: 340px !important; border-radius: 18px !important; }
  #pun-title .container,
  #pun-title table,
  #pun-title tbody,
  #pun-title tr,
  #pun-title td { height: 338px !important; min-height: 338px !important; }

  #pun-title::before { top: 22px; left: 22px; font-size: 8px; }
  #pun-title h1,
  #pun-title .title-logo { left: 28px !important; bottom: 42px !important; width: calc(100% - 56px) !important; }

  #pun-navlinks,
  #pun-ulinks { overflow-x: hidden !important; }
  #pun-navlinks .container,
  #pun-ulinks .container,
  #pun-navlinks ul,
  #pun-ulinks ul { justify-content: center !important; flex-wrap: wrap !important; width: 100% !important; min-width: 0 !important; }

  #pun-main { padding: 18px !important; border-radius: 18px !important; }
  .punbb td { padding: 14px 12px !important; }
  .punbb td.tc2,
  .punbb td.tc3,
  .punbb th.tc2,
  .punbb th.tc3 { display: none !important; }
  .punbb td.tcr { width: 34% !important; min-width: 160px !important; }

  .punbb .post > .container { grid-template-columns: 190px minmax(0, 1fr) !important; }
  .punbb .post-author { padding: 20px 14px !important; }
  .punbb .post-body { padding: 28px !important; }

  #pun-profile #profile > form.container {
    grid-template-columns: 1fr !important;
  }

  #profile-left { width: 200px !important; }
  #profile-right > li { grid-template-columns: minmax(115px, .55fr) minmax(0, 1.45fr) !important; }

  #pun-search form#punbbsearch {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #pun-search form#punbbsearch > fieldset:last-of-type {
    grid-column: 1 / -1 !important;
  }

  #pun-admain { padding-left: 0 !important; }

  #pun-adnav {
    position: static !important;
    float: none !important;
    width: 100% !important;
    margin: 0 0 14px !important;
  }

  #pun-adnav .adcontainer { max-height: 250px !important; }
}

@media (max-width: 640px) {
  body { font-size: 13px !important; }
  #pun_wrap { padding-inline: 7px !important; }
  #pun-title { height: 270px !important; min-height: 270px !important; background-position: 58% center !important; }
  #pun-title .container,
  #pun-title table,
  #pun-title tbody,
  #pun-title tr,
  #pun-title td { height: 268px !important; min-height: 268px !important; }

  #pun-title::before { max-width: 70%; line-height: 1.7; }
  #pun-title::after { inset: 8px; }
  #pun-title h1,
  #pun-title .title-logo { left: 22px !important; bottom: 30px !important; width: calc(100% - 44px) !important; font-size: clamp(34px, 12vw, 48px) !important; }
  #pun-title h1::after,
  #pun-title .title-logo::after { font-size: 8px; letter-spacing: .16em; }

  #pun-status .container { padding: 11px 13px !important; }
  #pun-main { padding: 12px !important; }
  #pun-main > h1 { font-size: 34px !important; margin-bottom: 16px !important; }

  #pun-main .category > h2,
  #pun-main .forum > h2,
  #pun-stats > h2,
  #pun-main .topic > h2,
  #pun-main .formal > h2,
  #pun-main .section > h2,
  .punbb .block > h2 { padding: 14px 14px 13px 42px !important; font-size: 16px !important; }

  .punbb table,
  .punbb tbody,
  .punbb tr,
  .punbb td { min-width: 0 !important; }
  .punbb td.tcl { width: 100% !important; min-width: 0 !important; }
  .punbb td.tcr,
  .punbb th.tcr { display: none !important; }
  .punbb td h3 { font-size: 18px !important; }

  .linkst,
  .linksb { align-items: flex-start !important; flex-direction: column !important; }

  .punbb .post > .container { display: block !important; }
  .punbb .post-author {
    display: flow-root !important;
    width: 100% !important;
    padding: 16px !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--r99-dark-line) !important;
    text-align: left !important;
  }
  .punbb .post-author img {
    float: left !important;
    width: 76px !important;
    max-height: 96px !important;
    margin: 0 14px 8px 0 !important;
    object-fit: cover !important;
  }
  .punbb .post-body { width: 100% !important; min-height: 180px !important; padding: 22px 18px !important; }
  .punbb .post-links { width: 100% !important; }
  .punbb .post-links ul { justify-content: flex-start !important; }

  .punbb .formal > .container,
  .punbb .formal form.container,
  .punbb .formal fieldset,
  .punbb .info-box > .container,
  #viewprofile > .container,
  #pun-main > .section > .container { padding: 16px !important; }

  #pun-stats .container { padding: 17px !important; }

  .punbb .hashelp { padding-right: 0 !important; }

  .punbb .hashelp > .helplinks {
    position: static !important;
    width: 100% !important;
    margin-top: 8px !important;
    padding: 9px 11px !important;
    background: rgba(181, 145, 82, .08) !important;
    border-left: 2px solid var(--r99-brass) !important;
    border-radius: 0 8px 8px 0 !important;
  }

  #pun-profile #profilenav {
    margin-bottom: 12px !important;
    overflow-x: auto !important;
    scrollbar-width: thin;
    scrollbar-color: var(--r99-brass) transparent;
  }

  #pun-profile #profilenav ul {
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: 100% !important;
  }

  #pun-profile #profile > form.container {
    gap: 10px !important;
    padding: 12px !important;
  }

  #pun-profile #profile fieldset { padding: 14px !important; }

  #viewprofile-next > #profilenav { margin: 12px 12px 0 !important; }
  #viewprofile { margin: 10px 12px 12px !important; }

  #viewprofile table,
  #viewprofile tbody,
  #viewprofile tr,
  #viewprofile td {
    display: block !important;
    width: 100% !important;
  }

  #profile-left {
    padding: 18px 16px !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--r99-dark-line) !important;
  }

  #pa-avatar img {
    width: 96px !important;
    max-height: 144px !important;
    margin: 12px auto !important;
    object-fit: cover !important;
  }

  #profile-right { padding: 8px 14px !important; }

  #profile-right > li {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
    padding: 9px 0 !important;
  }

  #pun-messages #profile > .container { padding: 12px !important; }

  #pun-messages #profilenav {
    display: block !important;
    padding: 8px !important;
    overflow-x: auto !important;
  }

  #pun-messages #profilenav h2 { display: none !important; }

  #pun-messages #profilenav ul {
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: 100% !important;
  }

  #pun-search form#punbbsearch {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px !important;
  }

  #pun-search form#punbbsearch > fieldset:last-of-type { grid-column: auto !important; }

  #pun-search form#punbbsearch > fieldset,
  #pun-userlist form#userlist > fieldset { padding: 14px !important; }

  #pun-search form#punbbsearch .fs-box.inline,
  #pun-userlist form#userlist .fs-box.inline { grid-template-columns: 1fr !important; }

  #pun-userlist form#userlist { padding: 12px !important; }

  #pun-adnav .adcontainer { max-height: 220px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}