/*
	Extra/Global stylesheet code!
	Anything that stays consistent no matter the theme used should be in here
*/


/* Global Values */

.oldpost {
	background: inherit;
	color: #f00000;
	font-weight: 700;
}

/* Emote Hover (needs to be reworked) */
a.emotetip {
    text-decoration: none;
}
a.emotetip:hover {
    cursor: auto;
    position: relative;
}
a.emotetip span {
    display: none
}
a.emotetip:hover span {
	color: #fff;
	border: #000 1px solid;
	border-radius: 5px;
	padding: 5px 5px 5px 5px;
	display: block;
	width: auto;
	background: #000 no-repeat;
	position: absolute;
	bottom: 35px;
    margin: auto;
	text-decoration: none
}

/* 
	This is used when an emoji is replaced by a twemoji using javascript
	This makes the emoji more visible and supported on more devices and browsers
	Tor for example doesn't support emojis at all
*/
.emoji {
	display: inline-block;
	position: relative;
	top: -1px;
	vertical-align: middle;
	max-width: 28px;
	max-height: 28px;
	height: auto;
	width: auto;
	filter: drop-shadow(0.5px 0 0 black) drop-shadow(0 0.5px 0 black) drop-shadow(-0.5px 0 0 black) drop-shadow(0 -0.5px 0 black);
}

/* 
	Rainbow /cow/ text 
*/
.cow {
    animation: rainbold 1s linear infinite;
    color: red;
    font-size: 2.0em;
/*  letter-spacing: 0.33em; */
    margin-left: 6px;
    text-shadow: -1px 0px orange, -2px 0px yellow, -3px 0px green, -4px 0px blue, -5px 0px indigo, -6px 0px violet;
}

@keyframes rainbold {
    0% { color: red; text-shadow: -1px 0px orange, -2px 0px yellow, -3px 0px green, -4px 0px blue, -5px 0px indigo, -6px 0px violet; }
  14% { color: orange; text-shadow: -1px 0px yellow, -2px 0px green, -3px 0px blue, -4px 0px indigo, -5px 0px violet, -6px 0px red; }
  28% { color: yellow; text-shadow: -1px 0px green, -2px 0px blue, -3px 0px indigo, -4px 0px violet, -5px 0px red, -6px 0px orange; }
  43% { color: green; text-shadow: -1px 0px blue, -2px 0px indigo, -3px 0px violet, -4px 0px red, -5px 0px orange, -6px 0px yellow; }
  57% { color: blue; text-shadow: -1px 0px indigo, -2px 0px violet, -3px 0px red, -4px 0px orange, -5px 0px yellow, -6px 0px green; }
  71% { color: indigo; text-shadow: -1px 0px violet, -2px 0px red, -3px 0px orange, -4px 0px yellow, -5px 0px green, -6px 0px blue; }
  85% { color: violet; text-shadow: -1px 0px red, -2px 0px orange, -3px 0px yellow, -4px 0px green, -5px 0px blue, -6px 0px indigo; }
 100% { color: red; text-shadow: -1px 0px orange, -2px 0px yellow, -3px 0px green, -4px 0px blue, -5px 0px indigo, -6px 0px violet; }
}

@-moz-keyframes rainbold {
    0% { color: red; text-shadow: -1px 0px orange, -2px 0px yellow, -3px 0px green, -4px 0px blue, -5px 0px indigo, -6px 0px violet; }
  14% { color: orange; text-shadow: -1px 0px yellow, -2px 0px green, -3px 0px blue, -4px 0px indigo, -5px 0px violet, -6px 0px red; }
  28% { color: yellow; text-shadow: -1px 0px green, -2px 0px blue, -3px 0px indigo, -4px 0px violet, -5px 0px red, -6px 0px orange; }
  43% { color: green; text-shadow: -1px 0px blue, -2px 0px indigo, -3px 0px violet, -4px 0px red, -5px 0px orange, -6px 0px yellow; }
  57% { color: blue; text-shadow: -1px 0px indigo, -2px 0px violet, -3px 0px red, -4px 0px orange, -5px 0px yellow, -6px 0px green; }
  71% { color: indigo; text-shadow: -1px 0px violet, -2px 0px red, -3px 0px orange, -4px 0px yellow, -5px 0px green, -6px 0px blue; }
  85% { color: violet; text-shadow: -1px 0px red, -2px 0px orange, -3px 0px yellow, -4px 0px green, -5px 0px blue, -6px 0px indigo; }
 100% { color: red; text-shadow: -1px 0px orange, -2px 0px yellow, -3px 0px green, -4px 0px blue, -5px 0px indigo, -6px 0px violet; }
}

@-webkit-keyframes rainbold {
    0% { color: red; text-shadow: -1px 0px orange, -2px 0px yellow, -3px 0px green, -4px 0px blue, -5px 0px indigo, -6px 0px violet; }
  14% { color: orange; text-shadow: -1px 0px yellow, -2px 0px green, -3px 0px blue, -4px 0px indigo, -5px 0px violet, -6px 0px red; }
  28% { color: yellow; text-shadow: -1px 0px green, -2px 0px blue, -3px 0px indigo, -4px 0px violet, -5px 0px red, -6px 0px orange; }
  43% { color: green; text-shadow: -1px 0px blue, -2px 0px indigo, -3px 0px violet, -4px 0px red, -5px 0px orange, -6px 0px yellow; }
  57% { color: blue; text-shadow: -1px 0px indigo, -2px 0px violet, -3px 0px red, -4px 0px orange, -5px 0px yellow, -6px 0px green; }
  71% { color: indigo; text-shadow: -1px 0px violet, -2px 0px red, -3px 0px orange, -4px 0px yellow, -5px 0px green, -6px 0px blue; }
  85% { color: violet; text-shadow: -1px 0px red, -2px 0px orange, -3px 0px yellow, -4px 0px green, -5px 0px blue, -6px 0px indigo; }
 100% { color: red; text-shadow: -1px 0px orange, -2px 0px yellow, -3px 0px green, -4px 0px blue, -5px 0px indigo, -6px 0px violet; }
}


/* 
	Regular rainbow text 
*/
.rainbow {
-webkit-animation:rainbow 1s infinite;
-ms-animation:rainbow 1s infinite;
-o-animation:rainbow 1s infinite;
animation:rainbow 1s infinite;
}
@-webkit-keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}
@-ms-keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}
@-o-keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}
@keyframes rainbow {
0% {color: #ff0000;}
10% {color: #ff8000;}
20% {color: #ffff00;}
30% {color: #80ff00;}
40% {color: #00ff00;}
50% {color: #00ff80;}
60% {color: #00ffff;}
70% {color: #0080ff;}
80% {color: #0000ff;}
90% {color: #8000ff;}
100% {color: #ff0080;}
}


/*
	hell rotate
*/
.hell {
	font-size:30px;
	color:red;
	white-space:pre;
	display:inline-block;
	-webkit-animation:hell 1s 2s infinite;
	animation:hell 2s infinite;
	width:8em;
}
@-webkit-keyframes hell {
0% {animation-timing-function: ease-in; transform: rotate( 0deg )}
10% {transform: rotate( -4deg )}
50% {transform: rotate( -8deg )}
100% {animation-timing-function: ease-out; transform: rotate( 1deg )}
}
@keyframes hell {
0% {animation-timing-function: ease-in; transform: rotate( 0deg )}
10% {transform: rotate( -4deg )}
50% {transform: rotate( -8deg )}
100% {animation-timing-function: ease-out; transform: rotate( 1deg )}
}

/* 
	Flashing Text
*/
.regflashtext {
	-webkit-animation-name: flashreg;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;

	-moz-animation-name: flashreg;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;

	animation-name: flashreg;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;

	color: inherit;
}

@-moz-keyframes flashreg {  
 0% { opacity: 1.0; }
 50% { opacity: 0.0; }
 100% { opacity: 1.0; }
}

@-webkit-keyframes flashreg {  
 0% { opacity: 1.0; }
 50% { opacity: 0.0; }
 100% { opacity: 1.0; }
}

@keyframes flashreg {  
 0% { opacity: 1.0; }
 50% { opacity: 0.0; }
 100% { opacity: 1.0; }
}

/* Rainbow 2 */
@keyframes rainbow2{0%{color:#f00;transform:scale(1) rotate(0deg)}16%{color:#ff0;transform:scale(1.3) rotate(22.5deg)}33%{color:#0f0;transform:scale(1.15) rotate(11.25deg)}50%{color:#0ff;transform:scale(1) rotate(0deg)}66%{color:#00f;transform:scale(1.3) rotate(-22.5deg)}83%{color:#f0f;transform:scale(1.15) rotate(-11.25deg)}100%{color:#f00;transform:scale(1) rotate(0deg)}}.rainbow2{font-weight:bolder;font-size:1.5rem;text-transform:uppercase;display:inline-block;text-shadow:0 2px 4px black;animation:rainbow2 1s infinite linear}


/* Red/Blue Text */

.redtext {
	color: darkred;
	font-size: 15pt;
	font-weight: 700;
}
.rquote {
	color: #E0727F;
}

div.closed {
	font-size:x-large;
	text-align:center;
	color:red;
	font-weight:700;
	padding-top:100px;
	padding-bottom:100px
}

/* 
	Global Theme CSS
*/

/* Files */

.fileText {
	max-width: 600px;
	white-space: nowrap;
}
.fileText a {
	text-decoration: underline;
}

.omiticon {
	margin-bottom: -3px;
	margin-right: 3px;
	margin-left: 2px;
}
.fileDeletedRes {
	height: 13px;
	width: 127px;
}
.deleted {
	cursor: not-allowed;
}

.postMenuBtn {
	margin-left: 5px;
	text-decoration: none;
	line-height: 1em;
	display: inline-block;
	-webkit-transition: -webkit-transform 0.1s;
	-moz-transition: -moz-transform 0.1s;
	transition: transform 0.1s;
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	width: 1em;
	height: 1em;
	text-align: center;
	outline: none;
	opacity: 0.8;
}
.postMenuBtn:hover {
	opacity: 1;
}
.menu.open hr {
	margin-top: 30px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid inherit;
    width:100%
}
a.menu.open {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}

input[type=checkbox] {
	position: relative;
}

.hide { display: none; }

.sage {
	color: #FF0000;
	font-weight: 700;
	cursor: help;
}

/* Optional get marker enabled by the `checkem` Options-field token.
   The renderer also applies the existing .sage class, preserving its placement,
   bold weight, and question-mark help cursor. */
.sage.checkem {
	font-weight: 700;
	cursor: help;
	white-space: nowrap;
}

.checkem-none,
.checkem-dubs {
	color: #FF0000;
}

.checkem-trips {
	color: #770099;
}

.checkem-rainbow-red    { color: #FF0000; }
.checkem-rainbow-orange { color: #FF8000; }
.checkem-rainbow-yellow { color: #C49A00; }
.checkem-rainbow-green  { color: #009933; }
.checkem-rainbow-blue   { color: #0066CC; }
.checkem-rainbow-violet { color: #770099; }

.checkem-ultra {
	background: linear-gradient(90deg, #ff0000, #ff8000, #ffff00, #00b050, #0080ff, #4b0082, #ee82ee, #ff0000);
	background-size: 300% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: #ff0000;
	animation: checkem-ultra-rainbow 2s linear infinite;
}

@keyframes checkem-ultra-rainbow {
	from { background-position: 0% 50%; }
	to   { background-position: 300% 50%; }
}

@media (prefers-reduced-motion: reduce) {
	.checkem-ultra {
		animation: none;
	}
}

div.post div.file {
	display: block;
}

div.post div.file div.fileInfo {
	margin-right: 10px;
  word-break: break-all;
}

div.replyContainer div.post div.file div.fileInfo {
	margin-left: 20px;
}

div.post div.file .fileThumb {
	float: left;
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 3px;
	margin-bottom: 5px;
}

span.fileThumb {
	margin-left: 0px !important;
	margin-right: 5px !important;
}

div.reply span.fileThumb, div.reply span.fileThumb img {
	float: none !important;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}

div.post div.file .fileThumb img {
	border: none;

	float: left;
}

/* Multi-image rendering: a post with 2+ attachments wraps its primary +
   extra file blocks in .fileMulti. Posts with a single (or no) attachment
   never get this wrapper, so their markup and appearance are unchanged from
   before this feature existed.
   Kept to ONE row on purpose (flex-wrap:nowrap + horizontal scroll instead
   of wrapping to a second line): wrapping packs shorter images from a later
   row up next to a taller image from an earlier row, producing an uneven
   "masonry" look. A single non-wrapping row with align-items:flex-start
   keeps every thumbnail's top edge on the same line regardless of its own
   height, and the row is allowed to run wider than the surrounding text
   column (scrolling if it must) rather than being squeezed to fit it. */
div.post div.fileMulti {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 8px;
	max-width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
}

div.post div.fileMulti div.fileMultiItem {
	flex: 0 0 auto;
}

div.post div.fileMulti div.fileMultiItem::after {
	content: "";
	display: table;
	clear: both;
}

div.post div.fileMulti div.fileMultiItem div.file {
	margin-left: 0;
}

div.post div.fileMulti div.fileMultiItem div.fileThumb {
	margin-left: 0;
}

/* Post-form multi-file upload UI: slot 1 (classic upfile) is always visible;
   slots 2..MAX_FILES_PER_POST are revealed one at a time via "+".
   Laid out as an explicit CSS grid -- postform.php gives every element its
   own grid-row/grid-column inline -- so columns line up in fixed tracks
   across every row no matter which rows are currently shown or hidden,
   instead of relying on flex-wrap (which breaks alignment as soon as one
   row's content is a different width than another's). */
div.fileSlots {
	display: grid;
	/* Column 1 (file input) is 230px, not a tighter value: a native
	   <input type=file>'s "No file chosen" status text is part of the
	   browser's own control rendering, not normal box content -- CSS width
	   doesn't reliably clip it, so a narrower column let that text overflow
	   into column 2, overlapping the spoiler checkbox.
	   Columns 3/4 (remove "x" / add "+") are fixed at 22px rather than
	   max-content: max-content shrinks to the width of a single narrow
	   glyph (~8px), leaving "x" and "+" almost touching with only the 8px
	   grid gap between them -- cramped and an easy mis-click target. */
	grid-template-columns: 230px max-content 22px 22px;
	/* Tightened from 8px so the spoiler checkbox and "+"/"x" sit closer to
	   the file input. column-gap is uniform across every column boundary,
	   so .fileSlotRemove/.fileSlotAdd add back a compensating margin-left
	   below -- keeping THEIR mutual spacing (and their distance from the
	   spoiler checkbox) comfortable while only the file-input gap shrinks. */
	column-gap: 3px;
	row-gap: 4px;
	align-items: center;
	max-width: 100%;
}

div.fileSlots .fileSlotInput {
	width: 230px;
}

div.fileSlots .fileSlotRemove {
	text-decoration: none;
	font-weight: bold;
	white-space: nowrap;
	margin-left: 5px;
}

div.fileSlots label.fileSlotSpoiler {
	font-size: 10px;
	white-space: nowrap;
}

div.fileSlots a.fileSlotAdd {
	font-weight: bold;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	margin-left: 5px;
}

textarea.paneltext {
	margin: 0px;
	margin-right: 2px;
	padding: 2px 4px 3px 4px;
	border: 1px solid #AAAAAA;
	width: 792px;
	outline: none;
	font-family: arial, helvetica, sans-serif;
	font-size: 10pt;
}

/* Limits text in file input. Width matches div.fileSlots .fileSlotInput
   (grid column 1) so slot 1 lines up with slots 2-4. */
#postFile {
  width: 230px;
}

/* Minor things */

div.delFrame {
	margin: 0.5em;
}

.containad {
    overflow: hidden;
	clear:both;
}​

/* Move board banners slightly upward without changing document flow. */
.boardBanner {
	position: relative;
	top: -6px;
}

.bannerImg {
	border: 1px solid #000;
}

.thread-stats {
	cursor: default;
}

.open-qr-wrap {
	float: center;
}

.cap.janitor {
	color: #4169E1;
}

.uflag {
	display: inline-block;
	position: relative;
	top: -1px;
	vertical-align: middle;
	/*
	display: inline-block;
	position: relative;
	height: auto;
	top: 2px;
	*/
}
.uflag:hover {
	opacity: 0.7;
	cursor: help;
}

.flag_preview {
	left: 7px;
}

.tag {
	display: inline-block;
	position: relative;
	top: -1px;
	vertical-align: middle;
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	padding: 2px 8px;
	border-radius: 10px;
	margin-right: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	/* Always show selection cursor and make it so text can't be selected */
	cursor: pointer;
	user-select: none
}
.tag:hover{ opacity:.85 }
.tag:active{transform:scale(.95)}

/* Collapsed post area */
#PostAreaToggle, p.ToggleFormButton {
	font-size: 22px;
	font-weight: bold;
	margin: 6.66667px 0 !important;
	padding: 0
}
#PostAreaToggle, .togrules {
	text-align: left;
	position: static;
	max-width: 30%;
	font-size:11px;
	content:"\2022 \20"
}
hr.PostAreahr {
	width: 40%
}
#PostAreaToggle + span > p > a > label {
	cursor: pointer
}
#PostAreaToggle + span + div {
	display: none
}
#PostAreaToggle:checked + span {
	display: none
}
#PostAreaToggle:checked + span + div {
	display: inline-block
}
.hidden {
	display:none
}
.mobile {
	display: none;
}
.menu.gen {
  min-width: 80px;
  max-width: 100px;
  white-space: nowrap;
}
/* Tripcode inside capcode - inherit capcode color and match weight */
.cap .postertrip {
    color: inherit !important;
    font-weight: normal !important;
}
/* Ensure cap spans have consistent font-weight */
.cap {
    font-weight: bold;
}
/* Cap-specific colors (already in main CSS, but ensure consistency) */
.cap.admin { color: #FF101A; }
.cap.moderator { color: #709; }
.cap.manager { color: #FF0080; }
.cap.dev { color: #0000ed; }
.cap.janitor { color: #4169E1; }
/* Blotter Styling */
#blotter, #blotter * {
    font-size: 11px !important;
}
#blotter {
    width: 468px;
    margin: 2px auto 0 auto;
    border-collapse: collapse;
    line-height: 1.2;
}
#blotter td {
    vertical-align: top;
    padding: 0 2px;
}
.blotter-date {
    width: 1%;
    padding-right: 8px !important;
    white-space: nowrap;
    font-weight: normal;
}
.blotter-content {
    padding-left: 0 !important;
    text-align: left;
}
#blotter tfoot {
    text-align: right;
}
#blotter tfoot td {
    padding-top: 0px; padding-bottom: 2px;
}
#blotter hr {
    border: none;
    border-top: 1px solid;
    margin: 2px 0;
    opacity: 0.3;
}
/* Hide and Show All share theme colors; suppress only the hover underline. */
#blotter tfoot a:hover {
    text-decoration: none !important;
}




/* Added by Manus for text formatting */


.greentext { color: #789922 !important; background: none !important; }
.pinktext { color: #ff00ee !important; }
.bluetext { color: #00f !important; background: none !important; padding: 0 !important; }


/* Additional capcode styles for extension.js compatibility */
.capcodeJanitor .name, .capcodeJanitor .name a, .capcodeJanitor .postertrip, .capcodeJanitor strong.capcode {
}

/* Additional capcode styles for extension.js compatibility */
.capcodeJanitor .name, .capcodeJanitor .name a, .capcodeJanitor .postertrip, .capcodeJanitor strong.capcode {
}

/* Additional capcode styles for extension.js compatibility */
.capcodeJanitor .name, .capcodeJanitor .name a, .capcodeJanitor .postertrip, .capcodeJanitor strong.capcode {
    color: #4169E1 !important;
}
.id_janitor { color: #4169E1 !important; }

/* Fix blurry capcode icons */
.identityIcon {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
    height: 16px !important;
    width: 16px !important;
}

@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.identityIcon[src*="icon-admin.gif"]{content:url("/global/imgs/logo/icon-admin@2x.gif")}.identityIcon[src*="icon-moderator.gif"]{content:url("/global/imgs/logo/icon-moderator@2x.gif")}.identityIcon[src*="icon-developer.gif"]{content:url("/global/imgs/logo/icon-developer@2x.gif")}.identityIcon[src*="icon-manager.gif"]{content:url("/global/imgs/logo/icon-manager@2x.gif")}.identityIcon[src*="icon-janny.gif"]{content:url("/global/imgs/logo/icon-janny@2x.gif")}}
.capIcon {
	image-rendering: pixelated;
	image-rendering: -moz-crisp-edges;
	image-rendering: crisp-edges;
	margin-bottom: -3px;
	width: 16px;
	height: 16px;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.capIcon[src*="icon-admin.gif"] { content: url("/global/imgs/logo/icon-admin@2x.gif"); }
	.capIcon[src*="icon-moderator.gif"] { content: url("/global/imgs/logo/icon-moderator@2x.gif"); }
	.capIcon[src*="icon-developer.gif"] { content: url("/global/imgs/logo/icon-developer@2x.gif"); }
	.capIcon[src*="icon-manager.gif"] { content: url("/global/imgs/logo/icon-manager@2x.gif"); }
	.capIcon[src*="icon-janny.gif"] { content: url("/global/imgs/logo/icon-janny@2x.gif"); }
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.capIcon[src*="icon-admin.gif"] { content: url("/global/imgs/logo/icon-admin@2x.gif"); }
	.capIcon[src*="icon-moderator.gif"] { content: url("/global/imgs/logo/icon-moderator@2x.gif"); }
	.capIcon[src*="icon-developer.gif"] { content: url("/global/imgs/logo/icon-developer@2x.gif"); }
	.capIcon[src*="icon-manager.gif"] { content: url("/global/imgs/logo/icon-manager@2x.gif"); }
	.capIcon[src*="icon-janny.gif"] { content: url("/global/imgs/logo/icon-janny@2x.gif"); }
}

/* Bottom board controls: pagination/catalog left, delete/style settings right. */
@media (min-width: 700px) {
    .afterPosts > .delsettings {
        float: right;
        width: auto;
        margin-left: 12px;
        white-space: nowrap;
        text-align: right;
    }

    .afterPosts > .pagelist {
        float: left;
        margin-right: 12px;
    }
}


.afterPosts .boardlist {
    display: block;
    margin-top: -3px;
}



/* Pagination catalog divider: mirrors the separate catalog-link treatment used by 4chan. */
.pagelist.pages td.pagination-cataloglink {
    border-left: 1px solid #d2b9a4 !important;
    padding-left: 12px !important;
    white-space: nowrap;
}
.pagelist.pages td.pagination-toplink,
.pagelist.pages td.pagination-cataloglink {
    padding-top: 2px;
    padding-bottom: 2px;
}

/* Tiny alignment adjustment: keep Delete Post/Style level with pagination. */
.delsettings {
    position: relative;
    top: 2px;
}
.latest-world2swagg-wrap { margin-top: 10px; }
.latest-world2swagg-box { border: 1px solid #d8a787; background: #fff; font-size: 0.86em; }
.latest-world2swagg-header { background: #eb9; color: #000; font-weight: bold; text-align: center; padding: 6px 4px; }
.latest-world2swagg-content { padding: 5px 8px; }
.latest-world2swagg-item { margin: 0 0 5px; line-height: 1.15; }
.latest-world2swagg-item:last-child { margin-bottom: 0; }
.latest-world2swagg-empty { color: #666; padding: 3px 0; }


/* Board banner feature hitbox */
#board-banner-feature {
  text-align: center;
}
#board-banner-feature > a {
  display: inline-block;
  width: 468px;
  max-width: 100%;
  line-height: 0;
  vertical-align: top;
}
#board-banner-feature > a > img {
  display: block;
  width: 468px;
  height: 60px;
  max-width: 100%;
}

/* Targeted thumbnail hitbox fix: only the rendered image is clickable. */
div.fileThumb > a.fileThumb {
    display: block;
    float: none;
    margin: 0;
    padding: 0;
}
div.fileThumb > a.fileThumb > img.opimg,
div.fileThumb > a.fileThumb > img.postimg {
    display: block;
    float: none;
    border: 0;
    margin: 0;
    padding: 0;
}

/* Imageboard thumbnail spacing: only the image itself is clickable. */
div.fileThumb {
    padding: 0 8px 2pt;
}
div.fileThumb > a.fileThumb {
    display: inline-block;
    margin: 0;
    padding: 0;
    line-height: 0;
}
div.fileThumb > a.fileThumb > img.opimg,
div.fileThumb > a.fileThumb > img.postimg {
    display: block;
    float: none;
    margin: 0;
    padding: 0;
    border: 0;
}

/* Swaggsuba random forum flair. Character flags sit after existing name markers
   without contributing layout width; platform flags reserve reply bottom space. */
.characterFlag {
    display: inline !important;
    position: static !important;
    width: auto !important;
    height: 30px !important;
    max-width: none !important;
    max-height: none !important;
    margin-top: -4em !important;
    transform: translateY(0.5em) !important;
    vertical-align: baseline !important;
    object-fit: fill !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    float: none !important;
    pointer-events: none;
}
.post.reply.hasPlatformFlag {
    position: relative !important;
}
.post.reply.hasPlatformFlag > .platformFlag,
.post.reply.hasPlatformFlag .platformFlag {
    display: block !important;
    position: absolute !important;
    right: 4px !important;
    bottom: 4px !important;
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    float: none !important;
    pointer-events: none;
}

/* Thread-page-only alignment: lower the bottom board list without changing pagination. */
.threadpage .afterPosts .boardlist {
    margin-top: 0;
}

/* 4chan-compatible quote previews: the native engine clones .post and adds .preview. */
.post.preview {
  background: var(--reply-bg, #D6DAF0) !important;
  border: 1px solid #b7c5d9 !important;
  color: inherit !important;
  padding: 2px !important;
  z-index: 1000;
}
/* Thread likes must remain sized and legible when JavaScript is disabled. */
.threadLike {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  padding: 0 2px;
  margin-left: 3px;
  background: transparent;
  cursor: pointer;
  vertical-align: middle;
  position: relative;
  top: -1px;
}
.threadLikeIcon {
  display: block;
  width: 18px !important;
  height: 16px !important;
  object-fit: contain;
}
.threadLikeCount {
  display: inline-block;
  margin-left: 2px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 700;
  color: #888;
  vertical-align: middle;
  position: relative;
  top: -1px;
}
.threadLikeCount.is-liked { color: #4866a3; }
.threadLike:focus-visible { outline: 1px dotted currentColor; }
.threadLike.is-busy { opacity: .55; cursor: wait; }