.nbMessage .nbAutoParagraph {
  display: block;
  text-indent: 2em;
}

/* Ramka obrazka w hoverze w kolorze grupy */
.nbPost:has(.nbHeroName span[style*="var(--"]) .nbHoverImage {
  border-color: var(--nb-group-color);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--nb-group-color) 40%, transparent);
}

/* Wyżej ustawiony obrazek i ciaśniejszy układ hovera */
.nbHover {
  justify-content: flex-start;
  gap: 15px;

}

.nbHoverImage {
  margin-bottom: 2px;
}

.nbHoverImage,
.nbHoverImage img {
  width: 100px;
  height: 100px;
		opacity: 0.85;
}

.nbHoverImage {
  align-self: center;
  border: 1px solid var(--borderprofil);
  overflow: hidden;
	margin-top: -35px;
}

.nbHoverImage img {
  display: block;
  object-fit: cover;
}



.nbHeroName .nbNameWord {
  display: inline;
  white-space: nowrap;
	font-style: normal;
}

.nbRank img {
  filter: invert(1);
}

.nbHeroName .nbNameInitial {
  display: inline-grid;
  width: .98em;
  height: .98em;
  margin-right: .055em;
  place-items: center;
  vertical-align: .06em;
  background: color-mix(in srgb, var(--nb-group-color) 90%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--nb-group-color) 75%, var(--borderprofil));
  color: inherit;
  font-size: 50px;
  line-height: 1 !important;
}

/* Wklej na samym końcu post.css. */
.nbHeroLeft {
  min-width: 0;
  flex: 1;
}

.nbHeroIdentity {
  min-width: 0;
  margin-top: 25px;
}

.nbHeroNameRow {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 13px;
}

/* Ikona rangi w nagłówku (nie dotyczy tej w hoverze avatara). */
.nbHeroNameRow > .nbRank {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  overflow: hidden;
  background: color-mix(in srgb, var(--nb-group-color) 90%, transparent);
  border: 1px solid color-mix(in srgb, var(--nb-group-color) 68%, var(--borderprofil));
}

.nbHeroNameRow > .nbRank img {
  display: block;
  width: 30px;
  height: 30px;
  object-fit: contain;
}

/* Mały avatar w hoverze: wyśrodkowany i ostry. */
.nbHoverPortrait {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  height: auto;
  min-height: 0;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  overflow: visible;
  margin: 0 0 12px;
  padding: 0;
  background: transparent;
  border: 0;
  text-align: center;
}

.nbHoverPortrait .author_avatar,
.nbHoverPortrait .author_avatar a {
  display: block;
}

.nbHoverPortrait .author_avatar img {
  display: block;
  width: 70px !important;
  max-width: 70px;
  height: 70px !important;
  margin: 0 auto;
  object-fit: contain;
  transform: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Resetuje stare kolorowe tło na całym imieniu. */
.nbHeroName {
  display: block;
  min-width: 0;
  margin: 0;
  transform: none !important;
}

.nbHeroName::after {
  display: none !important;
}

.nbHeroName a,
.nbHeroName a span {
  padding: 0 !important;
  background: transparent !important;
}

.nbHeroName a span {
  text-shadow: 0 1px 8px rgba(0, 0, 0, .55);
}

.nbHeroLine {
  min-width: 24px;
  height: 1px;
  flex: 1;
  background: color-mix(in srgb, var(--nb-group-color) 90%, var(--borderszary));
}

.nbHeroTitle {
  margin: 7px 0 0 59px;
  color: var(--biel);
	font-style: normal;
}

@media (max-width: 700px) {
  .nbHeroNameRow {
    gap: 9px;
  }

  .nbHeroNameRow > .nbRank {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
  }

  .nbHeroNameRow > .nbRank img {
    width: 26px;
    height: 26px;
  }

  .nbHeroTitle {
    margin-left: 47px;
  }
}

/* Przypisanie koloru grupy do posta. */
.nbPost:has(.nbHeroName span[style*="var(--korona)"]) { --nb-group-color: var(--korona); }
.nbPost:has(.nbHeroName span[style*="var(--reach)"]) { --nb-group-color: var(--reach); }
.nbPost:has(.nbHeroName span[style*="var(--burza)"]) { --nb-group-color: var(--burza); }
.nbPost:has(.nbHeroName span[style*="var(--polnoc)"]) { --nb-group-color: var(--polnoc); }
.nbPost:has(.nbHeroName span[style*="var(--dorzecze)"]) { --nb-group-color: var(--dorzecze); }
.nbPost:has(.nbHeroName span[style*="var(--dolina)"]) { --nb-group-color: var(--dolina); }
.nbPost:has(.nbHeroName span[style*="var(--zachod)"]) { --nb-group-color: var(--zachod); }
.nbPost:has(.nbHeroName span[style*="var(--dorne)"]) { --nb-group-color: var(--dorne); }
.nbPost:has(.nbHeroName span[style*="var(--zelaznewyspy)"]) { --nb-group-color: var(--zelaznewyspy); }
.nbPost:has(.nbHeroName span[style*="var(--essos)"]) { --nb-group-color: var(--essos); }
.nbPost:has(.nbHeroName span[style*="var(--kingsroad)"]) { --nb-group-color: var(--kingsroad); }
.nbPost:has(.nbHeroName span[style*="var(--essos)"]) { --nb-group-color: var(--essos); }

/* Tło herbu ma kolor grupy. Jest na kontenerze, więc filtr herbu go nie odwraca. */
.nbPost:has(.nbHeroName span[style*="var(--"]) .nbHeroRight {
  display: grid;
  width: 107px;
  height: 107px;
  box-sizing: border-box;
  place-items: center;
  padding: 10px;
  background: color-mix(in srgb, var(--nb-group-color) 90%, transparent);
  border: 1px solid color-mix(in srgb, var(--nb-group-color) 75%, var(--borderprofil));
}

/* PNG herbu staje się maską — kolor jest dokładnie taki, jak poniżej, bez filtra. */
.nbHeroCrest {
  display: block;
  width: 85px;
  height: 85px;
  background: var(--biel);
  -webkit-mask: var(--nb-crest-url) center / contain no-repeat;
  mask: var(--nb-crest-url) center / contain no-repeat;
}

/* Tło hovera rozmazuje avatar pod spodem, lecz nie jego zawartość. */
.nbPost:has(.nbHeroName span[style*="var(--"]) .nbAvatar:hover .nbHover {
  background:
    linear-gradient(rgba(15, 12, 10, .24), rgba(15, 12, 10, .24)),
    color-mix(in srgb, var(--nb-group-color) 80%, transparent);
  backdrop-filter: blur(10px) brightness(.9) grayscale(.15);
  -webkit-backdrop-filter: blur(10px) brightness(.9) grayscale(.15);
}

/* Ważne: > img wybiera wyłącznie avatar, nie obrazek rangi. */
.nbPost:has(.nbHeroName span[style*="var(--"]) .nbAvatar:hover > img,
.nbPost:has(.nbHeroName span[style*="var(--"]) .nbAvatar:hover > a > img,
.nbPost:has(.nbHeroName span[style*="var(--"]) .nbAvatar:hover > .author_avatar > a > img {
  transform: scale(1.04);
  filter: blur(5px) brightness(.82) grayscale(.15);
}

.nbPost:has(.nbHeroName span[style*="var(--"]) .nbAvatar:hover .nbHover::before {
  border-color: var(--nb-group-color);
}

.nbPost:has(.nbHeroName span[style*="var(--"]) .nbAvatar:hover {
  border-color: var(--nb-group-color);
}

#content .wrapper > center:first-of-type {
  margin-top: 50px;
}

.nbPost {
  width: 1010px !important;
  min-width: 1010px;
  max-width: none !important;
  margin: 40px 0;
  box-sizing: border-box;
  background: #111;
  border: 1px solid var(--borderprofil);
  color: #ddd;
  font-family: Afacad, sans-serif;
}

table.tborder.tfixed.clear:has(#posts_container) {
  width: 1010px !important;
  min-width: 1010px;
  margin: 0 auto !important;
}

#posts_container,
#posts_container > #posts {
  width: 1010px !important;
  min-width: 1010px;
  padding: 0;
}

.nbTopBar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
}

.nbPostDate {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  color: var(--biel);
	font-style: normal;
font-family: var(--kursywa);
	letter-spacing: 1px;
font-size: 11px;
}

.nbPostDate::after {
  content: "";
  height: 1px;
  flex: 1;
  margin-left: 24px;
  background: #302323;
}

.nbPostButtons {
  display: flex;
  gap: 16px;
  margin-left: 24px;
}

.postAction a:hover {
  background: var(--borderprofil);
  color: var(--biel);
}

.postAction check {
  margin-top: -5px;
}

.postAction a {
  display: flex;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--borderprofil);
  font-size: 0;
  font-weight: 100;
  text-decoration: none;
  transition: .3s;
}

.postAction a::before {
  font-family: "tabler-icons";
  font-size: 14px;
  line-height: 1;
}

.postAction.edit a::before { content: "\ee8b"; font-weight: 100; }
.postAction.quote a::before { content: "\efbe"; font-weight: 100; }
.postAction.delete a::before { content: "\eb55"; font-weight: 100; }
.postAction.link a::before { content: "\eade"; font-weight: 100; }



.threadReply {
  white-space: nowrap;
}

.nbPostInfo {
  display: contents;
  align-items: center;
}

.giftlo {
  width: 110px;
  height: 110px;
  object-fit: cover;
  border-radius: 100px;
}

.nbHeroInfo {
  position: absolute;
  bottom: 38px;
  left: 40px;
}

.nbHeroMenu {
  display: inline-grid;
  width: 200px;
  gap: 10px;
  justify-content: center;
  margin-top: 20px;
}

.nbHeroMenu a {
  display: block;
  box-sizing: border-box;
  width: 200px;
  padding: 5px;
  border: 1px solid var(--borderprofil);
  color: rgba(255, 255, 255, .65);
  font: 12px Instrument;
  letter-spacing: 1.8px;
  text-align: center;
  text-decoration: none;
  text-transform: lowercase;
  transition: .35s;
}

.nbHeroMenu a:hover {
  background: var(--borderprofil);
  transition: all .8s cubic-bezier(.22, .61, .36, 1);
}

.nbHover::before {
  position: absolute;
  top: 18px;
  right: 18px;
  bottom: 18px;
  left: 18px;
  content: "";
  border: 1px solid var(--borderprofil);
  pointer-events: none;
  transition: .4s;
}

.nbAvatar:hover .nbHover {
  opacity: 1;
}

.nbAvatar:hover .nbHover::before {
  top: 14px;
  right: 14px;
  bottom: 14px;
  left: 14px;
  border-color: var(--borderprofil);
}

.nbHeroOverlay {
  display: flex;
  height: 140px;
  padding: 20px;
  align-items: center;
	background: var(--tloprofil);
  justify-content: space-between;
}

.nbHeroName {
  position: relative;
  display: inline-block;
  font-family: Tabor;
  font-size: 40px !important;
  font-weight: normal !important;
  letter-spacing: 2px;
  line-height: 1;
  text-transform: none;
  transform: translateY(20px);
}

.nbHeroName::after {
  position: absolute;
  top: 50%;
  left: calc(100% + 25px);
  width: 500px;
  height: 1px;
  content: "";
  background: var(--borderszary);
  transform: translateY(-50%);
}

.nbHeroGroup {
  color: #b57b7b;
  letter-spacing: 4px;
  text-transform: uppercase;
}

.nbHeroTitle {
  position: relative;
  color: var(--biel);
  font-family: var(--kursywa);
  font-size: 17px;
  letter-spacing: 3px;
  text-align: left;
  text-transform: capitalize;
}

.nbHeroRight img {
  display: block;
  width: 85px;
  height: 85px;
  padding: 0;
  border: 0;
  filter: none;
  object-fit: cover;
}

.nbBody {
  display: grid;
  grid-template-columns: 260px 1fr;
}

.nbSidebar {
  padding: 30px;
  background: var(--gradient);
  border-right: 1px solid var(--borderprofil);
  border-top: 1px solid var(--borderprofil);
}

.nbAvatar {
  position: relative;
  width: 200px;
  height: 320px;
  box-sizing: border-box;
  border: 1px solid var(--borderprofil);
  overflow: hidden;
  transition: border-color .4s ease;
}

/* MyBB osadza avatar w .author_avatar > a > img. */
.nbAvatar > .author_avatar,
.nbAvatar > .author_avatar > a {
  display: block;
  width: 100%;
	opacity: 0.90;
  height: 100%;
}

/* Tylko główny avatar dostaje wymiary i animację. */
.nbAvatar > img,
.nbAvatar > a > img,
.nbAvatar > .author_avatar > a > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .45s ease;
}

.nbHover {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  padding: 15px;
  box-sizing: border-box;
  opacity: 0;
  background: rgba(15, 12, 10, .45);
  backdrop-filter: blur(10px) brightness(.5) contrast(1) grayscale(1);
  -webkit-backdrop-filter: blur(10px) brightness(.5) contrast(1) grayscale(1);
  filter: none !important;
  transition: .9s ease;
}

.nbAvatar:hover .nbHover {
  opacity: 1;
}

/* Nie używaj .nbAvatar:hover img — rozmywało to także rangę. */
.nbAvatar:hover > img,
.nbAvatar:hover > a > img,
.nbAvatar:hover > .author_avatar > a > img {
  transform: scale(1.08);
  filter: blur(3px) brightness(.45);
}

.nbContent {
  padding: 25px 35px 35px;
  border-top: 1px solid var(--borderprofil);
  background: var(--gradient);
}

.nbField {
  position: relative;
  z-index: 1;
  text-align: center;
}

.nbLabel {
  display: block;
  color: var(--bordojasne);
  font-family: var(--fontp);
  font-size: 12px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
	font-style: normal;
}

.nbValue {
  display: block;
  color: var(--biel);
  font: 12px var(--kursywa);
  font-style: normal;
  letter-spacing: 1.5px;
}

.nbQuote {
  margin-bottom: 25px;
  padding-bottom: 25px;
  border-bottom: 1px solid rgba(255, 255, 255, .05);
  color: #c7b1b1;
  font-style: italic;
  text-align: center;
}

.nbAuthorButtons,
.nbFooter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.nbAuthorButtons a,
.nbFooter a {
  display: flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #251b1b;
  transition: .3s;
}

.nbAuthorButtons a:hover,
.nbFooter a:hover {
  background: #7d4b4b;
  transform: translateY(-2px);
}

.nbMessage {
  min-height: 300px;
  font-family: var(--basic);
  font-size: 15px;
  line-height: 1.9;
	color: var(--biel);
	padding-top: 25px;
  text-align: justify;
	font-style: normal;
}

.nbFooter {
  padding: 20px 35px;
  border-top: 1px solid rgba(255, 255, 255, .05);
  background: #151212;
}

/* Wyrównanie podpisu i linii w nagłówku posta. */
.nbHeroTitle {
  margin: 7px 0 0;
  text-align: left;
}

.nbHeroNameRow {
  width: 100%;
}

.nbHeroName {
  flex: 0 0 auto;
}

.nbHeroLine {
  min-width: 0;
  flex: 1 1 auto;
}

/* Niezależnie od długości nazwiska linia kończy się 20 px przed avatarem. */
.giftlo {
  flex: 0 0 110px;
  margin-left: 20px;
}

/* Wspólny rytm pionowy nagłówków i zawartości na stronach forum. */
@media (hover:hover) and (pointer:fine) and (min-width:769px){
		#header .forum > center{
					margin:50px 0 40px!important;
	}
		#header .forum > center + .qeel{
					margin-top:0!important;
	}
		#header #content > .wrapper > center:has(+ .krMemberlistPage){
					margin:50px 0 0!important;
	}
		#header .krMemberlistPage{
					margin:40px 0 50px!important;
	}
		#header .krDirectory{
					margin:50px 0!important;
	}
		#header .krDirectoryHeading{
					margin-bottom:40px!important;
	}
}

/* Subtelniejszy odstęp po kategoriach i między nagłówkami sekcji. */
@media (hover:hover) and (pointer:fine) and (min-width:769px){
		#header .forum > center:first-child{
					margin:40px 0 30px!important;
	}
		#header .forum > center:not(:first-child){
					margin:25px 0 30px!important;
	}
		#header #content > .wrapper > center:has(+ .krMemberlistPage){
					margin-top:40px!important;
	}
		#header .krMemberlistPage{
					margin-top:30px!important;
					margin-bottom:40px!important;
	}
		#header .krDirectory{
					margin-top:40px!important;
					margin-bottom:40px!important;
	}
		#header .krDirectoryHeading{
					margin-bottom:30px!important;
	}
}

/* Nagłówki rozpoczynające kolejne grupy kategorii — bliżej poprzedniej sekcji. */
@media (hover:hover) and (pointer:fine) and (min-width:769px){
		#header .forum > center:not(:first-child){
					margin-top:20px!important;
	}
}

@media (hover:hover) and (pointer:fine) and (min-width:769px){
	#header .forum > center:not(:first-child){margin-top:10px!important;}
}
