:root {
  --bg: #e8e8ec;
  --panel: #ffffff;
  --panel-soft: #f7f5fa;
  --line: #ccc6d4;
  --ink: #242936;
  --muted: #6e7486;
  --violet: #6a5788;
  --violet-dark: #504266;
  --violet-soft: #8b78a3;
  --coral: #ec8f81;
  --teal: #21b7a6;
  --blue: #2e80d7;
  --shadow: 0 18px 46px rgba(46, 40, 62, .14);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 16px/1.5 Arial, Helvetica, sans-serif;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

button,
input {
  font: inherit;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 58px;
  background: linear-gradient(90deg, #5c638f, #9d6f98 53%, #e4917e);
  border-bottom: 1px solid rgba(0, 0, 0, .22);
  color: #fff;
  box-shadow: 0 3px 14px rgba(0, 0, 0, .18);
}

.topbar__inner {
  width: min(100%, 1220px);
  min-height: 58px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 0 16px;
}

.icon-button,
.profile-button {
  width: 40px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 5px;
  background: rgba(42, 36, 62, .23);
  color: #fff;
  cursor: pointer;
}

.icon-button span {
  width: 18px;
  height: 2px;
  background: currentColor;
  margin: 2px 0;
}

.profile-button {
  margin-left: auto;
}

.profile-button svg {
  width: 19px;
  height: 19px;
  fill: currentColor;
}

.brand,
.hero__logo {
  font-family: Impact, Haettenschweiler, "Arial Black", sans-serif;
  letter-spacing: 0;
  text-transform: lowercase;
  text-shadow: 2px 2px 0 #1d1d25, -1px -1px 0 #1d1d25, 0 2px 0 #1d1d25;
}

.brand {
  display: inline-flex;
  align-items: baseline;
  font-size: 26px;
  line-height: 1;
}

.brand__main span,
.brand__domain,
.hero__main span,
.hero__domain {
  color: #ff79cb;
}

.brand__sep,
.hero__sep {
  margin: 0 1px;
  color: #fff;
}

.brand__hub,
.hero__hub {
  margin-left: 0;
  color: #fff;
}

.brand__domain {
  margin-left: 2px;
  font-size: .72em;
}

.hero__domain {
  margin-left: 3px;
  font-size: .54em;
}

.topnav {
  display: flex;
  gap: 18px;
  font-size: 14px;
  font-weight: 800;
}

.topnav a {
  opacity: .92;
}

.topnav a:hover {
  opacity: 1;
}

.hero {
  position: relative;
  height: 238px;
  overflow: hidden;
  background: #cc879c;
}

.hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, .02), rgba(218, 117, 140, .12));
}

.hero__logo {
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  z-index: 2;
  color: #fff;
  font-size: 72px;
  line-height: .85;
  white-space: nowrap;
  filter: drop-shadow(0 7px 10px rgba(35, 24, 42, .48));
}

.hero__duo {
  position: absolute;
  left: 50%;
  bottom: 56px;
  width: 98px;
  height: 92px;
  transform: translateX(-50%);
  background: url("assets/characters.webp") center 32% / 175px auto no-repeat;
  clip-path: polygon(24% 0, 82% 0, 94% 100%, 5% 100%);
  border-radius: 7px;
}

.page-shell {
  width: min(100%, 1220px);
  margin: 18px auto 56px;
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr);
  gap: 20px;
  padding: 0 14px;
}

.page-shell--single {
  grid-template-columns: minmax(0, 1fr);
}

.inner-page {
  display: grid;
  gap: 18px;
}

.sub-hero {
  position: relative;
  min-height: 250px;
  overflow: hidden;
  display: grid;
  align-items: end;
  padding: 28px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, .2);
  color: #fff;
  box-shadow: var(--shadow);
}

.sub-hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sub-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(35, 28, 52, .92), rgba(92, 61, 108, .7), rgba(236, 143, 129, .28));
}

.sub-hero > div {
  position: relative;
  z-index: 1;
  max-width: 760px;
}

.sub-hero h1 {
  margin: 0 0 10px;
  font-size: 44px;
  line-height: 1.05;
}

.sub-hero p:not(.eyebrow) {
  margin: 0;
  color: rgba(255, 255, 255, .86);
  font-size: 17px;
}

.subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.subnav a,
.subnav span {
  border-radius: 4px;
  padding: 7px 10px;
  background: #f1edf5;
  color: var(--violet-dark);
  font-weight: 900;
  font-size: 13px;
}

.section-card {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.section-card h2 {
  margin: 0 0 14px;
  color: var(--ink);
  font-size: 28px;
}

.content-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 18px;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.feature-card {
  overflow: hidden;
  border: 1px solid #d6d1df;
  border-radius: 6px;
  background: #fff;
}

.feature-card img {
  width: 100%;
  height: 160px;
  object-fit: cover;
}

.feature-card div {
  padding: 14px;
}

.feature-card h3 {
  margin: 0 0 8px;
  color: var(--violet-dark);
  font-size: 19px;
}

.feature-card p {
  margin: 0;
  color: var(--muted);
}

.feature-card span,
.badge {
  display: inline-flex;
  align-items: center;
  width: max-content;
  margin-top: 10px;
  border-radius: 4px;
  padding: 5px 8px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.metric {
  padding: 14px;
  border-radius: 6px;
  background: linear-gradient(135deg, #f7f3fa, #fff2ed);
  border: 1px solid #ded7e7;
}

.metric strong {
  display: block;
  color: var(--violet-dark);
  font-size: 28px;
  line-height: 1;
}

.metric span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.side-panel {
  display: grid;
  gap: 12px;
  align-content: start;
}

.panel-widget {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .07);
}

.panel-widget h3 {
  margin: 0 0 10px;
  color: var(--violet-dark);
}

.panel-widget p,
.panel-widget li {
  color: var(--muted);
}

.panel-widget ul {
  margin: 0;
  padding-left: 18px;
}

.table-card {
  overflow: hidden;
  border: 1px solid #d8d2df;
  border-radius: 6px;
  background: #fff;
}

.table-card > div {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 13px 15px;
  border-top: 1px solid #e5e1eb;
}

.table-card > div:first-child {
  border-top: 0;
}

.table-card__head {
  background: var(--violet);
  color: #fff;
  font-weight: 900;
}

.wiki-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
}

.wiki-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-bottom: 14px;
}

.wiki-search input {
  border: 1px solid #d8d2df;
  border-radius: 5px;
  padding: 11px 12px;
}

.wiki-search button {
  border: 0;
  border-radius: 5px;
  padding: 0 14px;
  background: var(--violet);
  color: #fff;
  font-weight: 900;
}

.wiki-article {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 14px;
  padding: 15px;
  border-top: 1px solid #e5e1eb;
}

.wiki-article:first-of-type {
  border-top: 0;
}

.wiki-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 6px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.wiki-article h3 {
  margin: 0 0 5px;
  color: var(--violet-dark);
}

.wiki-article p {
  margin: 0;
  color: var(--muted);
}

.wiki-article em {
  color: var(--muted);
  font-style: normal;
  font-size: 13px;
  text-align: right;
}

.contributor {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 0;
  border-top: 1px solid #e5e1eb;
}

.contributor:first-of-type {
  border-top: 0;
}

.contributor span:first-child {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #eee9f3;
  color: var(--violet-dark);
  font-weight: 900;
}

.contributor strong,
.contributor em {
  display: block;
}

.contributor em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.reward-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.reward {
  padding: 14px;
  border: 1px solid #ded7e7;
  border-radius: 6px;
  background: #fff8f1;
}

.reward strong {
  display: block;
  color: var(--violet-dark);
}

.reward span {
  color: var(--muted);
  font-size: 13px;
}

.article-rich .lead {
  color: var(--ink);
  font-size: 20px;
  font-weight: 700;
}

.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.article-meta span {
  border-radius: 4px;
  padding: 5px 8px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.feature-grid--compact .feature-card img {
  height: 128px;
}

.masonry-gallery {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  grid-auto-rows: 180px;
  gap: 14px;
}

.masonry-gallery figure {
  position: relative;
  overflow: hidden;
  margin: 0;
  border-radius: 6px;
  border: 1px solid #d6d1df;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.masonry-gallery figure.large {
  grid-row: span 2;
}

.masonry-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masonry-gallery figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 12px;
  background: linear-gradient(90deg, rgba(80, 66, 102, .95), rgba(236, 143, 129, .88));
  color: #fff;
  font-weight: 900;
}

.character-board {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 16px;
}

.character-card {
  overflow: hidden;
  border: 1px solid #d6d1df;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.character-card.featured {
  grid-row: span 2;
}

.character-card img {
  width: 100%;
  height: 210px;
  object-fit: cover;
}

.character-card.featured img {
  height: 320px;
}

.character-card div {
  padding: 16px;
}

.character-card h2,
.character-card h3 {
  margin: 8px 0;
  color: var(--violet-dark);
}

.match-panel,
.file-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.match-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.match-filters button,
.file-toolbar button {
  border: 1px solid #d8d2df;
  border-radius: 5px;
  padding: 8px 10px;
  background: #f8f5fb;
  color: var(--violet-dark);
  font-weight: 900;
}

.file-toolbar input {
  flex: 1;
  min-width: 220px;
  border: 1px solid #d8d2df;
  border-radius: 5px;
  padding: 9px 11px;
}

.player-grid,
.download-grid,
.server-showcase {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.public-card-grid--servers {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.player-card,
.download-grid article,
.server-card {
  overflow: hidden;
  border: 1px solid #d6d1df;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.player-card img,
.download-grid img {
  width: 100%;
  height: 175px;
  object-fit: cover;
}

.player-card div,
.download-grid article div {
  padding: 15px;
}

.player-card h3,
.download-grid h3 {
  margin: 0 0 8px;
  color: var(--violet-dark);
}

.player-card span,
.download-grid span {
  display: inline-flex;
  margin-top: 10px;
  border-radius: 4px;
  padding: 5px 8px;
  background: #fff0eb;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.server-card {
  display: flex;
  min-height: 420px;
  flex-direction: column;
  border-color: #d9d2e4;
  background:
    linear-gradient(180deg, #fff 0%, #fbf7fc 100%);
}

.server-card__banner {
  position: relative;
  overflow: hidden;
  height: 165px;
  background: #2b2540;
}

.server-card__banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.server-card__banner span {
  position: absolute;
  top: 12px;
  right: 12px;
  border-radius: 999px;
  padding: 7px 11px;
  background: linear-gradient(90deg, rgba(105, 78, 139, .92), rgba(236, 130, 119, .92));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(48, 35, 62, .25);
}

.server-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
}

.server-card__top {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.server-card.hot {
  background: linear-gradient(135deg, #fff5f1, #f2ecf8);
  border-color: #d9b7c9;
}

.server-card--premium {
  position: relative;
  border: 2px solid #df7b72;
  background:
    radial-gradient(circle at 0 0, rgba(236, 143, 129, .24), transparent 40%),
    linear-gradient(135deg, #fff5f1, #f2ecf8);
}

.server-card--premium h2,
.server-name-premium {
  color: #b84485 !important;
  font-weight: 900;
}

.server-card--premium p {
  color: #4e3f60;
  font-weight: 800;
}

.server-card--highlight {
  border-color: #bfa6dc;
  background:
    linear-gradient(90deg, rgba(105, 78, 139, .14), transparent 50%),
    #fff;
}

.server-card h2 {
  margin: 0;
  color: var(--violet-dark);
  font-size: 23px;
  line-height: 1.1;
}

.server-card h2 a {
  color: inherit;
}

.server-card p {
  margin: 0;
  color: #5f6577;
  line-height: 1.55;
}

.server-card__monitor strong,
.server-meta-line strong {
  color: var(--violet-dark);
  font-size: 19px;
  line-height: 1;
}

.server-card em {
  align-self: center;
  width: max-content;
  border-radius: 4px;
  padding: 5px 8px;
  background: #e7f8f2;
  color: #139967;
  font-style: normal;
  font-weight: 900;
}

.server-card footer {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  border-top: 1px solid #e3dfea;
  padding: 14px 18px;
  background: rgba(255, 255, 255, .62);
}

.server-card footer a {
  margin-left: auto;
  border-radius: 7px;
  padding: 8px 11px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.server-meta-line {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.server-card__monitor {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: auto;
}

.server-card__monitor div {
  border: 1px solid #eadfed;
  border-radius: 8px;
  padding: 11px 12px;
  background: linear-gradient(135deg, #fff, #fff5f1);
}

.server-card__monitor span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.server-fill {
  overflow: hidden;
  height: 9px;
  border-radius: 999px;
  background: #eee8f4;
}

.server-fill span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #5f4b8b, #f08274);
  box-shadow: 0 0 14px rgba(236, 130, 119, .45);
}

.server-fill--detail {
  height: 11px;
}

.server-paid-mark,
.server-perks span {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  border-radius: 999px;
  padding: 5px 9px;
  background: #f2eaf7;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.server-perks {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
}

.server-paid-mark {
  background: #fff0eb;
  color: #8c3844;
}

.server-detail-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  background:
    radial-gradient(circle at 0 0, rgba(236, 143, 129, .15), transparent 35%),
    linear-gradient(135deg, #fff, #f8f4fb);
  box-shadow: 0 12px 28px rgba(45, 39, 62, .08);
}

.server-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.server-detail-grid article {
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.server-detail-grid span,
.server-detail-grid strong {
  display: block;
}

.server-detail-grid span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.server-detail-grid strong {
  margin-top: 4px;
  color: var(--violet-dark);
}

.server-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.server-paid-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.server-paid-info {
  display: grid;
  gap: 14px;
}

.wiki-edit-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  padding: 22px;
  background:
    linear-gradient(120deg, rgba(105, 78, 139, .92), rgba(236, 130, 119, .82)),
    url("/assets/knowledge-base.webp") center/cover;
  color: #fff;
  box-shadow: 0 18px 40px rgba(45, 39, 62, .16);
}

.wiki-edit-hero h1,
.wiki-edit-hero p {
  margin: 0;
}

.wiki-edit-hero h1 {
  margin-top: 6px;
  font-size: 38px;
}

.wiki-edit-hero > div p:last-child {
  max-width: 720px;
  margin-top: 9px;
  color: rgba(255, 255, 255, .86);
  line-height: 1.55;
}

.wiki-edit-hero aside {
  display: grid;
  align-content: center;
  gap: 6px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 8px;
  padding: 16px;
  background: rgba(31, 26, 45, .35);
  backdrop-filter: blur(8px);
}

.wiki-edit-hero aside span {
  color: #ffd7d0;
  font-size: 32px;
  font-weight: 900;
}

.wiki-edit-hero aside small {
  color: rgba(255, 255, 255, .78);
  line-height: 1.45;
}

.wiki-edit-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
}

.wiki-edit-summary {
  margin: 0;
  border-left: 4px solid var(--coral);
  border-radius: 6px;
  padding: 12px 14px;
  background: #fff6f2;
  color: #5f6577;
}

.wiki-edit-actions,
.wiki-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: end;
}

.wiki-edit-actions button,
.wiki-review-actions button {
  border: 0;
  border-radius: 7px;
  padding: 11px 14px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.wiki-rule-list {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
}

.wiki-rule-list span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.wiki-rule-list p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.wiki-revision-list,
.wiki-review-list {
  display: grid;
  gap: 10px;
}

.wiki-revision-item {
  border: 1px solid #e4dcea;
  border-radius: 8px;
  padding: 12px;
  background: #fbf9fd;
}

.wiki-revision-item span {
  display: inline-flex;
  border-radius: 999px;
  padding: 4px 8px;
  background: #f1e9f6;
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 900;
}

.wiki-revision-item--approved span {
  background: #e7f8f2;
  color: #12845a;
}

.wiki-revision-item--rejected span {
  background: #fff0eb;
  color: #9c3d3d;
}

.wiki-revision-item strong,
.wiki-revision-item p {
  display: block;
  margin-top: 8px;
}

.wiki-revision-item p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 12px;
}

.wiki-review-board {
  display: grid;
  gap: 14px;
}

.wiki-review-card {
  display: grid;
  gap: 12px;
  border: 1px solid #e1d8e8;
  border-radius: 9px;
  padding: 16px;
  background:
    radial-gradient(circle at 0 0, rgba(236, 130, 119, .12), transparent 34%),
    #fff;
  box-shadow: 0 12px 30px rgba(45, 39, 62, .08);
}

.wiki-review-card header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
}

.wiki-review-card h2,
.wiki-review-card p {
  margin: 8px 0 0;
}

.wiki-review-card aside {
  min-width: 160px;
  text-align: right;
}

.wiki-review-card aside strong,
.wiki-review-card aside span {
  display: block;
}

.wiki-review-card aside span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.wiki-review-body {
  max-height: 240px;
  overflow: auto;
  border: 1px solid #eee6f0;
  border-radius: 8px;
  padding: 14px;
  background: #fbf9fd;
  color: #4e5060;
  line-height: 1.55;
}

.wiki-review-actions label {
  flex: 1;
  min-width: 240px;
}

.wiki-review-actions .admin-button--danger {
  background: #9f3d52;
}

.wiki-review-title-change {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid #e4dcea;
  border-radius: 8px;
  padding: 12px 14px;
  background: #fbf9fd;
}

.wiki-review-title-change span {
  color: #777f8d;
  text-decoration: line-through;
}

.wiki-review-title-change b {
  color: var(--coral);
}

.wiki-review-title-change strong {
  color: #293342;
}

.wiki-review-comparison {
  border: 1px solid #e4dcea;
  border-radius: 8px;
  background: #fff;
}

.wiki-review-comparison > summary {
  cursor: pointer;
  padding: 12px 14px;
  color: var(--violet-dark);
  font-weight: 900;
}

.wiki-review-versions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 12px 12px;
}

.wiki-review-versions section {
  min-width: 0;
}

.wiki-review-versions h3 {
  margin: 0 0 7px;
  color: #697383;
  font-size: 12px;
  text-transform: uppercase;
}

.wiki-review-versions .wiki-review-body {
  height: 300px;
  max-height: 300px;
  font-size: 13px;
}

.wiki-editor-status {
  margin: -6px 0 4px;
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.messages-hub-hero {
  overflow: hidden;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  padding: 24px;
  background:
    linear-gradient(120deg, rgba(31, 26, 45, .82), rgba(236, 130, 119, .54)),
    url("/assets/forum-topic.png") center/cover;
  color: #fff;
  box-shadow: 0 18px 40px rgba(45, 39, 62, .15);
}

.messages-hub-hero h1,
.messages-hub-hero p {
  margin: 0;
}

.messages-hub-hero h1 {
  margin-top: 6px;
  font-size: 38px;
}

.messages-hub-hero p:last-child {
  max-width: 720px;
  margin-top: 9px;
  color: rgba(255, 255, 255, .84);
  line-height: 1.55;
}

.pm-layout {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
  gap: 18px;
}

.pm-sidebar {
  display: grid;
  align-content: start;
  gap: 14px;
}

.pm-compose form,
.pm-reply {
  display: grid;
  gap: 10px;
}

.pm-compose button,
.pm-reply button {
  border: 0;
  border-radius: 7px;
  padding: 11px 14px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.pm-thread-list {
  display: grid;
  gap: 8px;
}

.pm-thread-list a {
  display: grid;
  gap: 4px;
  border: 1px solid #e2dce8;
  border-radius: 8px;
  padding: 11px;
  background: #fbf9fd;
}

.pm-thread-list a.is-active {
  border-color: #dd8070;
  background: #fff5f1;
}

.pm-thread-list strong {
  color: var(--violet-dark);
}

.pm-thread-list span {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pm-conversation {
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 560px;
  border: 1px solid #d9d2e4;
  border-radius: 8px;
  padding: 16px;
  background:
    radial-gradient(circle at 0 0, rgba(236, 130, 119, .12), transparent 35%),
    #fff;
  box-shadow: 0 14px 34px rgba(45, 39, 62, .1);
}

.pm-conversation__head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid #eee6f0;
  padding-bottom: 12px;
}

.pm-conversation__head h2 {
  margin: 4px 0 0;
}

.pm-conversation__head > span {
  align-self: start;
  border-radius: 999px;
  padding: 6px 10px;
  background: #fff0eb;
  color: #8c3844;
  font-size: 12px;
  font-weight: 900;
}

.pm-empty {
  display: grid;
  place-items: center;
  min-height: 420px;
  text-align: center;
}

.pm-empty span {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.pm-empty h2,
.pm-empty p {
  margin: 0;
}

.pm-empty p {
  max-width: 420px;
  color: var(--muted);
}

.pm-message-list {
  display: grid;
  gap: 12px;
}

.pm-message {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  max-width: 78%;
}

.pm-message > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #f2eaf7;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.pm-message > div {
  border: 1px solid #e7dfea;
  border-radius: 10px;
  padding: 12px;
  background: #fbf9fd;
}

.pm-message--mine {
  justify-self: end;
}

.pm-message--mine > div {
  background: #fff5f1;
}

.pm-message--system {
  max-width: 100%;
}

.pm-message--system > span,
.pm-message--system > div {
  background: #201b2c;
  color: #fff;
}

.pm-message strong,
.pm-message time {
  display: block;
}

.pm-message p {
  margin: 7px 0;
  line-height: 1.5;
}

.pm-message time {
  color: var(--muted);
  font-size: 12px;
}

.pm-message--system time {
  color: rgba(255, 255, 255, .62);
}

.pm-reply {
  border-top: 1px solid #eee6f0;
  padding-top: 12px;
}

.system-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.system-summary article,
.migration-list article,
.system-checklist article {
  border: 1px solid #e1d8e8;
  border-radius: 9px;
  padding: 14px;
  background:
    radial-gradient(circle at 0 0, rgba(236, 130, 119, .12), transparent 32%),
    #fff;
  box-shadow: 0 10px 26px rgba(45, 39, 62, .07);
}

.system-summary span,
.migration-list span,
.system-checklist span {
  display: inline-grid;
  place-items: center;
  min-width: 38px;
  border-radius: 999px;
  padding: 5px 9px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.system-summary strong,
.migration-list strong {
  display: block;
  margin-top: 10px;
  color: var(--violet-dark);
}

.system-summary p,
.system-checklist p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.migration-list {
  display: grid;
  gap: 10px;
}

.migration-list article {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 130px;
  gap: 12px;
  align-items: center;
}

.migration-list article.is-pending {
  border-color: #df9288;
  background:
    radial-gradient(circle at 0 0, rgba(236, 130, 119, .2), transparent 32%),
    #fff7f3;
}

.migration-list strong {
  margin-top: 0;
}

.migration-list p,
.migration-list em {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.migration-list em {
  justify-self: end;
  font-style: normal;
  font-weight: 800;
}

.system-checklist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.system-checklist article {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.notification-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 210px;
  gap: 16px;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  padding: 24px;
  background:
    linear-gradient(120deg, rgba(105, 78, 139, .9), rgba(236, 130, 119, .75)),
    url("/assets/media-collage.webp") center/cover;
  color: #fff;
  box-shadow: 0 18px 40px rgba(45, 39, 62, .15);
}

.notification-hero h1,
.notification-hero p {
  margin: 0;
}

.notification-hero h1 {
  margin-top: 6px;
  font-size: 38px;
}

.notification-hero p:last-child {
  max-width: 720px;
  margin-top: 9px;
  color: rgba(255, 255, 255, .84);
  line-height: 1.55;
}

.notification-hero aside {
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 9px;
  padding: 16px;
  background: rgba(31, 26, 45, .35);
  backdrop-filter: blur(8px);
}

.notification-hero aside strong,
.notification-hero aside span {
  display: block;
}

.notification-hero aside strong {
  color: #ffd7d0;
  font-size: 42px;
  line-height: 1;
}

.notification-hero aside span {
  font-weight: 900;
}

.notification-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 18px;
}

.notification-feed {
  display: grid;
  gap: 12px;
}

.notification-card {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  border: 1px solid #e2d9e8;
  border-radius: 9px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(45, 39, 62, .07);
}

.notification-card.is-unread {
  border-color: #dd8070;
  background:
    radial-gradient(circle at 0 0, rgba(236, 130, 119, .14), transparent 32%),
    #fff;
}

.notification-card > span {
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  padding: 6px 9px;
  background: #f2eaf7;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.notification-card.is-unread > span {
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
}

.notification-card h2,
.notification-card p {
  margin: 0;
}

.notification-card h2 {
  color: var(--violet-dark);
  font-size: 19px;
}

.notification-card p {
  margin-top: 7px;
  color: var(--muted);
  line-height: 1.5;
}

.notification-card time {
  display: block;
  margin-top: 8px;
  color: #7d8292;
  font-size: 12px;
}

.notification-card button {
  border: 0;
  border-radius: 7px;
  padding: 9px 12px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.notification-empty {
  display: grid;
  place-items: center;
  min-height: 320px;
  border: 1px solid #e2d9e8;
  border-radius: 9px;
  padding: 26px;
  background: #fff;
  text-align: center;
}

.notification-empty span {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.notification-empty h2,
.notification-empty p {
  margin: 0;
}

.notification-empty p {
  max-width: 420px;
  color: var(--muted);
}

.notification-aside {
  display: grid;
  align-content: start;
  gap: 14px;
}

.panel-link-list {
  display: grid;
  gap: 8px;
}

.panel-link-list a {
  border: 1px solid #e2dce8;
  border-radius: 8px;
  padding: 10px 11px;
  background: #fbf9fd;
  color: var(--violet-dark);
  font-weight: 900;
}

.notification-admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
}

.notification-admin-form {
  gap: 14px;
}

.notification-admin-form button[type="submit"] {
  border: 0;
  border-radius: 7px;
  padding: 12px 15px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.notification-admin-tips {
  display: grid;
  align-content: start;
}

.install-done-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  padding: 24px;
  background:
    linear-gradient(120deg, rgba(32, 27, 44, .84), rgba(236, 130, 119, .68)),
    url("/assets/servers.webp") center/cover;
  color: #fff;
  box-shadow: 0 18px 40px rgba(45, 39, 62, .15);
}

.install-done-hero h1,
.install-done-hero p {
  margin: 0;
}

.install-done-hero h1 {
  margin-top: 6px;
  font-size: 40px;
}

.install-done-hero p:last-child {
  max-width: 720px;
  margin-top: 9px;
  color: rgba(255, 255, 255, .84);
  line-height: 1.55;
}

.install-done-hero aside {
  display: grid;
  align-content: center;
  gap: 6px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 9px;
  padding: 16px;
  background: rgba(31, 26, 45, .36);
  backdrop-filter: blur(8px);
}

.install-done-hero aside span {
  width: max-content;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(255, 255, 255, .16);
  color: #ffd7d0;
  font-size: 11px;
  font-weight: 900;
}

.install-done-hero aside strong {
  font-size: 28px;
}

.install-done-hero aside small {
  overflow-wrap: anywhere;
  color: rgba(255, 255, 255, .74);
}

.install-done-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.install-done-summary article {
  border: 1px solid #e1d8e8;
  border-radius: 9px;
  padding: 14px;
  background:
    radial-gradient(circle at 0 0, rgba(236, 130, 119, .12), transparent 32%),
    #fff;
  box-shadow: 0 10px 26px rgba(45, 39, 62, .07);
}

.install-done-summary span {
  display: inline-grid;
  place-items: center;
  min-width: 38px;
  border-radius: 999px;
  padding: 5px 9px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.install-done-summary strong {
  display: block;
  margin-top: 10px;
  color: var(--violet-dark);
}

.install-done-summary p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.install-next-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.install-next-grid a {
  display: grid;
  gap: 8px;
  border: 1px solid #e1d8e8;
  border-radius: 9px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(45, 39, 62, .07);
}

.install-next-grid span {
  color: #dd8070;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.install-next-grid strong {
  color: var(--violet-dark);
  line-height: 1.25;
}

.cinema-layout,
.blog-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
}

.cinema-player,
.blog-feature {
  position: relative;
  overflow: hidden;
  min-height: 360px;
  border-radius: 6px;
  color: #fff;
  box-shadow: var(--shadow);
}

.cinema-player img,
.blog-feature img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cinema-player::after,
.blog-feature::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(34, 26, 50, .18), rgba(34, 26, 50, .9));
}

.cinema-player div,
.blog-feature div {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 22px;
  z-index: 1;
}

.cinema-player div > span {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin-bottom: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .2);
  border: 1px solid rgba(255, 255, 255, .4);
  font-weight: 900;
}

.cinema-player h2,
.blog-feature h2 {
  margin: 0 0 8px;
  font-size: 30px;
}

.video-queue {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.video-queue h3 {
  margin: 0 0 10px;
  color: var(--violet-dark);
}

.video-queue a {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 0;
  border-top: 1px solid #e5e1eb;
}

.video-queue a:first-of-type {
  border-top: 0;
}

.video-queue span {
  color: var(--muted);
}

.wiki-section-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  grid-auto-rows: 190px;
  gap: 14px;
}

.wiki-section-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 190px;
  padding: 16px;
  border-radius: 6px;
  color: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .1);
}

.wiki-section-card.large {
  grid-row: span 2;
}

.wiki-section-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wiki-section-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(38, 30, 54, .1), rgba(38, 30, 54, .88));
}

.wiki-section-card span,
.wiki-section-card p {
  position: relative;
  z-index: 1;
}

.wiki-section-card span {
  font-size: 22px;
  font-weight: 900;
}

.wiki-section-card p {
  margin: 5px 0 0;
  color: rgba(255, 255, 255, .84);
}

.wiki-page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 18px;
}

.wiki-entry,
.wiki-infobox {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.wiki-entry {
  overflow: hidden;
}

.wiki-entry__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 20px;
  align-items: end;
  padding: 22px;
  border-bottom: 1px solid #e5e1eb;
  background: linear-gradient(135deg, #fff, #fff2ed);
}

.wiki-entry__head h1 {
  margin: 0 0 8px;
  font-size: 42px;
}

.wiki-entry__head img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 5px;
}

.wiki-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 12px 18px;
  border-bottom: 1px solid #e5e1eb;
  background: #faf8fc;
}

.wiki-tabs a {
  border-radius: 4px;
  padding: 7px 10px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-weight: 900;
  font-size: 13px;
}

.wiki-entry section {
  padding: 20px 22px;
  border-top: 1px solid #eeeaf3;
}

.wiki-entry section:first-of-type {
  border-top: 0;
}

.wiki-entry h2 {
  margin: 0 0 10px;
  color: var(--violet-dark);
}

.wiki-data-table {
  overflow: hidden;
  border: 1px solid #d8d2df;
  border-radius: 5px;
}

.wiki-data-table > div {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr) 140px;
  gap: 12px;
  padding: 11px 12px;
  border-top: 1px solid #e5e1eb;
}

.wiki-data-table > div:first-child {
  border-top: 0;
  background: var(--violet);
  color: #fff;
}

.wiki-data-table em {
  color: var(--muted);
  font-style: normal;
}

.wiki-infobox {
  align-self: start;
  overflow: hidden;
  padding-bottom: 16px;
}

.wiki-infobox img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.wiki-infobox h2,
.wiki-infobox dl,
.wiki-infobox a {
  margin-left: 16px;
  margin-right: 16px;
}

.wiki-infobox dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
}

.wiki-infobox dt {
  color: var(--muted);
}

.wiki-infobox dd {
  margin: 0;
  color: var(--violet-dark);
  font-weight: 900;
}

.mod-category-nav {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}

.mod-category-nav a {
  position: relative;
  overflow: hidden;
  min-height: 118px;
  display: grid;
  align-items: end;
  border-radius: 6px;
  color: #fff;
}

.mod-category-nav img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mod-category-nav a::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent, rgba(41, 32, 58, .88));
}

.mod-category-nav span {
  position: relative;
  z-index: 1;
  padding: 12px;
  font-weight: 900;
}

.mods-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
}

.mods-list {
  display: grid;
  gap: 14px;
}

.mod-card {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.mod-card.featured {
  border-color: #d9b7c9;
  background: linear-gradient(135deg, #fff, #fff7f4);
}

.mod-card > img {
  width: 100%;
  height: 100%;
  min-height: 160px;
  object-fit: cover;
}

.mod-card > div {
  padding: 16px;
}

.mod-card h2,
.mod-card h3 {
  margin: 8px 0;
  color: var(--violet-dark);
}

.mod-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.mod-stats span {
  border-radius: 4px;
  padding: 5px 8px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.mod-detail-hero {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr) 190px;
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: linear-gradient(135deg, #fff, #fff3ef);
  box-shadow: var(--shadow);
}

.mod-detail-hero > img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 6px;
}

.mod-detail-hero h1 {
  margin: 8px 0;
  font-size: 38px;
}

.mod-detail-hero aside {
  display: grid;
  gap: 10px;
  justify-items: stretch;
}

.download-button {
  border: 0;
  border-radius: 5px;
  padding: 13px 16px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}

.portal-strip {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap: 18px;
  margin-top: 22px;
}

.portal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.portal-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.portal-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.portal-card__head h2 {
  margin: 0;
  color: var(--violet-dark);
  font-size: 22px;
}

.portal-card__head a {
  color: var(--violet);
  font-size: 13px;
  font-weight: 900;
}

.activity-list,
.activity-feed,
.site-news-list {
  display: grid;
  gap: 10px;
}

.activity-list a,
.site-news-list a {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 12px;
  border: 1px solid #e3dfea;
  border-radius: 5px;
  background: #fbf9fd;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.activity-list a:first-child,
.site-news-list a:first-child {
  background: linear-gradient(135deg, #fff8f1, #fbf7ff);
  border-color: #dcc4cf;
}

.activity-list a:hover,
.site-news-list a:hover {
  transform: translateY(-1px);
  border-color: #d2c7dc;
  box-shadow: 0 8px 18px rgba(45, 39, 62, .08);
}

.portal-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 6px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  box-shadow: 0 6px 14px rgba(80, 66, 102, .24);
}

.activity-list strong,
.activity-list p,
.site-news-list strong,
.site-news-list p,
.site-news-list em {
  display: block;
}

.activity-list strong,
.site-news-list strong {
  color: var(--violet-dark);
  font-size: 15px;
}

.activity-list p,
.site-news-list p {
  margin: 3px 0 5px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.35;
}

.site-news-list em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.mini-file,
.partner-mini {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 11px;
  border: 1px solid #e3dfea;
  border-radius: 6px;
  background: #fbf9fd;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.mini-file + .mini-file,
.partner-mini + .partner-mini {
  margin-top: 10px;
}

.mini-file:hover,
.partner-mini:hover {
  transform: translateY(-1px);
  border-color: #d2c7dc;
  box-shadow: 0 8px 18px rgba(45, 39, 62, .08);
}

.mini-file img,
.partner-mini img {
  width: 58px;
  height: 48px;
  object-fit: cover;
  border-radius: 5px;
}

.mini-file strong,
.mini-file span,
.mini-file em,
.partner-mini strong,
.partner-mini span {
  display: block;
}

.mini-file span,
.partner-mini span {
  margin-top: 2px;
  color: var(--ink);
  font-size: 13px;
}

.mini-file em {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.file-showcase {
  display: grid;
  gap: 10px;
}

.file-drop {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  overflow: hidden;
  min-height: 102px;
  border: 1px solid #ded6e6;
  border-radius: 8px;
  background: linear-gradient(135deg, #fff, #fbf8fd);
  box-shadow: 0 8px 18px rgba(43, 37, 58, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.file-drop:hover {
  transform: translateY(-1px);
  border-color: #d2c1df;
  box-shadow: 0 12px 24px rgba(43, 37, 58, .1);
}

.file-drop img {
  width: 92px;
  height: 100%;
  min-height: 102px;
  object-fit: cover;
}

.file-drop > div {
  display: grid;
  align-content: center;
  min-width: 0;
  padding: 10px 10px 10px 0;
}

.file-drop strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.15;
}

.file-drop p {
  margin: 5px 0 0;
  color: #626878;
  font-size: 12px;
  line-height: 1.3;
}

.file-drop em {
  display: inline-flex;
  width: max-content;
  margin-top: 8px;
  border-radius: 999px;
  padding: 5px 8px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.file-badge {
  display: inline-flex;
  width: max-content;
  border-radius: 999px;
  padding: 4px 7px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.file-drop--featured {
  grid-template-columns: 1fr;
  min-height: 210px;
  position: relative;
  background: #201b2c;
  color: #fff;
}

.file-drop--featured img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .78;
}

.file-drop--featured::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(32, 27, 44, .12), rgba(32, 27, 44, .88));
}

.file-drop--featured > div {
  position: relative;
  z-index: 1;
  align-content: end;
  padding: 14px;
}

.file-drop--featured strong {
  color: #fff;
  font-size: 20px;
}

.file-drop--featured p {
  color: rgba(255, 255, 255, .86);
}

.file-drop--featured em {
  background: rgba(255, 255, 255, .16);
  color: #fff;
}

.timeline--compact li {
  grid-template-columns: 76px minmax(0, 1fr);
  padding: 9px 0;
}

.wiki-updates {
  display: grid;
  gap: 10px;
}

.wiki-update {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 12px;
  border: 1px solid #e3dfea;
  border-radius: 6px;
  background: #fbf9fd;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.wiki-update:hover {
  transform: translateY(-1px);
  border-color: #d2c7dc;
  box-shadow: 0 8px 18px rgba(45, 39, 62, .08);
}

.wiki-update--hot {
  background: linear-gradient(135deg, #fff8f1, #fbf7ff);
  border-color: #dcc4cf;
}

.wiki-update__icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 6px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 6px 14px rgba(80, 66, 102, .24);
}

.wiki-update strong,
.wiki-update p,
.wiki-update em {
  display: block;
}

.wiki-update strong {
  color: var(--violet-dark);
  font-size: 15px;
}

.wiki-update p {
  margin: 3px 0 5px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.35;
}

.wiki-update em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.server-mini {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 12px;
  border: 1px solid #e3dfea;
  border-radius: 6px;
  background: #fbf9fd;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.server-mini + .server-mini {
  margin-top: 10px;
}

.server-mini:hover {
  transform: translateY(-1px);
  border-color: #d2c7dc;
  box-shadow: 0 8px 18px rgba(45, 39, 62, .08);
}

.server-mini strong {
  color: var(--violet-dark);
}

.server-mini span {
  color: var(--muted);
}

.server-mini em {
  border-radius: 4px;
  padding: 4px 7px;
  background: #e7f8f2;
  color: #139967;
  font-style: normal;
  font-size: 12px;
  font-weight: 900;
}

.site-footer {
  margin-top: 24px;
  background: linear-gradient(90deg, #352d4a, #604d78 55%, #d98677);
  color: #fff;
}

.site-footer__inner {
  width: min(100%, 1220px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.1fr;
  gap: 24px;
  padding: 30px 14px;
}

.site-footer p {
  margin: 10px 0 0;
  color: rgba(255, 255, 255, .78);
}

.site-footer h3 {
  margin: 0 0 10px;
  font-size: 16px;
}

.site-footer nav {
  display: grid;
  align-content: start;
  gap: 6px;
}

.site-footer a {
  color: #fff;
  font-weight: 800;
}

.site-footer span {
  margin-top: 4px;
  color: rgba(255, 255, 255, .72);
  font-size: 13px;
  font-weight: 800;
}

.profile-hero {
  position: relative;
  overflow: hidden;
  min-height: 300px;
  display: grid;
  align-items: end;
  border-radius: 6px;
  color: #fff;
  box-shadow: var(--shadow);
}

.profile-hero__cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(35, 28, 52, .92), rgba(92, 61, 108, .7), rgba(236, 143, 129, .25));
}

.profile-hero__content {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 20px;
  align-items: end;
  padding: 28px;
}

.profile-avatar {
  width: 132px;
  height: 132px;
  object-fit: cover;
  border: 4px solid #fff;
  border-radius: 14px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
}

.profile-hero h1 {
  margin: 0 0 8px;
  font-size: 46px;
}

.profile-hero p:not(.eyebrow) {
  margin: 0;
  color: rgba(255, 255, 255, .84);
}

.profile-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.profile-badges span {
  border-radius: 4px;
  padding: 6px 9px;
  background: rgba(255, 255, 255, .18);
  border: 1px solid rgba(255, 255, 255, .24);
  font-weight: 900;
  font-size: 13px;
}

.profile-badge {
  display: inline-grid;
  gap: 2px;
}

.profile-badge small {
  color: rgba(255, 255, 255, .76);
  font-size: 10px;
  line-height: 1.1;
}

.profile-badge--gold {
  background: linear-gradient(135deg, rgba(255, 209, 114, .28), rgba(255, 255, 255, .16)) !important;
  border-color: rgba(255, 223, 154, .5) !important;
}

.profile-badge--staff {
  background: linear-gradient(135deg, rgba(226, 118, 190, .32), rgba(255, 255, 255, .16)) !important;
  border-color: rgba(255, 179, 225, .5) !important;
}

.profile-badge--forum,
.profile-badge--wiki,
.profile-badge--file {
  background: rgba(255, 255, 255, .22) !important;
}

.profile-note {
  border: 1px solid #e5ddea;
  border-radius: 8px;
  padding: 10px;
  background: #fbf9fd;
}

.profile-note + .profile-note {
  margin-top: 8px;
}

.profile-note strong {
  display: block;
  color: var(--violet-dark);
  font-size: 13px;
}

.profile-note p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.profile-note--warning {
  border-color: #f0c1b9;
  background: #fff7f4;
}

.profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
}

.profile-main {
  display: grid;
  gap: 18px;
}

.activity-feed article {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 12px;
  padding: 13px 0;
  border-top: 1px solid #e5e1eb;
}

.activity-feed article:first-child {
  border-top: 0;
}

.activity-feed article > span {
  color: var(--coral);
  font-weight: 900;
}

.activity-feed p {
  margin: 4px 0 0;
  color: var(--muted);
}

.contribution-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.contribution-grid article {
  padding: 16px;
  border: 1px solid #ded7e7;
  border-radius: 6px;
  background: linear-gradient(135deg, #fff, #fff4ef);
}

.contribution-grid h3 {
  margin: 0 0 8px;
  color: var(--violet-dark);
}

.contribution-grid span {
  display: inline-flex;
  margin-top: 10px;
  border-radius: 4px;
  padding: 5px 8px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-weight: 900;
  font-size: 12px;
}

.reward-grid--profile {
  grid-template-columns: 1fr;
}


.sidebar {
  align-self: start;
  position: sticky;
  top: 76px;
  max-height: calc(100vh - 88px);
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
  scrollbar-color: #9d86aa transparent;
}

.sidebar::-webkit-scrollbar {
  width: 6px;
}

.sidebar::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #9d86aa;
}

.nav-block {
  margin-bottom: 10px;
  overflow: hidden;
  border: 1px solid #d6cfdf;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 8px 24px rgba(47, 39, 73, .14);
}

.side-card {
  margin-bottom: 10px;
  overflow: hidden;
  padding: 0 8px 8px;
  border: 1px solid #d6cfdf;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(47, 39, 73, .12);
}

.side-card h2 {
  margin: 0 -8px 8px;
  padding: 9px 11px;
  background: linear-gradient(90deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
}

.side-card a {
  display: grid;
  grid-template-columns: 31px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  margin-top: 6px;
  padding: 7px;
  border: 1px solid #e3dfea;
  border-radius: 6px;
  background: #fbf9fd;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.side-card a:hover {
  transform: translateY(-1px);
  border-color: #d2c7dc;
  box-shadow: 0 8px 18px rgba(45, 39, 62, .08);
}

.side-card strong {
  display: block;
  color: var(--violet-dark);
  font-size: 12px;
  line-height: 1.2;
}

.side-card p,
.side-card em {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  font-style: normal;
}

.side-icon,
.side-avatar {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 9px;
  font-weight: 900;
}

.side-avatar {
  border-radius: 50%;
  background: linear-gradient(135deg, #5f638f, #ff7ec8);
}

.user-rank {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  margin-top: 6px;
  padding: 7px;
  border: 1px solid #e3dfea;
  border-radius: 6px;
  background: #fbf9fd;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.user-rank:hover {
  transform: translateY(-1px);
  border-color: #d2c7dc;
  box-shadow: 0 8px 18px rgba(45, 39, 62, .08);
}

.user-rank span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #eee9f3;
  color: var(--violet-dark);
  font-weight: 900;
}

.nav-block h2 {
  margin: 0;
  padding: 9px 11px;
  background: linear-gradient(90deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
}

.nav-block a {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  margin: 6px 8px;
  min-height: 36px;
  padding: 6px;
  border: 1px solid #e3dfea;
  border-radius: 6px;
  background: #fbf9fd;
  font-size: 12px;
  font-weight: 800;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.nav-block a:hover {
  transform: translateY(-1px);
  border-color: #d2c7dc;
  box-shadow: 0 8px 18px rgba(45, 39, 62, .08);
}

.nav-block span {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 6px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 9px;
  font-weight: 900;
}

.nav-block strong,
.nav-block em {
  display: block;
}

.nav-block strong {
  color: var(--violet-dark);
}

.nav-block em {
  margin-top: 1px;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
}

.nav-block--compact a {
  min-height: 35px;
}

.content {
  min-width: 0;
}

.notice,
.follow-card,
.post,
.page-preview,
.info-grid article,
.resources article {
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 5px;
}

.notice {
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 15px;
}

.social-pill,
.ghost-button {
  border: 0;
  border-radius: 5px;
  padding: 9px 14px;
  background: #14171b;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

.ghost-button {
  border: 1px solid #d9d4e2;
  background: #fff;
  color: var(--violet-dark);
}

.intro {
  margin-top: 14px;
  padding: 0 18px 18px;
}

.intro h1 {
  margin: 0 0 12px;
  padding: 0 0 8px;
  border-bottom: 2px solid var(--coral);
  font-size: 42px;
  line-height: 1.12;
}

.follow-card {
  padding: 13px 14px;
  font-size: 14px;
}

.social-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}

.social-row a {
  padding: 5px 9px;
  border-radius: 4px;
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.blue { background: #2585df; }
.indigo { background: #5364b8; }
.green { background: #13b86b; }
.black { background: #111; }
.red { background: #ee1d24; }

.site-alert {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  overflow: hidden;
  margin-bottom: 16px;
  padding: 18px 20px;
  border: 1px solid #d8cfdf;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(255, 245, 241, .96)),
    linear-gradient(90deg, var(--violet), var(--coral));
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.site-alert::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, var(--violet), var(--coral));
}

.site-alert span {
  display: inline-flex;
  margin-bottom: 7px;
  border-radius: 999px;
  padding: 5px 9px;
  background: #201b2c;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.site-alert h1 {
  margin: 0 0 6px;
  color: var(--ink);
  font-size: 27px;
  line-height: 1.12;
}

.site-alert p {
  max-width: 720px;
  margin: 0;
  color: #626878;
  line-height: 1.45;
}

.site-alert__meta {
  display: grid;
  gap: 8px;
  justify-items: end;
  min-width: 170px;
}

.site-alert__meta strong,
.site-alert__meta a {
  border-radius: 999px;
  padding: 8px 11px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.site-alert__meta strong {
  background: #eee9f3;
  color: var(--violet-dark);
}

.site-alert__meta a {
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  box-shadow: 0 8px 18px rgba(93, 68, 128, .2);
}

.quick-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 16px 0 30px;
}

.quick-card {
  position: relative;
  min-height: 138px;
  overflow: hidden;
  border: 1px solid #c5bfd0;
  border-radius: 5px;
  background: #ded8e7;
  box-shadow: 0 10px 22px rgba(52, 44, 70, .09);
}

.quick-card img {
  width: 100%;
  height: 138px;
  object-fit: cover;
  transition: transform .25s ease;
}

.quick-card:hover img {
  transform: scale(1.05);
}

.quick-card span {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 8px 9px;
  background: linear-gradient(90deg, rgba(106, 82, 139, .94), rgba(221, 128, 112, .94));
  color: #fff;
  font-size: 15px;
  font-weight: 900;
  text-align: center;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin: 4px 0 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: linear-gradient(135deg, #fff, #fff5f1);
  box-shadow: 0 10px 24px rgba(45, 39, 62, .07);
}

.section-heading h2,
.page-preview h2,
.resources h2 {
  margin: 0 0 12px;
  font-size: 30px;
  font-weight: 600;
}

.section-heading h2 {
  margin-bottom: 4px;
  color: var(--ink);
  font-size: 34px;
}

.section-heading p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
}

.news-controls {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.tabs {
  display: flex;
  overflow: hidden;
  border: 1px solid #d8d2df;
  border-radius: 6px;
  background: #fff;
}

.tab {
  min-width: 112px;
  padding: 10px 13px;
  border: 0;
  border-left: 1px solid #e5e1eb;
  background: transparent;
  color: var(--violet);
  font-weight: 900;
  cursor: pointer;
}

.tab:first-child {
  border-left: 0;
}

.tab.is-active {
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
}

.news-all-link {
  color: var(--violet);
  font-size: 13px;
  font-weight: 900;
}

.news-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.post {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 9px 20px rgba(39, 35, 55, .08);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.post:hover {
  transform: translateY(-2px);
  border-color: #d5c8dd;
  box-shadow: 0 16px 32px rgba(45, 39, 62, .13);
}

.post--compact {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}

.post__tag {
  padding: 8px 13px;
  background: var(--violet);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.post--feature img {
  width: 100%;
  height: 310px;
  object-fit: cover;
}

.post__media {
  position: relative;
  display: block;
  overflow: hidden;
}

.post__media img {
  transition: transform .28s ease;
}

.post:hover .post__media img {
  transform: scale(1.035);
}

.post__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(38, 30, 54, 0), rgba(38, 30, 54, .22));
}

.post__badge {
  position: absolute;
  left: 12px;
  top: 12px;
  z-index: 1;
  border-radius: 5px;
  padding: 6px 9px;
  background: rgba(27, 24, 35, .82);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.post__body {
  padding: 16px 16px 12px;
}

.post__kicker {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-bottom: 8px;
}

.post__kicker span,
.post__kicker em {
  border-radius: 4px;
  padding: 4px 7px;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.post__kicker span {
  background: #eee9f3;
  color: var(--violet-dark);
}

.post__kicker em {
  background: #fff0eb;
  color: #9a574d;
}

.post h3 {
  margin: 0 0 9px;
  color: var(--violet-dark);
  font-size: 21px;
  line-height: 1.2;
}

.post p,
.info-grid p,
.page-preview p,
.resources p {
  margin: 0;
  color: var(--muted);
}

.post__meta {
  margin-top: 16px;
  padding-top: 11px;
  border-top: 1px solid #e0dde5;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  justify-content: space-between;
  color: #7d8495;
  font-size: 13px;
}

.post--compact .post__meta {
  margin-top: 0;
  padding: 10px 14px;
  border-top: 1px solid #e6e1eb;
  background: linear-gradient(90deg, #fbf9fd, #fff5f1);
  align-items: center;
}

.post--compact .post__meta span,
.post--compact .post__meta time,
.post--compact .post__meta em {
  white-space: nowrap;
}

.post__meta em {
  color: var(--violet-dark);
  font-style: normal;
  font-weight: 900;
}

.post__inline {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 13px;
  padding: 14px;
  align-items: start;
}

.post__inline img {
  width: 132px;
  aspect-ratio: 1.25;
  object-fit: cover;
  border: 1px solid #d2cddb;
  border-radius: 5px;
}

.post--compact h3 {
  margin-bottom: 7px;
  font-size: 17px;
  color: var(--ink);
}

.post--compact p {
  font-size: 14px;
  line-height: 1.45;
}

.post--compact .post__kicker {
  margin-bottom: 7px;
}

.post--compact .post__kicker span,
.post--compact .post__kicker em {
  padding: 3px 7px;
  font-size: 11px;
}

.page-preview {
  margin-top: 22px;
  padding: 22px;
  box-shadow: 0 9px 20px rgba(39, 35, 55, .06);
}

.article-hero {
  display: grid;
  grid-template-columns: 380px minmax(0, 1fr);
  gap: 22px;
  align-items: end;
  padding-bottom: 18px;
  border-bottom: 2px solid #efe7e5;
}

.article-hero img {
  width: 100%;
  height: 245px;
  object-fit: cover;
  border-radius: 5px;
  border: 1px solid #d6d1df;
}

.article-hero h2 {
  margin: 0 0 10px;
  font-size: 34px;
  line-height: 1.1;
}

.article-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  gap: 22px;
  margin-top: 18px;
}

.article-layout article p + p {
  margin-top: 12px;
}

.quote-box {
  margin-top: 16px;
  padding: 14px 16px;
  border-left: 4px solid var(--coral);
  background: #fff5f1;
  color: var(--violet-dark);
  font-weight: 800;
}

.article-layout aside {
  display: grid;
  gap: 9px;
  align-self: start;
  padding: 15px;
  border-radius: 5px;
  background: #f1edf5;
}

.article-layout aside h3 {
  margin: 0;
}

.article-layout aside span {
  color: var(--muted);
}

.article-layout aside a {
  margin-top: 4px;
  color: var(--violet);
  font-weight: 900;
}

.page-preview__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid #efe7e5;
}

.page-preview__header a {
  color: var(--violet);
  font-weight: 900;
}

.eyebrow {
  margin: 0 0 3px;
  color: var(--coral);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.info-grid,
.resources {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.info-grid article,
.resources article {
  padding: 18px;
}

.info-grid h3,
.file-board h3,
.knowledge-grid h3 {
  margin: 0 0 10px;
  font-size: 21px;
}

.timeline {
  margin: 0;
  padding: 0;
  list-style: none;
}

.timeline li {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 12px;
  padding: 11px 0;
  border-top: 1px solid #e3e0e8;
}

.timeline li:first-child {
  border-top: 0;
  padding-top: 0;
}

.timeline span {
  color: var(--muted);
}

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.chips span {
  padding: 7px 10px;
  border-radius: 5px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-weight: 900;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.gallery-grid figure {
  margin: 0;
  overflow: hidden;
  border: 1px solid #d6d1df;
  border-radius: 5px;
  background: #f8f7fa;
}

.gallery-grid img {
  width: 100%;
  height: 142px;
  object-fit: cover;
}

.gallery-grid figcaption {
  padding: 10px;
  color: var(--violet-dark);
  font-size: 14px;
  font-weight: 900;
  text-align: center;
}

.media-strip {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  gap: 14px;
  margin-top: 16px;
}

.media-strip img {
  width: 100%;
  height: 170px;
  object-fit: cover;
  border-radius: 5px;
  border: 1px solid #d6d1df;
}

.split {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 22px;
  align-items: center;
}

.split > img {
  width: 100%;
  height: 235px;
  object-fit: cover;
  border-radius: 5px;
  border: 1px solid #d8d2df;
}

.stat-row {
  display: flex;
  gap: 12px;
  margin-top: 20px;
}

.stat-row span {
  flex: 1;
  padding: 12px;
  border-radius: 5px;
  background: #f0edf5;
  color: var(--muted);
  text-align: center;
}

.stat-row strong {
  display: block;
  color: var(--violet-dark);
  font-size: 25px;
}

.directory-layout {
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr);
  gap: 18px;
}

.directory-layout > img,
.wide-image {
  width: 100%;
  height: 250px;
  object-fit: cover;
  border: 1px solid #d6d1df;
  border-radius: 5px;
}

.list-panel,
.thread-list,
.video-list {
  display: grid;
  gap: 10px;
}

.list-panel article,
.thread-list a,
.video-list a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 13px 14px;
  border: 1px solid #ddd8e5;
  border-radius: 5px;
  background: #fff;
}

.list-panel span,
.thread-list span,
.video-list span {
  color: var(--muted);
  font-weight: 700;
}

.list-panel button {
  grid-row: 1 / span 2;
  grid-column: 2;
  border: 0;
  border-radius: 5px;
  padding: 8px 11px;
  background: var(--violet);
  color: #fff;
  font-weight: 900;
}

.file-board {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.blog-grid article {
  overflow: hidden;
  border: 1px solid #d6d1df;
  border-radius: 5px;
  background: #fff;
}

.blog-grid img {
  width: 100%;
  height: 155px;
  object-fit: cover;
}

.blog-grid h3,
.blog-grid p {
  padding-left: 14px;
  padding-right: 14px;
}

.blog-grid h3 {
  margin: 14px 0 8px;
  font-size: 19px;
}

.blog-grid p {
  padding-bottom: 15px;
}

.file-board article {
  overflow: hidden;
  border: 1px solid #d6d1df;
  border-radius: 5px;
  background: #fff;
}

.file-board img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.file-board h3,
.file-board p,
.file-board span {
  display: block;
  padding-left: 14px;
  padding-right: 14px;
}

.file-board h3 {
  padding-top: 13px;
}

.file-board span {
  padding-top: 12px;
  padding-bottom: 14px;
  color: var(--violet-dark);
  font-weight: 900;
}

.server-table {
  overflow: hidden;
  margin-bottom: 16px;
  border: 1px solid #d8d2df;
  border-radius: 5px;
}

.server-table > div {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 90px;
  gap: 12px;
  padding: 12px 14px;
  border-top: 1px solid #e5e1eb;
  align-items: center;
}

.server-table > div:first-child {
  border-top: 0;
}

.server-table__head {
  background: var(--violet);
  color: #fff;
  font-weight: 900;
}

.server-table em {
  color: #139967;
  font-style: normal;
  font-weight: 900;
}

.search-input {
  width: min(100%, 260px);
  border: 1px solid #d8d2df;
  border-radius: 5px;
  padding: 10px 12px;
  color: var(--ink);
}

.knowledge-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  background: url("assets/knowledge-base.webp") center / cover no-repeat;
  border-radius: 5px;
  padding: 18px;
  position: relative;
  overflow: hidden;
}

.knowledge-grid::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(42, 32, 60, .48);
}

.knowledge-grid article {
  position: relative;
  min-height: 150px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 5px;
  background: rgba(255, 255, 255, .9);
}

.video-panel {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 20px;
  background: linear-gradient(135deg, #ffffff 0%, #fff3ef 100%);
}

.resources {
  margin-bottom: 18px;
}

.xf-hero {
  position: relative;
  min-height: 260px;
  overflow: hidden;
  display: grid;
  align-items: end;
  padding: 28px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 6px;
  color: #fff;
  box-shadow: var(--shadow);
}

.xf-hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.xf-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(35, 28, 52, .92), rgba(91, 63, 106, .68), rgba(234, 134, 120, .28));
}

.xf-hero > div {
  position: relative;
  z-index: 1;
  max-width: 760px;
}

.xf-hero h1 {
  margin: 0 0 10px;
  font-size: 46px;
  line-height: 1;
}

.xf-hero p:not(.eyebrow) {
  margin: 0;
  color: rgba(255, 255, 255, .86);
  font-size: 17px;
}

.xf-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}

.xf-breadcrumb a {
  color: var(--violet);
}

.xf-breadcrumb span::before {
  content: "/";
  margin-right: 8px;
  color: #aaa3b5;
}

.xf-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.xf-search {
  display: flex;
  flex: 1;
  min-width: 240px;
}

.xf-search input {
  width: 100%;
  border: 1px solid #d8d2df;
  border-radius: 5px 0 0 5px;
  padding: 10px 12px;
}

.xf-search button {
  min-width: 78px;
  border: 0;
  border-radius: 0 5px 5px 0;
  padding: 0 16px;
  background: var(--violet);
  color: #fff;
  font-weight: 900;
  white-space: nowrap;
}

.xf-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.xf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 18px;
}

.xf-main {
  display: grid;
  gap: 18px;
}

.xf-category,
.xf-thread-panel,
.xf-widget {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .08);
}

.xf-category > header,
.xf-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  background: linear-gradient(90deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
}

.xf-category h2,
.xf-panel-head h2 {
  margin: 0;
  font-size: 22px;
}

.xf-category header span,
.xf-panel-head span {
  color: rgba(255, 255, 255, .78);
  font-size: 13px;
}

.xf-node-list {
  display: grid;
}

.xf-node {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 130px;
  gap: 14px;
  align-items: center;
  padding: 15px 16px;
  border-top: 1px solid #e5e0ea;
}

.xf-node:first-child {
  border-top: 0;
}

.xf-node:hover {
  background: #faf8fc;
}

.xf-node__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 6px;
  background: linear-gradient(135deg, #56446f, #ef8f82);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.xf-node strong {
  color: var(--violet-dark);
  font-size: 18px;
}

.xf-node p {
  margin: 4px 0 8px;
  color: var(--muted);
}

.xf-subnodes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.xf-subnodes span,
.xf-subnodes a,
.xf-tags span,
.xf-trophies span {
  padding: 4px 7px;
  border-radius: 4px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.xf-subnodes a:hover {
  background: #dfd5e8;
}

.xf-node.is-selected {
  background: linear-gradient(90deg, #f4eff8, #fff4ef);
  box-shadow: inset 4px 0 var(--node-accent, var(--coral));
}

.xf-node em {
  color: var(--muted);
  font-style: normal;
  font-size: 13px;
  text-align: right;
}

.xf-filters,
.xf-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.xf-filters button,
.xf-filters a,
.xf-pagination a {
  border: 1px solid rgba(255, 255, 255, .32);
  border-radius: 4px;
  padding: 6px 9px;
  background: rgba(255, 255, 255, .14);
  color: #fff;
  font-weight: 900;
}

.xf-filters a.is-active {
  border-color: #fff;
  background: #fff;
  color: var(--violet-dark);
}

.xf-thread {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 94px 170px;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border-top: 1px solid #e5e0ea;
}

.xf-thread.is-sticky {
  background: #fff8f1;
}

.xf-thread.is-locked {
  background: #f8f7fa;
}

.xf-avatar,
.xf-author img {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(45, 38, 62, .18);
}

.xf-thread__title {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 17px;
  font-weight: 900;
}

.xf-thread__title a {
  color: var(--ink);
}

.xf-prefix {
  border-radius: 4px;
  padding: 3px 7px;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.prefix-news { background: #d95d75; }
.prefix-rp { background: #249c89; }
.prefix-media { background: #6b66b1; }

.xf-thread__body p {
  margin: 4px 0 8px;
  color: var(--muted);
  font-size: 13px;
}

.xf-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.xf-thread__stats {
  display: grid;
  justify-items: center;
  color: var(--muted);
  font-size: 12px;
}

.xf-thread__stats strong {
  color: var(--violet-dark);
  font-size: 18px;
}

.xf-lastpost {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 13px;
}

.xf-lastpost strong {
  color: var(--ink);
}

.xf-post {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.xf-author {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 7px;
  padding: 18px;
  border-right: 1px solid #e7e1eb;
  background: #f5f1f8;
  text-align: center;
}

.xf-author img {
  width: 74px;
  height: 74px;
}

.xf-author span {
  border-radius: 4px;
  padding: 4px 8px;
  background: var(--violet);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.xf-author em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.xf-message {
  padding: 18px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.xf-message header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  color: var(--muted);
}

.xf-message header strong {
  color: var(--ink);
}

.xf-message img {
  width: 100%;
  max-height: 360px;
  object-fit: cover;
  margin-top: 14px;
  border-radius: 5px;
}

.xf-reactions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.xf-reactions span {
  padding: 6px 9px;
  border-radius: 20px;
  background: #fff0eb;
  color: var(--violet-dark);
  font-size: 13px;
  font-weight: 900;
}

.xf-message footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.forum-post-body {
  overflow-wrap: anywhere;
  color: var(--ink);
  line-height: 1.65;
}

.forum-post-body blockquote {
  margin: 14px 0;
  border-left: 4px solid var(--coral);
  border-radius: 0 7px 7px 0;
  padding: 11px 13px;
  background: #f5f1f8;
  color: #51455f;
}

.forum-spoiler {
  margin: 14px 0;
  border: 1px solid #ded7e7;
  border-radius: 7px;
  background: #fbf9fd;
}

.forum-spoiler summary {
  padding: 9px 11px;
  color: var(--violet-dark);
  cursor: pointer;
  font-weight: 900;
}

.forum-spoiler div {
  border-top: 1px solid #e7e1eb;
  padding: 11px;
}

.forum-anchor {
  display: block;
  height: 0;
  scroll-margin-top: 90px;
}

.xf-message footer button,
.xf-editor__bar button {
  border: 1px solid #d8d2df;
  border-radius: 4px;
  padding: 7px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
}

.xf-editor {
  padding: 16px;
  border-top: 1px solid #e5e0ea;
}

.xf-editor__bar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}

.xf-editor textarea {
  width: 100%;
  min-height: 120px;
  resize: vertical;
  border: 1px solid #d8d2df;
  border-radius: 5px;
  padding: 12px;
}

.xf-editor input,
.xf-editor select {
  width: 100%;
  border: 1px solid #d8d2df;
  border-radius: 5px;
  padding: 10px 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.xf-editor label {
  display: grid;
  gap: 6px;
  color: var(--violet-dark);
  font-weight: 900;
}

.forum-create-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 10px;
  margin-bottom: 10px;
}

.forum-login-note {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border-top: 1px solid #e5e0ea;
  background: linear-gradient(135deg, #fff, #fff5f0);
}

.forum-login-note p {
  margin: 0;
  color: var(--muted);
}

.xf-editor > div:last-child {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

.xf-sidebar {
  display: grid;
  align-content: start;
  gap: 14px;
}

.xf-widget {
  padding: 14px;
}

.xf-widget h3 {
  margin: 0 0 10px;
  color: var(--violet-dark);
}

.xf-widget p {
  margin: 0;
  color: var(--muted);
}

.xf-online {
  display: grid;
  grid-template-columns: 12px auto 1fr;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
}

.xf-online span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #13b86b;
}

.xf-widget dl {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  margin: 0;
}

.xf-widget dt {
  color: var(--muted);
}

.xf-widget dd {
  margin: 0;
  color: var(--violet-dark);
  font-weight: 900;
}

.xf-widget a {
  display: block;
  padding: 9px 0;
  border-top: 1px solid #e5e0ea;
}

.xf-widget a:first-of-type {
  border-top: 0;
}

.xf-widget a strong,
.xf-widget a span {
  display: block;
}

.xf-widget a span {
  color: var(--muted);
  font-size: 13px;
}

.xf-trophies {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.comments-section {
  margin-top: 24px;
  padding: 18px;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgba(111, 81, 147, .32), rgba(231, 128, 112, .3)) border-box;
  box-shadow: 0 14px 32px rgba(43, 37, 58, .1);
}

.comments-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e7e1eb;
}

.comments-head h2 {
  margin: 0 0 5px;
  color: var(--ink);
  font-size: 30px;
}

.comments-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
}

.comments-stats {
  display: grid;
  gap: 7px;
  justify-items: end;
  min-width: 148px;
}

.comments-stats span,
.comments-stats strong {
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 900;
}

.comments-stats span {
  background: #eee9f3;
  color: var(--violet-dark);
}

.comments-stats strong {
  background: #fff0eb;
  color: #9a574d;
}

.comment-form {
  display: grid;
  gap: 12px;
  margin-top: 10px;
  padding: 14px;
  border: 1px solid #e1dbe8;
  border-radius: 8px;
  background: linear-gradient(135deg, #fbf9fd, #fff6f2);
}

.comment-author {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
}

.comment-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(93, 68, 128, .24);
}

.comment-author strong,
.comment-body strong {
  display: block;
  color: var(--violet-dark);
}

.comment-author p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.comment-form textarea {
  width: 100%;
  min-height: 126px;
  resize: vertical;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  line-height: 1.45;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

.comment-form textarea:focus {
  outline: 2px solid rgba(221, 128, 112, .28);
  border-color: var(--coral);
}

.comment-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.format-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.format-buttons button,
.comment-body footer button {
  border: 1px solid #d9d2e2;
  border-radius: 6px;
  padding: 7px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
  cursor: pointer;
}

.primary-button {
  border: 0;
  border-radius: 6px;
  padding: 10px 14px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(93, 68, 128, .22);
}

.secondary-button {
  border: 1px solid #d8d0e3;
  border-radius: 6px;
  padding: 10px 14px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(52, 44, 68, .08);
}

.comments-list {
  display: grid;
  gap: 12px;
}

.comment-compose {
  position: sticky;
  bottom: 14px;
  z-index: 5;
  width: min(100%, 520px);
  margin: 16px 0 0 auto;
  border-radius: 9px;
}

.comment-compose summary {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border-radius: 9px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 12px 24px rgba(93, 68, 128, .24);
  list-style: none;
}

.comment-compose summary::-webkit-details-marker {
  display: none;
}

.comment-compose[open] {
  padding: 10px;
  border: 1px solid #ded7e7;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 18px 36px rgba(43, 37, 58, .18);
}

.comment-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  border: 1px solid #e2dce8;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 9px 20px rgba(39, 35, 55, .06);
}

.comment-card--reply {
  margin-left: 46px;
  background: linear-gradient(135deg, #fff, #fbf8fd);
}

.comment-body header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.comment-body header span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.comment-body header em {
  border-radius: 999px;
  padding: 5px 8px;
  background: #f0e9f6;
  color: var(--violet-dark);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.comment-body p {
  margin: 0;
  color: #565d70;
  line-height: 1.55;
}

.comment-body footer {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.chat-shell {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) 250px;
  gap: 16px;
  align-items: start;
}

.chat-panel,
.chat-room {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.chat-panel {
  padding: 12px;
}

.chat-panel h2,
.chat-room__head h2 {
  margin: 0;
  color: var(--violet-dark);
}

.chat-panel h2 {
  margin-bottom: 10px;
  font-size: 16px;
}

.chat-panel a,
.chat-user {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  margin-top: 8px;
  padding: 9px;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.chat-panel--rooms a {
  grid-template-columns: 1fr;
}

.chat-panel a.is-active {
  border-color: #cbbdd9;
  background: linear-gradient(135deg, #f3edf8, #fff1ed);
}

.chat-panel strong,
.chat-user strong {
  display: block;
  overflow: hidden;
  color: var(--violet-dark);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-panel span,
.chat-user em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.chat-room {
  overflow: hidden;
}

.chat-room__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 15px 16px;
  border-bottom: 1px solid #e7e1eb;
  background: linear-gradient(135deg, #fff, #fff5f1);
}

.chat-room__status {
  display: flex;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  padding: 7px 10px;
  background: #eef8f2;
  color: #217a4d;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.chat-room__status span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1fc46a;
  box-shadow: 0 0 0 4px rgba(31, 196, 106, .14);
}

.chat-messages {
  display: grid;
  gap: 10px;
  max-height: 560px;
  overflow: auto;
  padding: 16px;
  background:
    linear-gradient(rgba(246, 243, 249, .72), rgba(246, 243, 249, .72)),
    url("assets/hero-palms.webp") center / cover no-repeat;
}

.chat-message,
.chat-system {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 11px;
  border: 1px solid rgba(225, 219, 232, .92);
  border-radius: 9px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 8px 18px rgba(43, 37, 58, .08);
}

.chat-message--admin {
  border-color: #d9c7ea;
  background: linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(243, 237, 248, .96));
}

.chat-avatar,
.chat-system__icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.chat-avatar--muted {
  position: relative;
  filter: saturate(.72);
}

.chat-avatar--muted::after {
  content: "LOCK";
  position: absolute;
  right: -8px;
  bottom: -6px;
  border: 2px solid #fff;
  border-radius: 999px;
  padding: 2px 4px;
  background: #201b2c;
  color: #fff;
  font-size: 7px;
  line-height: 1;
}

.chat-message header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 5px;
}

.chat-message header strong {
  color: var(--violet-dark);
}

.chat-message time {
  color: var(--muted);
  font-size: 12px;
}

.chat-message p,
.chat-system p {
  margin: 0;
  color: #52596b;
  line-height: 1.45;
}

.chat-message p {
  white-space: pre-wrap;
}

.chat-system--moderation {
  grid-template-columns: 52px minmax(0, 1fr);
  border-color: #f0b0a7;
  background: linear-gradient(135deg, #fff6f2, #fff);
}

.chat-system__icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: linear-gradient(135deg, #a64552, #e27d72);
  font-size: 10px;
}

.chat-system strong {
  display: block;
  margin-bottom: 4px;
  color: #8c3844;
}

.chat-system em {
  display: block;
  margin-top: 7px;
  color: #9a574d;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
}

.mute-chip {
  display: inline-flex;
  margin-left: 5px;
  border-radius: 999px;
  padding: 2px 6px;
  background: #fff0eb;
  color: #9a574d;
  font-size: 10px;
  vertical-align: middle;
}

.muted-text {
  color: #8c8495 !important;
  font-style: italic;
}

.chat-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
  padding: 12px;
  border-top: 1px solid #e7e1eb;
  background: #fff;
}

.chat-composer input {
  min-height: 42px;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 0 12px;
  font: inherit;
}

.chat-composer button {
  border: 0;
  border-radius: 7px;
  padding: 0 14px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.dm-preview {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #e7e1eb;
}

.system-contact {
  border-color: #d7c4e6 !important;
  background: linear-gradient(135deg, #f2ecf8, #fff4ef) !important;
}

.system-contact > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 9px;
  background: #201b2c;
  color: #fff;
  font-weight: 900;
}

.chat-admin-note {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #e7e1eb;
}

.chat-admin-note p {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.chat-admin-note a {
  display: block;
  grid-template-columns: 1fr;
  margin-top: 0;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  text-align: center;
}

.messages-shell {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: start;
}

.messages-list,
.message-dialog,
.messages-info {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.messages-list,
.messages-info {
  padding: 12px;
}

.messages-list header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.messages-list h2,
.messages-info h2,
.message-dialog__head h2 {
  margin: 0;
  color: var(--violet-dark);
}

.messages-list button {
  border: 0;
  border-radius: 6px;
  padding: 7px 9px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-weight: 900;
}

.message-thread {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.message-thread.is-active {
  border-color: #cbbdd9;
  background: linear-gradient(135deg, #f4edf8, #fff4ef);
}

.message-thread > span,
.system-badge {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.message-thread--system > span,
.system-badge {
  background: #201b2c;
}

.message-thread strong,
.message-thread p {
  display: block;
  overflow: hidden;
  margin: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.message-thread strong {
  color: var(--violet-dark);
}

.message-thread p,
.message-thread em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.message-dialog {
  overflow: hidden;
}

.message-dialog__head {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 16px;
  border-bottom: 1px solid #e7e1eb;
  background: linear-gradient(135deg, #fff, #fff5f1);
}

.message-dialog__head span {
  color: var(--muted);
  font-size: 13px;
}

.message-stream {
  display: grid;
  gap: 12px;
  padding: 16px;
  background: #f6f3f9;
}

.message-bubble {
  max-width: 76%;
  border: 1px solid #e2dce8;
  border-radius: 10px;
  padding: 12px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(43, 37, 58, .07);
}

.message-bubble--system,
.message-bubble--admin {
  border-color: #d7c4e6;
  background: linear-gradient(135deg, #fff, #fbf4ff);
}

.message-bubble--admin {
  margin-left: auto;
  border-color: #f0b0a7;
  background: linear-gradient(135deg, #fff6f2, #fff);
}

.message-bubble strong {
  display: block;
  margin-bottom: 5px;
  color: var(--violet-dark);
}

.message-bubble p {
  margin: 0;
  color: #565d70;
  line-height: 1.45;
}

.message-bubble time {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
}

.message-locked {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-top: 1px solid #e7e1eb;
  background: #fff;
}

.message-locked strong {
  color: var(--violet-dark);
}

.message-locked p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.message-locked button {
  border: 0;
  border-radius: 7px;
  padding: 9px 12px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.messages-info {
  display: grid;
  gap: 10px;
}

.messages-info div {
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 10px;
  background: #fbf9fd;
}

.messages-info strong {
  display: block;
  color: var(--violet-dark);
}

.messages-info p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.thread-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  padding: 22px;
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(255, 245, 241, .96)),
    url("assets/islands.webp") center / cover no-repeat;
  box-shadow: 0 12px 28px rgba(43, 37, 58, .1);
}

.thread-hero--rp {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(244, 237, 248, .96)),
    url("assets/partner-search.webp") center / cover no-repeat;
}

.thread-hero--locked {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(242, 239, 245, .97)),
    url("assets/neon-car.webp") center / cover no-repeat;
}

.thread-hero h1 {
  max-width: 840px;
  margin: 10px 0 8px;
  color: var(--ink);
  font-size: 34px;
  line-height: 1.08;
}

.thread-hero p {
  max-width: 760px;
  margin: 0;
  color: #52596b;
}

.thread-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.thread-meta span,
.locked-button {
  border-radius: 999px;
  padding: 7px 10px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.locked-button {
  background: #201b2c;
  color: #fff;
  white-space: nowrap;
}

.thread-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 18px;
  align-items: start;
}

.thread-posts {
  display: grid;
  gap: 14px;
}

.thread-post {
  margin: 0;
}

.thread-post .xf-message {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgba(111, 81, 147, .18), rgba(231, 128, 112, .16)) border-box;
}

.thread-post .xf-message header {
  margin: -18px -18px 14px;
  padding: 14px 18px;
  border-bottom: 1px solid #e9e3ec;
  background: linear-gradient(90deg, #fbf9fd, #fff5f1);
}

.author-card {
  background: linear-gradient(180deg, #fff, #fbf8fd);
}

.author-card--admin {
  border-color: #e6b3aa;
  background: linear-gradient(180deg, #fff7f3, #fff);
}

.author-card--wiki {
  border-color: #d4c2e4;
}

.author-card--new {
  border-color: #cde5d6;
}

.author-card--muted {
  filter: saturate(.78);
}

.author-awards,
.profile-awards {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}

.author-awards b,
.profile-awards b {
  border-radius: 999px;
  padding: 4px 7px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 10px;
}

.thread-callout,
.thread-locked-note {
  margin-top: 12px;
  border: 1px solid #e8d6d2;
  border-radius: 8px;
  padding: 12px;
  background: #fff6f2;
}

.thread-callout strong,
.thread-locked-note strong {
  display: block;
  margin-bottom: 4px;
  color: var(--violet-dark);
}

.thread-requirements {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}

.thread-requirements span {
  border-radius: 999px;
  padding: 6px 9px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.mod-warning {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid #efb2a8;
  border-radius: 9px;
  padding: 13px;
  background: linear-gradient(135deg, #fff5f1, #fff);
  box-shadow: 0 8px 18px rgba(43, 37, 58, .07);
}

.mod-warning--soft {
  border-color: #d9c7ea;
  background: linear-gradient(135deg, #f5f0fa, #fff);
}

.mod-warning--closed {
  border-color: #c9c2d2;
  background: linear-gradient(135deg, #f3f1f6, #fff);
}

.mod-warning > span {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: linear-gradient(135deg, #a64552, #e27d72);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.mod-warning strong {
  display: block;
  margin-bottom: 4px;
  color: #8c3844;
}

.mod-warning p,
.thread-locked-note p {
  margin: 0;
  color: #605768;
  line-height: 1.45;
}

.thread-locked-note {
  display: grid;
  gap: 8px;
  background: #f7f4fa;
}

.profile-type-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.profile-type {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 15px;
  overflow: hidden;
  border: 1px solid #ded7e7;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.profile-type img {
  width: 100%;
  height: 100%;
  min-height: 190px;
  object-fit: cover;
}

.profile-type > div {
  padding: 16px 16px 16px 0;
}

.profile-role {
  display: inline-flex;
  border-radius: 999px;
  padding: 5px 9px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.profile-type h2 {
  margin: 9px 0 6px;
  color: var(--ink);
  font-size: 28px;
}

.profile-type p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.profile-score {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 12px;
}

.profile-score strong {
  color: var(--violet-dark);
  font-size: 26px;
}

.profile-score span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.profile-type--admin {
  border-color: #e6b3aa;
}

.profile-type--wiki {
  border-color: #d4c2e4;
}

.profile-type--warned {
  border-color: #efb2a8;
  background: linear-gradient(135deg, #fff, #fff5f1);
}

.module-launchpad {
  margin: 8px 0 30px;
  padding: 18px;
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background: linear-gradient(135deg, #fff, #fff5f1);
  box-shadow: 0 12px 28px rgba(43, 37, 58, .08);
}

.home-ecosystem {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.35fr);
  gap: 16px;
  margin: 8px 0 30px;
  align-items: stretch;
}

.home-ecosystem__intro,
.home-step,
.section-guide article {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background:
    radial-gradient(circle at 0 0, rgba(233, 129, 116, .13), transparent 34%),
    linear-gradient(135deg, #fff, #fffafd);
  box-shadow: 0 12px 28px rgba(43, 37, 58, .07);
}

.home-ecosystem__intro {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 20px;
}

.home-ecosystem__intro h2 {
  margin: 0;
  color: var(--ink);
  font-size: 28px;
  line-height: 1.08;
}

.home-ecosystem__intro p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.home-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}

.home-points span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #eadde8;
  border-radius: 999px;
  padding: 7px 9px;
  background: #fff;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.home-points strong {
  color: var(--coral);
}

.home-shell {
  margin-top: 18px;
}

.home-shell .content {
  display: grid;
  gap: 18px;
}

.home-shell .sub-hero {
  min-height: 230px;
}

.home-alert {
  margin-bottom: 0;
}

.site-alert--warning {
  background:
    linear-gradient(135deg, rgba(255, 250, 242, .96), rgba(255, 239, 232, .98)),
    linear-gradient(90deg, #7b5f35, var(--coral));
}

.site-alert--warning span {
  background: #5d4324;
}

.site-alert--event {
  background:
    linear-gradient(135deg, rgba(250, 247, 255, .96), rgba(255, 244, 250, .98)),
    linear-gradient(90deg, #51436d, #df5ba7);
}

.site-alert--event span {
  background: #3d315a;
}

.home-ecosystem__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.home-step {
  position: relative;
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 164px;
  padding: 16px;
  overflow: hidden;
}

.home-step::after {
  content: "";
  position: absolute;
  inset: auto -26px -34px auto;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(114, 84, 139, .14), rgba(233, 129, 116, .16));
}

.home-step:hover {
  transform: translateY(-2px);
  border-color: #d5c6e4;
}

.home-step > span {
  width: 38px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.home-step strong {
  position: relative;
  z-index: 1;
  color: var(--violet-dark);
  font-size: 18px;
  line-height: 1.16;
}

.home-step p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: var(--muted);
  line-height: 1.42;
}

.module-launchpad__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.module-launchpad__head h2 {
  margin: 0 0 5px;
  color: var(--ink);
  font-size: 30px;
}

.module-launchpad__head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
}

.module-launchpad__head > a,
.activity-actions a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 9px 14px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  white-space: nowrap;
  text-align: center;
}

.module-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.module-card {
  position: relative;
  min-height: 180px;
  overflow: hidden;
  border: 1px solid #d8d1e1;
  border-radius: 8px;
  background: #201b2c;
  color: #fff;
}

.module-card--wide {
  grid-column: span 2;
}

.module-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .72;
  transition: transform .25s ease;
}

.module-card:hover img {
  transform: scale(1.04);
}

.module-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(32, 27, 44, .12), rgba(32, 27, 44, .88));
}

.module-card div {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  z-index: 1;
}

.module-card span {
  display: inline-flex;
  margin-bottom: 7px;
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(255, 255, 255, .18);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.module-card strong {
  display: block;
  font-size: 20px;
}

.module-card p {
  margin: 5px 0 0;
  color: rgba(255, 255, 255, .86);
  font-size: 13px;
  line-height: 1.35;
}

.home-live-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.home-live-card {
  display: grid;
  align-content: start;
  gap: 10px;
  border: 1px solid #ded7e7;
  border-radius: 10px;
  padding: 15px;
  background:
    radial-gradient(circle at 0 0, rgba(221, 128, 112, .11), transparent 38%),
    #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .07);
}

.home-live-card > a {
  display: grid;
  gap: 3px;
  border: 1px solid #e7e1eb;
  border-radius: 8px;
  padding: 10px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.home-live-card > a:hover {
  border-color: #d6c8e5;
  transform: translateY(-1px);
}

.home-live-card strong {
  color: var(--violet-dark);
  font-size: 15px;
}

.home-live-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.public-section-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
  margin-bottom: 16px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(135deg, #fff, #fff5f0);
  box-shadow: 0 12px 30px rgba(45, 39, 62, .08);
}

.catalog-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) repeat(4, minmax(130px, .8fr)) auto;
  gap: 12px;
  align-items: end;
  margin: 0 0 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(45, 39, 62, .07);
}

.catalog-toolbar label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.catalog-toolbar label > span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.catalog-toolbar input,
.catalog-toolbar select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #dcd4e4;
  border-radius: 8px;
  padding: 9px 11px;
  background: #fbfafc;
  color: var(--violet-dark);
  font: inherit;
}

.catalog-toolbar input:focus,
.catalog-toolbar select:focus {
  border-color: var(--coral);
  outline: 3px solid rgba(221, 128, 112, .14);
}

.catalog-toolbar__actions {
  display: flex;
  gap: 8px;
  align-items: center;
  min-height: 42px;
}

.catalog-toolbar__actions button,
.catalog-toolbar__actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 0;
  border-radius: 8px;
  padding: 9px 14px;
  background: var(--violet-dark);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.catalog-toolbar__actions a {
  border: 1px solid #ddd5e5;
  background: #fff;
  color: var(--violet-dark);
}

@media (max-width: 1100px) {
  .catalog-toolbar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .catalog-toolbar__search {
    grid-column: span 2;
  }
}

@media (max-width: 620px) {
  .catalog-toolbar {
    grid-template-columns: 1fr;
    padding: 13px;
  }

  .catalog-toolbar__search {
    grid-column: auto;
  }

  .catalog-toolbar__actions {
    justify-content: stretch;
  }

  .catalog-toolbar__actions button,
  .catalog-toolbar__actions a {
    flex: 1;
  }
}

.section-guide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 16px;
}

.section-guide article {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  min-height: 132px;
}

.section-guide span {
  width: 38px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.section-guide strong {
  display: block;
  margin-bottom: 6px;
  color: var(--violet-dark);
  font-size: 16px;
  line-height: 1.18;
}

.section-guide p {
  margin: 0;
  color: var(--muted);
  line-height: 1.42;
}

.section-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: -4px 0 16px;
}

.section-actions a {
  display: grid;
  gap: 3px;
  border: 1px solid #ded7e7;
  border-radius: 9px;
  padding: 12px 14px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
  box-shadow: 0 8px 20px rgba(43, 37, 58, .06);
}

.section-actions a:hover {
  transform: translateY(-1px);
  border-color: #d3c6e1;
}

.section-actions strong {
  color: var(--violet-dark);
  font-size: 15px;
}

.section-actions span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.public-section-head h2 {
  margin: 0;
  color: var(--ink);
  font-size: 28px;
}

.public-section-head a,
.public-empty a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 10px 15px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  box-shadow: 0 12px 24px rgba(210, 116, 111, .22);
}

.public-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.public-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 100%;
  overflow: hidden;
  border: 1px solid #d8d1e1;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 30px rgba(45, 39, 62, .08);
}

.public-card__image {
  position: relative;
  display: block;
  height: 180px;
  overflow: hidden;
  color: #fff;
}

.public-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}

.public-card:hover .public-card__image img {
  transform: scale(1.04);
}

.public-card__image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(32, 27, 44, .02), rgba(32, 27, 44, .72));
}

.public-card__image span {
  position: absolute;
  left: 12px;
  bottom: 12px;
  z-index: 1;
  border-radius: 999px;
  padding: 6px 10px;
  background: linear-gradient(135deg, rgba(112, 82, 136, .95), rgba(233, 129, 116, .95));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.public-card__body {
  padding: 16px 16px 8px;
}

.public-card__body h3 {
  margin: 0 0 8px;
  color: var(--violet-dark);
  font-size: 21px;
  line-height: 1.15;
}

.public-card__body h3 a {
  color: inherit;
}

.public-card__body p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.public-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 52px;
  padding: 12px 16px 15px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.public-empty {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px dashed #d8cde1;
  border-radius: 8px;
  background: #fff;
}

.public-empty img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border-radius: 7px;
}

.public-empty h2 {
  margin: 0 0 8px;
  color: var(--ink);
}

.public-empty p {
  margin: 0 0 14px;
  color: var(--muted);
}

.public-article {
  display: grid;
  gap: 18px;
}

.public-article__hero {
  position: relative;
  overflow: hidden;
  min-height: 380px;
  display: grid;
  align-items: end;
  border-radius: 8px;
  color: #fff;
  box-shadow: var(--shadow);
}

.public-article__hero img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.public-article__hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(32, 27, 44, .9), rgba(79, 55, 103, .62), rgba(232, 128, 117, .22));
}

.public-article__hero > div {
  position: relative;
  z-index: 1;
  max-width: 840px;
  padding: 34px;
}

.public-article__hero h1 {
  margin: 0 0 12px;
  font-size: 48px;
  line-height: 1.02;
}

.public-article__hero p:not(.eyebrow) {
  color: rgba(255, 255, 255, .86);
  font-size: 18px;
}

.public-article__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 18px;
  align-items: start;
}

.public-article__main {
  display: grid;
  gap: 18px;
}

.public-article__body {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.7;
  box-shadow: 0 12px 30px rgba(45, 39, 62, .07);
}

.public-article__body p:first-child {
  margin-top: 0;
}

.public-article__aside {
  display: grid;
  gap: 14px;
  position: sticky;
  top: 78px;
}

.public-article__aside .admin-button {
  width: 100%;
  margin-top: 8px;
}

.file-download-panel {
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgba(111, 81, 147, .3), rgba(231, 128, 112, .32)) border-box;
  box-shadow: 0 12px 28px rgba(45, 39, 62, .08);
}

.file-version-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, #fbf9fd, #fff5f0);
}

.file-version-card strong,
.file-version-card p,
.file-version-card em {
  display: block;
}

.file-version-card strong {
  color: var(--violet-dark);
}

.file-version-card p,
.file-version-card em {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.activity-dashboard {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) repeat(3, minmax(0, .65fr));
  gap: 14px;
}

.activity-spotlight,
.activity-card,
.activity-feed-board,
.activity-widget,
.quest-pass,
.quest-card,
.map-sidebar,
.crew-card,
.crew-recruit,
.notify-item,
.notify-settings,
.moderation-summary article,
.moderation-log,
.moderation-rules {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.activity-spotlight {
  padding: 20px;
  background: linear-gradient(135deg, #fff, #fff5f1);
}

.activity-spotlight > span,
.quest-pass span,
.quest-card > span,
.map-sidebar article span,
.crew-card span {
  display: inline-flex;
  border-radius: 999px;
  padding: 5px 9px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.activity-spotlight h2,
.quest-pass h2,
.crew-card h2 {
  margin: 10px 0 7px;
  color: var(--ink);
  font-size: 28px;
}

.activity-spotlight p,
.activity-card p,
.quest-pass p,
.quest-card p,
.map-sidebar p,
.crew-card p,
.crew-recruit p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.progress-line {
  overflow: hidden;
  height: 9px;
  margin-top: 14px;
  border-radius: 999px;
  background: #eee9f3;
}

.progress-line i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--violet), var(--coral));
}

.activity-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.activity-card {
  display: grid;
  align-content: center;
  padding: 16px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.activity-card h2 {
  margin: 0;
  color: var(--violet-dark);
  font-size: 15px;
}

.activity-card strong {
  margin-top: 8px;
  color: var(--ink);
  font-size: 34px;
}

.activity-layout,
.notify-layout,
.moderation-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  align-items: start;
}

.activity-feed-board,
.moderation-log {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.activity-feed-board article,
.mod-log-item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 11px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.feed-icon,
.mod-log-item > span {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.activity-feed-board strong,
.activity-widget strong,
.mod-log-item strong {
  display: block;
  color: var(--violet-dark);
}

.activity-feed-board p,
.activity-feed-board em,
.activity-widget span,
.mod-log-item p,
.mod-log-item em {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.activity-side,
.activity-widget,
.notify-settings,
.moderation-rules {
  display: grid;
  gap: 10px;
}

.activity-widget,
.notify-settings,
.moderation-rules {
  padding: 14px;
}

.activity-widget h2,
.notify-settings h2,
.moderation-rules h2 {
  margin: 0;
  color: var(--violet-dark);
  font-size: 18px;
}

.activity-widget a,
.mini-rank {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 9px;
  background: #fbf9fd;
}

.mini-rank {
  grid-template-columns: 28px minmax(0, 1fr) auto;
}

.mini-rank b {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #eee9f3;
  color: var(--violet-dark);
}

.quest-pass {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px;
  gap: 16px;
  padding: 20px;
  background: linear-gradient(135deg, #fff, #fff5f1);
}

.quest-level {
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
}

.quest-level strong {
  font-size: 34px;
}

.quest-level span {
  background: transparent;
  color: #fff;
}

.quest-pass .progress-line {
  grid-column: 1 / -1;
  margin-top: 0;
}

.quest-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.quest-card {
  padding: 15px;
}

.quest-card h2 {
  margin: 10px 0 7px;
  color: var(--ink);
  font-size: 19px;
}

.quest-card strong {
  display: inline-flex;
  margin-top: 13px;
  border-radius: 999px;
  padding: 7px 10px;
  background: #fff0eb;
  color: #9a574d;
}

.quest-card.is-done {
  border-color: #cfe5d5;
  background: linear-gradient(135deg, #f4fff7, #fff);
}

.reward-track {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.track-step {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  padding: 12px;
  background: #fff;
}

.track-step b {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #eee9f3;
  color: var(--violet-dark);
}

.track-step strong,
.track-step span {
  display: block;
  margin-top: 8px;
}

.track-step span {
  color: var(--muted);
  font-size: 12px;
}

.track-step.is-current {
  border-color: #e6b3aa;
  background: #fff5f1;
}

.map-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  align-items: start;
}

.map-board {
  position: relative;
  overflow: hidden;
  min-height: 560px;
  border: 1px solid #ded7e7;
  border-radius: 10px;
  background: #201b2c;
  box-shadow: 0 12px 28px rgba(43, 37, 58, .1);
}

.map-board img {
  width: 100%;
  height: 560px;
  object-fit: cover;
  opacity: .92;
}

.map-pin {
  position: absolute;
  border: 0;
  border-radius: 999px;
  padding: 8px 10px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  box-shadow: 0 10px 20px rgba(32, 27, 44, .28);
}

.map-pin--one { left: 43%; top: 42%; }
.map-pin--two { left: 68%; top: 33%; }
.map-pin--three { left: 25%; top: 68%; }
.map-pin--four { left: 57%; top: 61%; }

.map-sidebar {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.map-sidebar h2 {
  margin: 0;
  color: var(--violet-dark);
}

.map-sidebar article {
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 10px;
  background: #fbf9fd;
}

.crew-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.crew-card {
  overflow: hidden;
}

.crew-card--feature {
  grid-column: span 3;
  display: grid;
  grid-template-columns: 45% minmax(0, 1fr);
}

.crew-card img {
  width: 100%;
  height: 190px;
  object-fit: cover;
}

.crew-card--feature img {
  height: 260px;
}

.crew-card div {
  padding: 15px;
}

.crew-card strong {
  display: inline-flex;
  margin-top: 12px;
  border-radius: 999px;
  padding: 7px 10px;
  background: #eee9f3;
  color: var(--violet-dark);
}

.crew-recruit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
}

.crew-recruit h2 {
  margin: 0 0 5px;
  color: var(--violet-dark);
}

.notify-layout {
  grid-template-columns: minmax(0, 1fr) 280px;
}

.notify-list {
  display: grid;
  gap: 12px;
}

.notify-item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
}

.notify-item > span {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.notify-item--system > span {
  background: #201b2c;
}

.notify-item--warning {
  border-color: #efb2a8;
  background: #fff5f1;
}

.notify-item strong,
.notify-item p,
.notify-item em {
  display: block;
  margin: 0;
}

.notify-item strong {
  color: var(--violet-dark);
}

.notify-item p,
.notify-item em {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.notify-item a,
.mod-log-item button,
.moderation-rules a {
  border: 0;
  border-radius: 7px;
  padding: 8px 10px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-weight: 900;
}

.notify-settings label {
  display: flex;
  gap: 8px;
  align-items: center;
  color: #565d70;
  font-weight: 800;
}

.moderation-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.moderation-summary article {
  padding: 15px;
}

.moderation-summary span {
  color: var(--ink);
  font-size: 28px;
  font-weight: 900;
}

.moderation-summary strong {
  display: block;
  margin-top: 6px;
  color: var(--violet-dark);
}

.moderation-summary p,
.moderation-rules p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.mod-log-item--warning {
  border-color: #efb2a8;
  background: #fff5f1;
}

.mod-log-item--mute {
  border-color: #d7c4e6;
  background: #f6f1fa;
}

.moderation-rules a {
  display: block;
  text-align: center;
}

.admin-body {
  background: #efedf3;
}

.admin-shell {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  min-height: 100vh;
}

.admin-sidebar {
  position: sticky;
  top: 0;
  align-self: start;
  display: grid;
  gap: 22px;
  min-height: 100vh;
  padding: 20px 16px;
  background: linear-gradient(180deg, #302842, #5a4771 58%, #9d6f98);
  color: #fff;
}

.admin-sidebar .brand {
  font-size: 25px;
}

.admin-sidebar nav {
  display: grid;
  gap: 8px;
}

.admin-sidebar nav a {
  border-radius: 8px;
  padding: 10px 11px;
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .88);
  font-weight: 900;
}

.admin-sidebar nav a.is-active,
.admin-sidebar nav a:hover {
  background: rgba(255, 255, 255, .18);
  color: #fff;
}

.admin-logout {
  display: grid;
  gap: 8px;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .18);
}

.admin-logout strong {
  color: #fff;
}

.admin-logout button {
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 8px;
  padding: 9px 10px;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

.admin-flash {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  padding: 12px 14px;
  background: #fff;
  color: var(--violet-dark);
  box-shadow: 0 8px 18px rgba(43, 37, 58, .07);
  font-weight: 800;
}

.admin-flash--success {
  border-color: #b9dfcb;
  background: #f0fbf4;
  color: #245c3e;
}

.admin-flash--error {
  border-color: #efb2a8;
  background: #fff5f1;
  color: #8a342b;
}

.public-flash-stack {
  display: grid;
  gap: 10px;
  width: min(100% - 32px, 1180px);
  margin: 18px auto -2px;
}

.admin-main {
  display: grid;
  gap: 18px;
  padding: 22px;
}

.admin-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border: 1px solid #ded7e7;
  border-radius: 10px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.admin-topline h1 {
  margin: 0;
  color: var(--ink);
  font-size: 32px;
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.admin-actions button,
.admin-row button,
.admin-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 7px;
  padding: 9px 11px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  line-height: 1.2;
  cursor: pointer;
}

.admin-button--ghost {
  border: 1px solid #d8d1e1;
  background: #fff;
  color: var(--violet-dark);
}

.admin-button--inline {
  justify-self: start;
}

.admin-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.admin-metrics article,
.admin-panel {
  border: 1px solid #ded7e7;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .08);
}

.admin-metrics article {
  padding: 16px;
}

.admin-metrics span {
  display: block;
  color: var(--ink);
  font-size: 32px;
  font-weight: 900;
}

.admin-metrics strong {
  display: block;
  color: var(--violet-dark);
}

.admin-metrics p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.admin-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.admin-panel {
  display: grid;
  gap: 10px;
  padding: 15px;
}

.admin-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 10px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.admin-row--compact {
  grid-template-columns: 52px minmax(0, 1fr);
}

.admin-row > span {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--violet-dark), var(--violet), var(--coral));
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.admin-row strong,
.admin-toggle strong {
  display: block;
  color: var(--violet-dark);
}

.admin-row p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.admin-quick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-quick-grid a {
  display: grid;
  gap: 4px;
  min-height: 92px;
  align-content: end;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  padding: 14px;
  background: linear-gradient(135deg, #fff, #fff4ef);
}

.admin-quick-grid strong {
  color: var(--violet-dark);
  font-size: 18px;
}

.admin-quick-grid span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.admin-toggle,
.admin-checklist span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 10px;
  background: #fbf9fd;
}

.admin-toggle span,
.admin-checklist span::after {
  border-radius: 999px;
  padding: 5px 8px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.seo-health {
  display: grid;
  place-items: center;
  min-height: 140px;
  border-radius: 10px;
  background: radial-gradient(circle, #fff5f1, #f3edf8);
  text-align: center;
}

.seo-health strong {
  color: var(--ink);
  font-size: 48px;
}

.seo-health span {
  color: var(--muted);
  font-weight: 900;
}

.seo-mini-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.seo-mini-stats span {
  border: 1px solid #e5ddea;
  border-radius: 8px;
  padding: 10px;
  background: #fbf9fd;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.seo-mini-stats strong {
  display: block;
  color: var(--violet-dark);
  font-size: 20px;
}

.admin-table {
  display: grid;
  gap: 8px;
}

.admin-table__head,
.admin-table article {
  display: grid;
  grid-template-columns: minmax(220px, 1.45fr) minmax(140px, .8fr) minmax(180px, 1fr) minmax(170px, auto);
  gap: 12px;
  align-items: center;
}

.admin-table__head {
  padding: 0 12px 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.admin-table article {
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 12px;
  background:
    linear-gradient(90deg, rgba(105, 78, 139, .055), transparent 44%),
    #fff;
}

.admin-table article strong {
  color: var(--violet-dark);
}

.admin-table article p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.seo-tags,
.admin-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.seo-tags span {
  border-radius: 999px;
  padding: 5px 8px;
  background: #f2edf7;
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 900;
}

.admin-table-actions {
  justify-content: flex-end;
}

.permissions-panel {
  gap: 18px;
}

.permissions-note {
  display: grid;
  gap: 4px;
  border: 1px solid #efd5cf;
  border-left: 4px solid var(--coral);
  border-radius: 8px;
  padding: 13px 14px;
  background: linear-gradient(135deg, #fff8f5, #f7f0fb);
  color: var(--muted);
}

.permissions-note strong {
  color: var(--violet-dark);
}

.permissions-group {
  display: grid;
  gap: 10px;
}

.permissions-group h2 {
  margin: 0;
  color: var(--ink);
  font-size: 22px;
}

.permissions-table {
  display: grid;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.permissions-row {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) repeat(4, minmax(112px, 132px));
  gap: 10px;
  align-items: center;
  min-width: 760px;
  border: 1px solid #e4ddea;
  border-radius: 9px;
  padding: 11px;
  background:
    linear-gradient(90deg, rgba(105, 78, 139, .06), transparent 42%),
    #fff;
}

.permissions-row--head {
  border: 0;
  padding: 0 11px;
  background: transparent;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.permissions-row strong {
  display: block;
  color: var(--violet-dark);
}

.permissions-row p {
  margin: 4px 0 7px;
  color: var(--muted);
  font-size: 13px;
}

.permissions-row code {
  border-radius: 999px;
  padding: 4px 7px;
  background: #f1edf6;
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 900;
}

.permission-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid #ddd4e7;
  border-radius: 999px;
  padding: 8px 10px;
  background: #fbf9fd;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.permission-check input {
  width: 16px;
  height: 16px;
  accent-color: var(--violet);
}

.permission-check--locked {
  background: #fff4ef;
  color: #7a4f47;
}

.report-board {
  display: grid;
  gap: 14px;
}

.report-list {
  display: grid;
  gap: 12px;
}

.report-card {
  display: grid;
  gap: 12px;
  border: 1px solid #e3dfea;
  border-left: 4px solid var(--violet);
  border-radius: 8px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(105, 78, 139, .055), rgba(221, 128, 112, .04)),
    #fff;
}

.report-card--new {
  border-left-color: var(--coral);
}

.report-card--resolved {
  border-left-color: #35a66a;
}

.report-card--rejected {
  border-left-color: #9a91a8;
}

.report-card header,
.report-resolution {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.report-card h3 {
  margin: 8px 0 4px;
  color: var(--violet-dark);
}

.report-card p,
.report-card footer {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.report-card blockquote {
  margin: 0;
  border-radius: 8px;
  padding: 12px;
  background: #fbf7f4;
  color: var(--ink);
}

.report-resolution {
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: end;
}

.report-resolution label {
  display: grid;
  gap: 6px;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.report-resolution select,
.report-resolution textarea {
  width: 100%;
  border: 1px solid #ded7e7;
  border-radius: 7px;
  padding: 9px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.report-mini,
.report-inline {
  position: relative;
}

.report-mini summary,
.report-inline summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ded7e7;
  border-radius: 6px;
  padding: 8px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.report-mini summary::-webkit-details-marker,
.report-inline summary::-webkit-details-marker {
  display: none;
}

.report-mini form,
.report-inline form {
  display: grid;
  gap: 8px;
  min-width: min(280px, 86vw);
  margin-top: 8px;
  border: 1px solid #ded7e7;
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  box-shadow: 0 14px 30px rgba(43, 37, 58, .16);
}

.report-inline form {
  position: absolute;
  z-index: 20;
}

.report-inline--topic form {
  right: 0;
}

.report-mini select,
.report-mini textarea,
.report-inline select,
.report-inline input {
  border: 1px solid #ded7e7;
  border-radius: 6px;
  padding: 8px;
  font: inherit;
}

.report-inline button,
.report-mini button {
  border: 0;
  border-radius: 6px;
  padding: 8px 10px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

.log-file-list,
.log-list {
  display: grid;
  gap: 9px;
}

.log-file-list article,
.log-row {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 10px;
  background: #fbf9fd;
}

.log-file-list article {
  grid-template-columns: minmax(0, 1fr) auto;
}

.log-file-list p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.log-row > span {
  display: grid;
  place-items: center;
  border-radius: 8px;
  padding: 8px;
  background: #eee9f3;
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 900;
}

.log-row--error > span {
  background: #fff0ec;
  color: #8a342b;
}

.log-row--warning > span {
  background: #fff3df;
  color: #8a5620;
}

.log-row strong {
  color: var(--violet-dark);
}

.log-row p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.log-row code {
  display: block;
  overflow-wrap: anywhere;
  margin-top: 8px;
  border-radius: 6px;
  padding: 8px;
  background: #fff;
  color: #574762;
  font-size: 12px;
}

.admin-checklist {
  display: grid;
  gap: 8px;
}

.admin-checklist span::after {
  content: "OK";
}

.modules-editor {
  gap: 12px;
}

.module-editor-row {
  display: grid;
  grid-template-columns: minmax(190px, 1.35fr) repeat(3, minmax(128px, .75fr)) 118px;
  gap: 10px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 12px;
  background:
    linear-gradient(90deg, rgba(105, 78, 139, .08), transparent 34%),
    #fbf9fd;
}

.module-editor-row strong {
  display: block;
  color: var(--violet-dark);
  font-size: 15px;
}

.module-editor-row p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.module-editor-row label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  border-radius: 7px;
  padding: 8px 10px;
  background: #fff;
  color: #574762;
  font-size: 13px;
  font-weight: 900;
}

.module-editor-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--violet);
}

.sort-field {
  justify-content: space-between;
}

.sort-field input {
  width: 56px;
  min-height: 28px;
  border: 1px solid #d8d1e1;
  border-radius: 6px;
  padding: 0 6px;
  color: var(--ink);
  font-weight: 900;
}

.install-form {
  display: grid;
  gap: 16px;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.form-grid label {
  display: grid;
  gap: 6px;
  color: var(--violet-dark);
  font-weight: 900;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 10px 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.form-grid textarea {
  resize: vertical;
  line-height: 1.55;
}

.admin-form {
  align-content: start;
}

.admin-form label {
  display: grid;
  gap: 7px;
  color: var(--violet-dark);
  font-weight: 900;
}

.admin-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-form input,
.admin-form select,
.admin-form textarea {
  width: 100%;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 10px 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.admin-form input,
.admin-form select {
  min-height: 42px;
}

.admin-form textarea {
  resize: vertical;
  line-height: 1.55;
}

.empty-state {
  border: 1px dashed #d8d1e1;
  border-radius: 9px;
  padding: 14px;
  background: #fbf9fd;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus,
.admin-form input:focus,
.admin-form select:focus,
.admin-form textarea:focus {
  outline: 2px solid rgba(221, 128, 112, .25);
  border-color: var(--coral);
}

.form-grid--single {
  grid-template-columns: 1fr;
}

.auth-shell {
  display: grid;
  place-items: center;
  min-height: calc(100vh - 120px);
}

.auth-card {
  width: min(100%, 460px);
  border: 1px solid #ded7e7;
  border-radius: 10px;
  padding: 22px;
  background: linear-gradient(135deg, #fff, #fff5f1);
  box-shadow: 0 16px 34px rgba(43, 37, 58, .12);
}

.auth-card h1 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 32px;
}

.auth-card p:not(.eyebrow) {
  margin: 0 0 16px;
  color: var(--muted);
}

.auth-errors {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}

.auth-errors span {
  border: 1px solid #efb2a8;
  border-radius: 7px;
  padding: 9px 10px;
  background: #fff5f1;
  color: #8c3844;
  font-weight: 900;
}

.auth-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 14% 18%, rgba(33, 183, 166, .14), transparent 30%),
    radial-gradient(circle at 88% 70%, rgba(236, 143, 129, .18), transparent 34%),
    linear-gradient(180deg, #f7f5f9, #ece9f1);
}

.auth-topbar {
  position: relative;
}

.portal-auth {
  display: grid;
  place-items: center;
  min-height: calc(100vh - 58px);
  padding: 54px 24px;
}

.portal-auth-card {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) 480px;
  overflow: hidden;
  width: min(100%, 1220px);
  min-height: 650px;
  border: 1px solid #ded7e7;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(43, 37, 58, .16);
}

.portal-auth-visual {
  position: relative;
  min-height: 0;
  overflow: hidden;
  background: #211a33;
}

.portal-auth-visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.portal-auth-shade,
.portal-auth-visual::after {
  content: "";
  position: absolute;
  inset: 0;
}

.portal-auth-shade {
  background:
    linear-gradient(90deg, rgba(31, 22, 49, .72), rgba(31, 22, 49, .44) 52%, rgba(31, 22, 49, .22)),
    linear-gradient(0deg, rgba(31, 22, 49, .76), transparent 58%);
}

.portal-auth-visual::after {
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 10px;
  inset: 18px;
}

.portal-auth-visual__content {
  position: relative;
  z-index: 1;
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: flex-end;
  padding: 52px;
  color: #fff;
}

.auth-kicker {
  width: max-content;
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(255, 255, 255, .12);
  color: #ffb0a4;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.portal-auth-visual__content h1 {
  max-width: 520px;
  margin: 18px 0 0;
  font-size: 46px;
  line-height: 1.06;
}

.portal-auth-visual__content p:not(.eyebrow) {
  max-width: 520px;
  margin: 16px 0 0;
  color: rgba(255, 255, 255, .86);
  font-size: 17px;
}

.auth-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 24px;
}

.auth-benefits span {
  width: max-content;
  max-width: 100%;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  backdrop-filter: blur(8px);
}

.portal-auth-form {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 42px;
  background:
    radial-gradient(circle at 100% 0, rgba(236, 143, 129, .09), transparent 34%),
    #fff;
}

.auth-form-inner {
  display: grid;
  width: min(100%, 390px);
  gap: 22px;
}

.auth-tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
  border: 1px solid #ded7e7;
  border-radius: 999px;
  padding: 4px;
  background: #f7f4f9;
}

.auth-tabs button {
  border: 0;
  border-radius: 999px;
  min-height: 42px;
  padding: 0 14px;
  background: transparent;
  color: var(--violet-dark);
  font-weight: 900;
  text-align: center;
  cursor: pointer;
}

.auth-tabs button.is-active {
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  box-shadow: 0 10px 22px rgba(221, 128, 112, .26);
}

.auth-form {
  display: grid;
  gap: 14px;
  min-height: 395px;
  align-content: start;
}

.auth-panel {
  display: none;
}

.auth-panel.is-active {
  display: grid;
}

.auth-heading {
  display: grid;
  gap: 7px;
  margin-bottom: 2px;
}

.auth-heading h2 {
  margin: 0;
  color: var(--ink);
  font-size: 30px;
}

.auth-heading span {
  color: var(--muted);
  line-height: 1.45;
}

.auth-form label {
  display: grid;
  gap: 7px;
  color: var(--violet-dark);
  font-weight: 900;
}

.auth-form input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #d8d1e1;
  border-radius: 8px;
  padding: 0 13px;
  background: #fff;
  color: var(--ink);
}

.auth-form input:focus {
  outline: 3px solid rgba(221, 128, 112, .22);
  border-color: var(--coral);
}

.auth-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.auth-row a {
  color: var(--violet-dark);
  font-weight: 900;
}

.auth-check {
  display: flex !important;
  align-items: center;
  gap: 8px;
  color: var(--muted) !important;
  font-size: 13px;
  line-height: 1.3;
}

.auth-check input {
  flex: 0 0 auto;
  width: 16px;
  min-height: 16px;
  accent-color: var(--violet);
}

.auth-form button {
  min-height: 46px;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 12px 26px rgba(221, 128, 112, .22);
}

.content-admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 16px;
  align-items: start;
}

.content-admin-layout--editor {
  grid-template-columns: minmax(0, 1fr) 390px;
}

.editor-aside {
  display: grid;
  gap: 16px;
}

.content-type-assistant {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid #ead7d5;
  border-left: 4px solid var(--coral);
  border-radius: 9px;
  padding: 12px;
  background:
    radial-gradient(circle at 0 0, rgba(221, 128, 112, .16), transparent 36%),
    linear-gradient(135deg, #fff, #fbf7ff);
}

.content-type-assistant > span {
  display: grid;
  place-items: center;
  min-height: 54px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}

.content-type-assistant strong {
  display: block;
  color: var(--violet-dark);
}

.content-type-assistant p {
  margin: 3px 0 0;
  color: var(--muted);
  line-height: 1.45;
}

.content-type-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.content-type-actions button {
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 9px 11px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
  cursor: pointer;
}

.content-type-actions button:hover {
  border-color: var(--coral);
  color: var(--ink);
}

.visual-editor {
  display: grid;
  gap: 8px;
}

.editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 8px;
  background: linear-gradient(135deg, #fbf9fd, #fff5f1);
}

.editor-toolbar button,
.ai-action-grid button {
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 8px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
  cursor: pointer;
}

.editor-toolbar button:hover,
.ai-action-grid button:hover {
  border-color: var(--coral);
  color: var(--ink);
}

.editor-preview {
  overflow: auto;
  max-height: 360px;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 16px;
  background: #fff;
  color: var(--ink);
  line-height: 1.65;
}

.editor-preview h2,
.editor-preview h3 {
  color: var(--violet-dark);
}

.editor-preview img {
  max-width: 100%;
  border-radius: 8px;
}

.ai-assistant-panel {
  background:
    radial-gradient(circle at 12% 0, rgba(221, 128, 112, .16), transparent 35%),
    linear-gradient(135deg, #fff, #fbf7ff);
}

.ai-action-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.ai-image-suggestions,
.ai-generated-brief {
  display: grid;
  gap: 8px;
  border-top: 1px solid #e4ddea;
  padding-top: 12px;
}

.ai-image-suggestions > p,
.ai-generated-brief p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.ai-image-suggestions > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.ai-image-suggestions button {
  position: relative;
  overflow: hidden;
  min-width: 0;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 0;
  background: #ede8f1;
  cursor: pointer;
}

.ai-image-suggestions button.is-selected {
  border-color: var(--coral);
  box-shadow: 0 0 0 3px rgba(221, 128, 112, .16);
}

.ai-image-suggestions img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.ai-image-suggestions button span {
  position: absolute;
  right: 5px;
  bottom: 5px;
  border-radius: 999px;
  padding: 4px 7px;
  background: rgba(31, 26, 43, .86);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.file-version-panel {
  background: linear-gradient(135deg, #fff, #fff6f2);
}

.file-version-list {
  display: grid;
  gap: 8px;
}

.file-version-list article {
  display: grid;
  gap: 3px;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}

.file-version-list strong {
  color: var(--violet-dark);
}

.file-version-list span,
.file-version-list em {
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.file-version-list .admin-button {
  justify-self: start;
  margin-top: 5px;
}

.typed-card-operational {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

.typed-card-operational span {
  display: grid;
  gap: 2px;
  border: 1px solid #e5deea;
  border-radius: 7px;
  padding: 8px;
  background: #fbf9fc;
  color: var(--muted);
  font-size: 11px;
}

.typed-card-operational strong {
  color: var(--violet-dark);
  font-size: 13px;
}

@media (max-width: 620px) {
  .typed-card-operational {
    grid-template-columns: 1fr;
  }
}

.content-admin-panel,
.content-table {
  gap: 12px;
}

.admin-filter-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-filter-pills a,
.status-pill,
.seo-score,
.content-type {
  border-radius: 999px;
  padding: 7px 10px;
  background: #f0ebf5;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.admin-filter-pills a.is-active {
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
}

.content-row {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr) 120px 148px auto;
  gap: 10px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 12px;
  background:
    linear-gradient(90deg, rgba(105, 78, 139, .07), transparent 36%),
    #fbf9fd;
}

.content-row strong {
  display: block;
  color: var(--violet-dark);
}

.content-row p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.typed-admin-hero {
  overflow: hidden;
  position: relative;
}

.typed-admin-hero::after {
  content: "";
  position: absolute;
  right: -70px;
  top: -90px;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(221, 128, 112, .2), transparent 68%);
  pointer-events: none;
}

.typed-admin-hero p:not(.eyebrow) {
  max-width: 760px;
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.typed-admin-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.typed-admin-metrics article {
  border: 1px solid #e3dfea;
  border-radius: 10px;
  padding: 15px;
  background: linear-gradient(135deg, #fff, #fff7f3);
  box-shadow: 0 10px 24px rgba(43, 37, 58, .07);
}

.typed-admin-metrics span {
  display: block;
  color: var(--ink);
  font-size: 30px;
  font-weight: 900;
}

.typed-admin-metrics strong {
  color: var(--violet-dark);
}

.typed-admin-toolbar {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.typed-admin-tips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}

.typed-admin-tips span {
  border-radius: 999px;
  padding: 7px 9px;
  background: #fff4ef;
  color: #7c4b43;
  font-size: 12px;
  font-weight: 900;
}

.typed-content-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.typed-content-card {
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 100%;
  border: 1px solid #ded7e7;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(43, 37, 58, .08);
}

.typed-content-card__image {
  position: relative;
  display: block;
  aspect-ratio: 16 / 8.4;
  background: #e9e2ef;
}

.typed-content-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.typed-content-card__image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(31, 24, 47, .05), rgba(31, 24, 47, .35));
}

.typed-content-card__image span {
  position: absolute;
  left: 12px;
  top: 12px;
  z-index: 1;
  border-radius: 999px;
  padding: 7px 9px;
  background: rgba(43, 37, 58, .86);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.typed-content-card__body {
  display: grid;
  gap: 9px;
  padding: 14px;
}

.typed-content-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.typed-content-card h2 {
  margin: 0;
  color: var(--violet-dark);
  font-size: 21px;
  line-height: 1.18;
}

.typed-content-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.typed-content-card__slug {
  overflow: hidden;
  border-radius: 7px;
  padding: 8px 9px;
  background: #f7f3fa;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.typed-card-tags,
.public-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.typed-card-tags span,
.public-tags a {
  border-radius: 999px;
  padding: 6px 8px;
  background: #f0ebf5;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
}

.public-tags {
  margin-top: 14px;
}

.public-tags a {
  background: rgba(255, 255, 255, .16);
  color: #fff;
  backdrop-filter: blur(10px);
}

.tag-strip,
.tag-page-layout {
  display: grid;
  gap: 16px;
}

.tag-strip {
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: center;
  border: 1px solid #ded7e7;
  border-radius: 10px;
  padding: 16px;
  background:
    radial-gradient(circle at 0 0, rgba(221, 128, 112, .13), transparent 34%),
    #fff;
  box-shadow: 0 10px 24px rgba(43, 37, 58, .07);
}

.tag-strip h2 {
  margin: 0;
  color: var(--ink);
}

.tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tag-cloud a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid #e3dfea;
  border-radius: 999px;
  padding: 8px 10px;
  background: linear-gradient(135deg, #fbf9fd, #fff7f3);
  color: var(--violet-dark);
  font-size: 13px;
  font-weight: 900;
}

.tag-cloud span {
  display: grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
}

.tag-page-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
  align-items: start;
}

.tag-page-main {
  display: grid;
  gap: 16px;
}

.tag-page-aside {
  position: sticky;
  top: 76px;
}

.public-card-grid--tag {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tag-admin-panel {
  gap: 14px;
}

.tag-admin-list {
  display: grid;
  gap: 10px;
}

.tag-admin-list article {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 130px 100px 120px auto;
  gap: 10px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 12px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.tag-admin-list strong {
  color: var(--violet-dark);
}

.tag-admin-list p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.tag-admin-list span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.tag-management-grid {
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  align-items: start;
}

.tag-admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.tag-admin-actions form {
  margin: 0;
}

.tag-admin-actions .admin-button {
  min-height: 32px;
  padding: 7px 9px;
  font-size: 12px;
}

.typed-content-card footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  border-top: 1px solid #eee8f3;
  padding: 12px 14px;
  background: linear-gradient(135deg, #fbf9fd, #fff7f3);
}

.typed-empty-state {
  grid-column: 1 / -1;
  place-items: center;
  min-height: 280px;
  text-align: center;
}

.typed-empty-state > span {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 20px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.typed-empty-state h2 {
  margin: 0;
  color: var(--ink);
}

.typed-empty-state p {
  max-width: 560px;
  margin: 0;
  color: var(--muted);
}

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

.forum-admin-topic {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 10px;
  background: #fbf9fd;
}

.forum-admin-topic .admin-row {
  border: 0;
  padding: 0;
  background: transparent;
}

.forum-topic-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}

.forum-topic-tools select {
  min-height: 38px;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 8px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
}

.forum-topic-tools input,
.forum-post-tools select {
  min-height: 38px;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 8px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 800;
}

.forum-topic-tools input {
  width: 120px;
}

.forum-topic-tools .checkbox-line {
  min-height: 38px;
  padding: 8px 10px;
}

.forum-admin-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.forum-admin-post {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 12px;
  background: #fbf9fd;
}

.forum-admin-post p {
  margin: 5px 0;
  color: var(--muted);
}

.forum-admin-post small {
  color: #81778c;
}

.forum-post-tools,
.forum-watch-form {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.forum-watch-form {
  margin: 0;
}

.status-pill--published,
.seo-score.is-good {
  background: #e8f8ee;
  color: #245c3e;
}

.status-pill--review {
  background: #fff5df;
  color: #8a5a1f;
}

.status-pill--rejected,
.status-pill--archived {
  background: #fff0ec;
  color: #8a342b;
}

.seo-score {
  background: #fff5df;
  color: #8a5a1f;
}

.seo-side-panel {
  position: sticky;
  top: 18px;
}

.checkbox-line {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  min-height: 42px;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 10px 12px;
  background: #fff;
}

.checkbox-line input {
  width: 16px;
  min-height: 16px;
  accent-color: var(--violet);
}

.install-seed-toggle {
  margin-top: 14px;
}

.install-seed-toggle span,
.install-seed-toggle strong,
.install-seed-toggle em {
  display: block;
}

.install-seed-toggle em {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.announcement-preview {
  position: sticky;
  top: 18px;
}

.announcement-preview .site-alert {
  margin: 0;
  padding: 16px;
  border-radius: 9px;
}

.announcement-preview .site-alert h1 {
  font-size: 24px;
}

.announcement-preview .site-alert p:not(.eyebrow) {
  font-size: 14px;
}

.announcement-row {
  grid-template-columns: 112px minmax(0, 1fr) 130px auto;
}

.admin-user-note {
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 12px;
  background: linear-gradient(135deg, #fbf9fd, #fff5f1);
}

.admin-user-note strong {
  color: var(--violet-dark);
}

.admin-user-note p {
  margin: 4px 0 0;
  color: var(--muted);
}

.role-hints span {
  align-items: flex-start;
  justify-content: flex-start;
  line-height: 1.35;
}

.role-hints span::after {
  content: none;
}

.media-admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 16px;
  align-items: start;
}

.media-upload-card .mod-warning {
  margin: 0;
}

.media-admin-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.media-asset-card {
  overflow: hidden;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  background: #fbf9fd;
  box-shadow: 0 8px 18px rgba(43, 37, 58, .06);
}

.media-asset-card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: #eee9f3;
}

.media-asset-card div {
  display: grid;
  gap: 6px;
  padding: 10px;
}

.media-asset-card strong {
  overflow: hidden;
  color: var(--violet-dark);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-asset-card p,
.media-asset-card em {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.media-asset-card code {
  overflow: hidden;
  border-radius: 6px;
  padding: 6px;
  background: #fff;
  color: #574762;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.preflight-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.preflight-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  padding: 10px;
  background: #fbf9fd;
}

.preflight-item > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #e8f8ee;
  color: #245c3e;
  font-size: 11px;
  font-weight: 900;
}

.preflight-item.is-bad > span {
  background: #fff0ec;
  color: #8a342b;
}

.preflight-item.is-ok > span {
  background: #e8f8ee;
  color: #245c3e;
}

.preflight-item.is-warn > span {
  background: #fff3df;
  color: #8a5620;
}

.preflight-item.is-error > span {
  background: #fff0ec;
  color: #8a342b;
}

.install-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.install-diagnostics .muted-text {
  margin: 0 0 14px;
}

.preflight-item strong {
  display: block;
  overflow: hidden;
  color: var(--violet-dark);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.preflight-item p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.primary-button:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.settings-admin-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.settings-group {
  align-content: start;
}

.settings-group--auto_content {
  grid-column: 1 / -1;
  background:
    linear-gradient(135deg, rgba(105, 78, 139, .08), rgba(221, 128, 112, .09)),
    #fff;
}

.ad-preview-panel {
  align-content: start;
}

.ad-slot-map {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) 74px;
  grid-template-rows: 42px 150px 42px;
  gap: 8px;
  min-height: 250px;
}

.ad-slot {
  display: grid;
  place-items: center;
  border: 1px solid #e3dfea;
  border-radius: 8px;
  background: #fbf9fd;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}

.ad-slot--top,
.ad-slot--footer {
  grid-column: 1 / -1;
  background: linear-gradient(90deg, rgba(105, 78, 139, .16), rgba(221, 128, 112, .18));
}

.ad-slot--left,
.ad-slot--right {
  background: repeating-linear-gradient(135deg, #fff5f1, #fff5f1 8px, #f2ecf7 8px, #f2ecf7 16px);
}

.ad-slot--content {
  background: linear-gradient(135deg, #fff, #f7f2fb);
}

.server-paid-panel {
  gap: 14px;
}

.server-paid-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.server-paid-grid article {
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 12px;
  background:
    radial-gradient(circle at 0 0, rgba(221, 128, 112, .16), transparent 34%),
    #fbf9fd;
}

.server-paid-grid span {
  display: inline-grid;
  place-items: center;
  min-width: 44px;
  border-radius: 999px;
  padding: 5px 8px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.server-paid-grid strong {
  display: block;
  margin-top: 10px;
  color: var(--violet-dark);
}

.server-paid-grid p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.ai-control-panel {
  grid-template-columns: minmax(0, 1fr) 250px;
  align-items: center;
  gap: 18px;
  overflow: hidden;
  border-left: 5px solid var(--coral);
  background:
    radial-gradient(circle at 12% 0, rgba(221, 128, 112, .16), transparent 32%),
    linear-gradient(135deg, #fff, #fbf8fd);
}

.ai-control-panel.is-ready {
  border-left-color: #20b36b;
}

.ai-badge {
  display: inline-flex;
  width: fit-content;
  border-radius: 999px;
  padding: 5px 9px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.ai-control-panel h2 {
  margin: 10px 0 6px;
  color: var(--ink);
  font-size: 24px;
}

.ai-control-panel p,
.ai-control-panel__meta span,
.auto-source-list p,
.auto-source-list em,
.auto-job-card p {
  color: var(--muted);
  line-height: 1.45;
}

.ai-control-panel__meta {
  display: grid;
  gap: 8px;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 12px;
  background: rgba(255, 255, 255, .72);
}

.ai-control-panel__meta strong {
  color: var(--violet-dark);
  font-size: 18px;
}

.ai-cron-note {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  border-color: #f0cfc8;
  background:
    linear-gradient(135deg, rgba(221, 128, 112, .1), rgba(105, 78, 139, .06)),
    #fff;
}

.ai-cron-note h2 {
  margin: 9px 0 4px;
  color: var(--ink);
}

.ai-cron-note p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.auto-metric-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.auto-metric-grid article {
  border: 1px solid #ded7e7;
  border-radius: 10px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(105, 78, 139, .08), rgba(221, 128, 112, .08)),
    #fff;
}

.auto-metric-grid span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.auto-metric-grid strong {
  display: block;
  margin-top: 4px;
  color: var(--violet-dark);
  font-size: 30px;
}

.auto-metric-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.auto-content-layout {
  display: grid;
  grid-template-columns: minmax(320px, .88fr) minmax(0, 1.12fr);
  gap: 16px;
  align-items: start;
}

.ai-quick-create {
  gap: 16px;
  border-color: #e6d8ef;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .94), rgba(255, 247, 244, .86)),
    #fff;
}

.admin-form-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.ai-cron-note code {
  display: block;
  overflow-wrap: anywhere;
  margin-top: 10px;
  border: 1px solid #e7ddec;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fbf8fd;
  color: var(--violet-dark);
  font-weight: 900;
}

.auto-source-list,
.auto-job-list {
  display: grid;
  gap: 10px;
}

.auto-source-list {
  margin-top: 10px;
}

.auto-source-list article,
.auto-job-card {
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 12px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.auto-source-list span,
.auto-job-card__top span {
  display: inline-flex;
  width: fit-content;
  border-radius: 999px;
  padding: 4px 8px;
  background: #f0e9f7;
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 900;
}

.auto-source-list strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
}

.auto-source-list p {
  overflow: hidden;
  margin: 3px 0;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.auto-source-list em {
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.auto-source-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.auto-source-actions form {
  margin: 0;
}

.auto-source-actions .admin-button,
.auto-source-actions button {
  min-height: 34px;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 900;
}

.auto-source-preview {
  display: grid;
  gap: 7px;
  margin-top: 14px;
  border: 1px solid #d8cee2;
  border-radius: 9px;
  padding: 12px;
  background: #fbf8fd;
}

.auto-source-preview > a {
  display: grid;
  gap: 3px;
  min-width: 0;
  border-top: 1px solid #e6e0eb;
  padding-top: 8px;
}

.auto-source-preview > a strong,
.auto-source-preview > a span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.auto-source-preview > a strong {
  color: var(--violet-dark);
  font-size: 13px;
}

.auto-source-preview > a span {
  color: var(--muted);
  font-size: 11px;
}

.auto-job-board {
  gap: 14px;
}

.auto-job-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.auto-job-card {
  display: grid;
  gap: 10px;
}

.auto-job-card--failed {
  border-color: #efb2a8;
  background: #fff8f5;
}

.auto-job-card--draft_created {
  border-color: #b9dfcb;
  background: #f5fbf7;
}

.auto-job-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.auto-job-card__top time {
  color: var(--muted);
  font-size: 12px;
}

.auto-job-card h3 {
  margin: 0;
  color: var(--ink);
  font-size: 18px;
}

.auto-job-card p {
  overflow-wrap: anywhere;
  margin: 0;
  font-size: 13px;
}

.auto-job-result-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.auto-job-result-meta span {
  border-radius: 999px;
  padding: 5px 8px;
  background: #ede7f3;
  color: #5b4c69;
  font-size: 10px;
  font-weight: 900;
}

.auto-job-error {
  border: 1px solid #efb2a8;
  border-radius: 8px;
  padding: 9px;
  background: #fff0eb;
  color: #8a342b;
  font-size: 13px;
  font-weight: 800;
}

.auto-job-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.auto-job-card__actions form {
  margin: 0;
}

.auto-job-card__actions button {
  border: 0;
  border-radius: 7px;
  padding: 9px 11px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

.auto-job-card__actions .admin-button--ghost {
  border: 1px solid #d8d1e1;
  background: #fff;
  color: var(--violet-dark);
}

.ad-row {
  grid-template-columns: 142px minmax(0, 1fr) 110px auto;
}

.home-builder-layout {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 16px;
  align-items: start;
}

.home-module-list {
  display: grid;
  gap: 10px;
}

.home-module-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(3, auto) 118px;
  gap: 10px;
  align-items: center;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 11px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.home-module-list strong {
  color: var(--violet-dark);
}

.home-module-list p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.home-module-list label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--violet-dark);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.is-hidden {
  display: none;
}

/* Home polish overrides */
.page-shell {
  align-items: start;
}

.page-shell:not(.page-shell--single) {
  grid-template-columns: 224px minmax(0, 1fr);
}

.sidebar {
  top: 70px;
  max-height: calc(100vh - 82px);
  padding-right: 6px;
}

.nav-block,
.side-card {
  border: 1px solid #d8d1e1;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(43, 37, 58, .06);
}

.nav-block {
  margin-bottom: 9px;
}

.side-card {
  margin-bottom: 11px;
  padding: 0 9px 9px;
}

.nav-block h2,
.side-card h2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  padding: 10px 12px;
  background: linear-gradient(90deg, #51436d, #7f6092 62%, #df7b72);
  letter-spacing: 0;
  font-size: 13px;
}

.nav-block h2::after,
.side-card h2::after {
  content: "";
  width: 28px;
  height: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .42);
}

.side-card h2 {
  margin: 0 -9px 8px;
}

.nav-block a,
.side-card a,
.user-rank {
  position: relative;
  min-height: 0;
  overflow: hidden;
  border-radius: 7px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
  box-shadow: none;
}

.nav-block a::before,
.side-card a::before,
.user-rank::before {
  display: none;
}

.nav-block a {
  grid-template-columns: 32px minmax(0, 1fr);
  margin: 7px 9px;
  padding: 7px 8px;
}

.side-card a,
.user-rank {
  margin-top: 7px;
  padding: 8px;
}

.side-card a {
  grid-template-columns: 34px minmax(0, 1fr);
}

.nav-block span,
.side-icon,
.side-avatar,
.user-rank span {
  box-shadow: 0 5px 12px rgba(93, 68, 128, .22);
}

.nav-block span {
  width: 29px;
  height: 29px;
}

.side-icon,
.side-avatar {
  width: 31px;
  height: 31px;
}

.nav-block strong,
.user-rank strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.side-card strong {
  display: -webkit-box;
  overflow: hidden;
  color: var(--violet-dark);
  font-size: 13px;
  line-height: 1.25;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.nav-block em,
.side-card p,
.side-card em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-rank {
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 8px;
}

.user-rank span {
  width: 25px;
  height: 25px;
}

.user-rank em {
  padding: 3px 6px;
  border-radius: 999px;
  background: #f3edf7;
  color: var(--violet-dark);
  font-size: 11px;
  font-weight: 900;
}

.post--compact {
  grid-template-rows: minmax(0, 1fr) auto;
  align-content: start;
}

.post--compact .post__inline {
  padding-bottom: 10px;
}

.post--compact .post__meta {
  align-self: end;
  margin: 0 14px 14px;
  padding: 9px 10px;
  border: 1px solid #e7e1eb;
  border-radius: 6px;
  background: linear-gradient(135deg, #fbf9fd, #fff4ef);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
  font-size: 12px;
}

.post--compact .post__meta span,
.post--compact .post__meta time {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.post--compact .post__meta em {
  padding: 3px 7px;
  border-radius: 999px;
  background: #efe8f5;
  color: var(--violet-dark);
  font-size: 11px;
}

@media (max-width: 980px) {
  .topbar__inner {
    flex-wrap: wrap;
    gap: 8px 14px;
    padding-block: 8px;
  }

  .brand {
    order: 1;
  }

  .profile-button {
    order: 2;
  }

  .topnav {
    order: 3;
    flex: 0 0 100%;
    overflow-x: auto;
    gap: 8px;
    padding: 2px 0 4px;
    scrollbar-width: none;
  }

  .topnav::-webkit-scrollbar {
    display: none;
  }

  .topnav a {
    flex: 0 0 auto;
    border-radius: 999px;
    padding: 7px 10px;
    background: rgba(42, 36, 62, .22);
    font-size: 13px;
    white-space: nowrap;
  }

  .page-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    display: block;
    position: static;
    max-height: none;
    overflow: visible;
    padding: 0;
    border-radius: 7px;
    background: transparent;
    box-shadow: none;
  }

  .quick-grid,
  .gallery-grid,
  .knowledge-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .news-grid,
  .info-grid,
  .resources,
  .split,
  .video-panel,
  .directory-layout,
  .article-hero,
  .article-layout,
  .public-article__layout,
  .xf-layout,
  .xf-post,
  .content-split,
  .wiki-layout,
  .wiki-edit-hero,
  .wiki-edit-layout,
  .pm-layout,
  .notification-hero,
  .notification-layout,
  .notification-admin-layout,
  .install-done-hero,
  .wiki-page-layout,
  .wiki-entry__head,
  .mods-layout,
  .mod-detail-hero,
  .cinema-layout,
  .blog-layout,
  .chat-shell,
  .messages-shell,
  .thread-layout,
  .activity-dashboard,
  .activity-layout,
  .map-layout,
  .notify-layout,
  .moderation-layout,
  .content-admin-layout,
  .media-admin-layout,
  .settings-admin-layout,
  .home-builder-layout,
  .home-live-grid,
  .home-ecosystem,
  .ai-control-panel,
  .ai-cron-note,
  .auto-content-layout,
  .auto-job-list,
  .portal-auth-card,
  .admin-shell,
  .character-board,
  .portal-strip,
  .portal-grid,
  .site-footer__inner,
  .profile-layout {
    grid-template-columns: 1fr;
  }

  .xf-toolbar,
  .xf-category > header,
  .xf-panel-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .xf-thread {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .xf-thread__stats,
  .xf-lastpost {
    grid-column: 2;
    justify-items: start;
    text-align: left;
  }

  .split > img,
  .directory-layout > img {
    height: 280px;
  }

  .file-board,
  .blog-grid,
  .feature-grid,
  .player-grid,
  .download-grid,
  .server-showcase,
  .public-card-grid,
  .reward-grid,
  .metric-grid,
  .contribution-grid {
    grid-template-columns: 1fr;
  }

  .auto-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .masonry-gallery {
    grid-template-columns: repeat(2, 1fr);
  }

  .wiki-section-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .mod-category-nav {
    grid-template-columns: repeat(3, 1fr);
  }

  .mod-card {
    grid-template-columns: 180px minmax(0, 1fr);
  }

  .profile-type-grid {
    grid-template-columns: 1fr;
  }

  .module-grid,
  .section-guide,
  .home-module-list article,
  .content-row,
  .forum-admin-topic,
  .media-admin-grid,
  .preflight-grid,
  .server-paid-grid,
  .server-detail-grid,
  .system-summary,
  .system-checklist,
  .install-done-summary,
  .quest-grid,
  .reward-track,
  .moderation-summary,
  .admin-metrics,
  .admin-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .install-next-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .module-card--wide,
  .settings-group--auto_content,
  .crew-card--feature {
    grid-column: span 2;
  }

  .crew-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-sidebar {
    position: static;
    min-height: 0;
  }

  .admin-table__head {
    display: none;
  }

  .admin-table article {
    grid-template-columns: 1fr;
    align-items: flex-start;
  }

  .report-card header,
  .report-resolution {
    grid-template-columns: 1fr;
  }

  .report-inline form {
    position: static;
  }

  .admin-table-actions {
    justify-content: flex-start;
  }

  .public-article__aside {
    position: static;
  }

  .forum-topic-tools {
    justify-content: flex-start;
  }
}

/* Compact, fully discoverable navigation for phones and tablets. */
.mobile-site-nav {
  display: none;
}

@media (max-width: 980px) {
  .topbar__inner {
    min-height: 62px;
    flex-wrap: nowrap;
    padding-block: 8px;
  }

  .topnav {
    display: none;
  }

  .mobile-site-nav {
    position: relative;
    display: block;
    order: 2;
    margin-left: auto;
  }

  .mobile-site-nav summary {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 7px;
    background: rgba(42, 36, 62, .28);
    color: #fff;
    cursor: pointer;
    list-style: none;
  }

  .mobile-site-nav summary::-webkit-details-marker {
    display: none;
  }

  .mobile-site-nav summary span {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: currentColor;
  }

  .mobile-site-nav summary em {
    margin-left: 4px;
    font-size: 13px;
    font-style: normal;
    font-weight: 800;
  }

  .mobile-site-nav[open] summary {
    background: rgba(42, 36, 62, .52);
  }

  .mobile-site-nav nav {
    position: absolute;
    top: calc(100% + 10px);
    right: -48px;
    z-index: 40;
    width: min(340px, calc(100vw - 24px));
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 10px;
    border: 1px solid rgba(79, 63, 106, .22);
    border-radius: 12px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 45px rgba(29, 24, 43, .28);
  }

  .mobile-site-nav nav a {
    min-width: 0;
    padding: 10px 11px;
    border-radius: 7px;
    background: #f2edf6;
    color: #332b48;
    font-size: 13px;
    font-weight: 800;
  }

  .mobile-site-nav nav a:hover {
    background: #e6d9ef;
  }

  .profile-button {
    order: 3;
    margin-left: 0;
  }
}

@media (max-width: 620px) {
  .home-sidebar .nav-block {
    display: none;
  }
}

.auth-check span {
  min-width: 0;
}

.auth-check a {
  color: #684486;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 620px) {
  body {
    font-size: 15px;
  }

  .hero {
    height: 170px;
  }

  .hero__logo {
    font-size: 46px;
  }

  .hero__duo {
    width: 66px;
    height: 60px;
    bottom: 38px;
    background-size: 120px auto;
  }

  .intro h1 {
    font-size: 28px;
  }

  .notice,
  .site-alert,
  .module-launchpad__head,
  .crew-recruit,
  .page-preview__header,
  .comments-head,
  .comment-tools {
    align-items: flex-start;
    flex-direction: column;
  }

  .site-alert {
    padding: 16px;
  }

  .site-alert h1 {
    font-size: 23px;
  }

  .site-alert__meta {
    justify-items: start;
  }

  .comments-section {
    padding: 14px;
  }

  .comments-stats {
    justify-items: start;
  }

  .comment-card,
  .comment-author {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .comment-card--reply {
    margin-left: 18px;
  }

  .comment-avatar {
    width: 38px;
    height: 38px;
  }

  .quick-grid,
  .gallery-grid,
  .knowledge-grid,
  .media-strip,
  .masonry-gallery {
    grid-template-columns: 1fr;
  }

  .sub-hero h1 {
    font-size: 32px;
  }

  .public-section-head,
  .public-empty {
    grid-template-columns: 1fr;
    align-items: flex-start;
    flex-direction: column;
  }

  .public-empty {
    display: grid;
  }

  .install-action-row,
  .install-action-row .primary-button,
  .install-action-row .secondary-button {
    width: 100%;
  }

  .seo-mini-stats {
    grid-template-columns: 1fr;
  }

  .public-article__hero {
    min-height: 320px;
  }

  .public-article__hero > div,
  .public-article__body {
    padding: 18px;
  }

  .public-article__hero h1 {
    font-size: 32px;
  }

  .profile-hero__content {
    grid-template-columns: 1fr;
  }

  .profile-hero h1 {
    font-size: 34px;
  }

  .server-mini,
  .activity-feed article {
    grid-template-columns: 1fr;
  }

  .server-card {
    min-height: 0;
  }

  .server-card__banner {
    height: 190px;
  }

  .server-card__monitor,
  .server-detail-grid,
  .server-paid-controls {
    grid-template-columns: 1fr;
  }

  .table-card > div,
  .wiki-article,
  .wiki-data-table > div,
  .file-version-card,
  .forum-admin-topic,
  .mod-card {
    grid-template-columns: 1fr;
  }

  .wiki-section-grid,
  .mod-category-nav {
    grid-template-columns: 1fr;
  }

  .wiki-edit-hero {
    padding: 18px;
  }

  .wiki-edit-hero h1 {
    font-size: 30px;
  }

  .wiki-review-card header,
  .wiki-review-actions,
  .pm-conversation__head {
    align-items: flex-start;
    flex-direction: column;
  }

  .wiki-review-card aside {
    min-width: 0;
    text-align: left;
  }

  .wiki-review-actions label {
    min-width: 0;
    width: 100%;
  }

  .wiki-review-versions,
  .wiki-review-title-change {
    grid-template-columns: 1fr;
  }

  .wiki-review-title-change b {
    transform: rotate(90deg);
    justify-self: start;
  }

  .messages-hub-hero {
    padding: 18px;
  }

  .messages-hub-hero h1 {
    font-size: 30px;
  }

  .pm-conversation {
    min-height: 0;
    padding: 12px;
  }

  .pm-message {
    max-width: 100%;
  }

  .notification-hero {
    padding: 18px;
  }

  .notification-hero h1 {
    font-size: 30px;
  }

  .notification-card {
    grid-template-columns: 1fr;
  }

  .install-done-hero {
    padding: 18px;
  }

  .install-done-hero h1 {
    font-size: 30px;
  }

  .install-next-grid {
    grid-template-columns: 1fr;
  }

  .migration-list article {
    grid-template-columns: 1fr;
  }

  .migration-list em {
    justify-self: start;
  }

  .wiki-article em {
    text-align: left;
  }

  .post--feature img {
    height: 220px;
  }

  .post__inline {
    grid-template-columns: 100px 1fr;
  }

  .post__inline img {
    width: 100px;
  }

  .timeline li,
  .server-table > div,
  .xf-node {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .xf-node em {
    text-align: left;
  }

  .xf-hero h1 {
    font-size: 34px;
  }

  .stat-row {
    flex-direction: column;
  }

  .chat-room__head,
  .chat-composer {
    grid-template-columns: 1fr;
  }

  .chat-room__head {
    align-items: flex-start;
    flex-direction: column;
  }

  .chat-composer button {
    min-height: 42px;
  }

  .chat-message,
  .chat-system {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .chat-avatar {
    width: 38px;
    height: 38px;
  }

  .thread-hero,
  .message-locked {
    align-items: flex-start;
    flex-direction: column;
  }

  .thread-hero h1 {
    font-size: 28px;
  }

  .profile-type {
    grid-template-columns: 1fr;
  }

  .profile-type img {
    height: 190px;
  }

  .profile-type > div {
    padding: 0 14px 14px;
  }

  .message-thread {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .message-thread em {
    grid-column: 2;
  }

  .message-dialog__head,
  .mod-warning {
    grid-template-columns: 1fr;
  }

  .message-bubble {
    max-width: 100%;
  }

  .module-grid,
  .module-editor-row,
  .admin-form-grid,
  .content-row,
  .quest-pass,
  .quest-grid,
  .reward-track,
  .crew-grid,
  .moderation-summary,
  .admin-metrics,
  .admin-grid,
  .form-grid {
    grid-template-columns: 1fr;
  }

  .auto-metric-grid {
    grid-template-columns: 1fr;
  }

  .module-card--wide,
  .crew-card--feature {
    grid-column: auto;
  }

  .crew-card--feature {
    grid-template-columns: 1fr;
  }

  .activity-feed-board article,
  .mod-log-item,
  .notify-item,
  .admin-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .notify-item a,
  .mod-log-item button,
  .admin-row button {
    grid-column: 2;
    justify-self: start;
  }

  .content-row .admin-button,
  .content-row .status-pill,
  .content-row .seo-score {
    justify-self: start;
  }

  .map-board,
  .map-board img {
    min-height: 360px;
    height: 360px;
  }

  .portal-auth {
    align-items: start;
    padding: 24px 16px;
  }

  .portal-auth-card {
    min-height: 0;
  }

  .portal-auth-visual {
    min-height: 360px;
  }

  .portal-auth-visual__content,
  .portal-auth-form {
    padding: 28px;
  }

  .portal-auth-visual__content h1 {
    font-size: 34px;
  }

  .auth-form-inner {
    width: min(100%, 460px);
  }
}

@media (max-width: 480px) {
  body {
    overflow-x: hidden;
  }

  .topbar__inner,
  .page-shell {
    padding-inline: 10px;
  }

  .brand {
    font-size: 22px;
  }

  .profile-button {
    width: 36px;
    height: 34px;
  }

  .hero__logo {
    font-size: 38px;
  }

  .site-alert h1,
  .section-heading h2,
  .module-launchpad__head h2,
  .comments-head h2 {
    font-size: 24px;
  }

  .quick-card,
  .module-card,
  .file-drop--featured {
    min-height: 170px;
  }

  .file-drop {
    grid-template-columns: 78px minmax(0, 1fr);
  }

  .file-drop img {
    width: 78px;
  }

  .file-drop strong {
    font-size: 15px;
  }

  .post__inline {
    grid-template-columns: 1fr;
  }

  .post__inline img {
    width: 100%;
    aspect-ratio: 16 / 9;
  }

  .post--compact .post__meta {
    align-items: flex-start;
    flex-direction: column;
  }

  .xf-post {
    grid-template-columns: 1fr;
  }

  .xf-author {
    border-right: 0;
    border-bottom: 1px solid #e7e1eb;
  }

  .xf-message header {
    align-items: flex-start;
    flex-direction: column;
  }

  .thread-post .xf-message header {
    margin: -18px -18px 14px;
  }

  .activity-feed-board article,
  .mod-log-item,
  .notify-item,
  .comment-card,
  .chat-message,
  .chat-system {
    grid-template-columns: 1fr;
  }

  .notify-item a,
  .mod-log-item button,
  .comment-card--reply {
    grid-column: auto;
  }

  .comment-card--reply {
    margin-left: 0;
  }

  .comment-compose {
    position: static;
    width: 100%;
  }

  .message-dialog__head {
    grid-template-columns: 1fr;
  }

  .map-pin {
    padding: 6px 8px;
    font-size: 11px;
  }

  .reward,
  .quest-card,
  .portal-card,
  .module-launchpad,
  .comments-section,
  .admin-panel {
    border-radius: 7px;
  }

  .admin-main {
    padding: 12px;
  }

  .admin-topline {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-actions {
    justify-content: flex-start;
  }

  .module-editor-row label,
  .sort-field {
    justify-content: flex-start;
  }

  .portal-auth {
    padding: 12px;
  }

  .portal-auth-card {
    height: auto;
    border-radius: 10px;
  }

  .portal-auth-visual {
    min-height: 300px;
  }

  .portal-auth-visual__content,
  .portal-auth-form {
    padding: 18px;
  }

  .portal-auth-visual__content h1,
  .auth-heading h2 {
    font-size: 28px;
  }

  .auth-form {
    min-height: 0;
  }

  .auth-row {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Live community: chat and partner search */
.community-page {
  display: grid;
  gap: 20px;
}

.community-hero {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.community-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.community-hero__actions a,
.community-primary-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 8px;
  padding: 0 14px;
  background: rgba(255, 255, 255, .14);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.chat-room__head p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.community-empty {
  padding: 28px 18px;
  color: var(--muted);
  text-align: center;
}

.community-empty strong {
  display: block;
  margin-bottom: 6px;
  color: var(--violet-dark);
  font-size: 17px;
}

.community-empty p,
.community-muted {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.community-login-bar {
  padding: 15px 16px;
  border-top: 1px solid #e7e1eb;
  background: #fff;
  color: var(--muted);
  text-align: center;
}

.community-login-bar a {
  color: var(--violet);
  font-weight: 900;
}

.partner-dashboard {
  margin: 0;
}

.partner-filters {
  display: grid;
  grid-template-columns: minmax(150px, .8fr) minmax(180px, 1fr) minmax(200px, 1.2fr) auto auto;
  gap: 10px;
  align-items: end;
  border: 1px solid #ddd6e5;
  border-radius: 11px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .07);
}

.partner-filters label,
.partner-compose label {
  display: grid;
  gap: 6px;
  color: #554d61;
  font-size: 12px;
  font-weight: 900;
}

.partner-filters input,
.partner-filters select,
.partner-compose input,
.partner-compose select,
.partner-compose textarea,
.partner-mine select,
.community-admin-list select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 9px 10px;
  background: #fff;
  color: #373142;
  font: inherit;
}

.partner-filters button,
.partner-compose button,
.partner-mine button {
  min-height: 42px;
  border: 0;
  border-radius: 7px;
  padding: 0 14px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
  font-weight: 900;
}

.partner-filters > a {
  min-height: 42px;
  padding: 12px 4px;
  color: var(--violet);
  font-size: 13px;
  font-weight: 900;
}

.partner-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: start;
}

.partner-results,
.partner-sidebar .panel-widget {
  border: 1px solid #ddd6e5;
  border-radius: 11px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(45, 39, 62, .07);
}

.partner-sidebar {
  display: grid;
  gap: 14px;
}

.partner-card-grid {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.partner-card {
  border: 1px solid #e2dce8;
  border-radius: 10px;
  padding: 15px;
  background: linear-gradient(145deg, #fff, #faf7fc);
}

.partner-card header,
.partner-card footer,
.partner-card dl,
.community-admin-list article {
  display: flex;
  justify-content: space-between;
  gap: 14px;
}

.partner-card h3 {
  margin: 7px 0 0;
  color: var(--violet-dark);
  font-size: 18px;
}

.partner-card header time {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.partner-platform {
  border-radius: 999px;
  padding: 5px 8px;
  background: #f0e9f5;
  color: var(--violet);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.partner-card > p {
  color: #52596b;
  line-height: 1.55;
}

.partner-card dl {
  justify-content: flex-start;
  flex-wrap: wrap;
  margin: 13px 0;
}

.partner-card dl div {
  min-width: 160px;
}

.partner-card dt {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.partner-card dd {
  margin: 3px 0 0;
  color: var(--violet-dark);
  font-weight: 800;
}

.partner-card footer {
  align-items: center;
  border-top: 1px solid #e7e1eb;
  padding-top: 11px;
}

.partner-card footer a,
.partner-card footer span {
  color: var(--violet);
  font-size: 12px;
  font-weight: 900;
}

.partner-compose form,
.partner-mine {
  display: grid;
  gap: 11px;
}

.partner-compose textarea {
  resize: vertical;
}

.partner-compose .community-primary-link {
  border: 0;
  background: linear-gradient(90deg, var(--violet), var(--coral));
}

.partner-mine article {
  border-top: 1px solid #e7e1eb;
  padding-top: 10px;
}

.partner-mine article > strong,
.partner-mine article > span {
  display: block;
}

.partner-mine article > span {
  margin: 4px 0 8px;
  color: var(--muted);
  font-size: 12px;
}

.partner-mine form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
}

.community-admin-section + .community-admin-section {
  margin-top: 18px;
}

.community-admin-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.community-admin-list article {
  align-items: start;
  border: 1px solid #e2dce8;
  border-radius: 9px;
  padding: 13px;
  background: #fff;
}

.community-admin-list article > div {
  min-width: 0;
}

.community-admin-list p,
.community-admin-list blockquote {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.community-admin-list blockquote {
  max-width: 760px;
  color: #464050;
}

.community-admin-list form {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) auto;
  gap: 7px;
  min-width: 290px;
}

@media (max-width: 960px) {
  .partner-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .partner-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 680px) {
  .community-hero,
  .partner-card header,
  .partner-card footer,
  .community-admin-list article {
    align-items: stretch;
    flex-direction: column;
  }

  .partner-filters {
    grid-template-columns: minmax(0, 1fr);
  }

  .chat-composer {
    grid-template-columns: minmax(0, 1fr);
  }

  .chat-composer button {
    min-height: 42px;
  }

  .community-admin-list form {
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
  }
}

@media (max-width: 1100px) {
  .typed-content-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .typed-admin-toolbar {
    grid-template-columns: 1fr;
  }

  .typed-admin-tips {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .typed-admin-metrics,
  .typed-content-grid {
    grid-template-columns: 1fr;
  }

  .typed-content-card h2 {
    font-size: 19px;
  }

  .typed-content-card footer {
    justify-content: stretch;
  }

  .typed-content-card footer .admin-button {
    width: 100%;
  }

  .tag-strip,
  .tag-page-layout,
  .public-card-grid--tag,
  .tag-admin-list article,
  .home-ecosystem__grid,
  .section-guide,
  .section-actions {
    grid-template-columns: 1fr;
  }

  .tag-page-aside {
    position: static;
  }
}

@media (max-width: 980px) {
  .home-sidebar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .home-sidebar .nav-block {
    grid-column: 1 / -1;
  }

  .home-sidebar .nav-block,
  .home-sidebar .side-card {
    margin-bottom: 0;
  }
}

@media (max-width: 620px) {
  .home-sidebar {
    grid-template-columns: 1fr;
  }
}

/* Portal visual refinement */
.home-today {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) repeat(4, minmax(0, .72fr));
  gap: 10px;
  align-items: stretch;
  margin: 0 0 8px;
}

.home-today__head,
.home-today a {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background:
    radial-gradient(circle at 100% 0, rgba(233, 129, 116, .16), transparent 42%),
    linear-gradient(135deg, #fff, #fbf9fd);
  box-shadow: 0 9px 22px rgba(43, 37, 58, .07);
}

.home-today__head {
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 14px 16px;
}

.home-today__head span,
.section-actions a::before {
  color: var(--coral);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.home-today__head strong {
  color: var(--violet-dark);
  font-size: 18px;
  line-height: 1.15;
}

.home-today a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 2px 9px;
  align-content: center;
  min-height: 82px;
  padding: 12px;
}

.home-today a:hover {
  transform: translateY(-2px);
  border-color: #d2c5e0;
}

.home-today b {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
}

.home-today a strong {
  color: var(--violet-dark);
  font-size: 15px;
  line-height: 1.15;
}

.home-today a span {
  overflow: hidden;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.public-card-grid {
  align-items: stretch;
}

.public-card {
  position: relative;
  overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.public-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  opacity: .9;
  z-index: 2;
}

.public-card:hover {
  transform: translateY(-3px);
  border-color: #cfc2dd;
  box-shadow: 0 18px 34px rgba(45, 39, 62, .13);
}

.public-card__body {
  display: grid;
  align-content: start;
  gap: 8px;
}

.public-card__body h3 {
  display: -webkit-box;
  overflow: hidden;
  min-height: 48px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.public-card__body p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.public-card footer {
  border-top: 1px solid #eee7f0;
  background: linear-gradient(135deg, #fbf9fd, #fff7f2);
}

.public-card footer span:last-child {
  border-radius: 999px;
  padding: 4px 8px;
  background: #f0eaf5;
  color: var(--violet-dark);
  font-size: 12px;
}

.section-actions {
  counter-reset: section-action;
}

.section-actions a {
  position: relative;
  overflow: hidden;
  min-height: 82px;
  padding-left: 54px;
}

.section-actions a::before {
  counter-increment: section-action;
  content: "0" counter(section-action);
  position: absolute;
  left: 14px;
  top: 14px;
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
}

.section-actions a::after {
  content: "";
  position: absolute;
  inset: auto -28px -32px auto;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(233, 129, 116, .18), transparent 66%);
}

.section-actions strong,
.section-actions span {
  position: relative;
  z-index: 1;
}

.home-live-card {
  overflow: hidden;
}

.home-live-card > a {
  position: relative;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 11px 12px;
}

.home-live-card > a::after {
  content: "→";
  align-self: center;
  grid-row: 1 / span 2;
  grid-column: 2;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #f0eaf5;
  color: var(--violet-dark);
  font-weight: 900;
}

.server-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 0;
  overflow: hidden;
  border-radius: 10px;
  background:
    radial-gradient(circle at 0 0, rgba(233, 129, 116, .12), transparent 36%),
    #fff;
}

.server-card__banner {
  height: 176px;
  border-bottom: 1px solid #e6deea;
}

.server-card__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20, 17, 31, .08), rgba(20, 17, 31, .45));
}

.server-card__banner span {
  z-index: 1;
  left: 14px;
  top: 14px;
  bottom: auto;
  border: 1px solid rgba(255, 255, 255, .32);
  background: rgba(31, 25, 47, .72);
  box-shadow: 0 8px 18px rgba(20, 17, 31, .22);
}

.server-card__body {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.server-card h2 {
  margin: 0;
  font-size: 23px;
  line-height: 1.12;
}

.server-card p {
  display: -webkit-box;
  overflow: hidden;
  min-height: 48px;
  margin: 0;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.server-card__top {
  gap: 7px;
  min-height: 26px;
}

.server-card__monitor {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.server-card__monitor div {
  border: 1px solid #eee4ed;
  border-radius: 8px;
  padding: 10px;
  background: linear-gradient(135deg, #fff, #fbf8fd);
}

.server-card__monitor strong {
  font-size: 23px;
}

.server-fill {
  height: 8px;
  margin: 0;
  background: #eee9f3;
}

.server-meta-line,
.server-perks {
  gap: 8px;
  min-width: 0;
}

.server-meta-line strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.server-meta-line em {
  position: relative;
  flex: 0 0 auto;
  padding-left: 13px;
}

.server-meta-line em::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #17b978;
  transform: translateY(-50%);
}

.server-card footer {
  min-height: 54px;
  border-top: 1px solid #eee7f0;
  background: linear-gradient(135deg, #fbf9fd, #fff6f1);
}

.server-card footer a {
  border-radius: 999px;
  padding: 7px 10px;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
}

.server-card--premium {
  border-color: rgba(223, 123, 114, .6);
  box-shadow: 0 18px 38px rgba(178, 80, 117, .17);
}

.server-card--premium::before {
  content: "PROMO";
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 2;
  border-radius: 999px;
  padding: 6px 9px;
  background: linear-gradient(90deg, #2f2644, #d66f87);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
}

.server-detail-panel {
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(33, 183, 166, .11), transparent 36%),
    linear-gradient(135deg, #fff, #fbf8fd);
}

.server-detail-grid article {
  min-height: 82px;
}

.material-next-steps {
  display: grid;
  grid-template-columns: minmax(260px, 1.15fr) repeat(2, minmax(0, .85fr));
  gap: 12px;
  align-items: stretch;
}

.material-next-steps > div,
.material-next-steps a {
  border: 1px solid #ded7e7;
  border-radius: 9px;
  background:
    radial-gradient(circle at 0 0, rgba(233, 129, 116, .12), transparent 38%),
    linear-gradient(135deg, #fff, #fbf9fd);
  box-shadow: 0 10px 24px rgba(43, 37, 58, .07);
}

.material-next-steps > div {
  padding: 16px;
}

.material-next-steps h2 {
  margin: 0 0 7px;
  color: var(--ink);
  font-size: 24px;
  line-height: 1.12;
}

.material-next-steps p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.material-next-steps a {
  position: relative;
  display: grid;
  align-content: center;
  gap: 6px;
  min-height: 124px;
  overflow: hidden;
  padding: 16px 18px 16px 58px;
}

.material-next-steps a::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 18px;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  box-shadow: 0 8px 18px rgba(93, 68, 128, .18);
}

.material-next-steps a::after {
  content: "→";
  position: absolute;
  left: 25px;
  top: 18px;
  color: #fff;
  font-weight: 900;
  line-height: 30px;
}

.material-next-steps a:hover {
  transform: translateY(-2px);
  border-color: #d2c5e0;
}

.material-next-steps strong {
  color: var(--violet-dark);
  font-size: 18px;
  line-height: 1.15;
}

.material-next-steps span {
  color: var(--muted);
  line-height: 1.4;
}

.xf-thread-tools {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  border: 1px solid #ded7e7;
  border-radius: 9px;
  padding: 12px 14px;
  background:
    radial-gradient(circle at 0 0, rgba(233, 129, 116, .12), transparent 40%),
    linear-gradient(135deg, #fff, #fbf9fd);
  box-shadow: 0 10px 24px rgba(43, 37, 58, .07);
}

.xf-thread-tools div {
  display: grid;
  gap: 3px;
}

.xf-thread-tools span {
  color: var(--coral);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.xf-thread-tools strong {
  color: var(--violet-dark);
}

.xf-thread-tools nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.xf-thread-tools a,
.xf-thread-tools button {
  min-height: 34px;
  border: 1px solid #d8d1e1;
  border-radius: 999px;
  padding: 7px 11px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
  cursor: pointer;
}

.xf-thread-tools a:first-child {
  border-color: transparent;
  background: linear-gradient(90deg, var(--violet), var(--coral));
  color: #fff;
}

.xf-message > footer > button:not([data-reply-jump]):not([data-quote-author]) {
  display: none;
}

.xf-quick-reply .xf-editor__bar:not(.xf-editor__bar--enhanced),
.xf-legacy-editor {
  display: none;
}

.xf-quick-reply {
  border-top: 1px solid #e7e1eb;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgba(111, 81, 147, .22), rgba(231, 128, 112, .2)) border-box;
}

.xf-quick-reply textarea[data-quick-reply] {
  min-height: 150px;
  border-radius: 8px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.xf-editor__bar--enhanced button {
  border-radius: 999px;
  background: linear-gradient(135deg, #fff, #f7f2fa);
}

.xf-participants {
  display: grid;
  gap: 8px;
}

.xf-participants a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  border: 1px solid #e6dfeb;
  border-radius: 8px;
  padding: 8px;
  background: linear-gradient(135deg, #fff, #fbf9fd);
}

.xf-participants span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.xf-participants strong {
  overflow: hidden;
  color: var(--violet-dark);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.xf-participants em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.xf-composer-note {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
  border: 1px solid #e5deea;
  border-radius: 8px;
  padding: 12px 14px;
  background: linear-gradient(135deg, #fbf9fd, #fff5f0);
}

.xf-composer-note strong {
  color: var(--violet-dark);
  font-size: 18px;
}

.xf-composer-note span {
  color: var(--muted);
}

.xf-prefix-picks,
.xf-topic-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}

.xf-prefix-picks button,
.xf-topic-options label {
  min-height: 32px;
  border: 1px solid #ded7e7;
  border-radius: 999px;
  padding: 7px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-size: 13px;
  font-weight: 900;
}

.xf-prefix-picks button {
  cursor: pointer;
}

.xf-topic-options label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
}

.xf-topic-options input {
  width: 15px;
  height: 15px;
  accent-color: var(--violet);
}

/* Final responsive guardrails */
.content,
.inner-page,
.public-article__body,
.xf-message,
.panel-widget,
.admin-panel,
.portal-card,
.public-card,
.server-card,
.home-live-card,
.site-footer {
  overflow-wrap: anywhere;
}

.topnav,
.xf-actions,
.xf-filters,
.admin-actions,
.server-detail-actions,
.activity-actions,
.comment-tools,
.auth-row,
.forum-login-note,
.module-launchpad__head,
.public-section-head {
  min-width: 0;
}

.social-pill,
.ghost-button,
.primary-button,
.secondary-button,
.admin-button,
.public-section-head a,
.public-empty a,
.module-launchpad__head > a,
.server-card footer a,
.xf-thread-tools a,
.xf-thread-tools button,
.auth-form button {
  line-height: 1.2;
}

.xf-editor textarea,
.auth-form input,
.admin-form input,
.admin-form textarea,
.admin-form select,
.install-form input,
.install-form textarea,
.install-form select {
  max-width: 100%;
}

.public-card__image img,
.server-card__banner img,
.module-card img,
.sub-hero img,
.public-article__hero img {
  background: #ded7e7;
}

/* Admin compact polish */
.admin-body {
  background:
    radial-gradient(circle at 12% 0, rgba(102, 191, 201, .11), transparent 28%),
    radial-gradient(circle at 88% 10%, rgba(236, 130, 119, .12), transparent 30%),
    #efedf3;
  font-size: 14px;
}

.admin-shell {
  grid-template-columns: 220px minmax(0, 1fr);
}

.admin-sidebar {
  gap: 14px;
  overflow-y: auto;
  max-height: 100vh;
  padding: 16px 12px;
  box-shadow: inset -1px 0 rgba(255, 255, 255, .08);
}

.admin-sidebar .brand {
  font-size: 21px;
}

.admin-navigation {
  display: grid;
  gap: 14px;
}

.admin-navigation > summary {
  display: none;
}

.admin-sidebar nav {
  gap: 5px;
}

.admin-nav-title {
  display: block;
  margin: 10px 4px 2px;
  color: rgba(255, 255, 255, .54);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.admin-sidebar nav a {
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 7px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, .075);
  font-size: 13px;
  line-height: 1.15;
}

.admin-sidebar nav a.is-active {
  border-color: rgba(255, 255, 255, .32);
  background: linear-gradient(90deg, rgba(255, 255, 255, .24), rgba(236, 130, 119, .28));
  box-shadow: inset 3px 0 #f08a7c;
}

.admin-main {
  align-content: start;
  gap: 14px;
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
  padding: 18px;
}

.admin-topline {
  min-height: 0;
  align-items: center;
  gap: 14px;
  border-radius: 8px;
  padding: 16px 18px;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, .98), rgba(255, 248, 245, .92));
  box-shadow: 0 8px 18px rgba(43, 37, 58, .06);
}

.admin-topline .eyebrow {
  margin-bottom: 5px;
  font-size: 11px;
}

.admin-topline h1 {
  font-size: 25px;
  line-height: 1.1;
}

.admin-topline p:not(.eyebrow) {
  max-width: 760px;
  margin: 7px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.typed-admin-hero::after {
  width: 160px;
  height: 160px;
  right: -55px;
  top: -58px;
}

.admin-actions {
  align-items: center;
  gap: 7px;
}

.admin-actions button,
.admin-row button,
.admin-button {
  min-height: 34px;
  border-radius: 7px;
  padding: 8px 11px;
  font-size: 13px;
  white-space: nowrap;
}

.admin-metrics,
.typed-admin-metrics {
  gap: 10px;
}

.admin-metrics article,
.typed-admin-metrics article {
  border-radius: 8px;
  padding: 13px 14px;
  box-shadow: 0 8px 18px rgba(43, 37, 58, .055);
}

.admin-metrics span,
.typed-admin-metrics span {
  font-size: 25px;
  line-height: 1;
}

.admin-metrics strong,
.typed-admin-metrics strong {
  margin-top: 4px;
  font-size: 13px;
}

.admin-panel {
  gap: 12px;
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 8px 18px rgba(43, 37, 58, .055);
}

.admin-grid {
  gap: 12px;
}

.portal-card__head {
  gap: 12px;
  min-height: 0;
}

.portal-card__head h2,
.admin-panel > h2 {
  font-size: 18px;
  line-height: 1.15;
}

.admin-row {
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 0;
  border-radius: 7px;
  padding: 10px;
}

.admin-row > span {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  font-size: 10px;
}

.admin-row strong {
  font-size: 14px;
}

.admin-row p {
  font-size: 12px;
  line-height: 1.35;
}

.admin-table {
  gap: 8px;
}

.admin-table__head,
.admin-table article,
.admin-table > div {
  align-items: center;
  gap: 10px;
  border-radius: 7px;
  padding: 10px;
}

.admin-table__head {
  font-size: 11px;
}

.admin-quick-grid {
  gap: 8px;
}

.admin-quick-grid a {
  min-height: 0;
  border-radius: 7px;
  padding: 11px;
}

.typed-admin-toolbar {
  grid-template-columns: minmax(0, 1fr) minmax(260px, auto);
}

.admin-filter-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.admin-filter-pills a,
.typed-admin-tips span,
.status-pill,
.seo-score {
  min-height: 28px;
  border-radius: 999px;
  padding: 6px 9px;
  font-size: 11px;
}

.typed-content-grid {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px;
}

.typed-content-card {
  border-radius: 8px;
  box-shadow: 0 8px 18px rgba(43, 37, 58, .06);
}

.typed-content-card__image {
  aspect-ratio: 16 / 7.8;
}

.typed-content-card__body {
  gap: 8px;
  padding: 12px;
}

.typed-content-card h2 {
  font-size: 18px;
}

.typed-content-card p {
  display: -webkit-box;
  overflow: hidden;
  min-height: 40px;
  color: #687083;
  font-size: 13px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.typed-content-card footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 0 12px 12px;
}

.typed-empty-state,
.mod-warning {
  min-height: 0;
}

.mod-warning {
  border-radius: 8px;
  padding: 12px;
}

.mod-warning > span {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  font-size: 10px;
}

.wiki-review-board,
.wiki-review-card {
  gap: 10px;
}

.wiki-review-card {
  padding: 14px;
}

.wiki-review-body {
  max-height: 180px;
  padding: 12px;
  font-size: 13px;
}

.media-admin-layout {
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 12px;
}

.media-admin-grid {
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 12px;
}

.admin-form label {
  gap: 6px;
  font-size: 13px;
}

.admin-form {
  gap: 12px;
}

.admin-form input,
.admin-form textarea,
.admin-form select {
  min-height: 38px;
  border-radius: 7px;
  padding: 8px 10px;
  font-size: 13px;
}

.forum-admin-layout {
  display: grid;
  grid-template-columns: minmax(360px, 480px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.forum-node-form textarea[name="description_html"] {
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
}

.forum-node-toggles {
  display: grid;
  gap: 8px;
}

.forum-node-tree {
  align-content: start;
}

.forum-node-admin {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  margin-left: calc(var(--node-depth, 0) * 22px);
  border: 1px solid #e3dfea;
  border-left: 4px solid var(--node-accent, #80649b);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}

.forum-node-admin--neon,
.xf-node--neon {
  border-color: rgba(184, 82, 213, .42);
  box-shadow: 0 0 0 1px rgba(184, 82, 213, .08), 0 10px 24px rgba(184, 82, 213, .12);
}

.forum-node-admin--coral,
.xf-node--coral {
  border-color: rgba(236, 130, 119, .55);
  background: linear-gradient(135deg, #fff, #fff4ef);
}

.forum-node-admin--glass,
.xf-node--glass {
  background: rgba(255, 255, 255, .78);
  backdrop-filter: blur(10px);
}

.forum-node-admin--premium,
.xf-node--premium {
  border-color: rgba(236, 130, 119, .48);
  background: linear-gradient(135deg, #fff8f2, #f7f0ff);
}

.forum-node-admin--dark,
.xf-node--dark {
  border-color: rgba(49, 38, 69, .7);
  background: linear-gradient(135deg, #302842, #5a4771);
  color: #fff;
}

.forum-node-admin--dark strong,
.forum-node-admin--dark p,
.forum-node-admin--dark small,
.xf-node--dark strong,
.xf-node--dark p {
  color: #fff;
}

.forum-node-admin__icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--node-accent, #80649b), #ec8277);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.forum-node-admin strong,
.forum-node-admin p,
.forum-node-admin small {
  display: block;
}

.forum-node-admin p {
  overflow: hidden;
  margin: 3px 0;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.forum-node-admin small {
  color: #7a7284;
  font-size: 11px;
  font-weight: 800;
}

.forum-node-admin em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  text-align: right;
}

.xf-node-list {
  gap: 8px;
}

.xf-node-children {
  display: grid;
  gap: 8px;
  margin-left: 24px;
}

.xf-node {
  position: relative;
  border-left: 4px solid var(--node-accent, #80649b);
}

.xf-node::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: var(--node-bg);
  background-position: center;
  background-size: cover;
  opacity: .1;
  pointer-events: none;
}

.xf-node > * {
  position: relative;
  z-index: 1;
}

.xf-node--none {
  border-color: transparent;
  box-shadow: none;
}

.xf-node--category {
  background: linear-gradient(135deg, #fff, #f7f1fa);
}

.xf-node--link .xf-node__icon {
  background: linear-gradient(135deg, #5a4771, #66bfc9);
}

.xf-node strong a {
  color: inherit;
}

.xf-node p :is(a) {
  color: var(--violet-dark);
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 980px) {
  .admin-shell {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
    min-height: 0;
    max-height: none;
    gap: 8px;
    padding: 12px;
  }

  .admin-sidebar .brand {
    order: 0;
  }

  .admin-navigation {
    gap: 10px;
  }

  .admin-navigation > summary {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
    padding: 9px 12px;
    background: rgba(255, 255, 255, .1);
    color: #fff;
    cursor: pointer;
    font-weight: 900;
    list-style: none;
  }

  .admin-navigation > summary::-webkit-details-marker {
    display: none;
  }

  .admin-navigation > summary::after {
    content: "+";
    font-size: 20px;
    line-height: 1;
  }

  .admin-navigation[open] > summary::after {
    content: "−";
  }

  .admin-navigation:not([open]) > :not(summary) {
    display: none;
  }

  .admin-sidebar nav {
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  }

  .forum-admin-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .admin-main {
    padding: 10px;
  }

  .admin-topline,
  .typed-admin-toolbar,
  .media-admin-layout {
    grid-template-columns: 1fr;
  }

  .admin-topline {
    align-items: flex-start;
  }

  .admin-actions {
    justify-content: flex-start;
  }

  .admin-metrics,
  .typed-admin-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .forum-node-admin {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .forum-node-admin em,
  .forum-node-admin .admin-button {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }

  .xf-node-children {
    margin-left: 10px;
  }
}

.home-sidebar {
  scrollbar-gutter: stable;
}

.portal-auth {
  padding: clamp(24px, 5vh, 56px) 18px;
}

.portal-auth-card {
  grid-template-columns: minmax(420px, 1fr) minmax(380px, 460px);
  width: min(100%, 1080px);
  min-height: 600px;
}

.portal-auth-form {
  padding: clamp(28px, 4vw, 46px);
}

.auth-form-inner {
  width: min(100%, 410px);
  gap: 18px;
}

.auth-tabs {
  min-height: 52px;
}

.auth-form {
  min-height: 422px;
  gap: 13px;
}

.auth-heading h2 {
  font-size: clamp(26px, 2.4vw, 32px);
  line-height: 1.08;
}

.auth-heading span {
  display: block;
  min-height: 46px;
}

.auth-form label {
  min-width: 0;
}

.auth-form input {
  min-width: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .78);
}

.auth-check {
  min-height: 22px;
}

.auth-form button {
  width: 100%;
}

.portal-auth-visual__content {
  padding: clamp(32px, 5vw, 54px);
}

.portal-auth-visual__content h1 {
  font-size: clamp(36px, 4vw, 48px);
}

@media (max-width: 1180px) {
  .home-today {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-today__head {
    grid-column: 1 / -1;
  }
}

@media (max-width: 980px) {
  .portal-auth-card {
    grid-template-columns: 1fr;
    width: min(100%, 720px);
  }

  .portal-auth-visual {
    min-height: 360px;
  }

  .auth-form {
    min-height: 0;
  }

  .auth-heading span {
    min-height: 0;
  }
}

@media (max-width: 720px) {
  .home-today {
    grid-template-columns: 1fr;
  }

  .material-next-steps {
    grid-template-columns: 1fr;
  }

  .xf-thread-tools {
    align-items: flex-start;
    flex-direction: column;
  }

  .xf-thread-tools nav {
    justify-content: flex-start;
  }

  .public-card__body h3 {
    min-height: 0;
  }
}

/* Wiki encyclopedia experience */
.wiki-native-page {
  min-height: calc(100vh - 56px);
  padding: 28px 16px 46px;
  background:
    linear-gradient(rgba(103, 83, 132, .36), rgba(237, 132, 116, .28)),
    url("/assets/hero-palms.webp") center top / cover fixed;
}

.wiki-native-card,
.wiki-comment-strip {
  width: min(100%, 980px);
  margin: 0 auto;
  border: 1px solid rgba(255, 255, 255, .6);
  border-radius: 10px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 28px 60px rgba(45, 39, 62, .22);
}

.wiki-native-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 20px 24px 0;
  color: #7f8795;
  font-size: 13px;
  font-weight: 900;
}

.wiki-native-breadcrumb a {
  color: #6fae3f;
}

.wiki-native-breadcrumb span::before,
.wiki-native-breadcrumb strong::before {
  content: ">";
  margin-right: 8px;
  color: #bbc1c9;
}

.wiki-native-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 270px;
  gap: 28px;
  padding: 24px;
  align-items: start;
}

.wiki-native-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-bottom: 10px;
}

.wiki-native-tags span,
.wiki-native-tags a {
  border-radius: 999px;
  padding: 6px 9px;
  background: #e5f1da;
  color: #58962f;
  font-size: 11px;
  font-weight: 1000;
  text-transform: uppercase;
}

.wiki-native-tags a {
  background: #f1edf6;
  color: var(--violet-dark);
}

.wiki-native-head h1 {
  margin: 0;
  color: #1d2430;
  font-size: 46px;
  line-height: .96;
}

.wiki-native-head p {
  max-width: 680px;
  color: #687384;
  font-size: 17px;
  line-height: 1.6;
}

.wiki-native-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wiki-native-meta span {
  border-radius: 999px;
  padding: 7px 10px;
  background: #f4f1f7;
  color: #58446d;
  font-size: 12px;
  font-weight: 900;
}

.wiki-native-cover,
.wiki-native-infobox,
.wiki-native-widget {
  overflow: hidden;
  border: 1px solid #d9e1ea;
  border-radius: 8px;
  background: #f7f9fb;
}

.wiki-native-cover {
  margin: 0;
}

.wiki-native-cover img,
.wiki-native-infobox img {
  width: 100%;
  height: 170px;
  object-fit: cover;
}

.wiki-native-cover figcaption {
  padding: 12px 14px;
  color: #2f3846;
  font-size: 18px;
  font-weight: 1000;
}

.wiki-native-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 275px;
  gap: 26px;
  padding: 0 24px 28px;
}

.wiki-native-article {
  min-width: 0;
}

.wiki-native-toc {
  margin-bottom: 22px;
  border: 1px solid #dde4ec;
  border-radius: 8px;
  padding: 16px;
  background: #f7f9fb;
}

.wiki-native-toc strong {
  display: block;
  margin-bottom: 10px;
  color: #7cae35;
  font-size: 12px;
  text-transform: uppercase;
}

.wiki-native-toc ol {
  columns: 2;
  margin: 0;
  padding-left: 20px;
}

.wiki-native-toc li {
  margin-bottom: 7px;
  color: #7cae35;
  font-weight: 900;
}

.wiki-native-toc .level-3 {
  margin-left: 14px;
  font-size: 13px;
}

.wiki-native-toc a {
  color: #596575;
}

.wiki-native-body,
.wiki-public-preview,
.editor-preview {
  color: #394555;
  font-size: 16px;
  line-height: 1.72;
}

.wiki-native-body h2,
.wiki-public-preview h2,
.editor-preview h2,
.public-article__body h2 {
  margin: 26px 0 12px;
  padding-left: 12px;
  border-left: 4px solid #74ad39;
  color: #1e2835;
  line-height: 1.15;
}

.wiki-native-body h3,
.wiki-public-preview h3,
.editor-preview h3,
.public-article__body h3 {
  margin: 22px 0 10px;
  color: #2f3846;
}

.wiki-lead {
  margin-bottom: 20px;
  border: 1px solid #e2e8ef;
  border-left: 4px solid #74ad39;
  border-radius: 8px;
  padding: 16px;
  background: #f9fbfd;
}

.wiki-fact-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  margin: 20px 0;
  border: 1px solid #d9e1ea;
  border-radius: 8px;
  background: #f5f8fb;
}

.wiki-fact-grid div {
  padding: 13px 14px;
  border-left: 1px solid #d9e1ea;
}

.wiki-fact-grid div:first-child {
  border-left: 0;
}

.wiki-fact-grid span {
  display: block;
  margin-bottom: 4px;
  color: #8893a1;
  font-size: 11px;
  font-weight: 1000;
  text-transform: uppercase;
}

.wiki-fact-grid strong {
  color: #1f2936;
}

.wiki-stat-table {
  width: 100%;
  margin: 18px 0;
  border-collapse: collapse;
  overflow: hidden;
  border: 1px solid #d9e1ea;
  border-radius: 8px;
  background: #fff;
}

.wiki-stat-table th,
.wiki-stat-table td {
  padding: 12px 13px;
  border-top: 1px solid #e5ebf1;
  text-align: left;
  vertical-align: top;
}

.wiki-stat-table tr:first-child th,
.wiki-stat-table tr:first-child td {
  border-top: 0;
}

.wiki-stat-table th {
  background: #f2f6fa;
  color: #778392;
  font-size: 12px;
  text-transform: uppercase;
}

.wiki-bars {
  display: grid;
  gap: 11px;
  margin: 18px 0;
  border: 1px solid #d9e1ea;
  border-radius: 8px;
  padding: 14px;
  background: #f7f9fb;
}

.wiki-bars div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) 96px;
  gap: 12px;
  align-items: center;
}

.wiki-bars span,
.wiki-bars em {
  color: #596575;
  font-size: 12px;
  font-style: normal;
  font-weight: 1000;
  text-transform: uppercase;
}

.wiki-bars b {
  position: relative;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #e3e9ef;
}

.wiki-bars b::after {
  content: "";
  display: block;
  width: 60%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #75b842, #9ccc55);
}

.wiki-bars .bar-45::after { width: 45%; }
.wiki-bars .bar-50::after { width: 50%; }
.wiki-bars .bar-70::after { width: 70%; }
.wiki-bars .bar-75::after { width: 75%; }
.wiki-bars .bar-80::after { width: 80%; }
.wiki-bars .bar-85::after { width: 85%; }

.wiki-native-side {
  display: grid;
  gap: 14px;
  align-self: start;
}

.wiki-native-infobox h2,
.wiki-native-infobox dl,
.wiki-native-infobox .primary-button {
  margin-left: 14px;
  margin-right: 14px;
}

.wiki-native-infobox h2 {
  color: #1f2936;
  font-size: 22px;
}

.wiki-native-infobox dl {
  display: grid;
  margin-bottom: 14px;
}

.wiki-native-infobox dl div {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 10px;
  padding: 9px 0;
  border-top: 1px solid #e1e7ee;
}

.wiki-native-infobox dt {
  color: #7d8997;
  font-size: 11px;
  font-weight: 1000;
  text-transform: uppercase;
}

.wiki-native-infobox dd {
  margin: 0;
  color: #2f3846;
  font-weight: 900;
}

.wiki-native-infobox .primary-button {
  display: block;
  margin-bottom: 14px;
  text-align: center;
}

.wiki-native-widget {
  display: grid;
  gap: 8px;
  padding: 14px;
}

.wiki-native-widget h2 {
  margin: 0 0 4px;
  color: #1f2936;
  font-size: 18px;
}

.wiki-native-widget a {
  display: grid;
  gap: 2px;
  border: 1px solid #e3e8ef;
  border-radius: 7px;
  padding: 10px;
  background: #fff;
}

.wiki-native-widget strong {
  color: #58446d;
}

.wiki-native-widget span {
  color: #768190;
  font-size: 13px;
}

.wiki-comment-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 480px);
  gap: 18px;
  align-items: start;
  margin-top: 18px;
  padding: 18px;
}

.wiki-comment-strip h2 {
  margin: 0;
}

.wiki-comment-panel {
  grid-template-columns: 1fr;
}

.wiki-comment-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.wiki-comment-head span {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #e5f1da;
  color: #58962f;
  font-weight: 1000;
}

.wiki-comments-empty {
  margin: 0;
  border: 1px dashed #d9e1ea;
  border-radius: 8px;
  padding: 16px;
  color: #768190;
  text-align: center;
}

.wiki-hub-layout,
.wiki-create-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 18px;
  margin-bottom: 18px;
}

.wiki-hub-main,
.wiki-hub-side,
.wiki-create-guide,
.wiki-create-form {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(45, 39, 62, .08);
}

.wiki-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 168px;
  gap: 12px;
}

.wiki-hub-grid a {
  position: relative;
  overflow: hidden;
  display: grid;
  align-content: end;
  border-radius: 8px;
  padding: 15px;
  color: #fff;
}

.wiki-hub-grid a.is-large {
  grid-row: span 2;
}

.wiki-hub-grid img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wiki-hub-grid a::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(24, 28, 39, .05), rgba(33, 29, 48, .86));
}

.wiki-hub-grid span,
.wiki-hub-grid p {
  position: relative;
  z-index: 1;
}

.wiki-hub-grid span {
  font-size: 22px;
  font-weight: 1000;
}

.wiki-hub-grid p {
  margin: 5px 0 0;
  color: rgba(255, 255, 255, .84);
}

.wiki-hub-side {
  align-self: start;
  display: grid;
  gap: 12px;
}

.wiki-hub-side h2,
.wiki-create-guide h2 {
  margin: 0 0 10px;
  color: var(--violet-dark);
}

.wiki-hub-side div,
.wiki-create-guide div {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  padding: 10px 0;
  border-top: 1px solid #eee8f2;
}

.wiki-hub-side strong,
.wiki-create-guide strong {
  display: grid;
  place-items: center;
  min-width: 28px;
  min-height: 28px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--violet), var(--coral));
  color: #fff;
  font-size: 12px;
}

.wiki-hub-side span,
.wiki-create-guide span {
  color: var(--muted);
  line-height: 1.45;
}

.wiki-create-page {
  padding: 28px 16px 44px;
  background:
    radial-gradient(circle at 10% 0, rgba(108, 192, 198, .18), transparent 28%),
    radial-gradient(circle at 92% 12%, rgba(236, 130, 119, .22), transparent 34%),
    #f0eef4;
}

.wiki-create-hero,
.wiki-create-layout {
  width: min(100%, 1180px);
  margin-left: auto;
  margin-right: auto;
}

.wiki-create-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 18px;
  align-items: end;
  margin-bottom: 18px;
  border-radius: 10px;
  padding: 26px;
  background:
    linear-gradient(90deg, rgba(38, 29, 56, .92), rgba(104, 73, 120, .74), rgba(236, 130, 119, .34)),
    url("/assets/knowledge-base.webp") center / cover;
  color: #fff;
  box-shadow: 0 22px 44px rgba(45, 39, 62, .18);
}

.wiki-create-hero h1 {
  margin: 0 0 10px;
  font-size: 42px;
}

.wiki-create-hero p {
  max-width: 760px;
  color: rgba(255, 255, 255, .86);
}

.wiki-create-hero aside {
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 10px;
  padding: 16px;
  background: rgba(255, 255, 255, .14);
}

.wiki-create-hero aside span {
  display: block;
  font-size: 38px;
  font-weight: 1000;
}

.wiki-create-hero aside small {
  color: rgba(255, 255, 255, .78);
}

.wiki-create-layout {
  grid-template-columns: 310px minmax(0, 1fr);
}

.wiki-create-guide {
  align-self: start;
}

.wiki-create-form {
  display: grid;
  gap: 14px;
}

.wiki-public-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 8px;
  background: linear-gradient(135deg, #fbf9fd, #fff5f1);
}

.wiki-public-toolbar button {
  border: 1px solid #d8d1e1;
  border-radius: 7px;
  padding: 8px 10px;
  background: #fff;
  color: var(--violet-dark);
  font-weight: 900;
  cursor: pointer;
}

.wiki-public-toolbar button:hover {
  border-color: var(--coral);
  color: var(--ink);
}

.wiki-public-preview {
  overflow: auto;
  max-height: 460px;
  border: 1px solid #e3dfea;
  border-radius: 9px;
  padding: 16px;
  background: #fff;
}

.wiki-create-submit {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  border-top: 1px solid #eee8f2;
  padding-top: 14px;
}

.wiki-create-submit p {
  margin: 0;
  color: var(--muted);
}

@media (max-width: 980px) {
  .wiki-native-head,
  .wiki-native-layout,
  .wiki-comment-strip,
  .wiki-hub-layout,
  .wiki-create-hero,
  .wiki-create-layout {
    grid-template-columns: 1fr;
  }

  .wiki-hub-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .wiki-native-page,
  .wiki-create-page {
    padding: 14px 10px 32px;
  }

  .wiki-native-head,
  .wiki-native-layout,
  .wiki-native-breadcrumb,
  .wiki-create-hero {
    padding-left: 16px;
    padding-right: 16px;
  }

  .wiki-native-head h1,
  .wiki-create-hero h1 {
    font-size: 34px;
  }

  .wiki-native-toc ol {
    columns: 1;
  }

  .wiki-fact-grid,
  .wiki-hub-grid {
    grid-template-columns: 1fr;
  }

  .wiki-fact-grid div {
    border-left: 0;
    border-top: 1px solid #d9e1ea;
  }

  .wiki-fact-grid div:first-child {
    border-top: 0;
  }

  .wiki-bars div,
  .wiki-create-submit {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }
}

/* Public section dashboards use live repository data instead of instructional cards. */
.section-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 16px;
}

.section-dashboard article {
  min-width: 0;
  border: 1px solid #ddd6e5;
  border-radius: 10px;
  padding: 15px 16px;
  background: linear-gradient(145deg, #fff 0%, #faf7fc 100%);
  box-shadow: 0 10px 24px rgba(45, 39, 62, .07);
}

.section-dashboard span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.section-dashboard strong {
  display: block;
  overflow: hidden;
  color: var(--violet-dark);
  font-size: clamp(22px, 2.7vw, 34px);
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.section-dashboard--server article:nth-child(2),
.section-dashboard--file article:nth-child(3) {
  border-color: rgba(230, 111, 99, .36);
  background: linear-gradient(145deg, #fff 0%, #fff3ef 100%);
}

.public-card__metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.public-card__metrics span {
  border-radius: 999px;
  padding: 6px 9px;
  background: #f2edf6;
  color: #5d526a;
  font-size: 11px;
  font-weight: 900;
}

@media (max-width: 820px) {
  .page-shell:not(.page-shell--single) {
    grid-template-columns: minmax(0, 1fr);
  }

  .home-shell > .content,
  .home-sidebar {
    min-width: 0;
  }

  .section-dashboard {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .section-dashboard {
    gap: 8px;
  }

  .section-dashboard article {
    padding: 13px 12px;
  }

  .section-dashboard strong {
    font-size: 23px;
  }
}

@media (max-width: 980px) {
  .forum-admin-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .forum-admin-post {
    grid-template-columns: 1fr;
  }

  .forum-post-tools {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .forum-admin-metrics {
    grid-template-columns: 1fr;
  }

  .forum-topic-tools,
  .forum-topic-tools select,
  .forum-topic-tools input,
  .forum-post-tools,
  .forum-post-tools select {
    width: 100%;
  }

  .forum-post-tools .admin-button,
  .forum-topic-tools .admin-button {
    justify-content: center;
  }
}

/* ========================================================================== */
/* GTA6 HUB — public visual system 2026                                       */
/* ========================================================================== */

:root {
  --neo-ink: #10131c;
  --neo-night: #080b12;
  --neo-night-soft: #111622;
  --neo-surface: #ffffff;
  --neo-surface-soft: #f2f4f8;
  --neo-line: rgba(18, 23, 36, .12);
  --neo-cyan: #57e3f2;
  --neo-coral: #ff6f7d;
  --neo-violet: #9278ff;
  --neo-lime: #b9f28b;
  --neo-radius: 18px;
  --neo-shadow: 0 24px 70px rgba(8, 11, 18, .16);
}

body:not(.admin-body) {
  background: #f1f3f7;
  color: var(--neo-ink);
  font-family: "Segoe UI Variable", "Segoe UI", Inter, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body:not(.admin-body) h1,
body:not(.admin-body) h2,
body:not(.admin-body) h3,
body:not(.admin-body) strong {
  text-wrap: balance;
}

.topbar {
  min-height: 76px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  background: rgba(8, 11, 18, .92);
  box-shadow: none;
  backdrop-filter: blur(18px) saturate(140%);
}

.topbar__inner {
  width: min(100%, 1440px);
  min-height: 76px;
  gap: 28px;
  padding: 0 24px;
}

.brand--modern {
  flex: 0 0 auto;
  gap: 10px;
  align-items: center;
  color: #fff;
  font-family: inherit;
  text-shadow: none;
  text-transform: none;
}

.brand__mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 11px;
  background: linear-gradient(145deg, var(--neo-violet), var(--neo-coral));
  box-shadow: 0 9px 25px rgba(146, 120, 255, .22);
}

.brand__mark::after {
  content: "";
  position: absolute;
  inset: 1px;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 9px;
}

.brand__mark b {
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: 23px;
  font-style: italic;
  font-weight: 950;
  line-height: 1;
}

.brand__copy {
  display: grid;
  gap: 2px;
}

.brand__copy strong {
  color: #fff;
  font-size: 14px;
  font-weight: 950;
  letter-spacing: .08em;
  line-height: 1;
}

.brand__copy em {
  color: rgba(255, 255, 255, .5);
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .14em;
  line-height: 1;
  text-transform: uppercase;
}

.topnav {
  min-width: 0;
  gap: 4px;
  align-items: center;
}

.topnav a {
  position: relative;
  border-radius: 9px;
  padding: 10px 11px;
  color: rgba(255, 255, 255, .66);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .01em;
  opacity: 1;
  transition: color .2s ease, background .2s ease;
}

.topnav a:hover,
.topnav a.is-active {
  background: rgba(255, 255, 255, .07);
  color: #fff;
}

.topnav a.is-active::after {
  content: "";
  position: absolute;
  right: 11px;
  bottom: 4px;
  left: 11px;
  height: 2px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--neo-cyan), var(--neo-coral));
}

.topbar__utilities {
  margin-left: auto;
  display: flex;
  gap: 6px;
}

.topbar__utility {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 9px;
  padding: 9px 11px;
  color: rgba(255, 255, 255, .72);
  font-size: 11px;
  font-weight: 800;
}

.neo-live-dot {
  width: 7px;
  height: 7px;
  display: inline-block;
  border-radius: 50%;
  background: #7efaaf;
  box-shadow: 0 0 0 4px rgba(126, 250, 175, .1), 0 0 15px rgba(126, 250, 175, .55);
}

.profile-button--modern {
  width: auto;
  min-width: 42px;
  height: 42px;
  display: flex;
  gap: 8px;
  margin-left: 0;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 11px;
  background: #fff;
  color: #111520;
}

.profile-button--modern span {
  max-width: 100px;
  overflow: hidden;
  font-size: 11px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-site-nav {
  color: #fff;
}

/* Public pages outside the homepage */
.page-shell,
.inner-page {
  width: min(100% - 32px, 1360px);
}

.page-shell {
  gap: 20px;
  padding-top: 22px;
  padding-bottom: 48px;
}

.sub-hero {
  min-height: 270px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 22px;
  background: var(--neo-night);
  box-shadow: var(--neo-shadow);
}

.sub-hero::after {
  background: linear-gradient(90deg, rgba(8, 11, 18, .95) 0%, rgba(8, 11, 18, .56) 52%, rgba(8, 11, 18, .08) 100%);
}

.sub-hero > div {
  max-width: 720px;
  padding: clamp(28px, 5vw, 62px);
}

.sub-hero h1 {
  max-width: 680px;
  color: #fff;
  font-size: clamp(34px, 5vw, 66px);
  font-weight: 850;
  letter-spacing: -.055em;
  line-height: .98;
}

.sub-hero p:not(.eyebrow) {
  max-width: 650px;
  color: rgba(255, 255, 255, .72);
  font-size: 15px;
}

.section-dashboard article,
.public-card,
.portal-card,
.panel-widget,
.home-live-card {
  border-color: var(--neo-line);
  border-radius: 16px;
  box-shadow: 0 15px 40px rgba(26, 31, 45, .07);
}

.section-dashboard article {
  padding: 18px 19px;
  background: rgba(255, 255, 255, .88);
}

.section-dashboard strong {
  color: var(--neo-ink);
  font-weight: 850;
  letter-spacing: -.035em;
}

.public-section-head {
  border-radius: 16px;
  padding: 20px 22px;
  background: #fff;
  box-shadow: 0 12px 35px rgba(26, 31, 45, .06);
}

.public-card {
  overflow: hidden;
  background: #fff;
}

.public-card__image {
  overflow: hidden;
  border-radius: 12px 12px 0 0;
}

.public-card__body h3 {
  color: var(--neo-ink);
  font-size: 18px;
  font-weight: 820;
  letter-spacing: -.025em;
}

/* Homepage */
.neo-home {
  position: relative;
  overflow: hidden;
  background: var(--neo-night);
  color: #fff;
}

.neo-home::before {
  content: "";
  position: absolute;
  top: 740px;
  left: 50%;
  width: 900px;
  height: 900px;
  border-radius: 50%;
  background: rgba(77, 91, 181, .08);
  filter: blur(100px);
  transform: translateX(-50%);
  pointer-events: none;
}

.neo-hero {
  min-height: clamp(610px, 76vh, 820px);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #07101f;
}

.neo-hero__image,
.neo-hero__veil {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.neo-hero__image {
  z-index: -3;
  object-fit: cover;
  object-position: center;
  animation: neoHeroReveal 1.2s ease both;
}

.neo-hero__veil {
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(5, 9, 17, .98) 0%, rgba(5, 9, 17, .86) 34%, rgba(5, 9, 17, .34) 65%, rgba(5, 9, 17, .12) 100%),
    linear-gradient(0deg, var(--neo-night) 0%, transparent 35%);
}

.neo-hero__inner {
  width: min(100% - 48px, 1380px);
  min-height: clamp(610px, 76vh, 820px);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  padding: 70px 0 148px;
}

.neo-hero__copy {
  width: min(680px, 100%);
  animation: neoRise .8s .12s ease both;
}

.neo-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  color: rgba(255, 255, 255, .66);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .17em;
  text-transform: uppercase;
}

.neo-kicker span,
.neo-kicker i {
  width: 30px;
  height: 2px;
  display: block;
  border-radius: 20px;
  background: linear-gradient(90deg, var(--neo-cyan), var(--neo-coral));
}

.neo-hero h1 {
  max-width: 750px;
  margin: 0;
  color: #fff;
  font-size: clamp(48px, 7vw, 96px);
  font-weight: 860;
  letter-spacing: -.072em;
  line-height: .91;
}

.neo-hero__copy > p {
  max-width: 610px;
  margin: 27px 0 0;
  color: rgba(255, 255, 255, .68);
  font-size: clamp(16px, 1.7vw, 20px);
  line-height: 1.55;
}

.neo-hero__actions,
.neo-community__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 34px;
}

.neo-button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 1px solid transparent;
  border-radius: 11px;
  padding: 0 18px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .025em;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.neo-button:hover {
  transform: translateY(-2px);
}

.neo-button--primary {
  background: #fff;
  color: var(--neo-ink);
  box-shadow: 0 16px 45px rgba(0, 0, 0, .22);
}

.neo-button--primary span {
  color: #785dff;
  font-size: 16px;
}

.neo-button--glass {
  border-color: rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .06);
  color: #fff;
  backdrop-filter: blur(8px);
}

.neo-button--dark {
  background: var(--neo-ink);
  color: #fff;
}

.neo-hero__dock {
  position: absolute;
  right: 0;
  bottom: 28px;
  left: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 14px;
  background: rgba(8, 11, 18, .52);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .2);
  backdrop-filter: blur(18px);
  animation: neoRise .8s .25s ease both;
}

.neo-hero__dock a {
  min-width: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 13px;
  align-items: center;
  position: relative;
  padding: 19px 22px;
  transition: background .2s ease;
}

.neo-hero__dock a:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, .1);
}

.neo-hero__dock a:hover {
  background: rgba(255, 255, 255, .06);
}

.neo-hero__dock span {
  grid-row: 1 / 3;
  color: rgba(255, 255, 255, .34);
  font-size: 10px;
  font-weight: 900;
}

.neo-hero__dock strong {
  color: #fff;
  font-size: 14px;
  font-weight: 850;
}

.neo-hero__dock em {
  overflow: hidden;
  color: rgba(255, 255, 255, .48);
  font-size: 9px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.neo-announcement,
.neo-pulse,
.neo-home__body {
  width: min(100% - 48px, 1380px);
  margin-right: auto;
  margin-left: auto;
}

.neo-announcement {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 17px;
  align-items: center;
  position: relative;
  z-index: 2;
  margin-top: 20px;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 13px;
  padding: 16px 18px;
  background: rgba(255, 255, 255, .045);
}

.neo-announcement__signal {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--neo-coral);
  box-shadow: 0 0 0 6px rgba(255, 111, 125, .1);
}

.neo-announcement div {
  min-width: 0;
}

.neo-announcement small,
.neo-announcement strong,
.neo-announcement p {
  display: inline;
}

.neo-announcement small {
  margin-right: 10px;
  color: var(--neo-coral);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.neo-announcement strong {
  color: #fff;
  font-size: 12px;
}

.neo-announcement p {
  margin-left: 7px;
  color: rgba(255, 255, 255, .54);
  font-size: 11px;
}

.neo-announcement > a {
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.neo-pulse {
  display: grid;
  grid-template-columns: 1.45fr repeat(4, 1fr);
  position: relative;
  z-index: 2;
  margin-top: 20px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 14px;
  background: #0d111b;
}

.neo-pulse > div,
.neo-pulse > a {
  min-width: 0;
  min-height: 76px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  padding: 14px 20px;
}

.neo-pulse > :not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, .08);
}

.neo-pulse > div:first-child {
  padding-left: 46px;
}

.neo-pulse .neo-live-dot {
  position: absolute;
  left: 23px;
}

.neo-pulse small {
  color: rgba(255, 255, 255, .38);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.neo-pulse strong {
  overflow: hidden;
  color: #fff;
  font-size: 13px;
  font-weight: 780;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.neo-pulse > div:not(:first-child) strong {
  font-size: 22px;
  letter-spacing: -.04em;
}

.neo-pulse > a span {
  color: var(--neo-cyan);
}

.neo-home__body {
  position: relative;
  z-index: 1;
  padding: 96px 0 110px;
}

.neo-editorial,
.neo-sections,
.neo-live {
  margin-bottom: 110px;
}

.neo-section-head {
  display: grid;
  grid-template-columns: minmax(260px, .85fr) minmax(300px, 1fr) auto;
  gap: 32px;
  align-items: end;
  margin-bottom: 31px;
}

.neo-section-head > div > span,
.neo-empty-state > div > span,
.neo-final-cta > div > span {
  display: block;
  margin-bottom: 10px;
  color: var(--neo-coral);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.neo-section-head h2,
.neo-empty-state h2,
.neo-final-cta h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(34px, 4.3vw, 58px);
  font-weight: 820;
  letter-spacing: -.055em;
  line-height: .98;
}

.neo-section-head > p {
  max-width: 480px;
  margin: 0;
  color: rgba(255, 255, 255, .46);
  font-size: 13px;
  line-height: 1.65;
}

.neo-section-head > a {
  border-bottom: 1px solid rgba(255, 255, 255, .2);
  padding-bottom: 5px;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.neo-section-head > a span {
  color: var(--neo-cyan);
}

.neo-editorial__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.42fr) minmax(340px, .88fr);
  gap: 17px;
}

.neo-feature {
  min-height: 570px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: var(--neo-radius);
  background: var(--neo-night-soft);
}

.neo-feature > img,
.neo-feature__shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.neo-feature > img {
  object-fit: cover;
  transition: transform .55s cubic-bezier(.2, .75, .2, 1);
}

.neo-feature:hover > img {
  transform: scale(1.035);
}

.neo-feature__shade {
  background: linear-gradient(0deg, rgba(7, 10, 17, .97) 0%, rgba(7, 10, 17, .54) 54%, rgba(7, 10, 17, .06) 100%);
}

.neo-feature__content {
  max-width: 760px;
  position: relative;
  z-index: 1;
  padding: clamp(25px, 4vw, 50px);
}

.neo-feature__content > span,
.neo-story-list small,
.neo-module small {
  color: var(--neo-cyan);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.neo-feature h3 {
  margin: 13px 0 14px;
  color: #fff;
  font-size: clamp(30px, 4vw, 58px);
  font-weight: 820;
  letter-spacing: -.055em;
  line-height: .98;
}

.neo-feature p {
  max-width: 640px;
  margin: 0 0 23px;
  color: rgba(255, 255, 255, .58);
  font-size: 13px;
  line-height: 1.6;
}

.neo-feature__content > strong {
  display: inline-flex;
  gap: 10px;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
}

.neo-feature__content > strong em {
  color: var(--neo-coral);
  font-size: 15px;
  font-style: normal;
}

.neo-story-list {
  display: grid;
  align-content: start;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: var(--neo-radius);
  background: #0d111b;
}

.neo-story-list > a {
  min-width: 0;
  display: grid;
  grid-template-columns: 92px 28px 1fr;
  gap: 13px;
  align-items: center;
  padding: 13px;
  transition: background .2s ease;
}

.neo-story-list > a:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, .075);
}

.neo-story-list > a:hover {
  background: rgba(255, 255, 255, .045);
}

.neo-story-list img {
  width: 92px;
  aspect-ratio: 1.35;
  border-radius: 9px;
  object-fit: cover;
}

.neo-story-list > a > span {
  color: rgba(255, 255, 255, .25);
  font-size: 10px;
  font-weight: 900;
}

.neo-story-list div {
  min-width: 0;
}

.neo-story-list small {
  color: rgba(87, 227, 242, .7);
}

.neo-story-list strong {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 5px;
  color: #fff;
  font-size: 13px;
  font-weight: 760;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.neo-empty-state {
  min-height: 280px;
  display: flex;
  gap: 30px;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 100px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: var(--neo-radius);
  padding: clamp(28px, 5vw, 60px);
  background: linear-gradient(135deg, #111725, #0c1019);
}

.neo-empty-state p {
  max-width: 560px;
  color: rgba(255, 255, 255, .5);
}

.neo-bento {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 270px;
  gap: 14px;
}

.neo-module {
  min-width: 0;
  overflow: hidden;
  position: relative;
  isolation: isolate;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: var(--neo-radius);
  background: #111621;
}

.neo-module--wide {
  grid-column: span 2;
  grid-row: span 2;
}

.neo-module > img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.76) brightness(.7);
  transition: transform .55s ease, filter .55s ease;
}

.neo-module::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(0deg, rgba(6, 9, 15, .96) 0%, rgba(6, 9, 15, .32) 75%);
}

.neo-module:hover > img {
  filter: saturate(.95) brightness(.82);
  transform: scale(1.045);
}

.neo-module__mark {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  position: absolute;
  top: 17px;
  left: 17px;
  border: 1px solid rgba(255, 255, 255, .17);
  border-radius: 10px;
  background: rgba(7, 10, 16, .5);
  color: #fff;
  font-size: 11px;
  font-weight: 950;
  backdrop-filter: blur(8px);
}

.neo-module > div {
  position: absolute;
  right: 22px;
  bottom: 22px;
  left: 22px;
}

.neo-module strong {
  display: block;
  margin-top: 7px;
  color: #fff;
  font-size: clamp(22px, 3vw, 43px);
  font-weight: 820;
  letter-spacing: -.045em;
  line-height: 1;
}

.neo-module:not(.neo-module--wide) strong {
  font-size: 25px;
}

.neo-module p {
  max-width: 430px;
  margin: 9px 0 0;
  color: rgba(255, 255, 255, .53);
  font-size: 10px;
  line-height: 1.45;
}

.neo-module > em {
  position: absolute;
  top: 18px;
  right: 19px;
  color: rgba(255, 255, 255, .62);
  font-size: 18px;
  font-style: normal;
}

.neo-community {
  min-height: 620px;
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  overflow: hidden;
  margin-bottom: 110px;
  border-radius: 22px;
  background: #f3f1ee;
  color: var(--neo-ink);
  box-shadow: 0 35px 100px rgba(0, 0, 0, .26);
}

.neo-community__visual {
  min-height: 620px;
  position: relative;
  overflow: hidden;
}

.neo-community__visual > img {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  object-fit: cover;
}

.neo-community__visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(7, 10, 16, .85), transparent 55%);
}

.neo-community__visual > div {
  position: absolute;
  right: 34px;
  bottom: 32px;
  left: 34px;
  z-index: 1;
}

.neo-community__visual span {
  color: var(--neo-cyan);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.neo-community__visual strong {
  max-width: 440px;
  display: block;
  margin-top: 8px;
  color: #fff;
  font-size: 28px;
  font-weight: 820;
  letter-spacing: -.04em;
  line-height: 1.05;
}

.neo-community__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(36px, 6vw, 82px);
}

.neo-kicker--dark {
  color: #727583;
}

.neo-community__copy h2 {
  margin: 0;
  color: var(--neo-ink);
  font-size: clamp(38px, 5vw, 68px);
  font-weight: 830;
  letter-spacing: -.065em;
  line-height: .94;
}

.neo-community__copy > p {
  margin: 24px 0 0;
  color: #666b78;
  font-size: 14px;
  line-height: 1.7;
}

.neo-points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 30px;
}

.neo-points span {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 9px;
  align-items: center;
  border: 1px solid rgba(16, 19, 28, .1);
  border-radius: 10px;
  padding: 11px 13px;
  background: rgba(255, 255, 255, .62);
  color: #757986;
  font-size: 9px;
  font-weight: 750;
}

.neo-points strong {
  color: #765fff;
  font-size: 14px;
  font-weight: 900;
}

.neo-community__actions > a:not(.neo-button) {
  color: var(--neo-ink);
  font-size: 10px;
  font-weight: 900;
}

.neo-community__actions > a:not(.neo-button) span {
  color: #765fff;
}

.neo-live__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.neo-live-card {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: var(--neo-radius);
  background: #0e131e;
  box-shadow: none;
}

.neo-live-card > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  padding: 17px 19px;
}

.neo-live-card > header span {
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

.neo-live-card > header a {
  color: rgba(255, 255, 255, .42);
  font-size: 9px;
  font-weight: 850;
}

.neo-live-card > a {
  display: block;
  padding: 16px 19px;
  transition: background .2s ease;
}

.neo-live-card > a:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, .065);
}

.neo-live-card > a:hover {
  background: rgba(255, 255, 255, .035);
}

.neo-live-card > a strong {
  display: block;
  overflow: hidden;
  color: #fff;
  font-size: 12px;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.neo-live-card > a small {
  display: block;
  margin-top: 5px;
  color: rgba(255, 255, 255, .37);
  font-size: 9px;
}

.neo-person {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 15px 19px;
}

.neo-person:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, .065);
}

.neo-person span {
  color: var(--neo-coral);
  font-size: 9px;
  font-weight: 900;
}

.neo-person strong {
  overflow: hidden;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.neo-person em {
  color: rgba(255, 255, 255, .42);
  font-size: 9px;
  font-style: normal;
}

.neo-final-cta {
  min-height: 310px;
  display: flex;
  gap: 40px;
  align-items: flex-end;
  justify-content: space-between;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 22px;
  padding: clamp(30px, 6vw, 70px);
  background:
    radial-gradient(circle at 85% 20%, rgba(146, 120, 255, .24), transparent 34%),
    radial-gradient(circle at 5% 95%, rgba(255, 111, 125, .17), transparent 30%),
    #101521;
}

.neo-final-cta > div:first-child {
  max-width: 760px;
}

.neo-final-cta h2 {
  font-size: clamp(38px, 5.5vw, 70px);
}

.neo-final-cta p {
  max-width: 590px;
  color: rgba(255, 255, 255, .5);
  font-size: 13px;
}

.neo-final-cta > div:last-child {
  display: grid;
  gap: 13px;
  justify-items: center;
}

.neo-final-cta > div:last-child > a:not(.neo-button) {
  color: rgba(255, 255, 255, .5);
  font-size: 9px;
  font-weight: 800;
}

/* Footer */
.site-footer {
  border-top: 1px solid rgba(255, 255, 255, .09);
  background: #070a10;
  color: #fff;
}

.site-footer__lead,
.site-footer__inner {
  width: min(100% - 48px, 1380px);
  margin-right: auto;
  margin-left: auto;
}

.site-footer__lead {
  display: flex;
  gap: 30px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255, 255, 255, .09);
  padding: 38px 0;
}

.site-footer__lead div {
  display: grid;
  gap: 5px;
}

.site-footer__lead div > span {
  color: var(--neo-coral);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.site-footer__lead strong {
  color: #fff;
  font-size: clamp(20px, 3vw, 33px);
  font-weight: 780;
  letter-spacing: -.035em;
}

.site-footer__lead > a {
  flex: 0 0 auto;
  border-radius: 10px;
  padding: 13px 16px;
  background: #fff;
  color: var(--neo-ink);
  font-size: 10px;
  font-weight: 900;
}

.site-footer__lead > a span {
  color: #735dff;
}

.site-footer__inner {
  grid-template-columns: 1.65fr repeat(3, minmax(140px, .65fr));
  gap: 55px;
  padding: 48px 0 60px;
}

.site-footer__inner > div > p {
  max-width: 460px;
  color: rgba(255, 255, 255, .38);
  font-size: 11px;
}

.site-footer h3 {
  color: rgba(255, 255, 255, .36);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.site-footer nav {
  gap: 8px;
}

.site-footer nav a {
  color: rgba(255, 255, 255, .68);
  font-size: 11px;
  font-weight: 650;
}

.site-footer nav a:hover {
  color: #fff;
}

@keyframes neoHeroReveal {
  from { opacity: 0; transform: scale(1.035); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes neoRise {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1120px) {
  .topbar__inner { gap: 15px; }
  .topnav a { padding-inline: 8px; }
  .topbar__utilities { display: none; }
  .neo-editorial__grid { grid-template-columns: minmax(0, 1.15fr) minmax(310px, .85fr); }
  .neo-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .neo-module--wide { grid-row: span 1; }
  .neo-section-head { grid-template-columns: minmax(260px, .9fr) 1fr auto; }
}

@media (max-width: 980px) {
  .topbar__inner { min-height: 68px; flex-wrap: nowrap; padding-block: 8px; }
  .topnav { display: none; }
  .mobile-site-nav { margin-left: auto; }
  .profile-button--modern span { display: none; }
  .profile-button--modern { width: 42px; padding: 0; }
  .neo-hero__inner { padding-bottom: 185px; }
  .neo-hero__dock { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .neo-hero__dock a:nth-child(2) { border-right: 0; }
  .neo-hero__dock a:nth-child(-n+2) { border-bottom: 1px solid rgba(255, 255, 255, .1); }
  .neo-pulse { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .neo-pulse > div:first-child { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .08); }
  .neo-pulse > :nth-child(4) { border-right: 0; }
  .neo-pulse > a { grid-column: span 4; border-top: 1px solid rgba(255, 255, 255, .08); }
  .neo-section-head { grid-template-columns: 1fr auto; }
  .neo-section-head > p { grid-column: 1 / -1; grid-row: 2; }
  .neo-editorial__grid { grid-template-columns: 1fr; }
  .neo-feature { min-height: 520px; }
  .neo-story-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .neo-story-list > a:nth-child(odd) { border-right: 1px solid rgba(255, 255, 255, .075); }
  .neo-community { grid-template-columns: 1fr; }
  .neo-community__visual { min-height: 480px; }
  .neo-live__grid { grid-template-columns: 1fr 1fr; }
  .neo-live-card--people { grid-column: 1 / -1; }
  .site-footer__inner { grid-template-columns: repeat(3, 1fr); }
  .site-footer__inner > div { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
  .topbar__inner { padding-inline: 14px; }
  .brand__copy em { display: none; }
  .mobile-site-nav summary em { display: none; }
  .mobile-site-nav nav { right: -48px; }
  .neo-hero { min-height: 700px; }
  .neo-hero__inner,
  .neo-announcement,
  .neo-pulse,
  .neo-home__body,
  .site-footer__lead,
  .site-footer__inner { width: min(100% - 28px, 1380px); }
  .neo-hero__inner { min-height: 700px; justify-content: flex-start; padding-top: 82px; padding-bottom: 250px; }
  .neo-hero__image { object-position: 64% center; }
  .neo-hero__veil { background: linear-gradient(90deg, rgba(5, 9, 17, .97), rgba(5, 9, 17, .54)), linear-gradient(0deg, var(--neo-night), transparent 45%); }
  .neo-hero h1 { font-size: clamp(44px, 15vw, 66px); }
  .neo-hero__copy > p { font-size: 15px; }
  .neo-hero__actions { align-items: stretch; flex-direction: column; }
  .neo-hero__actions .neo-button { width: 100%; }
  .neo-hero__dock { bottom: 16px; }
  .neo-hero__dock a { padding: 14px 13px; }
  .neo-hero__dock em { display: none; }
  .neo-announcement { grid-template-columns: auto 1fr; }
  .neo-announcement p { display: block; margin: 4px 0 0; }
  .neo-announcement > a { grid-column: 2; }
  .neo-pulse { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .neo-pulse > :nth-child(2) { border-right: 1px solid rgba(255, 255, 255, .08); }
  .neo-pulse > :nth-child(3) { border-right: 0; }
  .neo-pulse > :nth-child(4) { border-top: 1px solid rgba(255, 255, 255, .08); border-right: 1px solid rgba(255, 255, 255, .08); }
  .neo-pulse > a { grid-column: span 2; }
  .neo-home__body { padding-top: 72px; padding-bottom: 80px; }
  .neo-editorial, .neo-sections, .neo-live, .neo-community { margin-bottom: 78px; }
  .neo-section-head { grid-template-columns: 1fr; gap: 14px; }
  .neo-section-head > p, .neo-section-head > a { grid-column: auto; grid-row: auto; }
  .neo-section-head h2 { font-size: 40px; }
  .neo-feature { min-height: 500px; }
  .neo-feature__content { padding: 24px; }
  .neo-feature h3 { font-size: 35px; }
  .neo-story-list { grid-template-columns: 1fr; }
  .neo-story-list > a:nth-child(odd) { border-right: 0; }
  .neo-story-list > a { grid-template-columns: 78px 23px 1fr; }
  .neo-story-list img { width: 78px; }
  .neo-bento { grid-template-columns: 1fr; grid-auto-rows: 250px; }
  .neo-module--wide { grid-column: auto; }
  .neo-community__visual { min-height: 360px; }
  .neo-community__copy { padding: 34px 25px 40px; }
  .neo-community__copy h2 { font-size: 44px; }
  .neo-points { grid-template-columns: 1fr; }
  .neo-live__grid { grid-template-columns: 1fr; }
  .neo-live-card--people { grid-column: auto; }
  .neo-final-cta { align-items: stretch; flex-direction: column; padding: 35px 25px; }
  .neo-final-cta h2 { font-size: 43px; }
  .neo-final-cta > div:last-child { justify-items: stretch; }
  .site-footer__lead { align-items: stretch; flex-direction: column; }
  .site-footer__lead > a { align-self: flex-start; }
  .site-footer__inner { grid-template-columns: repeat(2, 1fr); gap: 35px 24px; }
  .site-footer__inner nav:last-child { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  .neo-hero__image,
  .neo-hero__copy,
  .neo-hero__dock { animation: none; }
  .neo-feature > img,
  .neo-module > img { transition: none; }
}

/* ========================================================================== */
/* GTA6 HUB — section, material and account refresh                           */
/* ========================================================================== */

.section-page,
.material-page,
.forum-page,
.forum-topic-page,
.account-page {
  gap: 18px;
  padding-top: 22px;
}

.section-page > .sub-hero {
  min-height: 340px;
  margin-bottom: 2px;
}

.section-page > .sub-hero img {
  filter: saturate(.85) contrast(1.05);
  transform: scale(1.012);
}

.section-page .section-dashboard {
  gap: 10px;
  margin: 0;
}

.section-page .section-dashboard article {
  min-height: 104px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(19, 25, 40, .055);
}

.section-page .section-dashboard span {
  color: #9297a4;
  font-size: 8px;
  letter-spacing: .14em;
}

.section-page .section-dashboard strong {
  color: #151925;
  font-size: clamp(25px, 3vw, 38px);
}

.catalog-toolbar {
  gap: 12px;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 16px;
  padding: 17px;
  background: #fff;
  box-shadow: 0 15px 38px rgba(19, 25, 40, .06);
}

.catalog-toolbar label span {
  color: #858a98;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.catalog-toolbar input,
.catalog-toolbar select {
  min-height: 44px;
  border: 1px solid #dfe2e8;
  border-radius: 10px;
  background: #f6f7f9;
  color: #202532;
}

.catalog-toolbar__actions button,
.catalog-toolbar__actions a {
  min-height: 44px;
  border-radius: 10px;
  padding: 0 15px;
  font-size: 10px;
  font-weight: 900;
}

.catalog-toolbar__actions button {
  border: 0;
  background: #151925;
  color: #fff;
}

.catalog-toolbar__actions a {
  display: inline-flex;
  align-items: center;
  background: #eceef2;
  color: #595f6e;
}

.section-page .public-section-head {
  margin-top: 8px;
  border: 0;
  border-radius: 0;
  padding: 24px 0 13px;
  background: transparent;
  box-shadow: none;
}

.section-page .public-section-head .eyebrow {
  color: #8067ff;
}

.section-page .public-section-head h2 {
  color: #151925;
  font-size: clamp(29px, 4vw, 48px);
  font-weight: 830;
  letter-spacing: -.05em;
}

.section-page .public-section-head > a {
  border-radius: 10px;
  padding: 11px 14px;
  background: #151925;
  color: #fff;
  font-size: 10px;
}

.tag-strip {
  border: 1px solid rgba(18, 23, 36, .09);
  border-radius: 15px;
  padding: 20px;
  background: #fff;
  box-shadow: 0 12px 35px rgba(19, 25, 40, .05);
}

.tag-strip h2 {
  color: #1c202b;
  font-size: 20px;
  font-weight: 820;
  letter-spacing: -.025em;
}

.tag-cloud a {
  border: 1px solid #e0e3e9;
  border-radius: 999px;
  padding: 8px 11px;
  background: #f7f8fa;
  color: #505664;
  font-size: 10px;
  font-weight: 780;
}

.tag-cloud a:hover {
  border-color: #9e8cff;
  background: #f0edff;
  color: #5e49d5;
}

.wiki-hub-layout {
  gap: 14px;
}

.wiki-hub-main,
.wiki-hub-side > section {
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(19, 25, 40, .07);
}

.wiki-hub-grid a {
  overflow: hidden;
  border-radius: 13px;
}

.section-page .public-card-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}

.section-page .public-card-grid--servers {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.section-page .public-card,
.section-page .server-card {
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 16px 42px rgba(19, 25, 40, .075);
  transition: transform .22s ease, box-shadow .22s ease;
}

.section-page .public-card:hover,
.section-page .server-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 55px rgba(19, 25, 40, .12);
}

.section-page .public-card__image {
  aspect-ratio: 1.65;
  border-radius: 15px 15px 0 0;
}

.section-page .public-card__image img {
  height: 100%;
  object-fit: cover;
}

.section-page .public-card__image > span {
  top: 12px;
  right: auto;
  bottom: auto;
  left: 12px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  padding: 6px 9px;
  background: rgba(7, 10, 16, .64);
  color: #fff;
  font-size: 8px;
  backdrop-filter: blur(9px);
}

.section-page .public-card__body {
  padding: 19px 19px 13px;
}

.section-page .public-card__body h3 {
  margin-bottom: 9px;
  font-size: 19px;
  font-weight: 820;
  line-height: 1.15;
}

.section-page .public-card__body p {
  color: #777d8b;
  font-size: 11px;
  line-height: 1.55;
}

.section-page .public-card footer {
  border-top: 1px solid #eceef2;
  padding: 13px 19px;
  color: #8e93a0;
  font-size: 9px;
}

.section-page .public-card__metrics span {
  border-radius: 7px;
  background: #f0f2f6;
  color: #6c7280;
  font-size: 8px;
}

.section-page .server-card {
  overflow: hidden;
}

.section-page .server-card__banner {
  min-height: 210px;
}

.public-empty {
  overflow: hidden;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(19, 25, 40, .07);
}

/* Material details */
.material-page {
  width: min(100% - 32px, 1280px);
}

.material-page .public-article {
  background: transparent;
}

.material-page .public-article__hero {
  min-height: 520px;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 22px;
  background: #0b0f18;
  box-shadow: 0 28px 80px rgba(20, 25, 39, .22);
}

.material-page .public-article__hero::before {
  content: "";
  position: absolute;
  bottom: -160px;
  left: -120px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(126, 94, 255, .16);
  filter: blur(70px);
}

.material-page .public-article__hero > img {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
  mask-image: linear-gradient(90deg, transparent 0%, #000 20%, #000 100%);
}

.material-page .public-article__hero > div {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  position: relative;
  z-index: 2;
  padding: clamp(32px, 5vw, 62px);
}

.material-page .public-article__hero .eyebrow {
  color: var(--neo-coral);
}

.material-page .public-article__hero h1 {
  margin: 9px 0 18px;
  color: #fff;
  font-size: clamp(38px, 5.6vw, 68px);
  font-weight: 840;
  letter-spacing: -.065em;
  line-height: .95;
}

.material-page .public-article__hero > div > p:not(.eyebrow) {
  color: rgba(255, 255, 255, .58);
  font-size: 13px;
  line-height: 1.65;
}

.material-page .article-meta {
  gap: 6px;
  margin-top: 20px;
}

.material-page .article-meta span,
.material-page .public-tags a {
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 999px;
  padding: 6px 9px;
  background: rgba(255, 255, 255, .055);
  color: rgba(255, 255, 255, .62);
  font-size: 8px;
}

.material-page .public-article__layout {
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 18px;
  align-items: start;
  margin-top: 18px;
}

.material-page .public-article__body {
  border: 1px solid rgba(18, 23, 36, .09);
  border-radius: 18px;
  padding: clamp(25px, 4.5vw, 62px);
  background: #fff;
  box-shadow: 0 18px 48px rgba(19, 25, 40, .07);
  color: #2b303c;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  line-height: 1.78;
}

.material-page .public-article__body h2,
.material-page .public-article__body h3 {
  color: #151925;
  font-family: "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
  font-weight: 830;
  letter-spacing: -.04em;
}

.material-page .public-article__body h2 {
  margin-top: 38px;
  font-size: 31px;
}

.material-page .public-article__body a {
  color: #6551d7;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.material-page .public-article__aside {
  position: sticky;
  top: 95px;
}

.material-page .public-article__aside .panel-widget {
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 15px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 15px 38px rgba(19, 25, 40, .065);
}

.material-page .public-article__aside .panel-widget h3 {
  color: #171b26;
  font-size: 13px;
  font-weight: 850;
}

.material-page .public-article__aside .admin-button {
  min-height: 40px;
  border-radius: 9px;
  font-size: 9px;
}

.file-download-panel,
.server-detail-panel {
  margin-top: 18px;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 18px;
  padding: 22px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(19, 25, 40, .07);
}

.file-version-card,
.server-detail-grid article {
  border-radius: 12px;
  background: #f3f5f8;
}

.server-detail-grid article span {
  color: #9297a3;
  font-size: 8px;
  text-transform: uppercase;
}

.server-detail-grid article strong {
  color: #202530;
}

.material-next-steps {
  overflow: hidden;
  margin-top: 18px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 18px;
  background: #101520;
}

.material-next-steps > div,
.material-next-steps > a {
  padding: 22px;
}

.material-next-steps h2,
.material-next-steps a strong {
  color: #fff;
}

.material-next-steps a span {
  color: rgba(255, 255, 255, .46);
}

.comments-section {
  margin-top: 18px;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 18px;
  padding: clamp(22px, 4vw, 38px);
  background: #fff;
  box-shadow: 0 18px 48px rgba(19, 25, 40, .07);
}

.comments-head h2 {
  color: #171b26;
  font-size: 31px;
  font-weight: 830;
  letter-spacing: -.04em;
}

.comment-card {
  border-color: #e5e7ec;
  border-radius: 13px;
  background: #f8f9fa;
}

/* Wiki article */
.wiki-page {
  width: min(100% - 32px, 1280px);
  margin: 0 auto;
  padding: 22px 0 55px;
}

.wiki-page .wiki-native-card,
.wiki-page .wiki-comment-panel {
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 22px 65px rgba(19, 25, 40, .1);
}

.wiki-page .wiki-native-breadcrumb {
  border-bottom: 1px solid #e7e9ee;
  padding: 16px clamp(20px, 4vw, 45px);
  color: #858b98;
  font-size: 9px;
}

.wiki-page .wiki-native-head {
  min-height: 430px;
  grid-template-columns: minmax(0, 1fr) minmax(310px, .72fr);
  gap: 40px;
  align-items: center;
  padding: clamp(28px, 5vw, 60px);
  background: linear-gradient(135deg, #0e1420 0%, #171a2b 100%);
}

.wiki-page .wiki-native-head h1 {
  color: #fff;
  font-size: clamp(40px, 5.5vw, 68px);
  font-weight: 840;
  letter-spacing: -.065em;
  line-height: .95;
}

.wiki-page .wiki-native-head > div > p,
.wiki-page .wiki-native-meta span {
  color: rgba(255, 255, 255, .54);
}

.wiki-page .wiki-native-tags span,
.wiki-page .wiki-native-tags a {
  border-color: rgba(255, 255, 255, .14);
  background: rgba(255, 255, 255, .06);
  color: rgba(255, 255, 255, .72);
}

.wiki-page .wiki-native-cover {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 16px;
  transform: rotate(1.25deg);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .32);
}

.wiki-page .wiki-native-cover img {
  min-height: 290px;
  object-fit: cover;
}

.wiki-page .wiki-native-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 24px;
  padding: clamp(22px, 4vw, 45px);
}

.wiki-page .wiki-native-article {
  min-width: 0;
}

.wiki-page .wiki-native-toc {
  border: 1px solid #e1e4ea;
  border-radius: 13px;
  background: #f5f6f8;
}

.wiki-page .wiki-native-body {
  color: #303541;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  line-height: 1.78;
}

.wiki-page .wiki-native-body h2,
.wiki-page .wiki-native-body h3 {
  color: #171b26;
  font-family: "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
  font-weight: 830;
  letter-spacing: -.04em;
}

.wiki-page .wiki-native-infobox,
.wiki-page .wiki-native-widget {
  border: 1px solid #e0e3e9;
  border-radius: 14px;
  background: #f7f8fa;
  box-shadow: none;
}

.wiki-page .wiki-native-side {
  position: sticky;
  top: 95px;
  align-self: start;
}

.wiki-page .wiki-comment-panel {
  margin-top: 18px;
  padding: clamp(22px, 4vw, 38px);
}

/* Forum */
.forum-page .xf-hero,
.forum-topic-page .xf-hero {
  min-height: 320px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 20px;
  background: #0b0f18;
  box-shadow: 0 24px 70px rgba(19, 25, 40, .18);
}

.forum-page .xf-hero::after,
.forum-topic-page .xf-hero::after {
  background: linear-gradient(90deg, rgba(8, 11, 18, .96), rgba(8, 11, 18, .35));
}

.forum-page .xf-hero h1,
.forum-topic-page .xf-hero h1 {
  color: #fff;
  font-size: clamp(42px, 6vw, 72px);
  font-weight: 840;
  letter-spacing: -.065em;
  line-height: .95;
}

.forum-page .xf-hero p:not(.eyebrow),
.forum-topic-page .xf-hero p:not(.eyebrow) {
  max-width: 680px;
  color: rgba(255, 255, 255, .57);
}

.xf-breadcrumb {
  border: 0;
  padding: 5px 3px;
  background: transparent;
  color: #747a88;
  font-size: 9px;
}

.forum-page .xf-toolbar,
.forum-topic-page .xf-thread-tools {
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 14px;
  padding: 13px;
  background: #fff;
  box-shadow: 0 14px 35px rgba(19, 25, 40, .06);
}

.xf-search input,
.xf-search button {
  min-height: 42px;
  border-radius: 9px;
}

.xf-search input {
  border-color: #dde0e6;
  background: #f5f6f8;
}

.xf-search button,
.forum-page .social-pill,
.forum-topic-page .social-pill {
  border: 0;
  background: #151925;
  color: #fff;
}

.forum-page .xf-layout,
.forum-topic-page .xf-layout {
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 16px;
}

.forum-page .xf-category,
.forum-page .xf-thread-panel,
.forum-topic-page .xf-thread-panel,
.forum-page .xf-widget,
.forum-topic-page .xf-widget {
  overflow: hidden;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 15px 40px rgba(19, 25, 40, .06);
}

.forum-page .xf-category > header,
.forum-page .xf-panel-head,
.forum-topic-page .xf-panel-head {
  border-color: #e8eaee;
  padding: 18px 20px;
  background: #f7f8fa;
}

.forum-page .xf-category h2,
.forum-page .xf-panel-head h2,
.forum-topic-page .xf-panel-head h2 {
  color: #171b26;
  font-size: 20px;
  font-weight: 830;
  letter-spacing: -.025em;
}

.forum-page .xf-node,
.forum-page .xf-thread {
  border-color: #ebedf1;
  padding: 16px 18px;
  background: #fff;
  transition: background .2s ease;
}

.forum-page .xf-node:hover,
.forum-page .xf-thread:hover {
  background: #f8f9fb;
}

.forum-page .xf-node__icon,
.forum-topic-page .xf-node__icon {
  border: 0;
  border-radius: 11px;
  background: linear-gradient(145deg, #6e58df, #9a7cff);
  color: #fff;
  box-shadow: 0 10px 24px rgba(110, 88, 223, .18);
}

.forum-page .xf-thread__title a,
.forum-page .xf-node strong {
  color: #202532;
  font-weight: 810;
}

.forum-page .xf-prefix {
  border: 0;
  border-radius: 999px;
  padding: 4px 7px;
  font-size: 7px;
}

.forum-page .xf-widget,
.forum-topic-page .xf-widget {
  padding: 18px;
}

.forum-page .xf-editor,
.forum-topic-page .xf-editor {
  padding: 20px;
  background: #fff;
}

.forum-page .xf-editor input,
.forum-page .xf-editor select,
.forum-page .xf-editor textarea,
.forum-topic-page .xf-editor textarea {
  border-color: #dfe2e8;
  border-radius: 10px;
  background: #f6f7f9;
}

.forum-topic-page .xf-post {
  overflow: hidden;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(19, 25, 40, .055);
}

.forum-topic-page .xf-author {
  background: #f4f5f8;
}

.forum-topic-page .xf-message {
  color: #333845;
}

/* Account area */
.account-page {
  width: min(100% - 32px, 1280px);
}

.account-page .profile-hero,
.account-page .messages-hub-hero,
.account-page .notification-hero {
  min-height: 330px;
  overflow: hidden;
  position: relative;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 20px;
  background:
    radial-gradient(circle at 82% 25%, rgba(123, 91, 255, .3), transparent 30%),
    radial-gradient(circle at 10% 110%, rgba(255, 103, 125, .18), transparent 34%),
    #0c1019;
  box-shadow: 0 26px 75px rgba(19, 25, 40, .2);
}

.account-page .profile-hero__cover {
  opacity: .38;
  filter: saturate(.65);
}

.account-page .profile-hero::after {
  background: linear-gradient(90deg, rgba(8, 11, 18, .96), rgba(8, 11, 18, .3));
}

.account-page .profile-hero__content {
  gap: 24px;
  align-items: center;
  padding: clamp(28px, 5vw, 60px);
}

.account-page .profile-avatar {
  width: 116px;
  height: 116px;
  border: 3px solid rgba(255, 255, 255, .82);
  border-radius: 28px;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .3);
  object-fit: cover;
}

.account-page .profile-hero h1,
.account-page .messages-hub-hero h1,
.account-page .notification-hero h1 {
  color: #fff;
  font-size: clamp(42px, 6vw, 72px);
  font-weight: 840;
  letter-spacing: -.065em;
  line-height: .95;
}

.account-page .profile-hero__content > div > p:not(.eyebrow),
.account-page .messages-hub-hero > div > p:not(.eyebrow),
.account-page .notification-hero > div > p:not(.eyebrow) {
  max-width: 680px;
  color: rgba(255, 255, 255, .56);
}

.account-page .messages-hub-hero,
.account-page .notification-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: clamp(30px, 5vw, 64px);
}

.account-page .notification-hero aside {
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 16px;
  padding: 22px 28px;
  background: rgba(255, 255, 255, .07);
  backdrop-filter: blur(9px);
}

.account-page .notification-hero aside strong {
  color: #fff;
  font-size: 48px;
}

.account-switcher {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(19, 25, 40, .06);
}

.account-switcher a {
  min-width: 0;
  display: flex;
  gap: 9px;
  align-items: center;
  position: relative;
  padding: 15px 17px;
  color: #6f7583;
  font-size: 10px;
  font-weight: 850;
}

.account-switcher a:not(:last-child) {
  border-right: 1px solid #e8eaee;
}

.account-switcher a span {
  color: #b1b5bf;
  font-size: 8px;
}

.account-switcher a:hover,
.account-switcher a.is-active {
  background: #151925;
  color: #fff;
}

.account-switcher a.is-active span {
  color: var(--neo-cyan);
}

.account-page .metric-grid {
  gap: 10px;
}

.account-page .metric {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 14px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(19, 25, 40, .055);
}

.account-page .metric strong {
  color: #171b26;
  font-size: 35px;
  font-weight: 850;
  letter-spacing: -.05em;
}

.account-page .metric span {
  color: #9297a4;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.account-page .profile-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
}

.account-page .panel-widget {
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 15px 40px rgba(19, 25, 40, .06);
}

/* Account widgets form their own compact rail. The generic sticky-sidebar
   scrollbar and padding otherwise leave a visible grey gutter here. */
.account-page .sidebar {
  display: grid;
  gap: 12px;
  max-height: none;
  overflow: visible;
  padding-right: 0;
  scrollbar-width: none;
}

.account-page .sidebar::-webkit-scrollbar {
  display: none;
}

/* The leading wiki tile spans two rows, so five tiles make a complete 3-by-2
   composition. Stretch the editorial rail to the same visual height. */
.section-page--wiki .wiki-hub-side {
  align-self: stretch;
  grid-template-rows: minmax(0, 1fr) auto;
}

.section-page--wiki .wiki-hub-side > section {
  height: 100%;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* ========================================================================== */
/* Shared cinematic canvas for every public route                             */
/* ========================================================================== */

body.public-body--inner {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  background: #080b13;
  color: #e8ebf2;
}

body.public-body--inner::before,
body.public-body--inner::after {
  content: "";
  position: fixed;
  inset: 76px 0 auto;
  z-index: -2;
  width: 100%;
  height: min(780px, 82vh);
  pointer-events: none;
}

body.public-body--inner::before {
  background:
    linear-gradient(180deg, rgba(6, 9, 16, .38) 0%, rgba(6, 9, 16, .7) 50%, #080b13 100%),
    linear-gradient(90deg, rgba(7, 10, 18, .9) 0%, rgba(7, 10, 18, .3) 46%, rgba(7, 10, 18, .76) 100%),
    url('/assets/portal-hero-2026.webp') center 36% / cover no-repeat;
  opacity: .9;
}

body.public-body--inner::after {
  z-index: -1;
  height: 1100px;
  background:
    radial-gradient(circle at 13% 16%, rgba(119, 87, 229, .3), transparent 25%),
    radial-gradient(circle at 86% 25%, rgba(241, 119, 105, .22), transparent 23%),
    radial-gradient(circle at 52% 58%, rgba(36, 204, 202, .09), transparent 29%);
  opacity: .92;
}

body.public-body--inner > main {
  position: relative;
  z-index: 1;
}

body.public-body--inner .page-shell,
body.public-body--inner .wiki-native-page,
body.public-body--inner .wiki-create-page {
  background-color: transparent;
}

body.public-body--inner .section-page .public-section-head h2 {
  color: #fff;
  text-shadow: 0 8px 30px rgba(0, 0, 0, .34);
}

body.public-body--inner .section-page .public-section-head .eyebrow {
  color: #b4a6ff;
}

body.public-body--inner .section-page .public-section-head > a {
  border: 1px solid rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .1);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .2);
  backdrop-filter: blur(14px);
}

body.public-body--inner .section-dashboard article,
body.public-body--inner .catalog-toolbar,
body.public-body--inner .tag-strip,
body.public-body--inner .public-card,
body.public-body--inner .server-card,
body.public-body--inner .wiki-hub-main,
body.public-body--inner .wiki-hub-side,
body.public-body--inner .panel-widget,
body.public-body--inner .xf-toolbar,
body.public-body--inner .xf-category,
body.public-body--inner .xf-thread-panel,
body.public-body--inner .xf-widget,
body.public-body--inner .account-switcher,
body.public-body--inner .chat-overview article,
body.public-body--inner .chat-panel,
body.public-body--inner .chat-room {
  color: #252a36;
  box-shadow: 0 20px 56px rgba(0, 0, 0, .2);
}

body.public-body--inner .public-article__body,
body.public-body--inner .xf-editor,
body.public-body--inner .pm-compose,
body.public-body--inner .pm-thread-panel,
body.public-body--inner .pm-conversation,
body.public-body--inner .notification-card,
body.public-body--inner .wiki-create-card,
body.public-body--inner .wiki-edit-card,
body.public-body--inner .tag-page-layout {
  color: #252a36;
}

body.public-body--inner .sub-hero,
body.public-body--inner .public-article__hero,
body.public-body--inner .xf-hero,
body.public-body--inner .profile-hero,
body.public-body--inner .messages-hub-hero,
body.public-body--inner .notification-hero,
body.public-body--inner .community-hero,
body.public-body--inner .wiki-native-card {
  box-shadow: 0 30px 90px rgba(0, 0, 0, .38);
}

body.public-body--inner .wiki-native-page.wiki-page {
  background: transparent;
}

body.public-body--inner .wiki-comment-panel {
  color: #252a36;
}

body.public-body--inner .site-footer {
  border-top: 1px solid rgba(255, 255, 255, .08);
}

@media (max-width: 760px) {
  body.public-body--inner::before,
  body.public-body--inner::after {
    top: 64px;
    height: 620px;
  }

  body.public-body--inner::before {
    background:
      linear-gradient(180deg, rgba(6, 9, 16, .28), rgba(6, 9, 16, .74) 52%, #080b13 100%),
      linear-gradient(90deg, rgba(7, 10, 18, .72), rgba(7, 10, 18, .25)),
      url('/assets/portal-hero-2026.webp') 64% 35% / cover no-repeat;
  }
}

.account-page .portal-card__head {
  border-bottom: 1px solid #e8eaee;
  padding: 17px 19px;
}

.account-page .activity-feed > article {
  border-color: #ebedf1;
  padding: 16px 19px;
}

.account-page .activity-feed > article > span {
  border: 0;
  border-radius: 8px;
  background: #eeeaff;
  color: #6651d9;
}

.account-page .contribution-grid {
  gap: 10px;
  padding: 15px;
}

.account-page .contribution-grid article {
  border: 1px solid #e4e6eb;
  border-radius: 12px;
  background: #f7f8fa;
}

.pm-layout,
.notification-layout {
  gap: 16px;
}

.pm-sidebar,
.notification-aside {
  gap: 13px;
}

.pm-conversation,
.notification-feed {
  min-height: 570px;
  overflow: hidden;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 17px 45px rgba(19, 25, 40, .07);
}

.pm-compose form input,
.pm-compose form textarea,
.pm-reply textarea {
  border-color: #dfe2e8;
  border-radius: 10px;
  background: #f6f7f9;
}

.pm-compose form button,
.pm-reply button {
  border: 0;
  border-radius: 9px;
  background: #151925;
  color: #fff;
}

.pm-thread-list a {
  border-radius: 9px;
  padding: 11px;
}

.pm-thread-list a.is-active {
  background: #151925;
  color: #fff;
}

.pm-conversation__head {
  border-color: #e8eaee;
  padding: 18px 21px;
  background: #f7f8fa;
}

.pm-message {
  padding: 17px 21px;
}

.pm-message > span {
  border: 0;
  border-radius: 10px;
  background: #ece9ff;
  color: #6550d6;
}

.pm-message--mine > div {
  border-radius: 14px 14px 4px 14px;
  background: #151925;
  color: #fff;
}

.notification-feed {
  padding: 14px;
}

.notification-card {
  border: 1px solid #e4e7ec;
  border-radius: 13px;
  padding: 17px;
  background: #f8f9fa;
}

.notification-card.is-unread {
  border-color: #b9adff;
  background: #f3f0ff;
  box-shadow: inset 3px 0 #785fff;
}

.notification-card > span {
  border: 0;
  border-radius: 8px;
  background: #151925;
  color: #fff;
}

.notification-card h2 {
  color: #1b1f2a;
  font-size: 16px;
  font-weight: 820;
}

.notification-card button {
  border: 0;
  border-radius: 9px;
  background: #151925;
  color: #fff;
}

@media (max-width: 1060px) {
  .section-page .public-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .material-page .public-article__layout,
  .wiki-page .wiki-native-layout,
  .forum-page .xf-layout,
  .forum-topic-page .xf-layout,
  .account-page .profile-layout { grid-template-columns: minmax(0, 1fr); }
  .material-page .public-article__aside,
  .wiki-page .wiki-native-side { position: static; }
  .material-page .public-article__aside { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .forum-page .xf-sidebar,
  .forum-topic-page .xf-sidebar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-page .sidebar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}

@media (max-width: 760px) {
  .section-page > .sub-hero { min-height: 300px; }
  .section-page .section-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .section-page .public-card-grid,
  .section-page .public-card-grid--servers { grid-template-columns: 1fr; }
  .material-page .public-article__hero { min-height: 640px; grid-template-columns: 1fr; align-items: end; }
  .material-page .public-article__hero > img { grid-column: 1; min-height: 640px; mask-image: linear-gradient(0deg, transparent 0%, #000 25%, #000 100%); opacity: .7; }
  .material-page .public-article__hero > div { grid-column: 1; align-self: end; padding: 28px 24px; }
  .material-page .public-article__hero h1 { font-size: 42px; }
  .material-page .public-article__layout { display: block; }
  .material-page .public-article__aside { display: grid; grid-template-columns: 1fr; margin-top: 14px; }
  .material-page .public-article__body { padding: 26px 22px; font-size: 16px; }
  .material-next-steps { grid-template-columns: 1fr; }
  .wiki-page .wiki-native-head { grid-template-columns: 1fr; }
  .wiki-page .wiki-native-cover { transform: none; }
  .wiki-page .wiki-native-layout { padding: 22px; }
  .forum-page .xf-sidebar,
  .forum-topic-page .xf-sidebar,
  .account-page .sidebar { grid-template-columns: 1fr; }
  .account-switcher { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-switcher a:nth-child(2) { border-right: 0; }
  .account-switcher a:nth-child(-n+2) { border-bottom: 1px solid #e8eaee; }
  .account-page .messages-hub-hero,
  .account-page .notification-hero { min-height: 300px; align-items: flex-start; flex-direction: column; justify-content: center; }
  .account-page .notification-hero aside { padding: 14px 18px; }
  .account-page .notification-hero aside strong { font-size: 34px; }
  .pm-layout,
  .notification-layout { grid-template-columns: 1fr; }
  .pm-conversation { min-height: 460px; }
}

@media (max-width: 500px) {
  .section-page,
  .material-page,
  .forum-page,
  .forum-topic-page,
  .account-page,
  .wiki-page { width: min(100% - 22px, 1280px); }
  .section-page .section-dashboard { gap: 7px; }
  .section-page .section-dashboard article { min-height: 92px; padding: 14px; }
  .catalog-toolbar { padding: 13px; }
  .section-page .public-section-head { align-items: flex-start; flex-direction: column; gap: 12px; }
  .material-page .public-article__hero { min-height: 590px; }
  .material-page .public-article__hero > img { min-height: 590px; }
  .material-page .public-article__hero h1,
  .wiki-page .wiki-native-head h1,
  .forum-page .xf-hero h1,
  .forum-topic-page .xf-hero h1,
  .account-page .profile-hero h1,
  .account-page .messages-hub-hero h1,
  .account-page .notification-hero h1 { font-size: 38px; }
  .wiki-page .wiki-native-head { padding: 28px 21px; }
  .wiki-page .wiki-native-cover img { min-height: 220px; }
  .forum-page .xf-toolbar { align-items: stretch; flex-direction: column; }
  .forum-page .xf-search { width: 100%; }
  .forum-page .xf-actions { width: 100%; }
  .forum-page .xf-actions a { flex: 1; text-align: center; }
  .account-page .profile-hero__content { align-items: flex-start; flex-direction: column; }
  .account-page .profile-avatar { width: 88px; height: 88px; border-radius: 22px; }
  .account-page .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .notification-card { grid-template-columns: 1fr; }
  .notification-card > span { justify-self: start; }
}

/* Screenshot QA pass: news, wiki, private messages and live chat */

/* News cards: the media must occupy the complete card width. */
.section-page--news .public-card-grid {
  gap: 20px;
}

.section-page--news .public-card {
  min-width: 0;
}

.section-page--news .public-card__image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  align-self: stretch;
}

.section-page--news .public-card__image img {
  display: block;
  width: 100%;
  height: 100%;
}

.section-page--news .public-card__image > span {
  padding: 7px 11px;
  font-size: 10px;
}

.section-page--news .public-card__body {
  gap: 11px;
  padding: 22px 22px 17px;
}

.section-page--news .public-card__body h3 {
  min-height: 51px;
  margin: 0;
  font-size: 22px;
  line-height: 1.16;
}

.section-page--news .public-card__body p {
  color: #666d7b;
  font-size: 14px;
  line-height: 1.62;
}

.section-page--news .public-card__metrics {
  margin-top: 2px;
}

.section-page--news .public-card__metrics span {
  padding: 6px 9px;
  font-size: 11px;
}

.section-page--news .public-card footer {
  min-height: 56px;
  padding: 15px 22px;
  font-size: 12px;
}

.section-page--news .public-card footer span:last-child {
  font-size: 11px;
}

/* Wiki: one wide editorial surface without the old nested postcard effect. */
.wiki-native-page.wiki-page {
  width: min(100% - 32px, 1340px);
  min-height: calc(100vh - 64px);
  padding: 32px 0 64px;
  background:
    radial-gradient(circle at 8% 0%, rgba(119, 94, 219, .12), transparent 31%),
    radial-gradient(circle at 92% 13%, rgba(237, 128, 112, .12), transparent 27%),
    #eef1f6;
}

.wiki-page .wiki-native-card,
.wiki-page .wiki-comment-panel {
  width: 100%;
}

.wiki-page .wiki-native-card {
  overflow: hidden;
  border-radius: 24px;
}

.wiki-page .wiki-native-breadcrumb {
  padding: 18px clamp(24px, 4vw, 56px);
  background: #fff;
  font-size: 11px;
}

.wiki-page .wiki-native-head {
  min-height: 470px;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: clamp(34px, 5vw, 72px);
  padding: clamp(40px, 5vw, 68px);
  background:
    radial-gradient(circle at 8% 15%, rgba(120, 92, 228, .22), transparent 29%),
    linear-gradient(135deg, #0a0e17 0%, #151a2b 58%, #1d1730 100%);
}

.wiki-page .wiki-native-head h1 {
  max-width: 760px;
  font-size: clamp(48px, 5.8vw, 78px);
}

.wiki-page .wiki-native-head > div > p {
  max-width: 720px;
  color: rgba(255, 255, 255, .68);
  font-size: 18px;
  line-height: 1.6;
}

.wiki-page .wiki-native-cover {
  width: 100%;
  margin: 0;
  transform: none;
  border-radius: 20px;
  background: #101522;
}

.wiki-page .wiki-native-cover img {
  width: 100%;
  height: 360px;
  min-height: 0;
  object-fit: cover;
}

.wiki-page .wiki-native-cover figcaption {
  display: none;
}

.wiki-page .wiki-native-layout {
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: clamp(28px, 4vw, 52px);
  padding: clamp(34px, 5vw, 62px);
}

.wiki-page .wiki-native-toc {
  margin-bottom: 32px;
  padding: 21px 23px;
  border-radius: 16px;
  background: #f4f6f9;
}

.wiki-page .wiki-native-body {
  color: #343945;
  font-size: 18px;
  line-height: 1.82;
}

.wiki-page .wiki-native-body h2 {
  margin-top: 38px;
  font-size: clamp(27px, 3vw, 36px);
}

.wiki-page .wiki-native-body h3 {
  margin-top: 30px;
  font-size: clamp(22px, 2.4vw, 29px);
}

.wiki-page .wiki-native-infobox > img {
  display: none;
}

.wiki-page .wiki-native-infobox,
.wiki-page .wiki-native-widget {
  border-radius: 17px;
  background: #f6f7f9;
}

.wiki-page .wiki-native-infobox h2 {
  margin-top: 20px;
}

/* Private messages: a deliberate compose card instead of horizontal labels. */
.account-page--messages .pm-layout {
  grid-template-columns: 380px minmax(0, 1fr);
  gap: 20px;
}

.account-page--messages .pm-compose {
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(19, 25, 40, .09);
}

.pm-compose__head {
  display: flex;
  gap: 13px;
  align-items: center;
  padding: 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(234, 125, 112, .38), transparent 42%),
    linear-gradient(135deg, #111623, #211a38);
}

.pm-compose__head > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 13px;
  background: rgba(255, 255, 255, .09);
  color: #fff;
  font-size: 24px;
  font-weight: 700;
}

.pm-compose__head h3,
.pm-compose__head p {
  margin: 0;
}

.pm-compose__head h3 {
  color: #fff;
  font-size: 20px;
}

.pm-compose__head p {
  margin-top: 3px;
  color: rgba(255, 255, 255, .58);
  font-size: 12px;
  line-height: 1.45;
}

.account-page--messages .pm-compose form {
  gap: 16px;
  padding: 20px;
}

.account-page--messages .pm-compose form label {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
  width: 100%;
  color: #333947;
  font-size: 12px;
  font-weight: 800;
}

.account-page--messages .pm-compose form label > span {
  display: block;
}

.account-page--messages .pm-compose form input,
.account-page--messages .pm-compose form textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  border: 1px solid #dfe3e9;
  border-radius: 11px;
  padding: 12px 13px;
  background: #f6f7f9;
  color: #171c28;
  font: inherit;
  font-size: 14px;
  line-height: 1.5;
  resize: vertical;
}

.account-page--messages .pm-compose form input {
  min-height: 46px;
}

.account-page--messages .pm-compose form textarea {
  min-height: 128px;
}

.account-page--messages .pm-compose form input:focus,
.account-page--messages .pm-compose form textarea:focus {
  outline: 3px solid rgba(113, 88, 220, .13);
  border-color: #8d7bdd;
  background: #fff;
}

.account-page--messages .pm-compose form button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 0 16px;
  background: #151a27;
  font-size: 14px;
}

.account-page--messages .pm-compose form button b {
  font-size: 20px;
  font-weight: 400;
}

.account-page--messages .pm-thread-panel {
  padding: 16px;
  border-radius: 18px;
}

.pm-thread-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 13px;
}

.pm-thread-panel > header h3 {
  margin: 0;
}

.pm-thread-panel > header > span {
  display: grid;
  place-items: center;
  min-width: 28px;
  height: 28px;
  border-radius: 9px;
  background: #efecff;
  color: #6651d6;
  font-size: 12px;
  font-weight: 900;
}

.account-page--messages .pm-conversation {
  min-height: 650px;
  border-radius: 18px;
}

/* Live chat: full community workspace with stable vertical rhythm. */
.chat-page {
  width: min(100% - 32px, 1400px);
  gap: 18px;
  padding-bottom: 64px;
}

.chat-page .community-hero {
  position: relative;
  min-height: 300px;
  overflow: hidden;
  align-items: flex-end;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 24px;
  padding: clamp(32px, 5vw, 62px);
  background:
    linear-gradient(90deg, rgba(8, 12, 20, .95) 0%, rgba(8, 12, 20, .78) 52%, rgba(8, 12, 20, .36) 100%),
    url('/assets/community-studio-2026.webp') center 44% / cover no-repeat;
  box-shadow: 0 24px 68px rgba(19, 25, 40, .18);
}

.chat-page .community-hero h1 {
  font-size: clamp(46px, 6vw, 76px);
  letter-spacing: -.06em;
  line-height: .95;
}

.chat-page .community-hero p:last-child {
  max-width: 690px;
  color: rgba(255, 255, 255, .66);
  font-size: 16px;
}

.chat-overview {
  display: grid;
  grid-template-columns: .8fr 1.5fr 1fr;
  gap: 10px;
}

.chat-overview article {
  min-width: 0;
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 15px;
  padding: 17px 19px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(19, 25, 40, .06);
}

.chat-overview span,
.chat-overview strong {
  display: block;
}

.chat-overview span {
  margin-bottom: 5px;
  color: #8a909c;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.chat-overview strong {
  overflow: hidden;
  color: #171c28;
  font-size: 22px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-page .chat-shell {
  grid-template-columns: 250px minmax(0, 1fr) 285px;
  gap: 18px;
}

.chat-page .chat-panel,
.chat-page .chat-room {
  border: 1px solid rgba(18, 23, 36, .1);
  border-radius: 18px;
  box-shadow: 0 18px 48px rgba(19, 25, 40, .08);
}

.chat-page .chat-panel {
  position: sticky;
  top: 88px;
  padding: 17px;
}

.chat-page .chat-panel h2 {
  margin-bottom: 14px;
  color: #1a1f2b;
  font-size: 17px;
}

.chat-page .chat-panel--rooms a {
  margin-top: 9px;
  border-color: #e2e5eb;
  border-radius: 12px;
  padding: 13px;
  background: #f7f8fa;
}

.chat-page .chat-panel--rooms a.is-active {
  border-color: #9281e2;
  background: #efecff;
  box-shadow: inset 3px 0 #745de0;
}

.chat-page .chat-room {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 700px;
  background: #fff;
}

.chat-page .chat-room__head {
  padding: 21px 23px;
  border-color: #e6e9ee;
  background: #fff;
}

.chat-page .chat-room__head h2 {
  color: #171c28;
  font-size: 23px;
}

.chat-page .chat-messages {
  align-content: start;
  min-height: 540px;
  max-height: 650px;
  padding: 22px;
  background:
    linear-gradient(rgba(244, 246, 249, .9), rgba(244, 246, 249, .9)),
    url('/assets/hero-palms.webp') center / cover no-repeat;
}

.chat-page .chat-messages > .community-empty {
  align-self: center;
  justify-self: center;
  max-width: 420px;
}

.chat-page .chat-message {
  border-radius: 14px;
  padding: 13px;
  box-shadow: 0 8px 24px rgba(25, 31, 45, .07);
}

.chat-page .chat-composer {
  gap: 10px;
  padding: 15px;
  border-color: #e6e9ee;
}

.chat-page .chat-composer input {
  min-height: 48px;
  border-color: #dfe3e9;
  border-radius: 11px;
  background: #f6f7f9;
}

.chat-page .chat-composer button {
  min-width: 128px;
  border-radius: 11px;
  background: #171c28;
}

.chat-page .chat-user {
  border-color: #e5e7ec;
  border-radius: 12px;
  background: #f8f9fa;
}

.chat-page .chat-admin-note a {
  border: 0;
  border-radius: 11px;
  background: #171c28;
}

@media (max-width: 1100px) {
  .wiki-page .wiki-native-head {
    grid-template-columns: minmax(0, 1fr) 340px;
  }

  .account-page--messages .pm-layout {
    grid-template-columns: 340px minmax(0, 1fr);
  }

  .chat-page .chat-shell {
    grid-template-columns: 230px minmax(0, 1fr);
  }

  .chat-page .chat-panel--people {
    position: static;
    grid-column: 1 / -1;
  }
}

@media (max-width: 820px) {
  .section-page--news .public-card__body h3 {
    min-height: 0;
  }

  .wiki-native-page.wiki-page {
    width: min(100% - 22px, 1340px);
    padding-top: 18px;
  }

  .wiki-page .wiki-native-head,
  .wiki-page .wiki-native-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .wiki-page .wiki-native-head {
    min-height: 0;
  }

  .wiki-page .wiki-native-cover img {
    height: clamp(240px, 58vw, 390px);
  }

  .wiki-page .wiki-native-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-page--messages .pm-layout,
  .chat-page .chat-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .account-page--messages .pm-conversation {
    min-height: 540px;
  }

  .chat-page {
    width: min(100% - 22px, 1400px);
  }

  .chat-page .community-hero {
    min-height: 360px;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-end;
  }

  .chat-page .chat-panel {
    position: static;
  }

  .chat-page .chat-panel--rooms {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .chat-page .chat-panel--rooms h2 {
    grid-column: 1 / -1;
  }

  .chat-page .chat-panel--rooms a {
    margin: 0;
  }

  .chat-page .chat-room {
    min-height: 620px;
  }

  .chat-page .chat-messages {
    min-height: 450px;
  }

  .chat-page .chat-panel--people {
    grid-column: auto;
  }
}

@media (max-width: 520px) {
  .section-page--news .public-card__body {
    padding: 19px 18px 15px;
  }

  .section-page--news .public-card__body h3 {
    font-size: 21px;
  }

  .section-page--news .public-card__body p {
    font-size: 13px;
  }

  .wiki-page .wiki-native-head {
    padding: 30px 21px 24px;
  }

  .wiki-page .wiki-native-head h1 {
    font-size: 40px;
  }

  .wiki-page .wiki-native-head > div > p {
    font-size: 15px;
  }

  .wiki-page .wiki-native-layout {
    padding: 27px 20px;
  }

  .wiki-page .wiki-native-toc ol {
    columns: 1;
  }

  .wiki-page .wiki-native-side {
    grid-template-columns: 1fr;
  }

  .account-page--messages .pm-compose form,
  .pm-compose__head {
    padding: 17px;
  }

  .chat-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .chat-overview article:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .chat-page .community-hero {
    min-height: 410px;
    padding: 26px 22px;
  }

  .chat-page .community-hero h1 {
    font-size: 43px;
  }

  .chat-page .community-hero__actions {
    width: 100%;
  }

  .chat-page .community-hero__actions a {
    flex: 1;
  }

  .chat-page .chat-panel--rooms {
    grid-template-columns: 1fr;
  }

  .chat-page .chat-room {
    min-height: 590px;
  }

  .chat-page .chat-messages {
    min-height: 410px;
    padding: 15px;
  }

  .chat-page .chat-composer {
    grid-template-columns: 1fr;
  }

  .chat-page .chat-composer button {
    min-height: 46px;
  }
}

/* Full-site readability correction after live screenshot review. */
.section-page .public-card__image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  align-self: stretch;
}

.section-page .public-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-page .public-card__body h3 {
  font-size: 21px;
}

.section-page .public-card__body p {
  color: #676e7c;
  font-size: 13px;
  line-height: 1.6;
}

.section-page .public-card footer {
  font-size: 11px;
}

.section-page .public-card__metrics span {
  font-size: 10px;
}

.wiki-native-page.wiki-page {
  width: 100%;
  max-width: none;
  padding: 32px 0 64px;
  background: #fff;
}

.wiki-page .wiki-native-card,
.wiki-page .wiki-comment-panel {
  width: min(100% - 32px, 1340px);
  margin-right: auto;
  margin-left: auto;
}

.wiki-page .wiki-native-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, max-content));
  gap: 9px;
  margin-top: 22px;
}

.wiki-page .wiki-native-meta span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 12px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  backdrop-filter: blur(10px);
}

.wiki-page .wiki-native-meta small {
  color: rgba(255, 255, 255, .52);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.wiki-page .wiki-native-meta strong {
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
}

@media (max-width: 820px) {
  .wiki-page .wiki-native-card,
  .wiki-page .wiki-comment-panel {
    width: min(100% - 22px, 1340px);
  }

  .wiki-page .wiki-native-meta {
    grid-template-columns: 1fr;
  }
}

.neo-module p {
  color: rgba(255, 255, 255, .68);
  font-size: 13px;
  line-height: 1.55;
}

.tag-cloud a {
  font-size: 11px;
}

.site-footer__inner p,
.site-footer__inner nav a,
.site-footer__inner nav > span {
  font-size: 12px;
  line-height: 1.55;
}

.site-footer__inner > div > p,
.site-footer__inner > nav > a,
.site-footer__inner > nav > span {
  font-size: 12px;
  line-height: 1.55;
}

.wiki-page .wiki-native-head h1 {
  font-size: clamp(44px, 4.5vw, 64px);
  line-height: .98;
}